/* RTR Atölye: ortak stil (tüm sayfalar) */

/* ---------- yazı tipleri (siteyle birlikte barındırılır; SIL OFL 1.1) ---------- */
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/instrument-sans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/instrument-sans-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- renk ve ölçü ---------- */
:root{
  --espresso:#15110d;   /* zemin */
  --walnut:#1e1813;     /* yükseltilmiş yüzey */
  --bark:#2a221b;       /* kart / çizim zemini */
  --ground:#0b0907;     /* alt bilgi zemini (en koyu) */
  --brand:#6f390c;      /* logo kahvesi */
  --amber:#c49464;      /* ince vurgu, ölçü çizgisi */
  --linen:#ede6db;      /* ana metin */
  --sawdust:#b8a996;    /* ikincil metin */
  --mute:#978877;       /* üçüncül metin (koyu zeminde AA) */
  --rule:rgba(237,230,219,.12);
  --rule2:rgba(237,230,219,.26);
  --serif:"Instrument Serif","Times New Roman",Georgia,serif;
  --sans:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gut:clamp(20px,4vw,56px);
  --tabh:0px;           /* telefondaki alt menünün yüksekliği (yalnız 760 px altında) */
}
/* çentikli telefonda yatay tutunca yazılar çentiğin altına girmesin (viewport-fit=cover) */
@supports (padding:max(0px)){:root{--gut:max(clamp(20px,4vw,56px),env(safe-area-inset-left),env(safe-area-inset-right))}}
:root{color-scheme:dark}
*{box-sizing:border-box;margin:0;padding:0}
a,button,label,summary{-webkit-tap-highlight-color:transparent}
h1,h2,h3,h4{text-wrap:balance}
p,li,dd,figcaption{text-wrap:pretty}
/* tarayıcının otomatik doldurduğu alanlar koyu zeminde kalsın (--af: alanın zemin rengi) */
input:-webkit-autofill,textarea:-webkit-autofill,select:-webkit-autofill{-webkit-text-fill-color:var(--linen);caret-color:var(--linen);-webkit-box-shadow:0 0 0 60px var(--af,var(--espresso)) inset;transition:background-color 99999s}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{background:var(--espresso);color:var(--linen);font:400 16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
a{color:inherit}
img{display:block;max-width:100%}
button{font-family:inherit;color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:1px solid var(--amber);outline-offset:4px}
::selection{background:rgba(196,148,100,.35)}
.wrap{width:min(1360px,100% - 2*var(--gut));margin-inline:auto}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1;letter-spacing:-.012em}
h2{font-size:clamp(44px,5vw,80px)}
.lead{color:var(--sawdust);max-width:48ch;font-size:17px;line-height:1.65}
.num-label{display:block;font:500 12px/1 var(--sans);letter-spacing:.14em;color:var(--amber);margin-bottom:26px;font-variant-numeric:tabular-nums}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--linen);color:var(--espresso);padding:10px 14px;text-decoration:none;font-size:14px}
.skip:focus{left:8px}

/* ---------- üst menü ---------- */
.site-head{position:relative;z-index:10}
.site-head.over{position:absolute;inset:0 0 auto}
.bar{display:flex;align-items:center;justify-content:space-between;gap:24px;height:124px}
.bar .logo{display:block;flex:none}
.bar .logo img{height:76px;width:auto}
.bar nav{display:flex;gap:34px;align-items:center;font:500 15px/1 var(--sans);letter-spacing:.015em}
.bar nav a{position:relative;text-decoration:none;color:var(--linen);opacity:.92;transition:opacity .2s;padding:12px 0;text-shadow:0 1px 10px rgba(0,0,0,.45)}
.bar nav a:not(.cta)::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:var(--amber);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.bar nav a:hover,.bar nav a[aria-current]{opacity:1}
.bar nav a:hover::after,.bar nav a[aria-current]::after{transform:scaleX(1)}
.bar nav .cta{opacity:1;padding:14px 22px;background:var(--linen);color:var(--espresso);text-shadow:none;transition:background .2s}
.bar nav .cta:hover{background:#fff}
/* sabit menü (data-sabit): ilk ekran geçilince gizlenir, yukarı kaydırınca ince bir şerit olarak iner */
.site-head.sabit{position:fixed;inset:0 0 auto;z-index:50;background:rgba(21,17,13,.84);-webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1);border-bottom:1px solid var(--rule);transform:translateY(-102%);transition:transform .38s cubic-bezier(.2,.7,.2,1)}
.site-head.sabit.goster{transform:none}
.site-head.sabit .bar{height:72px}
.site-head.sabit .bar .logo img{height:46px}
.site-head.sabit .bar nav a{text-shadow:none}

