/* Wallpaper sits behind a separate, fully opaque product image layer. */
.product-image,.catalog-grid .product-image{background:#edf3fb url("assets/urun-wallpaper.webp") center/cover no-repeat;isolation:isolate}
.product-image img,.catalog-grid .product-image img{position:absolute;inset:20px;width:calc(100% - 40px);height:calc(100% - 40px);object-fit:contain;padding:10px;background:#fff;border-radius:5px;box-shadow:0 4px 18px #071e3509;z-index:1;mix-blend-mode:normal;opacity:1;filter:none}
.product-image>span{z-index:2;top:13px;left:13px;background:#ffffffed;box-shadow:0 2px 8px #071e3506}
.catalog-grid .product-image{aspect-ratio:1.12}
.catalog-grid .product-body{border-top:1px solid #e4ebf1}
.variants table th,.variants table td{text-align:left!important;font-weight:500}
.variants th{color:var(--muted)}

/* Quiet navy headers with photography behind the page copy. */
.page-intro--navy{background:#071e35;color:#fff;isolation:isolate;border-bottom:1px solid #193d5e}
.page-intro--navy>.intro-visual{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.page-intro--navy .intro-visual>img{width:100%;height:100%;object-fit:cover;object-position:70% 48%;opacity:.24;filter:saturate(.55);transform:scale(1.02);animation:navy-image-in 1.2s var(--ease) both}
.page-intro--navy::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#071e35 0%,#071e35de 25%,#071e3585 60%,#071e3525 100%);pointer-events:none}
.page-intro--navy>.container{min-height:340px;display:flex;align-items:center;padding-block:29px 48px;position:relative;z-index:2}
.page-intro--navy .intro-content{max-width:660px}
.page-intro--navy .breadcrumb{color:#aec4d9;margin-bottom:30px}
.page-intro--navy .eyebrow{color:#9bcaff;font-size:10px;margin-bottom:17px}
.page-intro--navy h1{color:#fff;font-size:48px;line-height:1.15;letter-spacing:-.035em;margin-bottom:19px}
.page-intro--navy p{color:#cfdeeb;font-size:14px;line-height:1.9;max-width:580px}
@keyframes navy-image-in{from{opacity:0;transform:scale(1.05)}to{opacity:.24;transform:scale(1.02)}}

/* Simple carousel controls; no numbered navigation or progress counter. */
.hero-layout{padding-bottom:48px}
.hero-controls{justify-content:flex-end;bottom:24px;pointer-events:none}
.hero-controls .slide-arrows{pointer-events:auto;gap:9px}
.hero-controls .icon-button{background:#071e3555;backdrop-filter:blur(8px)}
.hero-slide--installation .hero-media{left:33%}
.hero-slide--installation .hero-media img{object-position:72% center;filter:saturate(.88)}
.hero-copy{max-width:650px}
.hero-copy>p{max-width:425px}
.about-image>img[src*="muhendislik"]{object-fit:contain;background:#edf2f6}

@media(max-width:1000px){
 .page-intro--navy>.container{min-height:315px}
 .page-intro--navy h1{font-size:42px}
 .hero-slide--installation .hero-media{left:25%}
}
@media(max-width:700px){
 .page-intro--navy>.container{min-height:300px;padding-block:24px 38px}
 .page-intro--navy .intro-content{width:100%}
 .page-intro--navy h1{font-size:36px;line-height:1.17;margin-bottom:17px}
 .page-intro--navy .breadcrumb{margin-bottom:24px}
 .page-intro--navy p{font-size:12px;line-height:1.85;max-width:360px}
 .page-intro--navy .intro-visual>img{object-position:70% center;opacity:.19}
 .page-intro--navy::after{background:linear-gradient(90deg,#071e35d9,#071e35a6)}
 .hero{height:665px}
 .hero-layout{padding-bottom:70px}
 .hero-copy{padding-top:0}
 .hero-copy>.eyebrow{max-width:330px;line-height:1.8;font-size:9px}
 .hero-copy h1,.hero-copy h2{font-size:44px}
 .hero-copy>p{max-width:360px;font-size:14px}
 .hero-slide--installation .hero-media{left:0}
 .hero-slide--installation .hero-media img{object-position:72% center;opacity:.63}
 .hero-slide[data-scene="seviye"] .hero-media img{object-position:92% center}
 .hero-slide[data-scene="raporlama"] .hero-media img{object-position:90% center}
 .hero-slide[data-scene="debimetre"] .hero-media img{object-position:82% center}
 .hero-slide[data-scene="sulama"] .hero-media img{object-position:85% center}
 .hero-controls{display:flex;bottom:20px}
 .hero-controls .icon-button{width:35px;height:35px}
 .catalog-grid .product-image{aspect-ratio:1.14}
 .product-image img,.catalog-grid .product-image img{inset:18px;width:calc(100% - 36px);height:calc(100% - 36px);padding:8px}
 .about-image>img[src*="muhendislik"]{height:auto;aspect-ratio:4/3}
}
@media(max-width:370px){
 .hero{height:675px}
 .hero-copy h1,.hero-copy h2{font-size:39px}
 .page-intro--navy h1{font-size:31px}
}
@media(prefers-reduced-motion:reduce){.page-intro--navy .intro-visual>img{animation:none}}