/* PharmaForward — canonical site stylesheet.
   Base: index.html design (canonical). Interior-page components appended.
   Page-specific variants (hero padding, section background alternation) live
   in small per-page <style> blocks. */

/* ==== Base (from index.html) ==== */
:root {
  --black:      #0D0C0C;
  --dark:       #161414;
  --raised:     #1E1B1B;
  --border:     rgba(255,255,255,0.07);
  --border-lg:  rgba(255,255,255,0.12);
  --white:      #FFFFFF;
  --w88:        rgba(255,255,255,0.88);
  --w70:        rgba(255,255,255,0.70);
  --w42:        rgba(255,255,255,0.50);
  --w12:        rgba(255,255,255,0.12);
  --w06:        rgba(255,255,255,0.06);
  --orange:     #E8752A;
  --orange-dim: rgba(232,117,42,0.15);
  --gold:       #FCC174;
  --serif:      'Lora', Georgia, serif;
  --sans:       'Archivo', system-ui, sans-serif;
  --max:        1200px;
  --pad:        clamp(1.5rem, 5vw, 5rem);
  --py:         clamp(4rem, 8vw, 8rem);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:17px; scroll-behavior:smooth; }
body {
  font-family: var(--serif);
  background: var(--black);
  color: var(--white);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { max-width:100%; display:block; }


#nav {
  position: fixed; top:0; left:0; right:0; z-index:500;
  height: 62px;
  background: rgba(13,12,12,0.94);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  transition: border-color 0.3s;
}
.nav-wrap {
  max-width: var(--max); margin: 0 auto;
  padding: 0 var(--pad);
  height: 100%;
  display: flex; align-items: center; justify-content: space-between;
}
.nav-logo { display:flex; align-items:center; }
.nav-right { display:flex; align-items:center; gap:0; }


.nav-link {
  display: flex; align-items: center; gap: 0.3rem;
  height: 62px;
  padding: 0 1.1rem;
  font-family: var(--sans); font-size: 0.71rem;
  font-weight: 400; letter-spacing: 0.02em;
  color: var(--w70); cursor: pointer;
  border-left: 1px solid var(--border);
  transition: color 0.2s, background 0.2s;
  position: relative;
  user-select: none;
}
.nav-link:first-child { border-left: none; }
.nav-link:hover { color: var(--white); background: var(--w06); }
.nav-link svg { width:10px; height:10px; transition: transform 0.2s; flex-shrink:0; }
.nav-link.open > svg { transform: rotate(180deg); }


.nav-cta {
  height: 62px; display:flex; align-items:center;
  padding: 0 1.3rem;
  font-family: var(--sans); font-size: 0.68rem;
  font-weight: 600; letter-spacing: 0.08em;
  color: var(--white) !important;
  border: 1px solid rgba(232,117,42,0.5);
  border-left: 1px solid rgba(232,117,42,0.5) !important;
  transition: background 0.15s, border-color 0.15s;
}
.nav-cta:hover { background: var(--orange); border-color: var(--orange) !important; }


.dropdown-wrap {
  position: absolute;
  top: 62px; left: 50%;
  transform: translateX(-50%);
  width: 620px;
  background: #111010;
  border: 1px solid var(--border-lg);
  border-top: 2px solid var(--orange);
  box-shadow: 0 32px 80px rgba(0,0,0,0.7);
  opacity: 0; visibility: hidden;
  transform: translateX(-50%) translateY(-8px);
  transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s;
  pointer-events: none;
  z-index: 600;
}
.nav-link.open .dropdown-wrap {
  opacity: 1; visibility: visible;
  transform: translateX(-50%) translateY(0);
  pointer-events: auto;
}
.dropdown-inner { padding: 1.5rem; }
.dropdown-header {
  font-family: var(--sans); font-size: 0.62rem; font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--w42); padding-bottom: 1rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1rem;
}
.dropdown-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0.35rem;
}
.dd-item {
  display: flex; align-items: flex-start; gap: 0.85rem;
  padding: 0.95rem 1rem;
  border: 1px solid transparent;
  transition: background 0.15s, border-color 0.15s;
  cursor: pointer;
  text-decoration: none; color: inherit;
}
.dd-item:hover {
  background: var(--w06);
  border-color: var(--border);
}
.dd-item:hover .dd-title { color: var(--orange); }
.dd-icon {
  width: 32px; height: 32px; flex-shrink:0;
  background: var(--raised);
  border: 1px solid var(--border);
  display: flex; align-items:center; justify-content:center;
  margin-top: 0.1rem;
}
.dd-icon svg { width:14px; height:14px; }
.dd-title {
  font-family: var(--sans); font-size: 0.76rem; font-weight: 600;
  color: var(--w88); letter-spacing: -0.01em;
  margin-bottom: 0.2rem;
  transition: color 0.15s;
}
.dd-sub {
  font-family: var(--serif); font-style: italic;
  font-size: 0.72rem; color: var(--w42); line-height: 1.4;
}
.dropdown-footer {
  margin-top: 1rem; padding-top: 1rem;
  border-top: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: center;
}
.dd-view-all {
  font-family: var(--sans); font-size: 0.65rem; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--orange); display:flex; align-items:center; gap:0.5rem;
  cursor:pointer; transition: gap 0.2s;
}
.dd-view-all:hover { gap: 0.75rem; }
.dd-tagline {
  font-family: var(--serif); font-style: italic;
  font-size: 0.68rem; color: var(--w42);
}


