/* ============================================================
   SADIKLAR — Kurumsal Web Sitesi
   112 Dijital · main.css
   1. Tokens        6. Butonlar        11. Ürün katalog
   2. Reset/Base    7. Hero + Parallax 12. Ürün detay
   3. Tipografi     8. Reveal/Efekt    13. İletişim
   4. Layout        9. Bölümler        14. Footer
   5. Header/Nav   10. Sayfa hero     15. Responsive / a11y
   ============================================================ */

/* ---------- 1. TOKENS ---------- */
:root{
  --abyss:#03121c;
  --deep:#062131;
  --sea:#0a3247;
  --surf:#12556f;
  --foam:#4ecdc9;
  --foam-2:#8fe9de;
  --amber:#dda64f;
  --amber-2:#f0c987;
  --sand:#f2ece2;
  --ice:#f7fafb;
  --paper:#ffffff;
  --ink:#07151d;
  --ink-2:#1b3542;
  --muted:#5f7885;
  --line:#dde6e9;
  --line-dark:rgba(255,255,255,.12);

  --ff-display:"Fraunces",'Times New Roman',serif;
  --ff-body:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

  --step--1:clamp(.78rem,.75rem + .15vw,.86rem);
  --step-0:clamp(.95rem,.9rem + .25vw,1.06rem);
  --step-1:clamp(1.1rem,1rem + .5vw,1.3rem);
  --step-2:clamp(1.4rem,1.2rem + 1vw,1.9rem);
  --step-3:clamp(1.9rem,1.5rem + 2vw,3rem);
  --step-4:clamp(2.4rem,1.7rem + 3.4vw,4.6rem);
  --step-5:clamp(2.7rem,1.5rem + 5vw,6.4rem);

  --wrap:1240px;
  --gut:clamp(1.15rem,4vw,3rem);
  --sec:clamp(4.5rem,9vw,9rem);
  --r:18px;
  --r-lg:28px;

  --ease:cubic-bezier(.22,1,.36,1);
  --ease-io:cubic-bezier(.65,.05,.36,1);
  --shadow:0 24px 60px -28px rgba(6,33,49,.4);
  --shadow-lg:0 46px 110px -40px rgba(6,33,49,.55);
  --header-h:78px;
}
/* ---------- 2. RESET / BASE ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 20px)}
body{
  font-family:var(--ff-body);
  font-size:var(--step-0);
  line-height:1.68;
  color:var(--ink-2);
  background:var(--ice);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,picture,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
ul,ol{list-style:none;padding:0}
::selection{background:var(--foam);color:var(--abyss)}

/* film grain */
body::after{
  content:"";position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.045;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* okuma ilerleme çubuğu */
.progress{
  position:fixed;top:0;left:0;height:3px;width:100%;z-index:9999;
  transform-origin:0 50%;transform:scaleX(var(--sp,0));
  background:linear-gradient(90deg,var(--foam),var(--amber));
  transition:opacity .3s;
}

/* ---------- 3. TİPOGRAFİ ---------- */
h1,h2,h3,h4{
  font-family:var(--ff-display);
  font-weight:400;
  line-height:1.06;
  letter-spacing:-.022em;
  color:var(--ink);
  font-variation-settings:"opsz" 40;
  text-wrap:balance;
}
h1{font-size:var(--step-4)}
h2{font-size:var(--step-3)}
h3{font-size:var(--step-2);line-height:1.14}
h4{font-size:var(--step-1);line-height:1.3;letter-spacing:-.01em}
p{text-wrap:pretty}
.lead{font-size:var(--step-1);line-height:1.6;color:var(--ink-2)}
.eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--ff-body);font-size:var(--step--1);font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--surf);
}
.eyebrow::before{
  content:"";width:34px;height:1px;background:currentColor;opacity:.55;
}
.on-dark .eyebrow,.dark .eyebrow{color:var(--foam)}
.serif-i{font-style:italic;font-variation-settings:"opsz" 60}
.num{font-variant-numeric:tabular-nums;letter-spacing:-.03em}

/* ---------- 4. LAYOUT ---------- */
.wrap{width:min(100% - var(--gut)*2,var(--wrap));margin-inline:auto}
.wrap-wide{width:min(100% - var(--gut)*2,1520px);margin-inline:auto}
.section{padding-block:var(--sec);position:relative}
.grid{display:grid;gap:clamp(1.4rem,3vw,2.6rem)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.stack>*+*{margin-top:1.1rem}
.center{text-align:center}
.center .eyebrow::before{display:none}
.sec-head{max-width:66ch}
.sec-head.center{margin-inline:auto}
.sec-head .eyebrow{margin-bottom:1.1rem}
.sec-head p{margin-top:1.2rem;color:var(--muted);font-size:var(--step-1);line-height:1.6}
.dark{background:var(--abyss);color:#c6d8e0}
.dark h1,.dark h2,.dark h3,.dark h4{color:#fff}
.dark p{color:rgba(214,231,238,.78)}

/* ---------- 5. HEADER / NAV ---------- */
.header{
  position:fixed;inset:0 0 auto 0;z-index:900;
  height:var(--header-h);display:flex;align-items:center;
  transition:height .45s var(--ease),background .45s var(--ease),box-shadow .45s var(--ease);
}
.header::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to bottom,rgba(3,18,28,.78),rgba(3,18,28,0));
  opacity:1;transition:opacity .4s var(--ease);
}
.header.is-stuck{
  height:66px;
  background:rgba(255,255,255,.82);
  -webkit-backdrop-filter:saturate(180%) blur(18px);
  backdrop-filter:saturate(180%) blur(18px);
  box-shadow:0 1px 0 rgba(8,30,42,.09),0 18px 40px -32px rgba(6,33,49,.5);
}
.header.is-stuck::before{opacity:0}
.header__in{width:min(100% - var(--gut)*2,1520px);margin-inline:auto;display:flex;align-items:center;gap:2rem}
.brand{display:flex;align-items:center;gap:.8rem;margin-right:auto;flex-shrink:0}
.brand img{height:38px;width:auto;transition:height .45s var(--ease),filter .45s var(--ease)}
.header:not(.is-stuck) .brand img{filter:brightness(0) invert(1)}
.header.is-stuck .brand img{height:32px}

.nav{display:flex;align-items:center;gap:clamp(1rem,2vw,2.1rem)}
.nav a{
  position:relative;font-size:.94rem;font-weight:600;letter-spacing:.005em;
  color:#fff;padding-block:.4rem;transition:color .3s;
}
.header.is-stuck .nav a{color:var(--ink-2)}
.nav a::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;
  background:var(--foam);transform:scaleX(0);transform-origin:100% 50%;
  transition:transform .45s var(--ease);
}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:0 50%}
.nav a[aria-current="page"]{color:var(--foam)}
.header.is-stuck .nav a[aria-current="page"]{color:var(--surf)}
.header.is-stuck .nav a[aria-current="page"]::after{background:var(--surf)}

