/* ══════════════════════════════════════════════════════════════════
   PerfectionResearch — theme stylesheet

   Palette, typography and rhythm come from the client's existing site.
   The tokens below are byte-identical to the ones in the homepage
   plugin's template, so the two packages cannot drift apart.

   Class vocabulary is the rs- prefix the theme's PHP already emits.
   ══════════════════════════════════════════════════════════════════ */

:root{
  --navy-900:#071630; --navy-800:#0A1F44; --navy-700:#14315F; --navy-600:#1E4174;
  --teal-700:#0A4D55; --teal-600:#0E6169; --teal-500:#157983; --teal-400:#4AA3AC; --teal-100:#E7F1F1;
  --bg:#FAF6EE; --surface:#FFFEFA; --border:#E7E0D2;
  --text:#1B2430; --text-muted:#746C5D; --text-inverse:#F5F1E7;
  --ok:#2E794D; --warn:#8C611B; --bad:#9A3B2E;
  --radius-sm:6px; --radius-md:12px; --radius-lg:20px;
  --shadow-sm:0 1px 2px rgba(10,31,68,.06);
  --shadow-md:0 8px 24px rgba(10,31,68,.08);
  --shadow-lg:0 20px 48px rgba(10,31,68,.14);
  --font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-serif:"Fraunces","Iowan Old Style","Georgia",serif;
  --font-mono:"IBM Plex Mono",ui-monospace,monospace;
  --announce-h:38px;

  /* The theme's inherited accent plumbing maps onto the brand teal, so
     anything still reading --accent stays on brand. */
  --accent:#0E6169; --accent-d:#0A4D55; --accent-l:#4AA3AC; --accent-t:rgba(14,97,105,.10);
  --paper2:#E7F1F1; --card:#FFFEFA; --divider:#E7E0D2; --ink:#1B2430; --r:12px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
/* The off-canvas drawer sits at translateX(100%) and still widens the
   document. `clip`, not `hidden`, so body does not become a scroll container
   and the sticky header keeps docking correctly. */
html,body{overflow-x:clip}
body{font-family:var(--font-sans);color:var(--text);background:var(--bg);line-height:1.5;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font:inherit;color:inherit}
.rs-container{width:100%;max-width:1220px;margin:0 auto;padding:0 24px}
.rs-sprite{position:absolute;width:0;height:0;overflow:hidden}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ══════ Buttons ══════ */
.rs-btn,.woocommerce .button,.woocommerce button.button,.woocommerce input.button,
.woocommerce a.button,.woocommerce #respond input#submit{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;
  border-radius:var(--radius-sm);padding:12px 22px;font-size:.95rem;background:var(--teal-600);
  color:#fff;border:none;line-height:1.3;white-space:nowrap;
  transition:transform .15s,box-shadow .15s,background .15s,color .15s}
.rs-btn:hover,.woocommerce .button:hover,.woocommerce a.button:hover,
.woocommerce button.button:hover,.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover{background:var(--teal-700);color:#fff;box-shadow:var(--shadow-md);transform:translateY(-1px)}
.rs-btn.ghost,.woocommerce a.button.wc-backward{background:transparent;color:var(--navy-800);border:1.5px solid var(--border)}
.rs-btn.ghost:hover,.woocommerce a.button.wc-backward:hover{background:transparent;border-color:var(--navy-800);color:var(--navy-800)}
.rs-btn.outline{background:transparent;color:var(--navy-800);border:1.5px solid var(--navy-800)}
.rs-btn.outline:hover{background:var(--navy-800);color:#fff}
.rs-btn.lg{padding:14px 28px;font-size:1rem}
.rs-btn.sm{padding:8px 14px;font-size:.85rem}
.rs-btn.block{width:100%}
.rs-btn[disabled],.woocommerce .button:disabled{opacity:.45;cursor:not-allowed;transform:none}

.rs-kicker{display:inline-block;font-family:var(--font-mono);font-size:.72rem;font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;color:var(--navy-700);background:var(--border);
  padding:6px 12px;border-radius:999px;margin-bottom:18px}
.rs-rule{width:54px;height:2px;background:var(--teal-500);margin:14px 0 16px}
.rs-page-title{font-family:var(--font-serif);font-weight:500;font-size:clamp(1.8rem,3.2vw,2.6rem);
  color:var(--navy-900);letter-spacing:-.005em;line-height:1.14}
.rs-page-title em{color:var(--teal-600);font-style:italic}
.rs-page-sub{color:var(--text-muted);max-width:62ch;font-size:.97rem}
.rs-crumb{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--text-muted);margin-bottom:22px}
.rs-crumb a:hover{color:var(--teal-600)}
.rs-narrow{max-width:860px;margin:0 auto}

/* ══════ Announcement ══════ */
.rs-announce{position:sticky;top:0;z-index:101;background:var(--navy-900);color:var(--text-inverse);
  font-size:.82rem;padding:9px 0;overflow:hidden;white-space:nowrap}
.rs-announce a{color:var(--teal-400);font-weight:600}
.rs-announce-in{display:flex;align-items:center;justify-content:center;gap:10px}
.rs-announce-track{display:flex;align-items:center;width:max-content;animation:rs-slide 34s linear infinite}
.rs-announce-copy{display:flex;align-items:center;flex-shrink:0}
.rs-announce-item{padding:0 10px;flex-shrink:0}
/* The first phrase of each pass is emphasised. Marked with a class rather
   than :first-child, because the copy block is rendered twice inside the
   track and :first-child would only ever match the opening item. */
.rs-announce-item.em{color:var(--teal-400);font-weight:600}
.rs-announce-sep{opacity:.35}
@keyframes rs-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ══════ Header ══════ */
.rs-nav{position:sticky;top:var(--announce-h);z-index:100;background:rgba(250,246,238,.92);
  backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--border);transition:box-shadow .2s}
.rs-nav.scrolled{box-shadow:var(--shadow-sm)}
.rs-nav-i{width:100%;max-width:1220px;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:28px;height:64px}
.rs-nav-center{display:flex;gap:26px;margin-left:8px;font-size:.88rem;font-weight:500}
.rs-nav-center a{padding:6px 0;color:var(--navy-800);border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.rs-nav-center a:hover,.rs-nav-center a.on{color:var(--teal-600);border-bottom-color:var(--teal-600)}
.rs-nav-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.rs-ico,.rs-nav-cart,.rs-nav-acct{display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;color:var(--navy-800);border:1px solid transparent;position:relative;
  transition:background .15s,border-color .15s}
.rs-ico:hover,.rs-nav-cart:hover,.rs-nav-acct:hover{background:var(--teal-100);border-color:var(--teal-100)}
.rs-cart-count{position:absolute;top:-2px;right:-2px;min-width:17px;height:17px;border-radius:999px;
  background:var(--teal-600);color:#fff;font-family:var(--font-mono);font-size:.6rem;font-weight:600;
  display:flex;align-items:center;justify-content:center;padding:0 4px}
.rs-pill{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:.7rem;
  font-weight:600;letter-spacing:.03em;color:var(--navy-800);border:1px solid var(--border);
  background:var(--surface);border-radius:999px;padding:6px 10px}
.rs-pill:hover{border-color:var(--teal-400)}
.rs-dd{position:relative}
.rs-dd-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:150px;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:6px;display:none;z-index:120}
.rs-dd-menu.open{display:block}
.rs-dd-menu button{display:block;width:100%;text-align:left;padding:8px 10px;border-radius:var(--radius-sm);font-size:.84rem}
.rs-dd-menu button:hover{background:var(--teal-100)}
.rs-dd-menu button.active{color:var(--teal-600);font-weight:600}
.rs-dd-note{font-size:.68rem;color:var(--text-muted);padding:8px 10px 4px;border-top:1px dashed var(--border);
  margin-top:4px;white-space:normal;line-height:1.35}
