:root {
--ink:        #0E1B2E;
--ink-2:      #132339;
--ink-3:      #1B2F4A;
--paper:      #F6F2EA;
--paper-2:    #EEE8DC;
--bone:       #E4DCCC;

--clay:       #F05A00;   /* flaming orange */
--clay-deep:  #B84400;
--clay-soft:  #F5835A;

--lane:       #E8E2D4;   /* painted lane line color */
--chalk:      #FBFAF5;

--rule:       rgba(14, 27, 46, 0.14);
--rule-dark:  rgba(246, 242, 234, 0.14);
--mute:       rgba(14, 27, 46, 0.62);
--mute-dark:  rgba(246, 242, 234, 0.62);

--serif: 'Inter', sans-serif;
--sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
--mono:  'JetBrains Mono', ui-monospace, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
font-family: var(--sans);
background: var(--paper);
color: var(--ink);
line-height: 1.5;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
}

::selection { background: var(--clay); color: var(--paper); }

/* subtle paper grain on dark sections */
.grain::before {
content: '';
position: absolute; inset: 0;
background-image:
  radial-gradient(circle at 20% 30%, rgba(246,242,234,0.02) 0, transparent 50%),
  radial-gradient(circle at 80% 70%, rgba(200,68,27,0.025) 0, transparent 40%);
pointer-events: none;
z-index: 1;
}

/* ========== NAV ========== */
nav.topnav {
position: fixed; top: 0; left: 0; right: 0; z-index: 100;
padding: 18px 48px;
display: flex; align-items: center; justify-content: space-between;
background: rgba(246, 242, 234, 0.88);
backdrop-filter: blur(14px);
border-bottom: 1px solid var(--rule);
}
.logo {
font-family: var(--serif);
font-weight: 600;
font-size: 22px;
letter-spacing: -0.01em;
color: var(--ink);
text-decoration: none;
display: flex; align-items: center; gap: 12px;
}
.logo-mark {
display: inline-block;
width: 28px; height: 28px;
position: relative;
}
/* stopwatch-inspired mark */
.logo-mark svg { width: 100%; height: 100%; }
.nav-right { display: flex; align-items: center; gap: 32px; }
.nav-link {
font-family: var(--sans);
font-weight: 500;
font-size: 13px;
color: var(--ink);
text-decoration: none;
transition: color .2s ease;
}
.nav-link:hover { color: var(--clay); }
.nav-cta {
font-family: var(--sans);
font-weight: 600;
font-size: 13px;
padding: 10px 18px;
background: var(--ink);
color: var(--paper);
border-radius: 2px;
text-decoration: none;
transition: background .2s ease;
display: inline-flex; align-items: center; gap: 8px;
}
.nav-cta:hover { background: var(--clay); }

/* ========== HERO ========== */
.hero {
padding: 120px 48px;
position: relative;
overflow: hidden;
}
.hero-grid {
max-width: 1400px; margin: 0 auto;
display: grid; grid-template-columns: 1.1fr 1fr;
gap: 80px; align-items: center;
}
.page-header {
padding: 140px 48px 72px;
border-bottom: 1px solid var(--rule);
}
.page-header-inner {
max-width: 860px;
margin: 0 auto;
}
.eyebrow {
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--clay);
margin-bottom: 28px;
display: inline-flex; align-items: center; gap: 14px;
}
.eyebrow::before {
content: ''; width: 36px; height: 1px;
background: var(--clay);
}

h1.display {
font-family: var(--serif);
font-weight: 700;
font-size: clamp(40px, 5.5vw, 70px);
line-height: 0.98;
letter-spacing: -0.03em;
margin-bottom: 28px;
color: var(--ink);
}
h1.display em {
font-style: normal;
color: var(--clay);
font-weight: 800;
}
h1.page-title {
font-family: var(--serif);
font-weight: 700;
font-size: clamp(36px, 5vw, 60px);
line-height: 1;
letter-spacing: -0.03em;
color: var(--ink);
margin-bottom: 20px;
}
.page-meta {
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--mute);
}

.hero-sub {
font-size: 17px;
line-height: 1.55;
color: var(--ink);
margin-bottom: 40px;
max-width: 560px;
}
.hero-sub strong { font-weight: 600; }

