/* ============================================================
   Олег Мосеев — персональный сайт
   Светлая, минималистичная система, крупная типографика,
   тёплый терракотовый акцент.
   ============================================================ */

:root{
  --bg:        #f5f1ea;   /* warm off-white */
  --surface:   #ffffff;
  --ink:       #1f1a15;   /* warm near-black */
  --ink-soft:  #4c443c;
  --muted:     #8c8278;
  --line:      #e4dccf;
  --accent:    #FC4C01;   /* vivid orange */
  --accent-2:  #d63f00;
  --accent-ink:#ffffff;
  --dark-bg:   #051019;
  --dark-surface:#0f1d28;
  --dark-ink:  #f3f4f6;
  --dark-muted:#9fb0bd;
  --dark-line: rgba(255,255,255,.12);

  --maxw: 1240px;
  --pad: clamp(20px, 5vw, 64px);
  --sec-y: clamp(88px, 12vw, 168px);

  --ff-head: 'Manrope', system-ui, sans-serif;
  --ff-body: 'Manrope', system-ui, sans-serif;

  --r-sm: 8px;
  --r-md: 16px;
  --r-lg: 28px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:84px; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--ff-body);
  font-weight:400;
  font-size:clamp(16px,1.05vw,18px);
  line-height:1.6;
  letter-spacing:-0.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }

/* ---------- typography ---------- */
h1,h2,h3,h4{ font-family:var(--ff-head); font-weight:800; line-height:1.02; letter-spacing:-0.03em; margin:0; text-wrap:balance; }
.display{ font-size:clamp(44px,9vw,128px); }
.h-xl{ font-size:clamp(34px,5.6vw,76px); }
.h-lg{ font-size:clamp(28px,4vw,52px); }
.h-md{ font-size:clamp(22px,2.6vw,34px); font-weight:700; }
.kicker{
  font-family:var(--ff-head);
  font-size:clamp(12px,1vw,14px);
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
}
.lead{ font-size:clamp(18px,1.5vw,23px); line-height:1.5; color:var(--ink-soft); text-wrap:pretty; }
p{ margin:0 0 1.1em; text-wrap:pretty; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--ff-head); font-weight:700; font-size:1rem;
  padding:.92em 1.6em; border-radius:100px; border:1px solid transparent;
  cursor:pointer; transition:transform .35s var(--ease), background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
  letter-spacing:-0.01em; white-space:nowrap;
}
.btn .arr{ transition:transform .35s var(--ease); }
.btn:hover .arr{ transform:translateX(4px); }
.btn--accent{ background:var(--accent); color:var(--accent-ink); }
.btn--accent:hover{ background:var(--accent-2); transform:translateY(-2px); box-shadow:0 14px 34px -14px color-mix(in srgb,var(--accent) 80%, transparent); }
.btn--ghost{ border-color:var(--ink); color:var(--ink); }
.btn--ghost:hover{ background:var(--ink); color:var(--bg); transform:translateY(-2px); }
.btn--light{ border-color:var(--dark-line); color:var(--dark-ink); }
.btn--light:hover{ background:var(--dark-ink); color:var(--dark-bg); transform:translateY(-2px); }

/* ---------- header ---------- */
.hdr{
  position:fixed; inset:0 0 auto 0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--pad);
  transition:background .4s var(--ease), box-shadow .4s var(--ease), padding .4s var(--ease), color .4s var(--ease);
}
.hdr.scrolled{ background:color-mix(in srgb,var(--bg) 88%, transparent); backdrop-filter:blur(14px); box-shadow:0 1px 0 var(--line); padding-block:12px; }
.hdr__brand{ font-family:var(--ff-head); font-weight:800; font-size:1.18rem; letter-spacing:-0.02em; }
.hdr__nav{ display:flex; gap:clamp(14px,1.6vw,30px); align-items:center; }
.hdr__nav a{ font-size:.92rem; font-weight:600; color:var(--ink-soft); position:relative; padding:6px 0; transition:color .3s var(--ease); }
.hdr__nav a::after{ content:''; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--accent); transition:width .3s var(--ease); }
.hdr__nav a:hover{ color:var(--ink); }
.hdr__nav a:hover::after{ width:100%; }
.hdr__menu-btn{ display:none; }