#hero {
  min-height: 88vh;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: calc(62px + 2.5rem) var(--pad) clamp(3rem, 6vw, 5.5rem);
  background: var(--black);
  position: relative; overflow: hidden;
  border-bottom: 1px solid var(--border);
}
.hero-bg-num {
  position:absolute; right:-2%; top:50%; transform:translateY(-50%);
  font-family: var(--sans); font-weight:900;
  font-size: clamp(14rem, 28vw, 32rem);
  line-height:1; letter-spacing:-0.06em;
  color: rgba(255,255,255,0.012);
  pointer-events:none; user-select:none;
}
.hero-inner { max-width: var(--max); margin:0 auto; width:100%; position:relative; z-index:1; }
.hero-eyebrow {
  font-family: var(--sans); font-size: 0.62rem; font-weight:600;
  letter-spacing: 0.18em; text-transform:uppercase;
  color: var(--w42); margin-bottom: 2rem;
  display: flex; align-items:center; gap:0.9rem;
}
.hero-eyebrow::before {
  content:''; width:1.8rem; height:1px; background:var(--orange); flex-shrink:0;
}
.hero-h1 {
  font-family: var(--serif); font-weight:600;
  font-size: clamp(2.6rem, 5.5vw, 5.5rem);
  line-height: 1.06; letter-spacing:-0.03em;
  color: var(--white); margin-bottom: 3rem; max-width: 860px;
}
.hero-h1 em { font-style:italic; color:var(--orange); }
.hero-foot {
  display:grid; grid-template-columns: 1fr auto;
  gap: 4rem; align-items:end;
  padding-top: 2rem; border-top: 1px solid var(--border);
}
.hero-sub {
  font-family: var(--serif); font-style:italic;
  font-size: 0.95rem; color: var(--w70); line-height: 1.85; max-width: 480px;
}
.hero-actions { display:flex; flex-direction:column; align-items:flex-end; gap:0.75rem; flex-shrink:0; }
.btn {
  display:inline-flex; align-items:center; gap:0.5rem;
  font-family: var(--sans); font-size:0.7rem; font-weight:600;
  letter-spacing:0.06em; text-transform:uppercase;
  text-decoration:none; padding:0.85rem 1.75rem;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  cursor:pointer; border:1px solid transparent;
}
.btn-white { background:var(--white); color:var(--black); }
.btn-white:hover { background:var(--orange); color:var(--white); }
.hero-note {
  font-family: var(--serif); font-style:italic;
  font-size: 0.68rem; color: var(--w42);
}


#services {
  padding: var(--py) var(--pad);
  background: var(--dark);
  border-bottom: 1px solid var(--border);
}
.sec-inner { max-width: var(--max); margin:0 auto; }
.sec-eyebrow {
  font-family: var(--sans); font-size:0.72rem; font-weight:700;
  letter-spacing:0.18em; text-transform:uppercase;
  color:var(--w70); margin-bottom: 3rem;
  display:flex; align-items:center; gap:0.8rem;
}
.sec-eyebrow::after { content:''; width:2rem; height:1px; background:var(--border); }
.svc-top {
  display:grid; grid-template-columns:1fr 1fr;
  gap: 4rem; align-items:end;
  margin-bottom: 4rem; padding-bottom: 3rem;
  border-bottom: 1px solid var(--border);
}
.sec-h {
  font-family: var(--serif); font-weight:600;
  font-size: clamp(1.65rem, 3vw, 2.75rem);
  line-height: 1.08; letter-spacing:-0.025em; color: var(--white);
}
.sec-h em { font-style:italic; color:var(--orange); }
.svc-desc {
  font-family: var(--serif); font-style:italic;
  font-size:0.92rem; color:var(--w70); line-height:1.85;
}

.svc-grid {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 1px; background: var(--border);
  border: 1px solid var(--border);
}
.svc-box {
  background: var(--dark);
  padding: 2rem; display:flex; flex-direction:column; gap:0.6rem;
  text-decoration:none; color:inherit;
  transition: background 0.2s;
}
.svc-box:hover { background: var(--raised); }
.svc-box:hover .svc-box-name { color:var(--white); }
.svc-box:hover .svc-icon { color:var(--orange); }
.svc-box:hover .svc-arr { color:var(--orange); transform:translateX(4px); }
.svc-icon { color:var(--w42); transition:color 0.2s; margin-bottom:0.4rem; }
.svc-num { font-family:var(--serif); font-style:italic; font-size:0.68rem; color:var(--w42); }
.svc-box-name {
  font-family:var(--serif); font-weight:600;
  font-size: clamp(1.1rem, 1.8vw, 1.5rem);
  line-height:1.15; letter-spacing:-0.02em; color:var(--w88);
  transition: color 0.2s;
}
.svc-box-name em { font-style:italic; color:var(--orange); }
.svc-box-body {
  font-family:var(--serif); font-style:italic;
  font-size:0.82rem; color:var(--w70); line-height:1.8; flex-grow:1;
}
.svc-arr {
  font-size:0.88rem; color:var(--w42); margin-top:0.75rem;
  transition: color 0.2s, transform 0.2s; display:block;
}


#results {
  padding: var(--py) var(--pad);
  background: var(--raised);
  border-bottom: 1px solid var(--border);
}
.cs-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:1px; background:var(--border); border:1px solid var(--border);
  margin-top: 3rem;
}
.cs-card {
  background: var(--dark);
  padding: 2.5rem; display:flex; flex-direction:column; gap:1rem;
  transition: background 0.2s;
}
.cs-card:hover { background: var(--black); }
.cs-tag {
  font-family:var(--sans); font-size:0.62rem; font-weight:600;
  letter-spacing:0.14em; text-transform:uppercase; color:var(--orange);
}
.cs-client { font-family:var(--serif); font-style:italic; font-size:0.68rem; color:var(--w42); }
.cs-h {
  font-family:var(--serif); font-weight:600;
  font-size:clamp(1.1rem, 1.8vw, 1.5rem);
  line-height:1.3; letter-spacing:-0.02em; color:var(--white);
}
.cs-h em { font-style:normal; color:var(--orange); }
.cs-body { font-family:var(--serif); font-style:italic; font-size:0.82rem; color:var(--w70); line-height:1.85; flex-grow:1; }
.cs-kpis {
  display:flex; gap:2rem; padding-top:1rem; border-top:1px solid var(--border);
}
.kpi-val {
  font-family:var(--serif); font-weight:600;
  font-size:1.6rem; letter-spacing:-0.025em; color:var(--w70);
  line-height:1;
}
.kpi-val em { font-style:normal; color:var(--white); }
.kpi-desc {
  font-family:var(--sans); font-size:0.62rem; color:var(--w42);
  letter-spacing:0.07em; text-transform:uppercase; margin-top:0.25rem;
}