.hero-ctas {
display: flex; align-items: center; gap: 20px;
margin-bottom: 52px;
flex-wrap: wrap;
}
.btn-primary {
background: var(--clay);
color: var(--paper);
font-family: var(--sans);
font-weight: 600;
font-size: 15px;
padding: 18px 32px;
border-radius: 2px;
text-decoration: none;
display: inline-flex; align-items: center; gap: 12px;
transition: all .25s ease;
letter-spacing: 0.01em;
}
.btn-primary:hover {
background: var(--clay-deep);
transform: translateX(2px);
}
.btn-primary .arrow {
transition: transform .25s ease;
}
.btn-primary:hover .arrow { transform: translateX(4px); }
.btn-secondary {
background: transparent;
color: var(--ink);
font-family: var(--sans);
font-weight: 500;
font-size: 14px;
padding: 12px 0;
text-decoration: none;
border-bottom: 1px solid var(--ink);
transition: all .25s ease;
}
.btn-secondary:hover { color: var(--clay); border-bottom-color: var(--clay); }

.hero-stats {
display: grid; grid-template-columns: repeat(3, 1fr);
gap: 32px;
padding-top: 36px;
border-top: 1px solid var(--rule);
max-width: 560px;
}
.stat-num {
font-family: var(--serif);
font-weight: 400;
font-size: 40px;
line-height: 1;
letter-spacing: -0.02em;
color: var(--ink);
margin-bottom: 6px;
}
.stat-num .accent { color: var(--clay); }
.stat-label {
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--mute);
line-height: 1.4;
}

/* Hero visual — stopwatch + timing transformation */
.hero-visual {
position: relative;
aspect-ratio: 1 / 1;
max-width: 580px;
justify-self: end;
width: 100%;
}
.hero-visual svg { width: 100%; height: 100%; }

/* ========== PROBLEM STRIP ========== */
.problem-strip {
background: var(--ink);
color: var(--paper);
padding: 120px 48px;
position: relative;
overflow: hidden;
}
.problem-strip::before {
content: ''; position: absolute;
top: 0; left: 0; right: 0; height: 1px;
background: linear-gradient(90deg, transparent, var(--clay), transparent);
}
.problem-inner { max-width: 1400px; margin: 0 auto; position: relative; z-index: 2; }
.section-label {
font-family: var(--mono);
font-size: 12px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--clay);
margin-bottom: 32px;
display: inline-flex; align-items: center; gap: 14px;
}
.section-label::before {
content: ''; width: 36px; height: 1px;
background: var(--clay);
}
.section-label.light { color: var(--clay); }

h2.section-h {
font-family: var(--serif);
font-weight: 700;
font-size: clamp(32px, 4.2vw, 56px);
line-height: 1.02;
letter-spacing: -0.025em;
margin-bottom: 40px;
max-width: 980px;
}
h2.section-h em {
font-style: normal;
color: var(--clay);
font-weight: 800;
}

.problem-stat {
font-family: var(--serif);
font-size: clamp(80px, 12vw, 180px);
font-weight: 400;
letter-spacing: -0.045em;
line-height: 0.9;
color: var(--paper);
margin: 48px 0 20px;
}
.problem-stat .accent { color: var(--clay); font-style: italic; }
.problem-caption {
font-size: 17px;
color: var(--mute-dark);
max-width: 620px;
line-height: 1.6;
margin-top: 40px;
}
.problem-caption strong { color: var(--paper); font-weight: 600; }

.pull-quote {
margin-top: 56px;
padding: 32px 36px;
border-left: 2px solid var(--clay);
background: rgba(255,255,255,0.03);
max-width: 720px;
}
.pull-quote .cite-label {
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--clay);
margin-bottom: 14px;
}
.pull-quote p {
font-family: var(--serif);
font-style: italic;
font-size: 21px;
line-height: 1.45;
color: var(--paper);
font-weight: 400;
}

