/* ── Delta Time Accelerator — Tomorrow Night palette ── */
:root {
  --bg:       #1d1f21;
  --bg-alt:   #212326;
  --surface:  #282a2e;
  --border:   #2c2e32;
  --muted:    #373b41;
  --comment:  #969896;
  --fg:       #c5c8c6;
  --red:      #cc6666;
  --orange:   #de935f;
  --yellow:   #f0c674;
  --green:    #b5bd68;
  --aqua:     #8abeb7;
  --blue:     #81a2be;
  --purple:   #b294bb;
  --mono:     'SF Mono', ui-monospace, 'Cascadia Code', monospace;
  --sans:     system-ui, -apple-system, sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:.875rem;line-height:1.5;margin:0;padding:0}
a{color:var(--fg);text-decoration:none}

/* ── Full-width wrapper (no max-width constraint) ── */
.wrap{width:100%;margin:0 auto}

/* ── Rainbow stripe ── */
.stripe{height:3px;background:linear-gradient(90deg,var(--red),var(--yellow),var(--green),var(--aqua),var(--blue),var(--purple))}

/* ── Header ── */
.hd{background:var(--surface);padding:.45rem 2rem;display:flex;align-items:baseline;gap:.55rem;flex-wrap:wrap}
.hd .logo{font-size:.88rem;font-weight:600;color:var(--fg);text-decoration:none}
.hd .logo span{color:var(--yellow)}
.hd nav{display:flex;gap:.45rem;font-size:.75rem}
.hd nav a{color:var(--comment)}
.hd nav a:hover{color:var(--fg)}

/* ── Content area ── */
.content{background:var(--bg-alt);padding:0}

/* ── Page container (for text pages: apply, interviews, faq, people) ── */
.page{max-width:38rem;margin:0 auto;padding:.35rem 2rem .5rem}
.page-header{padding:1.2rem 0 .6rem}
.page-header h2{font-size:1.15rem;font-weight:600;margin-bottom:.3rem}
.page-header p{font-size:.78rem;color:var(--comment)}
.page-hero{text-align:center;padding:1.5rem 0 1rem}
.page-hero p{font-size:.78rem;color:var(--comment);max-width:28rem;margin:0 auto .8rem}

/* ── Section dividers ── */
.section{border-top:1px solid var(--border);margin-top:.6rem;padding-top:1rem}
.section + .section{margin-top:.5rem}
.section h3{font-size:.88rem;font-weight:600;margin-bottom:.5rem}
.section h4{font-size:.82rem;font-weight:600;color:var(--yellow);margin-bottom:.3rem;margin-top:.8rem}
.section p{font-size:.8rem;line-height:1.6;color:var(--fg);margin-bottom:.5rem}
.section p:last-child{margin-bottom:0}
.section ul{font-size:.8rem;line-height:1.7;color:var(--fg);padding-left:1.2rem;margin:0}

/* ── FAQ items ── */
.faq-item{margin-bottom:.9rem}
.faq-q{font-size:.82rem;font-weight:600;color:var(--yellow);margin-bottom:.2rem}
.faq-a{font-size:.8rem;line-height:1.6;color:var(--fg)}

/* ── People ── */
.person{margin-bottom:1rem}
.person-name{font-size:.82rem;font-weight:600;color:var(--blue);margin-bottom:.15rem}
.person-role{font-size:.72rem;color:var(--yellow);margin-bottom:.2rem}
.person-bio{font-size:.8rem;line-height:1.6;color:var(--fg)}

/* ── Buttons ── */
.btn{display:inline-block;padding:.35rem .75rem;font-size:.78rem;font-family:inherit;background:var(--yellow);color:var(--bg);border:none;border-radius:4px;cursor:pointer;font-weight:600;text-decoration:none}
.btn:hover{background:var(--aqua)}
.btn-lg{padding:.55rem 1.6rem;font-size:.88rem}
.btn-secondary{background:transparent;color:var(--fg);border:1px solid var(--muted)}
.btn-secondary:hover{border-color:var(--yellow);color:var(--yellow)}

/* ── Links ── */
.link{color:var(--blue)}
.link:hover{text-decoration:underline}
.link-muted{color:var(--comment)}