.header__act{display:flex;align-items:center;gap:.75rem}
.lang{
  display:inline-flex;align-items:center;gap:.45rem;font-size:.8rem;font-weight:800;
  letter-spacing:.1em;padding:.42rem .8rem;border-radius:99px;cursor:pointer;background:transparent;
  border:1px solid rgba(255,255,255,.3);color:#fff;transition:.3s var(--ease);
}
.lang svg{width:15px;height:15px;flex:none}
.langdd{position:relative}
.langdd__chev{width:12px!important;height:12px!important;transition:transform .35s var(--ease)}
.langdd.is-open .langdd__chev{transform:rotate(180deg)}
.langdd__menu{
  position:absolute;right:0;top:calc(100% + .65rem);min-width:172px;z-index:60;
  padding:.45rem;border-radius:16px;list-style:none;margin:0;
  background:rgba(6,33,49,.92);border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:saturate(160%) blur(18px);backdrop-filter:saturate(160%) blur(18px);
  box-shadow:0 26px 60px -24px rgba(3,18,28,.75);
  opacity:0;transform:translateY(-8px) scale(.97);transform-origin:100% 0;
  pointer-events:none;transition:opacity .35s var(--ease),transform .35s var(--ease);
}
.langdd.is-open .langdd__menu{opacity:1;transform:none;pointer-events:auto}
.langdd__menu a{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.6rem .85rem;border-radius:10px;font-size:.88rem;font-weight:600;color:#e8f4f6;
  transition:.25s var(--ease);
}
.langdd__menu a:hover{background:rgba(78,205,201,.14);color:var(--foam-2)}
.langdd__menu a[aria-current="true"]{color:var(--foam)}
.langdd__menu a svg{width:14px;height:14px;flex:none}
.header.is-stuck .langdd__menu{
  background:rgba(255,255,255,.94);border-color:var(--line);
  box-shadow:0 26px 60px -28px rgba(6,33,49,.35);
}
.header.is-stuck .langdd__menu a{color:var(--ink-2)}
.header.is-stuck .langdd__menu a:hover{background:rgba(18,85,111,.08);color:var(--surf)}
.header.is-stuck .langdd__menu a[aria-current="true"]{color:var(--surf)}
.lang:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5)}
.header.is-stuck .lang{border-color:var(--line);color:var(--ink-2)}
.header.is-stuck .lang:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

.burger{display:none;width:44px;height:44px;border:0;background:transparent;cursor:pointer;position:relative}
.burger span{position:absolute;left:11px;width:22px;height:2px;background:#fff;border-radius:2px;transition:.4s var(--ease)}
.burger span:nth-child(1){top:17px}
.burger span:nth-child(2){top:23px}
.burger span:nth-child(3){top:29px;width:14px}
.header.is-stuck .burger span{background:var(--ink)}
.burger.is-open span:nth-child(1){top:23px;transform:rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:0}
.burger.is-open span:nth-child(3){top:23px;width:22px;transform:rotate(-45deg)}

.drawer{
  position:fixed;inset:0;z-index:899;background:var(--abyss);
  display:grid;place-items:center;
  clip-path:circle(0% at calc(100% - 44px) 40px);
  transition:clip-path .8s var(--ease);
  visibility:hidden;
}
.drawer.is-open{clip-path:circle(150% at calc(100% - 44px) 40px);visibility:visible}
.drawer nav{display:grid;gap:.4rem;text-align:center}
.drawer a{
  font-family:var(--ff-display);font-size:clamp(2rem,9vw,3.4rem);color:#fff;
  opacity:0;transform:translateY(24px);transition:.6s var(--ease);
}
.drawer.is-open a{opacity:1;transform:none}
.drawer.is-open a:nth-child(1){transition-delay:.18s}
.drawer.is-open a:nth-child(2){transition-delay:.26s}
.drawer.is-open a:nth-child(3){transition-delay:.34s}
.drawer.is-open a:nth-child(4){transition-delay:.42s}
.drawer__foot{position:absolute;bottom:8vh;left:0;right:0;text-align:center;color:rgba(198,216,224,.7);font-size:.9rem}
.drawer__foot a{font-family:var(--ff-body);font-size:1rem;color:var(--foam);opacity:1;transform:none}

/* ---------- 6. BUTONLAR ---------- */
.btn{
  --bg:var(--ink);--fg:#fff;
  position:relative;isolation:isolate;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:.65rem;
  padding:1rem 1.9rem;border:0;border-radius:99px;cursor:pointer;
  font-size:.94rem;font-weight:700;letter-spacing:.005em;
  background:var(--bg);color:var(--fg);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),color .35s;
  box-shadow:0 12px 30px -18px rgba(6,33,49,.9);
}
.btn::before{
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;
  background:var(--foam);transform:translateY(102%);
  transition:transform .55s var(--ease);
}
.btn:hover{transform:translateY(-3px);box-shadow:0 22px 44px -20px rgba(6,33,49,.65)}
.btn:hover::before{transform:translateY(0)}
.btn:hover{color:var(--abyss)}
.btn svg{width:17px;height:17px;flex:none;transition:transform .5s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn--ghost{--bg:transparent;--fg:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--foam)}
.btn--light{--bg:#fff;--fg:var(--ink)}
.btn--line-light{--bg:transparent;--fg:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.32)}
.btn--line-light:hover{color:var(--abyss);box-shadow:inset 0 0 0 1.5px var(--foam)}
.btn--amber::before{background:var(--amber-2)}
.link-arrow{
  display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.94rem;
  color:var(--surf);position:relative;padding-bottom:3px;
}
.link-arrow::after{content:"";position:absolute;left:0;bottom:0;height:1.5px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:100% 50%;transition:transform .5s var(--ease)}
.link-arrow:hover::after{transform:scaleX(1);transform-origin:0 50%}
.link-arrow svg{width:15px;height:15px;transition:transform .45s var(--ease)}
.link-arrow:hover svg{transform:translateX(4px)}

