/* Hero Journeys: a night sky and a star map. Deep blue-black, starlight gold, parchment for the printed page. */
@font-face{font-family:"Cormorant";src:url(/assets/fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Cormorant";src:url(/assets/fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(/assets/fonts/source-sans-3-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(/assets/fonts/source-sans-3-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
:root{--sky:#0b1026;--sky-2:#141b3d;--dusk:#232a55;--gold:#f2d98a;--gold-d:#c9a94e;--star:#fffbe9;--mist:#c5cbe6;--head:"Cormorant",Georgia,serif;--body:"Source Sans 3",system-ui,sans-serif;--w:68rem;--pad:clamp(1.1rem,4vw,2.5rem)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:400 1.1rem/1.65 var(--body);color:var(--star);background:var(--sky)}
h1,h2{font-family:var(--head);font-weight:600;line-height:1.05;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2.6rem,6vw,4.8rem)}h2{font-size:clamp(2.1rem,4.5vw,3.3rem);color:var(--gold)}
p{margin:0 0 1em}a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.skip{position:absolute;left:-999px}.skip:focus{left:.5rem;top:.5rem;background:#fff;color:#000;padding:.5rem 1rem;z-index:9}
.wrap{max-width:var(--w);margin-inline:auto;padding-inline:var(--pad)}.narrow{max-width:46rem}
.lead{font-size:clamp(1.15rem,1.8vw,1.35rem);color:var(--mist);max-width:36rem}
.top .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.4rem 1.5rem;padding-block:.9rem}
.brand{font:600 1.7rem var(--head);text-decoration:none;color:var(--gold)}
.top nav{display:flex;gap:1.4rem}.top nav a{text-decoration:none;border-bottom:1px solid transparent}.top nav a:hover{border-color:var(--gold)}
.night{background:var(--sky) radial-gradient(1px 1px at 12% 18%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 78% 9%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 34% 62%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 91% 44%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 57% 83%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 6% 71%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 66% 30%,#fff 50%,transparent 51%),radial-gradient(ellipse at 70% 0,rgba(60,74,150,.5),transparent 60%)}
.dusk{background:var(--dusk)}
.sect{padding-block:clamp(3.2rem,8vw,6rem)}
.hero{display:grid;gap:2rem;align-items:center;padding-block:clamp(2.5rem,7vw,5rem)}
@media (min-width:58rem){.hero{grid-template-columns:1.15fr 1fr}}
.btn{display:inline-block;font:600 1.08rem var(--body);background:var(--gold);color:var(--sky);text-decoration:none;border:0;padding:.9rem 1.5rem;border-radius:2px;cursor:pointer}
.btn:hover{background:#f8e6a8}
.map{margin:0;text-align:center}.map figcaption{font:500 italic 1.25rem var(--head);color:var(--gold)}
.sky{width:min(100%,27rem)}
.ring{fill:none;stroke:rgba(197,203,230,.35);stroke-width:1;stroke-dasharray:3 5}
.star circle{fill:var(--sky-2);stroke:var(--mist);stroke-width:1.5;transition:fill .3s ease,r .3s ease}
.star text{fill:var(--mist);font:600 15px var(--body);text-anchor:middle}
.star.lit circle{fill:var(--gold);stroke:var(--star);r:10px;filter:drop-shadow(0 0 7px rgba(242,217,138,.9))}
.star.lit text{fill:var(--gold)}
.mid{fill:var(--mist);font:500 italic 30px var(--head);text-anchor:middle}
.qs{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:1.6rem}
.q label{display:grid;grid-template-columns:2.6rem 1fr;gap:.1rem .8rem;margin-bottom:.6rem}
.n{grid-row:span 2;font:600 2.3rem/1 var(--head);color:var(--gold-d)}
.stage{font:500 italic 1.3rem var(--head);color:var(--gold)}
.ask{font-size:1.14rem}
.q textarea,.name input{width:100%;font:inherit;color:var(--star);background:rgba(20,27,61,.85);border:1px solid #4a5490;border-radius:2px;padding:.75rem .9rem;line-height:1.5}
.q textarea{resize:vertical;min-height:5.5rem}
.q.filled textarea{border-color:var(--gold-d)}
.name label{display:block;font-weight:600;margin-bottom:.35rem}.name{margin-top:1.5rem}
.go{display:flex;flex-wrap:wrap;gap:1rem 1.5rem;align-items:center;margin-block:2rem 1rem}
.plain{background:none;border:0;color:var(--mist);text-decoration:underline;font:inherit;cursor:pointer;padding:0}
.fine{font-size:.94rem;color:var(--mist)}
.srcs{padding-left:1.2rem}.srcs a{color:var(--gold);word-break:break-all}
sup.ref a{color:var(--gold);text-decoration:none;font-weight:600;font-size:.75em}
.foot{border-top:1px solid #2a3264;padding-block:2rem 1.4rem;color:var(--mist);font-size:.96rem}.copy{opacity:.7;font-size:.85rem}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.star circle{transition:none}}
@media print{
  @page{margin:16mm}
  body{background:#fff;color:#111;font-size:10.5pt;line-height:1.4}
  .top,.foot,.hero,.dusk,.go,.fine,.lead,.skip{display:none}
  .night{background:none}.sect{padding:0}
  h2{color:#111;font-size:22pt;margin-bottom:2mm}
  .name label{display:none}.name input{border:0;background:none;color:#111;font:500 italic 15pt "Cormorant",Georgia,serif;padding:0;margin-bottom:3mm}
  .qs{gap:3.2mm}.q{break-inside:avoid}.q label{grid-template-columns:8mm 1fr;margin:0}
  .n{font-size:13pt;color:#8a6d1a}.stage{color:#8a6d1a;font-size:11.5pt}.ask{display:none}
  .q textarea{border:0;background:none;color:#111;padding:0 0 0 calc(8mm + .8rem);min-height:0;resize:none;overflow:hidden;font-size:10.5pt}
}