#about {
  padding: var(--py) var(--pad);
  background: var(--black);
  border-bottom: 1px solid var(--border);
}
.about-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap: clamp(4rem, 8vw, 8rem); align-items:start;
  margin-top: 3rem;
}
.about-body {
  font-family:var(--serif); font-size:0.92rem;
  color:var(--w70); line-height:1.9; margin-bottom:1rem;
}
.about-body strong { color:var(--w88); font-weight:600; }
.pull-quote {
  border-left:2px solid var(--orange);
  padding: 0.4rem 0 0.4rem 1.5rem; margin: 1.75rem 0;
}
.pull-quote p {
  font-family:var(--serif); font-style:italic;
  font-size:1rem; color:var(--w88); line-height:1.65;
}
.signal-list { display:flex; flex-direction:column; }
.signal-item {
  padding:1.25rem 0; border-bottom:1px solid var(--border);
  display:flex; flex-direction:column; gap:0.4rem;
}
.signal-item:first-child { border-top:1px solid var(--w70); }
.signal-val {
  font-family:var(--serif); font-weight:600; font-size:0.88rem;
  color:var(--orange);
}
.signal-desc {
  font-family:var(--serif); font-style:italic;
  font-size:0.80rem; color:var(--w70); line-height:1.75;
}


#thinking {
  padding: var(--py) var(--pad);
  background: var(--dark);
  border-bottom: 1px solid var(--border);
}
.art-list { border-top:1px solid var(--border); margin-top:3rem; }
.art-row {
  display:grid; grid-template-columns:70px 1fr 100px 1rem;
  align-items:baseline; gap:2rem;
  padding:1.65rem var(--pad);
  border-bottom:1px solid var(--border);
  cursor:pointer;
  transition: background 0.15s;
  margin: 0 calc(-1 * var(--pad));
}
.art-row:hover { background:var(--w06); }
.art-row:hover .art-title { color:var(--orange); }
.art-row:hover .art-arr { color:var(--orange); transform:translateX(3px); }
.art-date { font-family:var(--serif); font-style:italic; font-size:0.68rem; color:var(--w42); }
.art-title {
  font-family:var(--serif); font-weight:600; font-size:0.9rem;
  line-height:1.35; color:var(--w88); letter-spacing:-0.01em;
  transition: color 0.2s;
}
.art-tag { font-family:var(--sans); font-size:0.62rem; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--w42); text-align:right; }
.art-arr { font-size:0.82rem; color:var(--w42); transition:color 0.2s, transform 0.2s; }
.art-row.soon .art-title { color:var(--w42); font-weight:400; font-style:italic; }
.art-row.soon:hover { background:none; }
.art-row.soon:hover .art-title { color:var(--w42); }


#faq {
  padding: var(--py) var(--pad);
  background: var(--raised);
  border-bottom: 1px solid var(--border);
}
.faq-layout {
  display:grid; grid-template-columns:1fr 1.65fr;
  gap: clamp(4rem, 8vw, 8rem); align-items:start;
  margin-top:3rem;
}
.faq-lede {
  font-family:var(--serif); font-style:italic;
  font-size:0.88rem; color:var(--w70); line-height:1.85; margin-top:1rem;
}
.faq-list { border-top:1px solid var(--border); }
.faq-item { border-bottom:1px solid var(--border); }
.faq-q {
  display:flex; justify-content:space-between; align-items:baseline;
  gap:2rem; padding:1.3rem 0; cursor:pointer;
}
.faq-q:hover .fq-text { color:var(--orange); }
.fq-text {
  font-family:var(--serif); font-weight:600; font-size:0.88rem;
  color:var(--w88); transition:color 0.2s; line-height:1.35;
}
.fq-tog { font-size:1rem; color:var(--w42); flex-shrink:0; transition:transform 0.2s, color 0.2s; }
.faq-item.open .fq-tog { transform:rotate(45deg); color:var(--orange); }
.faq-a {
  font-family:var(--serif); font-size:0.84rem; color:var(--w70);
  line-height:1.85; max-height:0; overflow:hidden;
  transition:max-height 0.35s ease, padding 0.35s;
}
.faq-item.open .faq-a { max-height:300px; padding-bottom:1.4rem; }


#contact {
  padding: clamp(4rem, 7vw, 7rem) var(--pad);
  background: var(--black);
  text-align:center;
  border-bottom:1px solid var(--border);
  position:relative; overflow:hidden;
}
.contact-bg {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  font-family:var(--sans); font-weight:900;
  font-size: clamp(12rem, 22vw, 26rem);
  color: rgba(255,255,255,0.010);
  pointer-events:none; user-select:none;
  letter-spacing:-0.04em; line-height:1; white-space:nowrap;
}
.contact-inner { position:relative; max-width:560px; margin:0 auto; z-index:1; }
.contact-h {
  font-family:var(--serif); font-weight:600;
  font-size:clamp(2rem, 4vw, 3.75rem);
  line-height:1.08; letter-spacing:-0.03em; color:var(--white); margin-bottom:1.5rem;
}
.contact-h em { font-style:italic; color:var(--orange); }
.contact-sub {
  font-family:var(--serif); font-style:italic;
  font-size:0.92rem; color:var(--w70); line-height:1.8; margin-bottom:2.5rem;
  max-width:360px; margin-left:auto; margin-right:auto;
}
.contact-note {
  display:block; margin-top:1.1rem;
  font-family:var(--serif); font-style:italic; font-size:0.68rem; color:var(--w42);
}


footer {
  background: var(--dark);
  border-top:1px solid rgba(255,255,255,0.10);
  padding: 2.5rem var(--pad);
}
.footer-wrap {
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:auto 1fr auto;
  gap:3rem; align-items:center;
}
.footer-copy {
  font-family:var(--serif); font-style:italic;
  font-size:0.68rem; color:var(--w42); text-align:center;
}
.footer-links { display:flex; gap:0; list-style:none; justify-content:flex-end; }
.footer-links a {
  font-family:var(--sans); font-size:0.62rem; color:var(--w42);
  padding:0 0.9rem; border-left:1px solid var(--border);
  transition:color 0.2s;
}
.footer-links a:hover { color:var(--w70); }
.footer-links li:first-child a { border-left:none; }


.reveal { opacity:0; transform:translateY(10px); transition:opacity 0.6s ease, transform 0.6s ease; }
.reveal.in { opacity:1; transform:none; }


