/* FUFF Eryaman · site. Kaynak: build/site_src/site.css (website/assets/ içine kopyalanır, elle düzenleme) */
:root{
  --kirec:#F2F1EC;--kirec-2:#E7E5DE;--gece:#0E1116;--grafit:#2A2F36;--beton:#5E646B;--metin-2:#4A5057;
  --akim:#FF5B14;--akim-t:#C23D00;--olc:#1F6FD1;--olc-t:#1A5DB0;--esne:#D93473;--esne-t:#B5245C;--besle:#76A81B;--besle-t:#4E7410;
  --cizgi:rgba(14,17,22,.14);--cizgi-a:rgba(242,241,236,.18);
  --f:"Archivo","Helvetica Neue",Arial,sans-serif;--m:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --pad:clamp(20px,4.4vw,64px);--max:1360px;
  --ease-k:cubic-bezier(.2,.9,.25,1);   /* kasılma: hızlı başlar, yumuşak durur */
  --ease-b:cubic-bezier(.55,0,.75,.3);  /* bırakma */
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{margin:0;background:var(--kirec);color:var(--gece);font:400 17px/1.55 var(--f);font-stretch:100%;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--akim);outline-offset:3px}
.skip{position:absolute;left:12px;top:-60px;z-index:50;background:var(--gece);color:var(--kirec);padding:10px 14px;font:500 13px var(--m);text-transform:uppercase}
.skip:focus{top:12px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.mono{font-family:var(--m);font-size:12px;letter-spacing:.03em;text-transform:uppercase;line-height:1.5}
.k{color:var(--akim-t)}
h1,h2,h3{font-weight:800;font-stretch:112%;letter-spacing:-.035em;line-height:.98;margin:0;text-wrap:balance}
h1{font-size:clamp(54px,9.2vw,148px);line-height:.92;letter-spacing:-.045em}
h2{font-size:clamp(36px,5vw,76px)}
h3{font-size:clamp(22px,2.1vw,30px);font-weight:700;font-stretch:106%;letter-spacing:-.02em;line-height:1.1}
h1 em,h2 em,h3 em{font-style:normal;color:var(--akim-t)}
.dark h1 em,.dark h2 em,.dark h3 em{color:var(--akim)}
p{margin:0;max-width:62ch;text-wrap:pretty}
.lead{font-size:clamp(18px,1.6vw,22px);line-height:1.45}
.muted{color:var(--metin-2)}
.dark{background:var(--gece);color:var(--kirec)}
.dark .muted{color:rgba(242,241,236,.74)}
.band{background:var(--kirec-2)}
/* cetvel kenarı: her bölümün üstünde */
.ruler{height:14px;background:
  repeating-linear-gradient(90deg,currentColor 0 1px,transparent 1px 10px) bottom/100% 45% no-repeat,
  repeating-linear-gradient(90deg,currentColor 0 1px,transparent 1px 50px) bottom/100% 100% no-repeat;opacity:.28}

/* üst bant */
.top{position:sticky;top:0;z-index:20;background:var(--kirec);border-bottom:1px solid var(--cizgi)}
.top .wrap{display:flex;align-items:center;gap:28px;height:68px}
.brand{display:block;width:176px;line-height:0;text-decoration:none}
.brand svg{width:100%;height:auto}
.nav{display:flex;gap:26px;margin-left:auto}
.nav a{font:500 12.5px var(--m);text-transform:uppercase;letter-spacing:.03em;text-decoration:none;padding:10px 0;position:relative}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:4px;height:2px;background:var(--akim);transition:right .5s var(--ease-k)}
.nav a:hover::after,.nav a[aria-current=page]::after{right:0}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;background:var(--gece);color:var(--kirec);text-decoration:none;font:500 13px var(--m);text-transform:uppercase;letter-spacing:.03em;border:0;cursor:pointer;transition:background .5s var(--ease-k)}
.btn:hover{background:var(--akim-t)}
.btn.akim{background:var(--akim);color:var(--gece)}.btn.akim:hover{background:#ff7a40}
.btn.line{background:transparent;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor}.btn.line:hover{background:rgba(14,17,22,.06)}
.btn .sq{width:9px;height:9px;background:currentColor}
.top .btn{min-height:42px;padding:0 16px}
.menu-b{display:none;margin-left:auto;background:none;border:0;min-width:44px;min-height:44px;cursor:pointer;padding:0}
.menu-b span{display:block;width:22px;height:2px;background:var(--gece);margin:5px auto;transition:transform .5s var(--ease-k)}
@media (max-width:900px){
  .nav,.top .btn{display:none}.menu-b{display:block}
  .top.open .nav{display:flex;position:fixed;inset:68px 0 0;flex-direction:column;gap:0;background:var(--kirec);padding:24px var(--pad)}
  .top.open .nav a{font:800 34px/1.1 var(--f);font-stretch:112%;text-transform:none;letter-spacing:-.03em;padding:14px 0;border-bottom:1px solid var(--cizgi)}
  .top.open .nav a::after{display:none}
  .top.open .menu-b span:first-child{transform:translateY(3.5px) rotate(45deg)}.top.open .menu-b span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
}
body.lock{overflow:hidden}

/* hero */
.hero{padding:clamp(36px,6vw,80px) 0 clamp(48px,7vw,96px)}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,80px);align-items:center}
.hero-txt{display:flex;flex-direction:column;gap:28px}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px}
.dialbox{position:relative;aspect-ratio:1;max-width:560px;width:100%;justify-self:end}
.dialbox svg{width:100%;height:100%}
.dialbox .tk{fill:rgba(14,17,22,.18);transition:fill .12s linear}
.dialbox .tk.on{fill:var(--akim)}
.dialbox .tk.on.r{fill:var(--olc)}
.dial-c{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
.dial-n{font:500 clamp(84px,11vw,168px)/.9 var(--m);letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.dial-n small{font-size:.22em;letter-spacing:0;color:var(--beton);margin-left:.1em}
.dial-ph{margin-top:10px;min-height:1.5em}
.dial-ctl{position:absolute;left:50%;bottom:16%;transform:translateX(-50%);pointer-events:auto}
.dial-ctl .btn{min-height:44px}
.pulse{display:inline-block;width:10px;height:10px;background:var(--akim);margin-right:8px;vertical-align:-1px;transform:scale(.4);transition:transform .45s var(--ease-k)}
.pulse.k{transform:scale(1)}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr}.dialbox{justify-self:center;max-width:440px;margin-bottom:64px}.dial-ctl{bottom:-64px}}

