/* =========================
   ABOUT — CLEAN FINAL
   (single source of truth)
   ========================= */

body.page-about{background:#f6f1ec;color:#121212;overflow-x:hidden}
body.page-about .brand{color:#121212}
body.page-about .hb span{background:#121212}
body.page-about .menu-btn{color:#121212}
body.page-about .brand-img{filter:invert(1);opacity:.95}

/* Drawer: About = BLACK (okunurluk) */
body.page-about .ink__backdrop{background:rgba(0,0,0,.14);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
body.page-about .ink__drawer{background:#000;border-right:1px solid rgba(255,255,255,.08);box-shadow:0 24px 90px rgba(0,0,0,.75)}
body.page-about .ink__drawer::before{display:none}
body.page-about .ink__ghost{display:none}
body.page-about .ink__list a{color:rgba(243,244,246,.95);opacity:.72;filter:none}
body.page-about .ink__list:hover a{filter:none}
body.page-about .ink__list li:hover>a{opacity:1;transform:translateX(6px)}
body.page-about .ink__list .current-menu-item>a{opacity:1}
body.page-about .ink__list .current_page_item>a{opacity:1}
body.page-about .ink__list .current-menu-ancestor>a{opacity:1}
body.page-about .ink__corner{color:rgba(243,244,246,.55)}
body.page-about .ink__social{color:rgba(243,244,246,.70)}
body.page-about .ink__sociallink{color:rgba(243,244,246,.70)}
body.page-about .ink__sociallink:hover{color:rgba(243,244,246,.95)}

/* Layout */
.about-main{min-height:100vh}
.about{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:140px 28px 84px}
.about-shell{width:min(860px,100%);display:flex;justify-content:center}
.about-stack{position:relative;width:100%;isolation:isolate}

/* Layer order: layer3 (shadow) -> bw -> panel */
.about-layer3{position:absolute;left:-130px;top:50%;transform:translateY(-50%);width:610px;height:580px;border-radius:34px;pointer-events:none;opacity:.34;z-index:0;background:radial-gradient(80% 80% at 20% 40%,rgba(0,0,0,.12),rgba(0,0,0,.06) 45%,rgba(0,0,0,0) 75%)}
.about-layer3{-webkit-mask-image:radial-gradient(90% 90% at 15% 70%,#000 0%,#000 55%,transparent 90%);mask-image:radial-gradient(90% 90% at 15% 70%,#000 0%,#000 55%,transparent 90%)}
.about-layer3::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(85% 85% at 85% 20%,rgba(246,241,236,1) 0%,rgba(246,241,236,.85) 35%,rgba(246,241,236,0) 70%)}

/* BW card (2. katman) */
.about-bw{position:absolute;left:-78px;top:50%;transform:translateY(-50%);width:560px;height:540px;border-radius:28px;background-image:var(--aboutImg);background-size:cover;background-position:center 60%;box-shadow:none;pointer-events:none;overflow:visible;z-index:1;opacity:.55;filter:grayscale(1) contrast(.98) brightness(1.02)}
.about-bw::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgba(246,241,236,0) 60%,rgba(246,241,236,.55) 100%)}
.about-bw::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.60;background:linear-gradient(90deg,rgba(246,241,236,.92) 0%,rgba(246,241,236,.70) 40%,rgba(246,241,236,.30) 66%,rgba(246,241,236,0) 86%)}

/* Panel (NO glow/shadow) */
.about-panel{width:100%;min-height:240px;position:relative;border-radius:22px;overflow:hidden;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:none;z-index:2}
.about-panel::before{display:none}
/* Banding/çizgi fix: noise overlay */
.about-panel::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:25;opacity:.035;mix-blend-mode:overlay;background-image: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='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");background-size:160px 160px}

/* Media (left) */
.about-media{position:absolute;inset:0 auto 0 0;width:60%;min-width:260px}
.about-img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 55%;filter:contrast(.98) saturate(.98);transform:translateX(-55px)}
.about-img--empty{background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,255,255,.42))}
.about-media::before{display:none}
/* beyaza geçişi yumuşat (banding kırma) */
.about-media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.06) 40%,rgba(255,255,255,.22) 58%,rgba(255,255,255,.55) 64%,rgba(255,255,255,.86) 78%,rgba(255,255,255,.98) 100%)}

/* Content (right) */
.about-content{position:relative;z-index:2;min-height:240px;display:flex;align-items:center;padding:28px 34px 28px 50%;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0) 38%)}
.about-copy{max-width:70ch}
.about-title{margin:0 0 10px 0;font-family:"Inter",ui-sans-serif,system-ui;font-weight:850;font-size:clamp(24px,2.5vw,34px);letter-spacing:.15em;color:#121212;text-transform:uppercase}
.about-text{font-family:"Inter",ui-sans-serif,system-ui;font-size:13.5px;line-height:1.55;color:rgba(18,18,18,.72)}
.about-text p{margin:10px 0}
.about-text p:first-child{margin-top:0}
.about-text p:last-child{margin-bottom:0}

/* Responsive */
@media (max-width:980px){
.about{padding:120px 18px 64px}
.about-shell{width:min(720px,100%)}
.about-bw{display:none}
.about-layer3{display:none}
.about-panel{min-height:0}
.about-media{position:relative;width:100%;min-width:0;height:340px}
.about-media::after{background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.10) 42%,rgba(255,255,255,.56) 66%,rgba(255,255,255,.92) 86%,rgba(255,255,255,.98) 100%)}
.about-content{min-height:0;padding:22px 22px 28px 22px}
.about-img{transform:none;object-position:50% 55%}
}

@media (max-width:520px){
.about-media{height:270px}
.about-panel{border-radius:20px}
.about-title{font-size:26px}
.about-text{font-size:13.2px}
}
/* =========================
   ABOUT — hamburger X white when menu open (mobile)
   ========================= */
@media (max-width:420px){
  body.page-about.menu-open .hb span{
    background:#fff !important;
  }
}