.rs-ham{display:none;flex-direction:column;gap:4px;width:36px;height:36px;align-items:center;justify-content:center}
.rs-ham span{width:18px;height:2px;background:var(--navy-800);border-radius:2px}

.rs-search{position:fixed;inset:0;background:rgba(7,22,48,.45);z-index:130;display:flex;align-items:flex-start;padding-top:14vh}
.rs-search[hidden]{display:none}
.rs-search-in{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:var(--radius-md);
  box-shadow:var(--shadow-lg);padding:14px 18px;max-width:640px;width:100%;margin:0 auto}
.rs-search-in input{flex:1;border:none;outline:none;font-size:1rem;background:transparent}

/* ══════ Wordmark ══════
   The supplied wordmark files carry a large transparent margin. The crop
   metrics are measured once per attachment by rs_wordmark_vars() and written
   onto the element, so --wm-h is the real visible height. .rs-wm-plain is the
   no-crop path for a tightly cropped file or an SVG. */
.rs-wm{--wm-h:28px;--wm-ar:4;--wm-sc:1;--wm-x:0;--wm-y:0;position:relative;display:block;
  height:var(--wm-h);width:calc(var(--wm-h)*var(--wm-ar));overflow:hidden;flex:none}
.rs-wm img{position:absolute;height:calc(var(--wm-h)*var(--wm-sc));width:auto;max-width:none;
  left:calc(var(--wm-h)*var(--wm-x));top:calc(var(--wm-h)*var(--wm-y))}
.rs-wm-plain{width:auto;overflow:visible}
.rs-wm-plain img{position:static;height:var(--wm-h)}
.rs-lockup{display:flex;align-items:center;gap:9px;font-weight:700;font-size:1.05rem;color:var(--navy-800)}
.rs-footer .rs-lockup{color:var(--text-inverse)}
.rs-lockup .bar{display:none}
.rs-lockup .wm{display:flex;flex-direction:column;line-height:1.05}
.rs-lockup .w2{font-size:.66rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted)}

/* ══════ Drawer ══════ */
.rs-drawer{position:fixed;top:0;right:0;bottom:0;width:min(320px,86vw);background:var(--surface);
  border-left:1px solid var(--border);z-index:140;transform:translateX(100%);transition:transform .25s;
  padding:22px 20px;display:flex;flex-direction:column;gap:4px;overflow-y:auto}
.rs-drawer.open{transform:none}
.rs-drawer a{padding:13px 4px;font-size:1rem;font-weight:500;color:var(--navy-800);border-bottom:1px solid var(--border)}
.rs-drawer a.rs-btn{border-bottom:none;color:#fff;margin-top:16px}
.rs-close{align-self:flex-end;font-size:1.6rem;line-height:1;color:var(--text-muted);margin-bottom:6px}
.rs-drawer-lang{margin-top:18px;border-top:1px dashed var(--border);padding-top:14px}
.rs-drawer-lang b{display:block;font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;
  letter-spacing:.05em;color:var(--text-muted);margin-bottom:8px;font-weight:600}
.rs-overlay{position:fixed;inset:0;background:rgba(7,22,48,.4);z-index:135;opacity:0;pointer-events:none;transition:opacity .25s}
.rs-overlay.open{opacity:1;pointer-events:auto}

/* ══════ Page scaffolding ══════ */
.rs-main,.rs-shop,.rs-coa,.rs-pdp,.rs-account,.rs-login-page,.rs-ty{padding-top:44px;padding-bottom:72px}
.rs-shop-head,.rs-coa-hd,.rs-account-head{margin-bottom:28px}
.rs-shop-count{display:block;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted);margin-bottom:16px}
.rs-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:22px}
.rs-panel+.rs-panel{margin-top:18px}
.rs-panel-h{font-family:var(--font-serif);font-weight:500;font-size:1.15rem;color:var(--navy-900);margin-bottom:14px}
.rs-slim{margin-top:40px;padding:16px 18px;border:1px dashed var(--border);border-radius:var(--radius-sm);
  font-size:.8rem;color:var(--text-muted)}
.rs-shop-empty,.rs-coa-empty{grid-column:1/-1;padding:40px;text-align:center;color:var(--text-muted);
  border:1px dashed var(--border);border-radius:var(--radius-md)}

/* Tile ground. The supplied shoot sits on a light warm-to-cool gradient, so
   anything the photo does not cover reads as part of the same backdrop. */
:root{--tile:#EDEFEE}

/* ══════ PRODUCT CARD ══════
   One definition. The homepage plugin, the shop archive and the COA Library
   all use it, so the three grids are dimensionally identical.

   The tile is square and the whole photo is visible — object-fit contain, not
   cover, so nothing is cropped whatever aspect ratio the photographer
   supplies. Because the tile's height follows the card width, card height
   cannot be a fixed pixel value; the BODY is pinned instead. Same width gives
   the same tile height, same body gives the same body height, so there is
   exactly one card height per grid. */
.rs-pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.rs-pc{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-md);overflow:hidden;color:var(--text);
  transition:transform .15s,box-shadow .15s,border-color .15s}