/* künye şeridi */
.facts{border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)}
.facts .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.fact{padding:26px 24px 26px 0;border-right:1px solid var(--cizgi);display:flex;flex-direction:column;gap:6px}
.fact+.fact{padding-left:24px}.fact:last-child{border-right:0}
.fact b{font:500 clamp(30px,3vw,44px)/1 var(--m);letter-spacing:-.05em}
@media (max-width:900px){.facts .wrap{grid-template-columns:1fr 1fr}.fact:nth-child(2){border-right:0}.fact:nth-child(3){padding-left:0}.fact:nth-child(-n+2){border-bottom:1px solid var(--cizgi)}}

/* bölüm */
.sec{padding:clamp(64px,9vw,140px) 0}
.sec-h{display:grid;grid-template-columns:4fr 8fr;gap:clamp(24px,4vw,64px);margin-bottom:clamp(36px,5vw,72px);align-items:end}
.sec-h .mono{align-self:start}
@media (max-width:900px){.sec-h{grid-template-columns:1fr}}

/* döngü */
.loop{display:grid;grid-template-columns:5fr 7fr;gap:clamp(28px,5vw,80px);align-items:center}
.ring{position:relative;max-width:520px;width:100%;aspect-ratio:1}
.ring svg{width:100%;height:100%;overflow:visible}
.ring .seg{cursor:pointer;opacity:.28;transition:opacity .5s var(--ease-k)}
.ring .seg.on,.ring .seg:hover{opacity:1}
.ring-c{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
.ring-c b{display:block;font:800 clamp(30px,3.4vw,48px)/1 var(--f);font-stretch:112%;letter-spacing:-.03em}
.tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--cizgi);margin-bottom:32px}
.tab{background:none;border:0;border-bottom:3px solid transparent;padding:14px 0;text-align:left;cursor:pointer;font:500 12.5px var(--m);text-transform:uppercase;letter-spacing:.03em;display:flex;gap:8px;align-items:center;min-height:48px;margin-bottom:-1px}
.tab i{width:10px;height:10px;display:inline-block}
.tab[aria-selected=true]{border-bottom-color:currentColor}
.panel{display:grid;gap:18px}
.panel h3{font-size:clamp(30px,3.4vw,52px);font-weight:800;font-stretch:112%;letter-spacing:-.035em;line-height:1}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font:500 12px var(--m);text-transform:uppercase;letter-spacing:.03em;border:1px solid currentColor;padding:6px 10px;display:inline-flex;gap:8px;align-items:center}
.chip i{width:8px;height:8px;background:currentColor}
.c-olc{color:var(--olc-t)}.c-calis{color:var(--akim-t)}.c-esne{color:var(--esne-t)}.c-besle{color:var(--besle-t)}
.panel .lnk{font:500 13px var(--m);text-transform:uppercase;text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:2px;justify-self:start}
@media (max-width:900px){.loop{grid-template-columns:1fr}.ring{max-width:300px;margin:0 auto}.tabs{grid-template-columns:repeat(2,1fr)}}

