/* ============ TOKENS ============ */
:root {
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
  --text-3xl: clamp(2.75rem, 1rem + 4.5vw, 5.25rem);

  --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;

  --radius-sm:.375rem; --radius-md:.5rem; --radius-lg:.75rem; --radius-full:9999px;
  --transition:220ms cubic-bezier(.16,1,.3,1);
  --content-wide:1200px;

  /* Brand palette */
  --rpm-espresso:#080604;
  --rpm-rust:#280905;
  --rpm-navy:#020b1c;
  --rpm-offwhite:#fffbf7;
  --rpm-orange:#cc3902;

  --font-display:'Source Sans 3','Helvetica Neue',sans-serif;
  --font-body:'Source Sans 3','Helvetica Neue',sans-serif;
  --font-mono:'Source Sans 3','Helvetica Neue',sans-serif;
}

/* DARK (default) — espresso / rust / navy */
[data-theme="dark"] {
  --color-bg:#080604;
  --color-surface:#120a07;
  --color-surface-2:#1c0f0a;
  --color-border:#33231c;
  --color-text:#fffbf7;
  --color-text-muted:#c5b3a8;
  --color-text-faint:#8a7468;
  --color-text-inverse:#080604;
  --color-accent:#cc3902;        /* orange pop */
  --color-accent-hover:#e6470d;
  --color-accent-soft:#280905;   /* dark rust */
  --hero-scrim:linear-gradient(180deg, rgba(8,6,4,0) 0%, rgba(8,6,4,.10) 45%, rgba(8,6,4,.72) 100%);
  --hero-scrim-side:linear-gradient(90deg, rgba(8,6,4,.78) 0%, rgba(8,6,4,.45) 42%, rgba(8,6,4,0) 72%);
  --shadow-lg:0 24px 60px rgba(0,0,0,.6);
  --grid-line:rgba(255,251,247,.035);
}

/* LIGHT — off-white / rust */
[data-theme="light"] {
  --color-bg:#fffbf7;
  --color-surface:#fff;
  --color-surface-2:#f4ece5;
  --color-border:#e3d4c8;
  --color-text:#1a0d08;
  --color-text-muted:#6b5347;
  --color-text-faint:#a08d7f;
  --color-text-inverse:#fffbf7;
  --color-accent:#cc3902;
  --color-accent-hover:#a82d00;
  --color-accent-soft:#f4e5dc;
  --hero-scrim:linear-gradient(180deg, rgba(8,6,4,.15) 0%, rgba(8,6,4,.35) 40%, rgba(8,6,4,.88) 100%);
  --hero-scrim-side:linear-gradient(90deg, rgba(8,6,4,.70) 0%, rgba(8,6,4,.38) 42%, rgba(8,6,4,0) 72%);
  --shadow-lg:0 20px 50px rgba(40,9,5,.14);
  --grid-line:rgba(40,9,5,.04);
}

/* ============ BASE ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth;scroll-padding-top:5rem;}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);
  color:var(--color-text);background:var(--color-bg);transition:background var(--transition),color var(--transition);}
img,svg{display:block;max-width:100%;height:auto;}
ul[role=list]{list-style:none;}
a{color:inherit;text-decoration:none;}
button{cursor:pointer;background:none;border:none;color:inherit;font:inherit;}
h1,h2,h3{text-wrap:balance;line-height:1.1;font-family:var(--font-display);font-weight:400;letter-spacing:-.01em;}
p{text-wrap:pretty;}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:var(--radius-sm);}
::selection{background:color-mix(in oklab,var(--color-accent) 32%,transparent);}
a,button{transition:color var(--transition),background var(--transition),border-color var(--transition),transform var(--transition);}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}}

.container{width:100%;max-width:var(--content-wide);margin-inline:auto;padding-inline:clamp(var(--space-5),5vw,var(--space-16));}
.skip-link{position:absolute;left:-999px;top:0;background:var(--color-accent);color:#fff;padding:var(--space-3) var(--space-4);z-index:100;}
.skip-link:focus{left:var(--space-4);top:var(--space-4);}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}

/* ============ SHARED TYPE ============ */
.eyebrow,.section-kicker{font-family:var(--font-body);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.22em;color:var(--color-accent);font-weight:600;}
.eyebrow{display:inline-flex;align-items:center;gap:var(--space-3);}
.eyebrow__dot{width:7px;height:7px;border-radius:50%;background:var(--color-accent);box-shadow:0 0 0 4px color-mix(in oklab,var(--color-accent) 25%,transparent);}
.section-title{font-size:var(--text-2xl);margin-top:var(--space-3);font-style:normal;font-weight:400;}
.section-title--sm{font-size:var(--text-xl);}
.section-intro{font-size:var(--text-lg);color:var(--color-text-muted);max-width:60ch;margin-top:var(--space-5);line-height:1.5;}

