:root { --ink:#0a1514; --forest:#112826; --moss:#688178; --paper:#e8e5dc; --red:#e93532; --line:rgba(232,229,220,.25); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:Manrope,Arial,sans-serif; font-size:16px; line-height:1.6; }
a { color:inherit; text-decoration:none; }
.site-header { align-items:center; display:flex; justify-content:space-between; left:0; padding:1.25rem clamp(1.25rem,4vw,4rem); position:absolute; right:0; top:0; z-index:4; }
.wordmark { color:var(--red); font:900 clamp(1.6rem,3vw,2.25rem)/.8 'Barlow Condensed',sans-serif; letter-spacing:.03em; }
nav { display:flex; gap:clamp(.8rem,2vw,2rem); font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
nav a { border-bottom:1px solid transparent; } nav a:hover, nav a:focus { border-color:var(--red); }
.hero { align-items:flex-end; background:radial-gradient(ellipse at 50% 48%,rgba(147,166,143,.42),transparent 31%),linear-gradient(90deg,rgba(7,18,17,.9),transparent 50%,rgba(7,18,17,.88)),linear-gradient(0deg,rgba(4,12,11,.9),rgba(14,35,32,.24) 64%,rgba(3,11,10,.4)); display:flex; min-height:100svh; overflow:hidden; padding:clamp(6rem,12vw,10rem) clamp(1.25rem,8vw,9rem) 4rem; position:relative; }
.hero::after { background:linear-gradient(90deg,transparent 49.8%,rgba(232,229,220,.09) 50%,transparent 50.2%); content:""; inset:0; pointer-events:none; position:absolute; }
.hero-content { max-width:56rem; position:relative; z-index:2; }.eyebrow,.section-label { color:var(--red); font-size:.72rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }.eyebrow { margin:0 0 1.25rem; }
h1,h2,h3,.kicker,.byline { font-family:'Barlow Condensed',Impact,sans-serif; text-transform:uppercase; }h1 { color:var(--red); font-size:clamp(5.4rem,15vw,13.5rem); letter-spacing:-.05em; line-height:.72; margin:0; } .byline { font-size:clamp(1.2rem,2vw,1.8rem); font-weight:700; line-height:1; margin:1.25rem 0 2.8rem; }.hero-copy { font-size:clamp(1rem,1.5vw,1.25rem); font-weight:700; letter-spacing:.03em; margin:0 0 1.6rem; text-transform:uppercase; }.hero-meta { bottom:1.4rem; font-size:.7rem; font-weight:700; letter-spacing:.1em; margin:0; position:absolute; right:clamp(1.25rem,4vw,4rem); text-transform:uppercase; z-index:2; }
.button { align-items:center; display:inline-flex; font-size:.76rem; font-weight:800; gap:1.4rem; letter-spacing:.1em; padding:1rem 1.25rem; text-transform:uppercase; transition:transform .2s,background .2s; }.button:hover { transform:translateY(-3px); }.button-primary { background:var(--red); color:var(--ink); }.button-light { background:var(--paper); color:var(--ink); }.button span { font-size:1.2rem; line-height:0; }
.trees { background:repeating-linear-gradient(90deg,transparent 0 5%,rgba(4,18,15,.76) 5.4% 8%,transparent 8.6% 12%),linear-gradient(90deg,transparent,rgba(4,14,12,.3)); bottom:0; filter:blur(1px); opacity:.88; position:absolute; top:0; width:42%; }.trees-left { left:0; transform:skewX(-4deg); }.trees-right { right:0; transform:scaleX(-1) skewX(-4deg); }.grain { background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"); inset:0; mix-blend-mode:soft-light; opacity:.32; pointer-events:none; position:absolute; z-index:1; }
.section-shell { display:grid; gap:2rem; grid-template-columns:minmax(8rem,.45fr) minmax(0,1.7fr) minmax(12rem,.7fr); padding:clamp(5rem,11vw,10rem) clamp(1.25rem,8vw,9rem); }.story { background:var(--paper); color:var(--ink); }.section-label { align-self:start; }.kicker { color:var(--red); font-size:1.25rem; font-weight:800; letter-spacing:.04em; line-height:1; margin:0 0 1.1rem; }h2 { font-size:clamp(3.2rem,6vw,6.5rem); letter-spacing:-.035em; line-height:.84; margin:0 0 2rem; }.story-copy p:not(.kicker) { max-width:39rem; }.pull-quote { align-self:end; border-left:2px solid var(--red); font-size:1.05rem; font-weight:600; line-height:1.4; padding-left:1rem; }
.vision { background:var(--forest); }.vision-top { padding-bottom:clamp(2.5rem,5vw,4.5rem); }.vision-top h2 { margin-bottom:0; }.vision-grid { border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(3,1fr); }.vision-grid article { min-height:20rem; padding:clamp(1.5rem,4vw,4rem); }.vision-grid article+article { border-left:1px solid var(--line); }.vision-grid span { color:var(--red); font-size:.75rem; font-weight:800; }.vision-grid h3 { font-size:2rem; letter-spacing:.01em; line-height:1; margin:4rem 0 1rem; }.vision-grid p { color:#c4cdc7; font-size:.92rem; max-width:18rem; }
.makers { border-bottom:1px solid var(--line); }.makers-main h2 { max-width:42rem; }.makers-columns { display:grid; gap:2rem; grid-template-columns:repeat(2,minmax(0,1fr)); max-width:52rem; }.makers-columns p { color:#bdc8c1; margin:0; }.makers-columns strong { color:var(--paper); }
.support { background:var(--red); color:var(--ink); padding:clamp(5rem,12vw,10rem) clamp(1.25rem,8vw,9rem); }.support-inner { max-width:50rem; }.support .eyebrow { color:var(--ink); }.support h2 { font-size:clamp(4.5rem,9vw,9rem); }.support-inner>p:not(.eyebrow):not(.support-note) { font-size:1.05rem; max-width:35rem; }.support-note { font-size:.72rem; font-weight:700; letter-spacing:.08em; margin-top:1.5rem; text-transform:uppercase; }.share { border-top:1px solid rgba(10,21,20,.35); margin-top:3rem; max-width:35rem; padding-top:1rem; }.share-native { background:none; border:0; color:var(--ink); cursor:pointer; font:800 .76rem/1 Manrope,Arial,sans-serif; letter-spacing:.1em; padding:.4rem 0; text-transform:uppercase; }.share-native span { font-size:1.05rem; margin-left:1rem; }.share-links { display:flex; gap:1.25rem; margin-top:.75rem; }.share-links a { border-bottom:1px solid rgba(10,21,20,.5); font-size:.72rem; font-weight:800; letter-spacing:.08em; padding-bottom:.15rem; text-transform:uppercase; }.share-links a:hover,.share-links a:focus { border-color:var(--ink); }footer { color:#94a59d; display:flex; font-size:.72rem; justify-content:space-between; padding:1.5rem clamp(1.25rem,4vw,4rem); }footer p { margin:0; }
@media (max-width:760px) { nav { display:none; }.hero { min-height:46rem; }.hero-meta { left:1.25rem; right:auto; }.section-shell { grid-template-columns:1fr; }.section-label { margin-bottom:1rem; }.pull-quote { margin-top:1rem; }.vision-grid { grid-template-columns:1fr; }.vision-grid article { min-height:auto; }.vision-grid article+article { border-left:0; border-top:1px solid var(--line); }.vision-grid h3 { margin-top:2rem; }.makers-columns { grid-template-columns:1fr; } footer { display:block; } footer p+p { margin-top:.35rem; } }