/* ölçüm kartı */
.card-sec{display:grid;grid-template-columns:5fr 7fr;gap:clamp(28px,5vw,80px);align-items:center}
.ocard{background:var(--kirec);color:var(--gece);padding:clamp(22px,3vw,40px);box-shadow:0 30px 60px -30px rgba(0,0,0,.55);position:relative}
.ocard .ruler{position:absolute;left:0;right:0;top:0;color:var(--gece)}
.ocard-h{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-top:8px}
.ocard-h h3{font-size:clamp(30px,3.2vw,48px);font-weight:800;font-stretch:112%;letter-spacing:-.035em}
.ocard-d{width:92px;flex:none}
.ocard-d .tk{fill:rgba(14,17,22,.2)}.ocard-d .tk.on{fill:var(--olc)}
.mets{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:clamp(28px,4vw,56px)}
.met{border-top:2px solid var(--gece);padding-top:12px}
.met b{display:block;font:500 clamp(28px,3vw,44px)/1.1 var(--m);letter-spacing:-.05em;margin-top:6px;font-variant-numeric:tabular-nums}
.met b small{font-size:.38em;letter-spacing:0;color:var(--beton);margin-left:3px}
.met .bar{height:6px;background:var(--cizgi);margin-top:12px;position:relative}
.met .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--olc);width:0;transition:width .9s var(--ease-k)}
.met .d{color:var(--besle-t);margin-top:6px}
.months{display:flex;gap:8px;margin-top:26px}
.months button{background:transparent;border:1.5px solid currentColor;min-height:44px;padding:0 14px;font:500 12.5px var(--m);text-transform:uppercase;cursor:pointer}
.months button[aria-pressed=true]{background:var(--kirec);color:var(--gece);border-color:var(--kirec)}
@media (max-width:900px){.card-sec{grid-template-columns:1fr}.mets{grid-template-columns:1fr 1fr}}

/* ilk ölçüm */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px)}
.step{border-top:3px solid var(--gece);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.step b{font:500 44px/1 var(--m);letter-spacing:-.05em;color:var(--akim-t)}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.steps{grid-template-columns:1fr}}
.book-f{display:grid;grid-template-columns:5fr 7fr;gap:clamp(28px,5vw,80px);margin-top:clamp(48px,7vw,96px);align-items:start}
form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:flex;flex-direction:column;gap:8px;font:500 12px var(--m);text-transform:uppercase;letter-spacing:.03em}
label.full{grid-column:1/-1}
input,select,textarea{font:400 17px var(--f);color:var(--gece);background:var(--kirec);border:0;border-bottom:1.5px solid var(--gece);padding:12px 2px;min-height:48px;border-radius:0;width:100%}
.band input,.band select{background:var(--kirec-2)}
input:focus,select:focus,textarea:focus{outline:none;border-bottom-color:var(--akim);box-shadow:0 2px 0 var(--akim)}
.check{flex-direction:row;align-items:flex-start;gap:12px;text-transform:none;font:400 14.5px/1.5 var(--f);letter-spacing:0}
.check input{width:20px;min-height:20px;height:20px;margin:2px 0 0;accent-color:var(--gece);flex:none}
.form-note{grid-column:1/-1;font-size:14px;color:var(--metin-2)}
.form-act{grid-column:1/-1;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.err{color:var(--akim-t);font:500 12px var(--m);text-transform:uppercase}
@media (max-width:900px){.book-f{grid-template-columns:1fr}}
@media (max-width:540px){form{grid-template-columns:1fr}}

/* dürüstlük paneli */
.honest{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--cizgi-a)}
.honest>div{background:var(--gece);padding:clamp(24px,3vw,44px);display:flex;flex-direction:column;gap:14px}
.honest ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.honest li{display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:start}
.honest li::before{content:"";width:10px;height:10px;margin-top:.5em;background:var(--besle)}
.honest .no li::before{background:var(--akim)}
@media (max-width:900px){.honest{grid-template-columns:1fr}}

