/* Home and groups. Dark ground, one neon accent, a clean grotesk with italic
   emphasis, mono micro-labels, pill buttons and a floating call to action.
   Ember is FIREBIRD's accent: the colour of a day that felt lit. */
.home{--bg:#0a0a0b;--panel:#131315;--panel-2:#1b1b1e;--line:#ffffff1c;--line-2:#ffffff33;--text:#f4f3ef;--muted:#a3a19b;--dim:#6f6d68;
  --ember:#ff5b1f;--ember-ink:#0a0a0b;
  background:var(--bg);color:var(--text);padding-bottom:96px}
.home h1,.home h2,.home h3{font-family:var(--sans);font-weight:500;color:var(--text);text-wrap:balance}
.home h1{font-size:clamp(42px,6.4vw,88px);letter-spacing:-.045em;line-height:1}
.home h2{font-size:clamp(32px,4.4vw,60px);letter-spacing:-.04em;line-height:1.04;max-width:18ch}
.home h3{font-size:20px;letter-spacing:-.02em;line-height:1.25}
.home h1 em,.home h2 em{font-style:italic;font-weight:400;color:var(--text)}
.home h1 span{color:var(--muted)}
.home p{text-wrap:pretty;color:var(--muted)}
.home .eyebrow{font:500 11px/1.6 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.home ::selection{background:var(--ember);color:var(--ember-ink)}
.home :focus-visible{outline:2px solid var(--ember);outline-offset:4px}
.home .wrap{width:min(1200px,calc(100% - 48px))}

/* Navigation: a floating glass bar. */
.home .nav-shell{position:sticky;top:12px;z-index:20;background:transparent;border:0;padding-inline:12px;transition:none}
.home .nav{min-height:60px;margin-top:12px;padding:0 10px 0 20px;background:transparent;border-radius:999px;position:relative}
.home .nav:before{content:"";position:absolute;inset:0;border-radius:999px;background:#18181bcc;border:1px solid var(--line);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);z-index:-1}
.home .wordmark{font:600 15px var(--sans);letter-spacing:.14em;color:var(--text)}
.home .wordmark img{width:22px;height:22px;filter:brightness(0) invert(1)}
.home .nav-links{gap:26px}
.home .nav-links a:not(.button){color:var(--muted);font-size:13px}.home .nav-links a:not(.button):hover{color:var(--text)}
.home .button{border-radius:999px;min-height:52px;padding:12px 26px;gap:8px;background:var(--ember);border:1px solid var(--ember);color:var(--ember-ink);font-weight:600;transition:transform .15s,filter .15s}
.home .button:hover{background:var(--ember);border-color:var(--ember);filter:brightness(1.08)}
.home .button:active{transform:scale(.98)}
.home .nav .button{min-height:40px;padding:8px 18px;font-size:13px}
.home .text-link{color:var(--text);text-decoration-color:var(--line-2)}
.home .text-link:hover{text-decoration-color:var(--ember)}

/* Hero: centred claim, proof line, then the product doing it. */
.home .hero{padding-block:clamp(56px,9vw,120px) clamp(48px,7vw,96px)}
.home .hero-grid{display:grid;grid-template-columns:1fr;justify-items:center;gap:clamp(40px,6vw,72px)}
.home .hero-copy{background:transparent;text-align:center;display:grid;justify-items:center}
.home .hero .eyebrow{display:inline-block;padding:6px 12px;border:1px solid var(--line);border-radius:999px;color:var(--text);margin-bottom:28px;background:var(--panel)}
.home .hero h1{max-width:15ch}
.home .hero .lead{color:var(--muted);max-width:44ch;margin:26px auto 0}
.home .hero .actions{margin-top:36px;justify-content:center;gap:10px 26px}
.home .hero .actions .button{min-width:min(100%,320px);min-height:58px;font-size:16px}
.home .fine-line{font:400 12px/1.6 var(--mono);letter-spacing:.06em;color:var(--dim);margin-top:18px;max-width:52ch}
.home .fine-line a{color:var(--muted)}

/* The demo */
.home .demo{width:min(100%,760px);background:var(--panel);border:1px solid var(--line);border-radius:28px;padding:clamp(20px,3vw,34px);box-shadow:0 40px 120px -60px #ff5b1f40}
.home .demo-head{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center}
.home .demo-chips{display:flex;flex-wrap:wrap;gap:8px}
.home .demo-chips button{min-height:38px;padding:8px 15px;border-radius:99px;border:1px solid var(--line-2);background:transparent;color:var(--text);font-size:13px}
.home .demo-chips button:hover{border-color:var(--text)}
.home .demo-chips button[aria-pressed=true]{background:var(--text);border-color:var(--text);color:var(--bg)}
.home .demo-days{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:clamp(3px,.7vw,8px);align-items:end;height:170px;margin-top:28px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.home .demo-day{position:relative;height:100%;display:flex;align-items:flex-end}
.home .demo-day i{display:block;width:100%;border-radius:6px 6px 2px 2px;background:#2a2a2e;transition:background .25s}
.home .demo-day.on i{background:var(--ember);box-shadow:0 0 24px -6px var(--ember)}
.home .demo-day.unrated i{background:transparent;border:1px dashed #3a3a3f}
.home .demo-day b{position:absolute;bottom:-21px;left:0;right:0;text-align:center;font:10px var(--mono);font-weight:400;color:var(--dim)}
.home .demo-day.weekend b{color:var(--muted)}
.home .demo-key{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px;font:11px var(--mono);letter-spacing:.04em;color:var(--dim)}
.home .demo-key>span{display:inline-flex;align-items:center;gap:7px}
.home .demo-key i{width:10px;height:10px;border-radius:3px;background:#2a2a2e}.home .demo-key i.on{background:var(--ember)}
.home .demo-scale{margin-left:auto}
.home .demo-finding{margin-top:24px;min-height:160px;text-align:left}
.home .demo-finding .eyebrow{color:var(--ember)}
.home .demo-sentence{font:500 clamp(23px,2.5vw,30px)/1.12 var(--sans);letter-spacing:-.03em;color:var(--text);margin-top:8px;max-width:24ch}
.home .demo-finding p+p{margin-top:10px;font-size:14px}
.home .sample-caption{font:11px/1.6 var(--mono);letter-spacing:.04em;color:var(--dim);margin-top:16px;text-align:left}

/* Bands */
.home .band{padding-block:clamp(80px,10vw,136px)}
.home .band.sand{background:var(--bg);border-top:1px solid var(--line)}
.home .band.ink{background:var(--panel);border-top:1px solid var(--line);color:var(--text)}
.home .band-head{margin-bottom:clamp(36px,5vw,64px);text-align:center;display:grid;justify-items:center}
.home .band-head h2{margin-inline:auto}
.home .band-head .eyebrow,.home .split>div>.eyebrow{margin-bottom:18px}
.home .band .lead{color:var(--muted);margin-top:20px;max-width:44ch}
.home .ink .lead,.home .ink p{color:var(--muted)}
.home h2 em{color:var(--ember);font-style:italic}
.home .split{align-items:start;gap:clamp(40px,7vw,96px)}

/* How it works: three numbered columns. */
.home .steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.home .steps li{padding:28px;border:1px solid var(--line);border-radius:24px;background:var(--panel)}
.home .steps .eyebrow{margin-bottom:28px;color:var(--ember)}
.home .steps p{margin-top:10px}
.home .ramp{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:22px;max-width:300px}
.home .ramp span{font:10px var(--mono);text-align:center;padding-top:14px;color:var(--dim);position:relative}
.home .ramp span:before{content:"";position:absolute;top:0;left:0;right:0;height:6px;border-radius:99px;background:#3a3a3f}
.home .ramp span:nth-child(2):before{background:#6b4b3c}.home .ramp span:nth-child(3):before{background:#a2512f}
.home .ramp span:nth-child(4):before{background:#d65727}.home .ramp span:nth-child(5):before{background:var(--ember)}
.home .ramp span:nth-child(5){color:var(--text)}

/* Principles */
.home .three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,56px)}
.home .three>div{padding-top:22px;border-top:1px solid var(--line-2)}
.home .three p{margin-top:10px;font-size:15px}

/* Try it: the one full-colour band. */
.home .together{background:var(--ember);color:var(--ember-ink)}
.home .together h2,.home .together h3,.home .together p,.home .together .lead{color:var(--ember-ink)}
.home .together .eyebrow{color:#0a0a0bb3}
.home .together h2 em{color:var(--ember-ink)}
.home .together .button{background:var(--ember-ink);border-color:var(--ember-ink);color:var(--text)}
.home .together .text-link{color:var(--ember-ink);text-decoration-color:#0a0a0b66}
.home .together .actions{margin-top:32px;gap:8px 24px}
.home .together-note{background:var(--bg);color:var(--text);border-radius:28px;padding:clamp(24px,3.4vw,40px)}
.home .together-note .eyebrow{color:var(--muted)}
.home .together-note h3{font:500 clamp(28px,3vw,38px)/1.06 var(--sans);letter-spacing:-.035em;color:var(--text);margin:14px 0}
.home .together-note p{color:var(--muted);font-size:15px;max-width:34ch}
.home .seven-days{display:flex;gap:8px;margin:26px 0 18px}
.home .seven-days span{flex:1 1 0;min-width:0;max-width:36px;aspect-ratio:1;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;font:11px var(--mono);color:var(--muted)}
.home .seven-days span:nth-child(-n+3){background:var(--ember);border-color:var(--ember);color:var(--ember-ink)}
.home .hero .together-note{border:1px solid var(--line)}

/* Yours */
.home .plain{list-style:none;margin:0;padding:0}
.home .plain li{padding:20px 0;border-top:1px solid var(--line);color:var(--muted);max-width:56ch}
.home .plain li:first-child{border-top:0;padding-top:0}
.home .plain strong{color:var(--text);font-weight:500}
.home .plain a{color:var(--text)}

/* Questions: numbered rows. */
.home .questions .wrap{counter-reset:q}
.home details{border-top:1px solid var(--line);counter-increment:q}.home details:last-of-type{border-bottom:1px solid var(--line)}
.home summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;min-height:76px;padding:16px 0;font-size:18px;font-weight:400;letter-spacing:-.01em;color:var(--text)}
.home summary:before{content:counter(q,decimal-leading-zero);font:11px var(--mono);color:var(--dim)}
.home summary::-webkit-details-marker{display:none}
.home summary:after{content:"+";font:300 26px/1 var(--sans);color:var(--text);transition:transform .2s}
.home details[open] summary:after{transform:rotate(45deg)}
.home details[open] summary{color:var(--ember)}
.home details p{color:var(--muted);padding:0 0 24px 56px;max-width:66ch}
.home details p a{color:var(--text)}
.home details video{display:block;width:min(100%,300px);height:auto;border-radius:20px;margin:4px 0 16px 56px}
.home details .sample-caption{padding-left:56px}

/* Invite */
.home .invite-section .text-link{display:inline-block;margin-top:20px}
.home .invite-section .field{color:var(--text)}
.home .invite-section .field small{color:var(--dim)}
.home .invite-section .field input,.home .invite-section .field textarea{background:var(--bg);border-color:var(--line-2);color:var(--text);border-radius:14px}
.home .invite-section .field input:focus,.home .invite-section .field textarea:focus{border-color:var(--ember)}
.home .invite-section .field input::placeholder,.home .invite-section .field textarea::placeholder{color:var(--dim)}
.home .invite-section .fine-line,.home .invite-section .fine-line a{color:var(--dim)}
.home .form-message{min-height:22px;margin-top:14px;font-size:14px;color:var(--text)}
.home .form-message.bad{color:#ff9b7a}
.home #requested h3{font-size:38px;letter-spacing:-.035em;margin:12px 0}

/* Floating call to action */
.home .dock{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:30;display:flex;align-items:center;gap:20px;width:min(calc(100% - 24px),460px);padding:10px 10px 10px 22px;border-radius:999px;background:#18181bf0;border:1px solid var(--line-2);box-shadow:0 20px 60px -20px #000;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.home .dock span{flex:1;min-width:0;font-size:13px;line-height:1.35;color:var(--muted)}
.home .dock strong{display:block;color:var(--text);font-weight:600}
.home .dock a{flex:0 0 auto;display:inline-flex;align-items:center;min-height:40px;padding:8px 18px;border-radius:999px;background:var(--ember);color:var(--ember-ink);font:600 13px var(--sans);text-decoration:none}

/* Footer */
.home .footer-band{background:var(--bg);color:var(--dim);border-top:1px solid var(--line)}
.home .footer{border-top:0;color:inherit}
.home .footer .wordmark{color:var(--text);font-size:14px}
.home .footer a{text-decoration:none;color:var(--muted)}.home .footer a:hover{color:var(--text)}

@media(max-width:960px){
  .home .steps,.home .three{grid-template-columns:1fr}
}
@media(max-width:800px){
  .home .wrap{width:calc(100% - 32px)}
  .home .nav-shell{padding-inline:8px;top:8px}
  .home .nav{flex-wrap:nowrap;min-height:54px;padding:0 6px 0 16px;margin-top:8px}
  .home .nav .wordmark{width:auto;font-size:14px}
  .home .nav-links{flex:0 1 auto;width:auto;gap:14px}
  .home .demo-scale{margin-left:0;width:100%}
  .home .demo-finding{min-height:200px}
  .home details p,.home details .sample-caption{padding-left:0}.home details video{margin-left:0}
  .home summary{grid-template-columns:32px 1fr auto;font-size:16px}
}
@media(max-width:400px){
  .home .nav-links .group-nav{display:none}
  .home .demo-chips button{padding-inline:11px}
  .home .demo-day b{font-size:9px}
  .home .dock{gap:10px;padding-left:16px}.home .dock span{font-size:12px}
}
@media(prefers-reduced-transparency:reduce){
  .home .nav:before,.home .dock{background:#18181b;backdrop-filter:none;-webkit-backdrop-filter:none}
  .home .nav-shell{backdrop-filter:none;-webkit-backdrop-filter:none}
}