/* ========== THE GAP / WHAT WE DO ========== */
.gap-section {
padding: 120px 48px;
background: var(--paper);
}
.gap-inner { max-width: 1400px; margin: 0 auto; }
.gap-grid {
display: grid; grid-template-columns: 1fr 1fr;
gap: 80px;
margin-top: 48px;
align-items: start;
}
.gap-col h3 {
font-family: var(--serif);
font-weight: 400;
font-size: 26px;
letter-spacing: -0.01em;
margin-bottom: 18px;
}
.gap-col:not(.ours) h3 {
padding-top: 42px;
}
.gap-col h3 .tag {
display: none;
}
.col-tag {
display: inline-block;
font-family: var(--mono);
font-size: 10px;
font-weight: 600;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--ink);
margin-top: 6px;
margin-bottom: 22px;
padding: 4px 10px;
border: 1px solid var(--ink);
border-radius: 2px;
}
.ours-tag {
color: var(--clay);
border-color: var(--clay);
}
.gap-col p {
font-size: 16px;
line-height: 1.6;
color: var(--ink);
margin-bottom: 14px;
}
.gap-col.ours {
padding: 40px;
background: var(--ink);
color: var(--paper);
border-radius: 2px;
position: relative;
}
.gap-col.ours h3 { color: var(--chalk); }
.gap-col.ours p { color: var(--mute-dark); }
.gap-col.ours p strong { color: var(--paper); font-weight: 600; }
.gap-col.ours::before {
content: ''; position: absolute;
top: 0; left: 0; right: 0; height: 2px;
background: var(--clay);
}

/* ========== PROJECTION BLOCK (the money shot) ========== */
.projection-section {
padding: 120px 48px;
background: var(--ink);
color: var(--paper);
position: relative;
overflow: hidden;
}
.projection-bg-text {
position: absolute;
top: 50%; left: -5%;
transform: translateY(-50%);
font-family: var(--serif);
font-size: 28vw;
font-weight: 400;
line-height: 1;
color: var(--paper);
opacity: 0.025;
letter-spacing: -0.06em;
pointer-events: none;
user-select: none;
white-space: nowrap;
}
.projection-inner {
max-width: 1400px; margin: 0 auto;
position: relative; z-index: 2;
}
.projection-grid {
display: grid; grid-template-columns: 1fr 1.3fr;
gap: 80px; align-items: center;
margin-top: 48px;
}
.projection-copy h2 { color: var(--paper); max-width: 560px; margin-bottom: 28px; }
.projection-copy p.lead {
font-size: 17px;
color: var(--mute-dark);
line-height: 1.65;
margin-bottom: 30px;
max-width: 520px;
}
.projection-copy p.lead strong { color: var(--paper); font-weight: 600; }
.projection-visual {
position: relative;
padding: 48px;
background: rgba(255,255,255,0.03);
border: 1px solid var(--rule-dark);
}
.projection-visual::before {
content: 'HS MALE ATHLETE · 800M PROJECTION';
position: absolute;
top: -9px; left: 24px;
background: var(--ink);
padding: 0 12px;
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.22em;
color: var(--clay);
}
.time-row {
display: flex; align-items: center; justify-content: space-between;
padding: 24px 0;
border-bottom: 1px solid var(--rule-dark);
}
.time-row:last-child { border-bottom: none; }
.time-label {
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--mute-dark);
}
.time-value {
font-family: var(--serif);
font-weight: 400;
font-size: clamp(38px, 5vw, 56px);
letter-spacing: -0.02em;
line-height: 1;
color: var(--paper);
font-variant-numeric: tabular-nums;
}
.time-value.proj { color: var(--clay); font-style: normal; }
.time-delta {
display: inline-block;
font-family: var(--mono);
font-size: 13px;
color: var(--clay);
margin-left: 16px;
letter-spacing: 0.05em;
}

/* ========== HOW IT WORKS ========== */
.how-section {
padding: 120px 48px;
background: var(--paper);
}
.how-inner { max-width: 1400px; margin: 0 auto; }
.how-steps {
display: grid; grid-template-columns: repeat(3, 1fr);
gap: 56px;
margin-top: 48px;
counter-reset: step;
}
.how-step {
position: relative;
counter-increment: step;
padding-top: 28px;
border-top: 2px solid var(--ink);
}
.how-step::before {
content: counter(step, decimal-leading-zero);
position: absolute;
top: -14px; left: 0;
background: var(--paper);
padding-right: 16px;
font-family: var(--mono);
font-size: 14px;
font-weight: 600;
color: var(--clay);
letter-spacing: 0.08em;
}
.how-step h3 {
font-family: var(--serif);
font-weight: 400;
font-size: 28px;
line-height: 1.1;
letter-spacing: -0.015em;
margin-bottom: 18px;
margin-top: 8px;
}
.how-step p {
font-size: 15px;
line-height: 1.6;
color: var(--mute);
}
.how-step p strong { color: var(--ink); font-weight: 600; }

