/* Boyacı Mert Usta - ortak tasarım sistemi
   Dil: boya renk kartelası. Tek dosya, tüm sayfalar paylaşır (önbelleklenir).
   Bileşenler için DESIGN.md. Renk kodları (MU-xxx) bu sitenin kendi kartela kodlarıdır. */

:root{
  --chalk:#F3F2ED; --paper:#FBFAF7; --ink:#1B1F1D; --ink2:#454D49; --line:#D8D5CA;
  --accent:#2B44C0; --wa:#0E7A3B; --warn:#9A3B26;
  --sand:#D9C6A0; --olive:#8C9878; --bone:#EDE9DD; --mist:#9DB0BC; --brick:#A8452F; --night:#1F2740; --glow:#FFD9A0;
  --f-body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --f-disp:"Iowan Old Style","Palatino Linotype",Palatino,"URW Palladio L",P052,"Book Antiqua",Georgia,serif;
  --f-mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --tab-h:64px; --gut:16px; --maxw:1120px;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px;color-scheme:light}
body{margin:0;background:var(--chalk);color:var(--ink);font:400 1.0625rem/1.6 var(--f-body);padding-bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px));-webkit-tap-highlight-color:transparent}
img,svg{max-width:100%}
a{color:var(--accent);text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
.on-dark :focus-visible,.cta :focus-visible,.pickbar :focus-visible,.foot :focus-visible{outline-color:var(--glow)}
h1,h2,h3,h4{font-family:var(--f-disp);font-weight:700;line-height:1.1;letter-spacing:-.015em;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2.1rem,8.2vw + .1rem,4.2rem);letter-spacing:-.025em;line-height:1.02}
h2{font-size:clamp(1.65rem,5vw + .2rem,2.6rem)}
h3{font-size:clamp(1.2rem,2.4vw + .6rem,1.55rem);line-height:1.2}
p{margin:0 0 1em;text-wrap:pretty}
ul,ol{margin:0;padding:0}
code,.mono{font-family:var(--f-mono);font-size:.82em}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:12px 16px;border-radius:8px}
.skip:focus{top:8px}
.wrap{width:min(100% - 2*var(--gut),var(--maxw));margin-inline:auto}
.i{width:1.5em;height:1.5em;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Boya dokusu ---------- */
.tex{background-color:var(--sw,var(--sand));background-image:
  var(--glow-layer,linear-gradient(transparent,transparent)),
  var(--grain),
  repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 5px,rgba(255,255,255,0) 5px 12px,rgba(0,0,0,.02) 12px 17px,rgba(255,255,255,0) 17px 31px),
  linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,0,0,.04))}