/* ---------- 7. HERO + PARALLAX ---------- */
.hero{
  position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;
  overflow:hidden;background:var(--abyss);isolation:isolate;
  padding-block:calc(var(--header-h) + clamp(1.6rem,4vh,3rem)) clamp(3.6rem,8vh,5.4rem);
}
.hero__layers{position:absolute;inset:-8% 0 -14%;z-index:-3}
.hero__photo{
  position:absolute;inset:0;
  background:url("../img/kurumsal/hero-dalgic.jpg") center/cover no-repeat;
  transform:translate3d(0,var(--py1,0px),0) scale(1.18);
  will-change:transform;
  filter:saturate(1.05) contrast(1.05);
}
.hero__tint{
  position:absolute;inset:0;
  background:
    linear-gradient(100deg,rgba(3,18,28,.9) 0%,rgba(3,18,28,.62) 34%,rgba(3,18,28,.14) 62%,transparent 82%),
    radial-gradient(120% 90% at 20% 15%,rgba(18,85,111,.18),transparent 60%),
    linear-gradient(180deg,rgba(3,18,28,.7) 0%,rgba(3,18,28,.34) 34%,rgba(3,18,28,.84) 78%,var(--abyss) 100%);
}
/* slayt vitrini (Ken Burns) */
.hero__slides{position:absolute;inset:0;transform:translate3d(0,var(--py1,0px),0);will-change:transform}
.hs{position:absolute;inset:0;opacity:0;transition:opacity 1.5s var(--ease-io);}
.hs.is-on{opacity:1}
.hs img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);filter:saturate(1.04) contrast(1.04)}
.js .hs.is-on img{animation:kenburns 8.5s linear forwards}
@keyframes kenburns{
  0%{transform:scale(1.1) translate3d(0,0,0)}
  100%{transform:scale(1.22) translate3d(-1.2%,-1.6%,0)}
}
.hero--slides .hero__caustics{opacity:.3}
.hero--slides .hero__rays{opacity:.18}

/* slayt noktaları */
.hero__dots{
  position:absolute;right:clamp(1rem,3vw,2.4rem);top:50%;transform:translateY(-50%);z-index:5;
  display:grid;gap:1.1rem;justify-items:end;
}
.hd{
  display:flex;align-items:center;gap:.7rem;flex-direction:row-reverse;
  background:transparent;border:0;cursor:pointer;padding:0;color:#fff;
}
.hd i{
  width:11px;height:11px;border-radius:50%;flex:none;
  border:1.5px solid rgba(255,255,255,.55);background:transparent;
  transition:.4s var(--ease);
}
.hd:hover i{border-color:var(--foam)}
.hd.is-on i{background:var(--foam);border-color:var(--foam);box-shadow:0 0 0 4px rgba(78,205,201,.22)}
.hd span{
  font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(232,246,248,.85);white-space:nowrap;
  opacity:0;transform:translateX(8px);transition:.45s var(--ease);pointer-events:none;
  text-shadow:0 1px 8px rgba(3,18,28,.8);
}
.hd.is-on span,.hd:hover span{opacity:1;transform:none}