.rs-pc:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--teal-400)}
.rs-pc-img{position:relative;aspect-ratio:1/1;width:100%;flex:none;background:var(--tile);overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.rs-pc-img .rs-photo{width:100%;height:100%;object-fit:contain}
.rs-pc-tag{position:absolute;top:10px;left:10px;font-family:var(--font-mono);font-size:.58rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;background:var(--navy-900);color:var(--text-inverse);
  padding:4px 8px;border-radius:999px;z-index:3}
.rs-pc-tag.hot{background:var(--teal-600)}
.rs-pc-body{display:flex;flex-direction:column;flex:none;height:140px;overflow:hidden;padding:12px 14px 14px}
.rs-pc-purity{align-self:flex-start;font-family:var(--font-mono);font-size:.6rem;font-weight:600;
  background:var(--teal-100);color:var(--teal-600);padding:3px 8px;border-radius:999px;margin-bottom:8px}
/* Exactly two lines. Short names reserve the second, long names clip with an
   ellipsis and never reach a third. */
.rs-pc-name{font-size:.93rem;font-weight:600;color:var(--navy-800);line-height:1.28;height:2.56em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rs-pc-meta{font-size:.76rem;color:var(--text-muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rs-pc-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;flex-wrap:nowrap}
.rs-pc-price{font-family:var(--font-mono);font-weight:600;font-size:.95rem;color:var(--navy-900);white-space:nowrap;flex:none}
.rs-pc-price del{display:none}
.rs-pc-price ins{text-decoration:none}
.rs-pc-stock{font-family:var(--font-mono);font-size:.6rem;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;padding:3px 8px;border-radius:999px;white-space:nowrap;flex:none}
.rs-stock-in{color:var(--ok);background:rgba(47,125,79,.1)}
.rs-stock-low{color:var(--warn);background:rgba(154,107,30,.12)}
.rs-stock-out{color:var(--bad);background:rgba(154,59,46,.1)}

/* Placeholder tile — only until a featured image is uploaded. */
.rs-ph{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;background:var(--teal-100);position:relative}
.rs-ph-wm{position:absolute;width:62%;right:-12%;bottom:-14%;opacity:.08;color:var(--teal-600)}
.rs-ph-mk{width:46px;height:46px;position:relative;z-index:2}

/* ══════ PDP ══════ */
.rs-pdp-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.rs-img-wrap{position:relative;border-radius:var(--radius-md);overflow:hidden;background:var(--tile);
  aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.rs-img-wrap .rs-photo{width:100%;height:100%;object-fit:contain}
.rs-oos-pill{position:absolute;top:12px;right:12px;font-family:var(--font-mono);font-size:.6rem;font-weight:600;
  letter-spacing:.05em;text-transform:uppercase;background:var(--bad);color:#fff;padding:5px 10px;border-radius:999px}
.rs-topline{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.rs-eye{font-family:var(--font-mono);font-size:.68rem;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted)}
.rs-badge{font-family:var(--font-mono);font-size:.6rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  background:var(--navy-900);color:var(--text-inverse);padding:4px 9px;border-radius:999px}
.rs-pdp-title{font-family:var(--font-serif);font-weight:500;font-size:2.1rem;line-height:1.14;color:var(--navy-900)}
.rs-pdp-sz{font-family:var(--font-mono);font-size:.95rem;color:var(--text-muted);font-weight:500}
.rs-pdp-desc{color:var(--text-muted);margin:12px 0 18px;font-size:.95rem}
.rs-priceline{display:flex;align-items:baseline;gap:12px;margin-bottom:16px}
.rs-price-now{font-family:var(--font-mono);font-size:1.9rem;font-weight:600;color:var(--navy-900)}
.rs-price-per{font-size:.85rem;color:var(--text-muted)}
.rs-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.rs-chips span{font-family:var(--font-mono);font-size:.64rem;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;border:1px solid var(--border);color:var(--text-muted);padding:4px 10px;border-radius:999px}
.rs-chips span:first-child{background:var(--teal-100);color:var(--teal-600);border-color:transparent}
.rs-opt-label{font-family:var(--font-mono);font-size:.66rem;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--navy-800);margin-bottom:10px}
.rs-vars{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.rs-vpill{border:1.5px solid var(--border);border-radius:var(--radius-sm);padding:9px 14px;
  background:var(--surface);text-align:left;min-width:92px}
.rs-vpill.active{border-color:var(--teal-600);background:var(--teal-100)}
.rs-vpill.oos{opacity:.45;cursor:not-allowed}
.rs-vpill-dose{display:block;font-size:.9rem;font-weight:600;color:var(--navy-800)}
.rs-vpill small{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted)}
.rs-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:22px}
.rs-tier{position:relative;border:1.5px solid var(--border);border-radius:var(--radius-sm);
  padding:14px 10px 12px;background:var(--surface);text-align:center}
.rs-tier.active{border-color:var(--teal-600);background:var(--teal-100)}
.rs-tier-flag{position:absolute;top:-9px;left:50%;transform:translateX(-50%);font-family:var(--font-mono);
  font-size:.55rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;background:var(--navy-900);
  color:var(--text-inverse);padding:3px 8px;border-radius:999px;white-space:nowrap}
.rs-tier-flag.best{background:var(--teal-600)}
.rs-tier-qty{font-size:.84rem;font-weight:600;color:var(--navy-800)}
.rs-tier-price{font-family:var(--font-mono);font-size:1.02rem;font-weight:600;color:var(--navy-900);margin:3px 0 2px}
.rs-tier-ea{font-size:.7rem;color:var(--text-muted)}
.rs-totalbar{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);padding:14px 0;margin-bottom:16px}
.rs-total-lbl{font-family:var(--font-mono);font-size:.68rem;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--text-muted)}
.rs-total-sum{font-family:var(--font-mono);font-size:1.35rem;font-weight:600;color:var(--navy-900)}
.rs-atc{width:100%;background:var(--teal-600);color:#fff;font-weight:600;font-size:1rem;padding:15px 24px;
  border-radius:var(--radius-sm);transition:background .15s,box-shadow .15s,transform .15s}
.rs-atc:hover{background:var(--teal-700);box-shadow:var(--shadow-md);transform:translateY(-1px)}
.rs-atc-oos,.rs-atc-oos:hover{background:var(--border);color:var(--text-muted);cursor:not-allowed;transform:none;box-shadow:none}
.rs-coa-link{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-size:.88rem;font-weight:600;color:var(--teal-600)}
.rs-coa-link:hover{color:var(--teal-700)}
.rs-assure{display:flex;gap:18px;flex-wrap:wrap;margin:20px 0;font-size:.8rem;color:var(--text-muted)}
.rs-assure span{display:flex;align-items:center;gap:6px}
.rs-assure i{width:6px;height:6px;border-radius:50%;background:var(--teal-500);display:block}
.rs-lot{border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden;margin-bottom:20px}
.rs-lot-row{display:grid;grid-template-columns:140px 1fr;font-size:.86rem}
.rs-lot-row+.rs-lot-row{border-top:1px solid var(--border)}
.rs-lot-k{padding:10px 14px;background:rgba(231,241,241,.5);font-family:var(--font-mono);font-size:.68rem;
  letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted)}
.rs-lot-v{padding:10px 14px;color:var(--navy-800)}
.rs-acc{border-bottom:1px solid var(--border)}
.rs-acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;
  padding:15px 2px;font-weight:600;font-size:.92rem;color:var(--navy-800)}