/* sss */
.faq{border-top:1px solid var(--cizgi)}
.faq details{border-bottom:1px solid var(--cizgi)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:56px 1fr 28px;gap:12px;align-items:center;padding:22px 0;font:700 clamp(19px,1.8vw,24px)/1.25 var(--f);font-stretch:106%;letter-spacing:-.015em;min-height:48px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .n{font:500 12.5px var(--m);color:var(--akim-t)}
.faq summary::after{content:"+";font:400 26px/1 var(--m);text-align:right;transition:transform .5s var(--ease-k)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 40px 26px 68px}
@media (max-width:540px){.faq summary{grid-template-columns:36px 1fr 24px}.faq .a{padding:0 0 22px 48px}}

/* iletişim */
.contact{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px)}
.contact>div{border-top:1px solid var(--cizgi-a);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.contact a{text-decoration:none;border-bottom:1px solid currentColor;align-self:start}
@media (max-width:900px){.contact{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.contact{grid-template-columns:1fr}}

/* alt bant */
.foot{background:var(--gece);color:var(--kirec);padding:clamp(48px,6vw,88px) 0 32px}
.foot .big{width:min(100%,680px);line-height:0;margin-bottom:48px}
.foot .big svg{width:100%;height:auto}
.foot .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px;border-top:1px solid var(--cizgi-a);padding-top:24px}
.foot a{text-decoration:none;opacity:.85}.foot .muted{color:rgba(242,241,236,.72)}.foot a:hover{opacity:1}
.foot .cols div{display:flex;flex-direction:column;gap:8px}
.foot .fine{margin-top:40px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;opacity:.6}
@media (max-width:900px){.foot .cols{grid-template-columns:1fr 1fr}}

/* alt sayfalar */
.ph-hero{padding:clamp(48px,7vw,104px) 0 clamp(40px,5vw,72px);border-bottom:1px solid var(--cizgi)}
.ph-hero .wrap{display:grid;grid-template-columns:8fr 4fr;gap:40px;align-items:end}
.ph-hero h1{font-size:clamp(48px,7.4vw,120px)}
.ph-hero .ic{width:clamp(80px,9vw,140px);justify-self:end;color:var(--acc,var(--gece))}
.ph-hero .ic svg{width:100%;height:auto}
.prose{display:grid;grid-template-columns:4fr 8fr;gap:clamp(24px,4vw,64px)}
.prose .body{display:grid;gap:22px;font-size:18.5px}
.prose .body h2{font-size:clamp(28px,3vw,42px);margin-top:20px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:10px 24px;margin:0;align-self:start;position:sticky;top:100px}
.kv dt{font:500 12px var(--m);text-transform:uppercase;color:var(--beton);padding-top:.3em}
.kv dd{margin:0}
@media (max-width:900px){.ph-hero .wrap,.prose{grid-template-columns:1fr}.kv{position:static}.ph-hero .ic{justify-self:start}}
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,20px)}
.svc{display:flex;flex-direction:column;justify-content:space-between;gap:40px;min-height:340px;padding:26px;text-decoration:none;color:var(--gece);position:relative;transition:transform .5s var(--ease-k)}
.svc:hover{transform:translateY(-4px)}
.svc .ic{width:56px}.svc .ic svg{width:100%;height:auto}
.svc h2{font-size:clamp(26px,2.4vw,36px);font-weight:800;font-stretch:112%;letter-spacing:-.03em;line-height:1}
.svc.s-olc{background:var(--olc);color:var(--kirec)}.svc.s-calis{background:var(--akim)}.svc.s-esne{background:var(--esne);color:var(--kirec)}.svc.s-besle{background:var(--besle)}
@media (max-width:1100px){.svc-grid{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.svc-grid{grid-template-columns:1fr}.svc{min-height:240px}}

/* görünce gir (yalnızca hareket izni varsa) */
@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease-k),transform .5s var(--ease-k)}
  .rv.in{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.sec,.facts,.foot{content-visibility:auto;contain-intrinsic-size:auto 800px}
