/* =========================================================
   Kramer Calabriel — Kurumsal (kramer-calabriel.html)
   Yalnızca bu sayfada yüklenir. LAYOUT_CLASS: "page--single page--about"
   site.css tokenlarını kullanır.
   ========================================================= */

/* ---------- Sayfa iskeleti ---------- */
.page--about{padding-block:clamp(4rem,3rem + 4vw,7.5rem) clamp(5rem,3rem + 6vw,9rem)}
.page--about .page__grid{display:block}
.page--about .page__aside{display:none}
.page--about .page__main>*+*{margin-top:clamp(5.5rem,3.5rem + 6vw,10rem)}
.page--about .page__main>.ab-bleed+*,.page--about .page__main>*+.ab-bleed{margin-top:clamp(5.5rem,3.5rem + 6vw,10rem)}

/* Tam genişlik bant: içerik yine .wrap hizasında kalır */
.ab-bleed{position:relative;margin-inline:calc(50% - 50vw);padding-inline:calc(50vw - 50%);padding-block:clamp(4.5rem,3rem + 5vw,8.5rem)}
@supports (width:100dvw){.ab-bleed{margin-inline:calc(50% - 50dvw);padding-inline:calc(50dvw - 50%)}}

/* ---------- 1. Açılış ---------- */
.ab-intro{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(3rem,7vw,8rem);align-items:center}
.ab-intro__statement{margin:1.6rem 0 0;font-size:clamp(1.75rem,1.15rem + 1.75vw,2.85rem);line-height:1.16;font-weight:400;letter-spacing:-.01em;color:var(--char);text-wrap:balance}
.ab-intro .slogan{margin-top:2rem}
.ab-intro__body{margin-top:2rem;display:grid;gap:1rem;max-width:36rem}
.ab-intro__body p:first-child{font-size:var(--fs-lead);font-weight:300;line-height:1.65}
.ab-intro__body .muted{font-size:var(--fs-small)}

/* Katmanlı görsel kompozisyonu */
.ab-comp{position:relative;aspect-ratio:5/6;width:100%;max-width:36rem;justify-self:end}
.ab-comp figure{position:absolute;margin:0}
.ab-comp__main{left:0;top:0;width:64%;aspect-ratio:4/5;z-index:1;box-shadow:0 30px 60px -30px rgba(29,25,26,.45)}
.ab-comp__tall{right:4%;top:6%;width:28%;aspect-ratio:431/700}
.ab-comp__side{right:0;bottom:0;width:52%;aspect-ratio:4/3;z-index:2;outline:10px solid var(--cream);box-shadow:0 30px 60px -28px rgba(29,25,26,.5)}
.ab-comp__line{position:absolute;left:8%;top:9%;width:64%;height:78%;border:1px solid var(--line-gold);border-radius:999px 999px 0 0;z-index:0;pointer-events:none}
.ab-comp__badge{position:absolute;left:calc(64% - 2.6rem);top:calc(53% - 2.6rem);z-index:3;display:grid;place-items:center;width:5.2rem;height:5.2rem;border-radius:50%;background:var(--ink);border:1px solid var(--gold);box-shadow:0 0 0 6px var(--cream)}
.ab-comp__badge img{width:2.2rem;height:auto}
.ab-comp__cap{position:absolute;left:-2.2rem;bottom:0;transform-origin:left bottom;transform:rotate(-90deg) translateY(100%);font-size:var(--fs-tiny);letter-spacing:.32em;text-transform:uppercase;color:var(--gold-ink);white-space:nowrap}

