:root {
  color-scheme: dark;
  --obsidian: #111111;
  --charcoal: #1a1a1a;
  --panel: #202220;
  --cream: #f4f0e6;
  --white: #fff;
  --muted: #b7b8b3;
  --emerald: #107c41;
  --emerald-light: #2dc66d;
  --crimson: #c41c1c;
  --gold: #c9a96a;
  --line: rgba(255, 255, 255, .14);
  --shadow: 0 30px 80px rgba(0, 0, 0, .5);
  --sans: Inter, Montserrat, Roboto, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--obsidian); }
body { margin: 0; min-height: 100%; background: var(--obsidian); color: var(--cream); font-family: var(--sans); line-height: 1.55; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
img { display: block; max-width: 100%; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 1000; background: var(--cream); color: var(--obsidian); padding: .75rem 1rem; border-radius: .3rem; }
.skip-link:focus { top: 1rem; }
:focus-visible { outline: 3px solid var(--emerald-light); outline-offset: 3px; }
.eyebrow { margin: 0 0 .8rem; color: var(--gold); font-size: .76rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.breadcrumbs { position: absolute; z-index: 8; top: 5.4rem; left: clamp(1.25rem, 6vw, 7rem); display: flex; flex-wrap: wrap; gap: .5rem; color: #92958f; font-size: .72rem; }
.breadcrumbs a, .book-breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs a:hover, .book-breadcrumbs a:hover { color: var(--cream); }

.site-header, .book-header { position: relative; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem clamp(1rem, 4vw, 4rem); border-bottom: 1px solid var(--line); background: rgba(17, 17, 17, .92); backdrop-filter: blur(14px); }
.site-header { position: sticky; top: 0; }
.brand { display: inline-flex; align-items: center; gap: .75rem; text-decoration: none; }
.brand-mark { display: grid; width: 2.35rem; height: 2.35rem; place-items: center; border-radius: .45rem; background: linear-gradient(145deg, var(--emerald), #064c29); color: #fff; font-weight: 900; box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); }
.brand strong, .brand small { display: block; }
.brand strong { font-size: .9rem; letter-spacing: .01em; }
.brand small { color: var(--muted); font-size: .68rem; }
.meet-button, .button, .book-toolbar button, .dialog-close { border: 1px solid transparent; border-radius: .35rem; cursor: pointer; font-weight: 800; }
.meet-button { padding: .7rem 1.2rem; background: var(--emerald); color: #fff; letter-spacing: .12em; }
.meet-button:hover { background: #159b52; }

.hero { position: relative; display: grid; grid-template-columns: minmax(0, .92fr) minmax(20rem, 1.08fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; min-height: calc(100vh - 72px); padding: clamp(4rem, 9vw, 8rem) clamp(1.25rem, 6vw, 7rem); overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: -20%; z-index: 0; background: radial-gradient(circle at 20% 25%, rgba(16,124,65,.25), transparent 30%), radial-gradient(circle at 80% 65%, rgba(196,28,28,.16), transparent 25%), linear-gradient(145deg, #111, #181a18 48%, #0c0d0c); }
.hero > * { position: relative; z-index: 1; }
.hero-copy h1 { margin: 0; max-width: 12ch; font-size: clamp(3.3rem, 7vw, 7.4rem); line-height: .88; letter-spacing: -.065em; text-wrap: balance; }
.hero-lede { max-width: 38rem; margin: 1.7rem 0 1rem; font-size: clamp(1.2rem, 2vw, 1.7rem); line-height: 1.25; }
.hero-sub { max-width: 42rem; color: var(--muted); font-size: 1rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.7rem; }
.button { display: inline-flex; min-height: 3.1rem; align-items: center; justify-content: center; padding: .8rem 1.35rem; text-decoration: none; }
.button.primary { background: var(--emerald); color: #fff; }
.button.primary:hover { background: #159b52; }
.button.secondary { border-color: var(--line); background: rgba(255,255,255,.04); color: var(--cream); }
.button.secondary:hover { border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.08); }
.microcopy { max-width: 42rem; margin-top: 1rem; color: #8d918b; font-size: .72rem; }

.preview-card { position: relative; display: block; color: inherit; text-decoration: none; perspective: 1500px; }
.preview-label, .preview-cta { display: block; color: var(--muted); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }
.preview-label { margin-bottom: .75rem; }
.preview-cta { margin-top: 1rem; color: var(--cream); font-weight: 800; }
.preview-window { position: relative; display: block; overflow: hidden; aspect-ratio: 16/9; border: 1px solid rgba(255,255,255,.2); border-radius: .55rem; background: #090909; box-shadow: var(--shadow); transform: rotateY(-7deg) rotateX(2deg); transition: transform .4s ease; }
.preview-card:hover .preview-window { transform: rotateY(-2deg) rotateX(0); }
.preview-window img { width: 100%; height: 100%; object-fit: cover; transition: opacity .28s ease; }
.preview-glare { position: absolute; inset: 0; background: linear-gradient(115deg, transparent 20%, rgba(255,255,255,.12) 46%, transparent 58%); transform: translateX(-120%); animation: preview-glare 5s ease-in-out infinite; }
@keyframes preview-glare { 0%, 25% { transform: translateX(-120%); } 55%, 100% { transform: translateX(120%); } }

.request-band { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem, 6vw, 6rem); padding: clamp(4rem, 7vw, 7rem) clamp(1.25rem, 8vw, 9rem); background: var(--cream); color: var(--obsidian); }
.request-band h2, .story-intro h2, .closing-cta h2 { margin: 0 0 1rem; font-size: clamp(2rem, 4vw, 4rem); line-height: 1; letter-spacing: -.045em; }
.request-band .eyebrow { color: var(--emerald); }
.lead-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.lead-form label { display: grid; gap: .35rem; font-size: .75rem; font-weight: 800; letter-spacing: .04em; }
.lead-form label:nth-of-type(3), .lead-form .consent, .lead-form .submit-button, .lead-form .form-status, .lead-reward { grid-column: 1/-1; }
.lead-form input, .lead-form select { width: 100%; min-height: 3.1rem; border: 1px solid #c7c3b8; border-radius: .3rem; background: #fff; color: #111; padding: .7rem .8rem; }
.lead-form .consent { display: flex; align-items: flex-start; gap: .55rem; font-weight: 500; letter-spacing: 0; }
.lead-form .consent input { width: 1.1rem; min-height: 1.1rem; margin-top: .15rem; }
.lead-form .trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-status { min-height: 1.4rem; margin: 0; font-size: .84rem; }
.lead-reward { display: flex; flex-wrap: wrap; gap: .75rem; }
.lead-reward[hidden] { display: none; }

.story-intro { max-width: 68rem; margin: 0 auto; padding: clamp(5rem, 10vw, 10rem) 1.25rem clamp(3rem, 6vw, 6rem); text-align: center; }
.story-intro p:last-child { color: var(--muted); }
.slide-story { display: grid; gap: 1px; background: #333; }
.slide-section { display: grid; grid-template-columns: minmax(16rem, .55fr) minmax(0, 1.45fr); align-items: center; gap: clamp(2rem, 5vw, 5rem); min-height: 82vh; padding: clamp(3rem, 7vw, 7rem) clamp(1.25rem, 6vw, 7rem); background: linear-gradient(135deg, #191b19, #101110); }
.slide-section:nth-child(even) { grid-template-columns: minmax(0, 1.45fr) minmax(16rem, .55fr); }
.slide-section:nth-child(even) .slide-copy { order: 2; }
.slide-section.risk { background: radial-gradient(circle at 20% 20%, rgba(196,28,28,.13), transparent 38%), #121212; }
.slide-section img { width: 100%; border: 1px solid rgba(255,255,255,.18); border-radius: .35rem; box-shadow: var(--shadow); }
.slide-copy span { color: var(--emerald-light); font-size: .8rem; font-weight: 900; letter-spacing: .2em; }
.risk .slide-copy span { color: #ff5a52; }
.slide-copy h2 { margin: .75rem 0 .7rem; font-size: clamp(2rem, 3.8vw, 4.6rem); line-height: .96; letter-spacing: -.045em; }
.slide-copy p { color: var(--muted); font-size: 1rem; }
.final-slide .meet-button { margin-top: 1rem; }
.closing-cta { padding: clamp(5rem, 10vw, 10rem) 1.25rem; text-align: center; background: radial-gradient(circle at 50% 20%, rgba(16,124,65,.28), transparent 42%), #111; }
.closing-cta > p:not(.eyebrow) { max-width: 44rem; margin-inline: auto; color: var(--muted); }
.closing-cta .hero-actions { justify-content: center; }
.site-footer { padding: 2.5rem clamp(1.25rem, 6vw, 7rem); border-top: 1px solid var(--line); color: #92958f; font-size: .72rem; }
.site-footer p { max-width: 80rem; }

dialog { color: var(--cream); }
dialog::backdrop { background: rgba(0,0,0,.78); backdrop-filter: blur(6px); }
.meet-dialog, .thumbnail-dialog { width: min(92vw, 860px); max-height: 88vh; overflow: auto; border: 1px solid var(--line); border-radius: .6rem; background: #171917; box-shadow: var(--shadow); padding: 1.2rem; }
.meet-dialog { width: min(94vw, 920px); }
.dialog-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.dialog-head h2 { margin: 0; font-size: 1.7rem; }
.dialog-close { width: 2.5rem; height: 2.5rem; background: #272927; color: #fff; font-size: 1.5rem; }
.scheduler-shell { display: grid; min-height: min(62vh, 640px); place-items: center; margin-top: 1rem; overflow: hidden; border: 1px solid var(--line); border-radius: .35rem; background: #fff; color: #222; }
.scheduler-shell iframe { width: 100%; min-height: min(62vh, 640px); border: 0; }
.scheduler-fallback { text-align: center; font-size: .8rem; }

/* Flipbook */
.flipbook-page { display: grid; grid-template-rows: auto minmax(0,1fr) auto; height: 100dvh; overflow: hidden; background: radial-gradient(circle at 50% -10%, #263229, #111 48%); }
.back-link { color: var(--muted); font-size: .8rem; text-decoration: none; }
.book-breadcrumbs { display: flex; gap: .45rem; color: var(--muted); font-size: .74rem; }
.book-stage { position: relative; display: grid; min-height: 0; place-items: center; overflow: hidden; padding: 2.5rem 2rem; perspective: 2200px; }
.book-help { position: absolute; top: .5rem; margin: 0; color: #8c928c; font-size: .72rem; }
.book-viewport { width: min(86vw, calc((100dvh - 190px) * 1.7778)); aspect-ratio: 16/9; transform: scale(var(--book-zoom, 1)); transition: transform .22s ease; transform-origin: center; }
.book { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; filter: drop-shadow(0 35px 40px rgba(0,0,0,.5)); touch-action: none; user-select: none; }
.book::after { content: ""; position: absolute; z-index: 40; left: 0; top: 0; bottom: 0; width: 5%; pointer-events: none; background: linear-gradient(90deg, rgba(0,0,0,.5), rgba(0,0,0,.12), transparent); opacity: .5; }
.book-back, .book-leaf { position: absolute; inset: 0; border-radius: .35rem; background: #202420; }
.book-back { transform: translate3d(8px, 8px, -20px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); }
.book-leaf { transform-origin: left center; transform-style: preserve-3d; will-change: transform; }
.book-leaf.is-animating { transition-property: transform; transition-timing-function: cubic-bezier(.24,.7,.22,1); }
.book-face { position: absolute; inset: 0; overflow: hidden; border-radius: .35rem; backface-visibility: hidden; -webkit-backface-visibility: hidden; background: #171717; box-shadow: inset 0 0 0 1px rgba(255,255,255,.13); }
.book-face.back { transform: rotateY(180deg); background: linear-gradient(90deg, #151815, #242824); }
.book-face img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.fold-shadow { position: absolute; inset: 0; pointer-events: none; opacity: 0; background: linear-gradient(90deg, rgba(0,0,0,.5), rgba(0,0,0,.16) 9%, transparent 28%, rgba(255,255,255,.09) 75%, transparent); }
.book-toolbar { position: relative; z-index: 50; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .45rem; min-height: 68px; padding: .65rem 1rem calc(.65rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(12,12,12,.94); backdrop-filter: blur(12px); }
.book-toolbar button { min-height: 2.55rem; padding: .55rem .8rem; border-color: var(--line); background: #202320; color: var(--cream); }
.book-toolbar button:hover:not(:disabled) { background: #303430; }
.book-toolbar button:disabled { cursor: default; opacity: .35; }
.book-toolbar output { min-width: 6.5rem; color: var(--muted); text-align: center; font-size: .78rem; font-variant-numeric: tabular-nums; }
.book-toolbar #zoomIndicator { min-width: 3rem; }
.book-toolbar .meet-button { border-color: var(--emerald); background: var(--emerald); }
.toolbar-separator { width: 1px; height: 1.8rem; margin: 0 .25rem; background: var(--line); }
.thumbnail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: .9rem; margin-top: 1.2rem; }
.thumbnail-grid button { position: relative; border: 2px solid transparent; border-radius: .35rem; background: #222; padding: 0; cursor: pointer; overflow: hidden; }
.thumbnail-grid button:hover, .thumbnail-grid button[aria-current="page"] { border-color: var(--emerald-light); }
.thumbnail-grid img { aspect-ratio: 16/9; object-fit: cover; }
.thumbnail-grid span { display: block; padding: .45rem; color: var(--cream); font-size: .72rem; }
.noscript { position: fixed; z-index: 100; left: 1rem; right: 1rem; bottom: 5rem; padding: 1rem; background: var(--crimson); text-align: center; }

@media (max-width: 800px) {
  .hero, .request-band, .slide-section, .slide-section:nth-child(even) { grid-template-columns: 1fr; }
  .hero { min-height: auto; }
  .hero-copy h1 { font-size: clamp(3.3rem, 17vw, 5.3rem); }
  .preview-window { transform: none; }
  .slide-section { min-height: auto; }
  .slide-section:nth-child(even) .slide-copy { order: 0; }
  .slide-copy { text-align: center; }
  .lead-form { grid-template-columns: 1fr; }
  .lead-form label { grid-column: 1; }
  .book-stage { padding: 2rem .75rem; }
  .book-viewport { width: 94vw; }
  .book-toolbar button span, .toolbar-separator, #zoomIndicator { display: none; }
  .book-toolbar output { min-width: 5.3rem; }
}

@media (max-width: 480px) {
  .brand small { display: none; }
  .brand strong { font-size: .78rem; }
  .site-header, .book-header { padding: .75rem; }
  .site-header .meet-button { padding-inline: .75rem; }
  .book-toolbar { gap: .3rem; padding-inline: .4rem; }
  .book-toolbar button { padding-inline: .6rem; }
  .book-toolbar #zoomOut, .book-toolbar #zoomIn { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .preview-glare { display: none; }
}