@media (max-width: 980px){
  .hdr__nav{
    position:fixed; inset:0; flex-direction:column; justify-content:center; gap:8px;
    background:var(--bg); transform:translateY(-100%); transition:transform .5s var(--ease);
    pointer-events:none;
  }
  .hdr__nav.open{ transform:translateY(0); pointer-events:auto; }
  .hdr__nav a{ font-size:1.4rem; }
  .hdr__menu-btn{
    display:flex; flex-direction:column; gap:5px; width:42px; height:42px; align-items:center; justify-content:center;
    background:none; border:none; cursor:pointer; z-index:60;
  }
  .hdr__menu-btn span{ width:24px; height:2px; background:var(--ink); transition:transform .35s var(--ease), opacity .35s var(--ease); }
  .hdr__menu-btn.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .hdr__menu-btn.open span:nth-child(2){ opacity:0; }
  .hdr__menu-btn.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
}

/* ---------- hero ---------- */
.hero{ padding-top:clamp(120px,16vh,170px); padding-bottom:var(--sec-y); }
.hero .kicker{ margin:0 0 clamp(14px,1.6vw,22px); }
.hero__title{
  font-family:var(--ff-head); font-weight:800; letter-spacing:-0.04em; line-height:.92;
  font-size:clamp(64px,12vw,168px); margin:0 0 clamp(34px,5vw,64px);
}
.hero__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,80px); align-items:center; }
.hero__theses{ list-style:none; margin:0 0 clamp(28px,3.4vw,40px); padding:0; display:flex; flex-direction:column; }
.hero__theses li{
  font-family:var(--ff-head); font-weight:700; letter-spacing:-0.02em;
  font-size:clamp(18px,1.7vw,24px); line-height:1.18;
  padding:clamp(11px,1.25vw,15px) 0; border-top:1px solid var(--line);
  display:flex; gap:.7em; align-items:baseline;
}
.hero__theses li:last-child{ border-bottom:1px solid var(--line); }
.hero__theses li .dot{ flex:none; width:.42em; height:.42em; border-radius:50%; background:var(--accent); transform:translateY(-.12em); }
.hero__photo{ position:relative; }
.hero__photo img{ width:100%; aspect-ratio:1/1; object-fit:cover; object-position:64% 40%; border-radius:var(--r-lg); }
@media (max-width: 900px){
  .hero__grid{ grid-template-columns:1fr; gap:clamp(24px,5vw,40px); }
  .hero__photo{ order:-1; }
  .hero__photo img{ aspect-ratio:16/11; object-position:60% 24%; }
}

/* ---------- generic section ---------- */
.section{ padding-block:var(--sec-y); position:relative; }
.section--alt{ background:var(--surface); }
.section--dark{ background:var(--dark-bg); color:var(--dark-ink); }
.section--dark .kicker{ color:var(--accent); }
.section--dark .lead{ color:var(--dark-muted); }
.section__head{ max-width:18ch; }
.eyebrow-row{ display:flex; align-items:center; gap:14px; margin-bottom:22px; }
.eyebrow-row .idx{ font-family:var(--ff-head); font-weight:700; font-size:.85rem; color:var(--muted); letter-spacing:.05em; }
.eyebrow-row .ln{ height:1px; flex:1; background:var(--line); }
.section--dark .eyebrow-row .ln{ background:var(--dark-line); }
.section--dark .eyebrow-row .idx{ color:var(--dark-muted); }

