:root{
  --paper:oklch(100% 0 0);
  --ink:oklch(27% .045 237);
  --muted:oklch(44% .025 237);
  --aqua:oklch(82% .105 225);
  --aqua-ink:oklch(42% .065 225);
  --wash:oklch(97% .013 225);
  --rule:oklch(27% .045 237 / .14);
  --font-display:'Boska',Georgia,serif;
  --font-body:'Satoshi',Arial,sans-serif;
  --text-xs:clamp(.75rem,.72rem + .15vw,.875rem);
  --text-sm:clamp(.875rem,.82rem + .2vw,1rem);
  --text-base:clamp(1rem,.95rem + .2vw,1.125rem);
  --text-xl:clamp(1.75rem,1.2rem + 1.5vw,2.5rem);
  --text-hero:clamp(2.85rem,1.5rem + 3.4vw,4.75rem);
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-32:8rem;
}
body{background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:var(--text-base);line-height:1.75}
.wrap{width:min(100% - var(--space-16),1200px);margin-inline:auto}
.header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);padding-block:var(--space-6);border-bottom:1px solid var(--rule)}
.brand{font-size:var(--text-base);font-weight:700;letter-spacing:-.025em;min-height:44px;display:flex;align-items:center}
.brand-dot{color:var(--aqua-ink)}
nav a,.footer a{font-size:var(--text-sm);display:inline-flex;gap:var(--space-5);align-items:center;min-height:44px}
a:hover{color:var(--aqua-ink)}
.hero{display:grid;grid-template-columns:1fr 1.04fr;align-items:center;gap:var(--space-12);padding-block:var(--space-24);min-height:650px}
.eyebrow{font-size:var(--text-xs);font-weight:700;letter-spacing:.15em;text-transform:uppercase;line-height:1.5;margin-bottom:var(--space-6);color:var(--muted)}
h1{font-family:var(--font-display);font-size:var(--text-hero);font-weight:400;line-height:1.06;letter-spacing:-.035em;max-width:12ch}
h1 span{color:var(--aqua-ink)}
.hero-intro{margin-top:var(--space-8);max-width:42ch;color:var(--muted)}
.privacy-tagline{margin-top:var(--space-6);max-width:44ch;font-size:var(--text-sm);font-weight:700;line-height:1.65;color:var(--aqua-ink)}
.text-link{display:inline-flex;align-items:center;gap:var(--space-8);min-height:44px;margin-top:var(--space-6);font-size:var(--text-sm);font-weight:500;border-bottom:1px solid var(--ink)}
.logo{width:100%;align-self:center}
.logo img{width:100%}
.story{background:var(--wash);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);scroll-margin-top:var(--space-8)}
.story-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:var(--space-24);padding-block:var(--space-20)}
h2{font-family:var(--font-display);font-size:var(--text-xl);line-height:1.22;font-weight:400;letter-spacing:-.02em}
.aside-note{font-size:var(--text-sm);color:var(--muted);max-width:26ch;margin-top:var(--space-6)}
blockquote{position:relative;padding-top:var(--space-8)}
.quotation-mark{position:absolute;top:calc(-1 * var(--space-6));left:0;font:400 var(--text-hero)/1 var(--font-display);color:var(--aqua-ink)}
.quotation-close{display:block;text-align:right;font:400 var(--text-hero)/1 var(--font-display);color:var(--aqua-ink);margin-top:var(--space-4)}
blockquote p+p{margin-top:var(--space-6)}
blockquote strong{font-weight:700}
.quote-conclusion{font-family:var(--font-display);font-size:var(--text-xl);font-weight:500;line-height:1.3;margin-top:var(--space-8)}
.attribution{font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-6)}
.closing{padding-block:var(--space-16)}
.closing p{max-width:65ch;margin-left:auto;color:var(--muted)}
.closing strong{font-weight:500;color:var(--ink)}
.footer{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);padding-block:var(--space-5);border-top:1px solid var(--rule);font-size:var(--text-xs);color:var(--muted)}
@media(min-width:1600px){.hero{min-height:730px}}
@media(max-width:800px){
  .wrap{width:calc(100% - var(--space-10))}
  .hero{grid-template-columns:1fr;gap:var(--space-8);padding-block:var(--space-12);min-height:auto}
  .hero-copy{max-width:580px}
  h1{max-width:13ch}
  .hero-intro{max-width:48ch;margin-top:var(--space-6)}
  .logo{max-width:580px;margin-inline:auto}
  .story-grid{grid-template-columns:1fr;gap:var(--space-12);padding-block:var(--space-12)}
  .story-heading h2 br{display:none}
  .story-heading h2 br::after{content:' '}
  .story-heading h2{max-width:18ch}
  .aside-note{max-width:40ch;margin-top:var(--space-4)}
  .closing{padding-block:var(--space-12)}
}
@media(max-width:420px){.story-heading h2 br{display:block}.header{gap:var(--space-4)}.footer{gap:var(--space-4)}}
@media print{.header nav,.text-link,.footer a{display:none}.hero{min-height:auto;padding-block:var(--space-8)}.story-grid{padding-block:var(--space-8)}.story{break-inside:avoid}.wrap{width:100%}body{color:#102b3b}}