/* su altı ışık dalgaları */
.hero__caustics{
  position:absolute;inset:-20%;mix-blend-mode:soft-light;opacity:.55;
  background:
    radial-gradient(38% 24% at 22% 18%,rgba(180,255,248,.55),transparent 70%),
    radial-gradient(30% 20% at 72% 32%,rgba(150,230,255,.42),transparent 70%),
    radial-gradient(46% 26% at 48% 72%,rgba(120,215,225,.32),transparent 70%);
  animation:caustics 18s ease-in-out infinite alternate;
  transform:translate3d(0,var(--py2,0px),0);
}
@keyframes caustics{
  0%{transform:translate3d(0,var(--py2,0px),0) scale(1) rotate(0deg)}
  50%{transform:translate3d(2%,calc(var(--py2,0px) - 10px),0) scale(1.12) rotate(3deg)}
  100%{transform:translate3d(-2%,var(--py2,0px),0) scale(1.05) rotate(-2deg)}
}
/* yüzeyden inen ışık huzmeleri */
.hero__rays{
  position:absolute;inset:-30% -10% 0;opacity:.3;mix-blend-mode:screen;
  background:repeating-linear-gradient(104deg,
    rgba(190,245,255,0) 0 34px,
    rgba(190,245,255,.13) 34px 46px,
    rgba(190,245,255,0) 46px 96px);
  filter:blur(6px);
  animation:rays 22s linear infinite;
  transform:translate3d(0,var(--py3,0px),0);
}
@keyframes rays{
  0%{background-position:0 0}
  100%{background-position:297px 0}
}
/* kabarcıklar */
.bubbles{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-2}
.bubbles i{
  position:absolute;bottom:-12vh;border-radius:50%;
  background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.85),rgba(190,240,255,.12) 58%,rgba(190,240,255,0) 70%);
  box-shadow:inset 0 0 6px rgba(255,255,255,.35);
  animation:rise linear infinite;
  opacity:0;
}
@keyframes rise{
  0%{transform:translate3d(0,0,0) scale(.7);opacity:0}
  8%{opacity:.75}
  70%{opacity:.5}
  100%{transform:translate3d(var(--dx,20px),-118vh,0) scale(1.15);opacity:0}
}
.hero__grid{
  position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.28;
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:96px 96px;
  -webkit-mask-image:radial-gradient(80% 60% at 50% 40%,#000,transparent 78%);
  mask-image:radial-gradient(80% 60% at 50% 40%,#000,transparent 78%);
}

.hero__in{width:min(100% - var(--gut)*2,1520px);margin-inline:auto;position:relative}
.hero__badge{
  display:inline-flex;align-items:center;gap:.6rem;margin-bottom:1.6rem;
  padding:.5rem .95rem .5rem .55rem;border-radius:99px;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#e8f6f8;
}
.hero__badge b{
  display:grid;place-items:center;width:22px;height:22px;border-radius:50%;
  background:var(--foam);color:var(--abyss);font-size:.68rem;
}
.hero h1{
  color:#fff;font-size:var(--step-5);line-height:.96;letter-spacing:-.035em;
  max-width:15ch;
}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln>span{display:block;transition:transform 1s var(--ease)}
.js .hero h1 .ln>span{transform:translateY(105%)}
.hero.is-ready h1 .ln>span{transform:none}
.hero.is-ready h1 .ln:nth-child(2)>span{transition-delay:.1s}
.hero.is-ready h1 .ln:nth-child(3)>span{transition-delay:.2s}
.hero h1 em{
  font-style:italic;color:var(--foam-2);
  font-variation-settings:"opsz" 90;
}
.hero__bottom{
  display:flex;align-items:flex-end;justify-content:space-between;gap:3rem;
  margin-top:clamp(1.3rem,3vw,2.4rem);flex-wrap:wrap;
}
.hero__sub{max-width:46ch;color:rgba(226,240,245,.82);font-size:var(--step-1);line-height:1.62}
.hero__cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.8rem}
.hero__fade{transition:opacity .9s var(--ease) .45s,transform .9s var(--ease) .45s}
.js .hero__fade{opacity:0;transform:translateY(28px)}
.hero.is-ready .hero__fade{opacity:1;transform:none}
.hero__meta{display:grid;gap:1.2rem;min-width:210px}
.hero__meta div{border-top:1px solid rgba(255,255,255,.18);padding-top:.7rem}
.hero__meta b{display:block;font-family:var(--ff-display);font-size:1.9rem;color:#fff;line-height:1}
.hero__meta span{font-size:.82rem;letter-spacing:.06em;color:rgba(214,231,238,.66);text-transform:uppercase}
.scroll-hint{
  position:absolute;left:50%;bottom:1.1rem;transform:translateX(-50%);z-index:2;
  display:grid;place-items:center;gap:.5rem;color:rgba(226,240,245,.55);
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
}
.scroll-hint i{display:block;width:1px;height:clamp(28px,5vh,52px);background:linear-gradient(rgba(255,255,255,.5),transparent);position:relative;overflow:hidden}
.scroll-hint i::after{content:"";position:absolute;inset:0;background:var(--foam);animation:trickle 2.4s var(--ease-io) infinite}
@keyframes trickle{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}

/* ---------- 8. REVEAL / EFEKTLER ---------- */
.js .reveal{opacity:0;transform:translateY(34px);transition:opacity .95s var(--ease),transform .95s var(--ease);transition-delay:var(--d,0s)}
.reveal.is-in{opacity:1;transform:none}
.js .reveal-img{clip-path:inset(0 0 100% 0);transform:scale(1.1);transition:clip-path 1.25s var(--ease),transform 1.6s var(--ease);transition-delay:var(--d,0s)}
.reveal-img.is-in{clip-path:inset(0 0 0 0);transform:scale(1)}
.split .w{display:inline-block;overflow:hidden;vertical-align:top}
.split .w>span{display:inline-block;transform:translateY(102%);transition:transform .9s var(--ease);transition-delay:calc(var(--i,0) * 45ms)}
.split.is-in .w>span{transform:none}

/* mouse spotlight kart */
.spot{position:relative;isolation:isolate;overflow:hidden}
.spot::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .5s;
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(78,205,201,.16),transparent 62%);
}
.spot:hover::after{opacity:1}

/* parallax medya */
.px{overflow:hidden;position:relative}
.px>img,.px>.px__bg{
  width:100%;height:126%;object-fit:cover;position:absolute;inset:-13% 0;
  transform:translate3d(0,var(--py,0px),0);will-change:transform;
}

/* tam genişlik parallax bandı */
.band{
  position:relative;min-height:min(78vh,660px);display:grid;place-items:center;
  overflow:hidden;isolation:isolate;text-align:center;color:#fff;
  padding-block:var(--sec);
}
.band__bg{position:absolute;inset:-14% 0;z-index:-2}
.band__bg img{width:100%;height:100%;object-fit:cover;transform:translate3d(0,var(--py,0px),0) scale(1.06);will-change:transform}
.band::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(3,18,28,.93),rgba(3,18,28,.82) 45%,rgba(3,18,28,.95)),radial-gradient(70% 60% at 50% 50%,rgba(3,18,28,.5),transparent 75%);
}
.band .eyebrow{color:var(--foam)}
.band .eyebrow::before{background:currentColor}
.band h2{color:#fff;max-width:18ch;margin-inline:auto}
.band p{color:rgba(226,240,245,.8);max-width:56ch;margin:1.4rem auto 0}

/* marquee */
.marquee{
  overflow:hidden;background:var(--deep);color:#fff;
  padding-block:1.05rem;border-block:1px solid rgba(255,255,255,.08);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marquee__track{display:flex;width:max-content;animation:mq 42s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee span{
  display:inline-flex;align-items:center;gap:1.6rem;padding-inline:1.6rem;
  font-size:.82rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(226,240,245,.72);white-space:nowrap;
}
.marquee span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--foam);flex:none}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- 9. BÖLÜMLER ---------- */
/* pillars */
.pillars{background:var(--ice);position:relative}
.pillar{
  position:relative;padding:2.4rem 2rem 2.2rem;border-radius:var(--r-lg);
  background:var(--paper);box-shadow:0 1px 0 var(--line);
  transition:transform .6s var(--ease),box-shadow .6s var(--ease);
}
.pillar:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.pillar__no{
  font-family:var(--ff-display);font-size:3.4rem;line-height:1;color:var(--foam);
  opacity:.5;letter-spacing:-.04em;
}
.pillar h3{margin:1rem 0 .8rem}
.pillar p{color:var(--muted);font-size:.98rem}
.pillar::before{
  content:"";position:absolute;left:2rem;right:2rem;top:0;height:2px;
  background:linear-gradient(90deg,var(--foam),var(--amber));
  transform:scaleX(0);transform-origin:0 50%;transition:transform .7s var(--ease);
}
.pillar:hover::before{transform:scaleX(1)}

/* intro split */
.intro{background:var(--paper)}
.intro__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.intro__media{position:relative}
.intro__media .px{border-radius:var(--r-lg);aspect-ratio:4/5}
.intro__float{
  position:absolute;right:-6%;bottom:-8%;width:min(60%,290px);
  border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-lg);
  border:6px solid var(--paper);
}
.intro__float img{aspect-ratio:1/1;object-fit:cover;width:100%}
.chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.9rem}
.chip{
  display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:99px;
  border:1px solid var(--line);font-size:.84rem;font-weight:600;color:var(--ink-2);
  transition:.35s var(--ease);
}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--foam)}
.chip:hover{border-color:var(--foam);background:rgba(78,205,201,.07)}

