/* =========================================================
   Ahmet Büyükbakkal — kurumsal site
   Kartela: lacivert #0A1E3C · altın #C29B40 (açık zeminde #8F6E1F)
   Tipografi: Sora (başlık) · Inter (gövde)
   ========================================================= */
:root{
  --navy:#0A1E3C; --navy2:#13294B; --navy3:#1E3A63;
  --gold:#C29B40; --gold-deep:#8F6E1F; --gold-soft:#E3C878;
  --bg:#F7F6F2; --fg:#232A35; --muted:#66707E;
  --surface:#FFFFFF; --wash:#EEECE5; --line:#E0DDD3;
  --head:#0A1E3C;
  --font-disp:"Sora", Bahnschrift, "Segoe UI Semibold", "Segoe UI", Arial, sans-serif;
  --font-body:"Inter", "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:90px}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important; transition:none!important}
}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font-family:var(--font-body); font-size:16.5px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
/* grid/flex çocukları içsel görsel genişliğiyle kolonu taşırmasın */
.hero .wrap > *, .media2 > *, .grid2 > *, .grid3 > *, .stats .wrap > *{min-width:0}
img{max-width:100%; height:auto; display:block}
a{color:var(--gold-deep)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid var(--gold); outline-offset:2px}
strong{color:var(--head)}
.wrap{max-width:1120px; margin:0 auto; padding:0 24px}
.narrow{max-width:880px}

h1,h2,h3,h4{font-family:var(--font-disp); color:var(--head); line-height:1.22;
  letter-spacing:-.01em; text-wrap:balance; font-weight:600}
h1{font-size:clamp(1.9rem,4.6vw,3rem); margin:.3em 0}
h2{font-size:clamp(1.5rem,3vw,2.1rem); margin:.3em 0 .4em}
h3{font-size:1.25rem; margin:1.2em 0 .4em}
p{max-width:70ch; margin:.55em 0}
.big{font-size:1.12rem}
ul{padding-left:1.15em} li{margin:.32em 0; max-width:68ch}
.kicker{font-size:.74rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold-deep); margin:0 0 8px}
.center{text-align:center}
.center p{margin-left:auto; margin-right:auto}

/* ---------- header ---------- */
.site-header{position:sticky; top:0; z-index:50; background:var(--navy);
  border-bottom:1px solid rgba(255,255,255,.08)}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; min-height:72px; gap:16px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; padding:8px 0}
