/* ═══════════════════════════════════════════════════════════════════════════
   REPLYRATE SITE SHELL
   One stylesheet for every standalone page: /about, /pricing, /privacy,
   /terms, /cookies, /gdpr and the 404. It mirrors the public landing
   (#landing.apx-page in styles.css, plus the Swiss typography block) value
   for value, so the site reads as ONE design from any URL:

     frame        #cfcdca page frame, white canvas card with an 8px radius
     type         Instrument Sans; display 600 at -.045em, body 400
     buttons      yellow #e5ff00 primary, 1px #171717 outline secondary, 8px
     footer       #111 with the four link columns and the bottom rule

   Each rule names the landing rule it copies. When the landing changes,
   change the same value here. Nothing in this file is loaded by index.html.
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
  --rr-frame:#cfcdca;        /* #landing.apx-page background */
  --rr-canvas:#fff;          /* .apx-canvas */
  --rr-tint:#F4F4F2;         /* .apx-platform background */
  --rr-tint-2:#f7f5f0;       /* .apx-faq background */
  --rr-ink:#0d0d0d;          /* #landing.apx-page color */
  --rr-ink-2:#292929;        /* .apx-hero-copy */
  --rr-ink-3:#4f4f4f;        /* .apx-product-copy p */
  --rr-muted:#747474;        /* .apx-terms */
  --rr-kicker:#6c7484;       /* .apx-flow-kicker */
  --rr-hair:#dedad2;         /* .apx-faq border-top */
  --rr-hair-strong:#aaa59d;  /* .apx-faq-list rules */
  --rr-line:#171717;         /* outline buttons */
  --rr-accent:#e5ff00;       /* .apx-nav-btn.primary */
  --rr-accent-h:#d6ee00;     /* .apx-hero-actions button.primary:hover */
  --rr-footer:#111;          /* .apx-footer */
  --rr-font:'Instrument Sans',Arial,Helvetica,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--rr-frame);color:var(--rr-ink);font-family:var(--rr-font);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit}