/* ---------- 2. Üç disiplin ---------- */
.ab-pillars{background:var(--ink);overflow:hidden}
.ab-pillars::before{content:"";position:absolute;left:50%;top:0;width:1px;height:clamp(2.5rem,5vw,4.5rem);background:linear-gradient(var(--gold),transparent)}
.ab-pillars__head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(1.5rem,6vw,7rem);align-items:end;margin-bottom:clamp(3rem,2rem + 3vw,5rem)}
.ab-pillars__head h2{max-width:14em}
.ab-pillars__head p{color:var(--mist);max-width:34rem}
.ab-pillars__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.25rem,2.4vw,2.5rem);align-items:start}
.ab-pillar:nth-child(2){margin-top:clamp(0rem,4vw,4.5rem)}
.ab-pillar__media{position:relative;margin:0;aspect-ratio:4/5;overflow:hidden;background:var(--ink-2)}
.ab-pillar__media img{width:100%;height:100%;object-fit:cover;transition:transform 2s var(--ease),filter 1.2s var(--ease);filter:saturate(.92)}
.ab-pillar__media[data-parallax] img{height:118%;margin-top:-9%}
.ab-pillar__media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(29,25,26,.55),transparent 45%);pointer-events:none}
.ab-pillar__body{position:relative;padding:1.8rem 0 0}
.ab-pillar__body::before{content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:var(--line-dark)}
.ab-pillar__body::after{content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:var(--gold);transform:scaleX(.18);transform-origin:left;transition:transform 1s var(--ease)}
.ab-pillar:hover .ab-pillar__body::after{transform:scaleX(1)}
.ab-pillar:hover .ab-pillar__media img{transform:scale(1.05);filter:saturate(1)}
.ab-pillar__no{position:absolute;right:0;top:1.4rem;font-family:var(--serif);font-size:1.05rem;letter-spacing:.12em;color:var(--gold-soft)}
.ab-pillar__icon{display:block;width:3.4rem;height:3.4rem;color:var(--gold-soft);margin-bottom:1.2rem}
.ab-pillar__icon svg{width:100%;height:100%}
.ab-pillar h3{font-size:var(--fs-h3);margin-bottom:.8rem}
.ab-pillar p{color:var(--mist);font-size:.98rem;max-width:26rem}

/* ---------- 3. Ekip ---------- */
.ab-team .sec-head{margin-bottom:clamp(2.5rem,1.5rem + 3vw,4rem)}
.ab-team__grid{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(1rem,1.6vw,1.5rem)}
.ab-role{grid-column:span 2;position:relative;display:grid;align-content:start;padding:clamp(1.6rem,2.4vw,2.4rem);background:#FCFAF6;border:1px solid var(--sand);transition:transform .7s var(--ease),box-shadow .7s var(--ease),border-color .7s var(--ease)}
.ab-role:nth-child(-n+2){grid-column:span 3}
.ab-role::before,.ab-role::after{content:"";position:absolute;width:1.6rem;height:1.6rem;border:0 solid var(--gold);transition:width .7s var(--ease),height .7s var(--ease)}
.ab-role::before{left:-1px;top:-1px;border-top-width:1px;border-left-width:1px}
.ab-role::after{right:-1px;bottom:-1px;border-bottom-width:1px;border-right-width:1px}
.ab-role:hover{transform:translateY(-4px);box-shadow:0 24px 50px -32px rgba(29,25,26,.4);border-color:var(--line-gold)}
.ab-role:hover::before,.ab-role:hover::after{width:calc(100% + 2px);height:calc(100% + 2px)}
.ab-role__icon{display:block;width:4.6rem;height:4.6rem;color:var(--char);margin-bottom:1.4rem}
.ab-role__icon svg{width:100%;height:100%}
.ab-role__niche{stroke:var(--gold)}
.ab-role__tag{font-size:var(--fs-tiny);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.55rem}
.ab-role h3{font-size:clamp(1.4rem,1.2rem + .6vw,1.75rem);margin-bottom:.8rem}
.ab-role__text{color:var(--stone);font-size:.98rem}
.ab-role:nth-child(-n+2) .ab-role__icon{width:5.4rem;height:5.4rem}
.ab-role--muhendis{background:var(--ink);border-color:var(--ink);color:var(--cream)}
.ab-role--muhendis .ab-role__icon{color:var(--cream)}
.ab-role--muhendis .ab-role__niche{stroke:var(--gold-soft)}
.ab-role--muhendis .ab-role__tag{color:var(--gold-soft)}
.ab-role--muhendis .ab-role__text{color:var(--mist)}

/* ---------- 4. Çalışma ilkeleri ---------- */
.ab-principles{background:var(--linen);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(3rem,7vw,8rem);align-items:start}
.ab-principles__aside{position:sticky;top:calc(var(--header-h) + 2rem);display:grid;gap:1.4rem;justify-items:start}
.ab-principles__aside h2{position:relative;padding-left:1.6rem}
.ab-principles__aside h2::before{content:"";position:absolute;left:0;top:.12em;bottom:.08em;width:1px;background:var(--gold)}
.ab-principles__aside .muted{max-width:28rem}
.ab-principles__media{width:min(15rem,52%);aspect-ratio:3/5;margin-top:1rem}
.ab-principles__list{list-style:none;counter-reset:pr;border-top:1px solid var(--sand)}
.ab-principles__list li{counter-increment:pr;display:grid;grid-template-columns:4.6rem minmax(0,1fr);column-gap:clamp(1rem,2vw,2rem);padding:clamp(1.5rem,2.5vw,2.2rem) 0;border-bottom:1px solid var(--sand);position:relative}
.ab-principles__list li::before{content:counter(pr,upper-roman);grid-row:span 2;font-family:var(--serif);font-size:clamp(1.9rem,1.5rem + 1vw,2.6rem);line-height:1;color:var(--gold-ink);font-style:italic}
.ab-principles__list li::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.ab-principles__list li:hover::after{transform:scaleX(1)}
.ab-principles__list h3{font-size:clamp(1.35rem,1.2rem + .5vw,1.65rem);margin-bottom:.45rem}
.ab-principles__list p{color:var(--stone);font-size:.98rem;max-width:36rem}

/* ---------- 5. Galeri ---------- */
.ab-gallery__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) auto;gap:1.5rem clamp(2rem,4vw,4rem);align-items:end;margin-bottom:clamp(2rem,1.5rem + 2vw,3.5rem)}
.ab-gallery__head .muted{max-width:30rem}
.ab-gallery__head .btn-arch{justify-self:start}

