.mesa-shell .hd{
    position:absolute;left:0;right:0;top:0;z-index:6;
    display:flex;align-items:center;gap:clamp(16px,3vw,48px);
    padding:clamp(16px,2.6vh,28px) clamp(20px,3.2vw,56px) clamp(34px,5vh,56px);
  }
.mesa-shell .hd::before{
    content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:linear-gradient(180deg,rgba(6,5,4,.92) 0%,rgba(6,5,4,.62) 45%,rgba(6,5,4,.22) 78%,rgba(6,5,4,0) 100%);
  }
.mesa-shell .hd-logo{display:inline-block;flex:none;line-height:0}
.mesa-shell .lg-svg{display:block;width:clamp(128px,9.4vw,176px);height:auto;overflow:visible;
    animation:ftGlow 14s ease-in-out infinite;transition:transform .35s ease}
.mesa-shell .hd-logo{transition:filter .35s ease}
.mesa-shell .hd-logo:hover,.mesa-shell .hd-logo:focus-visible{filter:brightness(1.18) drop-shadow(0 8px 14px rgba(253,185,39,.28))}
.mesa-shell .hd-logo:hover .lg-svg,.mesa-shell .hd-logo:focus-visible .lg-svg{transform:translateY(-3px) scale(1.03)}
.mesa-shell .lg-svg .pg{transform-box:fill-box;transform-origin:50% 100%;animation:14s cubic-bezier(.2,.7,.2,1) infinite both}
.mesa-shell .lg-svg .g1{animation-name:ftIn1}
.mesa-shell .lg-svg .g2{animation-name:ftIn2}
.mesa-shell .lg-svg .g3{animation-name:ftIn3}
.mesa-shell .lg-svg .g4{animation-name:ftIn4}
.mesa-shell .lg-svg .g5{animation-name:ftIn5}
.mesa-shell .lg-svg .g6{animation-name:ftIn6}
@media (prefers-reduced-motion:reduce){.mesa-shell .lg-svg,.mesa-shell .lg-svg .pg{animation:none}
}
.mesa-shell .hd-nav{flex:1;display:flex;justify-content:center;gap:clamp(4px,1vw,14px)}
.mesa-shell .hd-nav a{
    position:relative;
    padding:10px clamp(10px,1.2vw,18px);
    font-family:'Inter',system-ui,sans-serif;font-size:clamp(14px,1.05vw,16px);font-weight:600;letter-spacing:.01em;
    color:rgba(255,255,255,.82);text-decoration:none;border-radius:12px;
    transition:color .3s,background .3s,box-shadow .3s;
  }
.mesa-shell .hd-nav a:hover,.mesa-shell .hd-nav a:focus-visible,.mesa-shell .hd-nav a[aria-current]{
    color:#ffd35a;
    background:radial-gradient(120% 140% at 50% 50%,rgba(255,211,90,.16),rgba(255,211,90,0) 75%);
  }
.mesa-shell .hd-nav a:focus-visible{outline:2px solid rgba(255,211,90,.5);outline-offset:2px}
.mesa-shell .hd-cart{
    flex:none;position:relative;display:grid;place-items:center;
    width:46px;height:46px;border-radius:14px;color:#ffd35a;text-decoration:none;
    background:linear-gradient(145deg,rgba(255,211,90,.18),rgba(240,168,16,.06));
    box-shadow:0 0 0 1px rgba(255,211,90,.25) inset,0 8px 22px -10px rgba(240,168,16,.5);
    transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s,color .3s,box-shadow .3s;
  }