/* ========== SAMPLE REPORTS ========== */
.samples-section {
padding: 120px 48px;
background: var(--paper-2);
position: relative;
}
.samples-inner { max-width: 1400px; margin: 0 auto; }
.samples-grid {
display: grid; grid-template-columns: 1fr 1fr;
gap: 32px;
margin-top: 48px;
}
.sample-card {
background: var(--chalk);
padding: 40px;
position: relative;
border: 1px solid var(--rule);
transition: all .3s ease;
}
.sample-card:hover {
border-color: var(--clay);
transform: translateY(-3px);
box-shadow: 0 20px 40px -20px rgba(14,27,46,0.15);
}
.sample-lane {
position: absolute;
top: 0; left: 0;
width: 4px; height: 100%;
background: var(--clay);
}
.sample-meta {
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--mute);
margin-bottom: 14px;
}
.sample-card h3 {
font-family: var(--serif);
font-weight: 400;
font-size: 36px;
letter-spacing: -0.02em;
margin-bottom: 12px;
}
.sample-event {
font-family: var(--sans);
font-size: 14px;
font-weight: 500;
color: var(--clay);
margin-bottom: 24px;
letter-spacing: 0.02em;
}
.sample-card p {
font-size: 15px;
line-height: 1.6;
color: var(--ink);
margin-bottom: 24px;
}
.sample-stats {
display: flex; gap: 32px;
padding: 20px 0;
margin-bottom: 24px;
border-top: 1px solid var(--rule);
border-bottom: 1px solid var(--rule);
}
.sample-stat-label {
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--mute);
margin-bottom: 4px;
}
.sample-stat-value {
font-family: var(--serif);
font-size: 22px;
font-weight: 400;
color: var(--ink);
letter-spacing: -0.01em;
}
.sample-cta {
font-family: var(--sans);
font-weight: 600;
font-size: 14px;
color: var(--ink);
text-decoration: none;
display: inline-flex; align-items: center; gap: 10px;
padding-bottom: 4px;
border-bottom: 1px solid var(--ink);
transition: all .2s ease;
}
.sample-cta:hover { color: var(--clay); border-bottom-color: var(--clay); gap: 14px; }

.samples-lead {
font-size: 17px;
line-height: 1.6;
color: var(--ink);
max-width: 720px;
margin-top: 0;
margin-bottom: 40px;
}
.sample-sections {
margin-top: 4px;
padding-top: 20px;
border-top: 1px solid var(--rule);
}
.sample-sections-label {
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--clay);
margin-bottom: 14px;
}
.sample-section-list {
display: flex; flex-wrap: wrap; gap: 8px;
}
.sample-section-list span {
font-family: var(--sans);
font-size: 12px;
font-weight: 500;
color: var(--ink);
padding: 6px 12px;
background: var(--paper);
border: 1px solid var(--rule);
border-radius: 2px;
line-height: 1.2;
}
.samples-note {
margin-top: 48px;
text-align: center;
font-family: var(--sans);
font-size: 14px;
color: var(--mute);
font-style: italic;
}
.samples-note a {
color: var(--clay);
font-weight: 600;
text-decoration: none;
font-style: normal;
border-bottom: 1px solid var(--clay);
padding-bottom: 1px;
}
.samples-note a:hover { color: var(--clay-deep); border-bottom-color: var(--clay-deep); }