/* ---------- 6. Hizmet alanı ---------- */
.ab-region{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(3rem,7vw,8rem);align-items:center}
.ab-rings{position:relative;width:100%;max-width:32rem;aspect-ratio:1;justify-self:center}
.ab-rings__r,.ab-rings__core,.ab-rings__orbit{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%)}
.ab-rings__r{border:1px solid var(--sand)}
.ab-rings__r--4{width:100%;height:100%;background:radial-gradient(circle,rgba(239,231,218,.0) 55%,rgba(239,231,218,.8))}
.ab-rings__r--3{width:72%;height:72%}
.ab-rings__r--2{width:46%;height:46%;border-color:var(--line-gold);background:rgba(183,143,85,.07)}
.ab-rings__r em{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);padding:.15rem .7rem;background:var(--cream);font-style:normal;font-size:var(--fs-tiny);letter-spacing:.24em;text-transform:uppercase;color:var(--stone);white-space:nowrap}
.ab-rings__r--2 em{color:var(--gold-ink)}
.ab-rings__core{width:21%;height:21%;display:grid;place-content:center;text-align:center;background:var(--ink);color:var(--cream);box-shadow:0 0 0 8px rgba(183,143,85,.16),0 0 0 9px var(--line-gold)}
.ab-rings__core b{font-family:var(--serif);font-weight:400;font-size:clamp(1.05rem,.9rem + .6vw,1.45rem);line-height:1}
.ab-rings__core small{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-soft);margin-top:.3rem}
.ab-rings__orbit{width:86%;height:86%;border:1px dashed rgba(183,143,85,.45);animation:abOrbit 90s linear infinite}
.ab-rings__orbit::before{content:"";position:absolute;left:50%;top:-4px;width:7px;height:7px;margin-left:-3.5px;background:var(--gold);transform:rotate(45deg)}
@keyframes abOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
.ab-region__lead{margin:1.4rem 0 1rem;font-family:var(--serif);font-size:clamp(1.35rem,1.1rem + .8vw,1.8rem);line-height:1.3;color:var(--char)}
.ab-region__text>.muted{max-width:34rem}
.ab-tiers{margin:2.2rem 0 0;border-top:1px solid var(--sand)}
.ab-tiers>div{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:1rem;align-items:center;padding:.9rem 0;border-bottom:1px solid var(--sand)}
.ab-tiers dt{font-size:var(--fs-tiny);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-ink)}
.ab-tiers dd{margin:0}
.ab-tiers .chip{min-height:2.4rem}