@media (max-width:900px) {
  .hero-foot, .svc-top, .about-grid, .faq-layout { grid-template-columns:1fr; gap:2.5rem; }
  .hero-actions { align-items:flex-start; }
  .svc-grid, .cs-grid { grid-template-columns:1fr; }
  .art-row { grid-template-columns:1fr 1rem; gap:1rem; }
  .art-date, .art-tag { display:none; }
  .footer-wrap { grid-template-columns:1fr; gap:1.5rem; text-align:left; justify-items:start; }
  .footer-links { justify-content:flex-start; }
  .footer-copy { text-align:left; }
}
@media (max-width:640px) {
  .nav-link:not(.nav-cta):not(:first-child) { display:none; }
  .hero-h1 { font-size: clamp(2rem, 8vw, 3rem); }
  .dropdown-wrap { width: calc(100vw - 2rem); left:1rem; transform:none; }
  .nav-link.open .dropdown-wrap { transform:translateY(0); }
  .dropdown-grid { grid-template-columns:1fr; }
}


html.light {
  --black:   #F5F3EF;
  --dark:    #ECEAE5;
  --raised:  #E3E0DA;
  --border:  rgba(0,0,0,0.09);
  --white:   #1A1818;
  --w88:     rgba(26,24,24,0.88);
  --w70:     rgba(26,24,24,0.70);
  --w42:     rgba(26,24,24,0.55);
  --w18:     rgba(26,24,24,0.20);
  --w06:     rgba(26,24,24,0.05);
}
html.light #nav { background: rgba(245,243,239,0.94); }
html.light .dropdown-wrap { background: #FCFBF8; }
body { transition: background-color 0.3s ease, color 0.3s ease; }
#nav { transition: background 0.3s ease; }


html.light .pf-logo path[fill="#F7F4ED"],
html.light .pf-logo-foot path[fill="#F7F4ED"] {
  fill: #2A2627 !important;
}



.tex-hero g, .tex-contact g, .tex-results g {
  mix-blend-mode: normal !important;
}
.tex {
  position: absolute;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.tex-hero {
  top: 0; right: -10%;
  width: 70%; height: 100%;
  opacity: 0.085;
  mix-blend-mode: screen;
  filter: brightness(2.0);
}
.tex-results {
  top: -20%; left: -5%;
  width: 55%; height: 140%;
  opacity: 0.06;
  mix-blend-mode: screen;
  filter: brightness(1.8);
}
.tex-contact {
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 100%; height: 100%;
  opacity: 0.06;
  mix-blend-mode: screen;
  filter: brightness(1.9);
}
html.light .tex-hero,
html.light .tex-results,
html.light .tex-contact {
  mix-blend-mode: multiply;
  filter: brightness(0.5) !important;
  opacity: 0.07;
}

.hero-inner, .sec-inner, .contact-inner { position: relative; z-index: 1; }


.theme-toggle {
  display: flex; align-items: center; gap: 0.45rem;
  height: 62px;
  padding: 0 1.1rem;
  border-left: 1px solid var(--border);
  cursor: pointer;
  background: none; border-top: none; border-right: none; border-bottom: none;
  color: var(--w42);
  font-family: var(--sans);
  font-size: 0.62rem; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase;
  transition: color 0.2s, background 0.2s;
  flex-shrink: 0;
}
.theme-toggle:hover { color: var(--white); background: var(--w06); }
.theme-toggle svg { transition: transform 0.4s ease; width: 13px; height: 13px; }
html.light .theme-toggle svg { transform: rotate(180deg); }


#engage { padding: var(--py) var(--pad); }

.outcomes { border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--black); }
.outcomes-inner { max-width:1140px; margin:0 auto; padding:0 clamp(1.25rem,4vw,2.5rem); display:grid; grid-template-columns:repeat(3,1fr); }
.outcome { display:block; padding:1.6rem 1.75rem; border-left:1px solid var(--border); text-decoration:none; transition:background 0.25s ease; }
.outcome:last-child { border-right:1px solid var(--border); }
.outcome:hover { background:rgba(255,255,255,0.025); }
html.light .outcome:hover { background:rgba(26,24,24,0.035); }
.outcome-val { font-family:var(--serif); font-size:clamp(1.25rem,2.2vw,1.6rem); color:var(--white); letter-spacing:-0.01em; }
.outcome-val em { font-style:italic; color:var(--orange); }
.outcome-l { font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--w42); margin-top:0.45rem; }
@media (max-width:760px){ .outcomes-inner{grid-template-columns:1fr;} .outcome{border-left:none;border-bottom:1px solid var(--border);padding:1.25rem 0.25rem;} .outcome:last-child{border-right:none;border-bottom:none;} }

.steps-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(2rem,4vw,3.5rem); margin-top:3.5rem; }
.step { position:relative; padding-top:1.6rem; border-top:1px solid var(--border); }
.step-num { font-family:var(--serif); font-style:italic; font-size:0.95rem; color:var(--orange); }
.step-name { font-family:var(--serif); font-size:1.35rem; color:var(--white); margin:0.7rem 0 0.65rem; }
.step-body { font-size:0.95rem; line-height:1.65; color:var(--w70); }
@media (max-width:760px){
  .steps-grid{grid-template-columns:1fr; gap:0; margin-top:2.5rem;}
  .step{border-top:none; border-left:1px solid var(--border); padding:0 0 2.2rem 1.5rem;}
  .step::before{content:""; position:absolute; left:-4px; top:0.35rem; width:7px; height:7px; border-radius:50%; background:var(--orange);}
}




.nav-burger { display:none; background:none; border:none; cursor:pointer; padding:0.5rem; margin-left:auto; }
.nav-burger span { display:block; width:24px; height:2px; background:var(--white); margin:5px 0; transition:transform 0.25s, opacity 0.25s; }
.mobile-menu { display:none; position:fixed; top:64px; left:0; right:0; bottom:0; background:var(--black); z-index:90; padding:1.5rem; overflow-y:auto; }
html.light .mobile-menu { background:var(--black); }
.mobile-menu a { display:block; font-family:var(--serif); font-size:1.5rem; color:var(--white); text-decoration:none; padding:1rem 0; border-bottom:1px solid var(--border); }
.mobile-menu .mm-sub { font-family:var(--sans); font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--w42); padding:1.5rem 0 0.5rem; border:none; }
.mobile-menu .mm-svc { font-size:1.05rem; padding:0.65rem 0; }
@media (max-width:760px){
  .nav-right { display:none; }
  .nav-burger { display:block; }
  body.menu-open .mobile-menu { display:block; }
  body.menu-open { overflow:hidden; }
}