/* ── Footer ── */
.pg-foot{padding:.6rem 2rem;text-align:center;font-size:.65rem;color:var(--comment);border-top:1px solid var(--border);background:var(--bg-alt);font-family:var(--mono)}
.pg-foot .ver{color:var(--muted)}
.pg-foot a{color:var(--blue);text-decoration:none}
.section-foot{border-top:1px solid var(--border);margin-top:1rem;padding-top:.8rem;margin-bottom:.5rem}
.section-foot p{font-size:.72rem;color:var(--comment)}

/* ════════════════════════════════════════════════════════════
   HOME PAGE — Design 5: Oversized Typography
   ════════════════════════════════════════════════════════════ */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:4rem 5rem}
.hero-eyebrow{font-family:var(--mono);font-size:.6rem;color:var(--yellow);text-transform:uppercase;letter-spacing:.2em;margin-bottom:1.5rem}
.hero-title{font-size:4.5rem;font-weight:700;letter-spacing:-.04em;line-height:1.05;max-width:42rem}
.hero-title em{font-style:normal;color:var(--yellow)}
.hero-tagline{font-family:var(--mono);font-size:.88rem;color:var(--comment);font-style:italic;margin-top:1rem}
.hero-divider{width:4rem;height:3px;background:linear-gradient(90deg,var(--yellow),var(--aqua));margin:2rem 0}
.hero-sub{font-size:1.05rem;color:var(--comment);max-width:32rem;line-height:1.7;margin-bottom:2.5rem}
.hero-ctas{display:flex;gap:.8rem}
.hero-braille{font-family:var(--mono);font-size:.35rem;color:var(--border);letter-spacing:.12em;line-height:.6;overflow:hidden;white-space:nowrap;margin-top:3rem}

/* ── Stats bar ── */
.stats{display:flex;justify-content:center;gap:3rem;padding:1.5rem 2rem;background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border);flex-wrap:wrap}
.stat{text-align:center}
.stat-num{font-family:var(--mono);font-size:1.3rem;font-weight:700;color:var(--yellow)}
.stat-label{font-size:.65rem;color:var(--comment);text-transform:uppercase;letter-spacing:.08em}

