:root{
--oa-red:#E31837;--oa-red-dark:#640813;--oa-slate:#36454F;--oa-slate-2:#5b6a73;--oa-mist:#E6E7E8;--oa-ink:#030006;--oa-white:#fff;
--surface:#fff;--sunken:#F4F5F6;--border:#CDD1D4;--muted:#66727a;
--slab:"Zilla Slab",Georgia,serif;--sans:"Nunito Sans",Arial,sans-serif;
--wrap:1180px;--shadow:0 8px 24px rgba(3,0,6,.08);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--oa-ink);font-family:var(--sans);font-weight:400;background:#fff}a{color:inherit}.wrap{width:min(calc(100% - 40px),var(--wrap));margin:auto}.narrow{max-width:880px}
.topbar{background:var(--oa-slate);border-bottom:4px solid var(--oa-red);color:#fff}.topbar-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:14px;text-decoration:none}.brand-mark{width:46px;height:46px;position:relative;display:block}.brand-mark:before{content:"";position:absolute;inset:3px 2px 7px;border-left:22px solid transparent;border-right:22px solid transparent;border-bottom:39px solid var(--oa-red);transform:rotate(0deg)}.brand-mark span{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--oa-slate);left:17px;top:24px;z-index:2}.brand-text{display:flex;flex-direction:column}.brand-text strong{font-family:var(--slab);font-size:20px;letter-spacing:.08em}.brand-text small{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--oa-mist)}
.custom-logo{max-height:56px;width:auto}.nav-list{display:flex;gap:26px;list-style:none;padding:0;margin:0}.nav-list a{text-decoration:none;color:#fff;font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}.nav-list a:hover{color:#f6a6b1}.menu-toggle{display:none;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.4);padding:9px 12px}
.hero{background:var(--oa-slate);color:#fff;min-height:390px;display:flex;align-items:center;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;bottom:0;left:0;width:34%;height:5px;background:var(--oa-red)}.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;align-items:center;gap:50px;padding:70px 0}.eyebrow,.kicker{font-weight:800;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--oa-red);margin-bottom:16px}.hero h1{font-family:var(--slab);text-transform:uppercase;letter-spacing:.035em;font-size:clamp(3rem,7vw,6.4rem);line-height:.93;margin:0;max-width:900px}.hero p{font-size:19px;line-height:1.65;color:#d9dde0;max-width:700px}.hero-symbol{display:flex;justify-content:center}.triangle,.card-art{position:relative}.triangle{width:230px;height:210px}.triangle:before{content:"";position:absolute;left:0;right:0;top:0;margin:auto;width:0;height:0;border-left:115px solid transparent;border-right:115px solid transparent;border-bottom:200px solid var(--oa-red)}.triangle span{position:absolute;width:48px;height:48px;border-radius:50%;background:var(--oa-slate);left:91px;top:126px;z-index:2}.triangle.large{transform:scale(1.25)}
.section,.intro-panel{padding:76px 0}.sunken{background:var(--sunken)}.split,.two-col{display:grid;grid-template-columns:1.4fr .8fr;gap:64px;align-items:start}.section-rule{position:relative;height:1px;background:var(--border);margin-bottom:24px}.section-rule:before{content:"";position:absolute;left:0;top:-2px;width:58px;height:4px;background:var(--oa-red)}.top-gap{margin-top:65px}.section h2,.intro-panel h2{font-family:var(--slab);font-size:clamp(2rem,4vw,3.1rem);line-height:1.03;margin:0 0 18px}.lead{font-size:20px;line-height:1.7;color:#3f4a50}.note-card{border:1px solid var(--border);background:var(--sunken);padding:28px;border-top:4px solid var(--oa-red)}.note-card span{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--oa-red);font-weight:800}.note-card p{line-height:1.65;color:#526068}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:34px}.section-heading>p{max-width:500px;color:var(--muted);line-height:1.6}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card-grid.compact{grid-template-columns:repeat(4,1fr)}.oa-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);text-decoration:none;box-shadow:0 1px 2px rgba(0,0,0,.03);transition:.2s}.oa-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.oa-card.static:hover{transform:none}.redline{height:4px;background:var(--oa-red);display:block}.card-art{height:180px;background:linear-gradient(140deg,#dfe3e5,#8f9aa0)}.card-art:after{content:"";position:absolute;left:50%;top:50%;width:0;height:0;border-left:42px solid transparent;border-right:42px solid transparent;border-bottom:74px solid var(--oa-red);transform:translate(-50%,-50%)}.card-art.mini{height:110px}.card-body,.news-body{padding:25px}.card-body small,.news-body small,.policy-date{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#7a858c;font-weight:800}.card-body h3{font-family:var(--slab);font-size:24px;margin:8px 0}.card-body p{color:#5d686f;line-height:1.6}.card-body b,.news-body b{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--oa-red)}
.dark-feature{background:var(--oa-slate);color:#fff}.feature-grid{display:grid;grid-template-columns:1fr .7fr;align-items:center;gap:60px}.dark-feature h2{font-size:60px;text-transform:uppercase}.dark-feature p{color:#d9dde0;line-height:1.7;font-size:18px}.feature-art{display:flex;justify-content:center}.button{display:inline-block;background:var(--oa-red);color:#fff;text-decoration:none;padding:13px 20px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:12px}.kicker.light{color:#f49aaa}
.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--border)}.step-grid.four{grid-template-columns:repeat(4,1fr)}.step{padding:28px;border-right:1px solid var(--border);background:#fff}.step:last-child{border-right:0}.step>b{display:inline-flex;width:32px;height:32px;background:var(--oa-red);color:#fff;align-items:center;justify-content:center;border-radius:50%}.step h3{font-family:var(--slab);font-size:24px;margin:15px 0 7px}.step p{color:#5e6970;line-height:1.6}
.program-group{margin-top:65px}.timeline{position:relative;max-width:930px;margin:auto}.timeline:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:5px;background:var(--oa-slate-2);transform:translateX(-50%)}.timeline-row{display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;margin:45px 0;position:relative}.timeline-row.left .timeline-card{grid-column:1}.timeline-row.right .timeline-card{grid-column:3}.timeline-row .dot{grid-column:2;width:26px;height:26px;border-radius:50%;background:var(--oa-red);justify-self:center;border:6px solid #fff;box-shadow:0 0 0 2px var(--oa-red)}.timeline-card{border:1px solid var(--border);padding:25px;background:#fff}.timeline-card small{color:var(--oa-red);font-weight:800;letter-spacing:.14em}.timeline-card h2{font-size:27px;margin-top:8px}.checklist{list-style:none;padding:0}.checklist li{padding:14px 0;border-bottom:1px solid var(--border)}.checklist li:before{content:"✓";color:var(--oa-red);font-weight:900;margin-right:12px}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.news-card{background:#fff;border:1px solid var(--border)}.news-card>a{text-decoration:none}.news-card img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}.news-body h2{font-family:var(--slab);font-size:27px;line-height:1.05}.news-body p{color:#5d686f;line-height:1.6}
.resource-list{display:grid;gap:12px}.resource-row{display:grid;grid-template-columns:48px 1fr;gap:18px;align-items:start;background:#fff;border:1px solid var(--border);padding:20px;text-decoration:none}.resource-icon{width:38px;height:38px;background:var(--oa-red);color:#fff;display:grid;place-items:center;font-weight:900}.resource-row h2{font-size:24px;margin:4px 0}.resource-row p{margin:0;color:#5d686f}.resource-row small{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#7d888e}
.policy-list{border-top:1px solid var(--border)}.policy-row{display:grid;grid-template-columns:130px 1fr;gap:25px;padding:28px 0;border-bottom:1px solid var(--border)}.policy-row h2{font-size:26px}.policy-row h2 a{text-decoration:none}.policy-row p{color:#5d686f;line-height:1.6}
.article-layout{display:grid;grid-template-columns:minmax(0,760px) 280px;gap:70px}.prose{font-size:17px;line-height:1.8}.prose h2,.prose h3{font-family:var(--slab);line-height:1.15;margin-top:1.6em}.prose h2{font-size:36px}.prose h3{font-size:27px}.prose a{color:var(--oa-red);font-weight:700}.article-meta{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#7c878d;margin-bottom:22px}.article-image{width:100%;height:auto;margin-bottom:30px}.article-side{position:relative}.article-side .note-card{position:sticky;top:30px}
.site-footer{background:#232d33;color:#fff;padding:58px 0 26px;border-top:5px solid var(--oa-red)}.footer-grid{display:grid;grid-template-columns:1.3fr .7fr .9fr;gap:60px}.footer-brand{font-family:var(--slab);font-size:23px;letter-spacing:.09em}.site-footer p{color:#bfc6ca;line-height:1.6}.site-footer h2{font-size:12px;text-transform:uppercase;letter-spacing:.14em}.site-footer ul{list-style:none;padding:0}.site-footer a{color:#fff}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:42px;padding-top:22px;font-size:11px;color:#aeb6ba}
@media(max-width:900px){.nav-list{gap:14px}.hero-grid,.split,.two-col,.feature-grid,.article-layout{grid-template-columns:1fr}.hero-symbol{display:none}.card-grid,.post-grid{grid-template-columns:repeat(2,1fr)}.card-grid.compact,.step-grid.four{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.article-side{display:none}}
@media(max-width:680px){.wrap{width:min(calc(100% - 28px),var(--wrap))}.topbar-inner{min-height:72px}.menu-toggle{display:block}.site-nav{display:none;position:absolute;left:0;right:0;top:72px;background:var(--oa-slate);z-index:50;border-top:1px solid rgba(255,255,255,.15)}.site-nav.open{display:block}.nav-list{flex-direction:column;padding:18px 22px;gap:0}.nav-list li{border-bottom:1px solid rgba(255,255,255,.12)}.nav-list a{display:block;padding:14px 0}.hero{min-height:320px}.hero-grid{padding:54px 0}.hero h1{font-size:clamp(2.8rem,15vw,4.5rem)}.section,.intro-panel{padding:54px 0}.card-grid,.card-grid.compact,.post-grid,.step-grid,.step-grid.four,.footer-grid{grid-template-columns:1fr}.section-heading{align-items:start;flex-direction:column}.step{border-right:0;border-bottom:1px solid var(--border)}.timeline:before{left:13px}.timeline-row{grid-template-columns:40px 1fr}.timeline-row.left .timeline-card,.timeline-row.right .timeline-card{grid-column:2}.timeline-row .dot{grid-column:1;grid-row:1;justify-self:start}.policy-row{grid-template-columns:1fr}.dark-feature h2{font-size:43px}}

/* =========================================================
   OA MOTION LAB — THE AI FOUND THE ANIMATION PANEL
   ========================================================= */
:root{
  --motion-red:#E31837;
  --motion-pink:#ff6f84;
  --motion-charcoal:#202a30;
  --motion-ease:cubic-bezier(.16,1,.3,1);
}
body.oa-ref{overflow-x:hidden}
body.oa-ref::selection{background:var(--oa-red);color:#fff}

/* Header motion */
.site-header{position:relative;z-index:100}
.topbar{position:relative;overflow:hidden}
.topbar::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 48%,rgba(255,255,255,.045) 50%,transparent 52%);background-size:220% 100%;animation:navSweep 8s linear infinite;pointer-events:none}
.brand-mark{transition:transform .7s var(--motion-ease)}
.brand:hover .brand-mark{transform:rotate(120deg) scale(1.08)}
.nav-list a{position:relative;display:inline-block;transition:transform .25s var(--motion-ease),color .25s ease}
.nav-list a::after{content:"";position:absolute;left:0;right:100%;height:2px;bottom:-8px;background:var(--oa-red);transition:right .35s var(--motion-ease)}
.nav-list a:hover{transform:translateY(-2px)}
.nav-list a:hover::after{right:0}
@keyframes navSweep{to{background-position:-220% 0}}

/* Hero */
.motion-hero{min-height:560px;isolation:isolate;background:radial-gradient(circle at 76% 24%,#4a5962 0,transparent 25%),linear-gradient(145deg,#36454F 0%,#26333a 62%,#1f292f 100%)}
.motion-hero::before{content:"";position:absolute;inset:-30%;background:conic-gradient(from 0deg at 50% 50%,transparent,rgba(227,24,55,.08),transparent 32%);animation:heroWash 16s linear infinite;z-index:-1}
.motion-hero::after{width:42%;height:7px;box-shadow:42vw 0 0 rgba(255,255,255,.14)}
.hero-noise{position:absolute;inset:0;opacity:.16;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.3) .7px,transparent .7px);background-size:7px 7px;mask-image:linear-gradient(to bottom,#000,transparent 75%)}
.hero-gridline{position:absolute;inset:-30%;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:64px 64px;transform:rotate(-10deg);animation:gridDrift 20s linear infinite}
.hero-shapes{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.float-shape,.float-ring{position:absolute;display:block}
.float-shape{background:var(--oa-red);transform:rotate(45deg);box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.fs-one{width:28px;height:28px;left:7%;top:24%;animation:floatOne 7s ease-in-out infinite}
.fs-two{width:13px;height:13px;left:47%;top:17%;animation:floatTwo 9s ease-in-out infinite reverse}
.fs-three{width:62px;height:62px;right:4%;bottom:13%;background:transparent;border:2px solid rgba(227,24,55,.8);animation:spinFloat 14s linear infinite}
.float-ring{border:1px solid rgba(255,255,255,.2);border-radius:50%}
.fr-one{width:160px;height:160px;left:-62px;bottom:34px;animation:pulseRing 6s ease-in-out infinite}
.fr-two{width:46px;height:46px;right:34%;top:14%;border-color:rgba(227,24,55,.8);animation:floatTwo 6s ease-in-out infinite}
.hero-grid{position:relative;z-index:3;padding:92px 0 108px}
.reveal-hero{animation:heroEnter 1s var(--motion-ease) both}
.hero-symbol.reveal-hero{animation-delay:.14s}
.motion-hero .eyebrow{display:inline-flex;align-items:center;gap:12px;color:#ff9dac}
.motion-hero .eyebrow::before{content:"";width:34px;height:2px;background:var(--oa-red);animation:linePulse 2.4s ease-in-out infinite}
.kinetic-title{position:relative;text-wrap:balance;text-shadow:0 16px 48px rgba(0,0,0,.16)}
.kinetic-title .word{display:inline-block;white-space:nowrap;margin-right:.16em}
.kinetic-title .letter{display:inline-block;transform-origin:50% 85%;transition:transform .4s var(--motion-ease),color .3s ease}
.kinetic-title .letter:hover{transform:translateY(-10px) rotate(-4deg);color:#ff8da0}
.hero-meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-meta span{border:1px solid rgba(255,255,255,.18);padding:7px 10px;font-size:9px;letter-spacing:.18em;color:#aeb9bf;text-transform:uppercase}
.symbol-stage{width:320px;height:320px;position:relative;display:grid;place-items:center}
.symbol-stage .triangle{z-index:4;animation:triangleFloat 5s ease-in-out infinite;filter:drop-shadow(0 22px 34px rgba(0,0,0,.22))}
.symbol-ring{position:absolute;border:1px solid rgba(255,255,255,.16);border-radius:50%}
.ring-a{width:290px;height:290px;animation:spinSlow 18s linear infinite}
.ring-a::before,.ring-a::after{content:"";position:absolute;width:12px;height:12px;background:var(--oa-red);transform:rotate(45deg)}
.ring-a::before{left:18px;top:42px}.ring-a::after{right:9px;bottom:61px}
.ring-b{width:220px;height:220px;border-style:dashed;border-color:rgba(227,24,55,.5);animation:spinSlow 12s linear infinite reverse}
.symbol-cross{position:absolute;color:rgba(255,255,255,.35);font-size:22px;font-weight:300;animation:crossFloat 4s ease-in-out infinite}
.cross-a{right:16px;top:45px}.cross-b{left:30px;bottom:55px;animation-delay:-2s}
.scroll-cue{position:absolute;left:26px;bottom:26px;display:flex;align-items:center;gap:14px;color:#aeb8bd;font-size:8px;letter-spacing:.18em;transform:rotate(-90deg);transform-origin:left bottom;z-index:5}
.scroll-cue i{width:42px;height:1px;background:rgba(255,255,255,.35);position:relative;overflow:hidden}
.scroll-cue i::after{content:"";position:absolute;width:14px;inset-block:0;left:-14px;background:#fff;animation:scrollLine 1.7s ease-in-out infinite}

/* Ticker */
.motion-ticker{overflow:hidden;background:var(--oa-red);color:#fff;border-block:1px solid rgba(0,0,0,.08)}
.ticker-track{display:flex;width:max-content;align-items:center;gap:24px;padding:12px 0;font-size:10px;letter-spacing:.2em;font-weight:900;white-space:nowrap;animation:tickerMove 25s linear infinite}
.ticker-track i{font-style:normal;opacity:.55}

/* Scroll reveals */
.reveal-up{opacity:0;transform:translateY(34px) scale(.985);transition:opacity .8s var(--motion-ease),transform .8s var(--motion-ease)}
.reveal-up.is-visible{opacity:1;transform:none}
.motion-section{position:relative}
.motion-section::before{content:"";position:absolute;width:10px;height:10px;background:var(--oa-red);right:clamp(16px,5vw,72px);top:32px;transform:rotate(45deg);opacity:.25}
.section-rule:before{transform-origin:left center;animation:ruleBreathe 3s ease-in-out infinite}

/* Cards become mildly sentient */
.motion-card-grid{perspective:1200px}
.motion-card{position:relative;overflow:hidden;transform-style:preserve-3d;will-change:transform;transition:transform .28s var(--motion-ease),box-shadow .28s ease,border-color .28s ease}
.motion-card::before{content:"";position:absolute;inset:-1px;background:linear-gradient(115deg,transparent 15%,rgba(255,255,255,.55) 45%,transparent 70%);transform:translateX(-120%);transition:transform .65s var(--motion-ease);z-index:5;pointer-events:none}
.motion-card:hover::before{transform:translateX(120%)}
.motion-card:hover{border-color:#aab1b5;box-shadow:0 22px 50px rgba(3,0,6,.13)}
.motion-card .card-art{overflow:hidden;background:linear-gradient(145deg,#d9dee1,#8d989e)}
.motion-card .card-art::before{content:"";position:absolute;width:130%;height:1px;background:rgba(54,69,79,.25);left:-15%;top:50%;transform:rotate(-22deg);box-shadow:0 22px 0 rgba(54,69,79,.14),0 -22px 0 rgba(54,69,79,.14)}
.motion-card .card-art::after{transition:transform .55s var(--motion-ease),border-bottom-color .3s ease}
.motion-card:hover .card-art::after{transform:translate(-50%,-50%) rotate(10deg) scale(1.14)}
.card-number{position:absolute;right:16px;top:12px;font-family:var(--slab);font-size:64px;line-height:1;color:rgba(54,69,79,.1);z-index:2}
.shape{position:absolute;display:block;z-index:1}
.shape-a{width:20px;height:20px;border:2px solid rgba(54,69,79,.3);left:25px;bottom:27px;transform:rotate(45deg);animation:shapeNudge 4s ease-in-out infinite}
.shape-b{width:8px;height:8px;background:var(--oa-red);right:32px;bottom:28px;border-radius:50%;animation:shapeNudge 3s ease-in-out infinite reverse}
.motion-card:nth-child(2n) .shape-a{border-radius:50%}.motion-card:nth-child(3n) .shape-b{border-radius:0;transform:rotate(45deg)}
.card-body b{display:inline-block;transition:transform .25s var(--motion-ease)}
.motion-card:hover .card-body b{transform:translateX(8px)}

/* Chaos note */
.chaos-card{position:relative;overflow:hidden;min-height:225px}
.chaos-card::after{content:"AI";position:absolute;right:-8px;bottom:-34px;font-family:var(--slab);font-size:130px;font-weight:700;color:rgba(54,69,79,.06);line-height:1;pointer-events:none}
.mini-orbit{width:84px;height:84px;border:1px solid rgba(54,69,79,.17);border-radius:50%;position:absolute;right:24px;bottom:20px;animation:spinSlow 10s linear infinite}
.mini-orbit b{position:absolute;width:8px;height:8px;background:var(--oa-red);border-radius:50%}
.mini-orbit b:nth-child(1){left:3px;top:25px}.mini-orbit b:nth-child(2){right:9px;top:8px}.mini-orbit b:nth-child(3){right:5px;bottom:14px;background:var(--oa-slate)}

/* Feature orbital art */
.ai-confession{overflow:hidden;background:radial-gradient(circle at 75% 50%,#4b5c65 0,transparent 26%),var(--oa-slate)}
.ai-confession::after{content:"";position:absolute;width:440px;height:440px;border:1px solid rgba(255,255,255,.06);border-radius:50%;right:-180px;top:-180px}
.orbital-system{position:relative;width:350px;height:350px;display:grid;place-items:center}
.orbit{position:absolute;border:1px solid rgba(255,255,255,.14);border-radius:50%}
.orbit-one{width:330px;height:330px;animation:spinSlow 22s linear infinite}
.orbit-two{width:270px;height:270px;border-style:dashed;animation:spinSlow 15s linear infinite reverse}
.orbit-three{width:195px;height:195px;border-color:rgba(227,24,55,.5);animation:pulseRing 5s ease-in-out infinite}
.satellite{position:absolute;width:16px;height:16px;background:var(--oa-red);transform:rotate(45deg)}
.sat-one{top:28px;right:58px;animation:shapeNudge 3s ease-in-out infinite}.sat-two{bottom:52px;left:33px;background:#fff;opacity:.55;animation:shapeNudge 4s ease-in-out infinite reverse}
.magnetic-button{position:relative;overflow:hidden;transition:transform .25s var(--motion-ease),box-shadow .25s ease}
.magnetic-button::before{content:"";position:absolute;inset:0;background:#fff;transform:translateX(-105%) skewX(-18deg);transition:transform .4s var(--motion-ease)}
.magnetic-button span{position:relative;z-index:2;transition:color .3s ease}
.magnetic-button:hover::before{transform:translateX(0) skewX(0)}.magnetic-button:hover span{color:var(--oa-red)}

/* Human zone */
.human-zone{overflow:hidden}
.human-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center}
.giant-type{font-family:var(--slab);font-size:clamp(9rem,20vw,17rem);font-weight:700;line-height:.75;color:transparent;-webkit-text-stroke:2px #d9dde0;position:relative;letter-spacing:-.08em}
.giant-type::after{content:"";position:absolute;width:78px;height:78px;background:var(--oa-red);right:4%;top:7%;mix-blend-mode:multiply;animation:shapeNudge 5s ease-in-out infinite}
.micro-roast{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--oa-red);font-weight:800;margin-top:28px}

/* Global component motion */
.oa-card:not(.motion-card),.news-card,.resource-row,.timeline-card,.policy-row,.step,.note-card{transition:transform .35s var(--motion-ease),box-shadow .35s ease,border-color .35s ease}
.oa-card:not(.motion-card):hover,.news-card:hover,.resource-row:hover,.timeline-card:hover{transform:translateY(-5px);box-shadow:0 14px 36px rgba(3,0,6,.09)}
.resource-icon{transition:transform .4s var(--motion-ease)}.resource-row:hover .resource-icon{transform:rotate(8deg) scale(1.08)}
.timeline .dot{animation:timelinePulse 2.8s ease-in-out infinite}
.timeline-row:nth-child(2n) .dot{animation-delay:-1.4s}
.step>b{transition:transform .35s var(--motion-ease)}.step:hover>b{transform:rotate(12deg) scale(1.12)}

/* Footer */
.motion-footer{position:relative;overflow:hidden}
.motion-footer::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 79px,rgba(255,255,255,.025) 80px);pointer-events:none}
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#76d28a;box-shadow:0 0 0 0 rgba(118,210,138,.45);animation:statusPulse 2s ease-out infinite;margin-right:8px}

/* Keyframes */
@keyframes heroWash{to{transform:rotate(360deg)}}
@keyframes gridDrift{to{transform:rotate(-10deg) translate(64px,64px)}}
@keyframes heroEnter{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:none}}
@keyframes floatOne{0%,100%{transform:translate(0,0) rotate(45deg)}50%{transform:translate(12px,-20px) rotate(95deg)}}
@keyframes floatTwo{0%,100%{transform:translate(0,0) rotate(45deg)}50%{transform:translate(-10px,15px) rotate(15deg)}}
@keyframes spinFloat{to{transform:rotate(405deg)}}
@keyframes pulseRing{0%,100%{transform:scale(1);opacity:.5}50%{transform:scale(1.08);opacity:1}}
@keyframes spinSlow{to{transform:rotate(360deg)}}
@keyframes triangleFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(2deg)}}
@keyframes crossFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(90deg)}}
@keyframes scrollLine{0%{left:-14px}100%{left:48px}}
@keyframes tickerMove{to{transform:translateX(-50%)}}
@keyframes ruleBreathe{0%,100%{width:58px}50%{width:92px}}
@keyframes shapeNudge{0%,100%{transform:translateY(0) rotate(45deg)}50%{transform:translateY(-9px) rotate(70deg)}}
@keyframes timelinePulse{0%,100%{box-shadow:0 0 0 2px var(--oa-red)}50%{box-shadow:0 0 0 7px rgba(227,24,55,.16)}}
@keyframes linePulse{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.55)}}
@keyframes statusPulse{70%{box-shadow:0 0 0 8px rgba(118,210,138,0)}100%{box-shadow:0 0 0 0 rgba(118,210,138,0)}}

@media(max-width:900px){
  .motion-hero{min-height:480px}.human-grid{grid-template-columns:1fr}.giant-type{font-size:9rem}.scroll-cue{display:none}
}
@media(max-width:680px){
  .motion-hero{min-height:430px}.hero-grid{padding:62px 0 72px}.ticker-track{animation-duration:18s}.hero-meta{display:none}.giant-type{font-size:7rem}.human-grid{gap:40px}.motion-section::before{display:none}
}

/* Accessibility: motion is decorative, content remains intact without it. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
  .reveal-up{opacity:1!important;transform:none!important}.ticker-track{transform:none!important}.hero-gridline{transform:rotate(-10deg)!important}
}


/* === Mobile homepage hero fix === */
@media (max-width: 820px) {
  .hero,
  .personal-hero,
  .home-hero {
    overflow: hidden;
    padding-top: 56px !important;
    padding-bottom: 44px;
  }

  .hero-grid,
  .home-hero .hero-grid,
  .personal-hero .hero-grid {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    gap: 28px !important;
    align-items: start !important;
  }

  .hero-copy {
    min-width: 0;
    width: 100%;
    position: relative;
    z-index: 4;
  }

  .hero h1,
  .home-hero h1,
  .personal-hero h1 {
    font-size: clamp(46px, 14vw, 70px) !important;
    line-height: .92 !important;
    letter-spacing: -.055em !important;
    max-width: 100% !important;
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .hero-intro {
    font-size: 18px !important;
    line-height: 1.5 !important;
    max-width: 100% !important;
    margin-top: 22px !important;
  }

  .hero-actions {
    gap: 14px !important;
    align-items: flex-start !important;
  }

  .hero-art {
    width: 100% !important;
    max-width: 420px;
    height: 300px !important;
    margin: 0 auto;
    transform: none !important;
    overflow: visible;
  }

  .hero-monogram {
    font-size: clamp(118px, 40vw, 190px) !important;
  }

  .red-disc {
    width: 220px !important;
    height: 220px !important;
  }

  .disc-small {
    width: 68px !important;
    height: 68px !important;
  }

  .wire-square.square-a {
    right: 6% !important;
    top: 4% !important;
    width: 105px !important;
    height: 105px !important;
  }

  .wire-square.square-b {
    left: 5% !important;
    bottom: 5% !important;
    width: 74px !important;
    height: 74px !important;
  }

  .wire-ring.ring-a {
    width: 132px !important;
    height: 132px !important;
    right: 1% !important;
  }

  .hero-orbit {
    opacity: .45;
  }

  .orbit-one {
    width: 420px !important;
    height: 420px !important;
    right: -250px !important;
    top: -120px !important;
  }

  .orbit-two {
    width: 220px !important;
    height: 220px !important;
    left: -120px !important;
  }
}

@media (max-width: 480px) {
  .hero,
  .personal-hero,
  .home-hero {
    padding-top: 42px !important;
  }

  .hero h1,
  .home-hero h1,
  .personal-hero h1 {
    font-size: clamp(42px, 13.4vw, 58px) !important;
  }

  .hero-art {
    height: 255px !important;
    max-width: 330px;
  }

  .red-disc {
    width: 185px !important;
    height: 185px !important;
  }

  .hero-monogram {
    font-size: clamp(104px, 38vw, 154px) !important;
  }

  .hero-actions .button,
  .hero-actions a.button {
    width: 100%;
  }

  .hero-actions .text-link {
    width: 100%;
    padding-top: 4px;
  }
}




/* === Process satire section: repaired layout === */
.roast-section{
  position:relative;
  overflow:hidden;
  background:#f5f2ed;
  padding:110px 0 120px;
  border-top:1px solid rgba(17,18,20,.12);
  border-bottom:1px solid rgba(17,18,20,.12);
}
.roast-section:before{
  content:"AI GENERATED";
  position:absolute;
  right:-1%;
  top:25px;
  font-size:clamp(70px,12vw,180px);
  line-height:.8;
  font-weight:900;
  letter-spacing:-.07em;
  color:rgba(227,24,55,.055);
  white-space:nowrap;
  pointer-events:none;
}
.roast-shell{
  position:relative;
  z-index:2;
}
.roast-heading{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:60px;
  align-items:end;
  margin-bottom:58px;
}
.roast-heading .eyebrow{
  grid-column:1/-1;
  margin-bottom:0;
}
.roast-heading h2{
  margin:0;
  max-width:760px;
  font-size:clamp(44px,6vw,78px);
  line-height:.93;
  letter-spacing:-.055em;
}
.roast-intro{
  margin:0;
  max-width:500px;
  font-size:18px;
  line-height:1.6;
  color:#55524e;
}

  .roast-heading h2{
    font-size:42px;
  }
}


/* === Roast process cards: stronger step-by-step treatment === */
.roast-steps{
  display:grid;
  grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr) 54px minmax(0,1fr);
  align-items:stretch;
  gap:0;
}
.roast-step{
  min-width:0;
  min-height:430px;
  background:#fff;
  border:1px solid rgba(17,18,20,.16);
  border-radius:18px;
  padding:0;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  box-shadow:0 14px 34px rgba(17,18,20,.07);
  transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,border-color .32s ease;
}
.roast-step:hover{
  transform:translateY(-10px);
  border-color:rgba(227,24,55,.42);
  box-shadow:0 24px 48px rgba(17,18,20,.13);
}
.roast-step:before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:7px;
  background:#e31837;
}
.roast-step-two:before{
  background:linear-gradient(90deg,#e31837,#111214);
}
.roast-step-three{
  background:#111214;
  color:#fff;
}
.roast-step-three:before{
  background:#e31837;
}
.roast-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:27px 28px 22px;
  border-bottom:1px solid rgba(17,18,20,.11);
}
.roast-step-three .roast-card-top{
  border-color:rgba(255,255,255,.14);
}
.roast-number{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:50%;
  background:#e31837;
  color:#fff;
  font-size:14px;
  font-weight:900;
  letter-spacing:.08em;
  flex:0 0 auto;
}
.roast-step-label{
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  color:#77736f;
}
.roast-step-three .roast-step-label{
  color:#aaa7a2;
}
.roast-card-body{
  padding:34px 28px 30px;
  flex:1;
}
.roast-icon{
  width:64px;
  height:64px;
  margin-bottom:34px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.roast-icon:not(.roast-icon-code):not(.roast-icon-alert){
  gap:5px;
  align-items:flex-end;
}
.roast-icon:not(.roast-icon-code):not(.roast-icon-alert) span{
  display:block;
  width:14px;
  background:#e31837;
  border-radius:3px 3px 0 0;
}
.roast-icon:not(.roast-icon-code):not(.roast-icon-alert) span:nth-child(1){height:28px}
.roast-icon:not(.roast-icon-code):not(.roast-icon-alert) span:nth-child(2){height:46px}
.roast-icon:not(.roast-icon-code):not(.roast-icon-alert) span:nth-child(3){height:36px}
.roast-icon-code{
  border:2px solid #e31837;
  border-radius:14px;
  color:#e31837;
  font-size:20px;
  font-weight:900;
  font-family:monospace;
}
.roast-icon-alert{
  border-radius:50%;
  background:#e31837;
  color:#fff;
  font-size:34px;
  font-weight:900;
}
.roast-step h3{
  margin:0 0 17px;
  font-size:clamp(31px,3vw,47px);
  line-height:.98;
  letter-spacing:-.05em;
}
.roast-step p{
  margin:0;
  font-size:16px;
  line-height:1.62;
  color:#5d5954;
}
.roast-step-three p{
  color:#bbb8b2;
}
.roast-card-foot{
  min-height:63px;
  display:flex;
  align-items:center;
  padding:17px 28px;
  border-top:1px solid rgba(17,18,20,.11);
  background:#f8f6f2;
  color:#77736f;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.roast-step-three .roast-card-foot{
  background:#18191c;
  border-color:rgba(255,255,255,.13);
  color:#aaa7a2;
}
.roast-connector{
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}
.roast-connector:before{
  content:"";
  position:absolute;
  left:4px;
  right:4px;
  height:1px;
  background:rgba(227,24,55,.35);
}
.roast-connector span{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:50%;
  background:#f5f2ed;
  border:1px solid rgba(227,24,55,.35);
  color:#e31837;
  font-size:18px;
  animation:roastArrow 2.4s ease-in-out infinite;
}
@keyframes roastArrow{
  0%,100%{transform:translateX(-2px)}
  50%{transform:translateX(3px)}
}
@media(max-width:980px){
  .roast-steps{
    grid-template-columns:1fr;
    gap:18px;
  }
  .roast-connector{
    height:38px;
  }
  .roast-connector:before{
    top:0;
    bottom:0;
    left:50%;
    right:auto;
    width:1px;
    height:auto;
  }
  .roast-connector span{
    transform:rotate(90deg);
  }
  .roast-step{
    min-height:0;
  }
}
@media(max-width:520px){
  .roast-card-top,
  .roast-card-body,
  .roast-card-foot{
    padding-left:22px;
    padding-right:22px;
  }
  .roast-step h3{
    font-size:34px;
  }
}
@media(prefers-reduced-motion:reduce){
  .roast-connector span{animation:none}
}