.skip-link{position:absolute;left:-9999px;top:0;z-index:1000;background:#F98436;color:#fff;padding:0.6rem 1.1rem;font-family:var(--sans,sans-serif);font-size:0.85rem;text-decoration:none;}
.skip-link:focus{left:0;}

/* ==== Legacy token aliases (interior pages; values preserved verbatim) ==== */
:root {
  --dark-raised: #1E1B1B;        /* == --raised */
  --figbar: #2B2725;
  --w18: rgba(255,255,255,0.18);
  --white-88: rgba(255,255,255,0.88);
  --white-55: rgba(255,255,255,0.70);
  --white-30: rgba(255,255,255,0.42);
  --white-12: rgba(255,255,255,0.12);
  --white-06: rgba(255,255,255,0.06);
}
html.light {
  --dark-raised: #E3E0DA;
  --figbar: #1A1818;
  --white-88: rgba(26,24,24,0.88);
  --white-55: rgba(26,24,24,0.68);
  --white-30: rgba(26,24,24,0.42);
  --white-12: rgba(26,24,24,0.12);
  --white-06: rgba(26,24,24,0.06);
}


/* ==== Folded reconciliations (from legacy patch layers) ==== */
#cta { display: flex; align-items: center; padding: clamp(4rem, 7vw, 7rem) var(--pad); background: var(--raised); position: relative; overflow: hidden; text-align: center }
.s-inner, .cta-inner { position: relative; z-index: 1 }


/* ==== Shared interior components ==== */
html.light .logo-dark { display: block }
html.light .logo-light { display: none }
html.light .logo-dark-foot { display: block }
html.light .logo-light-foot { display: none }
h1 { font-family: var(--serif); font-weight: 600; font-size: clamp(2.6rem, 5.5vw, 5.5rem); line-height: 1.06; letter-spacing: -0.03em; color: var(--white); margin-bottom: 2.5rem; max-width: 900px }
h1 em { font-style: italic; color: var(--orange) }
.s-inner { max-width: var(--max); margin: 0 auto }
.s-eyebrow { font-family: var(--sans); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--white-55); margin-bottom: 2.5rem; display: flex; align-items: center; gap: 1rem }
.s-eyebrow::after { content: ''; width: 2rem; height: 1px; background: var(--border) }
.s-h { font-family: var(--serif); font-weight: 600; font-size: clamp(1.9rem,3.5vw,3.2rem); line-height: 1.08; letter-spacing: -0.025em }
.s-h em { font-style: italic; color: var(--orange) }
.cta-inner { position: relative; max-width: 620px; margin: 0 auto; z-index: 1 }
.cta-h { font-family: var(--serif); font-weight: 600; font-size: clamp(2rem, 4vw, 3.75rem); line-height: 1.1; letter-spacing: -0.035em; color: var(--white); margin-bottom: 1.75rem }
.cta-h em { font-style: italic; color: var(--orange) }
.cta-sub { font-family: var(--serif); font-style: italic; font-size: 1rem; color: var(--white-55); line-height: 1.8; margin-bottom: 2.75rem; max-width: 420px; margin-left: auto; margin-right: auto }
.cta-note { display: block; margin-top: 1.25rem; font-family: var(--serif); font-style: italic; font-size: 0.72rem; color: var(--white-30) }
.footer-links .footer-links a:hover { color: var(--white-55) }
.footer-links li:first-child .reveal { opacity: 0; transform: translateY(12px); transition: opacity 0.7s ease,transform 0.7s ease }
.s-headline, .s-h { font-size: clamp(1.65rem, 3vw, 2.75rem) }
.tex-outcome { opacity: 0.045; filter: brightness(1.8) }
.hero-sub em, .svc-desc em, .cap-desc em, .think-desc em, .faq-lede em, .p-body em, .shift-body em { font-style: italic; color: inherit }
.svc-box-inner { padding: 2rem; gap: 0.6rem }
.cs2-card { padding: 2.5rem }
.cs2-headline { font-size: clamp(1rem, 1.6vw, 1.3rem) }
.footer-tagline { font-family: var(--serif); font-style: italic; font-size: 0.72rem; color: var(--white-30); text-align: center }
html.light .logo-light path[fill="#FCC174"], html.light .logo-light path[fill="#FBA059"], html.light .logo-light path[fill="#F98436"] { fill: inherit }
.process-grid, .proc-step { transition: background 0.2s }
.proc-num { font-size: 2rem; margin-bottom: 1rem }
.cap-tile { padding: 0.6rem 0.9rem; font-size: 0.68rem }
.cap-tiles { gap: 0.4rem; padding: 0.6rem }
.tri-card { padding: 2rem }
.tri-title { font-size: 1.25rem }
.tri-body { font-size: 0.82rem }
html.light .logo-dark path[fill="#F7F4ED"] { fill: #2A2627 }
html.light .logo-dark-foot path[fill="#F7F4ED"] { fill: #2A2627 }
.tex-hero g, .tex-contact g { mix-blend-mode: normal }
.footer-links a:first-child, .footer-links li:first-child a { border-left: none }
@media (max-width: 768px) {
  h1 { font-size: clamp(2rem, 8vw, 3.2rem) }
  .cta-h { font-size: clamp(1.8rem, 7vw, 2.8rem) }
  .s-headline, .s-h { font-size: clamp(1.4rem, 5.5vw, 2rem) }
}

/* ==== Content-page components (about/legal/signup/thinking) ==== */
.hero-number { position: absolute; right: -2%; top: 50%; transform: translateY(-50%); font-family: var(--sans); font-weight: 900; font-size: clamp(22rem,42vw,52rem); line-height: 1; letter-spacing: -0.06em; color: rgba(255,255,255,0.018); pointer-events: none; user-select: none }
.hero-lede { font-family: var(--serif); font-style: italic; font-size: 1.05rem; color: var(--white-55); line-height: 1.85 }
.hero-lede strong { color: var(--white-88); font-style: normal; font-weight: 600 }
.hero-right { display: flex; flex-direction: column; justify-content: flex-end; gap: 1rem }
.hero-fact { font-family: var(--sans); font-size: 0.68rem; color: var(--white-30); letter-spacing: 0.04em; display: flex; align-items: baseline; gap: 0.75rem; padding: 0.75rem 0; border-bottom: 1px solid var(--border) }
.hero-fact:first-child { border-top: 1px solid var(--border) }
.hero-fact-val { color: var(--white-88); font-weight: 600; font-size: 0.78rem; flex-shrink: 0; min-width: 3rem }
.hero-fact-val.orange { color: var(--orange) }
#story { padding: var(--py) var(--pad); background: var(--dark); border-bottom: 1px solid var(--border) }
.story-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(5rem,9vw,10rem); align-items: start }
.story-body { font-family: var(--serif); font-size: 1rem; color: var(--white-55); line-height: 1.95; margin-bottom: 1.35rem }
.story-body strong { color: var(--white-88); font-weight: 600 }
.conviction-list { display: flex; flex-direction: column; border-top: 1px solid var(--border) }
.conviction { padding: 2rem 0; border-bottom: 1px solid var(--border) }
.conviction-num { font-family: var(--serif); font-style: italic; font-size: 0.72rem; color: var(--orange); margin-bottom: 0.75rem; display: block }
.conviction-text { font-family: var(--serif); font-weight: 600; font-size: 1rem; color: var(--white-88); line-height: 1.4; letter-spacing: -0.01em; margin-bottom: 0.6rem }
.conviction-sub { font-family: var(--serif); font-style: italic; font-size: 0.84rem; color: var(--white-30); line-height: 1.75 }
#how { padding: var(--py) var(--pad); background: var(--black); border-bottom: 1px solid var(--border) }
.how-grid { display: grid; margin-top: 3.5rem; grid-template-columns: 1fr 1fr; gap: clamp(5rem,9vw,10rem); align-items: start }
.how-body { font-family: var(--serif); font-size: 0.95rem; color: var(--white-55); line-height: 1.9; margin-bottom: 1.1rem }
.how-body strong { color: var(--white-88); font-weight: 600 }
.not-for { background: var(--dark-raised); border: 1px solid var(--border); padding: 2.5rem; margin-top: 2rem }
.nf-title { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange); margin-bottom: 1.5rem }
.nf-list { display: flex; flex-direction: column; gap: 0 }
.nf-item { font-family: var(--serif); font-size: 0.86rem; color: var(--white-30); line-height: 1.6; padding: 0.65rem 0; border-bottom: 1px solid var(--border); display: flex; gap: 1rem; align-items: baseline }
.nf-item:last-child { border-bottom: none }
.nf-item::before { content: '×'; color: var(--white-30); flex-shrink: 0; font-size: 0.8rem }
.nf-item.yes::before { content: '→'; color: var(--orange) }
.nf-item.yes { color: var(--white-55) }
#stack { padding: var(--py) var(--pad); background: var(--dark-raised); border-bottom: 1px solid var(--border) }
.stack-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: end; margin-bottom: 4rem; padding-bottom: 3.5rem; border-bottom: 1px solid var(--border) }
.stack-desc { font-family: var(--serif); font-style: italic; font-size: 0.92rem; color: var(--white-55); line-height: 1.85 }
.stack-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--border); border: 1px solid var(--border) }
.stack-col { background: var(--dark); padding: 2rem; border-right: 1px solid var(--border) }
.stack-col:last-child { border-right: none }
.stack-col-title { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--white-30); margin-bottom: 1.25rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border) }
.stack-items { display: flex; flex-direction: column; gap: 0.6rem }
.stack-item { font-family: var(--sans); font-size: 0.72rem; color: var(--white-55); line-height: 1.4; display: flex; gap: 0.75rem; align-items: baseline }
.stack-item::before { content: '·'; color: var(--orange); flex-shrink: 0 }
#clients { padding: var(--py) var(--pad); background: var(--dark); border-bottom: 1px solid var(--border) }
.clients-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(5rem,9vw,10rem); align-items: start; margin-top: 3.5rem }
.client-list { border-top: 1px solid var(--border) }
.client-item { display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: baseline; padding: 1.1rem 0; border-bottom: 1px solid var(--border) }
.client-name { font-family: var(--serif); font-weight: 600; font-size: 0.95rem; color: var(--white-88); letter-spacing: -0.01em }
.client-focus { font-family: var(--serif); font-style: italic; font-size: 0.78rem; color: var(--white-30); text-align: right; white-space: nowrap }
.clients-note { font-family: var(--serif); font-style: italic; font-size: 0.86rem; color: var(--white-30); line-height: 1.8; margin-top: 1.5rem }
.clients-body { font-family: var(--serif); font-size: 0.95rem; color: var(--white-55); line-height: 1.9; margin-bottom: 1.1rem }
.clients-body strong { color: var(--white-88); font-weight: 600 }
#before { padding: var(--py) var(--pad); background: var(--black); border-bottom: 1px solid var(--border) }
.timeline { margin-top: 3.5rem; display: flex; flex-direction: column; border-left: 1px solid var(--border); padding-left: 3rem; gap: 0; max-width: 720px }
.tl-item { position: relative; padding-bottom: 3rem }
.tl-item:last-child { padding-bottom: 0 }
.tl-dot { position: absolute; left: -3.4rem; top: 0.35rem; width: 8px; height: 8px; border-radius: 50%; background: var(--dark-raised); border: 1px solid var(--border) }
.tl-item.current .tl-dot { background: var(--orange); border-color: var(--orange) }
.tl-year { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--white-30); margin-bottom: 0.6rem }
.tl-item.current .tl-year { color: var(--orange) }
.tl-title { font-family: var(--serif); font-weight: 600; font-size: 1.05rem; color: var(--white-88); line-height: 1.3; margin-bottom: 0.6rem; letter-spacing: -0.01em }
.tl-body { font-family: var(--serif); font-style: italic; font-size: 0.84rem; color: var(--white-30); line-height: 1.75 }
.cta-glyph { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-family: var(--sans); font-weight: 900; font-size: clamp(16rem,28vw,34rem); color: rgba(255,255,255,0.015); pointer-events: none; user-select: none; letter-spacing: -0.04em; line-height: 1; white-space: nowrap }
@media (max-width:900px) {
  .hero-foot,.story-grid,.how-grid,.stack-intro,.clients-grid { grid-template-columns: 1fr; gap: 3rem }
  .stack-grid { grid-template-columns: 1fr 1fr }
  .timeline { padding-left: 2rem }
  .tl-dot { left: -2.4rem }
}
@media (max-width:560px) {
  .stack-grid { grid-template-columns: 1fr }
}