.rs-acc summary::-webkit-details-marker{display:none}
.rs-pm{font-family:var(--font-mono);color:var(--teal-600);transition:transform .2s}
.rs-acc[open] .rs-pm{transform:rotate(45deg)}
.rs-ac{padding:0 2px 16px;font-size:.88rem;color:var(--text-muted)}
.rs-ac a{color:var(--teal-600);font-weight:600}
.rs-sr{display:grid;grid-template-columns:150px 1fr;padding:6px 0;font-size:.86rem}
.rs-sr-k{color:var(--text-muted)}
.rs-sr-v{color:var(--navy-800)}

/* ══════ COA Library ══════ */
.rs-coa-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}
.rs-coa-stat{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);padding:18px 20px}
.rs-coa-stat-v{font-family:var(--font-mono);font-size:1.4rem;font-weight:600;color:var(--teal-600)}
.rs-coa-stat-l{font-size:.78rem;color:var(--text-muted);margin-top:3px}
.rs-coa-search{display:flex;align-items:center;gap:10px;border:1px solid var(--border);background:var(--surface);
  border-radius:var(--radius-sm);padding:11px 14px;margin-bottom:24px;max-width:460px;color:var(--text-muted)}
.rs-coa-search input{flex:1;border:none;outline:none;background:transparent}
/* COA cards reuse the product-card shell, so the two grids line up exactly. */
.rs-coa-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.rs-coa-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-md);overflow:hidden;transition:transform .15s,box-shadow .15s,border-color .15s}
.rs-coa-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--teal-400)}
.rs-coa-card[hidden]{display:none}
.rs-coa-img{position:relative;aspect-ratio:1/1;width:100%;flex:none;background:var(--tile);overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.rs-coa-img .rs-photo{width:100%;height:100%;object-fit:contain}
.rs-coa-pur{position:absolute;top:10px;left:10px;font-family:var(--font-mono);font-size:.58rem;font-weight:600;
  background:var(--teal-100);color:var(--teal-600);padding:4px 8px;border-radius:999px;z-index:3}
.rs-coa-pur-lbl{display:none}
.rs-coa-body{display:flex;flex-direction:column;flex:none;height:140px;overflow:hidden;padding:12px 14px 14px}
.rs-coa-name{font-size:.93rem;font-weight:600;color:var(--navy-800);line-height:1.28;height:2.56em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rs-coa-meta{font-size:.76rem;color:var(--text-muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rs-coa-tags{display:none}
.rs-coa-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;
  font-size:.78rem;font-weight:600;color:var(--teal-600);white-space:nowrap}
/* Multi-certificate products get a picker of the same shape and footprint as
   the single-COA button, so the card height is unchanged either way. */
.rs-coa-select{position:relative;border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--surface);padding:0 10px;height:32px}
.rs-coa-select:hover{border-color:var(--teal-400)}
.rs-coa-select select{appearance:none;-webkit-appearance:none;border:none;background:transparent;
  width:100%;height:100%;font:inherit;font-size:.78rem;font-weight:600;color:var(--teal-600);
  cursor:pointer;outline:none;padding-right:16px}
.rs-coa-select select:focus-visible{outline:2px solid var(--teal-500);outline-offset:2px}
.rs-coa-select svg{position:absolute;right:9px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--teal-600)}
.rs-coa-mk{width:40px;opacity:.5}
.rs-coa-eye,.rs-coa-mv{font-family:var(--font-mono);font-size:.7rem;color:var(--text-muted)}

/* ══════ Order received ══════ */
.rs-ty-hero{text-align:center;padding:10px 0 30px}
.rs-ty-dot{width:58px;height:58px;border-radius:50%;background:var(--teal-100);display:flex;align-items:center;
  justify-content:center;margin:0 auto 16px;color:var(--teal-600)}
.rs-ty-h{font-family:var(--font-serif);font-weight:500;font-size:clamp(1.6rem,3vw,2.2rem);color:var(--navy-900)}
.rs-ty-sub{color:var(--text-muted);max-width:62ch;margin:10px auto 0;font-size:.95rem}
.rs-ty-meta,.rs-ty-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);
  border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}
.rs-ty-meta>div,.rs-ty-grid>div{background:var(--surface);padding:14px 16px}
.rs-ty-l{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--text-muted);margin-bottom:4px}
.rs-ty-v,.rs-ty-pay-v{font-size:.92rem;font-weight:600;color:var(--navy-800)}
.rs-ty-sum,.rs-ty-status,.rs-ty-contact{background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-md);padding:22px;margin-top:20px}
.rs-ty-sum-h,.rs-ty-status-h{font-family:var(--font-serif);font-weight:500;font-size:1.15rem;
  color:var(--navy-900);margin-bottom:14px}
.rs-ty-item{display:grid;grid-template-columns:64px 1fr auto;gap:14px;padding:13px 0;border-bottom:1px solid var(--border)}
.rs-ty-item:last-child{border-bottom:none}
.rs-ty-item-img{width:64px;height:64px;border-radius:var(--radius-sm);overflow:hidden;background:var(--tile)}
.rs-ty-item-img img{width:100%;height:100%;object-fit:contain}
/* A product name in a row, not a card — clamped so it cannot break alignment. */
.rs-ty-item-name{font-weight:600;font-size:.92rem;color:var(--navy-800);
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.rs-ty-item-meta{font-size:.76rem;color:var(--text-muted);margin-top:3px}
.rs-ty-item-price{font-family:var(--font-mono);font-weight:600;color:var(--navy-900);white-space:nowrap}
.rs-ty-totals{margin-top:12px}
.rs-ty-totals .row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;font-size:.9rem}
.rs-ty-totals .row.total{border-top:1px solid var(--border);margin-top:6px;padding-top:14px;
  font-family:var(--font-mono);font-size:1.15rem;font-weight:600;color:var(--navy-900)}
.rs-ty-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.rs-ty-step{border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;background:var(--surface)}
.rs-ty-step b{display:block;font-size:.9rem;color:var(--navy-800);margin-bottom:5px}
.rs-ty-step p{font-size:.82rem;color:var(--text-muted)}
.rs-ty-sdot,.rs-ty-slabel{display:inline-block;vertical-align:middle}
.rs-ty-pill{font-family:var(--font-mono);font-size:.6rem;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;padding:3px 9px;border-radius:999px;color:var(--warn);background:rgba(154,107,30,.12)}
.rs-ty-addrs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}
.rs-ty-failed{border-color:var(--bad)}
.rs-ty-no{font-family:var(--font-mono)}
.rs-ty-retry{margin-top:14px}

/* ══════ Account ══════ */
.rs-account-grid{display:grid;grid-template-columns:232px minmax(0,1fr);gap:30px;align-items:start}
.rs-account-kicker{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted)}
.rs-account-head h1{font-family:var(--font-serif);font-weight:500;
  font-size:clamp(1.8rem,3.2vw,2.6rem);color:var(--navy-900);line-height:1.14;margin-top:6px}
.rs-account-head p{color:var(--text-muted);font-size:.95rem;max-width:62ch}