.c-ic{--sw:var(--sand);--on:var(--ink)}
.c-dis{--sw:var(--olive);--on:var(--ink)}
.c-alci{--sw:var(--bone);--on:var(--ink)}
.c-alcipan{--sw:var(--mist);--on:var(--ink)}
.c-dek{--sw:var(--brick);--on:#fff}
.c-led{--sw:var(--night);--on:#fff;--glow-layer:radial-gradient(110% 70% at 50% 0,rgba(255,217,160,.75),rgba(255,217,160,0) 62%)}

/* ---------- Üst bar ---------- */
.top{position:sticky;top:0;z-index:40;background:rgba(243,242,237,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:12px;height:56px}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:700 1.125rem/1 var(--f-disp);letter-spacing:-.01em}
.mark{width:26px;height:32px;flex:none}
.nav-d{display:none}
.menu summary{list-style:none;display:grid;place-items:center;width:48px;height:48px;margin-right:-8px;cursor:pointer;border-radius:12px}
.menu summary::-webkit-details-marker{display:none}
.menu .i-x{display:none}
.menu[open] .i-m{display:none}
.menu[open] .i-x{display:block}
.menu-panel{position:fixed;left:0;right:0;top:56px;background:var(--paper);border-bottom:1px solid var(--line);padding:8px var(--gut) 20px;box-shadow:0 18px 30px rgba(0,0,0,.14);max-height:calc(100dvh - 56px - var(--tab-h));overflow:auto}
.menu-panel a{display:flex;align-items:center;min-height:52px;color:var(--ink);text-decoration:none;font-weight:600;border-bottom:1px solid var(--line)}
.menu-panel a:last-child{border-bottom:0}

/* ---------- Alt sekme çubuğu (mobil uygulama hissi) ---------- */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:repeat(5,1fr);height:calc(var(--tab-h) + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:rgba(251,250,247,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
.tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--ink2);text-decoration:none;font-size:.75rem;font-weight:600;line-height:1}
.tab .i{width:24px;height:24px}
.tab[aria-current=page]{color:var(--ink)}
.tab[aria-current=page]::before{content:"";position:absolute;top:0;left:50%;width:30px;height:4px;margin-left:-15px;background:var(--brick);border-radius:0 0 3px 3px}
.tab-act{display:grid;place-items:center;width:44px;height:30px;border-radius:15px;color:#fff;margin-bottom:0}
.tab-call .tab-act{background:var(--ink)}
.tab-wa .tab-act{background:var(--wa)}
.tab:active{background:rgba(0,0,0,.05)}

/* ---------- Düğmeler ---------- */
.btns{display:flex;flex-wrap:wrap;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 24px;border:2px solid transparent;border-radius:999px;font:700 1rem/1.1 var(--f-body);text-decoration:none;cursor:pointer;transition:transform .12s ease}
.btn:active{transform:scale(.97)}
.btn .i{width:22px;height:22px}
.btn-lg{min-height:58px;font-size:1.0625rem}
.btn-ink{background:var(--ink);color:#fff}
.btn-wa{background:var(--wa);color:#fff}
.btn-line{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-paper{background:var(--paper);color:var(--ink)}
.btn-on-dark{background:#2BD07A;color:#08261A}
.btns .btn{flex:1 1 200px}
.link{font-weight:700}

/* ---------- Bölümler ---------- */
.sec{padding-block:clamp(40px,8vw,84px)}
.sec--tint{background:var(--bone);border-block:1px solid var(--line)}
.sec>.wrap>h2:first-child,.sec-h{max-width:20ch}
.lede{font-size:1.1875rem;line-height:1.5;color:var(--ink2);max-width:58ch}
.sec-head{margin-bottom:28px}
.split{display:grid;gap:28px}

/* ---------- Kırıntı yolu ---------- */
.crumb{padding-top:14px;font-size:.9375rem}
.crumb ol{display:flex;flex-wrap:wrap;gap:2px 0;list-style:none}
.crumb li+li::before{content:"/";margin:0 .55em;opacity:.55}
.crumb a{color:inherit}
.crumb [aria-current]{font-weight:600}

/* ---------- Ana sayfa hero: duvar boyama anı ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;background:var(--chalk);border-bottom:1px solid rgba(27,31,29,.18)}
.wall{position:absolute;inset:0;z-index:-1;overflow:hidden;contain:paint}
.wall i{position:absolute;left:0;right:0;--sw:var(--sand);animation:wipe-l .8s linear both;clip-path:inset(0 100% 0 0)}
.wall i:nth-child(1){top:0;height:35%;animation-delay:.2s}
.wall i:nth-child(2){top:34%;height:34%;animation-name:wipe-r;animation-delay:1.15s;clip-path:inset(0 0 0 100%)}
.wall i:nth-child(3){top:67%;bottom:0;animation-delay:2.1s}
.wall i{background-color:var(--sw);background-image:var(--grain),repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 5px,rgba(255,255,255,0) 5px 12px,rgba(0,0,0,.02) 12px 17px,rgba(255,255,255,0) 17px 31px),linear-gradient(180deg,rgba(255,255,255,.07),rgba(0,0,0,.025))}
.roller{position:absolute;left:0;top:17%;width:74px;height:74px;margin:-37px 0 0 -37px;animation:roller 2.9s linear .2s both;opacity:0}
.roller svg{width:100%;height:100%;filter:drop-shadow(0 3px 3px rgba(0,0,0,.18))}
@keyframes wipe-l{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes wipe-r{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0 0 0 0)}}
@keyframes roller{
  0%{left:0;top:17%;opacity:1}
  27.6%{left:100%;top:17%;opacity:1}
  32.8%{left:100%;top:51%}
  60.4%{left:0;top:51%}
  65.5%{left:0;top:84%}
  93.1%{left:100%;top:84%;opacity:1}
  100%{left:100%;top:84%;opacity:0}}
.painted .wall i,.nomotion .wall i{animation:none;clip-path:none}
.painted .roller,.nomotion .roller{display:none}
@media (prefers-reduced-motion:reduce){.wall i{animation:none!important;clip-path:none!important}.roller{display:none}html{scroll-behavior:auto}.btn{transition:none}}
.hero-in{display:grid;gap:8px;padding-top:30px}
.hero h1{max-width:13ch;margin-bottom:.4em}
.hl{background:linear-gradient(transparent 62%,rgba(168,69,47,.55) 62% 92%,transparent 92%);padding:0 .06em}
.hero .lead{font-size:1.125rem;line-height:1.5;color:#2B322E;max-width:34ch;margin-bottom:20px}
.facts{list-style:none;display:grid;gap:8px;margin:22px 0 4px;font-size:.9688rem;font-weight:500;color:#2B322E}
.facts li{display:flex;gap:10px;align-items:flex-start}
.facts .i{width:20px;height:20px;margin-top:2px;color:var(--wa);stroke-width:2.6}

/* kartela yelpazesi */
.fan{--fan-h:230px;--bw:62px;position:relative;height:var(--fan-h);overflow:hidden;margin-top:14px}
.fan a{position:absolute;left:50%;bottom:calc(var(--fan-h) * -.25);width:var(--bw);height:calc(var(--fan-h) * 1.18);margin-left:calc(var(--bw) / -2);transform-origin:50% 92%;transform:rotate(calc(var(--r) * var(--k,.84)));border-radius:7px 7px 3px 3px;box-shadow:-3px 0 10px rgba(0,0,0,.2);display:flex;justify-content:center;padding-top:16px;color:var(--on);text-decoration:none;transition:transform .25s ease}
.fan a:hover{transform:rotate(calc(var(--r) * var(--k,.84) * 1.1))}
.fan a>span{writing-mode:vertical-rl;transform:rotate(180deg);font:700 .8125rem/1.1 var(--f-body);white-space:nowrap;letter-spacing:.01em}
.fan a>span b{font:500 .75rem var(--f-mono);opacity:.85;margin-bottom:.7em;display:inline-block}
.fan::after{content:"";position:absolute;left:50%;bottom:calc(var(--fan-h) * -.02);width:26px;height:26px;margin-left:-13px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 5px var(--paper)}

/* ---------- Renk kartı: hizmet seçimi ve hizmet kartları ---------- */
.swgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;border:0;padding:0;margin:0}
.swgrid.warn{outline:2px dashed var(--warn);outline-offset:8px;animation:nudge .4s}
@keyframes nudge{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.swc{position:relative;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:6px 6px 14px 6px;overflow:hidden}
.swc input{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;margin:0;pointer-events:none}
.swc-face{display:flex;flex-direction:column;flex:1;cursor:pointer}
.swc-chip{position:relative;display:block;height:92px}
.swc-chip::before{content:"";position:absolute;left:12px;top:12px;width:13px;height:13px;border-radius:50%;background:var(--chalk);box-shadow:inset 0 1px 3px rgba(0,0,0,.45)}
.swc-tick{position:absolute;right:10px;top:10px;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:var(--paper);border:2px solid var(--ink);color:transparent}
.swc-tick .i{width:20px;height:20px;stroke-width:3}
.swc input:checked+.swc-face .swc-tick{background:var(--ink);color:#fff}
.swc input:focus-visible+.swc-face{outline:3px solid var(--accent);outline-offset:-3px}
.swc:has(input:checked){outline:3px solid var(--ink);outline-offset:-1px}
.swc-body{display:block;padding:12px 14px 10px}
.swc-meta{display:flex;justify-content:space-between;gap:6px;align-items:baseline;font-size:.8125rem;color:var(--ink2);margin-bottom:6px;border-bottom:1px solid var(--line);padding-bottom:6px}
.swc-meta b{font-family:var(--f-disp);font-size:.9375rem;color:var(--ink)}
.swc-meta code{font-size:.75rem;white-space:nowrap}
.swc-title{display:block;font-size:1.0625rem;line-height:1.2;font-weight:700;margin-bottom:4px}
.swc-desc{display:block;font-size:.875rem;line-height:1.4;color:var(--ink2)}
.swc-more{display:flex;align-items:center;min-height:46px;padding:0 14px;font-weight:700;font-size:.9375rem;border-top:1px solid var(--line)}
/* bağlantı olarak hizmet kartı */
a.svc{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:6px 6px 14px 6px;overflow:hidden;color:var(--ink);text-decoration:none;transition:transform .15s}
a.svc:hover{transform:translateY(-3px)}
a.svc .swc-chip{height:84px}
a.svc .swc-more{margin-top:auto;color:var(--accent)}
.svcs{display:grid;gap:12px;grid-template-columns:repeat(2,1fr);list-style:none}

.pick-opt{margin-top:24px;display:grid;gap:14px}
.field{display:grid;gap:6px;font-weight:600;font-size:.9688rem}
.field select,.field input,.field textarea{width:100%;min-height:54px;padding:0 14px;border:2px solid var(--ink);border-radius:10px;background:var(--paper);color:var(--ink);font:500 1.0625rem var(--f-body)}
.field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
.msg{margin:0;padding:12px 14px;border-left:6px solid var(--sand);background:var(--paper);font-size:.9688rem;color:var(--ink2);border-radius:0 8px 8px 0}
.msg b{display:block;color:var(--ink);font-size:.8125rem;margin-bottom:2px}
.pickbar{position:sticky;bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px) + 10px);z-index:30;margin-top:18px;display:flex;align-items:center;gap:12px;padding:10px 10px 10px 16px;background:var(--ink);color:#fff;border-radius:20px;box-shadow:0 12px 30px rgba(0,0,0,.3)}
.pickbar-msg{flex:1;margin:0;font-size:.9375rem;line-height:1.3;font-weight:600}
.pickbar-msg.warn{color:#FFC9B8}
.pickbar .btn{min-height:50px;padding:0 18px;flex:none}
.wa-one{display:grid;gap:12px}

/* ---------- Adım listesi ---------- */
.steps{list-style:none;counter-reset:s;display:grid;gap:0;position:relative}
.steps li{counter-increment:s;position:relative;padding:0 0 26px 62px}
.steps li:last-child{padding-bottom:0}
.steps li::before{content:counter(s);position:absolute;left:0;top:0;width:44px;height:44px;display:grid;place-items:center;border-radius:6px 6px 14px 6px;background:var(--sw,var(--sand));color:var(--on,var(--ink));font:700 1.25rem var(--f-disp);box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)}
.steps li::after{content:"";position:absolute;left:21px;top:50px;bottom:6px;width:2px;background:var(--line)}
.steps li:last-child::after{display:none}
.steps h3{margin:0 0 .15em;font-size:1.2rem}
.steps p{margin:0;color:var(--ink2)}

/* ---------- Kapsam listesi ---------- */
.scope{list-style:none;display:grid;gap:0;border-top:2px solid var(--ink)}
.scope li{display:grid;grid-template-columns:28px 1fr;gap:0 10px;padding:14px 0;border-bottom:1px solid var(--line)}
.scope .i{width:22px;height:22px;margin-top:2px;color:var(--wa);stroke-width:2.6}
.scope b{display:block}
.scope span{color:var(--ink2);font-size:.9688rem}

/* ---------- Fotoğraf yuvası (gerçek foto yoksa boya dokusu yedeği) ---------- */
.foto{margin:0}
.foto-in{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:6px 40px 6px 40px;isolation:isolate}
.foto--tall .foto-in{aspect-ratio:16/11}
.foto--wide .foto-in{aspect-ratio:16/10}
.foto-in::before{content:"";position:absolute;inset:0;z-index:0}
.m-ic::before{background:linear-gradient(100deg,transparent 18%,rgba(255,255,255,.12) 18% 52%,rgba(0,0,0,.05) 52% 54%,transparent 54%)}
.m-dis::before{background:repeating-linear-gradient(0deg,transparent 0 38px,rgba(0,0,0,.08) 38px 41px,rgba(255,255,255,.08) 41px 44px)}
.m-alci::before{background:linear-gradient(90deg,transparent 49.4%,rgba(0,0,0,.12) 49.4% 50.2%,transparent 50.2%),linear-gradient(0deg,transparent 49.4%,rgba(0,0,0,.12) 49.4% 50.2%,transparent 50.2%)}
.m-dek::before{background:repeating-linear-gradient(135deg,transparent 0 26px,rgba(255,255,255,.09) 26px 52px)}
.m-led::before{background:linear-gradient(180deg,transparent 58%,rgba(255,217,160,.1))}
.foto-in::after{content:attr(data-chip);position:absolute;left:14px;bottom:14px;z-index:0;padding:8px 12px 8px 12px;background:var(--paper);color:var(--ink);font:600 .8125rem/1.2 var(--f-mono);border-radius:3px;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.foto-in img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover}
.foto figcaption{margin-top:10px;font-size:.9063rem;color:var(--ink2)}
.on-dark .foto figcaption{color:#C9CEDB}

/* ---------- Sayfa başlığı (hizmet/kurumsal sayfa hero) ---------- */
.phero{background-color:var(--sw,var(--sand));color:var(--on,var(--ink));border-bottom:1px solid rgba(0,0,0,.2)}
.phero .crumb a{color:inherit}
.phero-in{display:grid;gap:26px;padding-block:18px 36px}
.phero h1{font-size:clamp(2rem,7vw + .2rem,3.6rem);max-width:16ch}
.phero .lead{font-size:1.125rem;line-height:1.5;max-width:46ch;margin-bottom:20px}
.phero .btn-line{border-color:currentColor;color:inherit}
.phero.c-dek .btn-ink,.phero.c-led .btn-ink{background:#fff;color:var(--ink)}
.phero.c-led .btn-wa{background:#2BD07A;color:#08261A}
.phero.c-led .btn-line{border-color:#fff}

/* hero içindeki foto: çerçeveli baskı */
.phero .foto-in{border:9px solid var(--paper);border-radius:4px 34px 4px 34px;box-shadow:0 16px 34px rgba(0,0,0,.22),inset 0 0 0 999px rgba(0,0,0,.12);transform:rotate(-1.2deg)}
.phero .foto figcaption{color:inherit;opacity:.9}
.phero .foto-in::before{opacity:1}
.phero .foto{padding:4px 4px 0}
@media (max-width:639px){
  .svcs{grid-template-columns:1fr}
  .svcs a.svc{display:grid;grid-template-columns:96px 1fr}
  .svcs a.svc .swc-chip{height:auto;grid-row:1/3}
  .svcs a.svc .swc-more{grid-column:2;margin-top:0;min-height:44px}
}

/* ---------- LED bölümü ---------- */
.led{background:var(--night);color:#F4F1EA;position:relative;overflow:hidden;isolation:isolate}
.led::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--glow);box-shadow:0 0 60px 22px rgba(255,217,160,.55);z-index:-1}
.led::after{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(70% 38% at 50% 0,rgba(255,217,160,.2),rgba(255,217,160,0) 70%),var(--grain)}
.led h2{color:#fff}
.led .lede,.led p{color:#DDE1EC}
.led .scope{border-top-color:var(--glow)}
.led .scope li{border-bottom-color:rgba(255,255,255,.18)}
.led .scope span{color:#C9CEDB}
.led .scope .i{color:var(--glow)}
.led a{color:var(--glow)}

/* ---------- SSS ---------- */
.faq{border-top:2px solid var(--ink)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:60px;padding:12px 0;cursor:pointer;font-weight:700;font-size:1.0625rem;line-height:1.3;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(var(--ink),var(--ink)) center/100% 2px no-repeat,linear-gradient(var(--ink),var(--ink)) center/2px 100% no-repeat;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(90deg);background:linear-gradient(var(--ink),var(--ink)) center/100% 2px no-repeat}
.faq details>div{padding:0 0 18px;color:var(--ink2);max-width:62ch}
.faq details>div p:last-child{margin:0}
.faq-jump{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px;list-style:none}

/* ---------- Çipler ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none}
.chip{display:inline-flex;align-items:center;min-height:46px;padding:0 16px;background:var(--paper);border:1.5px solid var(--ink);border-radius:8px 8px 8px 2px;color:var(--ink);text-decoration:none;font-weight:600;font-size:.9688rem}
.chip:hover{background:var(--sand)}
.chip--on{background:var(--ink);color:#fff}
.chips--a .chip{border-color:var(--olive);border-left:8px solid var(--olive);min-height:50px}
.chips--e .chip{border-color:var(--line);font-weight:500}
.group-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:34px 0 14px}
.group-h h3{margin:0}
.group-h span{color:var(--ink2);font-size:.9375rem}

/* ---------- Metin ---------- */
.prose{max-width:66ch}
.prose h2{margin-top:1.6em}
.prose h2:first-child{margin-top:0}
.prose p{color:#2B322E}
.pull{margin:28px 0;padding:6px 0 6px 20px;border-left:6px solid var(--brick);font:700 clamp(1.3rem,3.6vw + .5rem,1.9rem)/1.25 var(--f-disp);letter-spacing:-.01em}
.vals{list-style:none;display:grid;gap:0;border-top:2px solid var(--ink)}
.vals li{padding:18px 0;border-bottom:1px solid var(--line);display:grid;gap:4px}
.vals h3{margin:0}
.vals p{margin:0;color:var(--ink2)}
.vals .dot{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:10px;vertical-align:-1px;background:var(--sw)}
.big-quote{font:700 clamp(1.5rem,4.5vw + .4rem,2.5rem)/1.2 var(--f-disp);letter-spacing:-.015em}

/* ---------- CTA bloğu ---------- */
.cta{background:var(--ink);color:#F4F1EA;border-radius:6px 28px 6px 28px;padding:clamp(24px,5vw,44px);display:grid;gap:22px;position:relative;overflow:hidden;isolation:isolate}
.cta::before{content:"";position:absolute;right:-30px;top:-30px;width:210px;height:210px;z-index:-1;background:conic-gradient(from 200deg,var(--sand) 0 25%,var(--olive) 0 45%,var(--brick) 0 65%,var(--mist) 0 85%,var(--glow) 0);opacity:.18;transform:rotate(12deg);border-radius:40px}
.cta h2{color:#fff;margin:0 0 .3em;max-width:18ch}
.cta p{color:#D6DAD7;margin:0;max-width:44ch}
.cta .tel{display:inline-block;font:700 clamp(1.8rem,7vw,2.6rem)/1.1 var(--f-disp);color:#fff;text-decoration:none;margin-top:10px;letter-spacing:-.01em}
.cta .field{color:#fff}
.cta .field select{border-color:#fff}
.cta .btn-ink{background:var(--paper);color:var(--ink)}
.cta .btn-wa{background:#2BD07A;color:#08261A}
.area{display:grid;gap:10px}

/* ---------- Alt bilgi ---------- */
.foot{background:var(--ink);color:#D6DAD7;margin-top:clamp(40px,8vw,84px);padding-block:40px 28px;font-size:.9688rem}
.foot a{color:#fff}
.foot-grid{display:grid;gap:30px}
.foot h2{font:700 1rem var(--f-body);color:#fff;margin:0 0 10px;letter-spacing:0}
.foot ul{list-style:none;display:grid;gap:0}
.foot li a{display:inline-flex;align-items:center;min-height:40px;text-decoration:none}
.foot li a:hover{text-decoration:underline}
.foot .brand{color:#fff;margin-bottom:12px}
.foot-bar{margin-top:30px;padding-top:18px;border-top:1px solid rgba(255,255,255,.18);font-size:.875rem;color:#B9BFBB}
.foot-ios{font-size:.875rem;color:#B9BFBB}

/* ---------- Diğer ---------- */
.big404{font:700 clamp(5rem,28vw,12rem)/.9 var(--f-disp);letter-spacing:-.04em;margin:0}
.contact-grid{display:grid;gap:14px}
.contact-card{background:var(--paper);border:1px solid var(--line);border-radius:6px 6px 18px 6px;padding:20px;display:grid;gap:10px;align-content:start}
.contact-card h2,.contact-card h3{margin:0}
.contact-card p{margin:0;color:var(--ink2)}
.tel-big{font:700 clamp(1.7rem,7vw,2.3rem)/1.1 var(--f-disp);color:var(--ink);text-decoration:none}
.tips{list-style:none;display:grid;gap:8px}
.tips li{display:flex;gap:10px}
.tips .i{width:20px;height:20px;margin-top:3px;color:var(--wa);stroke-width:2.6}
.find{margin-bottom:20px}
.find input{background-image:none}
.empty{padding:18px;border:2px dashed var(--line);border-radius:8px}

/* ---------- Geniş ekran ---------- */
@media (min-width:640px){
  :root{--gut:24px}
  .swgrid,.svcs{grid-template-columns:repeat(3,1fr);gap:16px}
  .contact-grid{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr}
  .vals li{grid-template-columns:240px 1fr;gap:24px;align-items:baseline}
  .vals--col li{grid-template-columns:1fr;gap:4px}
  .scope{grid-template-columns:1fr 1fr;column-gap:40px}
}
@media (min-width:900px){
  body{padding-bottom:0}
  .tabbar,.menu{display:none}
  .top-in{height:68px}
  .nav-d{display:flex;align-items:center;gap:2px}
  .nav-d a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:var(--ink);text-decoration:none;font-weight:600;font-size:.9688rem;border-radius:8px}
  .nav-d a:hover{background:var(--bone)}
  .nav-d a[aria-current=page]{box-shadow:inset 0 -4px 0 var(--brick);border-radius:0}
  .nav-d .btn{min-height:44px;padding:0 18px;margin-left:8px;font-size:.9375rem;color:#fff}
  .nav-d .btn:hover{background:var(--ink)}
  .nav-d .btn-wa:hover{background:var(--wa)}
  .hero-in{grid-template-columns:1.05fr .95fr;align-items:center;gap:30px;padding-top:56px;min-height:620px}
  .hero-copy{padding-bottom:56px}
  .hero .lead{font-size:1.25rem}
  .fan{--fan-h:380px;--bw:84px;--k:.8;margin:0;align-self:end}
  .fan a>span{font-size:.9375rem}
  .fan a>span b{font-size:.8125rem}
  .pickbar{bottom:18px;max-width:640px;margin-inline:auto}
  .split{grid-template-columns:1fr 1fr;gap:56px;align-items:start}
  .split--steps{grid-template-columns:1.1fr .9fr}
  .split .foto{position:sticky;top:96px}
  .foto--tall .foto-in{aspect-ratio:4/5}
  .split .vals li{display:grid;grid-template-columns:1fr;gap:4px}
  .phero-in{grid-template-columns:1.1fr .9fr;align-items:center;gap:48px;padding-block:28px 56px}
  .phero-in--solo{grid-template-columns:1fr}
  .cta{grid-template-columns:1.2fr 1fr;align-items:center;gap:40px}
  .foot-grid{grid-template-columns:1.5fr 1fr 1fr 1.2fr}
  .swgrid{gap:20px}
  .swc-chip{height:110px}
  .faq-cols{display:grid;grid-template-columns:1fr 1.6fr;gap:56px}
  .menu-panel{display:none}
}
@media (min-width:1100px){
  .contact-grid{grid-template-columns:repeat(3,1fr)}
}
@media print{.tabbar,.top,.pickbar{display:none}body{padding:0}}