/* ---------- butonlar ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 28px;font:500 14.5px/1 var(--sans);letter-spacing:.01em;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s;background:var(--linen);color:var(--espresso)}
.btn:hover{background:#fff}
.btn.ghost,.btn-line{background:transparent;color:var(--linen);border-color:var(--rule2)}
.btn.ghost:hover,.btn-line:hover{border-color:var(--linen);background:rgba(237,230,219,.05)}
.btn-fill{background:var(--linen);color:var(--espresso)}
.btn:disabled{opacity:.3;cursor:default}
.btns{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- form ---------- */
.fl{display:block;font-size:13.5px;color:var(--sawdust);margin-bottom:8px}
.field input,.field textarea,form .row input,form > div > input,form textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--rule2);color:var(--linen);font:400 17px/1.5 var(--sans);padding:10px 0;border-radius:0;transition:border-color .2s}
form input::placeholder,form textarea::placeholder{color:var(--mute)}
form input:focus,form textarea:focus{outline:none;border-bottom-color:var(--amber)}
form textarea{min-height:104px;resize:vertical}
fieldset{border:0}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opts label{cursor:pointer;position:relative}
.opts input{position:absolute;opacity:0;width:1px;height:1px}
.opts span{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--rule2);font-size:14px;transition:background .15s,color .15s,border-color .15s}
.opts label:hover span{border-color:var(--linen)}
.opts input:checked + span{background:var(--linen);color:var(--espresso);border-color:var(--linen)}
.opts input:focus-visible + span{outline:1px solid var(--amber);outline-offset:3px}
.hidden{display:none}
.note{font-size:13px;color:var(--mute);line-height:1.6}
.note a{color:var(--sawdust);text-underline-offset:3px}
.note a:hover{color:var(--linen)}

/* ---------- alt bilgi: kapanış cümlesi + sütunlar + alt satır (tüm sayfalarda aynı) ---------- */
.site-foot{background:var(--ground);border-top:1px solid var(--rule);padding:clamp(88px,10vw,140px) 0 0;font-size:14.5px;color:var(--sawdust)}
.f-say{font:400 clamp(44px,7vw,104px)/.96 var(--serif);letter-spacing:-.022em;color:var(--linen)}
.f-say em{font-style:italic;color:var(--amber)}
.f-grid,.f-bot{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,3fr) minmax(0,2fr) minmax(0,2fr);column-gap:40px}
.f-grid{row-gap:44px;align-items:start;margin-top:clamp(64px,8vw,112px);padding-top:44px;border-top:1px solid var(--rule)}
.f-logo{display:block;justify-self:start}
.f-logo img{height:72px;width:auto}
.f-col{display:flex;flex-direction:column;align-items:flex-start}
.site-foot .f-h{font:500 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:14px}
.f-col p{line-height:1.6;margin:3px 0 4px}
.site-foot a{color:var(--sawdust);text-decoration:none;transition:color .2s}
.site-foot a:hover,.site-foot a[aria-current]{color:var(--linen)}
.f-col a{display:inline-flex;align-items:center;gap:8px;min-height:34px}
.f-col a svg{width:9px;height:9px;flex:none;opacity:.75}
.f-col a.f-ig{flex-direction:column;align-items:flex-start;gap:2px;line-height:1.45;padding:5px 0}
.f-ig span{display:inline-flex;align-items:center;gap:8px}
.f-ig small{font-size:13px;color:var(--mute);transition:color .2s}
.f-ig:hover small{color:var(--sawdust)}
.f-bot{align-items:center;justify-items:start;row-gap:6px;margin-top:clamp(56px,7vw,96px);padding:20px 0 28px;border-top:1px solid var(--rule);font-size:13px;color:var(--mute)}
.f-bot a{color:var(--mute);display:inline-flex;align-items:center;min-height:38px}
.f-up{grid-column:4;gap:12px}
.f-up i{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--rule2);transition:background .25s,border-color .25s,color .25s}
.f-up svg{width:10px;height:12px}
.f-up:hover i{background:var(--linen);border-color:var(--linen);color:var(--espresso)}