/* WooCommerce's own layout stylesheet floats the account nav at width:30%
   and the content at 68%:
       .woocommerce-account .woocommerce-MyAccount-navigation {float:left;width:30%}
   Inside a 232px grid column that collapses the nav to about 70px and clips
   every label. Undoing it needs more weight than Woo's own selector, not the
   same weight — which stylesheet loads last varies by site. Scoped to
   .rs-account-grid so it cannot leak anywhere else. */
.rs-account .rs-account-grid .rs-account-side,
.rs-account .rs-account-grid .woocommerce-MyAccount-navigation,
.rs-account .rs-account-grid .woocommerce-MyAccount-content{float:none;width:100%;max-width:none;margin:0}

.rs-account-side{min-width:0}
.woocommerce-MyAccount-navigation ul{border:1px solid var(--border);border-radius:var(--radius-md);
  background:var(--surface);overflow:hidden;margin:0;padding:0;list-style:none}
.woocommerce-MyAccount-navigation li{margin:0}
.woocommerce-MyAccount-navigation li a{display:block;padding:12px 16px;font-size:.88rem;
  color:var(--navy-800);border-bottom:1px solid var(--border);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.woocommerce-MyAccount-navigation li:last-child a{border-bottom:none}
.woocommerce-MyAccount-navigation li a:hover{background:var(--teal-100)}
.woocommerce-MyAccount-navigation li.is-active a{background:var(--teal-100);color:var(--teal-700);font-weight:600}

/* Whatever a plugin hooks in before the nav — the affiliate plugin prints an
   avatar card — sits above it in the sidebar rather than breaking the grid. */
.rs-account-side img.avatar{width:56px;height:56px;border-radius:50%;margin-bottom:10px}
.rs-account-side > *:not(.woocommerce-MyAccount-navigation){margin-bottom:14px;font-size:.85rem;
  color:var(--text-muted);word-break:break-word}

.woocommerce-MyAccount-content{background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-md);padding:22px;min-width:0}
.woocommerce-MyAccount-content > p:first-child{margin-top:0}
.woocommerce-MyAccount-content p{font-size:.92rem;margin-bottom:12px}
/* Links inside the account content pick up the brand teal — but not the
   anchors WooCommerce renders as buttons. This selector outweighs Woo's
   `.woocommerce a.button`, so without the exclusions it paints teal text on
   a teal button: 1:1 contrast, invisible until hover. */
.woocommerce-MyAccount-content a:not(.rs-btn):not(.button):not(.woocommerce-Button){color:var(--teal-600);font-weight:600}
.woocommerce-MyAccount-content h2,.woocommerce-MyAccount-content h3{font-family:var(--font-serif);
  font-weight:500;color:var(--navy-900);margin-bottom:12px}
.woocommerce-MyAccount-content .woocommerce-Address{margin-bottom:18px}
.woocommerce-MyAccount-content fieldset{border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:16px;margin:18px 0}
.woocommerce-MyAccount-content legend{font-family:var(--font-mono);font-size:.66rem;
  letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted);padding:0 6px}

/* ══════ Login ══════ */
.rs-login-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:900px;margin:0 auto}
.rs-login-aside{background:var(--navy-900);color:var(--text-inverse);border-radius:var(--radius-md);padding:26px}
.rs-login-perks{margin-top:16px;display:grid;gap:9px;font-size:.88rem;opacity:.85}
.rs-login-panes{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:22px}
.rs-login-row{margin-bottom:14px}
.rs-login-row label{display:block;font-size:.78rem;font-weight:600;color:var(--navy-800);margin-bottom:5px}
.rs-login-row input{width:100%;border:1px solid var(--border);background:var(--surface);
  border-radius:var(--radius-sm);padding:11px 13px;outline:none}
.rs-login-row input:focus{border-color:var(--teal-500)}
.rs-login-fine{font-size:.76rem;color:var(--text-muted);margin-top:12px}
.rs-login-fine a{color:var(--teal-600);font-weight:600}
.rs-login-tabs{display:flex;gap:8px;margin-bottom:18px}
.rs-login-tabs button{flex:1;padding:10px;border-radius:var(--radius-sm);border:1px solid var(--border);
  font-size:.88rem;font-weight:600;color:var(--text-muted)}
.rs-login-tabs button.active{background:var(--teal-100);border-color:var(--teal-600);color:var(--teal-700)}
.rs-login-mk{width:42px;opacity:.9;margin-bottom:14px}

/* ══════ Forms, shared with WooCommerce defaults ══════ */
.rs-field,.woocommerce form .form-row{margin-bottom:14px;display:block;padding:0}
.rs-field label,.woocommerce form .form-row label{display:block;font-size:.78rem;font-weight:600;
  color:var(--navy-800);margin-bottom:5px}
.rs-field input,.rs-field select,.rs-field textarea,
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,
.woocommerce form .form-row select{width:100%;border:1px solid var(--border);background:var(--surface);
  border-radius:var(--radius-sm);padding:11px 13px;outline:none;height:auto}
.rs-field input:focus,.woocommerce form .form-row input.input-text:focus{border-color:var(--teal-500)}
.rs-check{display:flex;gap:10px;align-items:flex-start;font-size:.84rem;margin:14px 0}
.rs-check input{margin-top:3px;width:16px;height:16px;flex:0 0 16px;accent-color:var(--teal-600)}

/* ══════ WooCommerce cart & checkout ══════
   Woo's own cart and checkout templates are deliberately NOT overridden — an
   override has to be re-reconciled on every WooCommerce release and a stale
   one breaks payment. These rules restyle Woo's default markup instead. */
.woocommerce table.shop_table{border:1px solid var(--border);border-radius:var(--radius-md);
  border-collapse:separate;border-spacing:0;background:var(--surface);overflow:hidden;font-size:.9rem}
.woocommerce table.shop_table th{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted);font-weight:600;padding:14px;border-bottom:1px solid var(--border)}
.woocommerce table.shop_table td{padding:16px 14px;border-top:1px solid var(--border);vertical-align:middle}
.woocommerce table.shop_table img{width:64px;height:64px;object-fit:contain;background:var(--tile);border-radius:var(--radius-sm)}
.woocommerce table.cart td.product-name a{font-weight:600;color:var(--navy-800);
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
/* The bundle tier the cart is actually applying, from woocommerce_get_item_data. */
.woocommerce dl.variation{margin:6px 0 0}
.woocommerce dl.variation dt,.woocommerce dl.variation dd{display:inline;margin:0;font-family:var(--font-mono);
  font-size:.62rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--teal-600)}
.woocommerce dl.variation dd p{display:inline;margin:0}
.woocommerce .quantity .qty{width:64px;text-align:center;border:1px solid var(--border);
  border-radius:var(--radius-sm);padding:9px 6px;background:var(--surface)}
