/* Hero restyle mock (America.gov-inspired layout). Loaded after keynote.css; only touches the hero. */
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces.woff2) format("woff2");font-weight:300 500;font-display:swap}
:root{--f-serif:"Fraunces","Instrument Serif",Georgia,"Times New Roman",serif}

/* layout: one centred column, generous space */
.hero{min-height:100vh;min-height:100svh;padding-top:calc(var(--nav-h) + 56px);padding-bottom:72px;align-items:flex-start;background:radial-gradient(80% 60% at 50% 0%,#1f212a 0%,var(--bg) 66%)}
.hero-grid{display:flex;flex-direction:column;align-items:center;gap:0;text-align:center}
.hero-copy{display:flex;flex-direction:column;align-items:center;width:100%}
.hero .eyebrow{font-size:.7rem}
.hero h1{font-family:var(--f-serif);font-weight:350;font-size:clamp(2.5rem,5.4vw,4.75rem);line-height:1.06;letter-spacing:-.025em;margin:28px 0 0;max-width:17em;text-wrap:balance;font-optical-sizing:auto}
.hero h1 em{text-decoration-thickness:.045em;text-underline-offset:.16em}
.hero .sub{margin:20px 0 0;font-size:clamp(1.05rem,1.5vw,1.2rem);color:var(--soft);max-width:34em}

/* chat: about half the viewport, tall, soft radius */
.chat-col{width:clamp(560px,50vw,860px);max-width:100%;margin-top:44px}
.chat{text-align:left;border-radius:28px;background:var(--bg-2);border:1px solid var(--line-2);box-shadow:0 40px 90px -40px rgba(0,0,0,.8),0 0 0 6px rgba(238,236,228,.025)}
.composer{padding:26px 28px 20px;display:flex;flex-direction:column;gap:26px}
.field{position:relative;min-height:3.2em;font-family:var(--f-body);font-size:clamp(1.1rem,1.45vw,1.35rem);line-height:1.45;color:var(--text);display:flex;align-items:flex-start}
.field .ph{color:var(--mut);transition:opacity .28s ease,transform .28s ease;display:none}
.field .typed{display:inline}
.field .caret{display:inline-block;width:2px;height:1.05em;background:var(--accent);margin-left:2px;vertical-align:-3px;animation:blink 1s steps(1) infinite}
.field.cycling .ph{display:inline}
.field.cycling .typed{display:none}
.field.cycling.typing .ph{display:none}
.field.cycling.typing .typed{display:inline}
.field .ph.out{opacity:0;transform:translateY(-6px)}
.tools{display:flex;align-items:center;gap:10px}
.tools .sp{flex:1}
.ic,.send{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);color:var(--soft);background:transparent;flex:none}
.tools svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.send{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);transition:transform .25s var(--ease),background .2s}
.send:hover{background:var(--text);border-color:var(--text);transform:translateY(-2px)}
.send svg{stroke-width:2.2}
.rolechip{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px 0 14px;border:1px solid var(--line-2);border-radius:999px;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);white-space:nowrap}
.rolechip svg{width:17px;height:17px}
.answer{border-top:1px solid var(--line);padding:22px 28px 24px;min-height:176px;background:rgba(255,255,255,.015)}
.answer .msg.a{max-width:none;width:100%;background:transparent;border:0;padding:0;border-radius:0}
.answer .row{font-size:1rem;padding-bottom:6px}
.chat-f{padding:14px 28px 18px;font-size:.66rem}

.hero-btns{margin-top:44px;justify-content:center}
.hero .stats{width:100%;margin-top:96px;text-align:left}

/* tablet / mobile */
@media (max-width:900px){
  .hero{padding-top:calc(var(--nav-h) + 48px);padding-bottom:56px}
  .hero-grid{gap:0}.hero-grid .chat-col{order:0}.hero-grid .stats{order:0}
  .chat-col{width:100%}
  .hero .stats{margin-top:64px}
}
@media (max-width:640px){
  .hero{padding-top:calc(var(--nav-h) + 40px);padding-bottom:48px}
  .hero h1{font-size:clamp(2.1rem,9.6vw,2.6rem);margin-top:26px}
  .hero .sub{margin-top:20px}
  .hero .eyebrow{font-size:.62rem;letter-spacing:.1em;line-height:1.6}
  .chat-col{margin-top:40px}
  .chat{margin-top:0;border-radius:24px}
  .composer{padding:20px 18px 16px;gap:18px}
  .field{min-height:4.4em;font-size:1.05rem}
  .ic,.send{width:40px;height:40px}.rolechip{height:40px;padding:0 12px 0 10px;font-size:.6rem;letter-spacing:.05em}
  .tools{gap:8px}
  .answer{padding:18px 18px 18px;min-height:176px}
  .chat-f{padding:12px 18px 16px}
  .hero-btns{margin-top:32px}
  .hero-btns .btn{flex:1 1 auto;justify-content:center;text-align:center}
  .hero .stats{margin-top:56px}
}
.js .in .rv.scale{transform:none}