/* Critical CSS — homepage above-the-fold (source of truth) */
@import url('theme-tokens.css');
html{box-sizing:border-box}
*,*:before,*:after{box-sizing:inherit}
body{background:var(--surface);color:var(--ink-muted);font-family:'Figtree','Segoe UI',sans-serif;font-size:1rem;font-weight:400;line-height:1.65;margin:0;padding:0}
h1,h2,h3{color:var(--ink);font-family:'Bricolage Grotesque',Georgia,serif;font-weight:700;line-height:1.15;margin:0 0 1em;letter-spacing:-0.02em}
h1{font-size:2.5em}h2{font-size:1.75em}
a{color:var(--link)}
#main a{color:var(--link);border-bottom:none;text-decoration:underline;text-decoration-color:var(--link-decoration);text-underline-offset:.2em;transition:color .2s ease,text-decoration-color .2s ease}
#main a:hover{color:var(--link-hover);text-decoration-color:var(--link-hover)}
a:focus-visible,.button:focus-visible,#sidebar .toggle:focus-visible,.skip-link:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:1rem;top:1rem;width:auto;height:auto;overflow:visible;z-index:100000;padding:.75em 1.25em;background:var(--accent);color:#fff;text-decoration:none;border-radius:.375em;font-weight:700}
#wrapper{display:flex;flex-direction:row-reverse;min-height:100vh}
#main{flex-grow:1;flex-shrink:1;width:auto;min-width:0;max-width:100%;background:var(--surface);color:var(--ink-muted)}
#sidebar{background:var(--surface-soft);width:26em;flex-grow:0;flex-shrink:0}
.inner{padding:0 0 2rem;margin:0 auto;max-width:calc(100% - 4rem);width:auto}
.image img{border-radius:.375rem;display:block;max-width:100%;height:auto}
.modern-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:stretch;min-width:0;max-width:100%}
.modern-hero .hero-content,.modern-hero .hero-image-wrapper{min-width:0;max-width:100%}
.modern-hero .hero-image-wrapper{position:relative;width:100%;background:var(--surface-band);overflow:hidden;min-height:clamp(280px,42vw,520px);border-radius:.75rem}
.modern-hero .hero-image-wrapper img{display:block;width:100%;height:100%;min-height:clamp(280px,42vw,520px);object-fit:cover;object-position:center top;max-width:none}
.modern-hero .hero-content h1{font-size:clamp(2.35rem,5vw,3.5rem);font-weight:800;line-height:1.05;margin-bottom:1rem}
#header{display:flex;border-bottom:solid 5px var(--accent);padding:6em 0 1em;position:relative}
#header .logo{border-bottom:0;color:inherit;font-size:1.125em;text-decoration:none}
#header .icons{text-align:right;min-width:11em;min-height:2.5em}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.4em;border-radius:var(--radius,.5rem);box-shadow:inset 0 0 0 2px var(--link);color:var(--link);font-size:var(--text-sm,.9375rem);font-weight:600;min-height:2.75rem;letter-spacing:.01em;line-height:1.5;padding:.65em 1.5em;text-align:center;text-decoration:none;text-transform:none}
.button.primary{background-color:var(--button-primary-bg,var(--accent));color:var(--button-primary-fg,#fff);box-shadow:none}
.button.primary:hover{background-color:var(--button-primary-bg,var(--accent));filter:brightness(1.08)}
.button.big,.button.large{font-size:1em}
ul.actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1rem;list-style:none;padding:0;margin:1.5rem 0 0}
ul.actions li{padding:0;margin:0}
.text-gradient{color:var(--accent)}
#banner .modern-hero{min-height:400px}
h2.major:after{border-bottom-color:var(--accent)}
@media screen and (max-width:1280px){#sidebar{position:fixed;left:0;top:0;height:100%;width:24em;z-index:10000}#sidebar.inactive{margin-left:-24em}#sidebar:not(.inactive){margin-left:0}.inner{max-width:calc(100% - 3rem)}#header{padding-top:6.5em}#sidebar.inactive>.inner{content-visibility:hidden}}
@media screen and (min-width:1281px){#sidebar .toggle{display:none}.modern-hero .hero-content h1{font-size:3.5rem}}
@media screen and (max-width:980px){.modern-hero{grid-template-columns:1fr;gap:1.25rem}#main{width:100%}.inner{max-width:calc(100% - 2rem)}.modern-hero .hero-image-wrapper{order:-1;margin-inline:auto;width:min(100%,22rem);min-height:0;max-height:16rem;aspect-ratio:4/3;align-self:center;border-radius:.75rem}.modern-hero .hero-image-wrapper img{min-height:0;height:100%;width:100%}#banner .modern-hero{min-height:0}.modern-hero .hero-content{padding:.5rem 0 0}}
@media screen and (max-width:736px){body{font-size:1rem}h1{font-size:2em}h2{font-size:1.5em}.inner{max-width:calc(100% - 2rem);width:auto}.modern-hero .hero-image-wrapper{width:min(72%,15rem);max-height:12.5rem;aspect-ratio:1/1}}