/* istatistikler */
.stats{background:var(--deep);color:#fff;position:relative;overflow:hidden}
.stats::before{
  content:"";position:absolute;inset:0;opacity:.5;
  background:radial-gradient(60% 100% at 12% 0%,rgba(78,205,201,.16),transparent 62%),
             radial-gradient(50% 90% at 92% 100%,rgba(221,166,79,.12),transparent 60%);
}
.stats .wrap{position:relative}
.stat{border-top:1px solid rgba(255,255,255,.14);padding-top:1.5rem}
.stat b{
  display:block;font-family:var(--ff-display);font-size:clamp(2.6rem,5vw,4.2rem);
  line-height:1;color:#fff;letter-spacing:-.04em;
}
.stat b small{font-size:.42em;color:var(--foam);margin-left:.18em;letter-spacing:0}
.stat>span{display:block;margin-top:.7rem;font-size:.88rem;color:rgba(214,231,238,.7);line-height:1.45}

/* dalış / süreç zaman çizelgesi */
.dive{background:var(--abyss);color:#c6d8e0;position:relative;overflow:hidden}
.dive__bg{
  position:absolute;inset:0;opacity:.22;
  background:url("../img/kurumsal/isleme.jpg") center/cover;
  filter:grayscale(.4);
  transform:translate3d(0,var(--py,0px),0) scale(1.12);
}
.dive::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,var(--abyss),rgba(3,18,28,.72) 40%,var(--abyss));
}
.dive .wrap{position:relative;z-index:2}
.dive__grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.dive__sticky{position:sticky;top:calc(var(--header-h) + 5vh)}
.dive__meter{margin-top:2.4rem;display:flex;align-items:flex-start;gap:1.2rem}
.dive__rail{width:2px;height:190px;background:rgba(255,255,255,.14);position:relative;border-radius:2px}
.dive__rail i{position:absolute;left:0;top:0;width:100%;height:var(--dp,0%);background:linear-gradient(var(--foam),var(--amber));border-radius:2px;transition:height .5s var(--ease)}
.dive__now{font-family:var(--ff-display);font-size:3.6rem;line-height:1;color:#fff;letter-spacing:-.04em}
.dive__now small{display:block;font-family:var(--ff-body);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--foam);margin-top:.5rem}
.step{padding:2.2rem 0;border-bottom:1px solid rgba(255,255,255,.1);display:grid;grid-template-columns:auto 1fr;gap:1.6rem;align-items:start;transition:opacity .6s var(--ease)}
.js .step{opacity:.4}
.step.is-active{opacity:1}
.step__no{
  font-family:var(--ff-display);font-size:1.05rem;width:44px;height:44px;flex:none;
  display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.22);
  color:#fff;transition:.6s var(--ease);
}
.step.is-active .step__no{background:var(--foam);border-color:var(--foam);color:var(--abyss)}
.step h3{font-size:var(--step-1);color:#fff;margin-bottom:.55rem}
.step p{font-size:.97rem;color:rgba(214,231,238,.7)}

/* ürün rayı (yatay kaydırma) */
.rail-sec{background:var(--ice);overflow:hidden}
.rail-sec__head{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;flex-wrap:wrap;margin-bottom:clamp(2rem,4vw,3.4rem)}
.rail{display:flex;gap:clamp(1rem,2vw,1.7rem);padding-inline:var(--gut);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1.4rem;scrollbar-width:thin;scroll-padding-inline:var(--gut)}
.rail::-webkit-scrollbar{height:5px}
.rail::-webkit-scrollbar-track{background:var(--line);border-radius:9px}
.rail::-webkit-scrollbar-thumb{background:var(--surf);border-radius:9px}
.pcard{
  flex:0 0 clamp(258px,25vw,330px);scroll-snap-align:start;
  position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--deep);
  aspect-ratio:3/4;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;
  padding:1.6rem;color:#fff;
  transition:transform .65s var(--ease);
}
.pcard img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;
  transition:transform 1.1s var(--ease),filter .7s var(--ease);
}
.pcard::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(3,18,28,.05) 30%,rgba(3,18,28,.62) 62%,rgba(3,18,28,.94));
  transition:opacity .6s;
}
.pcard:hover{transform:translateY(-10px)}
.pcard:hover img{transform:scale(1.08)}
.pcard__latin{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--foam);font-style:italic;margin-bottom:.5rem}
.pcard h3{color:#fff;font-size:var(--step-1);line-height:1.15}
.pcard p{font-size:.87rem;color:rgba(214,231,238,.72);margin-top:.5rem;overflow:hidden;
  transition:max-height .6s var(--ease),opacity .5s var(--ease),margin .6s var(--ease)}
@media (hover:hover) and (pointer:fine){
  .pcard p{max-height:0;opacity:0}
  .pcard:hover p{max-height:6rem;opacity:1}
}
.pcard__go{
  position:absolute;top:1.3rem;right:1.3rem;width:42px;height:42px;border-radius:50%;
  display:grid;place-items:center;background:rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.22);
  transition:.55s var(--ease);
}
@media (hover:hover) and (pointer:fine){
  .pcard__go{transform:scale(.6) rotate(-25deg);opacity:0}
  .pcard:hover .pcard__go{transform:none;opacity:1}
}
.pcard__go svg{width:16px;height:16px;stroke:#fff}

/* tesisler */
.fac{background:var(--paper)}
.fac__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(1rem,2vw,1.6rem)}
.fac__a{grid-column:span 7;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:16/11}
.fac__b{grid-column:span 5;display:grid;gap:clamp(1rem,2vw,1.6rem);grid-template-rows:1fr 1fr}
.fac__b .px{border-radius:var(--r-lg)}
.fac-card{
  padding:1.9rem;border-radius:var(--r-lg);background:var(--ice);
  border:1px solid var(--line);transition:.55s var(--ease);
}
.fac-card:hover{background:var(--paper);border-color:var(--foam);transform:translateY(-6px);box-shadow:var(--shadow)}
.fac-card i{
  display:grid;place-items:center;width:46px;height:46px;border-radius:14px;
  background:var(--deep);color:var(--foam);margin-bottom:1.1rem;
}
.fac-card svg{width:21px;height:21px}
.fac-card h4{margin-bottom:.5rem}
.fac-card p{font-size:.94rem;color:var(--muted)}