/* ========== WHAT'S IN THE REPORT ========== */
.contents-section {
padding: 120px 48px;
background: var(--paper);
}
.contents-inner { max-width: 1400px; margin: 0 auto; }
.contents-grid {
display: grid; grid-template-columns: 1fr 1fr;
gap: 48px;
margin-top: 48px;
}
.contents-col h3 {
font-family: var(--serif);
font-weight: 500;
font-size: 23px;
margin-bottom: 8px;
display: flex; align-items: center; gap: 14px;
}
.contents-col h3 .part-num {
font-family: var(--mono);
font-size: 10px;
font-weight: 600;
letter-spacing: 0.14em;
color: var(--clay);
padding: 4px 10px;
border: 1px solid var(--clay);
border-radius: 2px;
text-transform: uppercase;
}
.contents-col .part-sub {
font-family: var(--sans);
font-size: 14px;
color: var(--mute);
margin-bottom: 28px;
font-style: italic;
}
.contents-list { list-style: none; }
.contents-list li {
display: flex; gap: 20px;
padding: 20px 0;
border-top: 1px solid var(--rule);
}
.contents-list li:last-child { border-bottom: 1px solid var(--rule); }
.contents-list .num {
font-family: var(--mono);
font-size: 12px;
font-weight: 600;
color: var(--clay);
flex-shrink: 0;
padding-top: 2px;
letter-spacing: 0.05em;
}
.contents-list .body strong {
display: block;
font-family: var(--serif);
font-weight: 500;
font-size: 17px;
color: var(--ink);
margin-bottom: 4px;
}
.contents-list .body p {
font-size: 14px;
color: var(--mute);
line-height: 1.55;
}

/* ========== PRICING ========== */
.pricing-section {
padding: 120px 48px;
background: var(--ink);
color: var(--paper);
position: relative;
overflow: hidden;
}
.pricing-inner {
max-width: 1400px; margin: 0 auto;
position: relative; z-index: 2;
}
.pricing-header { text-align: center; margin-bottom: 40px; }
.pricing-header h2 { color: var(--paper); margin: 0 auto 20px; }
.pricing-header p {
font-size: 17px;
color: var(--mute-dark);
max-width: 600px;
margin: 0 auto;
line-height: 1.6;
}
.price-card {
max-width: 580px;
margin: 0 auto;
background: rgba(255,255,255,0.04);
border: 1px solid var(--rule-dark);
padding: 56px 56px 48px;
position: relative;
}
.price-card::before {
content: ''; position: absolute;
top: 0; left: 0; right: 0; height: 2px;
background: var(--clay);
}
.price-eyebrow {
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--clay);
margin-bottom: 20px;
text-align: center;
}
.price-big {
font-family: var(--serif);
font-size: 120px;
font-weight: 400;
line-height: 1;
letter-spacing: -0.045em;
color: var(--paper);
text-align: center;
margin-bottom: 10px;
}
.price-big .dollar {
font-size: 48px;
font-weight: 400;
vertical-align: top;
margin-right: 6px;
color: var(--clay);
font-style: italic;
}
.price-sub {
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--mute-dark);
text-align: center;
margin-bottom: 40px;
}
.price-list {
list-style: none;
margin: 0 0 40px;
padding: 32px 0;
border-top: 1px solid var(--rule-dark);
border-bottom: 1px solid var(--rule-dark);
}
.price-list li {
display: flex; gap: 16px;
padding: 10px 0;
font-size: 15px;
color: var(--paper);
line-height: 1.5;
}
.price-list li::before {
content: '→';
color: var(--clay);
flex-shrink: 0;
font-family: var(--mono);
font-weight: 500;
}
button {
border: 0;
width: 100%;
cursor:pointer;
}
button.price-cta {
display: block;
text-align: center;
padding: 20px;
background: var(--clay);
color: var(--paper);
font-family: var(--sans);
font-weight: 600;
font-size: 15px;
letter-spacing: 0.02em;
text-decoration: none;
transition: background .25s ease;
}
button.price-cta:hover { 
background: var(--clay-deep); 
cursor;pointer;
}

.price-guarantee {
max-width: 580px;
margin: 32px auto 0;
text-align: center;
font-family: var(--sans);
font-size: 13px;
color: var(--mute-dark);
line-height: 1.6;
}
.price-guarantee strong { color: var(--paper); font-weight: 600; }