/* ============ BUTTONS ============ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
  font-family:var(--font-body);font-size:var(--text-sm);font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  padding:var(--space-3) var(--space-6);border-radius:0;border:1px solid transparent;}
.btn--lg{padding:var(--space-4) var(--space-8);font-size:var(--text-sm);}
.btn--sm{padding:var(--space-2) var(--space-4);}
.btn--primary{background:#fffbf7;color:#080604;}
.btn--primary:hover{background:#fffbf7;transform:translateY(-2px);box-shadow:0 10px 24px rgba(255,251,247,.18);}
.btn--line{border-color:var(--color-border);color:var(--color-text);}
.btn--line:hover{border-color:var(--color-accent);color:var(--color-accent);}
.btn--ghost{border-color:transparent;color:var(--color-text);}
.btn--ghost:hover{color:var(--color-accent);}

/* ============ HEADER ============ */
.header{position:absolute;top:0;left:0;right:0;z-index:50;background:transparent;}
.header__inner{max-width:var(--content-wide);margin-inline:auto;padding:var(--space-5) clamp(var(--space-5),5vw,var(--space-16));
  display:flex;align-items:center;justify-content:center;gap:var(--space-4);}
.brand{display:inline-flex;align-items:center;color:var(--color-text);}
.brand__logo{height:42px;width:auto;display:block;}
.header__inner--centered{justify-content:center;}
.header__inner--centered .brand{justify-self:center;}
.header__inner--centered .brand__logo{height:80px;}
[data-theme="dark"] .brand__logo--dark{display:none;}
[data-theme="light"] .brand__logo--light{display:none;}
.header__nav{display:flex;align-items:center;gap:var(--space-6);}
.header__nav>a:not(.btn){font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;font-weight:600;}
.header__nav>a:not(.btn):hover{color:var(--color-text);}
.theme-toggle{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-sm);border:1px solid var(--color-border);color:var(--color-text-muted);}
.theme-toggle:hover{color:var(--color-accent);border-color:var(--color-accent);}

/* ============ HERO ============ */
.hero{position:relative;min-height:min(86vh,760px);display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;background:var(--rpm-navy);}
.hero__media{position:absolute;inset:0;z-index:0;}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:center 35%;}
.hero__scrim{position:absolute;inset:0;background:var(--hero-scrim);}
.hero__scrim--side{position:absolute;inset:0;background:var(--hero-scrim-side);z-index:1;}
.hero__content{position:relative;z-index:2;max-width:var(--content-wide);margin-inline:auto;width:100%;
  padding:0 clamp(var(--space-5),5vw,var(--space-16)) clamp(var(--space-10),6vw,var(--space-16));}
