/* Yön A — Siyah Kutu. Koyu, sakin; fotoğraf ve tipografi öne çıkar, lila yalnızca mühür çizgisi gibi kullanılır. */
:root{
  color-scheme: light;
  --night:#FFFFFF;
  --night-2:#F7F5F6;
  --night-3:#E8E4E5;
  --line:#E3DEE0;
  --bone:#1F2A30;
  --muted:#5D6A71;
  --dim:#8C979C;
  --accent:#009CBD;
  --accent-d:#037B9F;
  --lilac:#C5A0CE;
  --lilac-d:#9A6FA8;
  --teal:#009CBD;
  --studio:#EEECEE;
  --f-display:"Jost","Futura","Century Gothic","Avenir Next",sans-serif;
  --f-bold:"Lato","Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(16px,5vw,72px);
  --head:64px;
}
:root[data-theme="dark"],:root[data-theme="light"]{color-scheme:light}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--night)}
body{background:var(--night);color:var(--bone);font-family:var(--f-display);font-weight:300;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
h1,h2,h3{font-weight:200;text-wrap:balance}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wrap{padding-inline:var(--gutter)}
.eyebrow{font-weight:500;font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--accent)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;font-size:11.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;border:1px solid currentColor;border-radius:2px;cursor:pointer;background:none;transition:background .25s,color .25s,border-color .25s}
.btn.solid{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn.solid:hover{background:var(--accent-d);border-color:var(--accent-d)}
.btn.line:hover{background:rgba(0,156,189,.06)}

/* ---------- üst bar ---------- */
.top{position:fixed;left:0;right:0;top:0;z-index:60;padding-top:env(safe-area-inset-top,0px);background:rgba(255,255,255,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line);box-shadow:0 1px 18px rgba(31,42,48,.05)}
.top.solid{background:rgba(255,255,255,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--line)}
.top .wrap{height:var(--head);display:flex;align-items:center;justify-content:space-between;gap:20px}
.top .brand img{height:22px;width:auto}
.top nav{display:flex;gap:30px;font-weight:400;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.top nav a:hover{color:var(--accent)}
.top .btn{padding:10px 16px}
.top-r{display:flex;align-items:center;gap:12px}
.lang{position:relative;display:inline-flex;padding:3px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.6)}
.lang::before{content:"";position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:999px;background:var(--accent);box-shadow:0 2px 8px rgba(0,156,189,.3);transition:transform .45s cubic-bezier(.65,0,.25,1)}
.lang[data-on="en"]::before{transform:translateX(100%)}
.lang a,.lang button{position:relative;z-index:1;width:40px;border:0;background:none;padding:6px 0;border-radius:999px;font-family:var(--f-bold);font-weight:700;font-size:11px;letter-spacing:.12em;color:var(--muted);cursor:pointer;transition:color .35s}
.lang a{display:inline-block;text-align:center}
.lang a[aria-current="true"],.lang button[aria-pressed="true"]{color:#fff}
@media (prefers-reduced-motion:reduce){.lang::before{transition:none}}
@media (max-width:860px){.top nav{display:none}}

/* ---------- açılış: Live your miracle → stüdyo → ürünler ---------- */
.oi-track{position:relative;height:420vh}
.oi-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--night)}
.oi-studio{position:absolute;inset:0;background:radial-gradient(90% 80% at 50% 45%,#F1EEEF 0%,#E9E6E7 55%,#D9D4D6 100%);opacity:0}
.oi-open{position:absolute;inset:0;display:flex;align-items:center;z-index:8;padding:var(--head) var(--gutter) 0;pointer-events:none}
.oi-glow{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.oi-glow i{position:absolute;border-radius:50%;filter:blur(60px);opacity:0}
.oi-glow i:nth-child(1){width:46vw;height:46vw;right:-8vw;top:-12vw;background:radial-gradient(closest-side,rgba(197,160,206,.28),transparent);animation:oiFade 2.4s ease .2s forwards,oiD1 18s ease-in-out 1s infinite alternate}
.oi-glow i:nth-child(2){width:38vw;height:38vw;left:-10vw;bottom:-14vw;background:radial-gradient(closest-side,rgba(197,160,206,.16),transparent);animation:oiFade 2.4s ease .6s forwards,oiD2 22s ease-in-out 1s infinite alternate}
@keyframes oiD1{to{transform:translate(-14vw,8vh) scale(1.15)}}
@keyframes oiD2{to{transform:translate(-8vw,-10vh) scale(.9)}}
@keyframes oiFade{to{opacity:1}}
@keyframes oiRise{to{opacity:1;transform:none}}
@keyframes oiDraw{to{transform:scaleX(1)}}
@keyframes oiWrite{to{clip-path:inset(-10% 0 -10% 0)}}
@keyframes oiPen{0%{left:0;opacity:0}8%{opacity:1}35%{top:48%}60%{top:66%}90%{opacity:1}100%{left:100%;top:52%;opacity:0}}
.oi-hero{position:relative;width:100%}
.oi-hero .eyebrow{opacity:0;transform:translateY(16px);animation:oiRise .9s cubic-bezier(.2,.7,.2,1) .2s forwards}
.oi-write{position:relative;width:min(1000px,88vw);margin-top:clamp(26px,4vh,44px)}
.oi-write img{width:100%;height:auto;clip-path:inset(-10% 100% -10% 0);animation:oiWrite 2.1s cubic-bezier(.45,.05,.35,1) 1.3s forwards}
.oi-pen{position:absolute;top:62%;left:0;width:9px;height:9px;margin:-4px 0 0 -4px;border-radius:50%;background:#fff;box-shadow:0 0 14px 5px rgba(197,160,206,.95),0 0 46px 14px rgba(197,160,206,.35);opacity:0;animation:oiPen 2.1s cubic-bezier(.45,.05,.35,1) 1.3s forwards}
.oi-hero h1{margin-top:clamp(18px,3vh,30px);font-weight:200;font-size:clamp(34px,4.8vw,76px);line-height:.98;letter-spacing:-.025em}
.oi-hero h1 span{display:inline-block;opacity:0;transform:translateY(28px);animation:oiRise 1s cubic-bezier(.2,.7,.2,1) forwards}
.oi-hero h1 span:nth-child(1){animation-delay:3.1s}
.oi-hero h1 span:nth-child(2){animation-delay:3.2s;font-weight:500}
.oi-hero h1 span:nth-child(3){animation-delay:3.3s}
.oi-rule{height:1px;margin-top:clamp(28px,5vh,52px);width:min(520px,70vw);background:linear-gradient(90deg,var(--lilac),rgba(197,160,206,.15) 60%,transparent);transform:scaleX(0);transform-origin:left;animation:oiDraw 1.4s cubic-bezier(.2,.7,.2,1) 3.1s forwards}
.oi-hero{display:flex;flex-direction:column;align-items:center;text-align:center}
.oi-logo{width:min(860px,82vw);height:auto;opacity:0;transform:translateY(22px) scale(.97);filter:blur(6px);animation:oiLogo 1.5s cubic-bezier(.2,.7,.2,1) .2s forwards}
@keyframes oiLogo{to{opacity:1;transform:none;filter:blur(0)}}
.oi-hero .oi-write{width:min(560px,62vw);margin-top:clamp(18px,3vh,34px)}
.oi-hero h1{font-size:clamp(18px,1.8vw,26px);font-weight:300;letter-spacing:.02em;color:var(--muted);margin-top:clamp(16px,2.6vh,26px)}
.oi-hero .oi-rule{margin-left:auto;margin-right:auto;width:min(320px,50vw);background:linear-gradient(90deg,transparent,var(--lilac),transparent);transform-origin:center}
.oi-scr{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:9;display:flex;flex-direction:column;align-items:center;gap:10px;font-size:10.5px;letter-spacing:.3em;color:var(--dim);text-transform:uppercase;opacity:0;animation:oiFade 1s ease 3.4s forwards}
.oi-scr i{width:1px;height:44px;background:linear-gradient(var(--lilac),transparent)}
.oi-shot{position:absolute;inset:0;opacity:0;z-index:2}
.oi-pic{position:absolute;left:50%;top:52%;height:84%;aspect-ratio:1376/768;transform:translate(-50%,-50%)}
.oi-pic img{width:100%;height:100%;object-fit:cover;-webkit-mask-image:radial-gradient(42% 60% at 50% 52%,#000 66%,transparent 100%);mask-image:radial-gradient(42% 60% at 50% 52%,#000 66%,transparent 100%);will-change:transform,filter}
.oi-shot.full .oi-pic{top:50%;height:100%;min-width:100%}
.oi-shot.full .oi-pic img{-webkit-mask-image:none;mask-image:none}
.oi-shot.full::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.9) 30%,rgba(255,255,255,.55) 48%,transparent 64%);pointer-events:none}
.oi-txt{position:absolute;left:var(--gutter);bottom:clamp(28px,12vh,130px);max-width:min(560px,86vw);z-index:4;color:#0E1418;opacity:0}
.oi-txt .n{display:inline-block;font-family:var(--f-bold);font-weight:900;font-size:13.5px;letter-spacing:.26em;text-transform:uppercase;color:#6B3E7A;padding-left:34px;position:relative}
.oi-txt .n::before{content:"";position:absolute;left:0;top:50%;width:22px;height:2px;background:#9A6FA8}
.oi-txt h2{font-weight:400;font-size:clamp(32px,3.8vw,58px);line-height:1.02;letter-spacing:-.015em;margin:18px 0 20px;color:#0E1418}
.oi-txt p{font-size:clamp(18px,1.5vw,23px);font-weight:400;color:#26323A;line-height:1.55;max-width:32ch}
.oi-shot.full .oi-txt{bottom:auto;top:50%;transform:translateY(-50%)}
.oi-shot.full .oi-txt h2{font-size:clamp(50px,6.6vw,108px)}
.oi-side{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:22px;text-align:right;z-index:4;opacity:0}
.oi-side div{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#8B868A}
.oi-side b{display:block;font-weight:400;font-size:15px;letter-spacing:.04em;text-transform:none;color:#121214;margin-top:4px}
.oi-count{position:absolute;left:var(--gutter);top:calc(var(--head) + 30px);font-family:var(--f-bold);font-weight:700;font-size:12px;letter-spacing:.24em;color:#8B868A;z-index:6;opacity:0}
.oi-count b{color:#121214}
.oi-end{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:20px;z-index:10;opacity:0;padding:0 20px;pointer-events:none}
.oi-end.on{pointer-events:auto}
.oi-end h3{font-weight:200;font-size:clamp(40px,6vw,96px);line-height:1.02;letter-spacing:-.02em}
.oi-end h3 em{font-style:normal;color:var(--lilac-d)}
.oi-end p{color:var(--muted);font-size:16px;max-width:46ch}
.oi-end .cta{display:flex;gap:12px;margin-top:10px;flex-wrap:wrap;justify-content:center}
.top .brand{transition:opacity .5s}
.top nav a{position:relative;padding-block:6px}
.top nav a.on{color:var(--accent)}
.top nav a.on::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent)}
@media (max-width:760px){
  .oi-pic{height:62%;top:40%}
  .oi-shot.full .oi-pic{height:100%;top:50%}
  .oi-shot.full::after{background:linear-gradient(0deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 34%,rgba(255,255,255,.5) 52%,transparent 66%)}
  .oi-shot.full .oi-txt{top:auto;bottom:60px;transform:none}
  .oi-side{display:none}
  .oi-txt{bottom:56px}
  .oi-txt h2,.oi-shot.full .oi-txt h2{font-size:clamp(38px,11vw,52px);margin:12px 0 12px}
  .oi-txt p{font-size:16.5px}
  .oi-txt .n{font-size:12.5px}
}
@media (prefers-reduced-motion:reduce){
  .oi-glow i,.oi-logo,.oi-hero h1 span,.oi-rule,.oi-scr{animation:none;opacity:1;transform:none}
  .oi-write img{animation:none;clip-path:none}.oi-pen{display:none}
}

/* ---------- bölgeye göre bul ---------- */
#bolge{position:relative;z-index:20;margin-top:-100vh;margin-top:-100svh;min-height:100vh;min-height:100svh;background:#fff;border-radius:28px 28px 0 0;box-shadow:0 -30px 70px rgba(31,42,48,.14);padding-block:calc(var(--head) + clamp(40px,7vh,90px)) 40px}
#bzTitle{scroll-margin-top:calc(var(--head) + 16px)}
.bz{display:grid;grid-template-columns:minmax(260px,400px) 1fr;gap:clamp(28px,5vw,72px);align-items:start;margin-top:34px}
.bz-left{position:sticky;top:calc(var(--head) + 20px)}
.bz-toggle{position:relative;display:inline-flex;padding:5px;border:1px solid var(--line);border-radius:999px}
.bz-toggle::before{content:"";position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:var(--accent);box-shadow:0 3px 10px rgba(0,156,189,.3);transition:transform .45s cubic-bezier(.65,0,.25,1)}
.bz-toggle[data-on="m"]::before{transform:translateX(100%)}
.bz-toggle button{position:relative;z-index:1;width:112px;border:0;background:none;padding:10px 0;border-radius:999px;font-size:14px;letter-spacing:.06em;color:var(--muted);cursor:pointer;transition:color .35s}
.bz-toggle button[aria-pressed="true"]{color:#fff}
@media (prefers-reduced-motion:reduce){.bz-toggle::before{transition:none}}
.bz-fig{position:relative;margin-top:18px;aspect-ratio:768/1376;border-radius:18px;overflow:hidden;background:#EEEBEC}
.bz-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s ease}
.bz-fig img.off{opacity:0}
.bz-dot{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border:0;background:none;cursor:pointer;padding:0;transition:opacity .4s}
.bz-dot.off{opacity:0;pointer-events:none}
.bz-dot::before{content:"";position:absolute;left:50%;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(0,156,189,.16),0 0 12px rgba(0,156,189,.45)}
.bz-dot::after{content:"";position:absolute;inset:4px;border-radius:50%;border:1px solid rgba(0,156,189,.6);animation:bzPulse 2.4s ease-out infinite;opacity:0}
.bz-dot.on::after{animation:none;opacity:1;inset:0;border:1.5px solid var(--accent)}
.bz-dot.on::before{background:#fff}
.bz-dot span{position:absolute;left:50%;bottom:calc(100% + 4px);transform:translateX(-50%);white-space:nowrap;font-size:11px;letter-spacing:.18em;text-transform:uppercase;background:rgba(31,42,48,.9);color:#fff;padding:5px 9px;opacity:0;transition:opacity .2s;pointer-events:none}
.bz-dot:hover span,.bz-dot:focus-visible span,.bz-dot.on.lab span{opacity:1}
@keyframes bzPulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(1.6);opacity:0}}
.bz-zones{display:grid;grid-template-columns:1fr 1fr;column-gap:28px}
.bz-zones button{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 2px;border:0;border-bottom:1px dashed var(--line);background:none;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);cursor:pointer;text-align:left;transition:color .25s,padding .25s}
.bz-zones button small{font-family:var(--f-bold);font-weight:700;font-size:11px;letter-spacing:.08em;color:var(--dim)}
.bz-zones button:hover,.bz-zones button[aria-pressed="true"]{color:var(--accent)}
.bz-zones button[aria-pressed="true"]{padding-left:10px}
.bz-zones button[aria-pressed="true"] small{color:var(--accent)}
.bz-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-top:34px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.bz-head h3{font-weight:300;font-size:clamp(24px,2.4vw,34px);letter-spacing:-.01em}
.bz-head h3 em{font-style:normal;color:var(--accent)}
.bz-head p{font-size:13px;color:var(--muted)}
.bz-res{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:30px 16px;margin-top:22px}
.bz-res .card .tr{font-size:14px}
.bz-res .card{animation:bzIn .5s cubic-bezier(.2,.7,.2,1) both}
@keyframes bzIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (max-width:860px){
  .bz{grid-template-columns:1fr}
  .bz-left{position:static;display:flex;flex-direction:column;align-items:center}
  .bz-fig{width:min(320px,78vw)}
  .bz-res{grid-template-columns:repeat(2,1fr)}
}
@media (prefers-reduced-motion:reduce){.bz-dot::after,.bz-res .card{animation:none}}

/* ---------- bölüm başlıkları ---------- */
.sh{display:flex;align-items:end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.sh h2{font-size:clamp(34px,4.6vw,68px);line-height:1;letter-spacing:-.02em}
.sh h2 b{font-weight:500}
.sh p{max-width:46ch;color:var(--muted);font-size:15px}

/* ---------- koleksiyon dizini ---------- */
#dizin{padding-block:clamp(80px,11vw,150px)}
.index{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,5vw,80px);margin-top:44px;align-items:start}
.index ul{list-style:none;border-top:1px solid var(--line)}
.index li > button{width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-block:16px;border:0;border-bottom:1px solid var(--line);background:none;cursor:pointer;text-align:left;transition:padding .35s cubic-bezier(.2,.7,.2,1),color .25s}
.index li > button span{font-size:clamp(20px,2.3vw,32px);font-weight:200;letter-spacing:-.01em}
.index li > button small{font-family:var(--f-bold);font-weight:700;font-size:12px;color:var(--dim);letter-spacing:.1em}
.index li > button:hover,.index li > button.on{padding-left:14px;color:var(--accent)}
.index li > button:hover small,.index li > button.on small{color:var(--accent)}
.preview{position:sticky;top:calc(var(--head) + 24px);aspect-ratio:3/4;overflow:hidden;background:var(--studio)}
.preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .45s ease}
.preview .cap{position:absolute;left:16px;bottom:14px;z-index:1;font-size:12px;color:var(--bone);background:rgba(255,255,255,.88);padding:5px 10px;letter-spacing:.06em}
.preview .cap b{font-family:var(--f-bold);font-weight:900;margin-right:8px}
@media (max-width:860px){.index{grid-template-columns:1fr}.preview{display:none}}
.index li{scroll-margin-top:calc(var(--head) + 16px)}
.index li > button i{font-style:normal;display:inline-block;margin-left:14px;font-size:14px;color:var(--dim);transition:transform .4s cubic-bezier(.2,.7,.2,1),color .25s}
.index li > button[aria-expanded="true"]{padding-left:14px;color:var(--accent)}
.index li > button[aria-expanded="true"] i{transform:rotate(180deg);color:var(--accent)}
.index li > button[aria-expanded="true"] small{color:var(--accent)}
.stair{padding:30px 0 34px;border-bottom:1px solid var(--line)}
.stair-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 18px}
.stair-grid>.card:nth-child(3n+2){margin-top:58px}
.stair-grid>.card:nth-child(3n+3){margin-top:116px}
.stair-grid>.card{opacity:0;animation:stairIn .7s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(var(--i) * 90ms)}
.stair-grid .card .tr{font-size:14px}
@keyframes stairIn{from{opacity:0;transform:translateY(-34px)}to{opacity:1;transform:none}}
.stair-more{display:flex;justify-content:flex-end;margin-top:26px}
.stair-more a{font-family:var(--f-bold);font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid currentColor;padding-bottom:3px}
.stair-more a:hover{color:var(--accent-d)}
@media (max-width:600px){.stair-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}.stair-grid>.card:nth-child(n){margin-top:0}.stair-grid>.card:nth-child(2n){margin-top:64px}}
@media (prefers-reduced-motion:reduce){.stair-grid>.card{animation:none;opacity:1}}

/* ---------- katalog sayfası ---------- */
.kat-page{padding-top:calc(var(--head) + clamp(36px,6vw,80px));padding-bottom:20px;min-height:100vh;animation:katIn .5s cubic-bezier(.2,.7,.2,1)}
.kat-page h1{font-weight:300;font-size:clamp(40px,5.6vw,84px);line-height:1;letter-spacing:-.02em}
.kat-page h1 b{font-weight:500;color:var(--accent)}
.crumb{display:flex;gap:10px;align-items:center;margin-bottom:26px;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.crumb a:hover{color:var(--accent)}
.crumb b{font-weight:400;color:var(--bone)}
@keyframes katIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.kat-page{animation:none}}

.tools{display:flex;gap:16px 28px;align-items:center;justify-content:space-between;margin-top:34px;flex-wrap:wrap}
.search{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--muted);padding-block:9px;min-width:min(340px,100%)}
.search svg{width:16px;height:16px;flex:none;stroke:var(--muted);fill:none;stroke-width:1.8}
.search input{border:0;outline:0;background:transparent;width:100%;font-size:15px;font-weight:300}
.search input::placeholder{color:var(--dim)}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid var(--line);background:transparent;font-weight:400;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;border-radius:2px;color:var(--muted);transition:border-color .15s,background .15s,color .15s}
.chip small{font-family:var(--f-bold);font-weight:700;font-size:10.5px;color:var(--dim)}
.chip:hover{border-color:var(--accent)}
.chip[aria-current="page"],.chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.chip[aria-pressed="true"] small{color:var(--dim)}
@media (max-width:640px){.filters{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter);padding-bottom:6px;scrollbar-width:none}.filters::-webkit-scrollbar{display:none}.chip{flex:none}}
.count{margin-top:22px;font-size:13px;color:var(--dim)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:40px 18px;margin-top:18px}
.card{display:flex;flex-direction:column;text-align:left;background:none;border:0;padding:0;cursor:pointer}
.card .ph{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--studio)}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.card .ph.cut img{object-fit:contain;padding:8% 6% 0;object-position:50% 100%}
.card:hover .ph img{transform:scale(1.035)}
.card .ph::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.card:hover .ph::after{transform:scaleX(1)}
.uni{position:absolute;top:10px;right:10px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(13,13,14,.5);display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--f-bold);font-weight:900;font-size:8px;line-height:1.05;color:var(--night);letter-spacing:.05em;background:rgba(242,240,239,.7)}
.card .code{margin-top:14px;font-family:var(--f-bold);font-weight:900;font-size:13px;letter-spacing:.12em}
.card .tr{margin-top:4px;font-size:15px;line-height:1.35;font-weight:300}
.card .en{font-size:12.5px;color:var(--dim);line-height:1.4}
.card .row{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12px;color:var(--muted)}
.sw{display:inline-flex;gap:5px}
.sw span{width:18px;height:5px;border:1px solid rgba(0,0,0,.14)}
.card .row .sz{margin-left:auto;font-family:var(--f-bold);font-weight:700;letter-spacing:.08em;color:var(--muted)}
.empty{grid-column:1/-1;padding-block:40px;color:var(--muted)}

/* ---------- ürün paneli ---------- */
.dlg{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(20,32,38,.42);backdrop-filter:blur(4px)}
.dlg[hidden]{display:none!important}
.sheet{position:relative;width:min(1040px,100%);max-height:92vh;overflow:auto;background:var(--night-2);border:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:860px){.sheet{grid-template-columns:1fr}}
.sheet .x{position:absolute;top:12px;right:12px;z-index:2;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--night);color:var(--bone);cursor:pointer;font-size:20px;line-height:1}
.pics{background:var(--studio);display:flex;flex-direction:column}
.pics .big{flex:1;display:flex;align-items:flex-end;justify-content:center}
.pics .big img{width:100%;height:auto}
.pics.cut .big{padding:30px 24px 0}
.pics.cut .big img{width:auto;max-height:480px}
.thumbs{display:flex;gap:8px;padding:12px}
.thumbs button{width:52px;height:64px;border:1px solid rgba(0,0,0,.15);background:#fff;cursor:pointer;display:flex;align-items:flex-end;justify-content:center;padding:3px}
.thumbs button img{max-height:100%}
.thumbs button[aria-pressed="true"]{border-color:var(--accent)}
.info{padding:34px 30px 30px;min-width:0}
.info .code{font-family:var(--f-bold);font-weight:900;font-size:13px;letter-spacing:.14em;color:var(--accent)}
.info h3{margin-top:10px;font-size:clamp(24px,2.6vw,34px);line-height:1.12}
.info .en{margin-top:6px;color:var(--dim);font-size:14px}
.facts{margin-top:24px;border-top:1px solid var(--line)}
.facts div{display:flex;justify-content:space-between;gap:16px;padding-block:11px;border-bottom:1px solid var(--line);font-size:14px}
.facts dt{color:var(--dim);font-weight:400;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.facts dd{text-align:right}
.tablewrap{overflow-x:auto;margin-top:22px;border:1px solid var(--line)}
table{border-collapse:collapse;width:100%;min-width:320px;font-family:var(--f-bold);font-size:12px;font-variant-numeric:tabular-nums}
th,td{padding:8px;text-align:center;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
th{background:var(--night-3);font-weight:900;font-size:11px;letter-spacing:.06em}
td{color:var(--bone)}
td:first-child,th:first-child{text-align:left;font-family:var(--f-display);font-weight:400;color:var(--dim);white-space:nowrap}
tr:last-child td{border-bottom:0}
th:last-child,td:last-child{border-right:0}
.note{margin-top:8px;font-size:12px;color:var(--dim)}
.ask{margin-top:24px;padding:16px 18px;border:1px solid var(--line);border-left:2px solid var(--accent)}
.ask p{font-size:13.5px;color:var(--muted)}
.ask .row{display:flex;align-items:center;gap:12px;margin-top:10px;flex-wrap:wrap}
.ask code{font-family:var(--f-bold);font-weight:700;font-size:14.5px;user-select:all;word-break:break-all}
.ask button{padding:7px 12px;border:1px solid var(--bone);background:none;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.ask button:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.nav2{display:flex;gap:10px;margin-top:18px}
.nav2 button{flex:1;padding:11px;border:1px solid var(--line);background:none;cursor:pointer;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.nav2 button:hover{border-color:var(--bone);color:var(--bone)}

/* ---------- toptan ---------- */
/* ---------- alt bölüm (Flexion tarzı) ---------- */
.ft{position:relative;overflow:hidden;background:#F5F3F4;border-top:1px solid var(--line);margin-top:clamp(60px,9vw,120px)}
.ft-k{display:block;font-family:var(--f-bold);font-weight:700;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.ft-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:stretch;padding-block:clamp(70px,9vw,120px) clamp(40px,5vw,64px)}
.ft-lead{display:flex;flex-direction:column}
.ft-lead>p{margin-top:clamp(26px,3vw,40px);font-size:16px;color:var(--muted);max-width:42ch}
.ft-place{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 18px 50px rgba(31,42,48,.08)}
.ft-place .fv-map{flex:1;min-height:280px;border:0;border-radius:0;box-shadow:none}
.fv-card{padding:clamp(22px,2.6vw,32px);border-top:1px solid var(--line)}
.fv-card h3{margin-top:10px;font-weight:400;font-size:clamp(22px,2vw,28px);letter-spacing:-.01em;line-height:1.15}
.fv-card h3 sup{font-size:.45em;vertical-align:super}
.fv-card dl{display:grid;grid-template-columns:1.3fr 1fr;gap:18px 24px;margin-top:20px}
.fv-card dt{font-family:var(--f-bold);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.fv-card dd{margin-top:5px;font-size:15.5px;line-height:1.5;color:var(--bone)}
.fv-card .btn{margin-top:22px;padding:12px 20px}
.fv-card .fv-open{display:flex}
.fv-time{display:block;margin-top:2px;font-size:19px;font-weight:500;white-space:nowrap;padding-left:16px}
.ft-lead h2{margin-top:0;font-weight:300;font-size:clamp(34px,4.4vw,64px);line-height:1.02;letter-spacing:-.02em}
.ft-lead h2 b{font-weight:500;color:var(--accent)}
.ft .script{width:min(340px,72vw);margin-top:22px}
.ft-btns{display:grid;gap:10px;margin-top:20px}
.ft-btn{display:flex;align-items:center;gap:16px;padding:16px 20px;background:#fff;border:1px solid var(--line);border-radius:14px;transition:border-color .25s,transform .25s,box-shadow .25s}
.ft-btn:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,156,189,.12)}
.ft-btn svg{width:22px;height:22px;flex:none;fill:var(--accent)}
.ft-btn span{display:flex;flex-direction:column;font-family:var(--f-bold);font-weight:700;font-size:16px;letter-spacing:.02em;color:var(--bone);word-break:break-word}
.ft-btn small{font-family:var(--f-display);font-weight:400;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-bottom:2px}
.ft-btn.wa{background:var(--accent);border-color:var(--accent)}
.ft-btn.wa svg{fill:#fff}
.ft-btn.wa span,.ft-btn.wa small{color:#fff}
.ft-btn.wa:hover{background:var(--accent-d);border-color:var(--accent-d)}
.ft-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;padding-block:34px 10px;border-top:1px solid var(--line)}
.ft-cols p{margin-top:12px;font-size:14px;line-height:1.6;color:var(--muted);max-width:34ch}
.ft-links{display:flex;flex-direction:column;gap:6px}
.ft-links a{color:var(--bone);transition:color .2s}
.ft-links a:hover{color:var(--accent)}
.ft-mark{position:relative;padding:clamp(30px,5vw,70px) var(--gutter) 0}
.ft-logo{position:relative;z-index:1;display:block;width:100%;height:auto;fill:var(--accent-d)}
.ft-glow{position:absolute;left:0;right:0;bottom:-30%;height:90%;background:radial-gradient(40% 60% at 30% 70%,rgba(0,156,189,.28),transparent 70%),radial-gradient(40% 60% at 70% 75%,rgba(197,160,206,.55),transparent 70%);filter:blur(30px);pointer-events:none}
.ft-bot{position:relative;z-index:2;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-block:18px 26px;font-size:12px;color:var(--muted)}
.ft-bot a:hover{color:var(--accent)}
.ft-visit{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:stretch;padding-block:clamp(36px,5vw,60px);border-top:1px solid var(--line)}
.fv-info h3{margin-top:12px;font-weight:400;font-size:clamp(24px,2.4vw,34px);letter-spacing:-.01em;line-height:1.15}
.fv-info h3 sup{font-size:.45em;vertical-align:super}
.fv-info dl{display:grid;gap:18px;margin-top:26px}
.fv-info dt{font-family:var(--f-bold);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.fv-info dd{margin-top:5px;font-size:17px;line-height:1.5;color:var(--bone)}
.fv-info dd a:hover{color:var(--accent)}
.fv-open{display:inline-flex;align-items:center;gap:8px;margin-right:6px}
.fv-open i{width:8px;height:8px;border-radius:50%;background:#2BB673;box-shadow:0 0 0 4px rgba(43,182,115,.16)}
.fv-open b{font-weight:500}
.fv-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.fv-btns .btn{padding:13px 20px}
.fv-map{position:relative;display:block;min-height:320px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#EEF4F5;box-shadow:0 18px 50px rgba(31,42,48,.08)}
.fv-map svg{position:absolute;inset:0;width:100%;height:100%;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.fv-map:hover svg{transform:scale(1.04)}
.fv-pin{position:absolute;left:58%;top:47%;width:34px;height:34px;margin:-34px 0 0 -17px;border-radius:50% 50% 50% 0;background:var(--accent);transform:rotate(-45deg);box-shadow:0 8px 20px rgba(0,156,189,.4)}
.fv-pin i{position:absolute;inset:10px;border-radius:50%;background:#fff}
.fv-pin::after{content:"";position:absolute;left:50%;top:50%;width:70px;height:70px;margin:-35px 0 0 -35px;border-radius:50%;border:2px solid rgba(0,156,189,.45);animation:fvPulse 2.4s ease-out infinite}
@keyframes fvPulse{from{transform:scale(.3);opacity:1}to{transform:scale(1.6);opacity:0}}
.fv-tag{position:absolute;left:calc(58% + 26px);top:calc(47% - 58px);display:flex;flex-direction:column;padding:9px 14px;background:#fff;border-radius:10px;box-shadow:0 8px 24px rgba(31,42,48,.14);font-size:14px;color:var(--bone)}
.fv-tag small{font-size:11.5px;color:var(--muted);letter-spacing:.04em}
.fv-open-map{position:absolute;right:14px;bottom:14px;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.94);font-family:var(--f-bold);font-weight:700;font-size:11.5px;letter-spacing:.1em;color:var(--accent-d);box-shadow:0 4px 14px rgba(31,42,48,.1)}
.fv-map:hover .fv-open-map{background:var(--accent);color:#fff}
@media (prefers-reduced-motion:reduce){.fv-pin::after{animation:none}}
@media (max-width:860px){.ft-top{grid-template-columns:1fr}.ft-cols{grid-template-columns:1fr 1fr}.fv-card dl{grid-template-columns:1fr}.ft-place .fv-map{min-height:240px}.fv-tag{left:auto;right:12px;top:14px}}
@media (max-width:520px){.ft-cols{grid-template-columns:1fr}}
@media (prefers-reduced-motion: reduce){.hint i{animation:none}*{scroll-behavior:auto}}

/* ---------- SEO / içerik ekleri ---------- */
.oi-tag{margin-top:clamp(14px,2.4vh,24px);font-family:var(--f-display);font-weight:400;font-size:clamp(16px,1.45vw,21px);letter-spacing:.03em;color:var(--muted);opacity:0;animation:oiFade 1.2s ease 2.6s forwards;max-width:90vw}
@media (prefers-reduced-motion:reduce){.oi-tag{animation:none;opacity:1}}
.idx-static a{display:flex;justify-content:space-between;padding-block:16px;border-bottom:1px solid var(--line);font-size:clamp(20px,2.3vw,32px);font-weight:200}
#hakkimizda{padding-block:clamp(70px,10vw,130px) 0;border-top:1px solid var(--line)}
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,96px);margin-top:40px;align-items:start}
.about-txt p{font-size:clamp(17px,1.3vw,19px);line-height:1.65;color:var(--bone);max-width:56ch}
.about-txt p+p{margin-top:16px;color:var(--muted)}
.facts-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:30px}
.facts-list div{background:#fff;padding:16px 18px}
.facts-list dt{font-family:var(--f-bold);font-weight:700;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.facts-list dd{margin-top:4px;font-size:16px;color:var(--bone)}
.faq h3{font-family:var(--f-bold);font-weight:700;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);margin-bottom:10px}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:18px 0;font-size:clamp(17px,1.4vw,20px);font-weight:400;color:var(--bone)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;line-height:1;color:var(--accent);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 20px;font-size:15.5px;line-height:1.65;color:var(--muted);max-width:60ch}
.faq details p a{color:var(--accent);border-bottom:1px solid currentColor}
@media (max-width:860px){.about{grid-template-columns:1fr}}
.kat-group{margin-top:56px}
.kat-group h2{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--line);font-weight:300;font-size:clamp(24px,2.4vw,34px);letter-spacing:-.01em}
.kat-group h2 a:hover{color:var(--accent)}
.kat-group h2 small{font-family:var(--f-bold);font-weight:700;font-size:12px;letter-spacing:.1em;color:var(--dim)}
.kat-lead{max-width:62ch;margin-top:18px;font-size:16px;line-height:1.65;color:var(--muted)}
.spec{margin-top:clamp(60px,8vw,100px)}
.spec h2{font-weight:300;font-size:clamp(26px,2.6vw,38px);letter-spacing:-.01em}
.spec .tw{overflow-x:auto;margin-top:20px}
.spec table{width:100%;border-collapse:collapse;font-size:14.5px}
.spec th,.spec td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.spec th{font-family:var(--f-bold);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.spec td b{font-family:var(--f-bold);font-weight:900;letter-spacing:.08em}
.sizes{margin-top:28px}
.sizes details{border-bottom:1px solid var(--line)}
.sizes summary{cursor:pointer;padding:14px 0;font-size:16px}
.sizes summary b{font-family:var(--f-bold);font-weight:900;letter-spacing:.08em;margin-right:10px}
.sizes table{border-collapse:collapse;font-size:14px;margin:4px 0 18px}
.sizes th,.sizes td{padding:8px 12px;border:1px solid var(--line);text-align:center}
.sizes td:first-child{text-align:left;color:var(--muted)}
.kat-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-top:50px;padding:24px 26px;border:1px solid var(--line);border-radius:14px;background:var(--night-2)}
.top .btn{white-space:nowrap}
@media (max-width:420px){.top .btn{padding:9px 11px;letter-spacing:.12em}.top-r{gap:8px}}
.kat-cta p{font-size:16px;color:var(--bone);max-width:52ch}