/* ── Home sections ── */
.home-section{padding:4rem 5rem;max-width:72rem;margin:0 auto}
.home-section h3{font-size:1.3rem;font-weight:700;margin-bottom:.4rem}
.home-section > p{font-size:.92rem;color:var(--comment);margin-bottom:2rem;max-width:36rem;line-height:1.7}
.home-section .section-eyebrow{font-family:var(--mono);font-size:.6rem;color:var(--yellow);text-transform:uppercase;letter-spacing:.15em;margin-bottom:.6rem}
.home-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:1.5rem;background:var(--border);border:1px solid var(--border);border-radius:8px;overflow:hidden}
.home-card{background:var(--surface);padding:1.3rem 1.4rem;position:relative;transition:background .2s}
.home-card:hover{background:#2c2e32}
.home-card-num{font-family:var(--mono);font-size:1.4rem;font-weight:700;color:var(--muted);margin-bottom:.4rem;line-height:1}
.home-card h4{font-size:.82rem;font-weight:600;color:var(--yellow);margin-bottom:.3rem}
.home-card p{font-size:.75rem;line-height:1.55;color:var(--comment);margin:0}
.home-card-bar{font-family:var(--mono);font-size:.45rem;color:var(--muted);margin-top:.5rem;letter-spacing:.05em}
.home-card-bar .filled{color:var(--green)}

/* ── Timeline (horizontal scroll) ── */
.timeline-section{padding:3rem 2rem;background:var(--bg)}
.timeline-section h3{font-size:1.1rem;font-weight:700;margin-bottom:.3rem;padding:0 3rem}
.timeline-section > p{font-size:.88rem;color:var(--comment);margin-bottom:1.5rem;padding:0 3rem}
.timeline{display:flex;gap:1px;overflow-x:auto;padding:0 3rem 1rem;scrollbar-width:thin;scrollbar-color:var(--muted) var(--bg)}
.timeline-step{min-width:14rem;flex-shrink:0;background:var(--surface);padding:1.2rem 1.4rem;position:relative}
.timeline-step::after{content:'→';position:absolute;right:-.6rem;top:50%;transform:translateY(-50%);color:var(--muted);font-size:.7rem;z-index:1}
.timeline-step:last-child::after{display:none}
.timeline-week{font-family:var(--mono);font-size:.6rem;color:var(--yellow);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.3rem}
.timeline-step h4{font-size:.85rem;font-weight:600;margin-bottom:.2rem}
.timeline-step p{font-size:.72rem;line-height:1.5;color:var(--comment)}
.timeline-bar{font-family:var(--mono);font-size:.5rem;margin-top:.5rem;color:var(--muted);letter-spacing:.05em}
.timeline-bar .done{color:var(--green)}

/* ── Braille texture quote block ── */
.quote-block{position:relative;padding:4rem 2rem;overflow:hidden;background:var(--surface)}
.quote-braille-bg{position:absolute;inset:0;font-family:var(--mono);font-size:.4rem;line-height:.8;color:var(--border);opacity:.3;word-break:break-all;pointer-events:none;overflow:hidden}
.quote-content{position:relative;z-index:1;max-width:36rem;margin:0 auto;text-align:center}
.quote-mark{font-size:4rem;color:var(--yellow);opacity:.3;line-height:1;margin-bottom:-.5rem}
.quote-text{font-size:1.1rem;line-height:1.7;color:var(--fg);font-style:italic}
.quote-cite{font-family:var(--mono);font-size:.72rem;color:var(--comment);margin-top:.8rem;font-style:normal;display:block}
.quote-bar{width:3rem;height:2px;background:var(--yellow);margin:1.5rem auto}

/* ── RFG teaser (home page) ── */
.rfg-teaser{padding:4rem 5rem;max-width:72rem;margin:0 auto;display:flex;align-items:center;gap:3rem;border-top:1px solid var(--border)}
.rfg-teaser-text{flex:1}
.rfg-teaser h3{font-size:1.3rem;font-weight:700;margin-bottom:.4rem}
.rfg-teaser p{font-size:.88rem;color:var(--comment);line-height:1.7;margin-bottom:1rem}
.rfg-teaser-preview{flex-shrink:0;font-family:var(--mono);font-size:.6rem;line-height:1.6;color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:1rem 1.2rem;width:16rem}
.rfg-teaser-preview .tp-num{color:var(--yellow)}
.rfg-teaser-preview .tp-title{color:var(--comment)}

/* ── CTA banner ── */
.cta-banner{padding:4rem 5rem;border-top:1px solid var(--border);position:relative;overflow:hidden}
.cta-banner-bg{position:absolute;inset:0;font-family:var(--mono);font-size:.4rem;line-height:.8;color:var(--border);opacity:.15;word-break:break-all;pointer-events:none;overflow:hidden}
.cta-banner h3{font-size:1.3rem;font-weight:700;margin-bottom:.3rem;position:relative;z-index:1}
.cta-banner p{font-size:.88rem;color:var(--comment);margin-bottom:1.2rem;position:relative;z-index:1}
.cta-banner .btn{position:relative;z-index:1}

/* ── Braille divider (reusable) ── */
.braille-divider{font-family:var(--mono);font-size:.35rem;color:var(--border);letter-spacing:.12em;text-align:center;padding:.3rem 0;overflow:hidden;white-space:nowrap;line-height:.6}

/* ── RFG Header ── */
.rfg-header{padding:4rem 5rem 3rem;border-bottom:1px solid var(--border);text-align:center}
.rfg-header-inner{max-width:36rem;margin:0 auto}
.rfg-header-eyebrow{font-family:var(--mono);font-size:.6rem;color:var(--yellow);text-transform:uppercase;letter-spacing:.2em;margin-bottom:1rem}
.rfg-header-title{font-size:2.5rem;font-weight:700;letter-spacing:-.03em;margin-bottom:.8rem}
.rfg-header-sub{font-size:.95rem;color:var(--comment);line-height:1.7;max-width:34rem}
.rfg-header-braille{font-family:var(--mono);font-size:.35rem;color:var(--border);letter-spacing:.12em;line-height:.6;overflow:hidden;white-space:nowrap;margin-top:2rem}

/* ════════════════════════════════════════════════════════════
   RFG PAGE — Design 8: Sidebar TOC + Long-form Content
   ════════════════════════════════════════════════════════════ */
.rfg-layout{display:grid;grid-template-columns:14rem 1fr;gap:2rem;max-width:56rem;margin:0 auto;padding:3rem 2rem}
.rfg-sidebar{position:sticky;top:2rem;align-self:start}
.rfg-sidebar h2{font-size:1rem;font-weight:700;margin-bottom:.8rem}
.rfg-sidebar .rfg-tabs{flex-direction:column;gap:.3rem;margin-bottom:1rem;border-bottom:none;padding-bottom:0}
.rfg-toc{list-style:none;padding:0}
.rfg-toc li{margin-bottom:.3rem}
.rfg-toc a{font-family:var(--mono);font-size:.72rem;color:var(--comment);text-decoration:none;display:flex;gap:.4rem}
.rfg-toc a:hover{color:var(--yellow)}
.rfg-toc .toc-num{color:var(--muted);min-width:2ch}
.rfg-main{min-width:0}
.rfg-main .rfg-intro{color:var(--comment);font-size:.85rem;margin-bottom:1.5rem;line-height:1.7}
.rfg-main h3{font-size:.88rem;font-weight:600;margin-top:1.5rem;margin-bottom:.3rem;color:var(--fg)}
.rfg-main h3 a{color:var(--border);font-size:.7rem;text-decoration:none;margin-left:.3rem}
.rfg-main h3 a:hover{color:var(--yellow)}
.rfg-main p{font-size:.8rem;line-height:1.65;color:var(--comment);margin-bottom:1rem}
.rfg-braille{font-family:var(--mono);font-size:.35rem;color:var(--border);letter-spacing:.12em;line-height:.6;overflow:hidden;white-space:nowrap;margin:.6rem 0}

@media(max-width:768px){
  .hero{padding:2.5rem 1.5rem;min-height:auto}
  .hero-title{font-size:2.5rem}
  .home-section{padding:2rem 1.5rem}
  .home-cards{grid-template-columns:1fr}
  .rfg-teaser{flex-direction:column;padding:2rem 1.5rem}
  .rfg-teaser-preview{width:100%}
  .rfg-header{padding:2.5rem 1.5rem 2rem}
  .rfg-header-title{font-size:1.8rem}
  .cta-banner{padding:2rem 1.5rem}
  .timeline-section h3,.timeline-section > p{padding:0 1.5rem}
  .timeline{padding:0 1.5rem 1rem}
  .rfg-layout{grid-template-columns:1fr;padding:2rem 1.5rem}
  .rfg-sidebar{position:static}
  .stats{gap:1.5rem}
  .hd{padding:.45rem 1.5rem}
  .pg-foot{padding:.6rem 1.5rem}
  .de-title{font-size:2rem}
  .de-corner{display:none}
}

/* ════════════════════════════════════════════════════════════
   HOME PAGE — Design E: Full Atmosphere
   ════════════════════════════════════════════════════════════ */
.content{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:4rem 2rem;overflow:hidden}
.de-texture-top{position:absolute;top:0;left:0;right:0;height:40%;font-family:var(--mono);font-size:.45rem;line-height:.85;color:var(--border);opacity:.12;word-break:break-all;pointer-events:none;overflow:hidden}
.de-texture-bot{position:absolute;bottom:0;left:0;right:0;height:40%;font-family:var(--mono);font-size:.45rem;line-height:.85;color:var(--border);opacity:.08;word-break:break-all;pointer-events:none;overflow:hidden}
.de-content{position:relative;z-index:1}
.de-logo{font-size:1rem;font-weight:600;margin-bottom:3rem;letter-spacing:.02em}
.de-logo span{color:var(--yellow)}
.de-rainbow{width:100%;max-width:48rem;height:2px;background:linear-gradient(90deg,var(--red),var(--yellow),var(--green),var(--aqua),var(--blue),var(--purple));margin:0 auto 3rem;opacity:.6}
.de-title{font-size:3.2rem;font-weight:700;letter-spacing:-.03em;line-height:1.1;max-width:32rem;margin:0 auto 2.5rem}
.de-title em{font-style:normal;color:var(--yellow)}
.de-cta{display:inline-block;padding:.55rem 1.6rem;font-size:.85rem;font-family:var(--sans);background:var(--yellow);color:var(--bg);border-radius:4px;font-weight:600;position:relative;text-decoration:none}
.de-cta:hover{background:var(--aqua)}
.de-cta::after{content:'→';margin-left:.4rem;font-size:.75rem}
.de-stripe-bottom{position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--red),var(--yellow),var(--green),var(--aqua),var(--blue),var(--purple))}
.de-corner{position:absolute;font-family:var(--mono);font-size:.55rem;color:var(--muted);z-index:1}
.de-corner.tl{top:2rem;left:2rem}
.de-corner.br{bottom:2rem;right:2rem}
