/* KayEA · kayea.co · True North, evolved for the KayEA name (Nov 7, 2026).
   One typeface (Manrope), one dark ground, one red north point on the symbol.
   Maple is a quiet accent for rules and link underlines only. */
@font-face{font-family:Manrope;font-weight:300;font-display:swap;src:url(fonts/manrope-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:400;font-display:swap;src:url(fonts/manrope-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:500;font-display:swap;src:url(fonts/manrope-latin-500-normal.woff2) format("woff2")}

:root{
  --ground:#0e1417;   /* night */
  --raise:#141b1f;
  --rule:#263033;
  --ink:#e9ecea;      /* primary text */
  --body:#b9c1c0;     /* body text */
  --quiet:#8e9897;    /* labels, secondary */
  --north:#d52b1e;    /* the red dot: true north. Used for the dot only. */
  --maple:#c0602e;    /* autumn maple: link underline, rules, one line */
  --gutter:clamp(20px,5vw,72px);
  --max:1296px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--ground);color:var(--ink);font:400 17px/1.6 Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--ground);padding:8px 14px;border-radius:999px;z-index:10}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}

/* Wordmark: compass-needle ring + KayEA in Manrope Regular. Symbol = cap height plus overshoot; gap matches letter spacing. */
.wm{display:inline-flex;align-items:center;font-weight:400;font-size:27px;letter-spacing:.01em;line-height:1;white-space:nowrap}
.wm .sym{width:.78em;height:.78em;flex:none;margin-right:.17em;transform:translateY(-.035em)}
.wm .nm{display:inline-block}
.wm .tm{font-size:.24em;align-self:flex-start;margin-left:.06em;margin-top:.12em}

/* Header */
.top{position:absolute;left:0;right:0;top:0;z-index:3}
.top .wrap{display:flex;justify-content:space-between;align-items:center;height:110px}
.top nav{display:flex;gap:36px;font-size:15px;color:var(--body)}
.top nav a:hover{color:var(--ink)}
.top nav .join{color:var(--ink);font-weight:500}
.top nav a[aria-current]{color:var(--ink)}
.menu{display:none;background:none;border:1px solid var(--rule);color:var(--ink);font:inherit;font-size:14px;padding:6px 14px;border-radius:999px;cursor:pointer}
.drawer{background:rgba(14,20,23,.97);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:8px var(--gutter) 20px;display:grid}
.drawer[hidden]{display:none}
.drawer a{padding:12px 0;border-bottom:1px solid var(--rule);font-size:17px}
.drawer a:last-child{border-bottom:0}

/* Hero: the film, above the fold */
.hero{position:relative;min-height:min(100svh,980px);display:flex;align-items:flex-end;overflow:hidden}
.hero .stage{position:absolute;inset:0;background:#0b1013 url(img/hero-cycle.jpg) 30% 40%/cover no-repeat}
.hero .stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% 40%;opacity:0;transition:opacity 1.2s ease}
.hero .stage video.on{opacity:1}
.hero .stage:after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(14,20,23,.95) 0%,rgba(14,20,23,.82) 36%,rgba(14,20,23,.15) 72%),
  linear-gradient(0deg,var(--ground) 0%,rgba(14,20,23,0) 38%),
  linear-gradient(180deg,rgba(14,20,23,.7) 0%,rgba(14,20,23,0) 18%)}