.woocommerce .cart-collaterals,.woocommerce-cart .cart-collaterals .cart_totals{width:100%;float:none}
.woocommerce-cart .cart-collaterals .cart_totals h2,.woocommerce-checkout #order_review_heading{
  font-family:var(--font-serif);font-weight:500;font-size:1.15rem;color:var(--navy-900);margin-bottom:14px}
.woocommerce-checkout #customer_details,.woocommerce-checkout #order_review{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:22px}
.woocommerce-checkout #payment{background:transparent}
.woocommerce-checkout #payment ul.payment_methods{border:none;padding:0}
.woocommerce-checkout #payment li.wc_payment_method{border:1.5px solid var(--border);
  border-radius:var(--radius-sm);padding:14px;margin-bottom:10px;list-style:none}
.woocommerce-checkout #payment div.payment_box{background:transparent;margin:8px 0 0 26px;padding:0;
  font-size:.82rem;color:var(--text-muted)}
.woocommerce-checkout #payment div.payment_box::before{display:none}
.woocommerce .woocommerce-info,.woocommerce .woocommerce-message,.woocommerce .woocommerce-error{
  border-top:none;border-left:3px solid var(--teal-600);background:var(--teal-100);color:var(--navy-800);
  border-radius:var(--radius-sm);padding:14px 18px;font-size:.88rem}
.woocommerce .woocommerce-error{border-left-color:var(--bad);background:rgba(154,59,46,.08)}
.woocommerce .woocommerce-info::before,.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-error::before{display:none}
.woocommerce-notices-wrapper:empty{display:none}
.woocommerce-notices-wrapper{max-width:1220px;margin:0 auto;padding:0 24px}
.woocommerce .price,.woocommerce-Price-amount{font-family:var(--font-mono);color:var(--navy-900)}

/* ══════ Footer ══════ */
.rs-footer{background:var(--navy-900);color:var(--text-inverse);padding:54px 0 26px}
.rs-foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:36px}
.rs-foot-brand{display:inline-block;margin-bottom:14px}
.rs-foot-about{font-size:.84rem;opacity:.68;max-width:34ch;line-height:1.55}
.rs-foot-soc{display:flex;gap:10px;margin-top:16px}
.rs-foot-soc a{width:32px;height:32px;border-radius:50%;border:1px solid rgba(245,241,231,.2);
  display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s}
.rs-foot-soc a:hover{background:var(--teal-600);border-color:var(--teal-600)}
.rs-fcol h4{font-family:var(--font-mono);font-size:.66rem;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--teal-400);margin-bottom:14px}
.rs-fcol a{display:block;font-size:.85rem;opacity:.75;padding:5px 0}
.rs-fcol a:hover{opacity:1;color:var(--teal-400)}
.rs-fhelp .frows{display:grid;gap:10px}
.rs-fhelp .row{display:grid;grid-template-columns:20px 1fr;gap:9px;align-items:start;font-size:.85rem;opacity:.78}
.rs-fhelp .row a:hover{color:var(--teal-400)}
.rs-foot-bot{margin-top:40px;padding-top:20px;border-top:1px solid rgba(245,241,231,.14);display:flex;
  flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;font-size:.78rem;opacity:.65}
.rs-foot-links{display:flex;gap:18px}
.rs-foot-legal{font-size:.7rem;opacity:.72;line-height:1.55;margin-top:10px;padding-bottom:4px}

