/**
 * Rhythm Golf — rhythmgolf.com (landing pages).
 * Art direction of the shop theme "rhythm" (git.lana.works/Mediamart/rhythm-theme, v2.23.0):
 * assets/css/custom.css (tokens, fonts, buttons, header, footer) and assets/css/lnwkspages/*.css (hero, feature
 * list, rich text statement, tempo, text + media, CTA banner). Applied 2026-10-23.
 */

/* ---------- Fonts (self-hosted, latin subset, same files as the theme) ---------- */
@font-face{font-family:"STIX Two Text";font-style:normal;font-weight:400 700;font-display:swap;src:url("fonts/stix-two-text-latin.woff2") format("woff2")}
@font-face{font-family:"STIX Two Text";font-style:italic;font-weight:400 700;font-display:swap;src:url("fonts/stix-two-text-latin-italic.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/poppins-latin-400.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:italic;font-weight:400;font-display:swap;src:url("fonts/poppins-latin-400-italic.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/poppins-latin-500.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/poppins-latin-600.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/poppins-latin-700.woff2") format("woff2")}

/* ---------- Brand tokens (theme: "Brand tokens" + "brand gold" blocks, dark scheme) ---------- */
:root{
  --rg-brand:#cc9042;        --rg-brand-rgb:204,144,66;
  --rg-brand-hover:#d9a05a;
  --rg-brand-2:#cc9042;      --rg-brand-2-rgb:204,144,66;
  --rg-bg:#0b0b0b;           --rg-bg-rgb:11,11,11;
  --rg-surface:#151515;
  --rg-surface-2:#1f1f1f;
  --rg-surface-3:#2a2a2a;
  --rg-text:#f5f5f2;         --rg-text-rgb:245,245,242;
  --rg-text-soft:#d6d6d0;
  --rg-text-2:#a8a8a3;
  --rg-text-3:#76766f;
  --rg-border:rgba(255,255,255,.12);
  --rg-border-strong:rgba(255,255,255,.3);
  --rg-overlay:rgba(255,255,255,.06);
  --rg-danger:#e08a6d;
  --rg-font:"STIX Two Text",Georgia,"Times New Roman",serif;
  --rg-text-font:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --rg-caps:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --rg-radius:8px;
  --rg-pill:26px;
  /* Header row: 64px on mobile, 80px from 768px (the landing has no top bar) */
  --rg-header-h:64px;
  color-scheme:dark;
}
@media (min-width:768px){:root{--rg-header-h:80px}}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{margin:0}
body{background:var(--rg-bg);color:var(--rg-text);font-family:var(--rg-text-font);font-size:.9375rem;line-height:1.65;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
::selection{background:var(--rg-brand);color:#fff}
img{max-width:100%;display:block}
a{color:inherit;text-underline-offset:.2em}
a:focus-visible,button:focus-visible{outline:2px solid var(--rg-brand-2);outline-offset:3px}
/* Full width: every container spans the screen with a proportional side margin (5% of the width, 16px minimum) */
.wrap{padding-left:max(1rem,5vw,env(safe-area-inset-left));padding-right:max(1rem,5vw,env(safe-area-inset-right))}

/* ---------- Page transitions (View Transitions API, cross-document): a short cross-fade between the two pages ---------- */
@view-transition{navigation:auto}
.top{view-transition-name:rg-header}
::view-transition-old(root),::view-transition-new(root){animation-duration:.25s}
::view-transition-group(rg-header){animation-duration:.25s}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* ---------- Typography ---------- */
h1,h2,h3{font-family:var(--rg-font);font-weight:600;letter-spacing:-.01em;line-height:1.08;margin:0}
h2{font-size:clamp(2.125rem,5vw,3.25rem)}
h1 em,h2 em,h3 em{font-style:italic;font-weight:500;color:var(--rg-brand-2)}
p{margin:0}
.eyebrow{margin:0;font-family:var(--rg-caps);font-size:.75rem;font-weight:500;letter-spacing:.32em;text-transform:uppercase;line-height:1.4;color:var(--rg-text-2)}
.lead{color:var(--rg-text-2);font-size:clamp(1rem,1.4vw,1.125rem);max-width:620px}
.lead strong{color:var(--rg-text);font-weight:600}

/* ---------- Buttons: pills, Poppins caps ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:.875rem 1.625rem;border:1px solid transparent;border-radius:var(--rg-pill);background:none;color:inherit;font-family:var(--rg-caps);font-size:.75rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;line-height:1.4;text-decoration:none;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.btn.primary{background:var(--rg-brand);border-color:var(--rg-brand);color:#fff}
.btn.primary:hover{background:var(--rg-brand-hover);border-color:var(--rg-brand-hover)}
.btn.ghost{background:transparent;border-color:var(--rg-border-strong);color:var(--rg-text)}
.btn.ghost:hover{border-color:var(--rg-text)}
/* Brand band (gold): the button is black, as the theme's cta_banner "tone brand" */
.btn.dark{background:#0b0b0b;border-color:#0b0b0b;color:#fff}
.btn.dark:hover{background:#1f1f1f;border-color:#1f1f1f}
.btn:focus-visible{outline:0;box-shadow:0 0 0 .2rem rgba(var(--rg-brand-rgb),.45)}
.btn[disabled]{opacity:.6;cursor:progress}

/* ---------- Header: transparent over the hero, opaque #0b0b0b once scrolled, the row shrinks from 80 to 60px ---------- */
.top{position:fixed;inset:0 0 auto 0;z-index:10}
.top::before{content:"";position:absolute;inset:0;z-index:-1;background:#0b0b0b;opacity:0;transition:opacity .3s}
.top.scrolled::before{opacity:1}
.top .wrap{display:flex;align-items:center;gap:2rem;height:var(--rg-header-h);border-bottom:1px solid transparent;transition:height .3s ease,border-color .3s}
.top.scrolled .wrap{border-color:var(--rg-border)}
@media (min-width:768px){.top.scrolled .wrap{height:60px}}
.top .logo{display:block;line-height:0}
.top .logo img{height:44px;width:auto;transition:height .3s ease}
@media (min-width:768px){.top.scrolled .logo img{height:36px}}
@media (max-width:767.98px){.top .logo img{height:36px}}
.top nav{display:flex;gap:2rem;margin-left:auto}
.top nav a{font-family:var(--rg-caps);font-size:.6875rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--rg-text);text-decoration:none}
.top nav a:hover,.top nav a[aria-current]{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.5em}
.top .btn{padding:.625rem 1.125rem;font-size:.6875rem;white-space:nowrap}
/* From 1200px: logo | menu centred | button, the logo and the button share the free space equally */
@media (min-width:1200px){
  .top .wrap{display:grid;grid-template-columns:1fr auto 1fr}
  .top nav{margin:0}
  .top .btn{justify-self:end}
}
@media (max-width:859.98px){.top nav{display:none}.top .btn{margin-left:auto}}
@media (max-width:400px){.top .wrap{gap:1rem}.top .btn{padding:.625rem .875rem;font-size:.625rem;letter-spacing:.14em}}

/* ---------- Hero: full screen, the text block at the bottom left, never under the header ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:100svh;display:flex;align-items:flex-end;padding:calc(var(--rg-header-h) + 2rem) 0 clamp(3.5rem,9svh,6.5rem);color:var(--rg-text)}
/* Small screens: still at the bottom, but the text never starts above 30% of the viewport height */
@media (max-width:767.98px){.hero{padding-top:max(30svh,calc(var(--rg-header-h) + 2rem));padding-bottom:3rem}}
.hero-bg{position:absolute;inset:0;z-index:-1}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:62% 40%;transform:scale(1.04);animation:rg-drift 24s ease-out forwards}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,11,.55) 0%,rgba(11,11,11,0) 28%,rgba(11,11,11,.15) 50%,rgba(11,11,11,.92) 85%,#0b0b0b 100%)}
@keyframes rg-drift{to{transform:scale(1)}}
.hero .wrap{width:100%;display:grid;gap:1.5rem}
.hero .eyebrow{font-weight:600;color:var(--rg-text);text-shadow:0 1px 12px rgba(0,0,0,.6)}
.hero h1:not(.eyebrow),.hero .hero-title{margin:0;font-family:var(--rg-font);font-weight:600;letter-spacing:-.01em;font-size:clamp(2.125rem,4.4vw,3.5rem);line-height:.94;max-width:14ch;text-shadow:0 2px 40px rgba(0,0,0,.35)}
.hero .hero-title em{font-style:italic;font-weight:500;color:var(--rg-brand-2)}
@media (min-width:768px){.hero h1:not(.eyebrow),.hero .hero-title{max-width:24ch}}
.hero .lead{color:var(--rg-text);text-shadow:0 2px 24px rgba(0,0,0,.65)}
.hero .ctas{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.5rem}
/* Text link under the buttons: Poppins caps, thin underline */
.hero-link{justify-self:start;margin-top:.25rem;font-family:var(--rg-caps);font-size:.6875rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--rg-text);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:2px;transition:color .2s,border-color .2s;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.hero-link:hover{border-color:var(--rg-text)}
/* Home: the visual anchored right bottom; from 768px a lighter shade at the bottom so the feet, ball and putter stay visible
   (on mobile the text covers the player: the stronger default shade is kept) */
.hero--home .hero-bg img{object-position:right bottom;transform-origin:right bottom}
@media (min-width:768px){.hero--home .hero-bg::after{background:linear-gradient(180deg,rgba(11,11,11,.55) 0%,rgba(11,11,11,0) 28%,rgba(11,11,11,0) 58%,rgba(11,11,11,.45) 88%,rgba(11,11,11,.72) 100%)}}
/* Custom Putting Surface: the visual anchored right top, a 30% black overlay above it (under the text) */
.hero--pro .hero-bg img{object-position:right top;transform-origin:right top}
.hero--pro .hero-bg::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(0,0,0,.3)}

/* The 2:1 beat at 76 bpm, start to impact 0.79 s */
.rg-beats{display:flex;align-items:center;gap:14px;margin-top:1rem}
.rg-beats span{width:10px;height:10px;border-radius:50%;background:var(--rg-text);opacity:.25;animation:rg-beat 2.4s infinite}
.rg-beats span:nth-child(2){margin-left:36px;animation-delay:.526s}
.rg-beats span:nth-child(3){animation-delay:.789s}
.rg-beats small{font-family:var(--rg-caps);font-size:.625rem;letter-spacing:.24em;text-transform:uppercase;color:var(--rg-text);margin-left:1rem}
@keyframes rg-beat{0%{opacity:1;transform:scale(1.5);background:var(--rg-brand-2)}18%{opacity:.25;transform:scale(1);background:var(--rg-text)}100%{opacity:.25}}

/* Scroll cue: bottom right, a thin line with a dot running down; a click scrolls to the next section */
.rg-scroll{position:absolute;right:max(1rem,5vw);bottom:clamp(2rem,6svh,4rem);z-index:2;display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:.5rem;border:0;background:none;color:var(--rg-text);font-family:var(--rg-caps);font-size:.625rem;font-weight:500;letter-spacing:.32em;text-transform:uppercase;cursor:pointer;writing-mode:vertical-rl}
.rg-scroll__line{position:relative;width:1px;height:56px;background:rgba(255,255,255,.25);overflow:hidden}
.rg-scroll__line::after{content:"";position:absolute;left:-2px;top:-6px;width:5px;height:5px;border-radius:50%;background:var(--rg-brand-2);animation:rg-scroll 2.4s ease-in-out infinite}
@keyframes rg-scroll{0%{transform:translateY(0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateY(62px);opacity:0}}
.rg-scroll:focus{outline:none}
.rg-scroll:focus-visible{outline:1px solid rgba(255,255,255,.5);outline-offset:4px;border-radius:2px}
@media (max-width:767.98px){.rg-scroll{display:none}}

/* ---------- Sections ---------- */
section{padding-block:clamp(6rem,10vw,8rem)}
.sec-head{display:grid;gap:1.5rem;max-width:760px;margin-bottom:clamp(2.5rem,5vw,4rem)}
.sec-head .lead{margin:0}

/* Statement (manifesto): STIX Two Text, the dimmed middle part in <em>, the brand accent in <strong> */
.statement{margin-inline:auto;max-width:760px;text-align:center;font-family:var(--rg-font);font-size:clamp(1.625rem,3.6vw,2.625rem);line-height:1.3;font-weight:500;letter-spacing:-.01em;color:var(--rg-text)}
.statement em{font-style:normal;color:var(--rg-text-3)}
.statement strong{font-style:italic;font-weight:500;color:var(--rg-brand-2)}

/* Feature cards: cells separated by 1px lines in one rounded frame */
.cards{display:grid;gap:1px;margin:0;padding:0;list-style:none;background:var(--rg-border);border:1px solid var(--rg-border);border-radius:var(--rg-radius);overflow:hidden}
@media (min-width:861px){
  .cards--3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.cards>*{display:grid;gap:1rem;align-content:start;padding:3rem 2rem;background:var(--rg-bg)}
.cards .label{font-family:var(--rg-caps);font-size:.75rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--rg-brand-2)}
.cards h3{font-size:1.75rem;line-height:1.1}
.cards p{color:var(--rg-text-2)}

/* Plain cards (proof band under the hero): no frame, three open columns, 2.5rem apart */
.cards--plain{gap:2.5rem;background:none;border:0;border-radius:0;overflow:visible}
.cards--plain>*{padding:0;background:none}
.proof-band{padding-block:clamp(3.5rem,6vw,5rem)}

/* Text link call to action: gold Poppins caps, underlined, arrow */
.more{justify-self:start;display:inline-block;font-family:var(--rg-caps);font-size:.6875rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--rg-brand-2);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px;line-height:1.4;transition:color .2s}
.more::after{content:" \2192";letter-spacing:0}
.more:hover{color:var(--rg-text)}

/* ---------- Tempo (the 2:1 metronome) ---------- */
.tempo{display:grid;gap:3rem;align-items:center}
@media (min-width:992px){.tempo{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4.5rem}}
.tempo-text{display:grid;gap:1.5rem}
.tempo-text .lead{margin:0}
.points{display:grid;gap:1.25rem;margin:1rem 0 0}
.points div{display:grid;grid-template-columns:72px minmax(0,1fr);gap:1rem;align-items:baseline}
.points b{font-family:var(--rg-caps);font-size:.75rem;font-weight:600;letter-spacing:.16em;white-space:nowrap;color:var(--rg-brand-2)}
.points p{color:var(--rg-text-2)}
.points strong{color:var(--rg-text);font-weight:600}
.metro{display:grid;gap:2rem;padding:2.5rem 2rem 2rem;background:var(--rg-surface);border:1px solid var(--rg-border);border-radius:16px}
.track{height:120px}
.track svg{display:block;width:100%;height:100%;overflow:visible}
.track .axis{stroke:var(--rg-border-strong);stroke-width:1}
.track .tick{fill:var(--rg-text-3);transition:fill .15s}
.track .tick.hit{fill:var(--rg-brand-2)}
.track .lbl{fill:var(--rg-text-2);font-family:var(--rg-caps);font-size:10px;letter-spacing:.2em;text-transform:uppercase}
.track .head{fill:var(--rg-text)}
.track .ball{fill:#fff}
.ratio,.ratio-l{display:grid;grid-template-columns:2fr 1fr;gap:6px}
.ratio div{position:relative;height:6px;overflow:hidden;border-radius:3px;background:var(--rg-surface-2)}
.ratio div::after{content:"";position:absolute;inset:0;background:var(--rg-brand);transform-origin:left;transform:scaleX(var(--p,0))}
.ratio-l{margin-top:8px;font-family:var(--rg-caps);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--rg-text-3)}
.metro-ctrl{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
.metro-ctrl .btn{min-height:44px;padding-block:0}
.len{display:flex;gap:6px}
.len button{width:44px;height:44px;border:1px solid var(--rg-border-strong);border-radius:50%;background:transparent;color:var(--rg-text-2);font-family:var(--rg-caps);font-size:.75rem;font-weight:600;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.len button:hover{border-color:var(--rg-text);color:var(--rg-text)}
.len button[aria-pressed="true"]{background:var(--rg-brand);border-color:var(--rg-brand);color:#fff}
.len button:focus{outline:none}
.len button:focus-visible{outline:2px solid var(--rg-brand-2);outline-offset:2px}
.metro .note{margin:0;font-size:.875rem;font-style:italic;color:var(--rg-text-3)}

/* ---------- Text + media (custom surfaces band) ---------- */
.split{display:grid;gap:3rem;align-items:center}
@media (min-width:900px){.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4rem}}
.split-text{display:grid;gap:1.5rem;align-content:start}
.split-text .lead{margin:0}
.split-media{margin:0;border:1px solid var(--rg-border);border-radius:16px;overflow:hidden;background:var(--rg-surface)}
.split-media img{width:100%;height:auto}

/* ---------- Rows (Why Rhythm, custom surface page) ---------- */
.why{display:grid;gap:3rem;align-items:start}
@media (min-width:900px){.why{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:4rem}}
.rows{display:grid;border-top:1px solid var(--rg-border)}
.rows>div{display:grid;grid-template-columns:56px minmax(0,1fr);gap:1rem;padding:1.5rem 0;border-bottom:1px solid var(--rg-border)}
.rows b{font-family:var(--rg-font);font-style:italic;font-size:1.125rem;font-weight:500;color:var(--rg-brand-2);padding-top:4px}
.rows h3{font-size:1.5rem;margin-bottom:6px}
.rows p{color:var(--rg-text-2)}

/* ---------- Steps (custom surface page) ---------- */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2rem;counter-reset:f}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.steps div{display:grid;gap:.5rem;padding-top:1.5rem;border-top:1px solid var(--rg-border-strong);align-content:start}
.steps div::before{counter-increment:f;content:"0" counter(f);font-family:var(--rg-caps);font-size:.75rem;font-weight:600;letter-spacing:.2em;color:var(--rg-brand-2)}
.steps h3{font-size:1.375rem}
.steps p{color:var(--rg-text-2)}
.steps .time{justify-self:start;font-family:var(--rg-caps);font-size:.625rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--rg-brand-2);border:1px solid var(--rg-brand);border-radius:12px;padding:3px 10px}

/* ---------- Brand band (gold): the sign-up, as the theme's cta_banner "tone brand" ---------- */
.join{background:var(--rg-brand);color:#fff}
.join .cta{display:grid;gap:2rem;justify-items:center;text-align:center;max-width:760px;margin-inline:auto}
.join .eyebrow,.join .lead{color:rgba(255,255,255,.85)}
.join h2{max-width:22ch}
.join h2 em,.join .more{color:#fff}
/* Second action of the band: outline pill, white on the gold */
.join .btn.outline{border-color:rgba(255,255,255,.7);color:#fff;margin-top:.5rem}
.join .btn.outline:hover{border-color:#fff;background:rgba(255,255,255,.12)}
@media (max-width:480px){.join .btn.outline{width:100%}}
.join ::selection{background:#0b0b0b;color:#fff}
.signup{display:flex;gap:.5rem;width:100%;max-width:480px}
.signup input{flex:1;min-width:0;height:3rem;padding:0 1.375rem;border:1px solid transparent;border-radius:var(--rg-pill);background:#0b0b0b;color:var(--rg-text);font-family:var(--rg-text-font);font-size:1rem}
.signup input::placeholder{color:var(--rg-text-3);opacity:1}
.signup input:focus{outline:none;border-color:rgba(255,255,255,.5)}
.signup input:-webkit-autofill,.signup input:-webkit-autofill:hover,.signup input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px #0b0b0b inset;box-shadow:0 0 0 1000px #0b0b0b inset;-webkit-text-fill-color:var(--rg-text);caret-color:var(--rg-text);transition:background-color 9999s ease-out}
.signup .btn{height:3rem;padding-block:0}
.signup .btn:focus-visible{box-shadow:0 0 0 .2rem rgba(11,11,11,.35)}
.signup-msg{min-height:24px;margin-top:-1rem;font-size:.9375rem;font-style:italic;color:#fff}
.signup-msg.err{color:#0b0b0b}
.signup-note{font-size:.8125rem;color:rgba(255,255,255,.75);max-width:420px;margin-top:-1rem}
.sr,.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
@media (max-width:480px){.signup{flex-direction:column}.signup input{flex:none}}

/* ---------- Footer: contour lines of a golf course in the lower two thirds, mark and brand signature, a rule, then copyright and links ---------- */
footer{position:relative;isolation:isolate;overflow:hidden;background:var(--rg-bg);border-top:1px solid var(--rg-border);padding-top:clamp(3rem,6vw,5rem)}
footer::before{content:"";position:absolute;inset:33.333% 0 0;z-index:-1;pointer-events:none;background:url(footer-contours.svg) center bottom/cover no-repeat;opacity:.08}
@media (max-width:991.98px){footer::before{background-position:68% bottom}}
.foot-brand{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.5rem;padding-bottom:1.75rem;border-bottom:1px solid var(--rg-border)}
.foot-brand a{display:block;line-height:0}
.foot-brand img{height:48px;width:auto}
.foot-brand p{margin:0;font-family:var(--rg-caps);font-size:.6875rem;letter-spacing:.32em;text-transform:uppercase;color:var(--rg-text-2)}
.copyright{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;padding-block:1.5rem 2rem}
.copyright p{margin:0;font-family:var(--rg-caps);font-size:.625rem;letter-spacing:.24em;text-transform:uppercase;color:var(--rg-text-3)}
.foot-links{display:flex;flex-wrap:wrap;gap:.5rem 0;margin:0;padding:0;list-style:none}
.foot-links li+li::before{content:"";display:inline-block;width:1px;height:.75rem;margin-inline:1rem;background:var(--rg-border-strong);vertical-align:-.1rem}
.foot-links a{font-size:.8125rem;color:var(--rg-text-3);text-decoration:none;transition:color .2s}
.foot-links a:hover{color:var(--rg-text)}
@media (max-width:575.98px){
  .foot-brand{flex-direction:column;align-items:flex-start}
  .copyright{flex-direction:column-reverse;align-items:flex-start}
  .foot-links{gap:.5rem 1.5rem}
  .foot-links li+li::before{display:none}
}

/* ---------- Custom cursor (rhythm.js, mouse only): a dot and a lagging ring; on links and buttons the dot goes away and the ring grows, in the brand gold ---------- */
.rg-cursor{position:fixed;top:0;left:0;box-sizing:border-box;z-index:2000;pointer-events:none;border-radius:50%;opacity:0;transition:opacity .3s,border-color .3s,background-color .3s;view-transition-name:none}
.rg-cursor.is-visible{opacity:1}
.rg-cursor--dot{background:var(--rg-text)}
.rg-cursor--ring{border:2px solid rgba(var(--rg-text-rgb),.4)}
.rg-cursor--ring.is-active{border-color:var(--rg-brand-2)}

/* ---------- Reveal on scroll ---------- */
.rv{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform .9s ease}
.rv.in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .hero-bg img{animation:none;transform:none}
  .rg-beats span{animation:none;opacity:.6}
  .rg-scroll__line::after{animation:none;top:24px;opacity:1}
}