:root{
    --bg:#1b110b; --bg2:#251710; --cream:#f0e3cd; --cream-dim:#bda88a;
    --glass:rgba(240,230,210,.6);
    --foam:#f4e8d3; --milk:#e4c9a0; --espresso:#6b4326; --espresso-dark:#4a2c18; --accent:#c99a5b;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  /* Yatay kayma engeli: body'deki overflow-x:hidden tek başına mobil tarayıcılarda
     yetmiyor (kök/html hâlâ yatay kayabiliyor ve fixed katmanları -bulutlar, zerreler-
     kırpmıyor). overflow-x:hidden'ı html'e de ekleyip yatay overscroll'u kapatıyoruz. */
  html{scroll-behavior:smooth;scroll-padding-top:var(--nav-h);overflow-x:hidden;overscroll-behavior-x:none}
  body{background:radial-gradient(120% 80% at 50% -10%, var(--bg2), var(--bg) 60%), var(--bg);
       color:var(--cream); font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif; overflow-x:hidden; overscroll-behavior-x:none; width:100%; -webkit-font-smoothing:antialiased}
  body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;opacity:.04;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
  .display{font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif}
  .label{font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--cream-dim)}
  .defs{position:absolute;width:0;height:0;overflow:hidden}
  .cup{width:100%;height:100%;display:block;overflow:visible}
  .cup-shell{animation:float 5.5s ease-in-out infinite}
  @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
  .st{transform-box:fill-box;transform-origin:bottom center;animation:steam 4.6s ease-in-out infinite}
  .st1{animation-delay:0s}.st2{animation-delay:1.4s}.st3{animation-delay:2.8s}
  @keyframes steam{0%{opacity:0;transform:translateY(6px) scaleY(.85)}25%{opacity:.5}100%{opacity:0;transform:translateY(-14px) scaleY(1.15)}}

  /* HERO */
  .hero{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;
        text-align:center;padding:clamp(100px,14vh,130px) 18px clamp(48px,7vh,64px);position:relative;gap:0}
  .counter{position:absolute;top:clamp(20px,3.5vh,32px);left:50%;transform:translateX(-50%);font-size:.72rem;letter-spacing:.2em;color:var(--cream-dim)}

  .cats{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;width:100%;max-width:720px;margin:0 auto;position:relative;z-index:5}
  .cat{font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;
        padding:9px 16px;border-radius:999px;border:1px solid rgba(240,230,210,.22);
        background:transparent;color:var(--cream-dim);cursor:pointer;transition:.2s;white-space:nowrap;touch-action:manipulation}
   .cat:hover{color:var(--cream);border-color:rgba(240,230,210,.45)}
  .cat.active{color:#1b110b;background:var(--accent);border-color:var(--accent);font-weight:700}
  .cat:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
  .selector{display:flex;align-items:center;justify-content:space-between;margin-top:clamp(20px,4vh,34px);width:min(100%,520px)}
   .nav{flex:none;color:var(--cream);font-size:3.6rem;font-weight:700;cursor:pointer;background:none;border:none;transition:.2s;font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;touch-action:manipulation;z-index:4;line-height:1;padding:0 6px;user-select:none;-webkit-user-select:none}
   .nav{margin:0}
   .nav:hover{color:var(--accent);transform:scale(1.15)}
   .nav:active{transform:scale(.94)}
  .nav:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
  /* dekoratif kupa görseli büyütülünce kutusu taşıyor; tıklamayı engellememesi için pointer-events:none */
  .stage-cup{width:clamp(150px,40vmin,264px);aspect-ratio:240/360;transition:opacity .2s ease;pointer-events:none;position:relative;z-index:1}
  .stage-cup.switch{opacity:0}
  /* görsel-tabanlı içecekler (PNG ~1:1) dar/uzun kupa kutusunda küçük kalıyordu -> büyüt */
  .stage-cup img,.descender img{transform:scale(1.45);transform-origin:center}
  /* Kelime ORTADAN bölünmesin (örn. masaüstünde "Cappuci/no"). Kelimeler yalnızca
     boşluklardan satıra iner; sığmayan tek uzun kelimede font JS ile (fitHeroName)
     kelimeyi bölmeden sığacak kadar küçültülür. */
  .drink-name{font-weight:800;font-size:clamp(2.2rem,9vw,6.6rem);line-height:.92;letter-spacing:-.02em;margin:clamp(30px,5vh,46px) 0 16px;overflow-wrap:normal;word-break:keep-all;hyphens:none;max-width:100%}
  .hero__info{text-align:left}.hero__info .tagline{margin-left:0;margin-right:0;padding:0}.hero__info .price{text-align:left}.hero__info .recipe{text-align:left;margin-left:0;margin-right:0}
  /* Hero ortalaması (align-items:center) çocukları İÇERİĞE göre boyutluyordu; metin uzunluğu
     değişince grid genişliği -> selector genişliği -> ok tuşlarının yatay konumu kayıyordu.
     Sabit genişlik ver -> oklar sağa-sola oynamaz. (Masaüstü grid genişliği aşağıda 100%.) */
  .hero__grid{width:min(520px,100%)}
  .drink-name.anim{animation:fadeUp .45s cubic-bezier(0.16,1,0.3,1)}@keyframes fadeUp{0%{opacity:0;transform:translateY(18px)}100%{opacity:1;transform:translateY(0)}}
  .tagline{max-width:34ch;color:var(--cream-dim);font-size:.94rem;line-height:1.6;margin:0 auto;padding:0 8px}
  .price{font-size:1.4rem;font-weight:700;color:var(--cream);margin-top:10px}
  .recipe{margin-top:clamp(34px,5vh,50px);border:1px solid rgba(240,230,210,.18);border-radius:16px;
          padding:18px clamp(16px,4vw,24px);background:rgba(0,0,0,.18);max-width:min(460px,92vw);text-align:left}
  .recipe h4{font-size:.66rem;letter-spacing:.3em;color:var(--accent);margin-bottom:12px;font-weight:700;transition:color .35s}
  .recipe ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px 10px}
  .recipe li{font-size:.78rem;padding:6px 12px;border-radius:999px;background:rgba(240,230,210,.07);border:1px solid rgba(240,230,210,.12)}
  .hero-flavors{list-style:none;display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:14px;max-width:min(460px,92vw)}
  /* .flavors (column) kuralı hero-flavors'ı eziyordu -> pill (satır) görünümünü tip+sınıf özgüllüğüyle geri al */
  ul.hero-flavors{flex-direction:row;flex-wrap:wrap;gap:8px 10px;margin-top:14px}
  .hero-flavors li{font-size:.78rem;padding:6px 12px;border-radius:999px;background:rgba(240,230,210,.07);border:1px solid rgba(240,230,210,.12);color:var(--cream);transition:color .35s,border-color .35s}
  /* in-flow scroll hint -> never overlaps the recipe box */
  .scrollhint{margin-top:clamp(30px,5vh,52px);display:flex;flex-direction:column;align-items:center;gap:10px}
  .arr{width:22px;height:34px;animation:bob 1.6s ease-in-out infinite}
  @keyframes bob{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(8px);opacity:1}}

  /* POUR — shorter so it plays in a single scroll */
  .pour{position:relative;height:100vh}
  .stage{position:relative;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center}
  .pour-bg{position:absolute;inset:0;z-index:0;background:
      radial-gradient(80% 50% at 50% 16%, rgba(78,50,30,.55), transparent 60%),
      radial-gradient(120% 80% at 50% 110%, rgba(0,0,0,.66), transparent 55%),
      linear-gradient(180deg,#1d130c 0%, #150d07 55%, #0d0704 100%)}
  .glow{position:absolute;z-index:0;left:50%;top:42%;width:76vmin;height:76vmin;border-radius:50%;
        transform:translate(-50%,-50%) translateY(calc(var(--p,0) * -7vh));background:radial-gradient(circle, var(--accent), transparent 62%);opacity:.24;filter:blur(50px);transition:background .4s}
  .beans{position:absolute;inset:0;z-index:0;pointer-events:none}
  .bean{position:absolute;opacity:.22;animation:drift 18s linear infinite}
  .bean svg{width:100%;height:100%;display:block}
  @keyframes drift{0%{transform:translateY(28px) rotate(var(--r))}100%{transform:translateY(-46px) rotate(var(--r))}}
  /* soft sliding light strata */
  .bars{position:absolute;inset:0;z-index:1;pointer-events:none;filter:blur(1.2px)}
  .bar{position:absolute;left:-30vw;width:160vw;height:var(--h,4px);border-radius:99px;background:var(--accent);opacity:.2;transition:background .4s;
       -webkit-mask:linear-gradient(90deg,transparent,#000 32%,#000 68%,transparent);mask:linear-gradient(90deg,transparent,#000 32%,#000 68%,transparent);
       transform:translateX(calc((var(--p,0) - .5) * var(--dir) * var(--mag) * 1vw))}

  .combo{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:clamp(28px,5vw,56px);
         width:100%;max-width:960px;padding:0 22px;transform:translateY(calc(var(--cy,-4) * 1vh))}
  .descender{flex:none;width:clamp(150px,40vmin,264px);aspect-ratio:240/360;transform:scale(var(--sc,1));transform-origin:center;transition:opacity .2s ease;will-change:transform;pointer-events:none}
  .descender.switch{opacity:0}
  .arrival{width:min(330px,86vw);text-align:left;opacity:var(--reveal,0);transition:opacity .15s linear}
  .arrival .label{color:var(--accent);margin-bottom:14px;transition:color .35s}
  .arrival .a-name{font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;font-weight:800;font-size:clamp(2rem,6vw,3.5rem);line-height:.98;letter-spacing:-.02em;overflow-wrap:break-word}
  .flavors{list-style:none;margin-top:24px;display:flex;flex-direction:column;gap:13px}
  .flv{display:flex;align-items:center;gap:13px;font-size:1rem;opacity:0;transform:translateX(-14px);transition:opacity .5s ease,transform .5s ease;transition-delay:calc(var(--i) * 75ms)}
  .flv .mk{width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none;box-shadow:0 0 10px var(--accent);transition:background .35s,box-shadow .35s}
  .arrival.arrived .flv{opacity:1;transform:none}
  .landing{position:absolute;z-index:1;bottom:13vh;left:50%;width:min(380px,72vw);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--glass),transparent);opacity:var(--reveal,0)}
  @media(max-width:780px){.combo{flex-direction:column;gap:clamp(22px,4vh,38px)}.arrival{text-align:center}.flavors{align-items:center}}
  @media(min-width:820px){.hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,64px);align-items:center;max-width:1100px;width:100%;padding:0 24px}.hero__info{order:1}.hero__info .drink-name{margin-top:0}.hero__visual{display:flex;justify-content:flex-end;align-items:center;order:2;transform:translateY(clamp(-72px,-6vh,-40px))}}

  /* MENU */
  .menu{padding:clamp(72px,10vh,100px) 18px calc(clamp(90px,12vh,120px) + env(safe-area-inset-bottom,0px));max-width:760px;margin:0 auto}
  .menu h2{font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;font-weight:800;font-size:clamp(1.7rem,5vw,2.5rem);margin-bottom:8px}
  .menu .intro{margin-bottom:30px;display:block}
  .menu-cat{margin:34px 0 8px;color:var(--accent)}
  .row{display:flex;align-items:center;gap:14px;padding:18px 6px;cursor:pointer;border-top:1px solid rgba(240,230,210,.12);transition:.2s;touch-action:manipulation}
  .row:hover{padding-left:12px;background:rgba(240,230,210,.03)}
  .swatch{flex:none;width:14px;height:14px;border-radius:50%}
  .row .r-name{font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;font-weight:600;font-size:1.12rem;flex:none;width:150px}
  .row .r-fl{font-size:.74rem;color:var(--cream-dim);flex:1}
  .row .r-go{font-size:1.05rem;color:var(--cream-dim);transition:.2s}
  .row:hover .r-go{color:var(--accent);transform:translateX(4px)}
  @media(max-width:560px){.row{flex-wrap:wrap;gap:6px 12px}.row .r-name{width:auto;flex:1}.row .r-go{order:2}.row .r-fl{flex-basis:100%;order:3;padding-left:28px}}
  @media(max-width:480px){.cat{font-size:.66rem;padding:8px 12px}}
  #particleCanvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:0.5}
  .clouds{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:hidden}
  /* PERF: blur(100px) x10 animasyonlu katman çok pahalıydı -> 48px (kernel ~4x ucuz), opaklık telafi edildi */
  .cloud{position:absolute;filter:blur(48px);opacity:0.16;transition:background 1.2s ease;will-change:transform;background:var(--accent)}
  .cloud:nth-child(1){width:700px;height:350px;top:-5%;left:-10%;animation:floatCloud 28s infinite}
  .cloud:nth-child(2){width:500px;height:250px;top:15%;left:-20%;animation:floatCloud 35s infinite 3s}
  .cloud:nth-child(3){width:800px;height:400px;top:40%;left:-15%;animation:floatCloud 30s infinite 7s}
  .cloud:nth-child(4){width:550px;height:300px;top:60%;left:-25%;animation:floatCloud 40s infinite 11s}
  .cloud:nth-child(5){width:450px;height:220px;top:75%;left:-30%;animation:floatCloud 32s infinite 15s}
  .cloud:nth-child(6){width:700px;height:380px;top:85%;left:-5%;animation:floatCloud 38s infinite 19s}
  .cloud:nth-child(7){width:380px;height:200px;top:10%;left:-40%;animation:floatCloud 25s infinite 2s}
  .cloud:nth-child(8){width:600px;height:320px;top:50%;left:-35%;animation:floatCloud 45s infinite 6s}
  .cloud:nth-child(9){width:500px;height:240px;top:90%;left:-45%;animation:floatCloud 28s infinite 10s}
  .cloud:nth-child(10){width:460px;height:260px;top:30%;left:-50%;animation:floatCloud 33s infinite 14s}

  @keyframes floatCloud{0%{transform:translateX(0) scale(1)}50%{transform:translateX(calc(40vw + 200px)) scale(1.1)}100%{transform:translateX(calc(110vw + 600px)) scale(1)}}
  /* PERF: mobilde bulut sayısını yarıya indir (GPU dolgu maliyetini düşürür) */
  @media(max-width:640px){.cloud:nth-child(n+6){display:none}}
  @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.arr,.st,.bean,.cup-shell,.cloud{animation:none}.descender{transform:scale(1)}.bar{transform:none}.arrival,.flv{opacity:1;transform:none}}
  :root{--nav-h:76px;--ink:#f0e3cd;--ink-dim:rgba(240,227,205,0.6);--ease:cubic-bezier(0.22,1,0.36,1);--accent-dark:#b8863e}
  .site{position:relative;z-index:1;min-height:100vh;min-height:100dvh}
  .wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 clamp(20px,5vw,64px)}
  .navbar{position:fixed;top:0;left:0;right:0;z-index:40;height:calc(var(--nav-h) + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px);display:flex;align-items:center;justify-content:space-between;padding-left:max(clamp(20px,4vw,56px),env(safe-area-inset-left,0px));padding-right:max(clamp(20px,4vw,56px),env(safe-area-inset-right,0px));background:rgba(27,17,11,0.7);border-bottom:1px solid rgba(240,230,210,0.12);-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);transition:transform 0.5s var(--ease)}.navbar.is-hidden{transform:translateY(calc(-100% - env(safe-area-inset-top,0px)))}
  .navbar-brand{display:flex;align-items:center;text-decoration:none}.navbar-brand img{display:block;height:42px;width:auto}
  .navbar-nav{display:flex;gap:clamp(20px,3vw,46px)}.navbar-nav__link{position:relative;color:var(--ink-dim);text-decoration:none;font-size:15px;font-weight:600;letter-spacing:.02em;padding:6px 2px;transition:color .3s ease}.navbar-nav__link::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent-dark));transform:scaleX(0);transform-origin:left;transition:transform .32s var(--ease)}.navbar-nav__link:hover{color:var(--ink)}.navbar-nav__link:hover::after{transform:scaleX(1)}.navbar-nav__link:focus-visible{outline:2px solid var(--accent-dark);outline-offset:3px;border-radius:6px}
  .nav-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;border:none;background:none;cursor:pointer;padding:0}.nav-toggle span{display:block;width:24px;height:2.5px;background:var(--cream);border-radius:2px;transition:transform .3s var(--ease),opacity .3s var(--ease)}.nav-toggle.is-active span{opacity:0;transform:translateY(-18px)}.nav-toggle.is-active span:nth-child(1){transition-delay:0s}.nav-toggle.is-active span:nth-child(2){transition-delay:.08s}.nav-toggle.is-active span:nth-child(3){transition-delay:.16s}.nav-toggle span:nth-child(1){transition-delay:.45s}.nav-toggle span:nth-child(2){transition-delay:.35s}.nav-toggle span:nth-child(3){transition-delay:.25s}
  .nav-overlay{position:fixed;inset:0;z-index:999;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(27,17,11,0.85);-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s var(--ease)}.nav-overlay.is-open{opacity:1;visibility:visible}
  .nav-overlay__close{position:absolute;top:11px;right:13px;width:40px;height:40px;display:grid;place-items:center;border:none;background:none;cursor:pointer;padding:0}.nav-overlay__close span{position:absolute;width:22px;height:2.5px;background:var(--cream);border-radius:2px;opacity:0;transition:transform .35s var(--ease),opacity .35s var(--ease);transform:translateY(-20px) rotate(0deg)}.nav-overlay.is-open .nav-overlay__close span{opacity:1}.nav-overlay.is-open .nav-overlay__close span:nth-child(1){transform:translateY(0) rotate(45deg);transition-delay:.32s}.nav-overlay.is-open .nav-overlay__close span:nth-child(2){transform:translateY(0) rotate(-45deg);transition-delay:.44s}.nav-overlay.is-open.is-closing .nav-overlay__close span{opacity:0;transform:translateY(-20px) rotate(0deg)}.nav-overlay.is-open.is-closing .nav-overlay__close span:nth-child(1){transition-delay:0s}.nav-overlay.is-open.is-closing .nav-overlay__close span:nth-child(2){transition-delay:.1s}
  .nav-overlay__menu{display:flex;flex-direction:column;align-items:center;gap:32px}.nav-overlay__link{color:var(--cream);text-decoration:none;font-size:22px;font-weight:700;letter-spacing:.04em;opacity:0;transition:opacity .55s var(--ease),transform .55s var(--ease),color .25s ease;transition-delay:0s}.nav-overlay__link:nth-child(1){transform:translateX(-40px)}.nav-overlay__link:nth-child(2){transform:translateX(40px)}.nav-overlay__link:nth-child(3){transform:translateX(-40px)}.nav-overlay.is-open .nav-overlay__link{opacity:1;transform:translateX(0)}.nav-overlay.is-open .nav-overlay__link:nth-child(1){transition-delay:.35s}.nav-overlay.is-open .nav-overlay__link:nth-child(2){transition-delay:.45s}.nav-overlay.is-open .nav-overlay__link:nth-child(3){transition-delay:.55s}.nav-overlay__link:hover{color:var(--accent-dark)}.nav-overlay__link:focus-visible{outline:2px solid var(--accent-dark);outline-offset:3px;border-radius:6px}
  .footer{background:#100b08;color:#f4ece0}.footer__top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(28px,4vw,56px);padding-top:clamp(48px,6vw,80px);padding-bottom:36px}.footer__logo{display:flex;align-items:center}.footer__logo img{display:block;height:36px;width:auto}.footer__tag{margin-top:12px;max-width:280px;color:rgba(244,236,224,0.6);font-size:14.5px;line-height:1.6}.footer__social{display:flex;gap:12px;margin-top:20px}.footer__social a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:#f4ece0;border:1px solid rgba(244,236,224,0.2);transition:background .25s ease,transform .25s ease,border-color .25s ease}.footer__social a:hover{background:rgba(255,255,255,0.1);border-color:rgba(244,236,224,0.45);transform:translateY(-2px)}.footer__social svg{width:19px;height:19px}.footer__col h3{font-size:14px;font-weight:700;letter-spacing:.04em;margin-bottom:16px}.footer__col a,.footer__col p{display:block;color:rgba(244,236,224,0.62);font-size:14.5px;text-decoration:none;margin-bottom:10px;transition:color .25s ease}.footer__col a:hover{color:#fff}.footer__col a:focus-visible{outline:2px solid var(--accent-dark);outline-offset:3px;border-radius:6px}.footer__inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px clamp(20px,5vw,64px) 30px;border-top:1px solid rgba(244,236,224,0.12);font-size:13px;color:rgba(244,236,224,0.5)}.footer__row{display:flex;align-items:center;gap:6px}.footer__row--end{margin-left:auto}.footer__bbm-wrap{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.footer__bbm{display:inline-flex;flex-shrink:0;opacity:0;transform:translateX(120px);transition:none}.footer__bbm.is-visible{animation:bbmSlideIn .8s cubic-bezier(0.16,1,0.3,1) forwards}.footer__bbm img{display:block;height:20px;width:auto;transition:filter .25s ease}.footer__bbm:hover img{filter:brightness(0) invert(1)}@keyframes bbmSlideIn{from{opacity:0;transform:translateX(120px)}to{opacity:1;transform:translateX(0)}}
  .scroll-top{position:fixed;bottom:28px;right:24px;z-index:50;width:48px;height:48px;display:grid;place-items:center;border:none;border-radius:50%;background:rgba(240,230,210,0.15);color:var(--cream);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .35s var(--ease),visibility .35s var(--ease),transform .35s var(--ease),background .25s ease;box-shadow:0 4px 16px rgba(0,0,0,0.3)}.scroll-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}.scroll-top:hover{background:rgba(240,230,210,0.3)}.scroll-top:focus-visible{outline:2px solid var(--accent-dark);outline-offset:3px}
  @media(max-width:640px){:root{--nav-h:62px}.navbar{padding:0 18px}.navbar-nav{display:none}.nav-toggle{display:flex}.scroll-top{bottom:22px;right:16px;width:44px;height:44px}}@media(max-width:380px){.navbar{padding:0 12px}}@media(max-width:880px){.footer__top{grid-template-columns:1fr 1fr}}@media(max-width:560px){.footer__top{grid-template-columns:1fr}.footer__inner{flex-direction:column;align-items:flex-start;gap:10px}.footer__row--end{margin-left:0}}
  .page-loader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:rgba(27,17,11,0.88);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .5s ease,visibility .5s ease}.page-loader.is-visible{opacity:1;visibility:visible}.page-loader__spinner{width:32px;height:32px;border:3px solid rgba(244,236,224,0.15);border-top-color:var(--accent);border-radius:50%;animation:pageSpin .7s linear infinite}.page-loader.is-fading{opacity:0;transition:opacity .4s ease}@keyframes pageSpin{to{transform:rotate(360deg)}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.hero-breadcrumb{font-size:11px;letter-spacing:0.15em;text-transform:uppercase;color:var(--cream-dim);opacity:0.55;margin-bottom:2px}
.hero-breadcrumb a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s ease}
.hero-breadcrumb a:hover{border-bottom-color:var(--cream-dim)}
.hero-breadcrumb .sep{margin:0 5px;user-select:none}

/* backdrop-filter yoksa (eski Firefox / katı gizlilik / Tor) cam yüzeyleri opak yap */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .navbar{background:rgba(27,17,11,0.95)}
  .nav-overlay{background:rgba(27,17,11,0.97)}
  .page-loader{background:rgba(27,17,11,0.97)}
  .scroll-top{background:rgba(27,17,11,0.92)}
}