/* ==== Service-page components ==== */
.breadcrumb { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--white-30); margin-bottom: 2rem; display: flex; align-items: center; gap: 0.75rem }
.breadcrumb a { color: var(--white-30); text-decoration: none }
.breadcrumb a:hover { color: var(--white-55) }
.service-tag { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange); margin-bottom: 1.75rem; display: flex; align-items: center; gap: 0.75rem }
.service-tag::before { content: ''; width: 1.5rem; height: 1px; background: var(--orange) }
.hero-deck { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: end; padding-top: 2rem; border-top: 1px solid var(--border) }
.hero-stats { display: flex; gap: 2.5rem; justify-content: flex-end; align-items: flex-start }
.h-stat-val { font-family: var(--serif); font-weight: 600; font-size: 1.9rem; letter-spacing: -0.03em; color: var(--white); line-height: 1; margin-bottom: 0.35rem }
.h-stat-val em { font-style: normal; color: var(--orange) }
.h-stat-lbl { font-family: var(--sans); font-size: 0.62rem; font-weight: 400; letter-spacing: 0.09em; text-transform: uppercase; color: var(--white-30); line-height: 1.5 }
.stat-callout { background: var(--dark-raised); border: 1px solid var(--border); padding: 2rem; margin-top: 1.5rem }
.sc-val { font-family: var(--serif); font-weight: 600; font-size: 2.8rem; letter-spacing: -0.03em; color: var(--orange); line-height: 1; margin-bottom: 0.5rem }
.sc-desc { font-family: var(--serif); font-style: italic; font-size: 0.82rem; color: var(--white-55); line-height: 1.75 }
#problem { padding: var(--py) var(--pad); background: var(--dark); border-bottom: 1px solid var(--border) }
.prob-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(4rem,8vw,9rem); align-items: start; margin-top: 3.5rem }
.p-body { font-family: var(--serif); font-size: 0.92rem; color: var(--white-55); line-height: 1.9; margin-bottom: 1rem }
.p-body strong { color: var(--white-88); font-weight: 600 }
.signals { display: flex; flex-direction: column }
.sig { padding: 1.2rem 0; border-bottom: 1px solid var(--border); display: flex; gap: 1.25rem; align-items: flex-start }
.sig:first-child { border-top: 1px solid var(--white-30) }
.sig-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--orange); flex-shrink: 0; margin-top: 0.5rem }
.sig-text { font-family: var(--serif); font-size: 0.86rem; color: var(--white-55); line-height: 1.75 }
.sig-text strong { color: var(--white-88); font-weight: 600 }
#capabilities { padding: var(--py) var(--pad); background: var(--dark-raised); border-bottom: 1px solid var(--border) }
.cap-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: end; margin-bottom: 4rem; padding-bottom: 3.5rem; border-bottom: 1px solid var(--border) }
.cap-desc { font-family: var(--serif); font-style: italic; font-size: 0.92rem; color: var(--white-55); line-height: 1.85 }
.cap-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; border: 1px solid var(--border) }
.cap-col { border-right: 1px solid var(--border); background: var(--dark) }
.cap-col:last-child { border-right: none }
.cap-col-hdr { padding: 1.25rem 1.5rem 1rem; border-bottom: 2px solid var(--orange) }
.cap-col-title { font-family: var(--sans); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--white-88) }
.cap-tile:hover { background: var(--dark); color: var(--white-88); border-color: var(--orange) }
#case-study { padding: var(--py) var(--pad); background: var(--dark); border-bottom: 1px solid var(--border) }
.cs-layout { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(4rem,7vw,8rem); align-items: start; margin-top: 3.5rem }
.cs-meta { margin-top: 1.75rem; padding-top: 1.5rem; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 0.55rem }
.cs-row { display: flex; gap: 1rem; font-family: var(--sans); font-size: 0.64rem }
.cs-key { color: var(--white-30); width: 80px; flex-shrink: 0; letter-spacing: 0.05em }
.cs-val { color: var(--white-55) }
.cs-panel { background: var(--black); border: 1px solid var(--border); padding: 2rem }
.cs-panel-eyebrow { font-family: var(--sans); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--white-30); margin-bottom: 1.25rem }
#process { padding: var(--py) var(--pad); background: var(--black); border-bottom: 1px solid var(--border) }
.process-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); margin-top: 3.5rem }
.proc-step { background: var(--dark); padding: 2.5rem 2rem; transition: background 0.2s }
.proc-step:hover { background: var(--dark-raised) }
.proc-title { font-family: var(--serif); font-weight: 600; font-size: 1rem; color: var(--white-88); line-height: 1.3; margin-bottom: 0.75rem }
.proc-body { font-family: var(--serif); font-style: italic; font-size: 0.78rem; color: var(--white-30); line-height: 1.75 }
.fq-toggle { font-size: 1.1rem; color: var(--white-30); flex-shrink: 0; transition: transform 0.2s,color 0.2s }
.faq-item.open .fq-toggle { transform: rotate(45deg); color: var(--orange) }
.svc-nav { display: flex; justify-content: center; gap: 0; margin-top: 3.5rem; border-top: 1px solid var(--border); padding-top: 2.5rem; flex-wrap: wrap }
.svc-nav .svc-nav a:last-child { border-right: none }
.svc-nav a:hover { color: var(--white-55) }
.svc-nav a.active { color: var(--orange) }
@media (max-width:900px) {
  .process-grid { grid-template-columns: 1fr 1fr }
  .hero-stats { justify-content: flex-start }
}

