/* Hallmark · macrostructure: Long Document (direct-response) · tone: loud, ClickFunnels-style · anchor hue: orange 38 / navy 265
 * theme: custom (vibe: "direct-response, yellow marker, navy slab, orange button") · nav: none (single-goal funnel) · footer: Ft1 minimal */
@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@700;800;900&family=Inter:wght@400;500;600;700&display=swap");
@import url("tokens.css");
*,*::before,*::after{box-sizing:border-box}
html,body{overflow-x:clip;margin:0}
body{background:var(--color-paper);color:var(--color-ink);font:400 var(--text-body)/1.6 var(--font-body);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-display);font-weight:900;line-height:1.05;letter-spacing:-0.02em;margin:0;overflow-wrap:anywhere;min-width:0;font-style:normal}
p{margin:0 0 var(--space-sm)}
.wrap{max-width:62rem;margin-inline:auto;padding-inline:var(--space-md)}
.narrow{max-width:42rem;margin-inline:auto;padding-inline:var(--space-md)}
section{padding-block:var(--space-xl)}
.bar{background:var(--color-navy);color:var(--color-on-navy);text-align:center;padding:0.7rem var(--space-sm);font-weight:700;font-size:1rem}
.bar b{color:var(--color-hilite)}
.hl{background:linear-gradient(transparent 12%,var(--color-hilite) 12%,var(--color-hilite) 92%,transparent 92%);padding-inline:0.12em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.red{color:var(--color-danger)}
/* hero */
.hero{padding-block:var(--space-xl);text-align:center}
.hero h1{font-size:var(--text-display-s);max-width:18ch;margin:0 auto var(--space-md);text-wrap:balance}
.hero .sub{font-size:var(--text-lg);max-width:36rem;margin:0 auto var(--space-lg);color:var(--color-ink-2);font-weight:500}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg);justify-items:center}
.btn{display:inline-block;background:var(--color-accent);color:#fff;font:800 clamp(.875rem,4.4vw,1.375rem)/1.2 var(--font-display);white-space:nowrap;text-align:center;text-decoration:none;padding:1.1rem clamp(.5rem,3vw,2.2rem);border-radius:var(--radius-md);box-shadow:0 6px 0 var(--color-accent-shadow);transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out),background var(--dur-fast);max-width:100%}
.btn:hover{background:var(--color-accent-hover);transform:translateY(2px);box-shadow:0 4px 0 var(--color-accent-shadow)}
.btn:active{transform:translateY(6px);box-shadow:0 0 0 var(--color-accent-shadow)}
.btn:focus-visible{outline:4px solid var(--color-ink);outline-offset:4px}
.btn small{display:block;font:500 0.9rem var(--font-body);opacity:.92;margin-top:.2rem}
.micro{font-size:.95rem;color:var(--color-ink-2);margin-top:var(--space-sm)}
/* job card */
.card{background:#fff;border:var(--rule-heavy);border-radius:var(--radius-md);box-shadow:10px 10px 0 var(--color-navy);width:100%;max-width:34rem;text-align:left;transform:rotate(-1.2deg)}
.card header{background:var(--color-navy);color:var(--color-on-navy);padding:.8rem 1.1rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.2rem 1rem;font:800 1.05rem var(--font-display);border-radius:calc(var(--radius-md) - 4px) calc(var(--radius-md) - 4px) 0 0}
.card header span{color:var(--color-hilite);font-weight:700}
.card ol{list-style:none;margin:0;padding:0}
.card li{display:grid;grid-template-columns:2.2rem minmax(0,1fr);gap:.8rem;padding:.8rem 1.1rem;border-top:2px dashed var(--color-paper-2);font-size:1.02rem;line-height:1.4}
.card li:first-child{border-top:0}
.card li i{font:900 1.4rem var(--font-display);color:var(--color-accent);font-style:normal}
.card li b{display:block;font-family:var(--font-display);font-weight:800}
.card li em{color:var(--color-ink-2);font-style:normal}
/* text sections */
.lead p{font-size:1.3rem}
.lead .punch{font-family:var(--font-display);font-weight:900;font-size:var(--text-xl);line-height:1.15;margin-top:var(--space-md)}
.slab{background:var(--color-navy);color:var(--color-on-navy)}
.slab h2{font-size:var(--text-2xl);margin-bottom:var(--space-md)}
.slab .hl{color:var(--color-ink)}
.slab p{font-size:1.25rem}
h2.big{font-size:var(--text-2xl);margin-bottom:var(--space-md);text-wrap:balance}
/* problem -> line rows */
.rows{display:grid;gap:var(--space-sm);margin-top:var(--space-lg)}
.row{display:grid;grid-template-columns:3.5rem minmax(0,1fr);gap:var(--space-sm);align-items:start;background:#fff;border:var(--rule-heavy);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md)}
.row .n{font:900 2.4rem/1 var(--font-display);color:var(--color-accent)}
.row h3{font-size:1.45rem;margin-bottom:.25rem}
.row p{margin:0;color:var(--color-ink-2)}
.row p strong{color:var(--color-ink)}
/* steps */
.steps{display:grid;gap:var(--space-md);margin-top:var(--space-lg)}
.step{background:#fff;border:var(--rule-heavy);border-radius:var(--radius-md);overflow:hidden}
.step h3{background:var(--color-hilite);padding:.8rem var(--space-md);font-size:1.5rem;border-bottom:var(--rule-heavy)}
.step p{padding:var(--space-sm) var(--space-md) 0;margin:0}
.step p:last-child{padding-bottom:var(--space-md)}
.arrow{text-align:center;font:900 2.4rem/1 var(--font-display);color:var(--color-accent);margin:.2rem 0}
.cta-block{text-align:center;margin-top:var(--space-lg)}
.final{background:var(--color-paper-2);text-align:center}
.final h2{font-size:var(--text-2xl);margin-bottom:var(--space-md);text-wrap:balance}
/* placeholders: deliberately loud so they cannot ship unnoticed */
.todo{border:3px dashed var(--color-danger);background:#fff;border-radius:var(--radius-md);padding:var(--space-md);margin:var(--space-lg) 0;text-align:left}
.todo strong{color:var(--color-danger);font-family:var(--font-display);text-transform:uppercase;letter-spacing:.04em;font-size:.95rem}
footer{padding:var(--space-lg) var(--space-md);text-align:center;font-size:.9rem;color:var(--color-ink-2)}
footer a,.bar a{color:inherit}
@media (min-width:56rem){
  .hero{text-align:left}
  .hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;justify-items:start}
  .hero h1{margin-inline:0;max-width:none;font-size:clamp(2.25rem,4.1vw,3.5rem)}
  .hero .sub{margin-inline:0}
}
@media (prefers-reduced-motion:reduce){.btn{transition:none}}

/* full-page additions */
ul.x,ul.xx,ul.ck{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
ul.x li,ul.xx li,ul.ck li{position:relative;padding-left:2.1rem}
ul.x li::before,ul.xx li::before{content:"✕";position:absolute;left:0;top:0;color:var(--color-danger);font:900 1.25rem/1.4 var(--font-display)}
ul.ck li::before{content:"✓";position:absolute;left:0;top:0;color:var(--color-accent);font:900 1.3rem/1.4 var(--font-display)}
ul.x b{font-family:var(--font-display)}
.step ul.ck{padding:var(--space-sm) var(--space-md) var(--space-md)}
.bundle{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md)}
.tile{background:var(--color-paper);color:var(--color-ink);border:var(--rule-heavy);border-radius:var(--radius-md);padding:var(--space-md);box-shadow:6px 6px 0 var(--color-hilite)}
.tile b{display:inline-block;font:900 2.6rem/1 var(--font-display);color:var(--color-accent)}
.tile h3{font-size:1.4rem;margin:.3rem 0 .4rem}
.tile p{margin:0;font-size:1.05rem;color:var(--color-ink-2)}
.fit{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md);margin-top:var(--space-lg)}
.fit>div{background:#fff;border:var(--rule-heavy);border-radius:var(--radius-md);padding:var(--space-md)}
.fit h3{font-size:1.4rem;margin-bottom:var(--space-sm)}
.order{background:#fff;border:var(--rule-heavy);border-radius:var(--radius-md);box-shadow:10px 10px 0 var(--color-navy);padding:var(--space-lg) clamp(.75rem,4vw,1.5rem);text-align:center}
.order ul.ck{text-align:left;margin-bottom:var(--space-md)}
.price{font:900 3.4rem/1 var(--font-display);margin:var(--space-md) 0}
.price span{display:block;font:700 .95rem var(--font-body);text-transform:uppercase;letter-spacing:.06em;color:var(--color-ink-2);margin-bottom:.3rem}
.guar{background:#fff;border:var(--rule-heavy);border-radius:var(--radius-md);padding:var(--space-lg) var(--space-md);text-align:center}
.guar h2{font-size:var(--text-xl);margin-bottom:var(--space-sm)}
details{background:#fff;border:var(--rule-heavy);border-radius:var(--radius-md);margin-bottom:var(--space-sm)}
summary{cursor:pointer;padding:var(--space-sm) var(--space-md);font:800 1.15rem/1.3 var(--font-display);list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";float:right;color:var(--color-accent);font-size:1.5rem;line-height:1}
details[open] summary::after{content:"−"}
summary:focus-visible{outline:4px solid var(--color-ink);outline-offset:2px}
details p{padding:0 var(--space-md) var(--space-sm);margin:0;color:var(--color-ink-2)}
.ps{margin-top:var(--space-lg);text-align:left;font-size:1.1rem}
.ps a{color:var(--color-accent);font-weight:700}
@media (min-width:56rem){
  .bundle{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fit{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* real job card, example conversation, example map, eight-day numbers */
figure{margin:0}
figcaption{font-size:.95rem;color:var(--color-ink-2);margin-top:var(--space-sm)}
.badge{display:inline-block;background:var(--color-hilite);color:var(--color-ink);border:var(--rule-field);border-radius:var(--radius-sm);padding:.25rem .6rem;font:800 .8rem/1.3 var(--font-display);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--space-sm)}
.card.flat{transform:none;max-width:none}
.card li em strong{color:var(--color-ink)}
section>.narrow>.card{margin:var(--space-md) 0 var(--space-lg)}
.chat{background:var(--color-paper);color:var(--color-ink);border:var(--rule-heavy);border-radius:var(--radius-md);box-shadow:6px 6px 0 var(--color-hilite);padding:var(--space-md);max-width:40rem;margin:var(--space-lg) auto 0;display:grid;justify-items:start;gap:.7rem}
.chat .badge{margin:0}
.chat .msg{margin:0;max-width:88%;font-size:1.02rem;line-height:1.45;background:var(--color-paper-2);border-radius:var(--radius-md);padding:.6rem .9rem}
.chat .msg b{display:block;font:800 .8rem/1.4 var(--font-display);text-transform:uppercase;letter-spacing:.06em}
.chat .msg.you{justify-self:end;background:var(--color-navy);color:var(--color-on-navy)}
.chat .card{box-shadow:none}
.chat figcaption{margin:0}
.map{background:var(--color-surface);border:var(--rule-heavy);border-radius:var(--radius-md);padding:var(--space-md)}
.map-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:start;gap:.5rem 1rem}
.map-head h3{font-size:var(--text-xl)}
.map-head .badge{margin:0}
.map>p{margin:var(--space-sm) 0 var(--space-md);color:var(--color-ink-2)}
.map>p strong{color:var(--color-ink)}
.map-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-sm)}
.map-cols>div{border:var(--rule-heavy);border-radius:var(--radius-md);overflow:hidden}
.map h4{margin:0;padding:.6rem 1rem;font:900 1.2rem/1.2 var(--font-display);border-bottom:var(--rule-heavy);background:var(--color-paper-2)}
.map .first h4{background:var(--color-hilite)}
.map .yours h4{background:var(--color-navy);color:var(--color-on-navy)}
.map ul{list-style:none;margin:0;padding:0}
.map li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.6rem;padding:.7rem 1rem;border-top:2px dashed var(--color-paper-2);font-size:1.02rem;line-height:1.35}
.map li:first-child{border-top:0}
.map li small{display:block;font-size:.9rem;color:var(--color-ink-2)}
.map li b{font-family:var(--font-display);font-weight:800;white-space:nowrap}
.map .first li b{color:var(--color-accent)}
.days{background:var(--color-navy);color:var(--color-on-navy);border-radius:var(--radius-md);padding:var(--space-md) clamp(.75rem,4vw,1.5rem)}
.days .eyebrow{color:var(--color-hilite);font:800 .85rem/1.3 var(--font-display);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.4rem}
.days h3{font-size:1.6rem;line-height:1.15;margin-bottom:var(--space-sm)}
.days .legend{font-size:.95rem;line-height:1.4}
.days ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}
.days li{background:var(--color-navy-2);border-radius:var(--radius-sm);padding:.5rem .2rem;text-align:center;font-size:.9rem;line-height:1.3}
.days li b{display:block;font:800 1.05rem/1.3 var(--font-display);white-space:nowrap}
.days li i{font-style:normal;color:var(--color-hilite)}
.days+.micro{margin-bottom:0}
@media (min-width:40rem){.days ul{grid-template-columns:repeat(8,minmax(0,1fr))}}
@media (min-width:56rem){.map-cols{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* legal pages: terms, privacy, imprint */
.legal{padding-block:var(--space-xl)}
.legal h1{font-size:var(--text-2xl);text-wrap:balance}
.legal h2{font-size:1.5rem;margin:var(--space-lg) 0 var(--space-sm)}
.legal section{padding-block:0;scroll-margin-top:var(--space-md)}
.legal ul{margin:0 0 var(--space-sm);padding-left:1.4rem;display:grid;gap:.4rem}
.legal a{color:inherit;overflow-wrap:anywhere}
.legal .todo{margin:var(--space-sm) 0}
.legal .todo p{margin:.5rem 0 0;font-size:1rem}
.legal details{margin-top:var(--space-sm)}