/* ---------- 7. Kapanış ---------- */
.ab-close{position:relative;display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(2.5rem,6vw,7rem);align-items:center;padding:clamp(2rem,4vw,4rem);border:1px solid var(--sand);background:#FCFAF6}
.ab-close::before{content:"";position:absolute;inset:10px;border:1px solid rgba(183,143,85,.28);pointer-events:none}
.ab-close__media{aspect-ratio:4/5;width:100%;max-width:22rem}
.ab-close__body h2{margin-bottom:1.2rem}
.ab-close__body .muted{max-width:34rem}
.ab-close__actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.4rem;margin-top:2.2rem}
.btn-catalog svg{flex:none}

/* ---------- Duyarlı ---------- */
@media (max-width:1100px){
  .ab-team__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ab-role,.ab-role:nth-child(-n+2){grid-column:span 1}
  .ab-role:last-child{grid-column:1/-1}
  .ab-gallery__head{grid-template-columns:minmax(0,1fr) auto}
  .ab-gallery__head .muted{grid-column:1/-1;grid-row:2}
}
@media (max-width:960px){
  .ab-intro{grid-template-columns:minmax(0,1fr)}
  .ab-comp{justify-self:center;max-width:34rem;margin-inline:auto}
  .ab-pillars__head{grid-template-columns:minmax(0,1fr)}
  .ab-principles{grid-template-columns:minmax(0,1fr)}
  .ab-principles__aside{position:static}
  .ab-principles__media{display:none}
  .ab-region{grid-template-columns:minmax(0,1fr)}
  .ab-rings{max-width:24rem;order:2}
  .ab-close{grid-template-columns:minmax(0,1fr)}
  .ab-close__media{max-width:none;aspect-ratio:16/10;border-radius:0}
  .ab-close__media::after{display:none}
}
@media (max-width:820px){
  .ab-pillars__grid{grid-template-columns:minmax(0,1fr);gap:2.8rem}
  .ab-pillar:nth-child(2){margin-top:0}
  .ab-pillar{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:1.4rem;align-items:start}
  .ab-pillar__body{padding-top:1.2rem}
}
@media (max-width:600px){
  .ab-comp{width:calc(100% - 1.4rem);margin-left:1.4rem}
  .ab-comp__cap{left:-1.6rem;letter-spacing:.24em;font-size:.68rem}
  .ab-comp__side{outline-width:6px}
  .ab-comp__badge{width:3.8rem;height:3.8rem;left:calc(64% - 1.9rem);top:calc(53% - 1.9rem);box-shadow:0 0 0 4px var(--cream)}
  .ab-comp__badge img{width:1.6rem}
  .ab-pillar{grid-template-columns:minmax(0,1fr)}
  .ab-pillar__media{aspect-ratio:3/2}
  .ab-team__grid{grid-template-columns:minmax(0,1fr)}
  .ab-role:last-child{grid-column:auto}
  .ab-role{padding:1.5rem 1.4rem 1.7rem}
  .ab-role__icon,.ab-role:nth-child(-n+2) .ab-role__icon{width:3.8rem;height:3.8rem;margin-bottom:1rem}
  .ab-principles__list li{grid-template-columns:3rem minmax(0,1fr)}
  .ab-gallery__head{grid-template-columns:minmax(0,1fr)}
  .ab-gallery__head .muted{grid-row:auto}
  .ab-tiers>div{grid-template-columns:minmax(0,1fr);gap:.5rem}
  .ab-close{padding:1.25rem 1.25rem 2rem}
  .ab-close__actions .btn{width:100%}
}

/* ---------- Hareket tercihi ---------- */
@media (prefers-reduced-motion:reduce){
  .ab-rings__orbit{animation:none}
  .ab-role,.ab-role::before,.ab-role::after,.ab-pillar__media img,.ab-pillar__body::after,.ab-principles__list li::after{transition:none}
  .ab-role:hover{transform:none}
}