/* ---------- strategic ---------- */
.strat__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,5vw,80px); align-items:start; margin-top:clamp(36px,4vw,56px); }
.strat__list{ list-style:none; margin:0; padding:0; columns:1; }
.strat__lists{ display:flex; flex-direction:column; gap:clamp(26px,3vw,40px); }
.strat__list--primary li{
  position:relative; padding:16px 0 16px 34px; border-top:1px solid var(--line);
  font-family:var(--ff-head); font-weight:700; letter-spacing:-0.01em;
  font-size:clamp(18px,1.7vw,24px); line-height:1.25; color:var(--ink);
}
.strat__list--primary li:last-child{ border-bottom:1px solid var(--line); }
.strat__list--primary li::before{
  content:''; position:absolute; left:2px; top:50%; margin-top:-5px; width:11px; height:11px; border-radius:2px;
  background:var(--accent); transform:rotate(45deg);
}
.strat__list--secondary{ display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(20px,2.4vw,34px); }
.strat__list--secondary li{
  position:relative; padding:11px 0 11px 22px; border-top:1px solid var(--line);
  font-size:clamp(13px,1vw,15px); line-height:1.45; color:var(--muted);
}
.strat__list--secondary li::before{
  content:''; position:absolute; left:2px; top:18px; width:6px; height:6px; border-radius:50%;
  background:var(--ink-soft); opacity:.4;
}
@media (max-width:560px){ .strat__list--secondary{ grid-template-columns:1fr; } }
.strat__media{ position:sticky; top:96px; }
.strat__media img{ width:100%; border-radius:var(--r-lg); aspect-ratio:4/5; object-fit:cover; }
@media (max-width: 900px){ .strat__grid{ grid-template-columns:1fr; } .strat__media{ position:static; } .strat__media img{ aspect-ratio:4/5; object-fit:cover; object-position:center top; } }

/* ---------- projects ---------- */
.proj{ border-top:1px solid var(--line); }
.proj--dark{ border-top-color:var(--dark-line); }
.proj__inner{ display:grid; grid-template-columns:0.92fr 1.08fr; gap:clamp(34px,5vw,76px); align-items:start; }
.proj__inner.rev{ grid-template-columns:1.08fr 0.92fr; }
.proj__inner.rev .proj__text{ order:2; }
.proj__logo{ font-family:var(--ff-head); font-weight:800; font-size:clamp(30px,3.6vw,52px); letter-spacing:-0.03em; margin-bottom:.5em; }
.proj__logo .ai{ color:var(--accent); }
.proj__tag{ display:inline-block; font-family:var(--ff-head); font-weight:700; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin-bottom:18px; }
.proj__desc{ font-size:clamp(16px,1.25vw,19px); line-height:1.62; color:var(--ink-soft); margin-bottom:28px; }
.proj--dark .proj__desc{ color:var(--dark-muted); }
.proj__media img{ width:100%; border-radius:var(--r-md); object-fit:cover; }
@media (max-width: 900px){
  .proj__inner, .proj__inner.rev{ grid-template-columns:1fr; }
  .proj__inner.rev .proj__text{ order:0; }
}

/* project logos */
.proj-logo-img{ display:block; height:auto; object-fit:contain; margin-bottom:22px; }
.proj-logo-img--jaky{ width:clamp(112px,13vw,150px); aspect-ratio:120/40; }
.proj-logo-img--carsale{ width:clamp(108px,12vw,146px); aspect-ratio:120/40; }
.proj-logo-img--anfisa{ width:clamp(150px,17vw,206px); aspect-ratio:177/40; }
.proj-logo-img--lks{ width:clamp(154px,18vw,232px); aspect-ratio:1400/777; }