/* ==== Thinking article components ==== */
.post { max-width: 680px }
.post-meta { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--w42); display: flex; gap: 1.5rem; margin-bottom: 1.2rem }
.post-sub { font-family: var(--serif); font-style: italic; font-size: 1.05rem; line-height: 1.6; color: var(--w70); margin: 1.2rem 0 0 }
.post h2 { font-family: var(--serif); font-weight: 600; font-size: 1.3rem; color: var(--white); margin: 3rem 0 1rem; letter-spacing: -0.01em; line-height: 1.3 }
.post p { font-family: var(--sans); font-size: 0.94rem; line-height: 1.85; color: var(--w70); margin-bottom: 1.3rem }
.post strong { color: var(--w88); font-weight: 600 }
.post ol { padding-left: 1.3rem; margin: 0 0 1.3rem }
.post ol li { font-family: var(--sans); font-size: 0.94rem; line-height: 1.8; color: var(--w70); margin-bottom: 1rem }
.post ol li strong { color: var(--white) }
.fig { margin: 2.6rem 0; padding: 1.8rem 1.5rem 1.2rem; background: var(--raised); border: 1px solid var(--border); border-radius: 8px }
.fig svg { width: 100%; height: auto; display: block }
.fig-cap { font-family: var(--serif); font-style: italic; font-size: 0.74rem; color: var(--w42); margin-top: 1rem; line-height: 1.5 }
.fig text { font-family: var(--sans) }
.post-back { font-family: var(--sans); font-size: 0.78rem; color: var(--orange); text-decoration: none }