.hero .wrap{position:relative;z-index:2;width:100%;padding-top:180px;padding-bottom:96px}
.lab{font-size:13px;letter-spacing:.06em;color:var(--quiet);display:flex;gap:10px;align-items:center;margin-bottom:28px}
.lab i{width:7px;height:7px;background:var(--north);border-radius:50%;flex:none}
h1{font-weight:300;font-size:clamp(38px,4.6vw,56px);line-height:1.08;letter-spacing:-.02em;max-width:13em}
h1 span,h2 span{color:var(--quiet)}
.lede{font-size:clamp(17px,1.5vw,20px);color:var(--body);margin-top:28px;max-width:30em}
.cta{margin-top:40px;display:flex;flex-wrap:wrap;gap:28px;align-items:center;font-size:15px}
.btn{display:inline-block;background:var(--ink);color:var(--ground);padding:15px 28px;border-radius:999px;font-weight:500;border:0;font:inherit;font-weight:500;cursor:pointer}
.btn:hover{background:#fff}
.play{display:inline-flex;align-items:center;gap:14px;background:var(--ink);color:var(--ground);padding:10px 26px 10px 10px;border-radius:999px;border:0;font:inherit;font-weight:500;cursor:pointer}
.play:hover{background:#fff}
.play .tri{width:38px;height:38px;border-radius:50%;background:var(--ground);position:relative;flex:none}
.play .tri:after{content:"";position:absolute;left:15px;top:12px;border-left:11px solid var(--ink);border-top:7px solid transparent;border-bottom:7px solid transparent}
.play small{font-weight:400;color:#5d6668;font-size:13px}
.ghost{color:var(--ink);border-bottom:1px solid var(--maple);padding-bottom:2px;background:none;border-top:0;border-left:0;border-right:0;font:inherit;cursor:pointer}
.std{margin-top:28px;font-size:13px;letter-spacing:.06em;color:var(--maple)}

/* Trust: the three questions */
.trust{border-top:1px solid var(--rule)}
.trust .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding-top:28px;padding-bottom:72px}
.trust .wrap>div:before{content:"";display:block;width:18px;height:2px;background:var(--maple);margin-bottom:14px}
.trust small{display:block;font-size:13px;letter-spacing:.06em;color:var(--quiet);margin-bottom:6px}
.trust b{display:block;color:var(--ink);font-weight:500;margin-bottom:4px;font-size:16px}
.trust p{font-size:15px;color:var(--quiet);line-height:1.55}

/* Sections */
section.s{padding:120px 0;border-top:1px solid var(--rule)}
.eyebrow{font-size:13px;letter-spacing:.06em;color:var(--quiet);margin-bottom:22px}
h2{font-weight:300;font-size:clamp(30px,3.4vw,44px);line-height:1.12;letter-spacing:-.015em;max-width:16em}
.s p.body{color:var(--body);margin-top:24px;max-width:34em}
.split{display:grid;grid-template-columns:5fr 6fr;gap:clamp(40px,7vw,120px);align-items:start}

/* Conversation */
.talk{display:grid;gap:14px;font-size:16px}
.talk p{max-width:30em;line-height:1.55}
.talk .you{color:var(--quiet)}
.talk .you:before{content:"You  ";color:var(--quiet);font-size:12px;letter-spacing:.08em}
.talk .kay{color:var(--ink);padding-left:18px;border-left:1px solid var(--rule)}
.talk .kay:before{content:"Kay  ";color:var(--quiet);font-size:12px;letter-spacing:.08em}

/* Method grid: do / schedule / delegate / let go */
.method{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule);border-left:1px solid var(--rule);margin-top:56px}
.method div{padding:28px 28px 32px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.method b{display:block;font-weight:500;font-size:18px;margin-bottom:6px}
.method small{display:block;font-size:12px;letter-spacing:.06em;color:var(--quiet);margin-bottom:14px}
.method p{color:var(--quiet);font-size:15px}

/* Facts list */
.facts{list-style:none;display:grid;gap:0;margin-top:8px}
.facts li{padding:22px 0;border-bottom:1px solid var(--rule)}
.facts li:first-child{border-top:1px solid var(--rule)}
.facts b{display:block;font-weight:500;margin-bottom:4px}
.facts span{color:var(--quiet);font-size:15px}

/* Honour */
.honour{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.honour img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:40% 22%;border-radius:2px;filter:saturate(.9)}
.honour .dates{color:var(--quiet);font-size:15px;margin-top:8px}
.link{display:inline-block;margin-top:28px;border-bottom:1px solid var(--maple);padding-bottom:2px}

/* FAQ */
.faq{margin-top:48px;border-top:1px solid var(--rule);max-width:880px}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;padding:24px 40px 24px 0;font-weight:400;font-size:18px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:4px;top:22px;color:var(--quiet);font-weight:300;font-size:22px}
.faq details[open] summary:after{content:"–"}
.faq details p{color:var(--body);padding:0 0 26px;max-width:40em;font-size:16px}

/* Join */
.join-s{text-align:left}
.signup{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px;max-width:560px}
.signup label{position:absolute;left:-999px}
.signup input{flex:1 1 260px;background:transparent;border:1px solid var(--rule);border-radius:999px;color:var(--ink);font:inherit;padding:14px 22px}
.signup input::placeholder{color:var(--quiet)}
.signup input:focus{outline:none;border-color:var(--quiet)}
.note{min-height:1.6em;margin-top:14px;font-size:14px;color:var(--quiet)}

/* Footer */
footer{border-top:1px solid var(--rule);padding:56px 0 64px;color:var(--quiet);font-size:14px}
footer .row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:baseline}
footer nav{display:flex;flex-wrap:wrap;gap:24px}
footer nav a:hover{color:var(--ink)}
footer .sign{margin-top:32px;color:var(--body);font-size:15px}
footer .fine{margin-top:32px;font-size:12.5px;line-height:1.6;max-width:62em}

