@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500;600;700&display=swap');

:root { --night:#070f1b; --night-soft:#101d2d; --ink:#18212a; --muted:#68727d; --paper:#f5f2eb; --paper-deep:#ebe6dc; --gold:#dfb96e; --blue:#8bb9d5; --blue-soft:#d3e6f0; --line:rgba(24,33,42,.14); --serif:Georgia,'Times New Roman',serif; --sans:'DM Sans',Arial,sans-serif; --display:'Manrope','DM Sans',Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:2rem; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); font-size:18px; line-height:1.7; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
.skip-link { position:fixed; top:0; left:1rem; z-index:100; padding:.7rem 1rem; color:var(--night); background:#fff; transform:translateY(-120%); }
.skip-link:focus { transform:translateY(0); }
.site-header { position:absolute; inset:0 0 auto; z-index:10; display:flex; align-items:center; justify-content:space-between; max-width:1260px; margin:0 auto; padding:1.4rem 2rem; color:rgba(255,255,255,.9); }
.brand { display:inline-flex; align-items:center; gap:.7rem; font-family:var(--display); font-size:.95rem; font-weight:600; letter-spacing:.02em; text-decoration:none; }
.brand-mark { display:grid; width:2.3rem; height:2.3rem; place-items:center; border:1px solid rgba(255,255,255,.42); border-radius:50%; font-size:.7rem; letter-spacing:.08em; }
.site-header nav { display:flex; gap:1.8rem; font-size:.8rem; }
.site-header nav a { text-decoration-color:transparent; text-underline-offset:.3rem; }
.site-header nav a:hover,.site-header nav a:focus-visible { text-decoration-color:currentColor; }

.hero { position:relative; display:grid; min-height:min(920px,100svh); place-items:center; overflow:hidden; color:#fff; background:radial-gradient(circle at 50% 46%,rgba(74,126,157,.4),transparent 24rem),radial-gradient(circle at 15% 82%,rgba(107,84,130,.15),transparent 30rem),linear-gradient(145deg,#050b14,#101e31 58%,#07101c); }
.stars { position:absolute; inset:0; opacity:.48; background-image:radial-gradient(circle,#fff 0 1px,transparent 1.3px),radial-gradient(circle,var(--gold) 0 1px,transparent 1.4px); background-position:0 0,47px 73px; background-size:137px 151px,191px 173px; }
.stars-two { opacity:.18; transform:rotate(19deg) scale(1.25); background-size:211px 239px,271px 219px; }
.presence-ring { position:absolute; width:min(67vw,690px); aspect-ratio:1; border:1px solid rgba(223,185,110,.2); border-radius:50%; }
.ring-two { width:min(88vw,930px); border-color:rgba(139,185,213,.07); }
.hero-content { position:relative; z-index:2; max-width:1000px; padding:8rem 1.5rem 4rem; text-align:center; }
.eyebrow,.section-label,.card-label { margin:0 0 .9rem; color:var(--gold); font-family:var(--display); font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.hero h1 { margin:0; font-family:var(--serif); font-size:clamp(4.2rem,10vw,8.6rem); font-weight:400; letter-spacing:-.055em; line-height:.84; }
.hero-message { margin:2.5rem 0 1.2rem; color:rgba(255,255,255,.94); font-family:var(--serif); font-size:clamp(2rem,4.5vw,4.1rem); line-height:1.04; }
.hero-summary { max-width:690px; margin:0 auto 2.5rem; color:rgba(255,255,255,.65); font-size:1rem; }
.scroll-cue { color:rgba(255,255,255,.56); font-size:.7rem; letter-spacing:.1em; text-decoration:none; text-transform:uppercase; }
.scroll-cue span { display:block; margin-top:.4rem; color:var(--gold); font-size:1.2rem; }

.section-shell { width:min(100% - 3rem,1120px); margin:0 auto; }
h2,h3 { font-family:var(--serif); font-weight:400; letter-spacing:-.03em; line-height:1.08; }
h2 { margin:0; font-size:clamp(2.5rem,5vw,4.8rem); }
h3 { margin:0; font-size:clamp(1.7rem,3vw,2.5rem); }
p { margin:0 0 1.1rem; }
.lead { font-family:var(--serif); font-size:clamp(1.45rem,2.8vw,2rem); line-height:1.4; }

.instant { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(3rem,9vw,9rem); padding:clamp(5rem,10vw,9rem) 0; }
.instant-practice .quiet-line { margin-top:2rem; padding:1.3rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:var(--muted); font-family:var(--serif); font-size:1.2rem; }

.mind-section { padding:clamp(5rem,10vw,9rem) 0; color:#fff; background:var(--night); }
.mind-heading { display:grid; grid-template-columns:1.3fr .7fr; gap:3rem; align-items:end; }
.mind-heading .section-label { grid-column:1/-1; }
.mind-heading > p:last-child { color:rgba(255,255,255,.56); }
.mind-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; margin-top:4rem; border:1px solid rgba(255,255,255,.11); background:rgba(255,255,255,.11); }
.mind-grid article { min-height:310px; padding:clamp(1.7rem,4vw,3rem); background:var(--night); }
.mind-grid span { color:var(--gold); font-family:var(--display); }
.mind-grid h3 { margin:3.8rem 0 1rem; font-size:1.8rem; }
.mind-grid p { color:rgba(255,255,255,.54); }
.witness { margin-top:5rem; padding-top:4rem; border-top:1px solid rgba(255,255,255,.12); }
.witness blockquote { margin:0; color:var(--blue-soft); font-family:var(--serif); font-size:clamp(2.2rem,5vw,4.5rem); line-height:1.12; }

.time-section { padding:clamp(5rem,10vw,9rem) 0; }
.time-heading { margin-bottom:3rem; }
.time-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.3rem; }
.time-card { min-height:380px; padding:clamp(2rem,5vw,4rem); border:1px solid var(--line); border-radius:.7rem; }
.time-card h3 { margin:0 0 1.5rem; }
.time-card .signal { margin-top:3rem; padding-top:1.2rem; border-top:1px solid var(--line); color:var(--muted); font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; }
.psychological { color:rgba(255,255,255,.82); background:var(--night-soft); }
.psychological .signal { border-color:rgba(255,255,255,.12); color:var(--gold); }
.time-conclusion { max-width:850px; margin:3rem auto 0; font-family:var(--serif); font-size:clamp(1.5rem,3vw,2.2rem); line-height:1.35; text-align:center; }

.doors { padding:clamp(5rem,10vw,9rem) 0; background:var(--paper-deep); }
.doors-heading { display:grid; grid-template-columns:1.2fr .8fr; gap:3rem; align-items:end; }
.doors-heading .section-label { grid-column:1/-1; }
.doors-heading > p:last-child { color:var(--muted); }
.doors-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; margin-top:4rem; border:1px solid var(--line); background:var(--line); }
.doors-grid article { min-height:270px; padding:clamp(1.8rem,4vw,3rem); background:var(--paper-deep); }
.doors-grid span { display:grid; width:2.7rem; height:2.7rem; margin-bottom:2.2rem; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--gold); font-size:1.3rem; }
.doors-grid h3 { margin-bottom:1rem; font-size:1.9rem; }

.emotion-section,.relationships,.sources { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(3rem,9vw,9rem); padding:clamp(5rem,10vw,9rem) 0; }
.emotion-section ol { margin:2rem 0; padding:0; list-style:none; }
.emotion-section li { display:flex; align-items:center; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); }
.emotion-section li span { display:grid; width:2rem; height:2rem; flex:none; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--muted); font-size:.7rem; }
.note { padding:1.2rem 1.4rem; border-left:2px solid var(--gold); color:var(--muted); background:rgba(255,255,255,.3); font-size:.82rem; }

.acceptance { padding:clamp(5rem,10vw,9rem) 0; color:#fff; background:radial-gradient(circle at 80% 20%,rgba(139,185,213,.18),transparent 25rem),var(--night); }
.acceptance-content h2 { max-width:900px; }
.acceptance-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; max-width:950px; margin-top:3rem; color:rgba(255,255,255,.62); }
.acceptance-formula { display:flex; flex-wrap:wrap; align-items:center; gap:.8rem; margin-top:4rem; }
.acceptance-formula span { padding:.7rem 1rem; border:1px solid rgba(255,255,255,.14); border-radius:999px; font-size:.75rem; }
.acceptance-formula b { color:var(--gold); font-weight:400; }

.relationships blockquote { margin:2.5rem 0 0; padding-left:1.4rem; border-left:2px solid var(--gold); font-family:var(--serif); font-size:clamp(1.5rem,3vw,2.2rem); line-height:1.3; }

.practice-section { padding:clamp(5rem,10vw,9rem) 0; background:var(--paper-deep); }
.practice-heading { max-width:900px; margin-bottom:4rem; text-align:center; }
.practice-heading p:last-child { max-width:670px; margin:1.5rem auto 0; color:var(--muted); }
.timer-card { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:clamp(3rem,8vw,8rem); padding:clamp(2rem,7vw,6rem); border-radius:1rem; color:#fff; background:var(--night-soft); }
.timer-visual { position:relative; display:grid; width:min(100%,360px); aspect-ratio:1; place-items:center; margin:auto; border:1px solid rgba(255,255,255,.12); border-radius:50%; }
.breath-circle { position:absolute; width:48%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(139,185,213,.42),rgba(139,185,213,.07)); box-shadow:0 0 70px rgba(139,185,213,.18); }
.timer-visual.is-running .breath-circle { animation:breathe 8s ease-in-out infinite; }
@keyframes breathe { 0%,100% { transform:scale(.75); opacity:.65; } 50% { transform:scale(1.25); opacity:1; } }
#timer { position:relative; z-index:1; font-family:var(--display); font-size:clamp(3.2rem,7vw,5.5rem); font-weight:400; letter-spacing:-.07em; }
#instruction { min-height:5rem; color:var(--blue-soft); font-family:var(--serif); font-size:clamp(1.7rem,3.5vw,2.7rem); line-height:1.2; }
button { margin-top:1.5rem; padding:.9rem 1.25rem; border:1px solid var(--gold); border-radius:999px; color:var(--night); background:var(--gold); font:600 .75rem var(--sans); letter-spacing:.05em; cursor:pointer; }
button.secondary { color:#fff; background:transparent; }
button:hover,button:focus-visible { filter:brightness(1.08); }

.daily { padding:clamp(5rem,10vw,9rem) 0; }
.daily-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; margin-top:3rem; border:1px solid var(--line); background:var(--line); }
.daily-grid article { min-height:260px; padding:1.4rem; background:var(--paper); }
.daily-grid span { display:block; margin-bottom:4rem; color:var(--gold); font-family:var(--display); }
.daily-grid p { font-family:var(--serif); font-size:1.12rem; line-height:1.4; }

.connections { padding:0 0 clamp(5rem,10vw,9rem); }
.connection-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; margin-top:2rem; }
.connection-grid a { position:relative; min-height:280px; padding:clamp(1.8rem,4vw,3rem); border:1px solid var(--line); border-radius:.7rem; text-decoration:none; transition:transform .2s ease,background .2s ease,color .2s ease; }
.connection-grid a:hover,.connection-grid a:focus-visible { color:#fff; background:var(--night-soft); transform:translateY(-3px); }
.connection-grid span { color:var(--gold); font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; }
.connection-grid h3 { margin:2.5rem 0 1rem; }
.connection-grid p { color:var(--muted); }
.connection-grid a:hover p,.connection-grid a:focus-visible p { color:rgba(255,255,255,.56); }
.connection-grid b { position:absolute; right:1.5rem; bottom:1.2rem; color:var(--gold); font-weight:400; }

.sources { border-top:1px solid var(--line); }
.sources div { max-width:750px; }
.sources h2 { margin-bottom:1.5rem; }
.sources a { display:inline-block; margin-top:1rem; padding-bottom:.2rem; border-bottom:1px solid var(--ink); font-size:.82rem; font-weight:600; text-decoration:none; }

footer { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:3rem max(1.5rem,calc((100% - 1120px)/2)); color:rgba(255,255,255,.72); background:var(--night); font-size:.8rem; }
.footer-brand .brand-mark { border-color:rgba(255,255,255,.25); }
footer p { margin:0; }

@media (max-width:900px) { .daily-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:720px) {
  body { font-size:16px; }
  .site-header { padding:1rem 1.2rem; }
  .site-header nav a:not(:last-child) { display:none; }
  .section-shell { width:min(100% - 2rem,1120px); }
  .hero { min-height:780px; }
  .hero-content { padding-top:7rem; }
  .instant,.mind-heading,.doors-heading,.emotion-section,.relationships,.sources,.timer-card { grid-template-columns:1fr; gap:2rem; }
  .mind-grid { grid-template-columns:1fr; }
  .mind-grid article { min-height:230px; }
  .time-grid,.doors-grid,.acceptance-grid,.connection-grid { grid-template-columns:1fr; }
  .daily-grid { grid-template-columns:1fr 1fr; }
  .daily-grid article { min-height:210px; }
  .timer-copy { text-align:center; }
  .acceptance-formula { align-items:flex-start; flex-direction:column; }
  .acceptance-formula b { transform:rotate(90deg); }
  footer { align-items:flex-start; flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .timer-visual.is-running .breath-circle { animation:none; } }