::selection{background:var(--rr-accent);color:var(--rr-ink)}
:focus-visible{outline:2px solid var(--rr-ink);outline-offset:3px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ── Page frame (#landing.apx-page) ─────────────────────────────────────── */
.rr-page{min-height:100vh;min-height:100svh;padding:0 16px 16px;display:flex;flex-direction:column}

/* ── Header (.apx-nav) ──────────────────────────────────────────────────── */
.rr-nav{height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 4px;max-width:1440px;width:100%;margin:0 auto;background:var(--rr-frame)}
.rr-nav-left,.rr-nav-right,.rr-nav-links{display:flex;align-items:center}
.rr-nav-left{gap:42px}
.rr-nav-links{gap:34px}
.rr-nav-right{gap:12px}
.rr-brand{display:inline-flex;align-items:center;gap:8px;line-height:1;text-decoration:none}
.rr-brand img{display:block;flex:0 0 auto}
.rr-brand-word{font-weight:600;font-size:25px;letter-spacing:-.03em;color:#111}
.rr-nav-links a{font-size:14px;text-decoration:none;color:#0c0c0c;white-space:nowrap}
.rr-nav-links a:hover{text-decoration:underline;text-underline-offset:4px}
.rr-nav-btn{height:44px;padding:0 18px;border:1px solid var(--rr-line);border-radius:8px;background:transparent;color:#0c0c0c;font:600 14px var(--rr-font);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap}
.rr-nav-btn:hover{background:rgba(255,255,255,.5)}
.rr-nav-btn.primary{background:var(--rr-accent);border-color:var(--rr-accent);padding:0 22px}
.rr-nav-btn.primary:hover{background:var(--rr-accent-h);border-color:var(--rr-accent-h)}
.rr-mobile-toggle{display:none;border:0;background:transparent;color:inherit;font-size:28px;line-height:1;cursor:pointer}

/* "Book a call" split button (.apx-book) */
.rr-book{position:relative}
.rr-book-btn{height:44px;padding:0 14px;border:1px solid var(--rr-line);background:transparent;border-radius:8px;font:600 14px var(--rr-font);cursor:pointer;color:#0c0c0c;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.rr-book-btn:hover{background:rgba(255,255,255,.5)}
.rr-book-btn svg{width:16px;height:16px;flex:0 0 16px}
.rr-book-btn .rr-book-chev{width:12px;height:12px;flex-basis:12px;transition:transform .18s ease}
.rr-book-btn[aria-expanded="true"] .rr-book-chev{transform:rotate(180deg)}
.rr-book-menu{position:absolute;top:52px;right:0;width:290px;background:#fff;border:1px solid rgba(17,17,17,.14);border-radius:12px;box-shadow:0 18px 44px -18px rgba(0,0,0,.35);padding:6px;z-index:60}
.rr-book-menu[hidden]{display:none}
.rr-book-item{display:block;border-radius:9px;padding:11px 12px;text-decoration:none;color:#0c0c0c}
.rr-book-item:hover{background:rgba(36,72,255,.06)}
.rr-book-item b{display:block;font-size:14px;font-weight:600}
.rr-book-item span{display:block;font-size:12px;color:#6b6963;margin-top:2px}
.rr-book-sep{height:1px;background:rgba(17,17,17,.08);margin:4px 8px}

/* ── Canvas (.apx-canvas) ───────────────────────────────────────────────── */
.rr-canvas{flex:1;display:flex;flex-direction:column;background:var(--rr-canvas);border-radius:8px;overflow:clip;max-width:1440px;width:100%;margin:0 auto;box-shadow:0 0 0 1px rgba(0,0,0,.035)}
.rr-canvas>.rr-footer{margin-top:auto}

/* ── Buttons (.apx-hero-actions button) ─────────────────────────────────── */
.rr-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 24px;border:1px solid var(--rr-line);border-radius:8px;background:transparent;color:#0c0c0c;font:700 15px var(--rr-font);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .16s ease}
.rr-btn:hover{background:#f3f1ec}
.rr-btn.primary{background:var(--rr-accent);border-color:var(--rr-accent)}
.rr-btn.primary:hover{background:var(--rr-accent-h);border-color:var(--rr-accent-h)}
.rr-btn.dark{background:#111;border-color:#111;color:#fff}
.rr-btn.dark:hover{background:#2a2a2a;border-color:#2a2a2a}
.rr-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ── Kicker / eyebrow (.apx-flow-kicker) ────────────────────────────────── */
.rr-kicker{display:block;font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--rr-kicker)}

/* ── Page hero (.apx-hero) ──────────────────────────────────────────────── */
.rr-hero{text-align:center;padding:68px 32px 36px}
.rr-hero .rr-kicker{margin-bottom:22px}
.rr-hero h1{margin:0 auto 22px;max-width:980px;font-weight:600;font-size:clamp(40px,5.4vw,72px);line-height:1;letter-spacing:-.045em;text-wrap:balance}
.rr-hero-copy{font-size:17px;line-height:1.5;max-width:650px;margin:0 auto;color:var(--rr-ink-2)}
.rr-hero-copy+.rr-actions{margin-top:28px}
.rr-hero-meta{margin:18px 0 0;font-size:13px;color:var(--rr-muted)}

/* ── Long-form article (legal pages, About) ─────────────────────────────── */
.rr-article{width:100%;max-width:820px;margin:0 auto;padding:16px 32px 104px;color:var(--rr-ink-3);font-size:16px;line-height:1.65}
.rr-article h2{margin:52px 0 14px;padding-top:24px;border-top:1px solid var(--rr-hair-strong);color:var(--rr-ink);font-size:26px;line-height:1.15;font-weight:600;letter-spacing:-.03em}
.rr-article h3{margin:28px 0 8px;color:var(--rr-ink);font-size:17px;line-height:1.3;font-weight:600;letter-spacing:-.01em}
.rr-article p{margin:0 0 14px}
.rr-article ul,.rr-article ol{margin:10px 0 18px;padding-left:22px}
.rr-article li{margin-bottom:7px}
.rr-article a{color:var(--rr-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:rgba(13,13,13,.35);transition:text-decoration-color .15s}
.rr-article a:hover{text-decoration-color:currentColor}
.rr-article strong{color:var(--rr-ink);font-weight:600}
.rr-article table{width:100%;border-collapse:collapse;margin:18px 0 24px;font-size:14px;border-top:1px solid var(--rr-hair-strong)}
.rr-article th,.rr-article td{padding:12px 16px 12px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--rr-hair)}
.rr-article th{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--rr-muted)}
.rr-article .rr-table-wrap{overflow-x:auto}
.rr-callout{background:var(--rr-tint-2);border:1px solid var(--rr-hair);border-radius:12px;padding:18px 20px;margin:22px 0;font-size:15px;color:var(--rr-ink-2)}
.rr-callout p:last-child{margin-bottom:0}
.rr-card{background:#fff;border:1px solid #ece7df;border-radius:14px;padding:22px 24px;margin:18px 0}
.rr-card h3{margin-top:0}
.rr-card p:last-child{margin-bottom:0}
.rr-meta{font-size:14px;color:var(--rr-muted);margin:0 0 8px}
.rr-article .rr-btn{margin-top:6px}

/* ── Closing band (.apx-ready) ──────────────────────────────────────────── */
.rr-ready{padding:26px 24px 96px;background:#fff}
.rr-ready-card{max-width:1280px;margin:0 auto;border-radius:26px;overflow:hidden;background:#191a1a;display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);min-height:440px}
.rr-ready-copy{padding:64px 56px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.rr-ready-copy h2{margin:0 0 20px;max-width:420px;font-weight:600;font-size:46px;line-height:1.06;letter-spacing:-.045em;color:#f4f3f0}
.rr-ready-copy p{margin:0 0 34px;max-width:340px;font-size:15px;line-height:1.65;color:#b9b7b2}
.rr-ready-copy .rr-actions{justify-content:flex-start}
.rr-ready-copy .rr-btn{height:48px;font-weight:600;font-size:14px}
.rr-ready-copy .rr-btn:not(.primary){border-color:rgba(255,255,255,.35);color:#f4f3f0}
.rr-ready-copy .rr-btn:not(.primary):hover{background:rgba(255,255,255,.08)}
.rr-ready-media{background:url('/assets/interview-banner.png') center/cover no-repeat;min-height:100%}

/* ── Footer (.apx-footer) ───────────────────────────────────────────────── */
.rr-footer{background:var(--rr-footer);color:#fff;padding:74px 64px 26px}
.rr-footer-grid{width:min(1320px,100%);margin:0 auto;display:grid;grid-template-columns:minmax(290px,1.7fr) repeat(4,minmax(120px,1fr));gap:48px;align-items:start}
.rr-footer-grid>div:first-child{padding-right:32px}
.rr-footer-brand{display:flex;align-items:center;gap:11px;margin-bottom:22px}
.rr-footer-mark{width:30px;height:30px;flex:0 0 auto;display:inline-flex}
.rr-footer-mark img{width:100%;height:100%;display:block}
.rr-footer-word{font-weight:600;font-size:26px;letter-spacing:-.03em;line-height:1;color:#f4f4f2}
.rr-footer p{max-width:420px;margin:0 0 16px;color:#c9c9c7;font:400 14px/1.65 var(--rr-font)}
.rr-footer-bio{display:block;max-width:430px;color:#969694;font:400 13px/1.65 var(--rr-font)}
.rr-footer h4{margin:4px 0 18px;color:#fff;font:700 12px/1.2 var(--rr-font);letter-spacing:.12em;text-transform:uppercase}
.rr-footer a{display:block;width:max-content;max-width:100%;margin:0 0 12px;color:#bcbcb9;text-decoration:none;font:400 14px/1.35 var(--rr-font);transition:color .18s ease}
.rr-footer a:hover{color:#fff}
.rr-footer-bottom{width:min(1320px,100%);margin:56px auto 0;padding-top:22px;border-top:1px solid #343434;display:flex;justify-content:space-between;gap:20px;color:#838381;font:400 12px/1.4 var(--rr-font)}

/* ── Pricing (the /pricing tiers, estimator and facts) ──────────────────── */
.rrp-main{width:100%;max-width:1320px;margin:0 auto;padding:52px 48px 40px;display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-content:start}
.rrp-hero-sec{grid-column:1 / span 7;min-width:0;padding-right:8px}
.rrp-aside{grid-column:8 / span 5;min-width:0;padding-left:32px;border-left:1px solid var(--rr-hair);display:grid;align-content:start;gap:32px}
.rrp-sec{display:grid;grid-template-columns:56px 1fr;gap:24px;align-items:start}
.rrp-ctarow+.rrp-sec{margin-top:52px}
.rrp-num{font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--rr-kicker);padding-top:9px;animation:rrpItemIn .35s both}
.rrp-body{min-width:0}
.rrp-rule{display:block;height:1px;background:#111;margin-top:22px;transform-origin:left;animation:rrpRuleIn .5s .05s both}
.rrp-lede{margin:16px 0 0;max-width:46ch;font-size:17px;line-height:1.5;color:var(--rr-ink-2);animation:rrpItemIn .35s .08s both}
.rrp-lede b{color:var(--rr-ink);font-weight:600}
.rrp-onboard{display:inline-block;margin:14px 0 0;font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--rr-kicker);text-decoration:none;animation:rrpItemIn .35s .12s both}
.rrp-onboard:hover{color:var(--rr-ink)}
.rrp-tiers{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid #111}
.rrp-tier{display:grid;grid-template-rows:auto auto auto 1fr;gap:7px;align-content:start;width:100%;padding:16px 16px 20px;text-align:left;cursor:pointer;font-family:var(--rr-font);color:var(--rr-ink);background:transparent;border:0;border-bottom:2px solid var(--rr-hair);transition:background .14s,border-color .14s;animation:rrpItemIn .35s both}
.rrp-tier:hover{background:var(--rr-tint-2)}
.rrp-tier:not(:last-child){border-right:1px solid var(--rr-hair)}
.rrp-tier.rrp-sel{border-bottom-color:#111}
.rrp-tier-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.rrp-tier-num{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#a8a8a2;white-space:nowrap}
.rrp-tier-num.rrp-rec{color:var(--rr-ink);font-weight:600}
.rrp-tier-mark{flex:none;width:12px;height:12px;border-radius:50%;background:transparent;border:1px solid var(--rr-hair-strong);transition:all .14s}
.rrp-sel .rrp-tier-mark{background:var(--rr-accent);border-color:#111}
.rrp-tier-amount{font-size:34px;font-weight:600;letter-spacing:-.04em;line-height:1}
.rrp-tier-credits{font-size:13px;font-weight:500;color:var(--rr-ink-3);white-space:nowrap}
.rrp-sel .rrp-tier-credits{color:var(--rr-ink);font-weight:600}
.rrp-tier-note{font-size:12px;line-height:1.5;color:var(--rr-ink-3)}
.rrp-ctarow{margin-top:26px;display:flex;align-items:center;justify-content:space-between;gap:24px;animation:rrpItemIn .35s .2s both}
.rrp-cta{min-height:52px;min-width:270px;display:inline-flex;align-items:center;justify-content:space-between;gap:22px;padding:0 20px;border-radius:8px;border:1px solid var(--rr-accent);background:var(--rr-accent);color:var(--rr-ink);font:700 15px var(--rr-font);text-decoration:none;cursor:pointer;transition:background .16s}
.rrp-cta:hover{background:var(--rr-accent-h);border-color:var(--rr-accent-h)}
.rrp-h2{margin:0;font-size:26px;font-weight:600;letter-spacing:-.03em;line-height:1.15}
.rrp-list{margin-top:16px;border-top:1px solid #111}
.rrp-row{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--rr-hair)}
.rrp-row-label{font-size:15px;font-weight:500}
.rrp-row-price{font-size:13px;font-weight:500;letter-spacing:.02em;color:var(--rr-ink);white-space:nowrap}
.rrp-fine{margin:14px 0 0;max-width:60ch;font-size:12.5px;line-height:1.6;color:var(--rr-muted)}
.rrp-figure{display:grid;justify-items:center;animation:rrpItemIn .4s .1s both}
#rrpFig{position:relative;display:block;width:170px}
#rrpFigImg{display:block;width:100%;aspect-ratio:1 / 1.22;background:url('/assets/portraits-editorial/general-business.webp') 50% 100%/contain no-repeat}
.rrp-figure-shadow{display:block;width:150px;height:5px;background:#111;opacity:.16;margin-top:5px}
.rrp-fig-head{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:8px;border-bottom:1px solid #111;font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.rrp-fig-head span:last-child{color:var(--rr-muted)}
.rrp-usages{margin-top:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.rrp-usage{height:44px;cursor:pointer;font:500 11px var(--rr-font);letter-spacing:.16em;text-transform:uppercase;color:var(--rr-ink);background:#f7f5f1;border:1px solid #ddd8d0;border-radius:6px;transition:.2s ease}
.rrp-usage:hover{background:#f0ede6}
.rrp-usage.rrp-on{background:var(--rr-accent);border-color:var(--rr-accent);color:#111}
.rrp-est{margin-top:22px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
#rrpEstCredits{font-size:clamp(46px,4.4vw,64px);font-weight:600;line-height:.9;letter-spacing:-.06em}
.rrp-est-unit{font-size:13px;font-weight:500;color:var(--rr-ink-3)}
#rrpEstBreakdown{margin:12px 0 0;max-width:40ch;font-size:13px;line-height:1.6;color:var(--rr-ink-3)}
#rrpLastsLine{margin-top:16px;padding-top:10px;border-top:1px solid #111;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--rr-ink)}
.rrp-facts{display:grid;gap:0;border-top:1px solid #111}
.rrp-fact{display:grid;grid-template-columns:56px 1fr;gap:20px;padding:13px 0;border-bottom:1px solid var(--rr-hair)}
.rrp-fact-num{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--rr-kicker)}
.rrp-fact-title{display:block;font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--rr-ink)}
.rrp-fact-body{display:block;margin-top:3px;font-size:12.5px;line-height:1.5;color:var(--rr-ink-3)}
.rrp-strip{width:100%;max-width:1320px;margin:0 auto;padding:12px 48px 56px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid var(--rr-hair);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--rr-muted)}
.rrp-strip i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--rr-accent);border:1px solid #111;margin-right:8px;vertical-align:middle}
.rrp-spark{position:absolute;left:50%;top:48%;border-radius:0;opacity:0;pointer-events:none;z-index:3;animation-timing-function:cubic-bezier(.08,.78,.16,1);animation-fill-mode:both}
@keyframes rrpItemIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes rrpRuleIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fireworkOut{0%{opacity:0;transform:translate(var(--sx),var(--sy)) rotate(45deg) scale(.3)}14%{opacity:1;transform:translate(calc(var(--sx) + (var(--dx) - var(--sx)) * .18),calc(var(--sy) + (var(--dy) - var(--sy)) * .18)) rotate(45deg) scale(1.2)}48%{opacity:.95;transform:translate(calc(var(--sx) + (var(--dx) - var(--sx)) * .6),calc(var(--sy) + (var(--dy) - var(--sy)) * .6 + var(--drop) * .2)) rotate(45deg) scale(1)}76%{opacity:.5;transform:translate(calc(var(--sx) + (var(--dx) - var(--sx)) * .88),calc(var(--sy) + (var(--dy) - var(--sy)) * .88 + var(--drop) * .6)) rotate(45deg) scale(.75)}100%{opacity:0;transform:translate(var(--dx),calc(var(--dy) + var(--drop))) rotate(45deg) scale(.3)}}
@keyframes fireworkOutAlt{0%{opacity:0;transform:translate(var(--sx),var(--sy)) rotate(45deg) scale(.3)}14%{opacity:1;transform:translate(calc(var(--sx) + (var(--dx) - var(--sx)) * .18),calc(var(--sy) + (var(--dy) - var(--sy)) * .18)) rotate(45deg) scale(1.2)}48%{opacity:.95;transform:translate(calc(var(--sx) + (var(--dx) - var(--sx)) * .6),calc(var(--sy) + (var(--dy) - var(--sy)) * .6 + var(--drop) * .2)) rotate(45deg) scale(1)}76%{opacity:.5;transform:translate(calc(var(--sx) + (var(--dx) - var(--sx)) * .88),calc(var(--sy) + (var(--dy) - var(--sy)) * .88 + var(--drop) * .6)) rotate(45deg) scale(.75)}100%{opacity:0;transform:translate(var(--dx),calc(var(--dy) + var(--drop))) rotate(45deg) scale(.3)}}
@media (prefers-reduced-motion:reduce){
  .rrp-num,.rrp-rule,.rrp-lede,.rrp-onboard,.rrp-tier,.rrp-ctarow,.rrp-figure{animation:none}
  .rrp-spark{display:none}
}

/* Inside the app the page is a same-origin iframe (the in-app Pricing view
   keeps the sidebar). The app already draws its own chrome around it, so the
   site header and footer hide and the content sits flat on the app's
   #F4F4F2. <html class="rr-framed"> is set by the inline script in <head>. */
html.rr-framed body{background:var(--rr-tint)}
html.rr-framed .rr-page{padding:0;min-height:0}
html.rr-framed .rr-nav,html.rr-framed .rr-footer{display:none}
html.rr-framed .rr-canvas{max-width:none;border-radius:0;box-shadow:none;background:var(--rr-tint)}
html.rr-framed .rrp-main{padding-top:36px}

/* ── 404 ────────────────────────────────────────────────────────────────── */
.rr-404{flex:1;display:flex;align-items:center;justify-content:center;padding:96px 32px 120px;text-align:center}
.rr-404-inner{max-width:560px}
.rr-404 .rr-kicker{margin-bottom:22px}
.rr-404 h1{margin:0 0 18px;font-weight:600;font-size:clamp(40px,6vw,72px);line-height:1;letter-spacing:-.045em}
.rr-404 p{margin:0 0 32px;font-size:17px;line-height:1.5;color:var(--rr-ink-2)}

/* ── Responsive (mirrors the landing's 980px / 760px / 680px passes) ────── */
@media (max-width:1100px){
  .rrp-main{padding:44px 32px 32px}
  .rrp-hero-sec{grid-column:1 / -1}
  .rrp-aside{grid-column:1 / -1;padding-left:0;border-left:0;padding-top:36px;border-top:1px solid var(--rr-hair)}
  .rrp-strip{padding:12px 32px 48px}
}
@media (max-width:980px){
  .rr-page{padding:0 10px 10px}
  .rr-canvas{border-radius:10px}
  /* Mobile nav: a plain column when open. Brand row, then each link
     full-width, then Book a call and Login. Nothing overlaps anything. */
  .rr-nav{height:auto;min-height:74px;padding:14px 2px;flex-wrap:wrap;align-items:center;row-gap:12px;position:relative}
  .rr-nav-left{flex:1;min-width:0;gap:14px;justify-content:space-between}
  .rr-nav-links{display:none}
  .rr-nav-right .rr-nav-btn.primary{display:none}
  .rr-nav-right .rr-book{display:none}
  .rr-mobile-toggle{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:8px}
  .rr-nav.menu-open .rr-nav-left{flex:0 0 100%;flex-wrap:wrap}
  .rr-nav.menu-open .rr-nav-links{display:flex;width:100%;flex-direction:column;align-items:stretch;gap:0;padding:10px 0 2px}
  .rr-nav.menu-open .rr-nav-links a{font-size:15px;padding:12px 4px;border-top:1px solid rgba(0,0,0,.08)}
  .rr-nav.menu-open .rr-nav-right{flex:0 0 100%;flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px}
  .rr-nav.menu-open .rr-nav-right .rr-book{display:block;flex:0 0 100%}
  .rr-nav.menu-open .rr-nav-right .rr-book .rr-book-btn{width:100%;justify-content:center}
  .rr-nav.menu-open .rr-nav-right .rr-book .rr-book-menu{position:static;width:100%;margin-top:6px;box-shadow:none;border-color:rgba(17,17,17,.2)}
  /* Owner, 2026-09-15, of the landing's open menu on a phone: "login not
     cantered". The same shape is here, and measured worse -- at 390px every
     other row spanned 374px and centred on 195, and Login was 322px centred
     on 169. The ☰ was sharing its line: the toggle lives in .rr-nav-right,
     which the open state drops onto its own full-width line at the BOTTOM of
     the drawer, so opening the menu carried the toggle from y=16 down to
     y=271 and the close control ended up under the last thing in the menu
     rather than where the thumb had just tapped to open it.

     The toggle comes out of the flow while the menu is open and sits at the
     rect it already occupies closed, so tapping ☰ twice never moves it, and
     Login takes the whole line like every other row. The offsets are this
     tier's padding (14px 2px) plus the centring of a 42px button, measured
     rather than guessed; the 680 tier drops the padding and repeats them. */
  .rr-nav.menu-open .rr-mobile-toggle{position:absolute;top:16px;right:2px}
  .rr-nav.menu-open .rr-nav-right .rr-nav-btn.primary{display:inline-flex;flex:0 0 100%;max-width:none;justify-content:center}
  .rr-brand img{width:24px;height:24px}
  .rr-brand-word{font-size:22px}

  .rr-hero{padding:44px 18px 28px}
  .rr-hero h1{font-size:clamp(38px,8vw,60px);max-width:720px;margin-bottom:18px}
  .rr-hero-copy{font-size:16px;line-height:1.5}
  .rr-article{padding:12px 24px 80px}
  .rr-article h2{margin-top:42px;font-size:23px}

  .rr-ready{padding:20px 16px 72px}
  .rr-ready-card{grid-template-columns:1fr;min-height:0}
  .rr-ready-copy{padding:44px 28px}
  .rr-ready-copy h2{font-size:36px}
  .rr-ready-media{min-height:240px}

  .rr-footer{padding:56px 24px 24px}
  .rr-footer-grid{grid-template-columns:1fr 1fr;gap:30px 22px}
  .rr-footer-grid>div:first-child{grid-column:1/-1;padding-right:0}
}
@media (max-width:720px){
  .rrp-tiers{grid-template-columns:1fr}
  .rrp-tier{border-right:0 !important}
  .rrp-ctarow{flex-direction:column;align-items:stretch;gap:14px}
  .rrp-cta{min-width:0;width:100%}
  .rrp-sec{grid-template-columns:1fr;gap:8px}
  .rrp-num{padding-top:0}
  .rrp-fact{grid-template-columns:44px 1fr;gap:12px}
  .rrp-usages{gap:8px}
  .rrp-usage{font-size:10px;letter-spacing:.12em}
}
@media (max-width:680px){
  .rr-page{padding:0 8px 8px}
  .rr-canvas{border-radius:8px}
  .rr-nav{padding:12px 0}
  /* The padding changed, so the toggle's closed rect changed with it. */
  .rr-nav.menu-open .rr-mobile-toggle{right:0}
  .rr-brand-word{font-size:21px}

  .rr-hero{padding:36px 14px 24px}
  .rr-hero h1{font-size:clamp(32px,9.5vw,48px);letter-spacing:-.035em}
  .rr-hero-copy{font-size:15px}
  .rr-article{padding:8px 16px 64px;font-size:15px}
  .rr-article h2{font-size:22px}
  .rr-article th,.rr-article td{padding:10px 12px 10px 0}
  .rr-actions{gap:10px}
  .rr-btn{height:48px;font-size:14px;padding:0 18px}
  .rrp-main{padding:32px 16px 24px}
  .rrp-strip{padding:12px 16px 40px;flex-direction:column;gap:8px}
  .rr-404{padding:64px 16px 88px}

  .rr-footer{padding:50px 16px 20px}
  .rr-footer-grid{grid-template-columns:1fr;gap:26px}
  .rr-footer-grid>div:first-child{grid-column:auto}
  .rr-footer p,.rr-footer-bio,.rr-footer a{font-size:14px}
  .rr-footer-bottom{margin-top:30px;padding-top:16px;flex-direction:column;align-items:flex-start;gap:6px}
  .rr-footer-word{font-size:23px}
}