/* ============================================================================
   CATALYST — Website  ·  home.css
   Hybrid direction: "Painted Field" desktop hero (calmer, more transparent
   washes) that collapses into a clear, path-led mobile fold. Reuses
   watercolor.css + catalyst-v3/v5.css for the in-page app screens; everything
   site-chrome is prefixed .h-.  Tone: purposeful, real, growing — not "calm".
   ========================================================================== */

:root{
  --font-display:'Fraunces',Georgia,serif;
  --font-ui:'Inter',system-ui,sans-serif;
  --maxw:1180px;
  --pad:clamp(20px,5vw,56px);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; font-family:var(--font-ui); color:var(--ink);
  background:var(--paper); -webkit-font-smoothing:antialiased;
  font-size:17px; line-height:1.6;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }

/* a dark "wet ink" scope for dramatic sections (local dark tokens) */
.wc-dark{
  --paper:#15181d; --paper-deep:#1c2027; --paper-edge:#262b34;
  --ink:#ece3d2; --ink-soft:#b3ab9b; --ink-faint:#837c6f; --hairline:#2e333d;
  --pig-indigo:#9caedd; --pig-teal:#8ad3cd; --pig-amber:#edcd95; --pig-coral:#efb8a7;
  --pig-rose:#e3b6d2; --pig-plum:#c6b2e3; --pig-sage:#c0d3a7;
  --wc-blend:screen; --solid:var(--pigment);
  color-scheme:dark; background:var(--paper); color:var(--ink);
}

/* ── shared bits ───────────────────────────────────────────────────────── */
.h-shell{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--pad); }
.h-eyebrow{ font-weight:600; font-size:.74rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-faint);
  display:inline-flex; align-items:center; gap:9px; }