/* ========== FOUNDERS ========== */
.founders-section {
padding: 120px 48px;
background: var(--paper);
}
.founders-inner { max-width: 1100px; margin: 0 auto; }
.founders-intro {
font-family: var(--serif);
font-weight: 400;
font-size: 23px;
line-height: 1.45;
color: var(--ink);
max-width: 820px;
margin-bottom: 40px;
letter-spacing: -0.01em;
}
.founders-intro em { font-style: italic; color: var(--clay); }
.founders-grid {
display: grid; grid-template-columns: 1fr 1fr;
gap: 48px;
margin-bottom: 48px;
}
.founder {
padding-top: 28px;
border-top: 2px solid var(--ink);
position: relative;
}
.founder::before {
content: '';
position: absolute;
top: -2px; left: 0;
width: 40px; height: 2px;
background: var(--clay);
}
.founder h3 {
font-family: var(--serif);
font-weight: 500;
font-size: 28px;
letter-spacing: -0.01em;
margin-bottom: 4px;
}
.founder-role {
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--clay);
margin-bottom: 18px;
}
.founder p {
font-size: 15px;
line-height: 1.65;
color: var(--ink);
}
.founders-closer {
padding-top: 36px;
border-top: 1px solid var(--rule);
font-family: var(--serif);
font-style: italic;
font-size: 17px;
color: var(--ink);
max-width: 680px;
}

/* ========== FAQ ========== */
.faq-section {
padding: 120px 48px;
background: var(--paper-2);
}
.faq-inner { max-width: 1100px; margin: 0 auto; }
.faq-list { margin-top: 48px; }
.faq-item {
border-top: 1px solid var(--rule);
padding: 32px 0;
}
.faq-item:last-child { border-bottom: 1px solid var(--rule); }
.faq-q {
font-family: var(--serif);
font-weight: 500;
font-size: 22px;
line-height: 1.3;
letter-spacing: -0.01em;
margin-bottom: 14px;
color: var(--ink);
}
.faq-a {
font-size: 15px;
line-height: 1.65;
color: var(--ink);
max-width: 860px;
}
.faq-a strong { font-weight: 600; }

/* ========== CLOSING CTA ========== */
.closing {
padding: 120px 48px;
background: var(--ink);
color: var(--paper);
text-align: center;
position: relative;
overflow: hidden;
}
.closing-inner { max-width: 900px; margin: 0 auto; position: relative; z-index: 2; }
.closing h2 {
font-family: var(--serif);
font-weight: 700;
font-size: clamp(40px, 6vw, 72px);
line-height: 1.02;
letter-spacing: -0.03em;
color: var(--paper);
margin-bottom: 40px;
}
.closing h2 em { font-style: normal; color: var(--clay); font-weight: 800; }
.closing .btn-primary { font-size: 16px; padding: 22px 40px; }
.closing-sub {
margin-top: 28px;
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--mute-dark);
}

/* ========== POLICY BODY ========== */
.policy-body {
padding: 72px 48px 100px;
}
.policy-inner {
max-width: 860px;
margin: 0 auto;
}

/* Intro summary block */
.policy-summary {
padding: 32px 36px;
border-left: 2px solid var(--clay);
background: var(--paper-2);
margin-bottom: 64px;
}
.policy-summary p {
font-size: 16px;
line-height: 1.65;
color: var(--ink);
}
.policy-summary strong { font-weight: 600; }

/* Section */
.policy-section {
margin-bottom: 56px;
padding-bottom: 56px;
border-bottom: 1px solid var(--rule);
}
.policy-section:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}

.section-num {
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--clay);
margin-bottom: 12px;
display: inline-flex; align-items: center; gap: 10px;
}
.section-num::before {
content: ''; width: 24px; height: 1px;
background: var(--clay);
}

h2.section-title {
font-family: var(--serif);
font-weight: 600;
font-size: 24px;
letter-spacing: -0.015em;
color: var(--ink);
margin-bottom: 20px;
line-height: 1.2;
}

h3.subsection-title {
font-family: var(--serif);
font-weight: 500;
font-size: 16px;
letter-spacing: -0.01em;
color: var(--ink);
margin: 28px 0 12px;
}

.policy-section p {
font-size: 15px;
line-height: 1.7;
color: var(--ink);
margin-bottom: 16px;
}
.policy-section p:last-child { margin-bottom: 0; }

.policy-section ul,
.policy-section ol {
margin: 12px 0 16px 0;
padding-left: 0;
list-style: none;
}
.policy-section ul li,
.policy-section ol li {
font-size: 15px;
line-height: 1.65;
color: var(--ink);
padding: 8px 0 8px 24px;
position: relative;
border-bottom: 1px solid var(--rule);
}
.policy-section ul li:first-child,
.policy-section ol li:first-child { border-top: 1px solid var(--rule); }