.brand img{width:38px; height:auto}
.brand .t{font-family:var(--font-disp); color:#fff; font-size:1rem; font-weight:600; letter-spacing:.02em; line-height:1.2}
.brand .t small{display:block; color:var(--gold-soft); font-size:.66rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase}
.nav{display:flex; gap:4px; align-items:center}
.nav a{color:#C9D2E0; text-decoration:none; font-size:.9rem; font-weight:500;
  padding:10px 13px; border-radius:6px}
.nav a:hover{color:#fff; background:rgba(255,255,255,.07)}
.nav a[aria-current="page"]{color:var(--gold-soft)}
.nav a.cta{background:var(--gold); color:var(--navy); font-weight:700; margin-left:8px}
.nav a.cta:hover{background:var(--gold-soft); color:var(--navy)}
.menu-btn{display:none; background:none; border:1px solid rgba(255,255,255,.25); border-radius:6px;
  color:#fff; padding:10px 14px; font-size:.9rem; cursor:pointer; min-height:44px}
@media (max-width:920px){
  .menu-btn{display:block}
  .nav{display:none; position:absolute; top:72px; left:0; right:0; background:var(--navy2);
    flex-direction:column; align-items:stretch; padding:10px 16px 18px; gap:2px;
    border-bottom:1px solid rgba(255,255,255,.1)}
  .nav.open{display:flex}
  .nav a{padding:14px 12px; font-size:1rem}
  .nav a.cta{margin:10px 0 0; text-align:center}
}

/* ---------- hero (ana sayfa) ---------- */
.hero{background:linear-gradient(160deg,var(--navy) 0%,var(--navy2) 70%,var(--navy3) 100%); color:#fff; overflow:hidden}
.hero .wrap{display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:center; padding-top:64px; padding-bottom:0}
.hero h1{color:#fff; margin:.25em 0 .3em}
.hero .kicker{color:var(--gold-soft)}
.hero p.sub{color:#B9C4D6; font-size:1.08rem; max-width:56ch}
.hero .actions{display:flex; gap:12px; flex-wrap:wrap; margin:26px 0 44px}
.hero .photo{align-self:end}
.hero .photo img{max-width:400px; width:100%; margin:0 auto; border-radius:10px 10px 0 0;
  border:1px solid rgba(227,200,120,.3); border-bottom:none}
.btn{display:inline-block; text-decoration:none; font-weight:700; font-size:.92rem;
  padding:14px 26px; border-radius:6px; min-height:44px}
.btn-gold{background:var(--gold); color:var(--navy)}
.btn-gold:hover{background:var(--gold-soft)}
.btn-ghost{color:var(--gold-soft); border:1px solid rgba(227,200,120,.5)}
.btn-ghost:hover{border-color:var(--gold-soft); background:rgba(227,200,120,.08)}
.btn-navy{background:var(--navy); color:#fff}
.btn-navy:hover{background:var(--navy3)}
@media (max-width:820px){
  .hero .wrap{grid-template-columns:1fr; gap:8px; padding-top:44px}
  .hero .photo img{max-width:300px}
  .hero .actions{margin-bottom:36px}
}

/* ---------- stats ---------- */
.stats{background:var(--navy2); border-top:1px solid rgba(255,255,255,.08); color:#fff}
.stats .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:0; padding:0}
.stat{text-align:center; padding:26px 12px; border-left:1px solid rgba(255,255,255,.08)}
.stat:first-child{border-left:none}
.stat b{display:block; font-family:var(--font-disp); font-size:2.1rem; color:var(--gold-soft);
  font-variant-numeric:tabular-nums; line-height:1.15}
.stat span{font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:#9FB0C8}
@media (max-width:640px){
  .stats .wrap{grid-template-columns:1fr 1fr}
  .stat:nth-child(3){border-left:none}
  .stat{border-top:1px solid rgba(255,255,255,.08)}
  .stat:nth-child(-n+2){border-top:none}
}

/* ---------- page band (iç sayfa başlığı) ---------- */
.pageband{background:linear-gradient(160deg,var(--navy) 0%,var(--navy2) 100%); color:#fff; padding:52px 0 46px}
.pageband h1{color:#fff; font-size:clamp(1.7rem,3.8vw,2.5rem)}
.pageband .kicker{color:var(--gold-soft)}
.pageband p{color:#B9C4D6; max-width:62ch; font-size:1.05rem}
.crumbs{font-size:.78rem; color:#8FA0BC; margin-bottom:14px}
.crumbs a{color:#8FA0BC; text-decoration:none}
.crumbs a:hover{color:var(--gold-soft)}

/* ---------- sections ---------- */
section{padding:64px 0}
section.tight{padding:44px 0}
section.alt{background:var(--wash)}
.rule{width:56px; height:3px; background:var(--gold); border:none; margin:18px 0}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:20px}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media (max-width:820px){ .grid2,.grid3{grid-template-columns:1fr} }

.tile{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:26px 28px}
.tile h3{margin:.4em 0 .35em; font-size:1.08rem}
.tile p{font-size:.94rem; margin:.25em 0}
.tile .lnk{display:inline-block; margin-top:12px; font-size:.8rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:var(--gold-deep); text-decoration:none}
.tile .lnk:hover{color:var(--navy)}
.tile .ico{width:44px; height:44px; border-radius:8px; background:var(--navy);
  display:flex; align-items:center; justify-content:center}
.tile .ico svg{width:22px; height:22px; stroke:var(--gold-soft); fill:none; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round}

.media2{display:grid; grid-template-columns:minmax(240px,400px) 1fr; gap:44px; align-items:center}
.media2.rev{grid-template-columns:1fr minmax(240px,400px)}
.media2 img{border-radius:10px; box-shadow:0 14px 40px rgba(10,30,60,.14)}
@media (max-width:820px){ .media2,.media2.rev{grid-template-columns:1fr; gap:24px} }

.darkband{background:linear-gradient(160deg,var(--navy) 0%,var(--navy2) 100%); color:#fff}
.darkband h2,.darkband h3{color:#fff}
.darkband p{color:#C3CCDB}
.darkband .kicker{color:var(--gold-soft)}
.darkband .grid3 > div{border-top:2px solid var(--gold); padding-top:14px}
.darkband .grid3 b{color:#F0E7CF; display:block; margin-bottom:4px; font-family:var(--font-disp); font-weight:600}
.darkband .grid3 p{font-size:.92rem; margin:.2em 0}

/* ---------- timeline ---------- */
.timeline{list-style:none; padding:0; margin:24px 0}
.timeline li{display:grid; grid-template-columns:130px 1fr; gap:20px; padding:15px 0;
  border-bottom:1px solid var(--line); margin:0; max-width:none}
.timeline li:last-child{border-bottom:none}
.timeline .yr{font-family:var(--font-disp); color:var(--gold-deep); font-size:1.12rem;
  font-weight:600; font-variant-numeric:tabular-nums}
.timeline p{margin:0; font-size:.96rem}
@media (max-width:560px){ .timeline li{grid-template-columns:1fr; gap:2px} }

/* ---------- hizmet dizini (kaydırmasız, sarmalanan panel) ---------- */
.svc-index{background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:10px 22px; margin:0 0 28px; display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:0 36px}
.svc-index a{display:flex; gap:12px; align-items:center; text-decoration:none; color:var(--head);
  font-size:.92rem; font-weight:600; padding:12px 4px; min-height:44px; border-radius:6px}
.svc-index a:hover{color:var(--gold-deep)}
.svc-index a:hover .n{background:var(--gold); color:var(--navy)}
.svc-index .n{font-family:var(--font-disp); color:var(--gold-deep); background:var(--wash);
  border-radius:6px; min-width:30px; height:30px; display:flex; align-items:center; justify-content:center;
  font-size:.74rem; font-weight:700; font-variant-numeric:tabular-nums; flex-shrink:0}
.svc{background:var(--surface); border:1px solid var(--line); border-radius:10px;
  padding:26px 28px; margin:14px 0; scroll-margin-top:100px}
.svc h3{margin:.1em 0 .3em; font-size:1.12rem}
.svc p{font-size:.96rem; margin:.3em 0}
.svc .for{font-size:.85rem; color:var(--muted)}
.svc .for b{color:var(--gold-deep); font-weight:700; letter-spacing:.07em; text-transform:uppercase; font-size:.72rem}
.svc .num{font-family:var(--font-disp); color:var(--gold); font-size:.85rem; font-weight:700; letter-spacing:.1em}

/* ---------- süreç adımları ---------- */
.steps{counter-reset:st; list-style:none; padding:0; margin:20px 0}
.steps li{counter-increment:st; display:grid; grid-template-columns:46px 1fr; gap:16px;
  padding:13px 0; max-width:none; border-bottom:1px dashed var(--line)}
.steps li:last-child{border-bottom:none}
.steps li::before{content:counter(st,decimal-leading-zero); font-family:var(--font-disp);
  color:var(--gold-deep); font-size:1.15rem; font-weight:600; padding-top:2px; font-variant-numeric:tabular-nums}
.steps b{color:var(--head)}
.steps p{margin:.15em 0 0; font-size:.94rem}

/* ---------- SSS ---------- */
.faq details{background:var(--surface); border:1px solid var(--line); border-radius:10px; margin:10px 0}
.faq summary{cursor:pointer; padding:16px 20px; font-weight:600; color:var(--head);
  list-style:none; font-size:.98rem; min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+"; color:var(--gold-deep); font-weight:700; margin-right:12px}
.faq details[open] summary::before{content:"–"}
.faq .a{padding:0 20px 16px 44px; font-size:.94rem}
.faq .a p{margin:.3em 0}

/* ---------- alıntı kartı ---------- */
.quotecard{background:linear-gradient(160deg,var(--navy) 0%,var(--navy2) 100%); color:#EDE8DC;
  border-radius:12px; padding:30px 32px}
.quotecard p{font-family:var(--font-disp); font-size:1.12rem; line-height:1.55; margin:0;
  color:#EDE8DC; font-weight:400}
.quotecard cite{display:block; margin-top:14px; font-style:normal; font-size:.76rem;
  letter-spacing:.12em; text-transform:uppercase; color:var(--gold-soft)}

/* ---------- form ---------- */
.form{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:30px 32px}
.form label{display:block; font-weight:600; color:var(--head); font-size:.9rem; margin:16px 0 6px}
.form label:first-of-type{margin-top:0}
.form input[type="text"],.form input[type="email"],.form textarea{
  width:100%; border:1px solid var(--line); border-radius:8px; background:var(--bg);
  padding:13px 14px; font:inherit; font-size:16px; color:var(--fg)}
.form input:focus,.form textarea:focus{border-color:var(--gold); outline:none}
.form textarea{min-height:140px; resize:vertical}
.form .kvkk{display:flex; gap:10px; align-items:flex-start; margin:18px 0; font-size:.85rem; color:var(--muted)}
.form .kvkk input{width:18px; height:18px; margin-top:3px; accent-color:var(--gold-deep)}
.form button{border:none; cursor:pointer; width:100%}
.form .ok{display:none; background:#EAF4EC; border:1px solid #BFDCC7; color:#2E5C3F;
  border-radius:8px; padding:14px 16px; margin-top:16px; font-size:.92rem}
.contact-info{font-size:.98rem}
.contact-info div{display:flex; flex-wrap:wrap; gap:6px 12px; padding:13px 0; border-bottom:1px solid var(--line); align-items:baseline}
.contact-info div:last-child{border-bottom:none}
.contact-info b{min-width:120px; color:var(--head); font-size:.82rem; letter-spacing:.06em; text-transform:uppercase}
.contact-info a{text-decoration:none; font-weight:600}
.mapbox{background:var(--wash); border:1px dashed var(--line); border-radius:12px;
  display:flex; align-items:center; justify-content:center; min-height:220px;
  color:var(--muted); font-size:.9rem; text-align:center; padding:20px}

/* ---------- footer ---------- */
.site-footer{background:var(--navy); color:#94A3BC; margin-top:20px}
.site-footer .top{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:32px; padding:52px 0 36px}
.site-footer h4{color:#fff; font-family:var(--font-disp); font-size:.95rem; margin:0 0 12px; font-weight:600}
.site-footer p{font-size:.9rem; color:#94A3BC; max-width:44ch}
.site-footer .motto{color:var(--gold-soft); font-size:.92rem; margin-top:10px}
.site-footer ul{list-style:none; padding:0; margin:0}
.site-footer li{margin:.45em 0}
.site-footer a{color:#C9D2E0; text-decoration:none; font-size:.9rem}
.site-footer a:hover{color:var(--gold-soft)}
.site-footer .social{display:flex; gap:10px; margin-top:14px}
.site-footer .social a{display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; border:1px solid rgba(255,255,255,.2); border-radius:8px}
.site-footer .social a:hover{border-color:var(--gold-soft)}
.site-footer .social svg{width:20px; height:20px; fill:#C9D2E0}
.site-footer .social a:hover svg{fill:var(--gold-soft)}
.site-footer .bottom{border-top:1px solid rgba(255,255,255,.1); padding:18px 0;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:.8rem}
.site-footer .bottom a{font-size:.8rem}
@media (max-width:820px){ .site-footer .top{grid-template-columns:1fr; gap:26px} }

/* ---------- reveal animasyonu ---------- */
.reveal{opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease}
.reveal.in{opacity:1; transform:none}
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1; transform:none} }