*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--ivory);color:var(--text);font-family:var(--font-head);font-weight:400;font-size:var(--fs-body);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,picture,video,svg{display:block;max-width:100%}
img,video{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,p,ul,ol,figure{margin:0;padding:0}
ul,ol{list-style:none}
:focus{outline:none}
:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:6px}
::selection{background:var(--brown-oak);color:var(--ivory)}

/* Layout */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter)}
.section{position:relative;padding-block:var(--section-y)}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Type */
.h1,.h2,.h3{font-family:var(--font-head);letter-spacing:-.02em;line-height:1.05;text-wrap:balance}
.h1{font-size:var(--fs-h1);font-weight:300}
.h2{font-size:var(--fs-h2);font-weight:300}
.h3{font-size:var(--fs-h3);font-weight:400;line-height:1.15}
.w5{font-weight:500}
.w3{font-weight:300}
.eyebrow{font-family:var(--font-label);font-weight:500;font-size:11px;letter-spacing:.28em;text-transform:uppercase;line-height:1.4}
@media (min-width:768px){.eyebrow{font-size:12px}}
.lede{font-size:var(--fs-body);color:var(--text-soft);max-width:46ch}

/* Line reveal wrappers (lines are authored, never auto-wrapped) */
.ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.ln>span{display:block;will-change:transform}

/* Glass: only on top of imagery or video */
.glass{
  background:var(--glass-light);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid var(--glass-border);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 20px 60px rgba(21,19,17,.18);
}
.glass--dark{background:var(--glass-dark)}
@supports not (backdrop-filter:blur(1px)){.glass{background:rgba(21,19,17,.62)}}

/* Grain */
.grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.03;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* Editorial divider */
.rule{height:1px;background:var(--line);border:0;margin:0}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* JS-gated initial states (content stays visible without JS) */
html.js [data-line]{transform:translateY(110%)}
html.js [data-fade]{opacity:0}
@media (prefers-reduced-motion:reduce){html.js [data-line]{transform:none}html.js [data-fade]{opacity:1}}
html.js [data-reveal="fade"]{opacity:0}
html.js [data-reveal="lines"] .ln>span{transform:translateY(110%)}
html.js [data-reveal="clip"]{clip-path:inset(100% 0 0 0)}
@media (prefers-reduced-motion:reduce){html.js [data-reveal="fade"]{opacity:1}html.js [data-reveal="lines"] .ln>span{transform:none}html.js [data-reveal="clip"]{clip-path:none}}
