/* ===== BÖLÜM SEÇİMİ (AHŞAP / İNŞAAT) ===== */
html:not([data-site]) main,
html:not([data-site]) .nav,
html:not([data-site]) .footer{display:none}
html[data-site="ahsap"] [data-only="insaat"],
html[data-site="insaat"] [data-only="ahsap"]{display:none!important}
html[data-site] .gate{display:none}

.gate{position:fixed;inset:0;z-index:80;display:flex;background:var(--bg)}
.gate-top{position:absolute;z-index:5;top:clamp(18px,4vh,40px);left:0;right:0;text-align:center;pointer-events:none;display:grid;justify-items:center;gap:10px;opacity:0;animation:fadeUp 1s var(--ease) 1.5s forwards}
.gate-top img{height:64px;width:auto}
.gate-top p{font-size:.68rem;letter-spacing:.32em;text-transform:uppercase;color:var(--muted)}
.gate-card{position:relative;flex:1;border:0;background:none;overflow:hidden;cursor:pointer;display:grid;place-items:center;text-align:center;color:var(--cream);transition:flex .9s var(--ease);opacity:0;animation:gateIn 1.2s var(--ease) 1.3s forwards}
.gate-card+.gate-card{border-left:1px solid var(--line);animation-delay:1.45s}
@keyframes gateIn{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.gate-card:hover,.gate-card:focus-visible{flex:1.4;outline:0}
.gate-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.1);filter:brightness(.38);transition:transform 1.8s var(--ease),filter .9s}
.gate-card:hover .gate-bg,.gate-card:focus-visible .gate-bg{transform:scale(1.18);filter:brightness(.62)}
.gate-bg-i{background:radial-gradient(ellipse at 50% 20%,#2a2018,#16110e 70%)}
.gate-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,16,13,.85),rgba(20,16,13,.1) 60%)}
.gate-txt{position:relative;z-index:2;display:grid;justify-items:center;gap:14px;padding:20px}
.g-eye{font-size:.72rem;letter-spacing:.4em;color:var(--brass)}
.g-title{font-size:clamp(2.4rem,7vw,6rem);line-height:1;transition:letter-spacing .9s var(--ease),color .5s}
.gate-card:hover .g-title{letter-spacing:.16em;color:var(--brass)}
.g-cap{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);max-width:30ch}
.g-go{margin-top:12px;display:inline-flex;gap:12px;align-items:center;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;padding:12px 26px;border:1px solid rgba(243,234,217,.4);transition:.5s var(--ease)}
.g-go i{font-style:normal;transition:transform .5s var(--ease)}
.gate-card:hover .g-go{background:var(--brass);border-color:var(--brass);color:#1a1411}
.gate-card:hover .g-go i{transform:translateX(6px)}

/* gökdelen çizgileri */
.skyline{position:absolute;inset:0}
.skyline svg{position:absolute;left:0;right:0;bottom:0;width:100%;height:78%}
.skyline path{fill:none;stroke:var(--brass);stroke-width:1.2;vector-effect:non-scaling-stroke;opacity:.55;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 3.4s var(--ease) forwards;animation-delay:calc(var(--k)*70ms + .4s)}
.skyline path.fl{opacity:.22}
@keyframes draw{to{stroke-dashoffset:0}}

/* inşaat hero */
.hero-insaat{background:linear-gradient(180deg,#1d1612,var(--bg))}
.hero-insaat .hero-shade{background:radial-gradient(ellipse at 75% 25%,rgba(201,168,106,.16),transparent 55%),linear-gradient(90deg,rgba(20,16,13,.75),rgba(20,16,13,.1) 70%),linear-gradient(0deg,var(--bg) 0%,transparent 30%)}
.hero-art{position:absolute;inset:0;z-index:0}
.hero-insaat .hero-shade{z-index:1}
.hero-insaat .hero-inner{z-index:2}
.hero-art .skyline svg{height:72%}

/* nav bölüm anahtarı */
.switch{position:relative;display:flex;border:1px solid var(--line);padding:3px}
.switch button{position:relative;z-index:1;background:none;border:0;padding:7px 14px;font-family:var(--brand);font-size:.66rem;letter-spacing:.16em;color:var(--muted);cursor:pointer;transition:color .4s}
.switch button.on{color:#1a1411}
.sw-ind{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);background:var(--brass);transition:transform .6s var(--ease)}
html[data-site="insaat"] .sw-ind{transform:translateX(100%)}

/* hizmet kartları, zaman çizgisi */
.svc{grid-template-columns:repeat(3,1fr)}
.svc-link{text-align:left;color:inherit;cursor:pointer;font:inherit}
.svc-link b{display:block;margin-top:12px;color:var(--brass);font-weight:400;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}
.timeline{list-style:none;border-left:1px solid var(--line);margin-left:6px}
.timeline li{position:relative;display:grid;grid-template-columns:150px 1fr;gap:24px;padding:0 0 44px 34px}
.timeline li::before{content:"";position:absolute;left:-5px;top:12px;width:9px;height:9px;background:var(--brass);transform:rotate(45deg)}
.timeline b{font-size:clamp(1.6rem,3.4vw,2.6rem);color:var(--brass);font-weight:400;line-height:1.1}
.timeline h3{font-family:var(--serif);font-weight:400;font-size:1.7rem;margin-bottom:6px}
.timeline p{color:var(--muted);max-width:60ch}
.quote{margin-top:30px;padding:36px 0 0;border-top:1px solid var(--line);font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.4rem,3vw,2.2rem);line-height:1.35;color:var(--cream);max-width:34ch}

@media(max-width:980px){.svc{grid-template-columns:1fr}.timeline li{grid-template-columns:1fr;gap:6px}}
@media(max-width:820px){
  .gate{flex-direction:column}
  .gate-top{top:10px}.gate-top img{height:44px}.gate-top p{display:none}
  .gate-card:hover{flex:1.2}
  .gate-card+.gate-card{border-left:0;border-top:1px solid var(--line)}
  .switch button{padding:6px 10px;font-size:.6rem}
  .nav .switch{margin-left:auto}
  .brand-lockup{margin-right:0}
}
@media(max-width:560px){.brand-lockup .brand{display:none!important}}
@media(prefers-reduced-motion:reduce){.skyline path{animation:none;stroke-dashoffset:0}.gate-card,.gate-top{animation:none;opacity:1}}
@media(max-width:1320px){.nav-cta{display:none}.menu{gap:20px}.menu a{font-size:.68rem;letter-spacing:.14em}.nav{gap:18px}}
@media(max-width:1180px){.brand-lockup .brand{display:none!important}}