/* Site navigation and small content blocks of the static landing (review 04.10.2026).
   Owned by landing-content; style.css and immersive.css stay with the visual owners.
   build.mjs links this file last on every generated page (home and privacy).

   Menu: wide screens with a precise pointer keep the inline menu from style.css.
   Narrow (up to 1100 px) or touch screens get a compact disclosure menu once app.js
   has enhanced the header (html.nav-ready); the open state is .site-header[data-nav-open].
   Without JavaScript the previous header (blog link only) remains. The #site-menu id
   selector deliberately outranks the older rules that hide .main-nav on these screens.
   Keep the media query in sync with the matchMedia() call in app.js. app.js is
   deferred, so the compact header may first paint the blog link and then the menu
   button; an inline script would be reported by the site-wide CSP (report-only), so
   that small shift is accepted. */
.nav-toggle{display:none}
.nav-toggle-icon{position:relative;display:block;flex:none;width:18px;height:2px;background:currentColor;transition:background .2s}
.nav-toggle-icon:before,.nav-toggle-icon:after{content:'';position:absolute;left:0;width:18px;height:2px;background:currentColor;transition:transform .2s}
.nav-toggle-icon:before{top:-6px}
.nav-toggle-icon:after{top:6px}
.nav-toggle[aria-expanded=true] .nav-toggle-icon{background:transparent}
.nav-toggle[aria-expanded=true] .nav-toggle-icon:before{transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded=true] .nav-toggle-icon:after{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:1100px),(pointer:coarse){
 .nav-ready .site-header .nav-toggle{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:44px;min-height:44px;margin-left:14px;padding:0 16px;border:1px solid #183f354a;border-radius:100px;background:#f3ebddbd;color:#183f35;font-size:16px;font-weight:650;line-height:1}
 .nav-ready .site-header .nav-toggle:hover,.nav-ready .site-header .nav-toggle[aria-expanded=true]{border-color:#183f35}
 .nav-ready .site-header .mobile-blog-link{display:none}
 .nav-ready #site-menu{display:none}
 .nav-ready .site-header[data-nav-open] #site-menu{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;top:100%;left:0;right:0;z-index:40;margin:0;padding:6px 20px 10px;border:1px solid #183f3526;border-top:0;background:#f3ebdd;box-shadow:0 18px 40px #183f351a;font-size:18px;font-weight:600;line-height:1.4}
 .nav-ready #site-menu a{display:flex;align-items:center;min-height:48px;padding:8px 0;border-bottom:1px solid #183f351f;color:#202c25}
 .nav-ready #site-menu a:last-child{border-bottom:0}
 .nav-ready #site-menu a:after{display:none}
 .nav-ready #site-menu a:hover{color:#94452f}
}
/* Icon-only button on phones and small tablets; the label stays the accessible name. */
@media (max-width:760px){
 .nav-ready .site-header .nav-toggle{width:44px;padding:0;margin-left:10px}
 .nav-toggle-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}

/* Content additions from the same review. Visual owners may fold these rules into
   style.css or immersive.css later. */
.belief-copy>p+p{margin-top:1em}
.scene-legend summary{display:inline-flex;align-items:center;min-height:44px;cursor:pointer;font-weight:600;color:#183f35}
.scene-legend[open] summary{margin-bottom:4px}
.author-career{margin-top:14px}
.home-articles{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:36px 8%;align-items:start}
.home-articles-heading h2{margin-top:22px;font-size:clamp(40px,4.4vw,72px);line-height:1.1;letter-spacing:-.06em;color:#183f35}
.home-articles-heading>p:not(.eyebrow){margin-top:22px;max-width:42ch;font-size:var(--reading-size,20px);line-height:1.65;color:#455b4b}
.home-articles-list{list-style:none;margin:0;padding:0;border-top:1px solid #183f3540}
.home-articles-list a{display:block;padding:20px 0;border-bottom:1px solid #183f3540}
.home-articles-list a:hover strong{color:#94452f}
.home-article-meta{display:block;font-size:16px;line-height:1.5;color:#59685f}
.home-articles-list strong{display:block;margin-top:6px;font-size:clamp(20px,1.45vw,24px);font-weight:600;line-height:1.4;color:#183f35}
.home-articles-body .text-link{margin-top:24px}
@media (max-width:1000px){.home-articles{grid-template-columns:minmax(0,1fr);gap:28px}}
