/* Ideally Us — site styles. White page, warm grey cards, one accent. Swap --accent to re-colour the whole site. */
:root {
  --bg: #FFFFFF;
  --soft: #F6F5F2;
  --soft-2: #ECEAE5;
  --ink: #111318;
  --muted: #5B616E;
  --faint: #8A8F99;
  --accent: #B5182B;
  --accent-hi: #D11F35;
  --accent-soft: #FBECEE;
  --accent-tint: rgba(181,24,43,.09);
  --red: var(--accent);
  --red-hi: var(--accent-hi);
  --rose: #E2A3AB;
  --blue: #10397A;
  --line: rgba(17,19,24,.08);
  --line-soft: rgba(17,19,24,.05);
  --shadow: 0 12px 40px rgba(17,19,24,.08);
  --shadow-lg: 0 30px 80px rgba(17,19,24,.14);
  --max: 1240px;
  --font: Geist, system-ui, -apple-system, "Segoe UI", sans-serif; /* test alternatives by pointing this at another family */
  --radius-xl: 24px;
  --radius-lg: 18px;
  --radius-md: 12px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html, body { overflow-x: clip; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font); -webkit-font-smoothing: antialiased; line-height: 1.5; }
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--accent); }
img { max-width: 100%; display: block; }
h1, h2, h3 { letter-spacing: -.035em; margin: 0; font-weight: 600; }
p { margin: 0; }
button, input, select { font-family: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
strong, b { font-weight: 600; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
main { position: relative; z-index: 0; }

.page { min-height: 100vh; display: flex; flex-direction: column; }
.page > main { flex: 1; }
.wrap { max-width: var(--max); margin: 0 auto; padding-left: 24px; padding-right: 24px; }

.eyebrow { margin: 0 0 14px; font-size: 13.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.eyebrow--faint, .eyebrow--dim { color: var(--faint); }
.eyebrow--rose { color: var(--accent); }
.box--dark .eyebrow, .case__outcome .eyebrow, .contact__box .eyebrow { color: rgba(255,255,255,.75); }
.h-display { font-size: clamp(38px, 5.4vw, 72px); line-height: 1.04; letter-spacing: -.04em; text-wrap: balance; }
.h-section { font-size: clamp(28px, 3.6vw, 44px); line-height: 1.1; letter-spacing: -.035em; text-wrap: balance; }
.h-section--lg { font-size: clamp(32px, 4.2vw, 52px); line-height: 1.06; }
.lede { font-size: clamp(15px, 1.3vw, 17px); line-height: 1.6; color: var(--muted); }
.text-accent, .text-red { color: var(--accent); }
.text-blue { color: var(--blue); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

/* Buttons */
.btn { display: inline-flex; align-items: center; gap: 10px; padding: 14px 24px; border-radius: 999px; font-size: 14px; font-weight: 600; border: 0; cursor: pointer; line-height: 1.2; transition: background .2s, color .2s, border-color .2s, box-shadow .2s, transform .2s; }
.btn--red { background: var(--accent); color: #fff; box-shadow: 0 10px 24px rgba(181,24,43,.22); }
.btn--red:hover { background: var(--accent-hi); color: #fff; transform: translateY(-1px); }
.btn--dark { background: var(--ink); color: #fff; }
.btn--dark:hover { background: #2A2E36; color: #fff; }
.btn--light { background: #fff; color: var(--ink); border: 1px solid var(--line); }
.btn--light:hover { border-color: var(--ink); color: var(--ink); }
.btn--white { background: #fff; color: var(--accent); }
.btn--white:hover { background: var(--soft); color: var(--accent); }
.btn--ghost { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.4); }
.btn--ghost:hover { border-color: #fff; color: #fff; }
.btn--outline { padding: 13px 22px; font-size: 14px; background: transparent; color: var(--ink); border: 1px solid rgba(17,19,24,.18); }
.btn--outline:hover { border-color: var(--accent); color: var(--accent); }
.btn--sm { padding: 10px 18px; font-size: 13px; }

/* Nav */
.nav { position: sticky; top: 0; z-index: 20; background: rgba(255,255,255,.88); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--line-soft); }
.nav__bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 14px; padding-bottom: 14px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); }
.brand:hover { color: var(--ink); }
.brand__logo { width: 40px; height: 40px; object-fit: contain; }
.brand__name { font-weight: 700; font-size: 21px; letter-spacing: -.03em; white-space: nowrap; }
.brand__name em { font-style: normal; color: var(--accent); }
.nav__links { display: flex; align-items: center; gap: 2px; }
.nav__links a { padding: 8px 14px; border-radius: 999px; font-size: 14px; font-weight: 500; color: var(--muted); }
.nav__links a:hover { color: var(--ink); }
.nav__links a[aria-current="page"] { color: var(--ink); font-weight: 600; }
.nav__actions { display: flex; align-items: center; gap: 10px; }
.nav__actions .btn--red { box-shadow: none; }
.nav__item { position: relative; display: flex; align-items: center; border-radius: 999px; }
.nav__item > a { padding-right: 4px; }
.nav__item.is-current > a { color: var(--ink); font-weight: 600; }
.nav__more { width: 24px; height: 32px; margin-right: 6px; border: 0; background: transparent; color: var(--muted); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; }
.nav__more:hover, .nav__item.is-open .nav__more { color: var(--ink); }
.nav__item.is-open .nav__more svg { transform: rotate(180deg); }
.nav__more svg { transition: transform .2s; }
.nav__tray { position: absolute; top: calc(100% + 12px); left: 50%; transform: translateX(-50%) translateY(-6px); width: 440px; padding: 8px; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-lg); display: flex; flex-direction: column; gap: 2px; opacity: 0; visibility: hidden; transition: opacity .18s, transform .18s, visibility 0s .18s; z-index: 30; }
.nav__tray::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.nav__item:hover .nav__tray, .nav__item:focus-within .nav__tray, .nav__item.is-open .nav__tray { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); transition: opacity .18s, transform .18s, visibility 0s; }
.nav__item.is-closed .nav__tray, .nav__item.is-closed:hover .nav__tray, .nav__item.is-closed:focus-within .nav__tray { opacity: 0; visibility: hidden; transform: translateX(-50%) translateY(-6px); transition: opacity .18s, transform .18s, visibility 0s .18s; }
.nav__links .nav__tray a { display: flex; flex-direction: column; gap: 3px; padding: 11px 14px; border-radius: 10px; color: var(--ink); font-weight: 600; font-size: 14px; }
.nav__links .nav__tray a:hover { background: var(--soft); color: var(--ink); }
.nav__links .nav__tray a span { font-size: 12.5px; font-weight: 400; line-height: 1.45; color: var(--muted); text-wrap: balance; }
.nav__links .nav__tray a.nav__tray-all { flex-direction: row; justify-content: space-between; margin-top: 4px; border-top: 1px solid var(--line-soft); border-radius: 0 0 10px 10px; color: var(--accent); font-size: 13px; }
.nav__menu-sub { display: flex; flex-direction: column; padding: 4px 0 8px 14px; border-bottom: 1px solid var(--line-soft); }
.nav__menu-sub a { padding: 9px 8px; font-size: 14px; font-weight: 500; color: var(--muted); border-bottom: 0; }
.nav__menu-sub a:hover { color: var(--accent); }
.nav__burger { display: none; width: 40px; height: 40px; border-radius: 999px; border: 1px solid var(--line); background: #fff; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 0; }
.nav__burger span { width: 16px; height: 2px; background: var(--ink); display: block; transition: transform .2s, opacity .2s; }
.nav__burger[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.nav__menu { display: none; flex-direction: column; gap: 4px; padding: 8px 24px 18px; border-top: 1px solid var(--line-soft); background: #fff; }
.nav__menu.is-open { display: flex; }
.nav__menu a { padding: 12px 8px; font-weight: 500; color: var(--ink); border-bottom: 1px solid var(--line-soft); }
.nav__menu > a:last-child { border-bottom: 0; color: var(--accent); }
@media (max-width: 900px) {
  .brand__logo { width: 36px; height: 36px; }
  .brand__name { font-size: 20px; }
  .nav__links { display: none; }
  .nav__burger { display: flex; }
  .hide-sm { display: none !important; }
}

/* Hero (home, solutions) and page heroes */
.hero-band { position: relative; overflow: clip; background: #fff; }
.hero { position: relative; z-index: 1; padding-top: clamp(40px, 6vw, 80px); padding-bottom: clamp(40px, 5vw, 64px); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 5vw, 64px); align-items: center; }
@media (max-width: 900px) { .hero__grid { grid-template-columns: 1fr; } }
.hero__copy { display: flex; flex-direction: column; gap: 24px; }
.hero__copy h1 { max-width: 14ch; }
.hero__copy .lede { max-width: 46ch; }
.hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.hero__art { position: relative; padding: 0 0 48px; }
.hero__caption { position: absolute; z-index: 5; left: 0; bottom: 0; max-width: 300px; padding: 20px 22px; background: #fff; border-radius: 16px; box-shadow: var(--shadow-lg); display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.hero-art__h { margin: 0; font-size: clamp(18px, 1.7vw, 22px); line-height: 1.12; letter-spacing: -.03em; font-weight: 700; color: var(--ink); text-wrap: balance; }
.hero-art__p { margin: 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
.mock__btn { margin-top: 4px; display: inline-block; padding: 7px 12px; border-radius: 999px; background: var(--accent); color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
@media (max-width: 900px) { .hero__caption { position: static; margin-top: -24px; max-width: none; } .hero__art { padding-bottom: 0; } }

/* The Two Risers as frames: photo in the client bar, lattice or a second photo in the advisor bar, crimson tip */
.risers { position: relative; width: 100%; aspect-ratio: 72 / 67; }
.riser { position: absolute; inset: 0; overflow: hidden; }
.riser--front { z-index: 3; background: var(--soft-2); clip-path: polygon(55.55% 94.02%, 100% 11.21%, 81.96% 0%, 37.51% 82.81%); }
.riser--back { z-index: 1; background: var(--soft); clip-path: polygon(18.04% 100%, 62.49% 17.19%, 44.45% 5.98%, 0% 88.79%); }
.riser--tip { z-index: 2; background: var(--accent); clip-path: polygon(54.16% 32.73%, 62.5% 17.19%, 44.45% 5.98%, 36.11% 21.53%); }
.riser picture, .riser img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
.riser--back img { opacity: .8; }
.riser .hero-art__lattice { position: absolute; inset: 0; width: 100%; height: 100%; }

/* The mark in negative space */
.ghost { position: absolute; z-index: 0; pointer-events: none; color: var(--ink); opacity: .05; height: auto; }
.ghost--hero { width: clamp(320px, 46vw, 680px); left: -10%; bottom: -34%; }
.ghost--page { width: clamp(260px, 32vw, 460px); right: -8%; top: -16%; opacity: .045; }
.ghost--about { display: none; }
.ghost--contact { color: #fff; opacity: .1; width: 54%; right: -16%; bottom: -50%; z-index: 0; }
.ghost--footer { width: 36%; right: -10%; bottom: -44%; opacity: .05; }
.ghost--art { color: #fff; opacity: .55; width: 44%; right: -10%; bottom: -26%; z-index: 2; }

/* Icon pillars strip */
.pillars { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px 0; }
.pillar { display: flex; flex-direction: column; gap: 6px; padding: 4px 28px; border-left: 1px solid var(--line); }
.pillar:first-child { border-left: 0; padding-left: 0; }
.pillar__ico { width: 44px; height: 44px; border-radius: 12px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; margin-bottom: 8px; }
.pillar__ico svg { width: 22px; height: 22px; }
.pillar strong { font-size: 16px; letter-spacing: -.015em; }
.pillar span:not(.pillar__ico) { font-size: 13.5px; line-height: 1.5; color: var(--muted); max-width: 30ch; }
@media (max-width: 700px) { .pillar { border-left: 0; padding-left: 0; } }

/* Trusted-by row */
.trusted { margin-top: clamp(36px, 5vw, 56px); padding-top: 28px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; align-items: center; gap: 14px 40px; }
.trusted__label { flex: none; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); }
.trusted__row { flex: 1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around; gap: 12px 32px; }
.trusted__item { font-size: clamp(16px, 1.4vw, 20px); font-weight: 600; letter-spacing: -.02em; color: var(--faint); white-space: nowrap; transition: color .2s; }
.trusted__item:hover { color: var(--ink); }
.trusted-section { padding-top: clamp(24px, 3vw, 40px); }
.trusted--flat { margin-top: 0; padding-top: 0; border-top: 0; padding-bottom: 28px; border-bottom: 1px solid var(--line); }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex: none; }

/* Section shells */
.band { background: transparent; }
.band--top { }
.band--soft, .band--dark, .band--navy, .case-band { background: var(--soft); color: var(--ink); }
.section { padding-top: clamp(56px, 7vw, 96px); padding-bottom: clamp(56px, 7vw, 96px); }
.section--tall { padding-top: clamp(64px, 8vw, 110px); padding-bottom: clamp(64px, 8vw, 110px); }
.section__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 40px; }
.section__head--tight { margin-bottom: 36px; }
.section__head .h-section { max-width: 20ch; }
.section__aside { max-width: 380px; color: var(--muted); font-size: 15px; line-height: 1.6; }

/* Cards: shared look */
.svc, .post, .card, .tile, .work, .fact, .principle, .kpi, .standard, .region, .foundation, .phase, .why__item, .founder__card, .article__author, .table-wrap, .stats__box { background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }

/* Services grid */
.services { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; }
.svc { display: flex; flex-direction: column; padding: 12px 12px 24px; border-radius: var(--radius-xl); position: relative; overflow: hidden; color: var(--ink); transition: transform .25s, box-shadow .25s; }
.svc:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); color: var(--ink); }
.svc__photo { order: -1; aspect-ratio: 16 / 10; border-radius: 14px; overflow: hidden; background: var(--soft-2); }
.svc__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 65% 55%; transition: transform .6s ease; }
.svc:hover .svc__photo img { transform: scale(1.03); }
.svc__top { display: flex; justify-content: space-between; align-items: center; padding: 20px 12px 0; }
.svc__tag { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.svc__n { font-size: 12px; font-weight: 700; color: var(--faint); }
.svc__body { display: flex; flex-direction: column; gap: 10px; padding: 12px 12px 0; flex: 1; }
.svc__body h3 { font-size: clamp(19px, 1.6vw, 22px); line-height: 1.15; letter-spacing: -.025em; }
.svc__body p { font-size: 14.5px; line-height: 1.55; color: var(--muted); }
.svc__more { margin-top: auto; padding-top: 16px; display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--accent); }

/* Solutions: what-we-build tiles */
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.tile { padding: 28px; border-radius: var(--radius-xl); display: flex; flex-direction: column; gap: 12px; }
.tile__ico { width: 48px; height: 48px; border-radius: 14px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; margin-bottom: 4px; }
.tile__ico svg { width: 24px; height: 24px; }
.tile h3 { font-size: 19px; letter-spacing: -.02em; }
.tile p { font-size: 14.5px; line-height: 1.55; color: var(--muted); flex: 1; }
.tile__link { display: inline-flex; gap: 8px; align-items: center; font-size: 13px; font-weight: 700; color: var(--accent); }

/* Red marquee banner */
.banner-wrap { overflow: hidden; margin: 24px 0 8px; padding: 12px 0; }
.banner { background: var(--accent); color: #fff; padding: 14px 0; overflow: hidden; white-space: nowrap; transform: rotate(-1.2deg) scale(1.02); }
.banner__row { display: inline-flex; gap: 48px; font-size: clamp(18px, 2.4vw, 28px); font-weight: 500; letter-spacing: -.01em; padding-left: 24px; }

/* Framework step tokens (used inside PQC phases) */
.step__n { font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; letter-spacing: -.03em; color: var(--accent); }
.step__deliv { margin-top: 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--faint); }

/* How we engage / process cards */
.engage h2 { margin-bottom: 40px; max-width: 22ch; }
.engage__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.engage__grid--4 { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.card { padding: 28px; border-radius: var(--radius-xl); display: flex; flex-direction: column; gap: 14px; }
.card__top { display: flex; justify-content: space-between; align-items: center; }
.card__num { width: 44px; height: 44px; border-radius: 12px; background: var(--accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 15px; }
.card__time { font-size: 12px; font-weight: 700; color: var(--faint); letter-spacing: .08em; text-transform: uppercase; }
.card h3 { font-size: clamp(18px, 1.6vw, 21px); letter-spacing: -.025em; }
.card p:not(.eyebrow) { color: var(--muted); font-size: 14.5px; line-height: 1.55; }

/* About block */
.about { padding-bottom: clamp(56px, 7vw, 96px); }
.about__box { position: relative; overflow: clip; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: center; padding: clamp(28px, 4vw, 56px); border-radius: var(--radius-xl); background: var(--soft); }
@media (max-width: 860px) { .about__box { grid-template-columns: 1fr; } }
.about__copy { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 20px; align-items: flex-start; }
.about__copy .h-section { max-width: 18ch; }
.about__copy > p:not(.eyebrow) { font-size: 15.5px; line-height: 1.6; color: var(--muted); max-width: 48ch; }
.about__copy .eyebrow { margin-bottom: 0; }
.checks { display: flex; flex-direction: column; gap: 12px; }
.checks li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; line-height: 1.45; color: var(--muted); }
.checks strong { color: var(--ink); }
.check { flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; margin-top: 1px; }
.check svg { width: 13px; height: 13px; stroke-width: 2.6; }
.about__art { position: relative; z-index: 1; padding: 0; }
.about__art .riser--back { background: var(--ink); }
.about__art .riser--front { background: var(--soft-2); box-shadow: var(--shadow-lg); }
.about__tile { position: absolute; z-index: 2; right: 0; bottom: 0; width: clamp(120px, 12vw, 150px); aspect-ratio: 1; border-radius: 18px; background: var(--accent); color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; gap: 4px; padding: 12px; box-shadow: 0 20px 44px rgba(181,24,43,.35); }
.about__tile strong { font-size: clamp(34px, 3.4vw, 46px); font-weight: 700; letter-spacing: -.04em; line-height: 1; }
.about__tile span { font-size: 12px; line-height: 1.3; opacity: .9; }

/* Selected work */
.work__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.work { display: flex; flex-direction: column; padding: 12px 12px 22px; border-radius: var(--radius-xl); color: var(--ink); overflow: hidden; transition: transform .25s, box-shadow .25s; }
.work:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); color: var(--ink); }
.work__art { aspect-ratio: 16 / 10; border-radius: 14px; overflow: hidden; background: var(--soft); display: grid; place-items: center; }
.work__art img { width: 100%; height: 100%; object-fit: cover; }
.work__art--logo { background: var(--soft); }
.work__art--logo img { width: 96px; height: 96px; object-fit: contain; }
.work__body { padding: 18px 12px 0; display: flex; flex-direction: column; gap: 8px; }
.work__kind { font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.work h3 { font-size: 19px; letter-spacing: -.025em; }
.work p { font-size: 14px; line-height: 1.55; color: var(--muted); }

/* Stats card */
.stats { padding-bottom: clamp(56px, 7vw, 96px); }
.stats__box { border-radius: var(--radius-xl); padding: clamp(24px, 3vw, 36px) clamp(24px, 4vw, 48px); display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 24px 32px; }
.stat { display: flex; align-items: center; gap: 16px; }
.stat__ico { flex: none; width: 52px; height: 52px; border-radius: 14px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; }
.stat__ico svg { width: 26px; height: 26px; }
.stat__n { display: block; font-size: clamp(28px, 3vw, 40px); font-weight: 700; letter-spacing: -.04em; line-height: 1; }
.stat__l { display: block; margin-top: 4px; font-size: 13.5px; color: var(--muted); }

/* Insights */
.posts { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.post { display: flex; flex-direction: column; color: var(--ink); border-radius: var(--radius-xl); overflow: hidden; padding: 12px 12px 22px; transition: transform .25s, box-shadow .25s; }
.post:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); color: var(--ink); }
.post__art { aspect-ratio: 16 / 10; border-radius: 14px; overflow: hidden; }
.post__art img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.post:hover .post__art img { transform: scale(1.03); }
.post__body { padding: 18px 12px 0; display: flex; flex-direction: column; gap: 10px; }
.post__meta { font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.post h3 { font-size: 19px; line-height: 1.25; letter-spacing: -.025em; text-wrap: pretty; }
.post__dek { font-size: 14px; line-height: 1.55; color: var(--muted); }
.posts--index { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }

/* Service page */
.svc-hero { position: relative; padding-top: clamp(32px, 5vw, 56px); padding-bottom: clamp(40px, 6vw, 80px); }
.backlink { font-size: 13px; font-weight: 700; color: var(--muted); display: inline-flex; gap: 8px; align-items: center; }
.backlink:hover { color: var(--accent); }
.svc-hero__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 32px; align-items: end; margin-top: 28px; }
.svc-hero__grid h1 { max-width: 16ch; }
.svc-hero__grid .lede { max-width: 460px; justify-self: end; }
.svc-art { margin-top: clamp(32px, 4vw, 48px); border-radius: var(--radius-xl); min-height: clamp(240px, 34vw, 460px); position: relative; overflow: clip; background: var(--soft-2); box-shadow: var(--shadow-lg); display: flex; align-items: flex-start; padding: clamp(24px, 3vw, 40px); isolation: isolate; }
.svc-art__photo { position: absolute; inset: 0; z-index: 1; }
.svc-art__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 65% 50%; display: block; }
.svc-art__line { position: relative; z-index: 3; color: var(--ink); font-size: clamp(24px, 3.4vw, 46px); line-height: 1.08; letter-spacing: -.035em; font-weight: 700; max-width: 20ch; text-wrap: balance; display: flex; flex-direction: column; gap: 14px; }
.svc-art__kicker { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }

.svc-detail { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 48px; }
.svc-detail h2 { margin-bottom: 24px; font-size: clamp(26px, 3vw, 36px); letter-spacing: -.035em; }
.what { display: flex; flex-direction: column; }
.what li { display: grid; grid-template-columns: 32px 1fr; gap: 12px; padding: 18px 0; border-top: 1px solid var(--line); }
.what__n { font-size: 13px; font-weight: 700; color: var(--accent); }
.what strong { display: block; font-weight: 600; font-size: 17px; letter-spacing: -.015em; margin-bottom: 4px; }
.what span:not(.what__n) { font-size: 14px; line-height: 1.55; color: var(--muted); }
.svc-side { display: flex; flex-direction: column; gap: 16px; }
.box { padding: 28px; border-radius: var(--radius-lg); }
.box--dark { background: var(--accent); color: #fff; box-shadow: 0 16px 40px rgba(181,24,43,.25); }
.box--dark p:not(.eyebrow) { font-size: 16px; line-height: 1.55; color: #fff; }
.box--soft { background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.box .eyebrow { margin-bottom: 14px; }
.deliv { display: flex; flex-direction: column; gap: 10px; }
.deliv li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; line-height: 1.45; }
.deliv .dot { margin-top: 7px; }
.box--note { padding: 22px 28px; background: var(--soft); font-size: 14px; color: var(--muted); line-height: 1.5; }
.box--note strong { color: var(--ink); }

/* Standards & regulation (PQC page) */
.landscape { display: flex; flex-direction: column; gap: 48px; }
.landscape__head { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 32px; align-items: end; }
.landscape__head .lede { max-width: 46ch; justify-self: end; }
.landscape__group { display: flex; flex-direction: column; gap: 14px; }
.standards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.standard { padding: 20px 22px; border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: 6px; }
.standard strong { font-weight: 600; font-size: 15px; letter-spacing: -.01em; }
.standard span { font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.regions { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.region { padding: 24px; border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: 12px; }
.region__top { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.region h3 { font-size: 18px; letter-spacing: -.02em; }
.status { padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #fff; }
.status--binding { background: var(--accent); }
.status--guidance { background: var(--ink); }
.status--emerging { background: var(--accent-soft); color: var(--accent); }
.region p:not(.eyebrow) { font-size: 14px; line-height: 1.55; color: var(--muted); }
.dates { display: flex; flex-direction: column; gap: 6px; }
.dates li { display: grid; grid-template-columns: 52px 1fr; gap: 10px; font-size: 13px; line-height: 1.45; }
.dates .year { font-weight: 700; color: var(--accent); }
.dates .text { color: var(--muted); }
.landscape__note { margin-top: 8px; font-size: 12px; line-height: 1.5; color: var(--faint); }

/* Other practices */
.others { padding-top: clamp(48px, 6vw, 80px); padding-bottom: clamp(48px, 6vw, 80px); }
.others .eyebrow { margin-bottom: 20px; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chips--nf { margin-top: 24px; }
.chip { padding: 12px 18px; border-radius: 999px; background: #fff; border: 1px solid var(--line); color: var(--ink); font-size: 14px; font-weight: 600; transition: border-color .2s, color .2s; }
.chip:hover { border-color: var(--accent); color: var(--accent); }

/* Contact / CTA */
.contact { padding-bottom: clamp(56px, 7vw, 96px); }
.contact__box { border-radius: var(--radius-xl); background: var(--accent); color: #fff; padding: clamp(36px, 5vw, 72px); display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 40px; position: relative; overflow: clip; box-shadow: 0 24px 60px rgba(181,24,43,.28); }
.contact__intro { position: relative; z-index: 1; }
.contact__intro h2 { margin-bottom: 16px; }
.contact__intro p { color: rgba(255,255,255,.85); font-size: 16px; line-height: 1.55; max-width: 42ch; }
.form { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; align-content: end; }
.form input, .form select { width: 100%; padding: 15px 16px; border-radius: 12px; border: 1px solid transparent; background: #fff; color: var(--ink); font: inherit; font-size: 14px; }
.form input:focus, .form select:focus { outline: 2px solid #fff; outline-offset: 2px; }
.form input::placeholder { color: var(--faint); }
.form select { grid-column: 1 / -1; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23111318' stroke-width='1.6' stroke-linecap='round'/></svg>"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; }
.form select option { color: var(--ink); }
.form button { grid-column: 1 / -1; padding: 16px 22px; }
.form__hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.form__turnstile { grid-column: 1 / -1; min-height: 65px; }
.form__err { grid-column: 1 / -1; margin: 0; padding: 12px 14px; border-radius: 10px; background: #fff; color: var(--accent); font-size: 14px; font-weight: 600; }
.form button[disabled] { opacity: .7; cursor: wait; }
.form__done { grid-column: 1 / -1; padding: 16px 18px; border-radius: 12px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.3); font-size: 14px; line-height: 1.5; color: #fff; }

/* Footer */
.footer { position: relative; overflow: clip; background: var(--soft); border-top: 1px solid var(--line-soft); }
.footer__top, .footer__legal, .footer__legal-line { position: relative; z-index: 1; }
.footer__top { padding-top: clamp(40px, 5vw, 64px); padding-bottom: 40px; display: flex; flex-wrap: wrap; gap: 32px 48px; justify-content: space-between; align-items: flex-start; }
.footer__brand { display: flex; flex-direction: column; gap: 14px; max-width: 320px; }
.footer__brand .brand__logo { width: 36px; height: 36px; }
.footer__brand .brand__name { font-size: 20px; }
.footer__brand p { color: var(--muted); font-size: 13.5px; line-height: 1.6; }
.footer__cols { display: flex; flex-wrap: wrap; gap: 32px 64px; }
.footer__col { display: flex; flex-direction: column; gap: 10px; font-size: 13.5px; }
.footer__col span { font-weight: 700; color: var(--faint); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 4px; }
.footer__col a { color: var(--ink); font-weight: 500; }
.footer__col a:hover { color: var(--accent); }
.footer__legal-line { max-width: var(--max); margin: 0 auto; border-top: 1px solid var(--line); }
.footer__legal { padding-top: 22px; padding-bottom: 28px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--faint); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .svc, .post, .chip, .btn, .card, .work { transition: none; }
}

/* Page hero (Insights, About, Platforms) */
.page-hero { position: relative; padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(40px, 6vw, 72px); }
.page-hero__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 32px; align-items: end; }
.page-hero__grid .lede { max-width: 480px; justify-self: end; }
.h-display--sm, .svc-hero__grid h1, .article__title { font-size: clamp(34px, 4.6vw, 60px); line-height: 1.06; letter-spacing: -.04em; font-weight: 600; text-wrap: balance; }
.h-display--sm { max-width: 16ch; }

/* Article */
.article__head { position: relative; padding-top: clamp(32px, 5vw, 56px); padding-bottom: 32px; max-width: 880px; }
.article__head .eyebrow { margin-top: 24px; }
.article__title { max-width: 20ch; }
.article__dek { margin-top: 18px; font-size: clamp(17px, 1.5vw, 21px); line-height: 1.5; color: var(--muted); max-width: 60ch; text-wrap: pretty; }
.article__byline { display: flex; align-items: center; gap: 12px; margin-top: 28px; font-size: 14px; }
.byline__avatar { width: 40px; height: 40px; border-radius: 12px; background: var(--accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; letter-spacing: .02em; flex: none; }
.byline__avatar:hover { color: #fff; background: var(--accent-hi); }
.byline__avatar--lg { width: 56px; height: 56px; border-radius: 16px; font-size: 16px; }
.byline__name { display: block; font-weight: 700; color: var(--ink); }
.byline__meta { display: block; color: var(--faint); font-size: 13px; }
.article__artwrap { padding-bottom: 0; }
.article__art { border-radius: var(--radius-xl); height: auto; aspect-ratio: 16 / 7; position: relative; overflow: hidden; margin: 0; box-shadow: var(--shadow-lg); }
.article__art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.article__body { padding-top: clamp(32px, 4vw, 56px); }
.article__foot { padding-top: clamp(32px, 4vw, 56px); padding-bottom: clamp(48px, 6vw, 80px); }
.article__author { display: flex; gap: 18px; align-items: flex-start; max-width: 720px; margin: 0 auto; padding: 24px 28px; border-radius: var(--radius-lg); }
.article__author .eyebrow { margin-bottom: 6px; }
.article__author-name { font-weight: 600; font-size: 17px; margin-bottom: 4px; }
.article__author-name a { color: var(--ink); }
.article__author-bio { font-size: 14px; line-height: 1.55; color: var(--muted); }

/* Prose */
.prose { max-width: 720px; margin: 0 auto; font-size: clamp(16px, 1.25vw, 18px); line-height: 1.7; color: var(--ink); }
.prose > * + * { margin-top: 1.15em; }
.prose h2 { font-size: clamp(22px, 2.2vw, 28px); line-height: 1.2; letter-spacing: -.025em; margin-top: 2em; }
.prose h3 { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.25; letter-spacing: -.02em; margin-top: 1.6em; }
.prose p { text-wrap: pretty; }
.prose ul { padding-left: 1.2em; list-style: disc; }
.prose li + li { margin-top: .5em; }
.prose strong { font-weight: 600; }
.prose a { color: var(--accent); text-decoration: underline; text-decoration-color: rgba(181,24,43,.35); text-underline-offset: 3px; }
.prose a:hover { color: var(--accent-hi); text-decoration-color: currentColor; }
.prose__lead { font-size: clamp(18px, 1.6vw, 22px); line-height: 1.55; font-weight: 500; }

/* About: founder */
.founder { display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
@media (max-width: 860px) { .founder { grid-template-columns: 1fr; } }
.founder__card { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 14px; padding: 16px 16px 24px; border-radius: var(--radius-xl); }
.founder__card > :not(.founder__tile) { margin-left: 8px; margin-right: 8px; }
.founder__tile { position: relative; aspect-ratio: 1; border-radius: 14px; overflow: hidden; background: var(--accent); display: flex; align-items: center; justify-content: center; }
.founder__tile span { position: relative; z-index: 2; color: #fff; font-weight: 700; font-size: clamp(56px, 8vw, 96px); letter-spacing: -.05em; }
.founder__name { font-size: 26px; letter-spacing: -.03em; margin-top: 6px; }
.founder__role { font-size: 14px; line-height: 1.5; color: var(--muted); }
.founder__links { display: flex; flex-wrap: wrap; gap: 8px; }
.founder__links a { display: inline-block; padding: 8px 12px; border-radius: 999px; background: var(--soft); border: 1px solid var(--line); font-size: 13px; font-weight: 600; color: var(--ink); }
.founder__links a:hover { border-color: var(--accent); color: var(--accent); }
.founder__card .btn { margin-top: 6px; justify-content: center; }
.prose--about { margin: 0; max-width: 680px; }
.why { display: grid; gap: 14px; margin-top: 1.2em; }
.why__item { padding: 22px 24px; border-radius: var(--radius-lg); }
.why__item h3 { margin: 0 0 8px; font-size: clamp(18px, 1.6vw, 21px); letter-spacing: -.02em; }
.why__item p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--muted); }

/* Case study */
.case-band { position: relative; overflow: hidden; }
.case { position: relative; display: flex; flex-direction: column; gap: clamp(28px, 4vw, 44px); }
.case__head { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px 48px; align-items: end; }
.case__head .h-section { max-width: 22ch; }
.case__client { font-size: 15px; line-height: 1.6; color: var(--muted); max-width: 44ch; justify-self: end; padding: 18px 22px; border-radius: 16px; background: #fff; border: 1px solid var(--line); }
.case__client strong { color: var(--ink); }
.case__art { margin: 0; border-radius: var(--radius-xl); overflow: hidden; aspect-ratio: 16 / 7; box-shadow: var(--shadow-lg); background: var(--soft-2); }
.case__art img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
.case__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.case__block { padding: 24px 26px; border-radius: var(--radius-lg); background: #fff; border: 1px solid var(--line); font-size: 15px; line-height: 1.6; color: var(--muted); }
.case__block .eyebrow, .case__outcome .eyebrow { margin-bottom: 10px; }
.case__block .deliv li { font-size: 14px; color: var(--ink); }
.flow { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; }
.flow__step { position: relative; padding: 24px 22px 26px; border-radius: var(--radius-lg); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 8px; }
.flow__step > * { position: relative; }
.flow__arrow { position: absolute; z-index: 2; right: -20px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; border-radius: 50%; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 16px rgba(181,24,43,.35); }
.flow__arrow svg { width: 12px; height: 12px; }
.flow__step:last-child .flow__arrow { display: none; }
.flow__n { font-size: 12px; font-weight: 700; letter-spacing: .1em; color: var(--accent); }
.flow__step h3 { font-size: 17px; letter-spacing: -.02em; }
.flow__step p { font-size: 13.5px; line-height: 1.55; color: var(--muted); }
.case__outcome { padding: 28px 30px; border-radius: var(--radius-lg); background: var(--accent); color: #fff; font-size: 16px; line-height: 1.6; position: relative; overflow: hidden; box-shadow: 0 16px 40px rgba(181,24,43,.25); }
.case__outcome > * { position: relative; z-index: 1; }
@media (max-width: 720px) {
  .flow { gap: 22px; }
  .flow__arrow { right: auto; left: 22px; top: auto; bottom: -19px; transform: none; }
  .flow__arrow svg { transform: rotate(90deg); }
}

/* PQC framework page */
.pqc-head { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px 48px; align-items: end; margin-bottom: clamp(32px, 4vw, 48px); }
.pqc-head .lede { max-width: 46ch; justify-self: end; font-size: 16px; }
.pqc-head .h-section { max-width: 24ch; }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.fact { padding: 26px 26px 28px; border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: 8px; }
.fact__stat { font-size: clamp(28px, 3vw, 40px); font-weight: 700; letter-spacing: -.03em; color: var(--accent); line-height: 1; margin-bottom: 8px; }
.fact strong { font-size: 17px; font-weight: 600; letter-spacing: -.01em; }
.fact p { font-size: 14.5px; line-height: 1.55; color: var(--muted); }
.mosca { margin-top: clamp(32px, 4vw, 48px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(28px, 4vw, 56px); align-items: center; padding: clamp(24px, 3vw, 40px); border-radius: var(--radius-xl); background: var(--ink); color: #fff; }
@media (max-width: 860px) { .mosca { grid-template-columns: 1fr; } }
.mosca .eyebrow { color: var(--rose); }
.mosca__text h3 { font-size: clamp(22px, 2.4vw, 30px); letter-spacing: -.03em; margin: 8px 0 14px; max-width: 22ch; }
.mosca__text p:not(.eyebrow) { font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.7); max-width: 46ch; }
.mosca__chart { margin: 0; font-size: 12px; }
.mosca__track { position: relative; height: 112px; border-bottom: 1px solid rgba(255,255,255,.25); }
.mosca__bars { position: absolute; left: 0; top: 34px; height: 36px; display: flex; width: 100%; }
.mosca__bar { display: flex; align-items: center; padding: 0 10px; white-space: nowrap; overflow: hidden; font-weight: 600; font-size: 12px; color: #fff; }
.mosca__bar--navy { background: rgba(255,255,255,.3); }
.mosca__bar--blue { background: #fff; color: var(--ink); }
.mosca__threat { position: absolute; top: 0; bottom: -1px; width: 2px; background: var(--accent-hi); }
.mosca__threat span { position: absolute; left: 8px; top: 0; white-space: nowrap; color: #fff; font-weight: 600; }
.mosca__exposed { position: absolute; top: 34px; height: 36px; border: 2px dashed var(--accent-hi); border-left: 0; box-sizing: border-box; }
.mosca__exposed span { position: absolute; left: 0; top: 44px; white-space: nowrap; color: var(--rose); font-weight: 600; }
.mosca__axis { position: relative; height: 20px; margin-top: 6px; color: rgba(255,255,255,.55); }
.mosca__axis span { position: absolute; transform: translateX(-50%); }
.mosca__axis span:first-child { transform: none; }
.mosca__chart figcaption { margin-top: 10px; color: rgba(255,255,255,.45); }
@media (max-width: 640px) { .mosca__threat span { left: auto; right: 8px; } .mosca__bar { padding: 0 6px; font-size: 11px; } }

.pqc-fw { display: flex; flex-direction: column; gap: clamp(36px, 5vw, 56px); }
.pqc-fw .pqc-head { margin-bottom: 0; }
.foundations h3 { font-size: clamp(20px, 2vw, 26px); letter-spacing: -.02em; margin: 6px 0 18px; }
.foundations__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.foundation { padding: 22px 24px; border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: 8px; }
.foundation strong { font-size: 16px; font-weight: 600; }
.foundation p { font-size: 14px; line-height: 1.55; color: var(--muted); }
.phases { display: flex; flex-direction: column; gap: 16px; }
.phase { display: grid; grid-template-columns: minmax(200px, 260px) minmax(0, 1fr); gap: 24px 40px; padding: 26px 28px; border-radius: var(--radius-lg); }
@media (max-width: 760px) { .phase { grid-template-columns: 1fr; } }
.phase__side { display: flex; flex-direction: column; gap: 6px; }
.phase__side h3 { font-size: clamp(22px, 2.2vw, 28px); letter-spacing: -.03em; }
.phase__aim { font-size: 14px; line-height: 1.5; color: var(--muted); }
.phase__main { display: flex; flex-direction: column; gap: 14px; }
.phase__main > p { font-size: 15px; line-height: 1.6; color: var(--ink); max-width: 64ch; }
.phase__acts { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 6px 24px; padding: 0; list-style: none; }
.phase__acts li { position: relative; padding-left: 16px; font-size: 14px; line-height: 1.5; color: var(--muted); }
.phase__acts li::before { content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.phase__foot { display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: baseline; padding-top: 12px; border-top: 1px solid var(--line); }
.phase__foot .step__deliv { margin-top: 0; }
.phase__board { font-size: 13px; color: var(--accent); }

.timeline { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; padding: 0; list-style: none; position: relative; }
.timeline::before { content: ""; position: absolute; left: 0; right: 0; top: 5px; height: 1px; background: var(--line); }
@media (max-width: 960px) { .timeline { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } .timeline::before { display: none; } }
.stage { position: relative; padding-top: 22px; display: flex; flex-direction: column; gap: 8px; }
.stage::before { content: ""; position: absolute; left: 0; top: 0; width: 11px; height: 11px; border-radius: 50%; background: var(--accent); }
.stage__when { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.stage h3 { font-size: 18px; letter-spacing: -.02em; }
.stage p { font-size: 14px; line-height: 1.55; color: var(--muted); }
.plan__lower { margin-top: clamp(36px, 5vw, 56px); display: grid; grid-template-columns: minmax(260px, 1fr) minmax(0, 2fr); gap: clamp(28px, 4vw, 56px); align-items: start; }
@media (max-width: 860px) { .plan__lower { grid-template-columns: 1fr; } }
.sequence ol { list-style: none; padding: 0; margin: 12px 0 0; display: flex; flex-direction: column; }
.sequence li { display: grid; grid-template-columns: 32px 1fr; gap: 12px; padding: 14px 0; border-top: 1px solid var(--line); font-size: 15px; line-height: 1.45; align-items: baseline; }
.sequence li:last-child { border-bottom: 1px solid var(--line); }
.sequence__n { font-size: 13px; font-weight: 700; color: var(--accent); }
.principles__grid { margin-top: 12px; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.principle { padding: 20px 22px; border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: 6px; }
.principle strong { font-size: 15px; font-weight: 600; }
.principle p { font-size: 13.5px; line-height: 1.5; color: var(--muted); }

.table-wrap { overflow-x: auto; border-radius: var(--radius-lg); }
.algo { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 720px; }
.algo th, .algo td { text-align: left; padding: 16px 18px; vertical-align: top; border-top: 1px solid var(--line); line-height: 1.5; }
.algo thead th { border-top: 0; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); background: var(--soft); }
.algo tbody th { font-weight: 600; color: var(--ink); white-space: nowrap; }
.algo td { color: var(--muted); }
.algo__now { color: var(--accent) !important; font-weight: 600; }
.kpis { margin-top: clamp(36px, 5vw, 56px); display: grid; grid-template-columns: minmax(240px, 1fr) minmax(0, 2.4fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
@media (max-width: 860px) { .kpis { grid-template-columns: 1fr; } }
.kpis h3 { font-size: clamp(20px, 2vw, 26px); letter-spacing: -.02em; margin-top: 6px; max-width: 18ch; }
.kpis__grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.kpi { padding: 18px 20px; border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: 6px; }
.kpi__n { font-size: 12px; font-weight: 700; color: var(--accent); }
.kpi strong { font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.kpi p { font-size: 13px; line-height: 1.5; color: var(--muted); }
.sources { margin-top: clamp(28px, 4vw, 40px); font-size: 13px; line-height: 1.6; color: var(--faint); max-width: 90ch; }

/* Platform Hub */
.plat__head { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.9fr); gap: 24px 48px; align-items: center; }
@media (max-width: 860px) { .plat__head { grid-template-columns: 1fr; } }
.plat__id { display: grid; grid-template-columns: 72px 1fr; gap: 20px; align-items: center; }
.plat__id--nologo { grid-template-columns: 1fr; }
.plat__logo { width: 72px; height: 72px; border-radius: 16px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); display: grid; place-items: center; padding: 10px; }
.plat__logo img { width: 100%; height: 100%; object-fit: contain; }
.plat__sub { display: block; font-size: clamp(16px, 1.4vw, 19px); font-weight: 400; letter-spacing: -.01em; color: var(--muted); margin-top: 8px; max-width: 44ch; }
.plat__meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 32px; align-self: start; justify-self: stretch; padding: 22px 24px; border-radius: var(--radius-lg); background: #fff; border: 1px solid var(--line); }
.plat__meta .btn { grid-column: 1 / -1; justify-self: start; }
.plat__fact { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.plat__fact span { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); }
.plat__fact strong { font-size: 14px; font-weight: 600; color: var(--ink); line-height: 1.35; }
.case__cols--2 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.case__block p + p { margin-top: 10px; }
.case__outcome p:not(.eyebrow) { max-width: 60ch; }