/* gallery (Лига КС) */
.gallery{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.gallery img{ width:100%; height:100%; object-fit:cover; border-radius:var(--r-sm); aspect-ratio:3/2; }
.gallery img:first-child{ grid-column:1 / -1; aspect-ratio:2/1; }

/* ---------- Анфиса diagrams ---------- */
.anfisa-slides{ display:flex; flex-direction:column; gap:18px; }
.aslide{ background:var(--dark-surface); border:1px solid var(--dark-line); border-radius:var(--r-md); padding:clamp(20px,2.4vw,30px); }
.aslide__title{ font-family:var(--ff-head); font-weight:700; font-size:clamp(16px,1.5vw,21px); margin-bottom:6px; }
.aslide__title b{ color:var(--accent); }
.aslide__sub{ color:var(--dark-muted); font-size:.95rem; margin-bottom:18px; }
.branch{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.chip{ background:rgba(252,76,1,.14); border:1px solid rgba(252,76,1,.4); color:#ff9c6e; border-radius:100px; padding:.7em 1em; font-family:var(--ff-head); font-weight:700; text-align:center; font-size:.95rem; }
.flow{ display:flex; flex-direction:column; gap:0; }
.step{ display:grid; grid-template-columns:auto 1fr; gap:16px; padding:13px 0; }
.step:not(:last-child){ border-bottom:1px solid var(--dark-line); }
.step__num{ width:34px; height:34px; border-radius:50%; background:var(--accent); color:#fff; font-family:var(--ff-head); font-weight:800; font-size:.9rem; display:flex; align-items:center; justify-content:center; flex:none; }
.step__t{ font-family:var(--ff-head); font-weight:700; font-size:1rem; color:var(--dark-ink); }
.step__d{ color:var(--dark-muted); font-size:.88rem; line-height:1.4; }
.aslide__note{ margin-top:16px; font-size:.85rem; color:var(--accent); font-weight:600; }

/* ---------- JAKY visual ---------- */
.jaky-visual{ position:relative; background:linear-gradient(160deg,#2a241d,#1f1a15); border-radius:var(--r-lg); padding:clamp(26px,3vw,42px); overflow:hidden; aspect-ratio:1/1; display:flex; align-items:flex-end; }
.jaky-orb{ position:absolute; top:-30%; right:-15%; width:70%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 35% 35%, color-mix(in srgb,var(--accent) 90%, #fff 0%), var(--accent-2) 60%, transparent 72%);
  filter:blur(2px); animation:float 9s var(--ease) infinite alternate; }
@keyframes float{ to{ transform:translate(-12px,18px) scale(1.06); } }
.jaky-grid{ position:relative; display:grid; grid-template-columns:1fr 1fr; gap:1px; width:100%; background:var(--dark-line); border:1px solid var(--dark-line); border-radius:var(--r-md); overflow:hidden; }
.jaky-grid div{ background:#231e18; padding:clamp(16px,1.8vw,24px); display:flex; flex-direction:column; gap:4px; transition:background .35s var(--ease); }
.jaky-grid div:hover{ background:#2e271f; }
.jaky-grid b{ font-family:var(--ff-head); font-weight:800; font-size:clamp(20px,2.4vw,30px); color:var(--accent); letter-spacing:-0.02em; }
.jaky-grid span{ color:var(--dark-muted); font-size:.86rem; }

/* ---------- CarSale ---------- */
.carsale-imgs{ display:flex; flex-direction:column; gap:16px; }
.carsale-imgs img{ border-radius:var(--r-md); border:1px solid var(--dark-line); }

/* CarSale slider */
.cs-slider{ position:relative; }
.cs-frame{
  position:relative; width:100%; aspect-ratio:2348/1674;
  border-radius:var(--r-md); overflow:hidden;
  background:var(--dark-surface);
}
.cs-slide{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transform:scale(1.02); transition:opacity .6s var(--ease), transform .9s var(--ease);
  pointer-events:none;
}
.cs-slide.is-active{ opacity:1; transform:none; pointer-events:auto; }
.cs-nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:clamp(38px,3.4vw,48px); height:clamp(38px,3.4vw,48px); border-radius:50%;
  border:1px solid var(--dark-line); background:color-mix(in srgb,var(--dark-bg) 72%, transparent);
  backdrop-filter:blur(8px); color:var(--dark-ink); cursor:pointer;
  display:flex; align-items:center; justify-content:center; font-size:1.1rem; line-height:1;
  transition:background .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease);
}
.cs-nav:hover{ background:var(--accent); border-color:var(--accent); color:#fff; }
.cs-nav--prev{ left:14px; }
.cs-nav--next{ right:14px; }
.cs-nav--prev:hover{ transform:translateY(-50%) translateX(-2px); }
.cs-nav--next:hover{ transform:translateY(-50%) translateX(2px); }
.cs-dots{ display:flex; gap:9px; justify-content:center; margin-top:18px; }
.cs-dots button{
  width:9px; height:9px; padding:0; border-radius:50%; border:none; cursor:pointer;
  background:var(--dark-line); transition:background .3s var(--ease), width .3s var(--ease);
}
.cs-dots button.is-active{ background:var(--accent); width:26px; border-radius:100px; }

/* hero slider — square like the portrait */
.hero-slider .cs-frame{ aspect-ratio:16/9; border-radius:var(--r-lg); background:var(--surface); }
@media (max-width:900px){ .hero-slider .cs-frame{ aspect-ratio:16/9; } }

.cs-adv{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--dark-line); border:1px solid var(--dark-line); border-radius:var(--r-md); overflow:hidden; margin-top:clamp(32px,4vw,52px); }
.cs-adv__item{ background:var(--dark-surface); padding:clamp(20px,2vw,28px) clamp(20px,2vw,26px); display:flex; flex-direction:column; gap:8px; transition:background .35s var(--ease); }
.cs-adv__item:hover{ background:#332b22; }
.cs-adv__item b{ font-family:var(--ff-head); font-weight:700; font-size:clamp(15px,1.2vw,18px); color:var(--dark-ink); letter-spacing:-0.01em; }
.cs-adv__item span{ color:var(--dark-muted); font-size:clamp(13px,1vw,15px); line-height:1.5; }
@media (max-width:820px){ .cs-adv{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .cs-adv{ grid-template-columns:1fr; } }

/* ---------- publications ---------- */
.pub__grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:clamp(34px,5vw,72px); align-items:start; margin-top:clamp(34px,4vw,56px); }
.book3d{ perspective:1600px; padding:8px 0; }
.book3d__inner{
  position:relative; width:100%; aspect-ratio:3/4; border-radius:4px 8px 8px 4px;
  background:linear-gradient(120deg,#ff6a2e 0%,#fc4c01 52%,#c93c00 100%);
  box-shadow:
    0 50px 90px -40px rgba(0,0,0,.7),
    inset 0 0 0 1px rgba(255,255,255,.06);
  transform:rotateY(-16deg) rotateX(2deg); transform-origin:left center;
  transition:transform .7s var(--ease), box-shadow .7s var(--ease);
  display:flex; flex-direction:column; justify-content:flex-start;
  padding:clamp(26px,4vw,42px) clamp(24px,3.6vw,40px) clamp(30px,4vw,44px) clamp(36px,5vw,58px);
  overflow:hidden;
}
/* spine */
.book3d__inner::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:clamp(14px,2vw,22px);
  background:linear-gradient(90deg,rgba(0,0,0,.34),rgba(0,0,0,.08) 60%,transparent);
}
/* page edge */
.book3d__inner::after{
  content:''; position:absolute; right:-3px; top:2%; bottom:2%; width:6px; border-radius:2px;
  background:repeating-linear-gradient(90deg,#efe7d8,#efe7d8 1px,#d9cfba 1px,#d9cfba 2px);
}
.book3d:hover .book3d__inner{ transform:rotateY(-7deg) rotateX(1deg); box-shadow:0 60px 100px -42px rgba(0,0,0,.75), inset 0 0 0 1px rgba(255,255,255,.08); }
.book3d__eyebrow{ font-family:var(--ff-head); font-weight:700; font-size:clamp(11px,1vw,13px); letter-spacing:.22em; text-transform:uppercase; color:rgba(255,244,234,.72); }
.book3d__title{ font-family:var(--ff-head); font-weight:800; letter-spacing:-0.03em; line-height:.92; font-size:clamp(40px,6vw,70px); color:#fdf3e9; margin-top:auto; }
.book3d__rule{ width:46px; height:3px; background:rgba(253,243,233,.85); margin:clamp(14px,2vw,20px) 0; }
.book3d__author{ font-family:var(--ff-head); font-weight:700; font-size:clamp(15px,1.4vw,19px); color:#fdf3e9; letter-spacing:-0.01em; }
.pub__why{ list-style:none; margin:22px 0 30px; padding:0; }
.pub__why li{ position:relative; padding:11px 0 11px 30px; border-top:1px solid var(--dark-line); color:var(--dark-muted); font-size:clamp(15px,1.1vw,17px); }
.pub__why li::before{ content:''; position:absolute; left:0; top:19px; width:14px; height:2px; background:var(--accent); }
.pub__sub{ font-family:var(--ff-head); font-weight:700; color:var(--accent); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; margin:0 0 12px; }

/* ---------- about ---------- */
.about__intro{ max-width:24ch; }
.about__body{ margin-top:clamp(40px,5vw,68px); display:flex; flex-direction:column; }
.about-group{
  display:grid; grid-template-columns:240px 1fr; gap:clamp(24px,5vw,64px);
  padding:clamp(28px,3.6vw,48px) 0; border-top:1px solid var(--line);
}
.about-group__title{
  margin:0; align-self:start; position:sticky; top:96px;
  color:var(--accent); font-size:15px; font-weight:700; line-height:1.3; letter-spacing:-0.01em;
  text-wrap:balance;
}
.about-group--notitle .about-group__items{ grid-column:2; }
.about-group__items{ display:flex; flex-direction:column; gap:clamp(16px,1.8vw,22px); max-width:64ch; }
.about-group__items p{ margin:0; font-size:13px; font-weight:500; line-height:1.62; color:var(--ink-soft); }
.about-group__items p b{ display:block; font-size:15px; font-weight:700; color:var(--accent); margin-bottom:3px; letter-spacing:-0.01em; }

/* QR + link CTA */
.cta-qr{ display:inline-flex; align-items:center; gap:16px; margin-top:10px; padding:12px 20px 12px 12px;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease); max-width:440px; }
.cta-qr:hover{ transform:translateY(-2px); box-shadow:0 16px 34px -18px rgba(0,0,0,.3); border-color:var(--accent); }
.cta-qr__code{ width:66px; height:66px; flex:none; border-radius:8px; background:#fff; padding:4px; }
.cta-qr__text{ display:flex; flex-direction:column; gap:2px; }
.cta-qr__text b{ font-size:15px; font-weight:700; color:var(--ink); line-height:1.25; }
.cta-qr__text span{ font-size:13px; font-weight:500; color:var(--muted); }
.cta-qr__arr{ margin-left:auto; color:var(--accent); font-weight:700; transition:transform .35s var(--ease); }
.cta-qr:hover .cta-qr__arr{ transform:translateX(4px); }
.section--dark .cta-qr{ background:var(--dark-surface); border-color:var(--dark-line); }
.section--dark .cta-qr__text b{ color:var(--dark-ink); }
.section--dark .cta-qr__text span{ color:var(--dark-muted); }
.about__photos{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:clamp(32px,4vw,52px) 0; }
.about__photos img{ width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:var(--r-md); }
@media (max-width: 760px){
  .about-group{ grid-template-columns:1fr; gap:14px; }
  .about-group__title{ position:static; }
  .about-group--notitle .about-group__items{ grid-column:auto; }
  .about-group--notitle .about-group__title{ display:none; }
  .about__photos{ grid-template-columns:1fr; }
}

/* ---------- contacts ---------- */
.contacts{ background:var(--dark-bg); color:var(--dark-ink); }
.contacts__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--dark-line); border:1px solid var(--dark-line); border-radius:var(--r-md); overflow:hidden; margin-top:clamp(32px,4vw,52px); }
.contact-card{ background:var(--dark-bg); padding:clamp(24px,3vw,40px); transition:background .35s var(--ease); display:flex; flex-direction:column; gap:8px; min-height:150px; }
.contact-card:hover{ background:var(--dark-surface); }
.contact-card .lbl{ font-family:var(--ff-head); font-weight:700; font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); }
.contact-card .val{ font-family:var(--ff-head); font-weight:700; font-size:clamp(20px,2vw,30px); letter-spacing:-0.02em; margin-top:auto; word-break:break-word; }
@media (max-width: 640px){ .contacts__grid{ grid-template-columns:1fr; } }

.footer{ padding:40px var(--pad); background:var(--dark-bg); color:var(--dark-muted); border-top:1px solid var(--dark-line); display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; font-size:.85rem; }

/* ---------- reveal animations ---------- */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-d="1"]{ transition-delay:.08s; }
.reveal[data-d="2"]{ transition-delay:.16s; }
.reveal[data-d="3"]{ transition-delay:.24s; }
.reveal[data-d="4"]{ transition-delay:.32s; }
.reveal[data-d="5"]{ transition-delay:.40s; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }
body.no-anim .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }

/* ============================================================
   STRICT TYPE SYSTEM
   Headings H2 = 52px. All other text only two cuts:
   · Primary   15px / 700
   · Secondary 13px / 500
   ============================================================ */

/* — Headings — */
h1, h2, h3, h4 { font-weight:700; }
h2, .h-xl, .display { font-size:52px; font-weight:700; line-height:1.06; }
/* hero name stays a display title (size kept), weight normalised */
.hero__title{ font-weight:700; }
.book3d__title{ font-weight:700; }

/* — Secondary cut (base): 13 / 500 — */
body,
p, .lead, .proj__desc,
.about__cols p,
.strat__list--secondary li,
.cs-adv__item span,
.step__d, .aslide__sub,
.footer,
.kicker, .eyebrow-row .idx, .proj__tag, .pub__sub,
.contact-card .lbl, .book3d__eyebrow,
.hdr, .aslide__note, .jaky-grid span {
  font-size:13px;
  font-weight:500;
  line-height:1.5;
  letter-spacing:0;
}

/* — Primary cut: 15 / 700 — */
.lead, .btn,
.hdr__brand, .hdr__nav a,
.hero__theses li,
.strat__list--primary li,
.pub__why li, .chip,
.cs-adv__item b, .contact-card .val,
.step__t, .aslide__title,
.book3d__author,
.about__cols p b, .about__cols p strong,
.proj__desc b, .proj__desc strong {
  font-size:15px;
  font-weight:700;
  line-height:1.4;
  letter-spacing:-0.01em;
}

/* keep the uppercase tracking on labels (size/weight already normalised) */
.kicker, .eyebrow-row .idx, .proj__tag, .pub__sub,
.contact-card .lbl, .book3d__eyebrow { letter-spacing:.14em; }

/* mobile nav links follow the primary cut too */
@media (max-width: 980px){ .hdr__nav a{ font-size:15px; font-weight:700; } }

/* ============================================================
   DARK HERO + adaptive header
   ============================================================ */
.hero{ background:var(--dark-bg); color:var(--dark-ink); }
.hero__title{ color:var(--dark-ink); }
.hero__theses li{ color:var(--dark-ink); border-top-color:var(--dark-line); }
.hero__theses li:last-child{ border-bottom-color:var(--dark-line); }
.hero-slider .cs-frame{ background:var(--dark-surface); }

/* header sits over the dark hero first → light text; turns dark once the
   scrolled light bar appears */
.hdr{ color:var(--dark-ink); }
.hdr__brand{ color:currentColor; }
.hdr__nav a{ color:currentColor; opacity:.8; }
.hdr__nav a:hover{ color:currentColor; opacity:1; }
.hdr__menu-btn span{ background:currentColor; }
.hdr.scrolled{ color:var(--ink); }
.hdr.scrolled .hdr__brand{ color:var(--ink); }
.hdr.scrolled .hdr__nav a{ color:var(--ink-soft); opacity:1; }
.hdr.scrolled .hdr__nav a:hover{ color:var(--ink); }
@media (max-width: 980px){
  .hdr__nav.open a{ color:var(--ink); opacity:1; }
  .hdr__menu-btn.open span{ background:var(--ink); }
}

/* ============================================================
   MOBILE FIXES
   ============================================================ */
@media (max-width: 980px){
  /* closed nav must never leak over content */
  .hdr__nav{ display:none !important; }
  .hdr__nav.open{ display:flex !important; }
}
@media (max-width: 768px){
  h2, .h-xl, .display{ font-size:36px; }
  .pub__grid{ grid-template-columns:1fr; }
}
/* white hamburger on mobile (header bar stays dark) */
@media (max-width: 980px){
  .hdr.scrolled{ background:var(--dark-bg) !important; box-shadow:0 1px 0 rgba(255,255,255,.12); }
  .hdr.scrolled, .hdr.scrolled .hdr__brand{ color:#fff !important; }
  .hdr__menu-btn span{ background:#fff !important; }
  .hdr__menu-btn.open span{ background:var(--ink) !important; }
}