/* ==== Legal pages ==== */
.legal { max-width: 680px }
.legal h2 { font-family: var(--serif); font-weight: 600; font-size: 1.15rem; color: var(--white); margin: 2.6rem 0 0.9rem; letter-spacing: -0.01em }
.legal p, .legal li { font-family: var(--sans); font-size: 0.9rem; line-height: 1.8; color: var(--w70) }
.legal ul { padding-left: 1.2rem; margin: 0.6rem 0 1rem }
.legal li { margin-bottom: 0.45rem }
.legal .effective { font-family: var(--serif); font-style: italic; font-size: 0.78rem; color: var(--w42); margin-bottom: 2.5rem }

/* ==== Signup page ==== */
.form-wrap { max-width: 640px }
.f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem }
.f-field { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1.4rem }
.f-label { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--w42) }
.f-input, .f-select, .f-textarea { font-family: var(--sans); font-size: 0.92rem; color: var(--white); background: var(--raised); border: 1px solid var(--border); border-radius: 6px; padding: 0.85rem 1rem; outline: none; transition: border-color 0.15s; appearance: none; -webkit-appearance: none; width: 100% }
.f-input:focus, .f-select:focus, .f-textarea:focus { border-color: var(--orange) }
.f-textarea { min-height: 130px; resize: vertical; line-height: 1.65 }
.f-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23E8752A' fill='none' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1rem center }
.f-submit { font-family: var(--sans); font-weight: 600; font-size: 0.85rem; letter-spacing: 0.02em; color: #0D0C0C; background: var(--orange); border: none; border-radius: 6px; padding: 0.95rem 2.2rem; cursor: pointer; transition: opacity 0.15s }
.f-submit:hover { opacity: 0.88 }
.f-note { font-family: var(--serif); font-style: italic; font-size: 0.78rem; color: var(--w42); margin-top: 1.1rem }
@media (max-width:640px) {
  .f-row { grid-template-columns: 1fr }
}

/* ==== About page ==== */
#methodology { padding: var(--py) var(--pad) }
#founder { padding: var(--py) var(--pad) }

/* ==== 404 page ==== */
@media (max-width:900px) {
  .footer-tagline { text-align: left }
}

/* ==== Misc ==== */
#audiences { padding: var(--py) var(--pad); background: var(--black); border-bottom: 1px solid var(--border) }
.aud-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: end; margin-bottom: 4rem; padding-bottom: 3.5rem; border-bottom: 1px solid var(--border) }
.aud-desc { font-family: var(--serif); font-style: italic; font-size: 0.92rem; color: var(--white-55); line-height: 1.85 }
.aud-split { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--border); border: 1px solid var(--border) }
.aud-card { background: var(--dark); padding: 3rem }
.aud-card:hover { background: var(--dark-raised) }
.aud-label { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange); margin-bottom: 1.25rem }
.aud-title { font-family: var(--serif); font-weight: 600; font-size: 1.45rem; color: var(--white); line-height: 1.15; letter-spacing: -0.02em; margin-bottom: 1rem }
.aud-body { font-family: var(--serif); font-style: italic; font-size: 0.84rem; color: var(--white-55); line-height: 1.8; margin-bottom: 1.75rem }
.aud-metrics { display: flex; flex-direction: column; gap: 0.5rem; border-top: 1px solid var(--border); padding-top: 1.25rem }
.aud-metric { font-family: var(--sans); font-size: 0.68rem; color: var(--white-30); display: flex; align-items: baseline; gap: 0.6rem }
.aud-metric::before { content: '→'; color: var(--orange); font-size: 0.72rem }
#shift { padding: var(--py) var(--pad); background: var(--dark); border-bottom: 1px solid var(--border) }
.shift-body strong { color: var(--white-88); font-weight: 600 }
.shift-body { font-family: var(--serif); font-size: 0.92rem; color: var(--white-55); line-height: 1.9; margin-bottom: 1rem }
.shift-intro { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(4rem,8vw,9rem); align-items: start; margin-bottom: 4rem; padding-bottom: 4rem; border-bottom: 1px solid var(--border) }
.tri-card:hover { background: var(--dark-raised) }
.tri-label { font-family: var(--sans); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange); margin-bottom: 1rem }
.tri-tag { font-family: var(--sans); font-size: 0.62rem; color: var(--white-30); border: 1px solid var(--border); padding: 0.25rem 0.6rem }
.tri-tags { display: flex; flex-wrap: wrap; gap: 0.4rem }
.triptych { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--border); border: 1px solid var(--border) }
@media (max-width:900px) {
  .hero-deck,.prob-grid,.aud-intro,.cap-intro,.cs-layout,.faq-layout { grid-template-columns: 1fr; gap: 2.5rem }
  .aud-split,.cap-grid { grid-template-columns: 1fr 1fr }
  .cap-grid { grid-template-columns: 1fr 1fr }
  .hero-deck,.prob-grid,.cap-intro,.cs-layout,.faq-layout { grid-template-columns: 1fr; gap: 2.5rem }
  .hero-deck,.shift-intro,.prob-grid,.cap-intro,.cs-layout,.faq-layout { grid-template-columns: 1fr; gap: 2.5rem }
  .triptych,.cap-grid { grid-template-columns: 1fr 1fr }
}
@media (max-width:560px) {
  .aud-split,.cap-grid,.process-grid { grid-template-columns: 1fr }
  .cap-grid { grid-template-columns: 1fr }
  .process-grid { grid-template-columns: 1fr }
  .triptych,.cap-grid,.process-grid { grid-template-columns: 1fr }
}

/* ==== Cascade guards — patch-layer rules that must win (live parity) ==== */
.hero-glyph, .contact-glyph, .hero-number, .cta-glyph { color: rgba(255,255,255,0.012); font-size: clamp(14rem, 24vw, 28rem) }
.pull-quote p { font-family: var(--serif); font-style: italic; font-size: 1rem; color: var(--w88); line-height: 1.65 }