/* ══════ Floating contact ══════ */
.rs-float{position:fixed;right:16px;bottom:18px;z-index:90;display:flex;flex-direction:column;gap:10px}
.rs-float a{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow-md)}
.rs-float .wa{background:#25D366}
.rs-float .tg{background:#229ED9}

/* ══════ Age gate ══════ */
.rs-gate{position:fixed;inset:0;z-index:290;background:rgba(7,22,48,.93);display:flex;align-items:center;
  justify-content:center;padding:20px;overflow-y:auto}
.rs-gate[hidden]{display:none}
.rs-gate-panel{background:var(--surface);border-radius:var(--radius-lg);max-width:460px;width:100%;
  padding:30px 28px;box-shadow:var(--shadow-lg)}
.rs-gate-mk{width:44px;margin-bottom:14px;color:var(--teal-600)}
.rs-gate-mk svg{width:44px;height:44px}
.rs-gate-k{display:inline-block;font-family:var(--font-mono);font-size:.64rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;color:var(--teal-600);background:var(--teal-100);
  padding:5px 10px;border-radius:999px;margin-bottom:12px}
.rs-gate-h{font-family:var(--font-serif);font-weight:500;font-size:1.4rem;color:var(--navy-900);margin-bottom:8px}
.rs-gate-p{font-size:.88rem;color:var(--text-muted);margin-bottom:18px}
.rs-gate-row{display:flex;gap:10px;align-items:flex-start;padding:11px 0;font-size:.88rem;
  border-top:1px solid var(--border);cursor:pointer}
.rs-gate-row input{margin-top:3px;width:17px;height:17px;accent-color:var(--teal-600);flex:0 0 17px}
.rs-gate-box{display:none}
.rs-gate-enter{width:100%;margin-top:18px;background:var(--teal-600);color:#fff;font-weight:600;
  padding:14px 24px;border-radius:var(--radius-sm);font-size:1rem}
.rs-gate-enter:hover:not(:disabled){background:var(--teal-700)}
.rs-gate-enter:disabled{opacity:.45;cursor:not-allowed}
.rs-gate-exit{display:block;width:100%;margin-top:10px;text-align:center;font-size:.82rem;
  color:var(--text-muted);text-decoration:underline}
.rs-gate-fine{margin-top:14px;font-size:.7rem;color:var(--text-muted);line-height:1.5}
.rs-gate-fine a{color:var(--teal-600);font-weight:600}
.rs-gate-declined{text-align:center}
.rs-gate-back{margin-top:16px;color:var(--teal-600);font-weight:600;text-decoration:underline}
body.rs-gate-locked{overflow:hidden}

/* ══════ 404 ══════ */
.rs-404{text-align:center;padding:70px 0 90px;max-width:560px;margin:0 auto}
.rs-404 .code{font-family:var(--font-mono);font-size:3.4rem;font-weight:600;color:var(--teal-600)}
.rs-404 h1{font-family:var(--font-serif);font-weight:500;font-size:1.9rem;color:var(--navy-900);margin:8px 0 12px}
.rs-404 p{color:var(--text-muted);margin-bottom:24px}
.rs-404 .acts{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ══════ Prose (legal and plain pages) ══════ */
.rs-prose{max-width:76ch}
.rs-prose h2{font-family:var(--font-serif);font-weight:500;font-size:1.25rem;color:var(--navy-900);margin:26px 0 10px}
.rs-prose h3{font-size:1rem;font-weight:600;color:var(--navy-800);margin:20px 0 8px}
.rs-prose p{margin-bottom:12px;font-size:.94rem}
.rs-prose ul,.rs-prose ol{margin:0 0 14px 0}
.rs-prose li{position:relative;padding-left:17px;margin-bottom:6px;font-size:.94rem;list-style:none}
.rs-prose li::before{content:"";position:absolute;left:0;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--teal-500)}
.rs-prose a{color:var(--teal-600);font-weight:600}
.rs-prose table{width:100%;border-collapse:collapse;margin:8px 0 18px;font-size:.86rem}
.rs-prose th,.rs-prose td{border:1px solid var(--border);padding:9px 11px;text-align:left}
.rs-prose th{background:rgba(231,241,241,.5);font-family:var(--font-mono);font-size:.66rem;
  letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted)}

/* ══════ Reveal — gated behind html.js so a no-JS visitor, and print, still
   get the content rather than a blank page below the fold. ══════ */
html.js .rs-an{opacity:0;transform:translateY(14px);transition:opacity .5s,transform .5s}
html.js .rs-an.v{opacity:1;transform:none}
@media print{
  .rs-an{opacity:1!important;transform:none!important}
  .rs-nav,.rs-announce,.rs-float,.rs-gate,.rs-footer{display:none!important}
}

/* ══════ Breakpoints ══════ */
@media(max-width:1099px){
  .rs-pgrid,.rs-coa-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:960px){
  .rs-nav-center{display:none}
  .rs-ham{display:flex}
  .rs-pdp-grid{grid-template-columns:1fr;gap:28px}
  .rs-account-grid{grid-template-columns:1fr;gap:20px}
  .rs-login-grid{grid-template-columns:1fr}
  .rs-foot-top{grid-template-columns:1fr 1fr;gap:30px}
  .rs-fbrand-col{grid-column:1/-1}
  .rs-ty-meta,.rs-ty-grid{grid-template-columns:repeat(2,1fr)}
  .rs-ty-addrs{grid-template-columns:1fr}
}
@media(max-width:767px){
  .rs-container,.rs-nav-i,.woocommerce-notices-wrapper{padding-left:16px;padding-right:16px}
  .rs-main,.rs-shop,.rs-coa,.rs-pdp,.rs-account,.rs-login-page,.rs-ty{padding-top:26px;padding-bottom:48px}
  .rs-pgrid,.rs-coa-grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .rs-pc-name,.rs-coa-name{font-size:.86rem}
  .rs-pc-body,.rs-coa-body{height:126px;padding:10px 11px 12px}
  .rs-pc-stock{font-size:.55rem;padding:3px 6px}
  .rs-coa-btn{font-size:.7rem}
  .rs-pc-price{font-size:.86rem}
  .rs-nav .rs-wm,.rs-foot-brand .rs-wm,.rs-gate-panel .rs-wm{--wm-h:25px}
  .rs-nav-right .rs-dd,.rs-nav-right .rs-nav-acct{display:none}
  .rs-nav-right{gap:6px}
  .rs-coa-stats,.rs-ty-steps,.rs-tiers{grid-template-columns:1fr}
  .rs-lot-row,.rs-sr{grid-template-columns:110px 1fr}
  .rs-pdp-title{font-size:1.6rem}
  .rs-footer{padding:34px 0 22px}
  .rs-fhelp{grid-column:1/-1;border-top:1px solid rgba(245,241,231,.14);padding-top:18px}
  /* Explore and Information side by side; Contact its own row with email and
     phone on the same column tracks and the address spanning both. */
  .rs-fhelp .frows{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 16px}
  .rs-fhelp .row{min-width:0;font-size:.8rem}
  .rs-fhelp .row span{min-width:0}
  .rs-fhelp .row.addr{grid-column:1/-1}
  .rs-fhelp .row a[href^="mailto"]{overflow-wrap:anywhere}
  .rs-fhelp .row a[href^="tel"]{white-space:nowrap}
  .rs-foot-bot{justify-content:flex-start}
  .rs-ty-item{grid-template-columns:52px 1fr;grid-template-areas:"img body" "price price"}
  .rs-ty-item-img{grid-area:img;width:52px;height:52px}
  .rs-ty-item-price{grid-area:price;text-align:right}
  .woocommerce table.shop_table img{width:52px;height:52px}
}
@media(max-width:345px){
  .rs-nav .rs-wm,.rs-foot-brand .rs-wm,.rs-gate-panel .rs-wm{--wm-h:21px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ══════ Partner Program prompt ══════
   Same two-way question the client's own nav asks. Sits above the gate's
   backdrop but below the gate itself, so a first-time visitor answers the
   age gate first. */
.rs-pp-modal{position:fixed;inset:0;z-index:200;background:rgba(7,22,48,.55);display:flex;
  align-items:center;justify-content:center;padding:16px}
.rs-pp-modal[hidden]{display:none}
.rs-pp-box{position:relative;background:var(--surface);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);padding:30px 28px 26px;max-width:420px;width:100%;text-align:center}
.rs-pp-box h2{font-family:var(--font-serif);font-weight:500;font-size:1.3rem;color:var(--navy-900);margin-bottom:6px}
.rs-pp-box p{color:var(--text-muted);font-size:.92rem;margin-bottom:18px}
.rs-pp-box .rs-btn+.rs-btn{margin-top:10px}
.rs-pp-close{position:absolute;top:10px;right:14px;font-size:24px;line-height:1;color:var(--text-muted)}
.rs-pp-close:hover{color:var(--navy-800)}

/* ══════ Partner Program page ══════ */
.rs-pp-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;margin-bottom:56px}
.rs-pp-lead{font-size:1.02rem;color:var(--text);max-width:54ch;margin-bottom:10px}
.rs-pp-sub{font-size:.9rem;color:var(--text-muted);margin-bottom:24px}
.rs-pp-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.rs-pp-note{font-size:.8rem;color:var(--text-muted);line-height:1.6;max-width:58ch}
.rs-pp-note a{color:var(--teal-600);font-weight:600}
.rs-pp-img img{width:100%;height:auto;border-radius:var(--radius-md)}
.rs-ph-tag{position:absolute;bottom:14px;font-family:var(--font-mono);font-size:.64rem;
  letter-spacing:.06em;text-transform:uppercase;color:var(--teal-600)}

.rs-pp-points{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:56px}
.rs-pp-point{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:22px}
.rs-pp-point h3{font-family:var(--font-serif);font-weight:500;font-size:1.08rem;color:var(--navy-900);margin-bottom:8px}
.rs-pp-point p{font-size:.88rem;color:var(--text-muted)}

.rs-pp-comm{margin-bottom:56px}
.rs-pp-comm h2,.rs-pp-steps h2{font-family:var(--font-serif);font-weight:500;
  font-size:clamp(1.5rem,2.4vw,1.9rem);color:var(--navy-900);margin-bottom:10px}
.rs-pp-comm-sub{color:var(--text-muted);font-size:.92rem;max-width:72ch;margin-bottom:22px}
.rs-pp-table-wrap{overflow-x:auto}
.rs-pp-table{width:100%;border-collapse:collapse;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}
.rs-pp-table th,.rs-pp-table td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--border)}
.rs-pp-table thead th{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.07em;
  text-transform:uppercase;color:var(--text-muted);font-weight:600;background:rgba(231,241,241,.5)}