.policy-section ul li::before {
content: '→';
font-family: var(--mono);
font-size: 12px;
color: var(--clay);
position: absolute;
left: 0;
top: 9px;
}
.policy-section ol {
counter-reset: ol-counter;
}
.policy-section ol li {
counter-increment: ol-counter;
}
.policy-section ol li::before {
content: counter(ol-counter, lower-alpha) '.';
font-family: var(--mono);
font-size: 11px;
color: var(--clay);
position: absolute;
left: 0;
top: 9px;
letter-spacing: 0.04em;
}

/* Contact callout */
.contact-callout {
margin-top: 28px;
padding: 24px 28px;
background: var(--ink);
color: var(--paper);
display: inline-flex; align-items: center; gap: 20px;
flex-wrap: wrap;
}
.contact-callout span {
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--mute-dark);
}
.contact-callout a {
font-family: var(--sans);
font-weight: 600;
font-size: 14px;
color: var(--clay);
text-decoration: none;
transition: color .2s ease;
}
.contact-callout a:hover { color: var(--clay-soft); }

/* ========== FOOTER ========== */
footer {
background: var(--ink-2);
color: var(--mute-dark);
padding: 48px;
border-top: 1px solid var(--rule-dark);
}
.footer-inner {
max-width: 1400px; margin: 0 auto;
display: flex; justify-content: space-between; align-items: center;
flex-wrap: wrap; gap: 24px;
}
.footer-brand {
font-family: var(--serif);
font-size: 17px;
color: var(--paper);
font-weight: 500;
}
.footer-tagline {
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--mute-dark);
margin-top: 4px;
}
.footer-right {
display: flex; gap: 24px;
font-family: var(--sans);
font-size: 13px;
}
.footer-right a {
color: var(--mute-dark);
text-decoration: none;
transition: color .2s ease;
}
.footer-right a:hover { color: var(--clay); }

/* ========== FADE IN ANIMATIONS ========== */
.fade-in { animation: fadeUp 0.8s ease both; animation-delay: 0.1s; opacity: 0; }
.fade-in-2 { animation: fadeUp 0.8s ease both; animation-delay: 0.25s; opacity: 0; }
.fade-in-3 { animation: fadeUp 0.8s ease both; animation-delay: 0.4s; opacity: 0; }
.fade-in-4 { animation: fadeUp 0.8s ease both; animation-delay: 0.55s; opacity: 0; }
@keyframes fadeUp {
from { opacity: 0; transform: translateY(24px); }
to { opacity: 1; transform: translateY(0); }
}

/* reveal on scroll */
.reveal { opacity: 0; transform: translateY(28px); transition: all 0.9s cubic-bezier(0.2, 0.7, 0.2, 1); }
.reveal.in { opacity: 1; transform: translateY(0); }

/* stopwatch animation */
@keyframes sweep {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
.sweep-hand {
transform-origin: center;
animation: sweep 6s linear infinite;
}

/* ========== RESPONSIVE ========== */
@media (max-width: 1000px) {
.hero-grid,
.gap-grid,
.projection-grid,
.how-steps,
.samples-grid,
.contents-grid,
.founders-grid {
  grid-template-columns: 1fr;
  gap: 48px;
}
.hero-visual { justify-self: center; max-width: 460px; }
.hero { padding: 100px 24px 80px; }
nav.topnav { padding: 16px 24px; }
.problem-strip, .gap-section, .projection-section, .how-section,
.samples-section, .contents-section, .pricing-section, .founders-section,
.faq-section, .closing, footer { padding-left: 24px; padding-right: 24px; }
}
@media (max-width: 768px) {
nav.topnav { padding: 16px 24px; }
.nav-right { gap: 16px; }
.nav-link { display: none; }
.page-header { padding: 120px 24px 56px; }
.policy-body { padding: 48px 24px 72px; }
footer { padding: 40px 24px; }
.footer-inner { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 640px) {
.hero-stats { grid-template-columns: 1fr 1fr; gap: 24px; }
.nav-right .nav-link { display: none; }
.nav-right { gap: 12px; }
.sample-stats { flex-wrap: wrap; gap: 16px 24px; }
.price-big { font-size: 88px; }
.price-card { padding: 40px 28px 32px; }
}