/* Film overlay */
.film{position:fixed;inset:0;background:#080b0d;display:none;align-items:center;justify-content:center;z-index:20;padding:var(--gutter)}
.film.open{display:flex}
.film .box{max-width:620px;text-align:center}
.film .box p{color:var(--body);margin-top:16px}
.film .close{position:absolute;top:14px;right:16px;min-height:44px;min-width:44px;padding:10px 12px;background:none;border:0;color:var(--quiet);font:inherit;font-size:14px;cursor:pointer}
.film-player{width:min(1100px,100%);max-height:calc(100dvh - 120px);overflow:auto}
.film video{display:block;width:100%;max-height:calc(100dvh - 220px);aspect-ratio:16/9;background:#000}
.film-audio{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;padding:16px 0}
.film-audio button{min-height:44px;padding:10px 18px;background:var(--paper,#f4f0e8);color:#0e1417;border:0;border-radius:4px;font:inherit;font-size:14px;cursor:pointer}
.film-audio button:focus-visible{outline:2px solid #fff;outline-offset:4px}
.film-audio p{margin:0;color:var(--quiet);font-size:14px;line-height:1.5}

/* Article page */
.article{padding:170px 0 100px}
.article h1{max-width:14em}
.article .prose{max-width:40em;margin-top:48px}
.article .prose h2{font-size:26px;margin:56px 0 4px}
.article .prose p,.article .prose li{color:var(--body);margin-top:16px}
.article .prose ul,.article .prose ol{padding-left:1.2em}
.article .prose sup{font-size:.7em;color:var(--quiet)}
.article dl{display:grid;grid-template-columns:150px 1fr;gap:12px 24px;margin-top:40px;font-size:15px;border-top:1px solid var(--rule);padding-top:24px}
.article dt{color:var(--quiet)}
.article .chron{list-style:none;padding:0}
.article .chron li{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--rule);margin:0}
.article .chron b{font-weight:500;color:var(--ink)}
.article .sources{font-size:14px}


/* Inner pages */
.page-head{padding:200px 0 72px}
.page-head h1{max-width:16em}
.page-head .lede{max-width:36em}
.toc{display:flex;flex-wrap:wrap;gap:10px 28px;padding-bottom:40px;font-size:14px;color:var(--quiet)}
.toc a:hover{color:var(--ink)}
.pic{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:2px;filter:saturate(.92)}
.list{list-style:none;margin-top:28px;border-top:1px solid var(--rule)}
.pic+.list{margin-top:28px}
.list li{padding:18px 0;border-bottom:1px solid var(--rule)}
.list b{display:block;font-weight:500;margin-bottom:2px}
.list span{color:var(--quiet);font-size:15px}
.day{border-left:1px solid var(--rule);padding-left:24px;display:grid;gap:22px}
.day .t{display:grid;grid-template-columns:56px 1fr;gap:14px}
.day .t b{display:block;font-size:16px;margin-bottom:4px}
.day .t p{font-size:15px;color:var(--body);line-height:1.6}
.day time{color:var(--maple);font-size:13px;letter-spacing:.04em;padding-top:2px}
.day b{color:var(--ink);font-weight:500}
.day time{padding-top:3px}
.quote{border-left:2px solid var(--maple);padding:8px 0 8px 28px;align-self:center}
.quote p{font-weight:300;font-size:clamp(28px,3vw,40px);line-height:1.15;letter-spacing:-.015em}
.quote span{display:block;color:var(--quiet);margin-top:14px;font-size:15px}
section.next{text-align:left}
section.next h2{max-width:20em}

/* Home: three steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:56px}
.steps img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:2px;filter:saturate(.92)}
.steps figcaption{margin-top:20px;color:var(--quiet);font-size:15px;line-height:1.6}
.steps figcaption b{display:block;color:var(--ink);font-weight:500;font-size:16px;margin-bottom:6px}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:10px;align-content:start;margin-top:8px}
.tags li{border:1px solid var(--rule);border-radius:999px;padding:9px 18px;font-size:15px;color:var(--body)}

/* Full-bleed painted band */
.band{position:relative;overflow:hidden;border-top:1px solid var(--rule);padding:160px 0}
.band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
.band:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,20,23,.94) 0%,rgba(14,20,23,.8) 45%,rgba(14,20,23,.35) 100%)}
.band .wrap{position:relative;z-index:1}
.band h2{max-width:18em}
.band .body{color:var(--body);margin-top:24px;max-width:34em}

/* Service cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule);border-left:1px solid var(--rule);margin-top:48px}
.cards a{display:block;padding:28px 28px 34px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.cards a:hover{background:var(--raise)}
.cards b{display:block;font-weight:500;font-size:18px;margin-bottom:8px}
.cards p{color:var(--quiet);font-size:15px}
.qs{padding:64px 0}
.qs .faq{margin-top:0}

/* Small screens */
@media (max-width:900px){
  .top nav .hide-s{display:none}
  .top nav .join{display:none}
  .menu{display:inline-block}
  .hero{min-height:auto}
  .hero .stage{top:64px;bottom:auto;height:60vh;background-position:24% 30%}
  .hero .stage video{object-position:24% 30%}
  .hero .stage:after{background:linear-gradient(0deg,var(--ground) 2%,rgba(14,20,23,0) 55%),linear-gradient(180deg,rgba(14,20,23,.75) 0%,rgba(14,20,23,0) 22%)}
  .hero .wrap{padding-top:calc(64px + 52vh);padding-bottom:56px}
  .page-head{padding:150px 0 48px}
  .steps,.cards{grid-template-columns:1fr}
  .band{padding:110px 0}
  .band:after{background:linear-gradient(0deg,rgba(14,20,23,.92) 0%,rgba(14,20,23,.82) 100%)}
  .day .t{grid-template-columns:48px 1fr}
  .trust .wrap{grid-template-columns:1fr;gap:28px;padding-bottom:56px}
  section.s{padding:80px 0}
  .split,.honour{grid-template-columns:1fr}
  .honour img{max-width:320px}
  .method{grid-template-columns:1fr}
  .article dl{grid-template-columns:1fr;gap:2px 0}
  .article dt{margin-top:12px}
  .article .chron li{grid-template-columns:1fr;gap:2px}
}
@media (max-width:420px){.top nav{gap:20px;font-size:14px}.wm{font-size:24px}}

/* ---- KayEA additions (Nov 7, 2026) ---- */
/* Status tags: Today / Planned / Illustrative. Text, not colour alone. */
.st{display:inline-block;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--rule);border-radius:999px;padding:3px 10px;color:var(--body);vertical-align:middle;white-space:nowrap}
.st.now{border-color:#5b6b67;color:var(--ink)}
.st.plan{border-style:dashed;color:var(--quiet)}
.st.ill{color:var(--quiet)}
h2 .st,h3 .st,b .st{margin-left:8px}
.status{margin-top:28px;max-width:34em;font-size:14.5px;color:var(--body);border-left:2px solid var(--maple);padding:2px 0 2px 16px}

/* Hero with a briefing example beside the headline */
.hero.brief-hero{align-items:center}
.hero.brief-hero .wrap{display:grid;grid-template-columns:6fr 5fr;gap:clamp(32px,5vw,80px);align-items:center;padding-top:170px;padding-bottom:110px}
.card{background:rgba(20,27,31,.92);border:1px solid var(--rule);border-radius:10px;padding:26px 26px 22px;font-size:15px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.card header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.card header b{font-weight:500;font-size:16px}
.card ol{list-style:none;display:grid;gap:0;border-top:1px solid var(--rule)}
.card li{padding:14px 0;border-bottom:1px solid var(--rule);color:var(--body);line-height:1.5}
.card li small{display:block;color:var(--quiet);font-size:12.5px;margin-top:4px}
.card li.flag{color:var(--ink)}
.card li.flag:before{content:"Check  ";color:var(--maple);font-size:12px;letter-spacing:.06em}
.card .src{margin-top:14px;color:var(--quiet);font-size:12.5px}

/* Two-column today / planned */
.tp{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule);border-left:1px solid var(--rule);margin-top:48px}
.tp>div{padding:28px 28px 32px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.tp h3{font-weight:500;font-size:18px;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.tp ul{list-style:none;display:grid;gap:10px;color:var(--body);font-size:15.5px}
.tp li:before{content:"·  ";color:var(--quiet)}

/* Journey */
.journey{list-style:none;counter-reset:j;display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid var(--rule);margin-top:48px}
.journey li{counter-increment:j;padding:24px 20px 28px 0;border-right:1px solid var(--rule);margin-right:20px;color:var(--quiet);font-size:15px}
.journey li:last-child{border-right:0}
.journey li:before{content:counter(j);display:block;color:var(--maple);font-size:13px;margin-bottom:10px}
.journey b{display:block;color:var(--ink);font-weight:500;margin-bottom:6px}

/* Table for trust */
.grid-t{width:100%;border-collapse:collapse;margin-top:40px;font-size:15px}
.grid-t th,.grid-t td{text-align:left;vertical-align:top;padding:18px 18px 18px 0;border-bottom:1px solid var(--rule)}
.grid-t thead th{font-size:12.5px;letter-spacing:.06em;color:var(--quiet);font-weight:400}
.grid-t tbody th{font-weight:500;color:var(--ink);width:22%}
.grid-t td{color:var(--body)}
.figcap{font-size:12.5px;color:var(--quiet);margin-top:10px}
.follow a.btn{margin-top:32px}

@media (max-width:900px){
  .hero.brief-hero .wrap{grid-template-columns:1fr;padding-top:130px;padding-bottom:64px}
  .hero.brief-hero .stage{height:100%}
  .tp{grid-template-columns:1fr}
  .journey{grid-template-columns:1fr}
  .journey li{border-right:0;margin-right:0;border-bottom:1px solid var(--rule);padding:18px 0}
  .grid-t thead{display:none}
  .grid-t tr{display:grid;padding:14px 0;border-bottom:1px solid var(--rule)}
  .grid-t th,.grid-t td{border:0;padding:4px 0}
  .grid-t tbody th{width:auto}
  .grid-t td:before{content:attr(data-h) "  ";color:var(--quiet);font-size:12px;letter-spacing:.06em}
}

/* Launch-style home: hero caption, phone conversation, uses grid */
.hero .herocap{margin-top:28px;font-size:12.5px;color:var(--quiet);max-width:34em}
.phone{justify-self:center;width:min(360px,100%);background:#0a0f12;border:1px solid var(--rule);border-radius:34px;padding:14px 14px 18px;box-shadow:0 40px 90px rgba(0,0,0,.45)}
.ph-top{display:flex;align-items:center;gap:10px;padding:10px 12px 14px;border-bottom:1px solid var(--rule)}
.ph-top b{font-weight:500;font-size:15px}
.ph-top small{margin-left:auto;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--quiet)}
.ph-sym{width:22px;height:22px;border-radius:50%;border:2px solid var(--ink);position:relative;flex:none}
.ph-sym:before{content:"";position:absolute;left:50%;top:2px;width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-bottom:7px solid var(--north);transform:translateX(-50%)}
.ph-body{display:grid;gap:12px;padding:16px 4px 6px;font-size:14.5px;line-height:1.5}
.ph-body .b{border-radius:18px;padding:11px 14px;max-width:88%}
.ph-body .you{justify-self:end;background:#22302f;color:var(--ink);border-bottom-right-radius:6px}
.ph-body .kay{background:var(--raise);color:var(--body);border:1px solid var(--rule);border-bottom-left-radius:6px;max-width:94%}
.ph-body .kay ol{margin:8px 0 8px 18px;display:grid;gap:8px}
.ph-body .kay p{color:var(--ink)}
.chip{display:inline-block;margin-top:4px;font-size:11px;color:var(--quiet);border:1px solid var(--rule);border-radius:999px;padding:1px 8px;white-space:nowrap}
.ph-act{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--raise);border:1px solid var(--rule);border-radius:14px;padding:10px 12px;font-size:13.5px;color:var(--body)}
.ph-act b{font-weight:500;color:var(--ground);background:var(--ink);border-radius:999px;padding:5px 14px;font-size:13px}
.ph-mic{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;font-size:12px;color:var(--quiet)}
.ph-mic i{width:9px;height:9px;border-radius:50%;background:var(--north)}
.uses{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule);border-left:1px solid var(--rule);margin-top:48px}
.uses>div{padding:26px 26px 30px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.uses b{display:block;font-weight:500;font-size:17px;margin-bottom:8px;color:var(--ink)}
.uses p{color:var(--quiet);font-size:15px;line-height:1.55}
@media (max-width:900px){.uses{grid-template-columns:1fr}}

/* Plain question-and-answer grid (trust) */
.qa{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(32px,5vw,72px);margin-top:48px;border-top:1px solid var(--rule)}
.qa div{padding:26px 0 28px;border-bottom:1px solid var(--rule)}
.qa dt{font-size:13px;letter-spacing:.06em;color:var(--quiet);margin-bottom:10px}
.qa dd{margin:0;font-size:17px;line-height:1.55;color:var(--ink);font-weight:300;max-width:30em}
@media (max-width:900px){.qa{grid-template-columns:1fr}.qa div{padding:20px 0 22px}.qa dd{font-size:16px}}

/* Hero on wide screens: Kay stands at the door on the left; the words sit on the right, over the dark room */
@media (min-width:901px){
  .hero .wrap{padding-left:max(var(--gutter),46%)}
  .hero h1{font-size:clamp(36px,3.7vw,52px)}
  .hero .stage{background-position:30% 40%}
  .hero .stage video{object-position:30% 40%}
  .hero .stage:after{background:
    linear-gradient(270deg,rgba(14,20,23,.96) 0%,rgba(14,20,23,.9) 38%,rgba(14,20,23,.55) 52%,rgba(14,20,23,0) 70%),
    linear-gradient(0deg,var(--ground) 0%,rgba(14,20,23,0) 34%),
    linear-gradient(180deg,rgba(14,20,23,.7) 0%,rgba(14,20,23,0) 18%)}
}