/* Jim Nelson Photography × Brandcore.io — editorial web presentation.
   Warm ivory, charcoal and olive. Georgia display, Jakarta body, JetBrains Mono labels.
   No external dependencies. One stylesheet. */

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('assets/fonts/plus-jakarta-sans-400-normal.woff2') format('woff2');
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('assets/fonts/jetbrains-mono-400-normal.woff2') format('woff2');
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-display: Georgia, 'Times New Roman', serif;
  --font-body: 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, Consolas, monospace;
  --carbon: #1d201b;
  --carbon-2: #272a23;
  --carbon-3: #34382f;
  --paper: #f4f0e6;
  --paper-2: #e8e2d4;
  --ink: #20231d;
  --muted: #62665b;
  --olive: #77806a;
  --sage: #c7cfb7;
  --bronze: #5c634d;
  --line-light: rgba(32, 35, 29, .14);
  --line-dark: rgba(255, 255, 255, .14);
  --red: #9d2e2c;
  --radius: 18px;
  --shadow-dark: 0 30px 70px rgba(0, 0, 0, .48);
  --shadow-light: 0 22px 55px rgba(32, 35, 29, .12);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background:
    radial-gradient(circle at 50% 25%, #34382e 0%, #1b1d18 58%, #141611 100%);
  color: #fff;
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, p, figure, dl, dd, ul { margin: 0; }
button, a, input { font: inherit; }
button { color: inherit; }
img { max-width: 100%; }
a { color: inherit; }
.icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ico, .date-icon {
  display: inline-block; width: 1em; height: 1em; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.9;
  stroke-linecap: round; stroke-linejoin: round; vertical-align: -.14em;
}
.paper {
  --bg: var(--paper); --surface: #fffdf8; --ink-2: #3c4036; --ink-3: #555b4d;
  --line: var(--line-light); --em: var(--bronze); --accent: var(--olive);
}
.carbon {
  --bg: var(--carbon); --surface: var(--carbon-2); --ink: #fff; --ink-2: #e7e9df; --ink-3: #cdd2c4;
  --line: var(--line-dark); --em: var(--sage); --accent: var(--sage);
}

.deck {
  position: relative; overflow: hidden;
  background: var(--carbon);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: var(--shadow-dark);
}
.slide {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  padding: clamp(18px, 3vh, 28px) clamp(28px, 3.5vw, 54px);
  background: var(--bg); color: var(--ink);
  opacity: 0; pointer-events: none; visibility: hidden;
}
.slide.active { opacity: 1; pointer-events: auto; visibility: visible; z-index: 2; }
.slide-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--olive) transparent; }
.slide-body::-webkit-scrollbar { width: 6px; }
.slide-body::-webkit-scrollbar-thumb { background: var(--olive); border-radius: 999px; }

/* ---------------------------------------------------------------- shared chrome */
.chrome {
  flex: none; display: flex; align-items: center; gap: 16px;
  padding-bottom: clamp(8px, 1.2vh, 12px); border-bottom: 1px solid var(--line);
  min-height: 54px;
}
.chrome-brand { display: flex; align-items: center; gap: 9px; min-width: 0; }
.brand-tile {
  display: flex; align-items: center; justify-content: center;
  width: 176px; height: 48px; padding: 4px 6px; flex: none;
  background: #f7f4ec; border: 1px solid rgba(32,35,29,.12); border-radius: 3px;
}
.brand-tile img { width: 100%; height: 100%; object-fit: contain; display: block; }
.chrome-x { font-size: 15px; color: var(--em); }
.chrome-brandcore { width: 92px; height: auto; display: block; }
.chrome-section {
  margin-left: auto; font-family: var(--font-mono); font-size: clamp(11px, .8vw, 13px);
  font-weight: 700; letter-spacing: .13em; color: var(--em); white-space: nowrap;
}
.chrome-section::before { content: ''; display: inline-block; width: 24px; height: 2px; background: var(--em); margin-right: 10px; vertical-align: 3px; }
.index-btn {
  display: inline-flex; align-items: center; gap: 6px; flex: none;
  padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px;
  background: transparent; font-family: var(--font-mono); font-size: 11px;
  font-weight: 700; letter-spacing: .1em; color: var(--ink-2); cursor: pointer;
}
.index-btn .ico { font-size: 13px; }
.slide-foot {
  flex: none; display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding-top: 8px; border-top: 1px solid var(--line);
  font-family: var(--font-mono); font-size: clamp(10px, .66vw, 11.5px);
  font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3);
}
.page { white-space: nowrap; color: var(--ink-2); font-weight: 700; }
.kicker {
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 7px;
  font-family: var(--font-mono); font-size: clamp(11px, .78vw, 13px);
  font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--em);
}
.kicker::before { content: ''; width: 24px; height: 2px; background: var(--em); flex: none; }
h1, h2 { font-family: var(--font-display); font-weight: 400; color: var(--ink); }
h1 em, h2 em { display: block; font-style: normal; color: var(--em); }
h2 { font-size: clamp(34px, 3.2vw, 49px); line-height: 1.02; letter-spacing: -.038em; }
h3 { font-family: var(--font-body); font-weight: 700; color: var(--ink); }
.lead {
  max-width: 62ch; margin-top: 10px;
  font-size: clamp(16px, 1.18vw, 20px); line-height: 1.5; color: var(--ink-3);
}
.num-chip {
  display: inline-grid; place-items: center; flex: none;
  width: 34px; height: 34px; border-radius: 9px;
  background: var(--surface); border: 1px solid var(--line);
  font-family: var(--font-mono); font-size: 12px; font-weight: 800; color: var(--em);
}
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  min-height: 46px; padding: 11px 16px; border-radius: 10px;
  border: 1px solid var(--sage); background: var(--sage); color: #20231d;
  font-family: var(--font-mono); font-size: 13px; font-weight: 800;
  letter-spacing: .08em; text-transform: uppercase; text-decoration: none; cursor: pointer;
}
.btn.ghost { background: transparent; color: var(--ink-2); border-color: var(--line); }
.btn:hover { filter: brightness(1.04); }
.btn:focus-visible, button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid var(--sage); outline-offset: 3px; }
a { text-decoration-thickness: 1px; }