.h-eyebrow.dot::before{ content:""; width:12px; height:12px; border-radius:50%; flex:none; background:var(--pigment,var(--pig-indigo)); filter:url(#wc-edge-soft); }
.h-display{ font-family:var(--font-display); font-weight:480; letter-spacing:-.02em; line-height:1.04; }
.h-display em{ font-style:italic; font-weight:400; }
h2.h-h2{ font-family:var(--font-display); font-weight:480; letter-spacing:-.02em; line-height:1.06;
  font-size:clamp(2rem,4.4vw,3rem); margin:0; text-wrap:balance; }
.h-lead{ font-size:1.16rem; color:var(--ink-soft); line-height:1.55; max-width:54ch; text-wrap:pretty; }
.h-sec-head{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }

.gold-rule{ height:2px; border:0; border-radius:2px; background:linear-gradient(90deg,transparent,var(--gold-3) 18%,var(--gold-4) 50%,var(--gold-3) 82%,transparent); filter:url(#wc-edge-soft); }

/* buttons / badges */
.h-btn{ font-weight:600; font-size:.96rem; cursor:pointer; padding:.92em 1.35em; border-radius:13px;
  border:1px solid transparent; display:inline-flex; align-items:center; justify-content:center; gap:.5em; text-decoration:none; transition:transform .15s, box-shadow .15s; }
.h-btn:hover{ transform:translateY(-1px); }
.h-btn-ink{ background:var(--ink); color:var(--paper); }
.h-btn-ghost{ background:transparent; color:var(--ink); border-color:color-mix(in oklab,var(--ink),transparent 78%); }
.wc-dark .h-btn-ghost{ color:var(--ink); border-color:color-mix(in oklab,var(--ink),transparent 70%); }

.h-badges{ display:flex; flex-wrap:wrap; gap:12px; }
.h-badge{ display:inline-flex; align-items:center; gap:11px; background:var(--ink); color:var(--paper);
  border-radius:13px; padding:.6em 1.05em .64em; text-decoration:none; transition:transform .15s, box-shadow .15s;
  box-shadow:0 10px 26px -16px rgba(28,20,10,.6); }
.h-badge:hover{ transform:translateY(-1px); box-shadow:0 16px 32px -16px rgba(28,20,10,.7); }
.h-badge svg{ width:23px; height:23px; flex:none; fill:var(--paper); }
.h-badge .bt{ display:flex; flex-direction:column; line-height:1.12; }
.h-badge .bt small{ font-size:.6rem; letter-spacing:.04em; opacity:.82; font-weight:500; }
.h-badge .bt b{ font-size:1.04rem; font-weight:600; letter-spacing:.01em; }

/* ── site header ───────────────────────────────────────────────────────── */
.h-nav{ position:sticky; top:0; z-index:60; backdrop-filter:blur(12px);
  background:color-mix(in oklab,var(--paper),transparent 14%);
  border-bottom:1px solid color-mix(in oklab,var(--ink),transparent 92%); }
.h-nav-in{ max-width:var(--maxw); margin:0 auto; padding:14px var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:22px; }
.h-brand{ display:flex; align-items:center; gap:11px; text-decoration:none;
  font-family:var(--font-display); font-weight:600; font-size:1.34rem; letter-spacing:-.01em; color:var(--ink); }
.h-brand svg{ width:30px; height:30px; flex:none; }
.h-navlinks{ display:flex; align-items:center; gap:30px; }
.h-navlinks a{ color:var(--ink-soft); text-decoration:none; font-weight:500; font-size:.95rem; transition:color .15s; }
.h-navlinks a:hover{ color:var(--ink); }
.h-nav-cta{ display:flex; align-items:center; gap:14px; }
.h-nav-cta .h-btn{ padding:.62em 1.05em; }
.h-burger{ display:none; width:44px; height:44px; border-radius:11px; border:1px solid var(--hairline);
  background:color-mix(in oklab,var(--paper),#fff 30%); align-items:center; justify-content:center; cursor:pointer; }
.h-burger svg{ width:22px; height:22px; stroke:var(--ink); stroke-width:1.8; fill:none; }
.h-mobnav{ display:none; }

/* ── HERO — painted field, calmer ──────────────────────────────────────── */
.h-hero{ position:relative; overflow:hidden; isolation:isolate; background:var(--paper); }
.h-hero.wc-paper{ background-color:var(--paper); }
.h-field{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.h-field .wc{ position:absolute; filter:url(#wc-edge-rough); mix-blend-mode:var(--wc-blend); }
/* calmer: lower opacity, softer pastels, generous feather */
.h-field .b1{ width:62vw; height:62vw; max-width:820px; max-height:820px; left:-14vw; top:-22vw; --pig:var(--pig-indigo); opacity:.42; }
.h-field .b2{ width:50vw; height:50vw; max-width:680px; max-height:680px; right:-8vw; top:-16vw; --pig:var(--pig-plum); opacity:.34; }
.h-field .b3{ width:44vw; height:44vw; max-width:560px; max-height:560px; right:8vw; bottom:-24vw; --pig:var(--pig-amber); opacity:.22; }
.h-hero-in{ position:relative; z-index:2; max-width:var(--maxw); margin:0 auto; padding:clamp(34px,5vw,66px) var(--pad) clamp(40px,5vw,64px);
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px,4vw,60px); align-items:center; }
.h-h1{ font-family:var(--font-display); font-weight:480; line-height:1.0; letter-spacing:-.024em;
  font-size:clamp(2.7rem,6vw,4.6rem); margin:18px 0 0; color:var(--ink); text-wrap:balance; }
.h-h1 em{ font-style:italic; font-weight:400; }
.h-hero-sub{ font-size:clamp(1.08rem,1.6vw,1.3rem); line-height:1.5; color:var(--ink-soft); margin:22px 0 0; max-width:32ch; text-wrap:pretty; }
.h-hero .h-badges{ margin-top:30px; }
.h-hero-note{ margin-top:20px; color:var(--ink-soft); font-size:.96rem; display:flex; align-items:center; gap:11px; max-width:40ch; }
.h-hero-note .gold-rule{ width:30px; flex:none; }

/* hero art: phone + a torn-edge real photo slot */
.h-hero-art{ position:relative; display:flex; align-items:center; justify-content:center; gap:clamp(8px,1.6vw,20px); min-height:520px; }
.h-photo{ position:relative; overflow:hidden; box-shadow:0 34px 70px -38px rgba(28,20,10,.55); }
.h-photo.torn{ border-radius:170px 170px 18px 18px; }
.h-hero-art .h-photo{ width:38%; max-width:230px; height:360px; align-self:center; z-index:2; }

/* phone scaler (the .frame is fixed 390x844) */
.h-phone{ --sc:.62; width:calc(390px * var(--sc)); height:calc(844px * var(--sc)); position:relative; flex:none; z-index:3; }
.h-phone > .frame{ position:absolute; top:0; left:0; transform:scale(var(--sc)); transform-origin:top left; }
.h-phone.tall > .frame{ height:auto; }

/* ── THE PATH (3 steps, painted thread — no rainbow) ───────────────────── */
.h-path{ background:color-mix(in oklab,var(--paper),var(--pig-indigo) 5%); border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); }
.h-path-in{ max-width:var(--maxw); margin:0 auto; padding:clamp(48px,6vw,84px) var(--pad); }
.h-path-head{ max-width:60ch; margin-bottom:clamp(34px,4vw,52px); }
.h-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; position:relative; }
/* the painted "path" thread connecting the three steps */
.h-steps::before{ content:""; position:absolute; top:33px; left:8%; right:8%; height:3px; z-index:0;
  background:linear-gradient(90deg,var(--pig-indigo),var(--pig-teal) 50%,var(--pig-amber));
  filter:url(#wc-edge-soft); border-radius:3px; opacity:.5; }
.h-step{ position:relative; z-index:1; padding:0 clamp(10px,2vw,26px); }
.h-step .n{ width:66px; height:66px; border-radius:50%; display:grid; place-items:center; position:relative;
  font-family:var(--font-display); font-weight:600; font-size:1.6rem; color:#fff;
  background:color-mix(in oklab,var(--pigment),var(--ink) 26%);
  box-shadow:0 10px 26px -12px color-mix(in oklab,var(--pigment),transparent 40%); }
.h-step h3{ font-family:var(--font-display); font-weight:600; font-size:1.4rem; letter-spacing:-.01em; margin:22px 0 0; }
.h-step p{ margin:10px 0 0; color:var(--ink-soft); font-size:1.02rem; line-height:1.5; max-width:32ch; }

/* ── FEATURE rows (app screens) ────────────────────────────────────────── */
.h-section{ padding:clamp(54px,7vw,100px) 0; }
.h-feature-grid{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad);
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,5vw,72px); align-items:center; }
.h-feature-grid.flip .h-feature-art{ order:-1; }
.h-feature-copy h2{ margin-top:16px; }
.h-feature-copy p{ margin:18px 0 0; }
.h-feature-art{ display:flex; justify-content:center; align-items:center; position:relative; }
.h-feature-art .h-bloom{ position:absolute; inset:6% ; z-index:0; border-radius:54% 62% 58% 46% / 56% 48% 62% 52%;
  filter:url(#wc-edge-rough); mix-blend-mode:var(--wc-blend); opacity:.5;
  background:radial-gradient(56% 56% at 46% 42%, color-mix(in oklab,var(--pigment),transparent 50%), transparent 72%); }
.h-tick{ display:flex; flex-direction:column; gap:14px; margin-top:26px; list-style:none; padding:0; }
.h-tick li{ display:flex; gap:13px; align-items:flex-start; color:var(--ink-soft); }
.h-tick li b{ color:var(--ink); font-weight:600; }
.h-tick .mk{ width:26px; height:26px; border-radius:50%; flex:none; display:grid; place-items:center; margin-top:1px;
  background:color-mix(in oklab,var(--pigment),var(--paper) 74%); color:color-mix(in oklab,var(--pigment),var(--ink) 38%); }
.h-tick .mk svg{ width:15px; height:15px; stroke:currentColor; stroke-width:2.2; fill:none; }

/* ── REAL-WORLD photo band ─────────────────────────────────────────────── */
.h-world{ position:relative; }
.h-world-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:14px; }
.h-world-grid image-slot, .h-world-grid .h-slot{ width:100%; border-radius:20px; overflow:hidden; }
.h-world-grid .tall{ grid-row:span 2; }
.h-world-copy{ max-width:46ch; margin-bottom:36px; }

/* ── PROOF: taught in 100 words + Day 1 ────────────────────────────────── */
.h-proof-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(24px,3vw,40px); align-items:stretch; }
.h-card{ background:color-mix(in oklab,var(--paper),#fff 34%); border:1px solid var(--hairline); border-radius:22px; padding:clamp(26px,3vw,40px); position:relative; overflow:hidden; }
.wc-dark .h-card{ background:color-mix(in oklab,var(--paper),#fff 5%); }
.h-100{ position:relative; }
.h-100 .q{ font-family:var(--font-display); font-weight:440; font-size:clamp(1.3rem,2vw,1.7rem); line-height:1.35; letter-spacing:-.01em; color:var(--ink); }
.h-100 .q em{ font-style:italic; }
.h-100 .src{ margin-top:20px; color:var(--ink-faint); font-size:.86rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.h-day1{ display:flex; flex-direction:column; justify-content:center; }
.h-day1 .player{ display:flex; align-items:center; gap:16px; margin-top:22px; }
.h-day1 .pbtn{ width:60px; height:60px; border-radius:50%; border:0; flex:none; cursor:pointer; display:grid; place-items:center;
  background:color-mix(in oklab,var(--pig-indigo),var(--ink) 34%); color:#fff; box-shadow:0 12px 28px -12px color-mix(in oklab,var(--pig-indigo),transparent 40%); }
.h-day1 .pbtn svg{ width:26px; height:26px; fill:currentColor; }
.h-day1 .pmeta{ flex:1; }
.h-day1 .wavebar{ display:flex; align-items:center; gap:3px; height:34px; margin-top:8px; }
.h-day1 .wavebar i{ flex:1; border-radius:2px; background:color-mix(in oklab,var(--pig-indigo),var(--paper) 60%); }
.h-day1 .wavebar i.on{ background:var(--pig-indigo); }

/* ── ESSAYS ────────────────────────────────────────────────────────────── */
.h-essays-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.h-essay{ display:flex; flex-direction:column; background:color-mix(in oklab,var(--paper),#fff 32%); border:1px solid var(--hairline);
  border-radius:20px; overflow:hidden; text-decoration:none; color:inherit; transition:transform .18s, box-shadow .18s; }
.h-essay:hover{ transform:translateY(-3px); box-shadow:0 22px 44px -28px rgba(28,20,10,.5); }
.h-essay .top{ height:150px; position:relative; overflow:hidden; }
.h-essay .body{ padding:22px 22px 24px; flex:1; display:flex; flex-direction:column; }
.h-essay .kicker{ font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); }
.h-essay h3{ font-family:var(--font-display); font-weight:560; font-size:1.22rem; line-height:1.2; letter-spacing:-.01em; margin:10px 0 0; }
.h-essay .ex{ color:var(--ink-soft); font-size:.95rem; margin:11px 0 0; }
.h-essay .read{ margin-top:auto; padding-top:16px; font-weight:600; font-size:.9rem; color:color-mix(in oklab,var(--pig-indigo),var(--ink) 30%); display:inline-flex; align-items:center; gap:7px; }
.h-essay .read svg{ width:15px; height:15px; stroke:currentColor; stroke-width:2; fill:none; }

/* ── PRINCIPLES (wet-ink dark) ─────────────────────────────────────────── */
.h-principles{ position:relative; overflow:hidden; }
.h-principles .h-field .b1{ --pig:var(--pig-indigo); opacity:.3; }
.h-principles .h-field .b2{ --pig:var(--pig-teal); opacity:.24; }
.h-principles .h-field .b3{ --pig:var(--pig-plum); opacity:.2; }
.h-manifesto{ max-width:30ch; font-family:var(--font-display); font-weight:440; letter-spacing:-.015em; line-height:1.16;
  font-size:clamp(1.9rem,3.4vw,2.7rem); }
.h-makegrid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(26px,4vw,56px); margin-top:clamp(32px,4vw,52px); }
.h-make h4{ font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 16px; }
.h-make ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:14px; }
.h-make li{ display:flex; gap:13px; align-items:flex-start; font-size:1.06rem; color:var(--ink); }
.h-make .g{ width:24px; height:24px; border-radius:50%; flex:none; display:grid; place-items:center; margin-top:1px; }
.h-make .g svg{ width:15px; height:15px; stroke-width:2.2; fill:none; }
.h-make.do .g{ background:color-mix(in oklab,var(--pig-sage),transparent 64%); color:var(--pig-sage); }
.h-make.dont .g{ background:color-mix(in oklab,var(--pig-coral),transparent 70%); color:var(--pig-coral); }
.h-make.dont li{ color:var(--ink-soft); }

/* ── PRICING (4 tiers) ─────────────────────────────────────────────────── */
.h-price-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; align-items:stretch; }
.h-tier{ display:flex; flex-direction:column; background:color-mix(in oklab,var(--paper),#fff 34%); border:1px solid var(--hairline);
  border-radius:20px; padding:26px 22px 28px; position:relative; }
.h-tier.feat{ border-color:color-mix(in oklab,var(--pig-indigo),transparent 50%); box-shadow:0 22px 50px -30px color-mix(in oklab,var(--pig-indigo),transparent 30%); }
.h-tier .tag{ position:absolute; top:-11px; left:22px; font-size:.66rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  background:color-mix(in oklab,var(--pig-indigo),var(--ink) 28%); color:#fff; padding:.4em .7em; border-radius:999px; }
.h-tier .tn{ font-family:var(--font-display); font-weight:600; font-size:1.3rem; }
.h-tier .tp{ margin-top:10px; font-family:var(--font-display); font-weight:600; font-size:2rem; letter-spacing:-.02em; }
.h-tier .tp small{ font-family:var(--font-ui); font-weight:500; font-size:.86rem; color:var(--ink-faint); }
.h-tier .td{ margin-top:6px; color:var(--ink-soft); font-size:.92rem; min-height:2.6em; }
.h-tier ul{ list-style:none; padding:0; margin:20px 0 0; display:flex; flex-direction:column; gap:11px; font-size:.92rem; }
.h-tier li{ display:flex; gap:10px; align-items:flex-start; color:var(--ink-soft); }
.h-tier li svg{ width:16px; height:16px; flex:none; margin-top:3px; stroke:color-mix(in oklab,var(--pig-sage),var(--ink) 20%); stroke-width:2.4; fill:none; }
.h-tier .h-btn{ margin-top:22px; }
.h-price-note{ text-align:center; margin-top:24px; color:var(--ink-faint); font-size:.92rem; }

/* ── FOUNDER ───────────────────────────────────────────────────────────── */
.h-founder-grid{ display:grid; grid-template-columns:300px 1fr; gap:clamp(28px,4vw,56px); align-items:center; }
.h-founder-photo{ width:100%; aspect-ratio:1; border-radius:24px; overflow:hidden; }
.h-founder q{ font-family:var(--font-display); font-weight:440; font-size:clamp(1.3rem,2.2vw,1.7rem); line-height:1.4; letter-spacing:-.01em; }
.h-founder .sig{ margin-top:22px; font-weight:600; }
.h-founder .sig small{ display:block; color:var(--ink-faint); font-weight:500; margin-top:2px; }

/* ── FINAL CTA ─────────────────────────────────────────────────────────── */
.h-final{ text-align:center; }
.h-final .h-badges{ justify-content:center; margin-top:30px; }
.h-mail{ display:flex; gap:10px; max-width:430px; margin:22px auto 0; }
.h-mail input{ flex:1; padding:.9em 1.1em; border-radius:12px; border:1px solid var(--hairline); background:color-mix(in oklab,var(--paper),#fff 36%);
  font-family:inherit; font-size:.96rem; color:var(--ink); }
.h-mail input::placeholder{ color:var(--ink-faint); }

/* ── FOOTER ────────────────────────────────────────────────────────────── */
.h-footer{ border-top:1px solid var(--hairline); padding:clamp(48px,5vw,72px) 0 36px; background:color-mix(in oklab,var(--paper),var(--pig-indigo) 4%); }
.h-foot-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:clamp(24px,3vw,48px); }
.h-foot-tag{ color:var(--ink-soft); margin:14px 0 0; max-width:30ch; font-size:.96rem; }
.h-foot-col h4{ font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 16px; }
.h-foot-col ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:11px; }
.h-foot-col a{ color:var(--ink-soft); text-decoration:none; font-size:.96rem; }
.h-foot-col a:hover{ color:var(--ink); }
.h-foot-base{ max-width:var(--maxw); margin:38px auto 0; padding:22px var(--pad) 0; border-top:1px solid var(--hairline);
  display:flex; justify-content:space-between; gap:16px; color:var(--ink-faint); font-size:.86rem; }

/* ── REVEAL on scroll ──────────────────────────────────────────────────── */
@media (prefers-reduced-motion:no-preference){
  [data-reveal]{ opacity:0; transform:translateY(20px); transition:opacity .7s var(--ease-paint,ease), transform .7s var(--ease-paint,ease); }
  [data-reveal].in{ opacity:1; transform:none; }
}

/* ── RESPONSIVE ────────────────────────────────────────────────────────── */
@media (max-width:1000px){
  .h-founder-grid{ grid-template-columns:220px 1fr; }
}
@media (max-width:860px){
  .h-navlinks, .h-nav-cta .h-btn{ display:none; }
  .h-burger{ display:inline-flex; }
  .h-hero-in{ grid-template-columns:1fr; gap:24px; }
  .h-hero-art{ min-height:0; max-height:440px; overflow:hidden; gap:12px; }
  .h-h1{ font-size:clamp(2.5rem,11vw,3.4rem); }
  .h-feature-grid{ grid-template-columns:1fr; gap:30px; }
  .h-feature-grid.flip .h-feature-art{ order:0; }
  .h-proof-grid{ grid-template-columns:1fr; }
  .h-essays-grid{ grid-template-columns:1fr; }
  .h-price-grid{ grid-template-columns:1fr 1fr; }
  .h-makegrid{ grid-template-columns:1fr; gap:30px; }
  .h-founder-grid{ grid-template-columns:1fr; }
  .h-founder-photo{ max-width:240px; }
  .h-world-grid{ grid-template-columns:1fr 1fr; }
  .h-world-grid .tall{ grid-row:span 1; grid-column:span 2; }
  .h-foot-grid{ grid-template-columns:1fr 1fr; gap:30px; }
  /* mobile: lead with the path (the "spectrum"/quick-verify fold the founder liked) */
  .h-steps{ grid-template-columns:1fr; gap:8px; }
  .h-steps::before{ top:0; bottom:0; left:32px; right:auto; width:3px; height:auto;
    background:linear-gradient(180deg,var(--pig-indigo),var(--pig-teal) 50%,var(--pig-amber)); }
  .h-step{ display:grid; grid-template-columns:66px 1fr; gap:18px; align-items:start; padding:14px 0; }
  .h-step h3{ margin:0; }
  .h-step p{ grid-column:2; margin-top:8px; }
}
@media (max-width:540px){
  .h-price-grid{ grid-template-columns:1fr; }
  .h-foot-grid{ grid-template-columns:1fr 1fr; }
  .h-world-grid{ grid-template-columns:1fr; }
  .h-world-grid .tall{ grid-column:span 1; }
  .h-hero-art{ transform:scale(.96); }
  .h-foot-base{ flex-direction:column; }
}