/* kalite barları */
.bars{display:grid;gap:1.5rem;margin-top:2.4rem}
.bar b{display:flex;justify-content:space-between;font-family:var(--ff-body);font-size:.9rem;font-weight:700;margin-bottom:.6rem;color:#fff}
.bar b span{color:var(--foam)}
.bar i{display:block;height:4px;border-radius:4px;background:rgba(255,255,255,.14);overflow:hidden}
.bar i::after{
  content:"";display:block;height:100%;width:var(--v,0%);border-radius:4px;
  background:linear-gradient(90deg,var(--foam),var(--amber));
  transform-origin:0 50%;transition:transform 1.5s var(--ease) var(--d,0s);
}
.js .bar i::after{transform:scaleX(0)}
.bar.is-in i::after{transform:scaleX(1)}

/* CTA */
.cta{position:relative;overflow:hidden;background:var(--deep);color:#fff;isolation:isolate}
.cta__bg{position:absolute;inset:-12% 0;z-index:-2}
.cta__bg img{width:100%;height:100%;object-fit:cover;opacity:.4;transform:translate3d(0,var(--py,0px),0) scale(1.08)}
.cta::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,rgba(6,33,49,.96) 20%,rgba(6,33,49,.6))}
.cta__in{display:flex;align-items:center;justify-content:space-between;gap:3rem;flex-wrap:wrap}
.cta h2{color:#fff;max-width:16ch}
.cta p{max-width:44ch;margin-top:1rem;color:rgba(226,240,245,.78)}
.cta__btns{display:flex;gap:.8rem;flex-wrap:wrap}

/* ---------- 10. SAYFA HERO ---------- */
.phero{
  position:relative;overflow:hidden;isolation:isolate;background:var(--abyss);color:#fff;
  padding-block:calc(var(--header-h) + clamp(5rem,11vw,9rem)) clamp(4rem,8vw,7rem);
}
.phero__bg{position:absolute;inset:-14% 0;z-index:-2}
.phero__bg img{width:100%;height:100%;object-fit:cover;transform:translate3d(0,var(--py,0px),0) scale(1.1)}
.phero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(3,18,28,.9),rgba(3,18,28,.62) 50%,rgba(3,18,28,.94));
}
.phero h1{color:#fff;max-width:16ch}
.phero p{max-width:60ch;margin-top:1.3rem;color:rgba(226,240,245,.8);font-size:var(--step-1)}
.crumb{display:flex;align-items:center;gap:.6rem;font-size:.82rem;color:rgba(214,231,238,.62);margin-bottom:1.4rem}
.crumb a:hover{color:var(--foam)}
.crumb i{opacity:.5}

/* ---------- 11. ÜRÜN KATALOG ---------- */
.filters{display:flex;gap:.55rem;flex-wrap:wrap;margin-bottom:clamp(2rem,4vw,3rem)}
.filters button{
  padding:.62rem 1.15rem;border-radius:99px;border:1px solid var(--line);background:transparent;
  font-size:.86rem;font-weight:700;color:var(--muted);cursor:pointer;transition:.35s var(--ease);
}
.filters button:hover{border-color:var(--surf);color:var(--surf)}
.filters button.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(266px,1fr));gap:clamp(1rem,2vw,1.7rem)}
.cat-card{
  position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--paper);
  border:1px solid var(--line);display:flex;flex-direction:column;
  transition:transform .6s var(--ease),box-shadow .6s var(--ease),border-color .4s;
}
.cat-card:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:transparent}
.cat-card__img{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--deep)}
.cat-card__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.cat-card:hover .cat-card__img img{transform:scale(1.07)}
.cat-card__tag{
  position:absolute;left:.9rem;top:.9rem;padding:.34rem .72rem;border-radius:99px;
  background:rgba(3,18,28,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;
}
.cat-card__body{padding:1.5rem 1.5rem 1.7rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.cat-card__latin{font-size:.74rem;font-style:italic;letter-spacing:.08em;color:var(--surf);text-transform:uppercase}
.cat-card h3{font-size:var(--step-1)}
.cat-card p{font-size:.9rem;color:var(--muted);flex:1}
.cat-card .link-arrow{margin-top:.6rem}
.cat-card.is-hidden{display:none}
.badges{display:flex;gap:1.4rem;flex-wrap:wrap;margin-top:1.6rem}
.badges span{display:inline-flex;align-items:center;gap:.5rem;font-size:.86rem;font-weight:600;color:rgba(226,240,245,.85)}
.badges svg{width:16px;height:16px;color:var(--foam);flex:none}

/* ---------- 12. ÜRÜN DETAY ---------- */
.pd{background:var(--paper)}
.pd__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.pd__media{position:sticky;top:calc(var(--header-h) + 3vh);border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;background:var(--deep)}
.pd__media img{width:100%;height:100%;object-fit:cover}
.pd__latin{font-family:var(--ff-display);font-style:italic;font-size:var(--step-1);color:var(--surf);margin-top:.4rem}
.pd__desc{margin-top:1.6rem;font-size:var(--step-1);line-height:1.62;color:var(--ink-2)}
.spec{margin-top:2.6rem;border-top:1px solid var(--line)}
.spec__row{display:grid;grid-template-columns:minmax(150px,.42fr) 1fr;gap:1.2rem;padding:1.35rem 0;border-bottom:1px solid var(--line)}
.spec__row dt{font-size:.79rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.spec__row dd{margin:0}
.spec__row li{position:relative;padding-left:1.1rem;margin-bottom:.35rem}
.spec__row li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;border-radius:50%;background:var(--foam)}
.tags{display:flex;flex-wrap:wrap;gap:.45rem}
.tags span{padding:.35rem .8rem;border-radius:99px;background:var(--ice);border:1px solid var(--line);font-size:.82rem;font-weight:600}
.spec-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:.5rem}
.spec-grid span{
  padding:.6rem .8rem;border-radius:12px;background:var(--deep);color:#fff;
  font-size:.82rem;font-weight:700;font-variant-numeric:tabular-nums;text-align:center;
}
.pd__cta{margin-top:2.6rem;padding:1.9rem;border-radius:var(--r-lg);background:var(--ice);border:1px solid var(--line)}
.pd__cta h4{margin-bottom:.5rem}
.pd__cta p{color:var(--muted);font-size:.94rem;margin-bottom:1.3rem}

/* ---------- 13. İLETİŞİM ---------- */
.ct__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.form{display:grid;gap:1.1rem}
.form>.btn{justify-self:start;padding-inline:2.4rem}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.field{position:relative}
.field label{
  position:absolute;left:1.05rem;top:1.02rem;font-size:.94rem;color:var(--muted);
  pointer-events:none;transition:.32s var(--ease);transform-origin:0 50%;
}
.field input,.field select,.field textarea{
  width:100%;padding:1.65rem 1.05rem .7rem;border-radius:14px;
  border:1px solid var(--line);background:var(--paper);outline:none;
  transition:border-color .3s,box-shadow .3s;
}
.field textarea{min-height:132px;resize:vertical;line-height:1.55}
.field select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%235f7885' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1.1rem center}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--foam);box-shadow:0 0 0 4px rgba(78,205,201,.16)}
.field input:focus+label,.field input:not(:placeholder-shown)+label,
.field textarea:focus+label,.field textarea:not(:placeholder-shown)+label,
.field select+label{
  transform:translateY(-.72rem) scale(.78);color:var(--surf);font-weight:700;letter-spacing:.04em;
}
.form__note{font-size:.82rem;color:var(--muted);line-height:1.5}
.ct-card{
  padding:1.7rem;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--paper);
  transition:.5s var(--ease);
}
.ct-card+.ct-card{margin-top:1rem}
.ct-card:hover{border-color:var(--foam);transform:translateY(-4px);box-shadow:var(--shadow)}
.ct-card h4{margin-bottom:.5rem;display:flex;align-items:center;gap:.6rem}
.ct-card h4 i{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--deep);color:var(--foam)}
.ct-card h4 svg{width:16px;height:16px}
.ct-card address{font-style:normal;color:var(--muted);font-size:.95rem;line-height:1.6}
.ct-quick{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}
.ct-quick a{
  padding:1.3rem;border-radius:var(--r);background:var(--deep);color:#fff;
  display:grid;gap:.3rem;transition:.45s var(--ease);
}
.ct-quick a:hover{background:var(--abyss);transform:translateY(-4px)}
.ct-quick small{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--foam)}
.ct-quick b{font-size:1rem;font-weight:700;word-break:break-word}