.rs-pp-table tbody th{font-weight:600;color:var(--navy-800);font-size:.92rem;width:42%}
.rs-pp-table tbody th small{display:block;font-weight:400;font-size:.78rem;color:var(--text-muted);margin-top:4px;line-height:1.45}
.rs-pp-table td{font-family:var(--font-mono);font-weight:600;color:var(--teal-600);font-size:1rem}
.rs-pp-table tbody tr:last-child th,.rs-pp-table tbody tr:last-child td{border-bottom:none}

.rs-pp-steps{margin-bottom:40px}
.rs-pp-steps ol{counter-reset:ppstep;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:18px}
.rs-pp-steps li{counter-increment:ppstep;position:relative;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-md);padding:20px 22px;font-size:.88rem;
  color:var(--text-muted);list-style:none}
.rs-pp-steps li::before{content:"0" counter(ppstep);display:block;font-family:var(--font-mono);
  font-size:.68rem;font-weight:600;color:var(--teal-600);margin-bottom:8px}
.rs-pp-steps li strong{display:block;color:var(--navy-800);font-size:.95rem;margin-bottom:4px}

.rs-pp-compliance{padding:18px 20px;border:1px dashed var(--border);border-radius:var(--radius-sm);
  font-size:.84rem;color:var(--text-muted);line-height:1.6}
.rs-pp-compliance strong{color:var(--navy-800)}

@media(max-width:960px){
  .rs-pp-hero{grid-template-columns:1fr;gap:28px}
  .rs-pp-img{order:-1}
  .rs-pp-points,.rs-pp-steps ol{grid-template-columns:1fr}
}
@media(max-width:767px){
  .rs-pp-cta .rs-btn{width:100%}
  /* The commission table collapses to label/value pairs rather than scrolling. */
  .rs-pp-table thead{display:none}
  .rs-pp-table,.rs-pp-table tbody,.rs-pp-table tr,.rs-pp-table th,.rs-pp-table td{display:block;width:auto}
  .rs-pp-table tr{border-bottom:1px solid var(--border);padding:14px 16px}
  .rs-pp-table tr:last-child{border-bottom:none}
  .rs-pp-table tbody th{padding:0 0 10px;width:auto}
  .rs-pp-table td{display:flex;justify-content:space-between;padding:6px 0;border:none}
  .rs-pp-table td::before{content:attr(data-tier);font-family:var(--font-sans);font-weight:500;
    color:var(--text-muted);font-size:.84rem}
}

/* ══════ Account dashboard ══════ */
.rs-dash-intro{color:var(--text-muted)}
.woocommerce-MyAccount-content h3{font-size:1.05rem;margin:20px 0 12px}
.rs-dash-orders{width:100%;border-collapse:collapse;font-size:.88rem}
.rs-dash-orders th{text-align:left;font-family:var(--font-mono);font-size:.64rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted);font-weight:600;padding:0 10px 10px 0;
  border-bottom:1px solid var(--border)}
.rs-dash-orders td{padding:13px 10px 13px 0;border-bottom:1px solid var(--border);vertical-align:middle}
.rs-dash-no{font-family:var(--font-mono)}
.rs-dash-act{text-align:right}
.rs-dash-act a{font-weight:600;color:var(--teal-600)}
.rs-dash-all{margin-top:14px;font-size:.85rem}
.rs-dash-empty{color:var(--text-muted);font-size:.9rem}
.rs-dash-links{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.rs-dash-links a{display:block;border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:14px 16px;background:var(--bg);transition:border-color .15s,background .15s}
.rs-dash-links a:hover{border-color:var(--teal-400);background:var(--surface)}
.rs-dash-links strong{display:block;font-size:.92rem;color:var(--navy-800);margin-bottom:3px}
.rs-dash-links span{display:block;font-size:.8rem;color:var(--text-muted);line-height:1.45}
.rs-dash-out{margin-top:20px;padding-top:16px;border-top:1px solid var(--border);font-size:.85rem}
@media(max-width:767px){
  .rs-dash-links{grid-template-columns:1fr}
  .rs-dash-orders thead{display:none}
  .rs-dash-orders tr{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:12px 0;
    border-bottom:1px solid var(--border)}
  .rs-dash-orders td{border:none;padding:0}
  .rs-dash-act{grid-column:2;grid-row:1}
}

/* ══════ WooCommerce button colours ══════
   WooCommerce ships its own button palette, and which stylesheet loads last
   is not something the theme controls. These carry a body-class prefix so
   they outweigh both Woo's own rules and any theme rule that targets links
   generically, and every state is declared so the label can never inherit a
   colour from the notice or panel it sits in. */
body.woocommerce .button,
body.woocommerce a.button,
body.woocommerce button.button,
body.woocommerce input.button,
body.woocommerce #respond input#submit,
body.woocommerce .woocommerce-info .button,
body.woocommerce .woocommerce-message .button,
body.woocommerce .woocommerce-error .button{
  background-color:var(--teal-600);color:#fff;font-weight:600;border-radius:var(--radius-sm);
  padding:12px 22px;line-height:1.3;border:0;text-decoration:none}
body.woocommerce .button:hover,
body.woocommerce a.button:hover,
body.woocommerce button.button:hover,
body.woocommerce input.button:hover,
body.woocommerce #respond input#submit:hover,
body.woocommerce .button:focus,
body.woocommerce a.button:focus,
body.woocommerce .button:active,
body.woocommerce a.button:active,
body.woocommerce a.button:visited{background-color:var(--teal-700);color:#fff;text-decoration:none}
body.woocommerce .button:focus-visible,
body.woocommerce a.button:focus-visible{outline:2px solid var(--teal-500);outline-offset:2px}
/* Secondary action — "Return to shop" and similar. */
body.woocommerce a.button.wc-backward,
body.woocommerce a.button.wc-backward:hover{background-color:transparent;color:var(--navy-800);
  border:1.5px solid var(--border)}
body.woocommerce a.button.wc-backward:hover{border-color:var(--navy-800)}
body.woocommerce .button:disabled,
body.woocommerce .button[disabled]{background-color:var(--border);color:var(--text-muted);cursor:not-allowed}
/* Woo floats notice buttons right; keep them on the same line as the text
   without overlapping it on a narrow panel. */
body.woocommerce .woocommerce-info,
body.woocommerce .woocommerce-message,
body.woocommerce .woocommerce-error{display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap}
body.woocommerce .woocommerce-info .button,
body.woocommerce .woocommerce-message .button,
body.woocommerce .woocommerce-error .button{float:none;flex:none}