.mesa-shell .hd-cart svg{width:22px;height:22px}
.mesa-shell .hd-cart:hover,.mesa-shell .hd-cart:focus-visible{
    transform:translateY(-2px);color:#1a1204;
    background:linear-gradient(135deg,#ffe08a,#f0a010);
    box-shadow:0 0 0 1px rgba(255,224,138,.5) inset,0 12px 28px -8px rgba(240,168,16,.65);
  }
.mesa-shell .hd-cart:focus-visible{outline:3px solid rgba(255,211,90,.5);outline-offset:3px}
.mesa-shell .hd-menu{display:none;flex:none;width:46px;height:46px;border-radius:14px;border:0;cursor:pointer;color:#ffd35a;
    background:linear-gradient(145deg,rgba(255,211,90,.18),rgba(240,168,16,.06));box-shadow:0 0 0 1px rgba(255,211,90,.25) inset}
.mesa-shell .hd-menu svg{width:22px;height:22px}
@media (max-width:900px){.mesa-shell .hd{gap:12px}
.mesa-shell .hd-logo{margin-right:auto}
.mesa-shell .hd-menu{display:grid;place-items:center}
.mesa-shell .hd-nav{
      position:absolute;left:clamp(20px,3.2vw,56px);right:clamp(20px,3.2vw,56px);top:100%;margin-top:-14px;
      flex-direction:column;gap:2px;padding:10px;border-radius:18px;
      background:linear-gradient(180deg,rgba(14,12,9,.96),rgba(14,12,9,.88));
      box-shadow:0 20px 50px -20px rgba(0,0,0,.8);
      opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .3s,transform .3s;
    }
.mesa-shell .hd.open .hd-nav{opacity:1;transform:none;pointer-events:auto}
.mesa-shell .hd-nav a{padding:14px 16px}

  }

.ft{--ink:#09090a;--ink2:#14120c;--gold:#fdb927;--champ:#ffd36a;--bronze:#c98a12;--paper:#eeeeef;font:500 16px/1.6 Manrope,system-ui,sans-serif;color:var(--paper)}

.ft{position:relative;background:#09090a}
.ft-wave{display:block;width:100%;height:clamp(60px,8vw,120px)}
.ft-in{background:var(--ink);color:var(--paper);margin-top:-1px}
.ft-grid{display:grid;grid-template-columns:2.6fr 1fr 1.9fr 1.5fr;gap:40px;max-width:1560px;margin:0 auto;padding:clamp(36px,5vw,64px) clamp(20px,4vw,48px) 48px}
.ft-brand img{display:block;width:min(230px,100%);height:auto}
.ft-brand p{margin:26px 0 0;max-width:34ch;font-size:15px;font-weight:700;line-height:1.7}
.ft h4{margin:0 0 20px;font-size:17px;font-weight:800;letter-spacing:.03em;color:var(--champ)}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.ft a{color:var(--paper);text-decoration:none;font-size:14.5px;font-weight:600}
.ft a:focus-visible{outline:2px solid var(--champ);outline-offset:4px;border-radius:6px}
.ft-ct{display:grid;gap:10px}
.ft-ct a,.ft-ct div{display:flex;align-items:center;gap:14px}
.ft-ic{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:12px;color:var(--gold);
  border:1px solid rgba(253,185,39,.38);
  background:linear-gradient(145deg,rgba(255,211,106,.14),rgba(253,185,39,.03) 70%),var(--ink2);
  box-shadow:inset 0 1px 0 rgba(255,211,106,.22)}
.ft-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ft-ct span.t{font-size:14.5px;font-weight:600;line-height:1.45}
.ft-bar{border-top:1px solid rgba(253,185,39,.2);padding:24px clamp(20px,4vw,48px);text-align:center;font-size:clamp(15px,1.4vw,18px);font-weight:700;letter-spacing:.02em;color:var(--paper);opacity:1}

/* başlık linkleri + sosyal ikonlar */
.ft h4 a{display:inline-block;color:var(--champ);font-size:inherit;font-weight:inherit;letter-spacing:inherit;transform-origin:left center;transition:transform .25s ease}
.ft h4 a:hover,.ft h4 a:focus-visible{transform:scale(1.15)}
.ft h4 .ft-grow{display:inline-block;transform-origin:left center;transition:transform .25s ease}
.ft h4 .ft-grow:hover{transform:scale(1.15)}
.ft-soc{display:flex;gap:12px;margin-top:26px}
.ft-brand .ft-soc a{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;color:var(--gold);border:1px solid rgba(253,185,39,.38);
  background:linear-gradient(145deg,rgba(255,211,106,.14),rgba(253,185,39,.03) 70%),var(--ink2);box-shadow:inset 0 1px 0 rgba(255,211,106,.22);
  transition:transform .25s ease,background .25s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease}
.ft-brand .ft-soc a:hover,.ft-brand .ft-soc a:focus-visible{transform:translateY(-3px);color:var(--ink);border-color:var(--champ);background:linear-gradient(145deg,var(--champ),var(--gold));box-shadow:0 12px 20px -10px rgba(253,185,39,.7)}
.ft-soc svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ft-soc .wa svg{fill:currentColor;stroke:none}

/* ME-SA filigranı */
.ft-in{position:relative;overflow:hidden}
.ft-wm{position:relative;margin:4px 0 -.16em;text-align:center;white-space:nowrap;user-select:none;pointer-events:none;font:400 clamp(56px,16vw,210px)/1 Michroma,sans-serif;letter-spacing:.04em;background:linear-gradient(180deg,rgba(255,211,106,.5),rgba(253,185,39,.08) 75%,rgba(253,185,39,0));-webkit-background-clip:text;background-clip:text;color:transparent}

/* footer efektleri */
.ft ul a{position:relative;display:inline-block;transition:color .25s ease,transform .25s ease}
.ft ul a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--champ);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.ft ul a:hover,.ft ul a:focus-visible{color:var(--champ);transform:translateX(5px)}
.ft ul a:hover::after,.ft ul a:focus-visible::after{transform:scaleX(1)}
.ft-ct a .t{transition:color .25s ease}
.ft-ic{transition:transform .25s ease,background .25s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease}
.ft-ct a:hover .ft-ic,.ft-ct a:focus-visible .ft-ic{transform:translateY(-3px);color:var(--ink);border-color:var(--champ);
  background:linear-gradient(145deg,var(--champ),var(--gold));box-shadow:0 12px 20px -10px rgba(253,185,39,.7)}
.ft-ct a:hover .t,.ft-ct a:focus-visible .t{color:var(--champ)}
.ft-brand a{display:inline-block}
.ft-brand img{transition:transform .35s ease,filter .35s ease}
.ft-brand a:hover img,.ft-brand a:focus-visible img{transform:translateY(-3px) scale(1.03);filter:brightness(1.18) drop-shadow(0 8px 14px rgba(253,185,39,.28))}
.ft-js .ft-grid>*{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.ft-js.in .ft-grid>*{opacity:1;transform:none}
.ft-js.in .ft-grid>:nth-child(2){transition-delay:.1s}
.ft-js.in .ft-grid>:nth-child(3){transition-delay:.2s}
.ft-js.in .ft-grid>:nth-child(4){transition-delay:.3s}
@media (max-width:1000px){.ft-grid{grid-template-columns:1fr 1fr}.ft-brand{grid-column:1/-1}}
@media (max-width:560px){.ft-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.ft *,.ft *::after{transition:none!important}.ft-js .ft-grid>*{opacity:1!important;transform:none!important}}
/* ===== FOOTER LOGO ANİMASYONU (iletişimdeki logo animasyonu) =====
   Orijinal footer logosuna dokunulmaz; JS yalnızca üstüne aynı boyutta katman ekler. */
.ft-brand>a.fl{position:relative}
.ft-brand>a.fl>img{visibility:hidden}
.ft-brand>a.fl .ft-lg{position:absolute;left:0;top:0;pointer-events:none;transition:transform .35s ease}
.ft-brand>a.fl:hover .ft-lg,.ft-brand>a.fl:focus-visible .ft-lg{transform:translateY(-3px) scale(1.03)}
.ft-brand>a.fl{transition:filter .35s ease}
.ft-brand>a.fl:hover,.ft-brand>a.fl:focus-visible{filter:brightness(1.18) drop-shadow(0 8px 14px rgba(253,185,39,.28))}
.ft-brand>a.fl .ft-lg img{position:absolute;inset:0;width:100%;height:100%;transition:none;opacity:0;transform:translateY(5px) scale(.94);filter:blur(2.5px) brightness(1.6)}
.ft-brand>a.fl .ft-lg .p1{clip-path:inset(57.02% 89.55% 0 0);transform-origin:5% 90%}
.ft-brand>a.fl .ft-lg .p2{clip-path:polygon(0 0,31.82% 0,31.82% 100%,10.45% 100%,10.45% 57.02%,0 57.02%);transform-origin:15% 50%}
.ft-brand>a.fl .ft-lg .p3{clip-path:inset(0 36.59% 45.61% 31.82%)}
.ft-brand>a.fl .ft-lg .p4{clip-path:inset(0 29.32% 45.61% 63.41%)}
.ft-brand>a.fl .ft-lg .p5{clip-path:inset(0 0 45.61% 70.68%)}
.ft-brand>a.fl .ft-lg .p6{clip-path:inset(54.39% 0 0 31.82%)}
.ft-brand>a.fl .ft-lg .sh{transform:none;filter:saturate(.55) brightness(1.9);-webkit-mask:linear-gradient(105deg,transparent 35%,#000 50%,transparent 65%) -150% 0/60% 100% no-repeat;mask:linear-gradient(105deg,transparent 35%,#000 50%,transparent 65%) -150% 0/60% 100% no-repeat}
.ft-lg.go img{animation-duration:14s;animation-timing-function:cubic-bezier(.2,.7,.2,1);animation-iteration-count:infinite;animation-fill-mode:both}
.ft-lg.go .p1{animation-name:ftIn1}.ft-lg.go .p2{animation-name:ftIn2}.ft-lg.go .p3{animation-name:ftIn3}.ft-lg.go .p4{animation-name:ftIn4}.ft-lg.go .p5{animation-name:ftIn5}.ft-lg.go .p6{animation-name:ftIn6}
.ft-lg.go .sh{animation-name:ftShine;animation-timing-function:ease-in-out}
.ft-lg.go{animation:ftGlow 14s ease-in-out infinite}


/* footer: katalog butonu */
.ft-brand .ft-cat{display:inline-flex;align-items:center;gap:10px;margin-top:20px;padding:11px 20px 11px 16px;border-radius:999px;
  font-size:14px;font-weight:800;letter-spacing:.02em;color:#1a1204;
  background:linear-gradient(135deg,#ffe08a,#fdb927 55%,#e89c0c);
  box-shadow:0 10px 24px -12px rgba(253,185,39,.75),inset 0 1px 0 rgba(255,255,255,.45);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,filter .3s ease}
.ft-brand .ft-cat svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.ft-brand .ft-cat:hover,.ft-brand .ft-cat:focus-visible{transform:translateY(-3px);filter:saturate(1.1) brightness(1.05);box-shadow:0 16px 30px -12px rgba(253,185,39,.85),inset 0 1px 0 rgba(255,255,255,.5)}
.ft-brand .ft-cat:hover svg{transform:translateY(2px)}
.ft-brand .ft-cat:focus-visible{outline:2px solid var(--champ);outline-offset:4px}

/* Shared layout, isolated from page-specific headings and grids. */
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:110px}
.mesa-shell{position:absolute;top:0;left:0;right:0;height:0;z-index:100;font-family:Inter,system-ui,sans-serif}
.mesa-shell .hd{position:absolute;z-index:100;background:linear-gradient(180deg,rgba(6,5,4,.96),rgba(6,5,4,.65),transparent);padding-bottom:26px}
.mesa-shell .hd-nav a{text-transform:none;line-height:1.5;white-space:nowrap}
.mesa-shell .lg-svg{animation:none}
.mesa-shell .lg-svg .pg{animation:none}
.mesa-shell .hd-menu{align-items:center;justify-content:center;padding:0}
.mesa-shell .hd-nav[hidden]{display:none!important}
.mesa-inner-page{padding-top:104px}
.ft{padding:0;border:0;display:block;text-align:left}
.ft-grid>*{min-width:0}
.ft-ct .t{overflow-wrap:anywhere}
.ft a[aria-disabled]{cursor:default;opacity:.55}
.offer-list h3 a{display:inline-block;position:relative;z-index:2}
.offer-list h3 a:focus-visible{outline:2px solid #ffd36a;outline-offset:6px}
@media(max-width:900px){.mesa-shell .hd{gap:12px}.mesa-shell .hd-nav{visibility:hidden;max-height:calc(100svh - 110px);overflow-y:auto}.mesa-shell .hd.open .hd-nav{visibility:visible}.mesa-inner-page{padding-top:88px}}
@media(max-width:600px){.ft-grid{grid-template-columns:1fr;gap:32px}.ft-brand{grid-column:auto}.ft-ct a{align-items:flex-start}.ft-ic{width:40px;height:40px}.ft-bar{line-height:1.6}.cta{max-width:100%}.cta .btn{max-width:100%;height:auto;min-height:52px;white-space:normal;text-align:center;padding:14px 22px}.offer-in,.about-in{min-width:0}.offer-list li,.about-tl{min-width:0}.offer-list h3{overflow-wrap:anywhere}}
@media(max-width:600px){
 .pg h1,.ic h1,.ab h1{font-size:clamp(24px,7.5vw,44px)}
 .kgrid{grid-template-columns:minmax(0,1fr)}
 .hero>div{min-width:0;max-width:100%}
 .hero h1.cd{font-size:clamp(36px,9.5vw,54px);overflow-wrap:anywhere}
 .hd2{font-size:clamp(22px,7.1vw,40px)}
 .catalog-in{width:100%;min-width:0}
 .catalog h2{font-size:clamp(28px,8vw,48px)}
 .cat-btn{max-width:100%;padding-inline:22px;font-size:1rem}
 .offer-head h2,.field h2{font-size:clamp(30px,9vw,44px)}
}
@media(max-width:900px) and (max-height:700px){.offer,.about{height:auto}.offer-in,.about-in{position:relative;min-height:0;padding-top:70px;padding-bottom:70px}.offer-list li>*{opacity:1;transform:none}.about-it{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.ft-brand>a.fl>img{visibility:visible}.ft-lg{display:none}}

.cat-btn[aria-disabled]{cursor:default;opacity:.7;pointer-events:none}.catalog .catalog-status{font-size:.9rem;margin-top:16px}

/* Clip horizontal reveal motion without changing the sticky scroll container. */
.offer{overflow-x:clip}
.offer-list li:focus-within>*{opacity:1;transform:none}