.hero h1{font-size:var(--text-3xl);font-weight:600;color:#fffbf7;margin:var(--space-5) 0 var(--space-6);max-width:16ch;letter-spacing:-.01em;line-height:1.04;}
.hero h1 em{font-style:italic;font-weight:500;color:var(--rpm-orange);}
.hero__eyebrow{margin-bottom:var(--space-4);font-size:var(--text-sm);letter-spacing:.2em;}
.hero h1.hero__h1--sans{font-family:'Lora','Georgia',serif;text-transform:none;font-size:clamp(1.9rem,1.1rem + 2.4vw,3.2rem);font-weight:600;letter-spacing:0;line-height:1.12;max-width:24ch;margin-top:0;}
.hero__lede{font-size:var(--text-base);color:rgba(255,251,247,.82);max-width:78ch;line-height:1.55;}
.hero__link{display:inline-flex;align-items:center;gap:var(--space-3);margin-top:var(--space-10);padding:.8rem 1.6rem;font-size:var(--text-sm);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#fffbf7;background:transparent;border:1.5px solid rgba(255,251,247,.55);border-radius:0;text-decoration:none;transition:background .2s ease,color .2s ease,border-color .2s ease;}
.hero__link span{transition:transform .2s ease;}
.hero__link:hover{background:#fffbf7;color:#080604;border-color:#fffbf7;}
.hero__link:hover span{transform:translateX(4px);}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-8);}
.hero .btn--line{border-color:rgba(255,251,247,.4);color:#fffbf7;}
.hero .btn--line:hover{border-color:var(--color-accent);color:var(--color-accent);background:rgba(255,251,247,.04);}

/* ============ CAPABILITIES ============ */
.capabilities{padding-block:clamp(var(--space-16),8vw,var(--space-24));background:var(--color-surface);position:relative;}
.cap__head{margin-bottom:var(--space-12);max-width:760px;}
.cap__head .section-intro{margin-top:var(--space-4);}
.cap-row{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-8) var(--space-6);}
.cap-item{display:flex;flex-direction:column;gap:var(--space-2);padding-top:var(--space-5);border-top:2px solid var(--color-border);transition:border-color var(--transition);}
.cap-item:hover{border-color:var(--color-accent);}
.cap-item__no{font-family:var(--font-display);font-style:normal;font-size:var(--text-lg);color:var(--color-accent);font-weight:400;}
.cap-item h3{font-size:var(--text-lg);font-weight:600;}
.cap-item p{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.55;}

/* ============ WORK / PHOTOS ============ */
.work{background:var(--rpm-rust);color:var(--rpm-offwhite);padding-block:clamp(var(--space-16),8vw,var(--space-24));position:relative;overflow:hidden;}
.work__head{max-width:680px;margin-bottom:var(--space-12);}
.work__head .section-kicker{color:var(--rpm-orange);}
.work__head h2{font-size:var(--text-2xl);font-style:normal;font-weight:400;margin-top:var(--space-3);color:var(--rpm-offwhite);}
.work__head p{font-size:var(--text-lg);color:rgba(255,251,247,.78);margin-top:var(--space-5);line-height:1.5;max-width:60ch;}
.work__grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:1fr;gap:var(--space-4);}
.work__fig{position:relative;overflow:hidden;border-radius:var(--radius-md);background:var(--rpm-espresso);}
.work__fig img{width:100%;height:100%;object-fit:cover;transition:transform 600ms cubic-bezier(.16,1,.3,1);filter:saturate(1.02);}
.work__fig:hover img{transform:scale(1.04);}
.work__fig::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(8,6,4,.35));pointer-events:none;}
.work__fig--a{grid-column:span 7;aspect-ratio:16/10;}
.work__fig--b{grid-column:span 5;aspect-ratio:auto;}
.work__fig--c{grid-column:span 5;aspect-ratio:auto;}
.work__fig--d{grid-column:span 7;aspect-ratio:16/10;}
.work__cap{position:absolute;left:var(--space-5);bottom:var(--space-4);z-index:2;font-family:var(--font-body);font-size:var(--text-xs);
  text-transform:uppercase;letter-spacing:.16em;font-weight:600;color:rgba(255,251,247,.92);}

/* ============ REBRAND ============ */
.rebrand{padding-block:clamp(var(--space-20),10vw,var(--space-32));background:var(--color-bg);position:relative;overflow:hidden;}
.rebrand::before{content:"";position:absolute;inset:0;
  background:radial-gradient(70% 90% at 50% -10%,color-mix(in oklab,var(--color-accent) 14%,transparent),transparent 62%);}
.rebrand__inner{position:relative;max-width:760px;text-align:center;margin-inline:auto;display:flex;flex-direction:column;align-items:center;}
.rebrand__mark{width:86px;height:auto;margin-bottom:var(--space-6);display:block;}
.rebrand__tag{display:inline-flex;align-items:center;gap:var(--space-3);font-family:var(--font-body);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.22em;color:var(--color-accent);font-weight:600;
  border:1px solid color-mix(in oklab,var(--color-accent) 45%,var(--color-border));border-radius:var(--radius-full);
  padding:var(--space-3) var(--space-6);margin-bottom:var(--space-6);}