/* ---------------------------------------------------------------- cover */
.cover { padding: 0; background: #171a15; overflow: hidden; }
.cover-grain { position: absolute; inset: 0; pointer-events: none; opacity: .25; z-index: 1;
  background-image: radial-gradient(rgba(255,255,255,.18) .6px, transparent .7px);
  background-size: 4px 4px; mix-blend-mode: soft-light; }
.cover-top {
  position: absolute; top: clamp(22px, 3vh, 30px); left: clamp(28px, 3.5vw, 54px); right: clamp(28px, 3.5vw, 54px);
  display: flex; align-items: center; justify-content: space-between; gap: 18px; z-index: 6;
}
.cover-cobrand { display: flex; align-items: center; gap: 10px; color: #e9ebe2; }
.brandcore-lockup { width: 118px; height: auto; display: block; }
.cover-cobrand span { color: var(--sage); font-size: 17px; }
.cover-cobrand b { font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: .14em; }
.cover-top-note { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: #b9c0ad; }
.cover-grid {
  position: relative; z-index: 3; flex: 1; display: grid;
  grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr); gap: clamp(22px, 2.6vw, 44px);
  align-items: center; padding: clamp(84px, 10vh, 108px) clamp(28px, 3.5vw, 54px) 64px;
  min-height: 0;
}
.cover-copy { max-width: 650px; }
.cover-copy .kicker { color: var(--sage); }
.cover-copy .kicker::before { background: var(--sage); }
.cover h1 { font-size: clamp(48px, 5.6vw, 84px); line-height: .97; letter-spacing: -.047em; margin-top: 10px; color: #f8f6ef; }
.cover h1 em { color: var(--sage); }
.cover .lead { color: #d9ded0; font-size: clamp(17px, 1.2vw, 21px); line-height: 1.55; max-width: 52ch; margin-top: 20px; }
.cover-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.cover .btn.ghost { color: #f1f3eb; border-color: rgba(255,255,255,.28); }
.cover-facts { display: flex; flex-direction: column; gap: 6px; margin-top: 28px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.17);
  font-size: clamp(12px, .84vw, 13.5px); line-height: 1.45; color: #cbd1c2; }
.cover-facts b { color: #fff; font-weight: 700; }
.cover-stage { position: relative; height: 100%; min-height: 500px; display: flex; align-items: center; justify-content: center; }
.cover-stage::before { content: ''; position: absolute; inset: 6% 3% 8%; border-radius: 50%;
  background: radial-gradient(circle at 55% 45%, rgba(199,207,183,.18) 0%, rgba(119,128,106,.1) 30%, transparent 66%); filter: blur(8px); }
#cover-scene { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; }
.cover-fallback { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 3; transition: opacity .45s ease; }
.webgl-ready .cover-fallback { opacity: 0; visibility: hidden; }
.fallback-glow { position: absolute; width: 78%; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, rgba(199,207,183,.2), transparent 66%); filter: blur(16px); }
.fallback-print {
  position: relative; width: min(78%, 570px); aspect-ratio: 1.6; padding: clamp(20px, 2.2vw, 32px);
  background: #f5f0e4; border: 10px solid #2b2e26; border-radius: 4px;
  box-shadow: 0 30px 70px rgba(0,0,0,.6), 0 0 0 1px rgba(199,207,183,.35);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15%;
  transform: rotate(-3deg);
}
.fallback-print::after { content: ''; position: absolute; inset: 10px; border: 1px solid rgba(32,35,29,.25); pointer-events: none; }
.fallback-print img { width: 92%; display: block; }
.fallback-print span { font-family: var(--font-mono); font-size: clamp(8px, .68vw, 11px); font-weight: 700; letter-spacing: .18em; color: #454a3d; }
.stage-vignette { position: absolute; inset: 0; z-index: 4; pointer-events: none;
  background: radial-gradient(ellipse at 55% 45%, transparent 40%, rgba(0,0,0,.34) 100%); }
.stage-caption { position: absolute; left: 4%; right: 4%; bottom: 56px; z-index: 5; display: flex; justify-content: space-between; gap: 12px;
  padding-top: 9px; border-top: 1px solid rgba(255,255,255,.15); font-family: var(--font-mono); font-size: 9.5px;
  letter-spacing: .1em; text-transform: uppercase; color: #b8bfae; }
.stage-caption i { font-style: normal; color: #8f9786; }
.cover-foot {
  position: absolute; left: clamp(28px, 3.5vw, 54px); right: clamp(28px, 3.5vw, 54px); bottom: clamp(20px, 3vh, 30px);
  z-index: 6; display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding-top: 12px; border-top: 1px solid rgba(255,255,255,.17); color: #d7dccd;
  font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase;
}
.prepared { display: flex; align-items: center; gap: 10px; }
.prepared img { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; border: 1px solid rgba(199,207,183,.55); }
.prepared b { color: #fff; }
.cover-cue { display: inline-flex; align-items: center; gap: 7px; color: var(--sage); }
.cover-foot .page { color: #fff; }

/* ---------------------------------------------------------------- audit */
.audit-body { display: grid; grid-template-rows: auto minmax(0,1fr); gap: 14px; padding-top: 12px; }
.audit-head { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.65fr); gap: 26px; align-items: end; }
.audit-head h2 { font-size: clamp(31px, 2.9vw, 45px); }
.audit-grid { display: grid; grid-template-columns: minmax(0,.82fr) minmax(0,1.18fr); gap: clamp(18px,1.8vw,28px); min-height: 0; }
.audit-visual { position: relative; min-width: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 7px; }
.evidence { margin: 0; position: relative; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-light); }
.evidence-desktop img { display: block; width: 100%; height: auto; }
.evidence-mobile { position: absolute; right: 4%; bottom: 48px; width: 27%; border: 4px solid #fff; box-shadow: 0 18px 40px rgba(0,0,0,.22); }
.evidence-mobile img { display: block; width: 100%; }
.evidence figcaption { padding: 5px 7px; font-family: var(--font-mono); font-size: 8px; letter-spacing: .08em; color: #596052; background: #fff; }
.evidence-tag { position: absolute; z-index: 2; display: inline-block; padding: 4px 7px; border-radius: 3px;
  background: var(--red); color: #fff; font-family: var(--font-mono); font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.tag-a { left: 6%; top: 30%; }
.tag-b { right: 7%; top: 6%; }
.evidence-mobile { z-index: 3; }
.evidence-mobile figcaption { font-size: 7px; }
.source-line { margin-top: 2px; font-family: var(--font-mono); font-size: 10.5px; line-height: 1.45; letter-spacing: .015em; color: var(--muted); }
.source-line b { color: var(--ink); }
.audit-list { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; align-content: start; min-width: 0; }
.finding { display: grid; grid-template-columns: 24px 1fr; gap: 8px; padding: 11px 12px 10px; background: var(--surface);
  border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 8px 18px rgba(32,35,29,.05); min-width: 0; }
.fnum { font-family: var(--font-mono); font-size: 11px; font-weight: 800; color: var(--bronze); }
.finding-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 7px; }
.finding h3 { font-size: clamp(16.5px, 1.16vw, 20px); line-height: 1.2; }
.finding p { margin-top: 4px; font-size: clamp(16.5px, 1.1vw, 18.5px); line-height: 1.38; color: var(--ink-3); }
.finding small { display: block; margin-top: 5px; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .08em; color: #7b8072; }
.tag { flex: none; padding: 2px 5px; border-radius: 3px; font-family: var(--font-mono); font-size: 7.5px; letter-spacing: .08em; font-weight: 800; }
.tag.high { background: var(--red); color: #fff; }
.tag.med { background: #d8d1bf; color: #4b4a3f; }

/* ---------------------------------------------------------------- gap */
.gap-body { display: flex; flex-direction: column; justify-content: space-between; gap: 14px; padding-top: 12px; }
.gap-head { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(0,.62fr); gap: 28px; align-items: end; }
.gap-head h2 { font-size: clamp(31px, 2.9vw, 45px); }
.path-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-content: start; }
.path-card { padding: 16px 17px; border-radius: 13px; border: 1px solid var(--line); background: var(--surface); min-width: 0; }
.path-card.current { background: #262923; border-color: rgba(255,255,255,.12); }
.path-card.proposed { background: #34392e; border-color: rgba(199,207,183,.4); }
.path-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.path-label { font-family: var(--font-mono); font-size: 10.5px; font-weight: 800; letter-spacing: .12em; color: var(--sage); }
.path-count { font-family: var(--font-mono); font-size: 10.5px; color: #b8c0ad; }
.path-steps { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 7px; margin-top: 13px; }
.path-steps span { padding: 5px 7px; border-radius: 4px; border: 1px solid rgba(255,255,255,.16); font-family: var(--font-mono); font-size: 10.5px; line-height: 1.2; color: #f4f3ec; }
.path-steps span.end { background: var(--sage); color: #20231d; border-color: var(--sage); font-weight: 800; }
.path-steps i { color: #9ba38f; font-style: normal; font-size: 12px; }
.path-card p { margin-top: 12px; font-size: clamp(14px, .98vw, 16.5px); line-height: 1.42; color: #d9ded1; }
.gap-bridge { display: flex; align-items: baseline; gap: 16px; padding: 10px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.gap-bridge span { flex: none; font-family: var(--font-mono); font-size: 9px; font-weight: 800; letter-spacing: .12em; color: var(--em); }
.gap-bridge p { font-family: var(--font-display); font-size: clamp(21px, 1.6vw, 28px); line-height: 1.1; letter-spacing: -.02em; color: var(--ink); }
.gap-notes { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.gap-notes article { display: grid; grid-template-columns: 30px 1fr; gap: 9px; padding: 12px 13px; border-radius: 11px; background: var(--surface); border: 1px solid var(--line); }
.gap-notes h3 { font-size: clamp(15.5px, 1.12vw, 18px); line-height: 1.22; }
.gap-notes p { margin-top: 4px; font-size: clamp(14px, .95vw, 15.5px); line-height: 1.38; color: var(--ink-3); }
.gap-notes .num-chip { width: 27px; height: 27px; font-size: 10px; }

/* ---------------------------------------------------------------- flagship */
.flagship-body { display: grid; grid-template-rows: auto minmax(0,1fr); gap: 12px; padding-top: 12px; }
.flagship-head { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.62fr); gap: 26px; align-items: end; }
.flagship-head h2 { font-size: clamp(30px, 2.75vw, 43px); }
.flagship-grid { display: grid; grid-template-columns: minmax(0,1.58fr) minmax(280px,.68fr); gap: 22px; min-height: 0; }
.browser-wrap { position: relative; min-width: 0; min-height: 0; padding-bottom: 12px; }
.browser { height: 100%; display: flex; flex-direction: column; background: #f8f5ed; border: 1px solid rgba(32,35,29,.2); border-radius: 12px; overflow: hidden; box-shadow: var(--shadow-light); }
.browser-bar { flex: none; height: 27px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; padding: 0 10px; background: #252820; border-bottom: 1px solid rgba(255,255,255,.1); }
.dots { display: flex; gap: 4px; }
.dots i { width: 6px; height: 6px; border-radius: 50%; background: #757d68; }
.browser-url { font-family: var(--font-mono); font-size: 8.5px; letter-spacing: .04em; color: #e7e9df; }
.browser-live { justify-self: end; font-family: var(--font-mono); font-size: 8px; font-weight: 800; letter-spacing: .1em; color: #20231d; background: var(--sage); padding: 3px 6px; border-radius: 3px; }
.browser-tabs { flex: none; display: flex; align-items: stretch; gap: 0; padding: 0 8px; background: #ede8dc; border-bottom: 1px solid rgba(32,35,29,.13); overflow-x: auto; }
.btab { appearance: none; border: 0; background: transparent; padding: 8px 10px; font-family: var(--font-mono); font-size: 9.5px; font-weight: 700; letter-spacing: .06em; color: #5c6254; cursor: pointer; white-space: nowrap; border-bottom: 2px solid transparent; }
.btab.active { color: #20231d; border-bottom-color: var(--bronze); }
.browser-site { position: relative; flex: 1; min-height: 0; background: #f4f0e6; overflow: hidden; }
.site-brandrow { height: 31px; display: flex; align-items: center; gap: 12px; padding: 0 12px; border-bottom: 1px solid rgba(32,35,29,.12); background: #f8f5ed; }
.site-brandrow img { width: 128px; height: 25px; object-fit: contain; }
.site-brandrow span { margin-left: auto; font-family: var(--font-mono); font-size: 7.5px; letter-spacing: .04em; color: #606758; }
.site-brandrow a { padding: 5px 7px; background: var(--bronze); color: #fff; text-decoration: none; font-family: var(--font-mono); font-size: 7.5px; font-weight: 800; letter-spacing: .06em; }
.site-view { display: none; height: calc(100% - 31px); min-height: 0; }
.site-view.active { display: block; }
.site-home-hero { display: grid; grid-template-columns: 1fr 1fr; min-height: 0; height: 70%; }
.site-home-copy { padding: 18px 17px 12px 18px; display: flex; flex-direction: column; justify-content: center; }
.mini-kicker { font-family: var(--font-mono); font-size: 8px; font-weight: 800; letter-spacing: .13em; color: var(--bronze); }
.site-home-copy h3, .site-split h3, .studio-panel h3 { margin-top: 7px; font-family: var(--font-display); font-weight: 400; font-size: clamp(21px, 1.6vw, 27px); line-height: 1.05; letter-spacing: -.035em; }
.site-home-copy p, .site-split p, .studio-panel p { margin-top: 8px; font-size: 10.5px; line-height: 1.4; color: #555c4d; }
.site-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 13px; }
.site-actions a, .site-actions button, .site-split a, .studio-panel a { display: inline-flex; align-items: center; justify-content: center; min-height: 25px; padding: 5px 8px; border: 1px solid var(--bronze); background: var(--bronze); color: #fff; font-family: var(--font-mono); font-size: 8px; font-weight: 800; letter-spacing: .04em; text-decoration: none; cursor: pointer; }
.site-actions button { background: transparent; color: var(--bronze); }
.site-home-hero figure { position: relative; margin: 0; overflow: hidden; background: #e4ddcd; }
.site-home-hero figure img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.site-home-hero figcaption, .site-split figcaption { position: absolute; left: 8px; bottom: 7px; padding: 3px 6px; background: rgba(32,35,29,.82); color: #f4f0e6; font-family: var(--font-mono); font-size: 7px; letter-spacing: .05em; }
.site-session-strip { height: 17%; min-height: 38px; display: flex; align-items: center; justify-content: space-around; gap: 6px; padding: 0 11px; border-top: 1px solid rgba(32,35,29,.12); border-bottom: 1px solid rgba(32,35,29,.12); background: #ece6d8; }
.site-session-strip span { font-family: var(--font-mono); font-size: 7.5px; font-weight: 700; letter-spacing: .08em; color: #4a5043; }
.site-appointment { min-height: 13%; display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: #f8f5ed; }
.site-appointment b { font-family: var(--font-mono); font-size: 8px; letter-spacing: .05em; color: var(--bronze); }
.site-appointment span { font-family: var(--font-display); font-size: 17px; color: #20231d; }
.site-appointment small { margin-left: auto; font-size: 8px; color: #626658; }
.site-split { display: grid; grid-template-columns: 1fr 1fr; height: 100%; min-height: 0; }
.site-split figure { position: relative; margin: 0; overflow: hidden; background: #e4ddcd; }
.site-split figure img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.site-split figure.portrait-crop img { object-position: center 24%; }
.site-split > div { padding: 18px 17px; display: flex; flex-direction: column; justify-content: center; }
.site-split ul { margin: 12px 0 14px; padding: 0; list-style: none; display: grid; gap: 5px; }
.site-split li { font-size: 10px; line-height: 1.3; color: #3f4639; }
.site-split li::before { content: '—'; color: var(--bronze); margin-right: 6px; }
.site-split a { align-self: flex-start; }
.studio-panel { display: grid; grid-template-columns: 1fr .9fr; gap: 18px; height: 100%; padding: 20px; align-items: center; }
.studio-panel p { max-width: 34ch; }
.studio-panel a { align-self: flex-start; margin-top: 12px; }
.studio-list { display: grid; gap: 0; border-top: 1px solid rgba(32,35,29,.16); }
.studio-list span { display: flex; justify-content: space-between; gap: 10px; padding: 11px 2px; border-bottom: 1px solid rgba(32,35,29,.14); font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: .05em; color: #394032; }
.studio-list i { font-style: normal; color: var(--bronze); }
.studio-list small { margin-top: 9px; font-size: 8.5px; line-height: 1.4; color: #6a705f; }
.browser-foot { flex: none; display: flex; justify-content: space-between; gap: 10px; padding: 6px 10px 0; font-family: var(--font-mono); font-size: 7px; letter-spacing: .1em; color: #707668; }
.phone {
  position: absolute; right: 10px; bottom: 38px; width: 116px; height: 228px; z-index: 5; flex: none; margin: 0;
  background: #1c1f19; border: 4px solid #0f110d; border-radius: 17px; box-shadow: 0 18px 42px rgba(0,0,0,.38);
  padding: 6px 5px 5px;
}
.phone-notch { width: 48px; height: 4px; border-radius: 999px; background: #3b4035; margin: 0 auto 7px; }
.phone-screen { height: 100%; background: #f4f0e6; border-radius: 11px; padding: 8px 7px; display: flex; flex-direction: column; align-items: flex-start; overflow: hidden; }
.phone-logo { width: 92px; display: block; }
.phone-kicker { margin-top: 6px; font-family: var(--font-mono); font-size: 5px; font-weight: 800; letter-spacing: .07em; color: var(--bronze); }
.phone-screen h4 { margin-top: 4px; font-family: var(--font-display); font-weight: 400; font-size: 12.5px; line-height: 1.05; letter-spacing: -.025em; color: #20231d; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.phone-screen p { margin-top: 3px; font-size: 6.5px; line-height: 1.3; color: #555c4d; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.phone-call { margin-top: auto; width: 100%; display: flex; align-items: center; justify-content: center; min-height: 22px; background: var(--bronze); color: #fff; font-family: var(--font-mono); font-size: 5.5px; font-weight: 800; letter-spacing: .05em; text-decoration: none; }
.phone-note { margin-top: 4px; font-family: var(--font-mono); font-size: 5.5px; color: #596052; }
.phone-note i { font-style: normal; color: var(--bronze); }
.flagship-side { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 4px 0 8px; }
.flagship-side h3 { margin-top: 4px; font-family: var(--font-display); font-weight: 400; font-size: clamp(21px, 1.45vw, 25px); line-height: 1.05; letter-spacing: -.03em; }
.flagship-side > p { margin-top: 7px; font-size: clamp(15px, 1.02vw, 17.5px); line-height: 1.45; color: var(--ink-3); }
.detail-points { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line); }
.detail-points span { display: flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); }
.detail-points .ico { color: var(--em); }
.detail-cta { align-self: flex-start; display: inline-flex; align-items: center; gap: 7px; margin-top: 14px; padding: 9px 11px; border: 1px solid var(--bronze); color: var(--bronze); text-decoration: none; font-family: var(--font-mono); font-size: 11.5px; font-weight: 800; letter-spacing: .06em; }
.concept-note { margin-top: 13px; font-size: 11.5px; line-height: 1.45; color: #6b7062; }
.mobile-tabs { display: none; }

/* ---------------------------------------------------------------- system */
.system-body { display: flex; flex-direction: column; padding-top: 12px; }
.system-inner { flex-shrink: 0; margin: auto 0; width: 100%; display: flex; flex-direction: column; gap: 14px; }
.system-head, .roadmap-head, .engagement-head { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(0,.62fr); gap: 26px; align-items: end; }
.system-head h2, .roadmap-head h2, .engagement-head h2 { font-size: clamp(31px, 2.9vw, 45px); }
.system-grid { display: grid; grid-template-columns: repeat(3,1fr); grid-template-rows: auto auto; gap: 11px; }
.system-card { display: flex; flex-direction: column; padding: 16px 16px 13px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); min-width: 0; }
.system-num { font-family: var(--font-mono); font-size: 11px; font-weight: 800; color: var(--em); }
.system-card h3 { margin-top: 9px; font-family: var(--font-display); font-weight: 400; font-size: clamp(20px, 1.55vw, 26px); line-height: 1.06; letter-spacing: -.03em; }
.system-card p { margin-top: 8px; font-size: clamp(16px, 1.12vw, 19px); line-height: 1.42; color: var(--ink-3); }
.system-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 11px; }
.system-tags span { padding: 4px 7px; border: 1px solid var(--line); font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: .02em; color: var(--ink-2); }
.card-outcome { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); font-family: var(--font-mono); font-size: 11.5px; font-weight: 700; letter-spacing: .05em; color: var(--em); }

/* ---------------------------------------------------------------- proof */
.proof-body { display: grid; grid-template-rows: auto minmax(0,1fr); gap: 14px; padding-top: 12px; }
.proof-head { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(0,.62fr); gap: 26px; align-items: end; }
.proof-head h2 { font-size: clamp(31px, 2.9vw, 45px); }
.proof-grid { display: grid; grid-template-columns: minmax(0,.55fr) minmax(0,1.45fr); gap: 26px; align-items: center; min-height: 0; }
.proof-grid .ba { width: min(100%, 690px); margin-left: auto; }
.proof-copy { display: flex; flex-direction: column; gap: 12px; }
.proof-point { padding-top: 10px; border-top: 1px solid var(--line); }
.proof-point span { font-family: var(--font-mono); font-size: 10px; font-weight: 800; letter-spacing: .12em; color: var(--em); }
.proof-point p { margin-top: 5px; font-size: clamp(16px, 1.1vw, 18.5px); line-height: 1.42; color: var(--ink-3); }
.proof-rule { height: 1px; background: var(--line); }
.proof-note { font-family: var(--font-display); font-size: clamp(19px, 1.5vw, 24px); line-height: 1.15; color: var(--ink); }
.ba { --pos: 50%; min-width: 0; }
.ba-stage { position: relative; width: 100%; height: auto; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 10px; background: #333; border: 1px solid rgba(255,255,255,.18); box-shadow: var(--shadow-dark); }
.ba-stage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.ba-before { filter: saturate(.8) brightness(.86); }
.ba-after { clip-path: inset(0 0 0 var(--pos)); }
.ba-line { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 2px; background: var(--sage); box-shadow: 0 0 0 1px rgba(0,0,0,.25); transform: translateX(-50%); }
.ba-handle { position: absolute; top: 50%; left: var(--pos); width: 44px; height: 44px; border: 2px solid var(--sage); border-radius: 50%; background: rgba(29,32,27,.82); transform: translate(-50%,-50%); cursor: ew-resize; display: grid; place-items: center; grid-template-columns: 1fr 1fr; gap: 3px; padding: 0 9px; }
.ba-handle i { width: 2px; height: 14px; background: var(--sage); display: block; }
.ba-labels { display: flex; justify-content: space-between; gap: 10px; margin-top: 8px; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .08em; color: var(--ink-3); }

/* ---------------------------------------------------------------- roadmap */
.roadmap-body { display: flex; flex-direction: column; justify-content: space-between; gap: 14px; padding-top: 12px; }
.phase-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; align-content: start; }
.phase-card { display: flex; flex-direction: column; padding: 16px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); min-width: 0; }
.phase-card ul { margin-top: auto; }
.roadmap-timeline { padding: 12px 15px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.timeline-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .1em; color: var(--muted); }
.timeline-top b { color: var(--bronze); font-size: 10.5px; }
.timeline-bar { display: grid; grid-template-columns: .18fr .38fr 1.44fr; gap: 3px; height: 8px; margin-top: 9px; }
.timeline-bar i { display: block; border-radius: 2px; background: #d7d1c1; }
.timeline-bar .t1 { background: var(--bronze); }
.timeline-bar .t2 { background: var(--olive); }
.timeline-bar .t3 { background: var(--sage); }
.timeline-labels { display: flex; justify-content: space-between; gap: 10px; margin-top: 7px; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .04em; color: var(--muted); }
.timeline-labels b { color: var(--ink); }
.phase-card.featured { background: var(--carbon); border-color: var(--carbon); color: #fff; }
.phase-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.phase-num { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: var(--bronze); color: #fff; font-family: var(--font-mono); font-size: 11px; font-weight: 800; }
.phase-card.featured .phase-num { background: var(--sage); color: #20231d; }
.phase-days { font-family: var(--font-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .07em; color: var(--em); }
.phase-card.featured .phase-days { color: var(--sage); }
.phase-card h3 { margin-top: 12px; font-family: var(--font-display); font-weight: 400; font-size: clamp(22px, 1.7vw, 28px); line-height: 1.05; letter-spacing: -.03em; }
.phase-card.featured h3 { color: #fff; }
.phase-card p { margin-top: 8px; font-size: clamp(16px, 1.08vw, 18.5px); line-height: 1.42; color: var(--ink-3); }
.phase-card.featured p { color: #dce1d3; }
.phase-card ul { margin: 13px 0 0; padding: 11px 0 0; border-top: 1px solid var(--line); list-style: none; display: grid; gap: 5px; }
.phase-card.featured ul { border-top-color: rgba(255,255,255,.15); }
.phase-card li { font-size: 13.5px; line-height: 1.35; color: var(--ink-2); }
.phase-card.featured li { color: #e8ebdf; }
.phase-card li::before { content: '—'; color: var(--em); margin-right: 6px; }
.roadmap-foot { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; padding: 11px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); font-size: 11.5px; line-height: 1.45; color: var(--ink-3); }
.roadmap-foot b { color: var(--ink); }

/* ---------------------------------------------------------------- engagement */
.engagement-body { display: flex; flex-direction: column; justify-content: space-between; gap: 14px; padding-top: 12px; }
.tier-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; align-content: start; }
.tier-card { padding: 17px 16px; border-radius: 13px; border: 1px solid var(--line); background: var(--surface); min-width: 0; }
.tier-card.recommended { background: var(--paper); color: #20231d; border-color: var(--sage); box-shadow: 0 16px 34px rgba(0,0,0,.22); }
.tier-card.recommended h3 { color: #20231d; }
.tier-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tier-num { font-family: var(--font-mono); font-size: 11px; font-weight: 800; color: var(--em); }
.tier-label { font-family: var(--font-mono); font-size: 9px; font-weight: 800; letter-spacing: .1em; color: var(--sage); }
.tier-card.recommended .tier-num { color: var(--bronze); }
.tier-card.recommended .tier-label { color: var(--bronze); }
.recommend { margin-left: auto; padding: 3px 6px; border-radius: 3px; background: var(--bronze); color: #fff; font-family: var(--font-mono); font-size: 7px; font-weight: 800; letter-spacing: .08em; }
.tier-card h3 { margin-top: 13px; font-family: var(--font-display); font-weight: 400; font-size: clamp(24px, 1.8vw, 30px); line-height: 1.02; letter-spacing: -.03em; }
.tier-card p { margin-top: 7px; font-size: clamp(16px, 1.1vw, 18.5px); line-height: 1.42; color: var(--ink-3); }
.tier-card.recommended p { color: #4e5545; }
.tier-card ul { margin: 15px 0 0; padding: 12px 0 0; border-top: 1px solid var(--line); list-style: none; display: grid; gap: 6px; }
.tier-card.recommended ul { border-top-color: rgba(32,35,29,.16); }
.tier-card li { font-size: 14px; line-height: 1.35; color: var(--ink-2); }
.tier-card.recommended li { color: #343a2e; }
.tier-card li::before { content: '✓'; color: var(--em); margin-right: 6px; font-weight: 800; }
.engagement-next { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.engagement-next > div { display: flex; flex-direction: column; gap: 3px; }
.engagement-next span { font-family: var(--font-mono); font-size: 9.5px; font-weight: 800; letter-spacing: .1em; color: var(--em); }
.engagement-next b { font-size: 13px; line-height: 1.2; color: var(--ink); }
.engagement-next small { font-size: 10.5px; line-height: 1.3; color: var(--ink-3); }
.engagement-next i { font-style: normal; color: var(--em); }
.engagement-foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 11px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); font-size: 11.5px; line-height: 1.45; color: var(--ink-3); }
.engagement-foot b { color: var(--ink); }

/* ---------------------------------------------------------------- close */
.close-body { display: grid; grid-template-columns: minmax(0,1.16fr) minmax(0,.84fr); gap: clamp(20px,2.6vw,38px); align-items: center; padding-top: 12px; }
.close-left { min-width: 0; }
.close-left h2 { font-size: clamp(31px, 2.9vw, 45px); }
.close-left .lead { font-size: clamp(16.5px, 1.12vw, 19px); line-height: 1.48; }
.partner { display: grid; grid-template-columns: 128px 1fr; gap: 14px; align-items: center; margin-top: 16px; padding: 13px; background: var(--surface); border: 1px solid var(--line); border-radius: 13px; }
.partner-photo { width: 128px; height: 128px; border-radius: 50%; overflow: hidden; border: 2px solid var(--sage); }
.partner-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; }
.partner-label { font-family: var(--font-mono); font-size: 9px; font-weight: 800; letter-spacing: .1em; color: var(--bronze); }
.partner-copy h3 { margin-top: 2px; font-family: var(--font-display); font-weight: 400; font-size: clamp(25px, 1.9vw, 32px); line-height: 1; letter-spacing: -.03em; }
.partner-role { margin-top: 3px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); }
.partner-quote { margin-top: 7px; padding-left: 9px; border-left: 2px solid var(--bronze); font-size: 14px; line-height: 1.4; color: var(--ink-3); }
.contact-row { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.contact-row a { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-2); text-decoration: none; background: var(--surface); }
.contact-row .ico { color: var(--bronze); }
.close-signoff { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding-top: 11px; border-top: 1px solid var(--line); }
.close-signoff img { width: 116px; height: auto; display: block; }
.close-signoff span { font-family: var(--font-mono); font-size: 9px; letter-spacing: .04em; color: var(--muted); }
.close-right { min-width: 0; }
.request { padding: 19px 18px; border-radius: 14px; background: var(--carbon); border: 1px solid rgba(255,255,255,.13); box-shadow: var(--shadow-dark); color: #fff; }
.request .kicker { color: var(--sage); }
.request .kicker::before { background: var(--sage); }
.request h3 { font-family: var(--font-display); font-weight: 400; font-size: clamp(27px, 2vw, 34px); line-height: 1; color: #fff; }
.request > p { margin-top: 7px; font-size: 15px; line-height: 1.45; color: #d7dccd; }
.suggestions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 13px; }
.suggestions button { min-height: 42px; padding: 8px; border: 1px solid rgba(255,255,255,.22); border-radius: 7px; background: rgba(255,255,255,.06); font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: .03em; color: #fff; cursor: pointer; }
.suggestions button:hover { background: var(--sage); color: #20231d; }
.picker-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.picker-grid > div { min-width: 0; }
.picker-grid label { display: block; margin-bottom: 4px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .05em; text-transform: uppercase; color: #d7dccd; }
.date-control { position: relative; }
.date-control input { width: 100%; height: 40px; padding: 4px 38px 4px 9px; border: 1px solid rgba(255,255,255,.22); border-radius: 7px; background: #1b1e18; color: #fff; color-scheme: dark; font-family: var(--font-mono); font-size: 13.5px; }
.date-control input::-webkit-calendar-picker-indicator { opacity: 0; cursor: pointer; }
.date-control button { position: absolute; top: 50%; right: 4px; width: 29px; height: 29px; transform: translateY(-50%); border: 0; border-radius: 6px; background: rgba(255,255,255,.09); color: #fff; display: grid; place-items: center; cursor: pointer; }
.date-control .date-icon { width: 15px; height: 15px; }
#contact { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 10px; min-height: 44px; padding: 10px 12px; border-radius: 8px; background: var(--sage); color: #20231d; font-family: var(--font-mono); font-size: 12.5px; font-weight: 800; letter-spacing: .05em; text-decoration: none; }
.request small { display: block; margin-top: 9px; font-size: 11px; line-height: 1.4; color: #aeb5a3; }
#picker-help { font-size: 10px; color: var(--sage); }

/* ---------------------------------------------------------------- controls, rail, index */
.progress-track { position: absolute; top: 0; left: 0; right: 0; height: 2px; background: rgba(255,255,255,.13); z-index: 40; }
.progress-track i { display: block; width: 11.1%; height: 100%; background: var(--sage); transition: width .35s ease; }
.controls { position: fixed; left: 50%; bottom: 8px; z-index: 60; display: flex; align-items: center; gap: 2px; padding: 4px; border-radius: 999px; background: rgba(24,27,21,.96); border: 1px solid rgba(255,255,255,.2); box-shadow: 0 14px 34px rgba(0,0,0,.45); transform: translateX(-50%); }
.controls button { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; min-height: 38px; padding: 4px 10px; border: 0; border-radius: 999px; background: transparent; color: #fff; cursor: pointer; }
.controls button:hover { background: rgba(255,255,255,.1); }
.controls #prev .ico { transform: rotate(180deg); }
#counter { min-width: 54px; text-align: center; font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: .08em; }
.index-control { margin-left: 3px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,.2) !important; border-radius: 0 999px 999px 0 !important; font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: .1em; color: #ced4c3 !important; }
.rail { position: fixed; right: 18px; top: 50%; z-index: 55; display: flex; flex-direction: column; gap: 5px; transform: translateY(-50%); }
.rail button { width: 24px; height: 24px; border: 0; background: transparent; cursor: pointer; display: grid; place-items: center; }
.rail button i { width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,.28); transition: all .2s; }
.rail button.on i { width: 7px; height: 7px; background: var(--sage); box-shadow: 0 0 0 3px rgba(199,207,183,.16); }
.index-overlay { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(15,17,13,.88); backdrop-filter: blur(8px); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.index-overlay.open { opacity: 1; pointer-events: auto; }
.index-panel { width: min(1120px,100%); max-height: 88vh; overflow: auto; padding: 22px; border-radius: 16px; background: #20231d; border: 1px solid rgba(255,255,255,.18); box-shadow: 0 30px 80px rgba(0,0,0,.6); }
.index-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 13px; border-bottom: 1px solid rgba(255,255,255,.16); font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; color: var(--sage); }
.index-head button { border: 0; background: transparent; color: #fff; font-family: var(--font-mono); font-size: 10px; cursor: pointer; }
.index-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 14px; }
.index-card { text-align: left; padding: 12px; border: 1px solid rgba(255,255,255,.15); border-radius: 9px; background: rgba(255,255,255,.04); color: #fff; cursor: pointer; }
.index-card:hover { background: rgba(199,207,183,.13); }
.index-card b { display: block; font-family: var(--font-mono); font-size: 9px; color: var(--sage); letter-spacing: .08em; }
.index-card span { display: block; margin-top: 5px; font-family: var(--font-display); font-size: 18px; line-height: 1.05; }
.index-card small { display: block; margin-top: 5px; font-size: 9px; line-height: 1.35; color: #c4cab9; }
.index-card.on { border-color: var(--sage); background: rgba(199,207,183,.16); }

/* ---------------------------------------------------------------- desktop canvas */
@media screen and (min-width: 1100px) {
  body { height: 100dvh; overflow: hidden; display: flex; align-items: center; justify-content: center; padding: 24px 0 66px; }
  .deck { width: min(96vw,1640px); height: min(calc(100dvh - 90px),920px); border-radius: 18px; }
  .slide { overflow: hidden; }
  .rail { right: calc((100vw - min(96vw, 1640px)) / 2 + 10px); }
}
@media screen and (min-width: 1100px) and (max-height: 820px) {
  .cover-grid { padding-top: 52px; padding-bottom: 26px; }
  .cover h1 { font-size: clamp(44px, 4.65vw, 66px); line-height: .98; }
  .cover .lead { margin-top: 12px; font-size: clamp(16px, 1.08vw, 18px); line-height: 1.45; }
  .cover-actions { margin-top: 14px; gap: 8px; }
  .cover .btn { min-height: 42px; padding: 9px 12px; font-size: 12px; }
  .cover-facts { display: grid; grid-template-columns: 1.05fr 1fr; gap: 4px 16px; margin-top: 14px; padding-top: 10px; font-size: 12.5px; line-height: 1.35; }
  .cover-foot { bottom: 16px; font-size: 9px; }
  .cover-foot .prepared img { width: 32px; height: 32px; }
  .audit-body { gap: 8px; }
  .audit-grid { gap: 16px; }
  .audit-head h2 { font-size: 37px; }
  .audit-head .lead { margin-top: 6px; font-size: 16px; line-height: 1.4; }
  .audit-list { gap: 6px; }
  .finding { padding: 8px 9px; }
  .finding h3 { font-size: 15.5px; }
  .finding p { margin-top: 3px; font-size: 15px; line-height: 1.3; }
  .finding small { margin-top: 3px; font-size: 7.5px; }
  .evidence-mobile { width: 24%; bottom: 42px; }
  .source-line { font-size: 8.5px; }
  .flagship-side .phone { display: none; }
  .browser-wrap .phone { width: 96px; height: 190px; right: 8px; bottom: 34px; }
  .proof-grid .ba { width: min(100%, 620px); }
  .system-card { padding: 12px 13px; }
  .system-card p, .phase-card p, .tier-card p, .proof-point p { font-size: 15.5px; line-height: 1.35; }
  .system-card h3, .phase-card h3, .tier-card h3 { font-size: 23px; }
  .system-tags { margin-top: 8px; }
  .card-outcome { padding-top: 9px; }
  .system-tags span { font-size: 9.5px; }
  .card-outcome { font-size: 10.5px; }
  .phase-card li, .tier-card li { font-size: 12.5px; }
  .proof-note { font-size: 20px; }
  .flagship-side > p { font-size: 15px; }
  .close-left .lead { font-size: 16.5px; }
  .partner-quote { font-size: 12.5px; }
  .request > p { font-size: 13.5px; }
  .suggestions button { font-size: 11px; }
  .date-control input { font-size: 12.5px; }
}

@media screen and (max-width: 1099px) {
  body { min-height: 100dvh; overflow: hidden; }
  .deck { width: 100%; height: calc(100dvh - 76px); border: 0; border-radius: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .deck::-webkit-scrollbar { display: none; }
  .slide { position: relative; inset: auto; display: none; min-height: 100%; padding: 18px 18px 26px; overflow: visible; }
  .slide.active { display: flex; }
  .cover.active { display: block; }
  .slide-body { overflow: visible; flex: none; }
  .chrome { min-height: 54px; position: sticky; top: 0; z-index: 20; background: var(--bg); }
  .slide-foot { flex-direction: column; align-items: flex-start; gap: 6px; line-height: 1.45; }
  .slide-foot .page { align-self: flex-end; }
  .gap-bridge { display: block; }
  .gap-bridge span { display: block; margin-bottom: 5px; }
  .gap-bridge p { font-size: 20px; line-height: 1.2; }
  .engagement-next { grid-template-columns: 1fr; gap: 8px; }
  .engagement-next i { display: none; }
  .brand-tile { width: 154px; height: 43px; }
  .chrome-brandcore { width: 78px; }
  .chrome-section { font-size: 9px; }
  .chrome-section::before { width: 14px; margin-right: 6px; }
  .index-btn { font-size: 9px; padding: 6px 8px; }
  .slide-body { display: block !important; }
  .audit-head, .flagship-head, .gap-head, .system-head, .roadmap-head, .engagement-head, .proof-head { display: block; }
  .audit-head .lead, .flagship-head .lead, .gap-head .lead, .system-head .lead, .roadmap-head .lead, .engagement-head .lead, .proof-head .lead { margin-top: 10px; }
  .audit-grid, .proof-grid, .close-body { display: block; }
  .flagship-grid { display: flex; flex-direction: column; }
  .flagship-side { order: -1; }
  .browser-wrap { order: 1; }
  .audit-visual { margin-top: 16px; }
  .evidence-mobile { width: 29%; bottom: 52px; }
  .audit-list { grid-template-columns: 1fr; margin-top: 16px; }
  .finding p { font-size: 14px; }
  .path-grid, .system-grid, .phase-grid, .tier-grid, .gap-notes { grid-template-columns: 1fr; }
  .path-card, .system-card, .phase-card, .tier-card, .gap-notes article { margin-bottom: 10px; }
  .system-grid, .phase-grid, .tier-grid, .gap-notes { display: grid; height: auto; grid-template-rows: none; }
  .system-card, .phase-card { height: auto; }
  .roadmap-foot, .engagement-foot { grid-template-columns: 1fr; display: grid; gap: 8px; }
  .browser-wrap { padding: 0; margin: 15px 0 14px; }
  .browser { display: none; }
  .phone { position: relative; right: auto; bottom: auto; width: 190px; height: 365px; margin: 0 auto 10px; transform: none; }
  .flagship-side { padding: 0; }
  .mobile-tabs { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0 18px; order: -1; }
  .mobile-tabs .btab { border: 1px solid var(--line); border-radius: 999px; padding: 7px 9px; background: var(--surface); font-size: 10.5px; }
  .mobile-tabs .btab.active { background: var(--bronze); color: #fff; border-color: var(--bronze); }
  .flagship-side h3 { font-size: 28px; }
  .flagship-side > p { font-size: 16px; }
  .detail-points { display: grid; grid-template-columns: 1fr 1fr; gap: 7px 12px; }
  .ba { margin-top: 16px; }
  .close-left h2 { font-size: 34px; }
  .partner { grid-template-columns: 110px 1fr; }
  .partner-photo { width: 110px; height: 110px; }
  .close-right { margin-top: 18px; }
  .close-signoff { flex-wrap: wrap; }
  .rail { display: none; }
  .index-grid { grid-template-columns: 1fr 1fr; }
  .controls { bottom: 10px; width: calc(100% - 16px); justify-content: space-between; }
  .controls button { min-height: 44px; }
  .cover { min-height: calc(100dvh - 76px); padding: 0 18px 22px; }
  .cover-top { position: relative; top: auto; left: auto; right: auto; padding-top: 18px; flex-wrap: wrap; gap: 8px; }
  .cover-top-note { font-size: 9px; }
  .cover-grid { display: flex; flex-direction: column; padding: 18px 0 0; gap: 18px; align-items: stretch; }
  .cover-stage { order: -1; min-height: 0; height: 38vh; max-height: 380px; }
  .cover-copy { max-width: none; }
  .cover h1 { font-size: clamp(42px,11vw,68px); }
  .cover .lead { margin-top: 13px; font-size: 16px; }
  .cover-actions { margin-top: 16px; }
  .cover-facts { margin-top: 18px; }
  #cover-scene { display: none !important; }
  .cover-fallback { opacity: 1 !important; visibility: visible !important; }
  .fallback-print { width: min(86%, 470px); border-width: 7px; }
  .stage-caption { display: none; }
  .cover-foot { position: relative; left: auto; right: auto; bottom: auto; margin-top: 20px; flex-wrap: wrap; gap: 10px; font-size: 9px; }
  .cover-foot .page { margin-left: auto; }
  .prepared img { width: 32px; height: 32px; }
  .cover-cue { display: none; }
  .progress-track { position: fixed; top: 0; left: 0; right: 0; z-index: 70; }
  .progress-track i { height: 3px; }
}
@media screen and (max-width: 400px) {
  .cover-stage { height: 28vh; max-height: 240px; }
  .cover h1 { font-size: clamp(36px, 10.4vw, 48px); }
  .cover .lead { font-size: 15px; line-height: 1.45; }
  .cover-actions { margin-top: 12px; }
  .cover .btn { min-height: 42px; font-size: 11px; padding: 9px 12px; }
  .cover-facts { margin-top: 14px; }
}

@media screen and (max-width: 560px) {
  .chrome { flex-wrap: wrap; gap: 8px; }
  .chrome-brand { width: auto; }
  .chrome-brandcore { width: 56px; }
  .chrome-section { margin-left: 0; }
  .index-btn { margin-left: auto; }
  .audit-head h2, .gap-head h2, .flagship-head h2, .system-head h2, .roadmap-head h2, .engagement-head h2, .proof-head h2, .close-left h2 { font-size: 32px; }
  .lead { font-size: 15px; }
  .evidence-mobile { display: none; }
  .source-line { font-size: 8.5px; }
  .path-steps span { font-size: 9px; }
  .system-card h3, .tier-card h3, .phase-card h3 { font-size: 24px; }
  .system-card p, .tier-card p, .phase-card p { font-size: 14px; }
  .detail-points { grid-template-columns: 1fr; }
  .close-body { padding-top: 0; }
  .partner { grid-template-columns: 82px 1fr; gap: 10px; padding: 10px; }
  .partner-photo { width: 82px; height: 82px; }
  .partner-copy h3 { font-size: 25px; }
  .partner-quote { font-size: 11.5px; }
  .contact-row { flex-direction: column; }
  .contact-row a { justify-content: flex-start; }
  .suggestions { grid-template-columns: 1fr; }
  .picker-grid { grid-template-columns: 1fr; }
  .request { padding: 15px 13px; }
  .index-panel { padding: 14px; }
  .index-grid { grid-template-columns: 1fr; }
  .index-card span { font-size: 17px; }
}

/* ---------------------------------------------------------------- motion & accessibility */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
  .slide { transition: none !important; }
  .cover-fallback { transition: none !important; }
  .stage-caption i { display: none; }
}
.no-webgl .stage-caption i { display: none; }

body.is-cutting { cursor: progress; }
.cover-stage.is-gone { opacity: 0; transition: opacity .12s linear; }
.deck-seam { position: fixed; inset: 0; z-index: 94; pointer-events: none; overflow: hidden; visibility: hidden; }
.deck-seam b { position: absolute; top: 0; bottom: 0; width: 22vw; left: 0; background: linear-gradient(90deg, transparent 0%, rgba(199,207,183,.07) 45%, rgba(199,207,183,.28) 78%, transparent 100%); filter: blur(1px); }
.deck-seam i { position: absolute; top: 0; bottom: 0; width: 2px; left: 0; background: linear-gradient(180deg, transparent, #e9efdd 18%, #c7cfb7 50%, #e9efdd 82%, transparent); box-shadow: 0 0 18px rgba(199,207,183,.75); }
body.is-exploding .cover-grid { animation: coverShake .5s cubic-bezier(.36,.07,.19,.97); }
@keyframes coverShake {
  10%, 90% { transform: translate3d(-1px,0,0); }
  20%, 80% { transform: translate3d(2px,0,0); }
  30%, 50%, 70% { transform: translate3d(-4px,0,0); }
  40%, 60% { transform: translate3d(4px,0,0); }
}
.no-webgl #cover-scene { display: none; }
.no-webgl .cover-fallback { opacity: 1; visibility: visible; }