/* galeri */
.gal{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(.7rem,1.4vw,1.2rem)}
.gal figure{border-radius:var(--r);overflow:hidden;position:relative;background:var(--deep)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.gal figure:hover img{transform:scale(1.06)}
.gal .s4{grid-column:span 4;aspect-ratio:4/3}
.gal .s6{grid-column:span 6;aspect-ratio:16/10}
.gal .s8{grid-column:span 8;aspect-ratio:16/9}
.gal .s3{grid-column:span 3;aspect-ratio:1}
.gal .p4{grid-column:span 4;aspect-ratio:3/4}
.gal .t4{grid-column:span 4;aspect-ratio:8/9}

/* değerler */
.vm{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.6rem)}
.vm article{
  padding:2.1rem 1.9rem;border-radius:var(--r-lg);background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);transition:.55s var(--ease);
}
.vm article:hover{background:rgba(255,255,255,.07);border-color:rgba(78,205,201,.4);transform:translateY(-6px)}
.vm h3{font-size:var(--step-1);margin-bottom:.8rem;color:#fff}
.vm p{color:rgba(214,231,238,.75);font-size:.97rem}

/* ---------- 14. FOOTER ---------- */
.footer{background:var(--abyss);color:rgba(198,216,224,.7);padding-block:clamp(3.5rem,7vw,6rem) 2rem;position:relative;overflow:hidden}
.footer::before{
  content:"";position:absolute;inset:auto 0 -60% 0;height:120%;
  background:radial-gradient(60% 60% at 50% 100%,rgba(78,205,201,.1),transparent 70%);
}
.footer .wrap{position:relative}
.footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.25fr;gap:clamp(1.8rem,4vw,3.5rem)}
.footer img.f-logo{height:44px;width:auto;filter:brightness(0) invert(1);margin-bottom:1.3rem}
.footer p{font-size:.94rem;color:rgba(198,216,224,.66);max-width:38ch}
.footer h5{font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin-bottom:1.3rem}
.footer li+li{margin-top:.65rem}
.footer li a{font-size:.94rem;transition:.3s;position:relative}
.footer li a:hover{color:var(--foam)}
.footer address{font-style:normal;font-size:.92rem;line-height:1.62;color:rgba(198,216,224,.66)}
.footer address+address{margin-top:1rem}
.footer address b{display:block;color:#fff;font-weight:700;margin-bottom:.2rem;font-size:.88rem}
.footer__bar{
  margin-top:clamp(2.6rem,5vw,4rem);padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;
  font-size:.84rem;color:rgba(198,216,224,.55);
}
.footer__bar ul{display:flex;gap:1.4rem;flex-wrap:wrap}
.footer__bar a:hover{color:var(--foam)}

/* yukarı çık */
.totop{
  position:fixed;right:clamp(1rem,3vw,2rem);bottom:clamp(1rem,3vw,2rem);z-index:880;
  width:50px;height:50px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;
  background:var(--ink);color:#fff;box-shadow:var(--shadow);
  opacity:0;transform:translateY(16px) scale(.85);pointer-events:none;
  transition:.5s var(--ease);
}
.totop.is-on{opacity:1;transform:none;pointer-events:auto}
.totop:hover{background:var(--foam);color:var(--abyss)}
.totop svg{width:18px;height:18px}

/* ---------- 15. RESPONSIVE ---------- */
@media (max-height:660px){.scroll-hint{display:none}}
@media (max-width:1080px){
  .footer__grid{grid-template-columns:1fr 1fr}
  .intro__grid,.dive__grid,.ct__grid,.pd__grid{grid-template-columns:1fr}
  .dive__sticky{position:static}
  .pd__media{position:static;aspect-ratio:16/10}
  .fac__a,.fac__b{grid-column:span 12}
  .fac__b{grid-template-rows:auto;grid-template-columns:1fr 1fr}
  .g-4{grid-template-columns:repeat(2,1fr)}
  .intro__float{position:static;width:100%;margin-top:1rem;border:0;box-shadow:none}
}
@media (max-width:900px){
  :root{--header-h:66px}
  body::after{display:none}
  .hero__dots{right:auto;top:auto;left:50%;bottom:4.4rem;transform:translateX(-50%);display:flex;gap:.9rem}
  .hd span{display:none}
  /* dar ekranda yan perde yerine dikey perde: fotoğraf daha çok görünsün */
  .hero__tint{background:
    linear-gradient(180deg,rgba(3,18,28,.82) 0%,rgba(3,18,28,.42) 26%,rgba(3,18,28,.72) 56%,rgba(3,18,28,.94) 84%,var(--abyss) 100%),
    radial-gradient(120% 70% at 30% 20%,rgba(18,85,111,.2),transparent 62%)}
  .nav,.header__act .langdd{display:none}
  html:not(.js) .nav{display:flex;overflow-x:auto;gap:1rem}
  .burger{display:block}
  .g-3,.vm{grid-template-columns:1fr}
  .hero__bottom{flex-direction:column;align-items:flex-start}
  .hero__meta{display:flex;gap:2rem;width:100%}
  .hero__meta div{flex:1}
  .gal .s4,.gal .s6,.gal .s8,.gal .s3,.gal .p4,.gal .t4{grid-column:span 6}
  .cta__in{flex-direction:column;align-items:flex-start}
}
@media (max-width:620px){
  .g-2,.g-4,.form__row,.ct-quick,.fac__b,.footer__grid{grid-template-columns:1fr}
  .spec__row{grid-template-columns:1fr;gap:.5rem}
  .gal .s4,.gal .s6,.gal .s8,.gal .s3,.gal .t4{grid-column:span 12}
  .gal .p4{grid-column:span 12;aspect-ratio:4/3}
  .hero__meta{flex-direction:column;gap:1rem}
  .btn{width:100%}
  .hero__cta,.cta__btns{width:100%}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal,.hero__fade{opacity:1!important;transform:none!important}
  .reveal-img{clip-path:none!important;transform:none!important}
  .split .w>span,.hero h1 .ln>span{transform:none!important}
  .hero__photo,.hero__caustics,.hero__rays,.px>img,.px>.px__bg,.band__bg img,.cta__bg img,.phero__bg img,.dive__bg{transform:none!important}
  .bubbles{display:none}
  .bar i::after{transform:scaleX(1)!important}
}

/* yazdırma */
@media print{
  .header,.drawer,.totop,.progress,.marquee,.bubbles,body::after{display:none!important}
  .hero h1,.phero h1,.band h2,.cta h2,.dark h1,.dark h2,.dark h3,.dark h4,
  .step h3,.vm h3,.stat b,.hero__meta b,.dive__now,.pcard h3{color:#000!important}
  body{background:#fff;color:#000}
  .hero,.phero,.band,.cta,.dive,.stats,.footer{background:#fff!important;color:#000!important}
}

/* ---------- 16. ÇİNCE (zh) TİPOGRAFİ ---------- */
html[lang="zh"]{
  --ff-display:"Noto Serif SC","Songti SC","SimSun",serif;
  --ff-body:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
}
html[lang="zh"] h1,html[lang="zh"] h2,html[lang="zh"] h3,html[lang="zh"] h4{
  letter-spacing:.02em;line-height:1.22;font-weight:600;
  font-variation-settings:normal;
}
html[lang="zh"] .hero h1{line-height:1.16;letter-spacing:.03em;font-size:clamp(2.3rem,1.4rem + 4.2vw,5.2rem)}
html[lang="zh"] .hero h1 em,html[lang="zh"] .serif-i{font-style:normal;font-variation-settings:normal}
html[lang="zh"] .pillar__no,html[lang="zh"] .dive__now,html[lang="zh"] .stat b,html[lang="zh"] .hero__meta b{font-family:"Noto Serif SC",serif}
html[lang="zh"] .eyebrow{letter-spacing:.3em}
html[lang="zh"] body,html[lang="zh"] p{line-height:1.85}
html[lang="zh"] .drawer a{font-weight:600}