/* Blue text and surfaces; green actions and emphasis from the preschool card. */
:root{
  --ink:#20384b;
  --accent:#47735e;
  --accent-hover:#385f4c;
  --highlight:#3d705b;
  --muted:#526575;
  --marker:#c1dfc8;
  --line:#d9e3e9;
  --tint:#edf4f8;
  --surface:#f7fafc;
  --control-line:#adc8b6;
  --control-surface:#e4efe7;
  --control-hover:#d4e6d9;
  --input-line:#a7bdcc;
  --section-space:clamp(36px,4.2vw,54px);
}
.hero{gap:52px;padding-block:40px 44px}
.hero h1{max-width:14ch;font-size:clamp(42px,5vw,64px);line-height:1.08;letter-spacing:-.035em}
.hero h1>span{white-space:normal}
.hero-lead{max-width:41ch}
.hero .card-deck{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;height:auto;max-width:510px;margin:0 auto 22px;align-items:start}
.hero .deck-card{position:static;display:block;width:100%;max-width:none;padding:0;border:0;background:transparent;transform:none;filter:none;border-radius:8px;box-shadow:0 2px 5px #20384b20;transition:transform 160ms var(--ease-out)}
.hero .deck-card img{width:100%;height:auto;border-radius:8px}
.crisis-deck figcaption{font-size:12px;line-height:1.4;text-align:center;font-weight:700;color:var(--ink);margin-top:16px}
.hero .art-caption{font-size:11px;line-height:1.5;max-width:42ch;margin-inline:auto}
.hero .emotion-tags{margin-top:16px;gap:8px}
.hero .emotion-tags span{font-size:11px;color:var(--accent);background:var(--tint)}
.button{border-radius:10px}
.button:disabled{background:#e3ebf0;color:var(--muted)}
dialog::backdrop{background:#18384d80}
.source-proof{display:flex;justify-content:space-between;align-items:center;gap:32px;padding-block:22px;border-block:1px solid var(--line);font-size:14px;color:var(--muted)}
.source-proof strong{color:var(--accent)}
.source-proof a{font-size:12px;flex:none}
.crisis-situation{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);gap:56px;align-items:center}
.situation-spread{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.situation-spread figure{padding:0}
.situation-spread .situation-card{border-radius:8px}
.situation-spread .situation-card>img{border-radius:8px;box-shadow:0 2px 5px #20384b1c}
.situation-spread figcaption{margin-top:16px;text-align:center;color:var(--muted);font-size:11px;font-weight:600}
.situation-card>span,.sample-enlarge>span{display:grid;place-items:center;width:40px;height:40px;right:-8px;bottom:-8px;border:1px solid var(--line);color:var(--accent);background:white;border-radius:50%;font-size:22px;line-height:1}
.crisis-actions{margin-top:24px;gap:16px}
.crisis-actions li:before{display:none}
.crisis-actions>li{padding-left:0}
.crisis-actions strong{color:var(--highlight)}
.source-caption{margin-top:22px;font-size:11px}
.inside-copy>h3{margin:0 0 10px;font-size:22px}
.inside-copy>p{font-size:16px;line-height:1.7;color:var(--muted);margin-bottom:26px}
.inside-copy>p:last-child{margin-bottom:0}
.crisis-triggers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-self:center;align-items:start}
.crisis-triggers figure{display:grid;grid-template-rows:120px auto;justify-items:center;gap:20px;min-width:0}
.crisis-triggers img{width:120px;height:120px;object-fit:contain}
.crisis-triggers figcaption{font-size:13px;font-weight:700;line-height:1.5;text-align:center;color:var(--ink)}
.emotion-picker{flex-wrap:wrap;gap:10px;margin-bottom:32px}
.preview-layout{gap:64px}
.preview .sample-visual{min-width:0}
.preview .sample-copy>p:not(.section-label){max-width:44ch}
.preview .sample-copy>.button{margin-top:26px}
.preview .sample-copy>.micro{margin-top:14px}
.sample-enlarge{display:block;position:relative;margin-inline:auto;max-width:290px;border:0;padding:0;background:transparent;border-radius:8px}
.sample-enlarge>img{border-radius:8px}
.sample-enlarge>span{position:absolute}
.sample-controls{max-width:320px;margin:24px auto 0;display:flex;align-items:center;justify-content:space-between;gap:12px}
.sample-controls button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--control-line);border-radius:50%;font-size:22px;line-height:1;color:var(--accent);background:white;transition:background-color 160ms ease,transform 140ms var(--ease-out)}
.sample-controls button:disabled{opacity:.4}
.sample-controls span{font-size:12px;color:var(--muted)}
.crisis-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin:0}
.crisis-steps li{display:flex;gap:18px;align-items:start}
.crisis-steps li>span{font-size:31px;font-weight:800;line-height:1.15;color:var(--accent)}
.crisis-steps h3{font-size:20px;margin-bottom:14px}
.crisis-steps p{font-size:14px;color:var(--muted)}
.crisis-support{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 56px}
.crisis-support p{font-size:16px;color:var(--muted);max-width:52ch}
.crisis-support strong{display:block;font-size:19px;line-height:1.4;color:var(--highlight);margin-bottom:10px}
.ai-layout>div>p:not(.section-label){margin-top:22px;color:var(--muted);max-width:48ch}
.crisis-ai-note{padding:32px;border-radius:16px;background:white}
.crisis-ai-note h3{font-size:29px;margin-top:20px}
.crisis-ai-note>p{font-size:15px;margin-top:20px}
.crisis-ai-note>.button{margin-top:25px}
.crisis-ai-note>.micro{font-size:12px}
.ai-online{font-size:12px;color:var(--accent);display:flex;align-items:center;gap:8px}
.ai-online i{width:7px;height:7px;border-radius:50%;background:var(--accent)}
.printed-copy>p+p{margin-top:16px}
.printed-photo>img{border-radius:10px}
.reviews .parent-quote{padding-block:28px;margin-top:26px}
.reviews .social-review>img{width:100%;height:auto;border-radius:10px}
.review-source-note{font-size:11px;text-align:center;margin:20px auto 0}
.crisis-audience-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.crisis-audience-list li{padding-block:22px;border-top:1px solid var(--line);display:grid;gap:10px;align-content:start}
.crisis-audience-list strong{font-size:20px;line-height:1.4;color:var(--ink)}
.crisis-audience-list span{font-size:15px;color:var(--muted)}
.offer{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:64px;align-items:center}
.offer>div>p:not(.section-label):not(.buy-note){margin-top:24px;color:var(--muted)}
.offer ul{margin-block:24px 28px;font-size:15px;color:var(--muted);display:grid;gap:8px}
.crisis-format{width:100%;max-width:250px;justify-self:center}
.format-card{width:100%;padding:0;border:0;display:block;background:transparent;border-radius:8px;box-shadow:0 2px 5px #20384b20;transition:transform 160ms var(--ease-out)}
.format-card img{width:100%;height:auto;border-radius:8px}
.crisis-format>figcaption{font-size:12px;color:var(--muted);line-height:1.6;text-align:center;margin-top:16px}
.hero .deck-card:active:not(:focus-visible),.format-card:active:not(:focus-visible),.sample-controls button:active:not(:focus-visible){transform:scale(.98)}
@media(hover:hover) and (pointer:fine){
 .hero .deck-card:hover,.format-card:hover{transform:translateY(-2px)}
 .sample-controls button:not(:disabled):hover{background:var(--tint)}
}
@media(min-width:761px){.printed-panel .printed-photo>img{max-height:550px;object-fit:contain}}
@media(max-width:1100px){
 .hero{gap:32px}.hero .card-deck{gap:16px}.crisis-deck figcaption{font-size:11px}
 .crisis-situation{gap:36px}.crisis-triggers{gap:16px}.crisis-triggers figure{grid-template-rows:100px auto}.crisis-triggers img{width:100px;height:100px}.crisis-triggers figcaption{font-size:12px}
 .crisis-steps{gap:24px}.crisis-steps li{gap:12px}.crisis-steps h3{font-size:18px}.offer{gap:40px}
}
@media(max-width:760px){
 .hero{padding-block:24px 32px;gap:24px}.hero h1{font-size:clamp(36px,9.5vw,44px);max-width:none;line-height:1.08}.hero h1>br:first-child{display:initial}
 .hero .hero-buy{grid-row:4}.hero .buy-note{grid-row:5;margin:0}.hero .hero-art{grid-row:6;padding-top:4px}.hero .quiet-link{grid-row:7;text-align:center}
 .hero .card-deck{gap:16px;height:auto;max-width:400px;margin:0 auto 20px}.hero .deck-card{width:100%;max-width:none}.crisis-deck figcaption{font-size:11px;margin-top:12px}
 .hero .art-caption{font-size:10px;max-width:38ch}.hero .emotion-tags{gap:6px}.hero .emotion-tags span{font-size:10px;padding-inline:10px}
 .source-proof{display:block;padding-block:20px}.source-proof p{font-size:13px}.source-proof a{display:inline-flex;align-items:center;min-height:44px;margin-top:4px}
 .crisis-situation{grid-template-columns:minmax(0,1fr);gap:32px}.situation-spread{max-width:490px;justify-self:center;width:100%;gap:16px}.situation-spread figcaption{font-size:10px;margin-top:12px}.situation-card>span{width:32px;height:32px;font-size:20px}
 .crisis-actions{font-size:14px}.inside-layout{gap:32px}.inside-copy>h3{font-size:21px}.inside-copy>p{font-size:14px;margin-bottom:24px}
 .crisis-triggers{gap:14px}.crisis-triggers figure{grid-template-rows:88px auto;gap:12px}.crisis-triggers img{width:88px;height:88px}.crisis-triggers figcaption{font-size:11px}
 .emotion-picker{gap:8px;margin-bottom:24px}.preview-layout{gap:32px}.preview .sample-copy>.button{width:100%;font-size:13px;padding-inline:14px}.sample-enlarge{max-width:270px}
 .crisis-steps{grid-template-columns:minmax(0,1fr);gap:28px}.crisis-steps li{gap:20px}.crisis-steps h3{font-size:21px;margin-bottom:10px}.crisis-steps p{font-size:14px}
 .crisis-support{grid-template-columns:minmax(0,1fr);gap:24px}.crisis-support p{font-size:14px}.crisis-support strong{font-size:18px}
 .crisis-ai-note{padding:24px}.crisis-ai-note h3{font-size:27px}.review-source-note{font-size:10px}.reviews .parent-quote blockquote{font-size:14px}
 .crisis-audience-list{grid-template-columns:minmax(0,1fr);gap:0}.crisis-audience-list li{padding-block:20px;gap:8px}.crisis-audience-list strong{font-size:19px}.crisis-audience-list span{font-size:14px}
 .offer{grid-template-columns:minmax(0,1fr);gap:32px}.offer .hero-buy{flex-wrap:wrap}.crisis-format{max-width:220px;order:1}.crisis-format>figcaption{font-size:11px}
}
@media(max-width:370px){
 .hero h1{font-size:35px}.hero .card-deck{gap:12px}.crisis-deck figcaption{font-size:10px}.crisis-triggers figure{grid-template-rows:76px auto}.crisis-triggers img{width:76px;height:76px}.crisis-triggers figcaption{font-size:10px}.situation-spread{gap:12px}
}
@media(prefers-reduced-motion:reduce){
 .hero .deck-card,.format-card,.sample-controls button{transition:none}
 .hero .deck-card:hover,.hero .deck-card:active,.format-card:hover,.format-card:active,.sample-controls button:active{transform:none}
}