.rebrand__pulse{width:10px;height:10px;border-radius:50%;background:var(--color-accent);animation:pulse 2s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in oklab,var(--color-accent) 55%,transparent);}70%{box-shadow:0 0 0 10px transparent;}100%{box-shadow:0 0 0 0 transparent;}}
.rebrand h2{font-size:var(--text-xl);margin-bottom:var(--space-4);font-style:normal;font-weight:400;}
.rebrand__lede{font-size:var(--text-base);color:var(--color-text-muted);max-width:68ch;margin-bottom:var(--space-8);line-height:1.55;}
.signup{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3);width:100%;max-width:520px;}
.signup input{flex:1 1 240px;min-width:0;padding:var(--space-4) var(--space-5);font-size:var(--text-base);
  background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:0;font-family:var(--font-body);}
.signup input::placeholder{color:var(--color-text-faint);}
.signup input:focus-visible{border-color:var(--color-accent);outline:none;}
.signup .btn{flex:0 0 auto;}
.signup__note{flex:1 1 100%;font-family:var(--font-body);font-size:var(--text-xs);color:var(--color-text-faint);margin-top:var(--space-2);letter-spacing:.02em;}
.signup__note--ok{color:#7bd88f;}
.signup__note--err{color:#e6470d;}
.rebrand__divider{display:flex;align-items:center;gap:var(--space-4);width:100%;max-width:520px;margin:var(--space-12) 0 var(--space-5);color:var(--color-text-faint);}
.rebrand__divider::before,.rebrand__divider::after{content:"";flex:1;height:1px;background:var(--color-border);}
.rebrand__divider span{font-family:var(--font-body);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.28em;font-weight:700;color:var(--color-accent);white-space:nowrap;}
.rebrand__current{font-size:var(--text-lg);color:var(--color-text-muted);max-width:48ch;margin-bottom:var(--space-5);}

/* ============ CONTACT ============ */
.contact{padding-block:clamp(var(--space-16),9vw,var(--space-24));background:var(--color-surface);border-top:1px solid var(--color-border);}
.contact__inner{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(var(--space-10),6vw,var(--space-20));align-items:center;}
.contact__cards{display:flex;flex-direction:column;gap:var(--space-4);}
.contact-card{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-6);
  background:var(--color-bg);border:1px solid var(--color-border);border-radius:0;transition:border-color var(--transition),transform var(--transition);}
a.contact-card:hover{border-color:var(--color-accent);transform:translateX(4px);}
.contact-card__label{font-family:var(--font-body);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.18em;color:var(--color-text-faint);font-weight:600;}
.contact-card__value{font-family:var(--font-display);font-weight:400;font-size:var(--text-lg);}
a.contact-card:hover .contact-card__value{color:var(--color-accent);}

/* ============ FOOTER ============ */
.footer{background:var(--rpm-espresso);color:var(--rpm-offwhite);border-top:1px solid var(--color-border);padding-block:var(--space-12);}
.footer__inner{display:flex;flex-direction:column;gap:var(--space-5);}
.footer__brand{display:flex;align-items:center;gap:var(--space-5);flex-wrap:wrap;}
.footer__logo{height:40px;width:auto;opacity:.95;}
.footer__tag{font-family:var(--font-body);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.2em;color:var(--color-accent);font-weight:600;}
.footer__legal{font-size:var(--text-xs);color:rgba(255,251,247,.55);max-width:70ch;}
.footer__legal a{color:rgba(255,251,247,.8);}
.footer__legal a:hover{color:var(--color-accent);}

/* ============ RESPONSIVE ============ */
@media (max-width:980px){
  .cap-row{grid-template-columns:repeat(2,1fr);gap:var(--space-10) var(--space-8);}
}
@media (max-width:760px){
  .header__inner--centered .brand__logo{height:60px;}
  .cap-row{grid-template-columns:1fr;gap:var(--space-8);}
  .contact__inner{grid-template-columns:1fr;}
  .signup .btn{flex:1 1 100%;}
  .work__fig--a,.work__fig--b,.work__fig--c,.work__fig--d{grid-column:1 / -1;aspect-ratio:16/10;}
}

/* reveal — only hide once JS marks the page ready, so no-JS users still see everything */
.js-ready .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1);}
.js-ready .reveal.is-in{opacity:1;transform:none;}