html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-body);font-size:var(--text-body-size);line-height:var(--leading-body);font-weight:var(--weight-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,.rds-display{font-family:var(--font-display);font-weight:var(--weight-display);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:var(--text-authority);text-decoration:none;border-bottom:1px solid var(--line-gold);transition:color var(--dur-hover) var(--ease-out),border-color var(--dur-hover) var(--ease-out)}
a:hover{color:var(--action-gold-line-hover);border-bottom-color:var(--gold-500)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--action-focus-ring);outline-offset:3px}
img,video{display:block;max-width:100%}
::selection{background:var(--accent-gold-soft);color:var(--ink-900)}

/* Editorial label — small caps rule used above every section title */
.rds-label{font-family:var(--font-body);font-size:var(--text-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-authority);display:inline-flex;align-items:center;gap:var(--space-3)}
.rds-label::before{content:"";width:28px;height:1px;background:var(--line-gold-solid);flex:none}

/* Scroll reveal — fade + 16px rise, driven by the Reveal component */
.rds-reveal{opacity:0;transform:translateY(var(--reveal-shift));transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-reveal) var(--ease-out);transition-delay:var(--reveal-delay,0ms);will-change:opacity,transform}
.rds-reveal.is-in{opacity:1;transform:none}

/* Responsive scaffolds. Components own their look inline; these own only the
   breakpoints, which inline styles cannot express. */
.rds-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,420px);gap:clamp(32px,5vw,80px);align-items:center}
.rds-split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
.rds-two-up{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:clamp(32px,6vw,96px);align-items:start}
.rds-footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--space-7)}
.rds-gallery{display:grid;grid-template-columns:repeat(var(--gallery-cols,4),minmax(0,1fr));gap:var(--grid-gap)}
.rds-gallery{
  --gallery-cols:4; /* @kind other */
}
@media (max-width:1040px){
  .rds-hero-grid{grid-template-columns:minmax(0,1fr)}
  .rds-footer-grid{grid-template-columns:1fr 1fr}
  .rds-gallery{--gallery-cols:2; /* @kind other */}
}
@media (max-width:820px){
  .rds-split,.rds-two-up{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .rds-footer-grid{grid-template-columns:1fr}
  .rds-gallery{--gallery-cols:1; /* @kind other */}
}

/* Inverse zone — flips the semantic layer for any subtree on the dark anchor.
   Children need no inverse-aware props: the tokens they already read change under them. */
.rds-inverse-zone{background:var(--surface-inverse);color:var(--text-on-inverse);--surface-card:var(--bronze-800);--surface-raised:var(--bronze-600);--surface-sunken:var(--bronze-900);--text-body:var(--parchment-100);--text-muted:var(--text-on-inverse-muted);--text-faint:rgba(251,246,237,.42);--text-authority:var(--gold-500);--text-accent:var(--gold-500);--line-hairline:var(--line-on-inverse);--line-strong:rgba(247,241,230,.34);--action-secondary-line:var(--gold-500);--action-secondary-text:var(--gold-400);--action-secondary-bg-hover:rgba(211,190,134,.10);--action-gold-line-hover:var(--gold-400);--action-focus-ring:var(--action-focus-ring-inverse)}
.rds-inverse-zone a{color:var(--gold-400)}
.rds-inverse-zone a:hover{color:var(--gold-500)}