/* ---------- WhatsApp kısayolu (numara girilince görünür): koyu zemin, logo kendi renginde ---------- */
.wa-fab{position:fixed;right:20px;bottom:20px;z-index:40;width:58px;height:58px;border-radius:50%;background:var(--bark);border:1px solid var(--rule2);color:#25d366;display:grid;place-items:center;box-shadow:0 12px 30px rgba(0,0,0,.5);transition:transform .25s,border-color .25s,opacity .3s}
.wa-fab svg{width:27px;height:27px}
.wa-fab[hidden]{display:none}
.wa-fab.later{opacity:0;transform:translateY(12px);pointer-events:none}
.wa-fab.later.show{opacity:1;transform:none;pointer-events:auto}
.wa-fab:hover,.wa-fab.later.show:hover{transform:scale(1.06);border-color:var(--linen)}

/* ---------- basış: düğmenin altında ölçü çizgisi (etkilesim.js) ---------- */
.olc{position:absolute;z-index:90;height:9px;pointer-events:none;animation:olc-f .8s ease forwards}
.olc::before{content:"";position:absolute;left:0;right:0;top:4px;height:1px;background:var(--amber);transform:scaleX(0);animation:olc-l .45s cubic-bezier(.2,.7,.2,1) forwards}
.olc::after{content:"";position:absolute;inset:0;border-left:1px solid var(--amber);border-right:1px solid var(--amber);opacity:0;animation:olc-t .45s .25s ease forwards}
@keyframes olc-l{to{transform:scaleX(1)}}
@keyframes olc-t{to{opacity:1}}
@keyframes olc-f{0%,62%{opacity:1}100%{opacity:0}}
.btn:active,.cta:active{transform:translateY(1px)}

/* ---------- form uyarısı (tarayıcı balonu yerine; etkilesim.js) ---------- */
.f-err{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:13px;line-height:1.4;color:#e3b48a}
.f-err::before{content:"";flex:none;width:12px;height:1px;background:currentColor}
[aria-invalid="true"]{border-bottom-color:#e3b48a!important}

/* ---------- robot doğrulaması (robot.js, Cloudflare Turnstile): boşken formda yer kaplamaz ---------- */
form[name="teklif"],form[name="siparis"]{position:relative}
.robot-alan{display:grid;gap:6px}
/* boşken akış dışında: formun satır aralığına yeni satır eklemez; doğrulama arka planda çalışmayı sürdürür */
.robot-alan.bos{position:absolute;left:0;width:100%;height:0;overflow:hidden;pointer-events:none}
.robot-alan .f-err{margin-top:0}
.robot-uyari[hidden]{display:none}
.btn.gidiyor{opacity:.6;cursor:progress}

/* ---------- sayfalar arası yumuşak geçiş (destekleyen tarayıcılarda) ---------- */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.32s}
.bar .logo{view-transition-name:logo}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* ---------- telefon: alt menü (uygulama gibi) ---------- */
.tabbar{display:none}
@media (max-width:760px){
  :root{--tabh:60px}
  .tabbar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:grid;grid-template-columns:1fr 1fr 1.42fr 1fr 1fr;padding:0 max(4px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(4px,env(safe-area-inset-left));background:rgba(14,11,8,.9);-webkit-backdrop-filter:blur(18px) saturate(1.15);backdrop-filter:blur(18px) saturate(1.15);border-top:1px solid var(--rule);view-transition-name:tabbar;transition:transform .32s cubic-bezier(.2,.7,.2,1)}
  .tabbar a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;height:var(--tabh);text-decoration:none;color:var(--mute);font:500 10.5px/1.1 var(--sans);letter-spacing:.005em;white-space:nowrap;transition:color .25s;-webkit-touch-callout:none;user-select:none}
  .tabbar a span{max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .tabbar svg{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linejoin:round;transition:transform .18s cubic-bezier(.2,.7,.2,1)}
  .tabbar a > svg{margin:4px 0}  /* ortadaki kutuyla (30 px) aynı yükseklik: yazılar aynı hizada */
  .tabbar a.on{color:var(--linen)}
  .tabbar a:active svg,.tabbar a:active .tb-k{transform:scale(.86)}
  .tabbar a:focus-visible{outline-offset:-4px}
  /* ortadaki "Tasarım oluştur": keten kare içinde, öne çıkan */
  .tabbar .tb-k{display:grid;place-items:center;width:46px;height:30px;background:var(--linen);color:var(--espresso);transition:transform .18s cubic-bezier(.2,.7,.2,1),background .25s}
  .tabbar .tb-k svg{width:19px;height:19px;stroke-width:1.5}
  .tabbar .tb-tas{color:var(--sawdust)}
  .tabbar .tb-tas.on .tb-k{background:var(--amber)}
  /* etkin düğmenin üstünde kayan ince çizgi */
  .tb-ind{position:absolute;top:-1px;left:0;width:26px;height:2px;background:var(--amber);opacity:0;pointer-events:none;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
  .tb-ind.on{opacity:1}
  /* klavye açıkken menü çekilir (yazı alanına yer kalsın) */
  .klavye .tabbar{transform:translateY(110%)}
  .site-foot{padding-bottom:calc(var(--tabh) + env(safe-area-inset-bottom))}
  .wa-fab{bottom:calc(var(--tabh) + env(safe-area-inset-bottom) + 14px);right:14px}
  /* uygulama gibi geçiş: yeni sayfa sağdan kayarak gelir, eski sayfa hafifçe sola çekilir; geri gidişte tersi.
     menü (tabbar) ve logo yerinde kalır */
  ::view-transition-old(root),::view-transition-new(root){animation-duration:.42s;animation-timing-function:cubic-bezier(.32,.72,0,1);animation-fill-mode:both}
  ::view-transition-old(root){animation-name:vt-sol-cik}
  ::view-transition-new(root){animation-name:vt-sag-gir}
  html:active-view-transition-type(geri)::view-transition-old(root){animation-name:vt-sag-cik;z-index:2}
  html:active-view-transition-type(geri)::view-transition-new(root){animation-name:vt-sol-gir}
  ::view-transition-group(tabbar){animation:none;z-index:10}
}
@media (max-width:340px){.tabbar a{font-size:9.6px}.tabbar{grid-template-columns:1fr 1fr 1.5fr 1fr 1fr}}
@keyframes vt-sag-gir{from{transform:translateX(100%);box-shadow:-24px 0 40px rgba(0,0,0,.5)}to{box-shadow:-24px 0 40px rgba(0,0,0,0)}}
@keyframes vt-sol-cik{to{transform:translateX(-26%);filter:brightness(.55)}}
@keyframes vt-sol-gir{from{transform:translateX(-26%);filter:brightness(.55)}}
@keyframes vt-sag-cik{to{transform:translateX(100%)}}

/* alt bilgide "Mobilyalar" sütunu olan sayfalarda beş sütun */
@media (min-width:1101px){.f-grid:has(#f-mobilya){grid-template-columns:minmax(0,4fr) minmax(0,3fr) minmax(0,2fr) minmax(0,2fr) minmax(0,2fr)}}
@media (max-width:1180px){.bar nav{gap:24px}}
@media (max-width:960px){
  .bar nav a:not(.cta):not(.keep){display:none}
}
@media (max-width:1100px){
  .f-grid,.f-bot{grid-template-columns:repeat(3,minmax(0,1fr))}
  .f-logo{grid-column:1/-1}
  .f-up{grid-column:3}
}
@media (max-width:760px){
  .bar{height:88px}
  .bar .logo img{height:54px}
  .site-head.sabit .bar{height:62px}
  .site-head.sabit .bar .logo img{height:38px}
  .bar nav{gap:16px;font-size:14px}
  .bar nav .cta{padding:11px 14px}
  /* dokunma alanı 44 px: görünüm aynı, yalnız basılabilen alan büyür */
  .bar nav .cta::before{content:"";position:absolute;inset:-4px -2px}
  .bar .logo{position:relative}
  .bar .logo::before{content:"";position:absolute;inset:-4px -2px}
  .lead{font-size:16px}
  .site-foot{padding-top:76px}
  .f-say{font-size:clamp(38px,10.6vw,56px);line-height:1}
  .f-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:20px;row-gap:36px;margin-top:56px;padding-top:36px}
  .f-logo img{height:58px}
  .f-adr{grid-column:1/-1}
  .f-col a{min-height:44px}
  .f-col a.f-ig{padding:10px 0}
  /* alt satır sola dizilir: sağ alt köşe WhatsApp düğmesine boş kalır */
  .f-bot{grid-template-columns:1fr;row-gap:2px;margin-top:44px;padding:16px 0 24px}
  .f-bot > span{min-height:38px;display:inline-flex;align-items:center;white-space:pre} /* esnek kutuda "© 2026 RTR Atölye" boşlukları kaybolmasın */
  .f-bot a{min-height:44px}
  .f-up{grid-column:auto;margin-top:4px}
}
/* 401–420 px telefonlarda (412, 414) iki bağlantı sığmıyor, düğmeler iki satıra kırılıyordu */
@media (max-width:420px){.bar nav a.keep{display:none}}