/*!
 * ============================================================
 * GOJI.MY  goji-main.css  v2.0.0
 * ============================================================
 * LOAD ORDER:
 *   Bootstrap 5.3 CSS
 *   Bootstrap Icons
 *   Google Fonts (Plus Jakarta Sans, DM Sans)
 *   goji-framework.css   ← design system (34 sections, 609 classes)
 *   goji-main.css        ← THIS FILE
 *   [page <style>]       ← page-specific classes only
 *   Bootstrap 5.3 JS     defer
 *   goji-main.js         defer
 *
 * ROLE OF THIS FILE:
 *   1. Shorthand token bridge — shorthand aliases all pages use
 *      (--gs-fd, --gs-fb, --gs-foc, --gs-nh, etc.) mapped to
 *      the longhand tokens defined in goji-framework.css.
 *   2. Shared components — classes used across 2+ pages that
 *      are not in goji-framework.css.
 *   3. Canonical drawer system — gs-drawer-* replacing the
 *      deprecated gs-mob-drawer-* aliases.
 *   4. Dark mode overrides for components with hard-coded values.
 *
 * TABLE OF CONTENTS
 * ─────────────────
 * § 01  SHORTHAND TOKEN BRIDGE
 * § 02  NAVBAR — sub-components & inline search
 * § 03  MOBILE DRAWER + BACKDROP (canonical gs-drawer-* ids)
 * § 04  BREADCRUMB BAR
 * § 05  FOOTER — sub-components
 * § 06  SECTION PRIMITIVES
 * § 07  BADGE COLOUR VARIANTS
 * § 08  FORM FIELD HELPERS
 * § 09  OTP + PASSWORD COMPONENTS
 * § 10  STAT / KPI CARDS
 * § 11  DASHBOARD NAV HELPERS
 * § 12  TABLE WRAPPER
 * § 13  TOGGLE (UI switch)
 * § 14  PRICING TOGGLE
 * § 15  PRICING CARDS
 * § 16  FAQ ACCORDION
 * § 17  BLOG CARD BODY
 * § 18  NEWSLETTER SECTION
 * § 19  SKELETON LOADER
 * § 20  AUTH PAGE SHELL
 * § 21  SEARCH OVERLAY
 * § 22  PAGINATION
 * § 23  VIEW TOGGLE
 * § 24  DARK SECTION (about, pricing)
 * § 25  DARK MODE OVERRIDES
 * § 26  RESPONSIVE HELPERS
 * § 27  REDUCED MOTION
 * § 28  PHASE 1 — GLOBAL UI ENHANCEMENTS (typography, spacing, accessibility)
 * ============================================================ */


/* ============================================================
 * § 01 · SHORTHAND TOKEN BRIDGE
 *
 * Every page uses these shorthand aliases. This is the ONLY
 * :root block in this file. No other section defines custom
 * properties.
 *
 * Mappings verified against live page usage audit (270 multi-
 * page classes, 32 HTML files):
 *
 *   --gs-fd    → --gs-font-display
 *   --gs-fb    → --gs-font-body
 *   --gs-foc   → --gs-focus-ring
 *   --gs-nh    → --gs-navbar-height
 *   --gs-sb    → --gs-sidebar-width
 *   --gs-sb-col → --gs-sidebar-collapsed
 *   --gs-rsm   → --gs-radius-sm
 *   --gs-rmd   → --gs-radius-md
 *   --gs-rlg   → --gs-radius-lg
 *   --gs-rxl   → --gs-radius-xl
 *   --gs-r2xl  → --gs-radius-2xl
 *   --gs-rf    → --gs-radius-full
 *   --gs-sf0–3 → --gs-surface-0 through -3
 *   --gs-bg0–2 → --gs-bg-base / -subtle / -muted
 *   --gs-bd0–2 → --gs-border-default / -subtle / -strong
 *   --gs-tx0–2 → --gs-text-primary / -secondary / -tertiary
 *   --gs-sh*   → --gs-shadow-*
 *   --gs-shbtn → --gs-shadow-primary
 *   --gs-cp    → --gs-color-primary (+ variants)
 *   --gs-cs    → --gs-color-secondary (+ variants)
 *   --gs-ct    → --gs-color-tertiary (+ variants)
 *   --gs-error-bg / -success-bg / -warning-bg / -info-bg
 *              → status background aliases
 * ============================================================ */

:root {
  /* Typography */
  --gs-fd:  var(--gs-font-display);
  --gs-fb:  var(--gs-font-body);

  /* Focus ring */
  --gs-foc: var(--gs-focus-ring);

  /* Layout */
  --gs-nh:     var(--gs-navbar-height);
  --gs-sb:     var(--gs-sidebar-width);
  --gs-sb-col: var(--gs-sidebar-collapsed);

  /* Radius */
  --gs-rsm:  var(--gs-radius-sm);
  --gs-rmd:  var(--gs-radius-md);
  --gs-rlg:  var(--gs-radius-lg);
  --gs-rxl:  var(--gs-radius-xl);
  --gs-r2xl: var(--gs-radius-2xl);
  --gs-rf:   var(--gs-radius-full);

  /* Surfaces */
  --gs-sf0: var(--gs-surface-0);
  --gs-sf1: var(--gs-surface-1);
  --gs-sf2: var(--gs-surface-2);
  --gs-sf3: var(--gs-surface-3);

  /* Backgrounds */
  --gs-bg0: var(--gs-bg-base);
  --gs-bg1: var(--gs-bg-subtle);
  --gs-bg2: var(--gs-bg-muted);
    --gs-color-primary: #5B21B6;

  /* Borders */
  --gs-bd0: var(--gs-border-default);
  --gs-bd1: var(--gs-border-subtle);
  --gs-bd2: var(--gs-border-strong);
  --gs-border: var(--gs-border-default);   /* theme-aware alias used widely in dashboard CSS (flips in dark) */

  /* Text */
  --gs-tx0: var(--gs-text-primary);
  --gs-tx1: var(--gs-text-secondary);
  --gs-tx2: var(--gs-text-tertiary);  

  /* Shadows */
  --gs-shsm:  var(--gs-shadow-sm);
  --gs-shmd:  var(--gs-shadow-md);
  --gs-shlg:  var(--gs-shadow-lg);
  --gs-shxl:  var(--gs-shadow-xl);
  --gs-shbtn: var(--gs-shadow-primary);

  /* Brand colour shortcuts */
  --gs-cp:   var(--gs-color-primary);
  --gs-cp-h: var(--gs-color-primary-hover);
  --gs-cp-s: var(--gs-color-primary-subtle);
  --gs-cp-m: var(--gs-color-primary-muted);
  --gs-cp-b: var(--gs-color-primary-border);
  --gs-cp-t: var(--gs-color-primary-text);

  --gs-cs:   var(--gs-color-secondary);
  --gs-cs-h: var(--gs-color-secondary-hover);
  --gs-cs-s: var(--gs-color-secondary-subtle);

  --gs-ct:   var(--gs-color-tertiary);
  --gs-ct-h: var(--gs-color-tertiary-hover);
  --gs-ct-s: var(--gs-color-tertiary-subtle);

  /* ── Fill-ins for tokens referenced but never defined (audit) ── */
  /* secondary/tertiary hover+subtle (the -hover/-subtle aliases above pointed here) */
  --gs-color-secondary-hover:  var(--gs-green-700);
  --gs-color-secondary-subtle: var(--gs-green-100);
  --gs-color-tertiary-hover:   var(--gs-blue-600);
  --gs-color-tertiary-subtle:  var(--gs-blue-100);
  /* base status colours (only -bg/-border/-icon/-text variants existed) */
  --gs-status-error:   var(--gs-status-error-icon);
  --gs-status-success: var(--gs-status-success-icon);
  /* misc one-off tokens used without a definition */
  --gs-blue-300: #93C5FD;
  --gs-rxs:      var(--gs-radius-xs);
  --gs-sh-sm:    var(--gs-shadow-sm);
  --gs-topbar-real: 0px;   /* default; overridden at runtime by the topbar JS */
  --gs-space-3_5: 0.875rem;          /* between space-3 (.75rem) and space-4 (1rem) */
  --toast-duration: 4s;              /* default; per-toast value set by JS */

  /* Status background aliases */
  --gs-error-bg:   var(--gs-status-error-bg);
  --gs-success-bg: var(--gs-status-success-bg);
  --gs-warning-bg: var(--gs-status-warning-bg);
  --gs-info-bg:    var(--gs-status-info-bg);

  /* Primitive colour additions not in framework */
  --gs-red-100:   #FEE2E2;
  --gs-red-600:   #DC2626;
  --gs-yellow-50: #FFFBEB;
  --gs-green-200: #BBF7D0;

  /* Nav button size token (matches layout.php inline style="height:36px;padding:0 1rem") */
  --gs-btn-height-nav: 2.25rem;   /* = 36px = gs-btn-sm height */
  --gs-btn-pad-nav:    0 1rem;

  /* Phase 1 shorthand shadow additions */
  --gs-sh2xl: var(--gs-shadow-2xl);
 --gs-cs: #3D8B37;
 --gs-cp-s: #F5F3FF; 
 --gs-cp-b: #DDD6FE; 
}


/* ============================================================
 * § 02 · NAVBAR — sub-components & inline search
 * Used across all 30+ public pages.
 * ============================================================ */

/* Inner flex row */
.gs-nav-inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 1.5rem;
  height: 100%;
}

/* Brand lockup */
.gs-brand {
  display: flex;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
  flex-shrink: 0;
}
.gs-brand:focus-visible {
  outline: 2px solid var(--gs-cp);
  border-radius: var(--gs-rmd);
  outline-offset: 3px;
}
.gs-brand-mark {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  flex-shrink: 0;
  background: linear-gradient(135deg, #5B21B6, #3D8B37);
  display: flex;
  align-items: center;
  justify-content: center;
}
.gs-brand-mark svg { width: 20px; height: 20px; }
.gs-brand-name {
  font-family: var(--gs-fd);
  font-weight: 800;
  font-size: 1.25rem;
  color: var(--gs-tx0);
  letter-spacing: -.025em;
  line-height: 1;
}
.gs-brand-name .dot { color: var(--gs-cs); }

/* Nav link list */
.gs-nav-links {
  display: flex;
  align-items: stretch;
  list-style: none;
  margin: 0;
  padding: 0;
  height: var(--gs-nh);
}
.gs-nav-links li { display: flex; align-items: stretch; }

/* "HOT" pill badge on Deals nav item */
.gs-nav-pill {
  display: inline-flex;
  align-items: center;
  font-size: .55rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: var(--gs-rf);
  background: var(--gs-cp-m);
  color: var(--gs-cp-t);
  margin-left: .25rem;
  line-height: 1.4;
}

/* Desktop inline search bar */
.gs-nav-search {
  flex: 1;
  max-width: 26rem;
  position: relative;
}
.gs-nav-search-ico {
  position: absolute;
  left: .875rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--gs-tx2);
  font-size: .875rem;
  pointer-events: none;
  z-index: 1;
}
.gs-nav-search-inp {
  width: 100%;
  height: 40px;
  background: var(--gs-bg2);
  border: 1.5px solid var(--gs-bd0);
  border-radius: var(--gs-rf);
  padding: 0 1rem 0 2.625rem;
  font-family: var(--gs-fb);
  font-size: .875rem;
  color: var(--gs-tx0);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.gs-nav-search-inp::placeholder { color: var(--gs-tx2); }
.gs-nav-search-inp:focus {
  border-color: var(--gs-cp);
  box-shadow: var(--gs-foc);
  background: var(--gs-sf0);
}

/* Actions cluster (right side) */
.gs-nav-actions {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-left: auto;
  flex-shrink: 0;
}

/* Vertical separator */
.gs-nav-sep {
  width: 1px;
  height: 20px;
  background: var(--gs-bd0);
  flex-shrink: 0;
}

/* Dashboard nav sub-parts */
.gs-nav-section {
  font-size: .75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .09em;
  flex-shrink: 0;
}
/* Mobile: keep only the logo in the header — hide the duplicate brand-name/"Business Workspace" text + its separator. */
@media (max-width: 991.98px) {
  .gs-nav-sep,
  .gs-nav-section { display: none; }
}
.gs-nav-right {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-left: auto;
  flex-shrink: 0;
}

/* Mobile hamburger — old pages; kept for backward compat */
.gs-hamburger {
  display: none;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: none;
  border: 1px solid var(--gs-bd1);
  border-radius: var(--gs-rmd);
  cursor: pointer;
  color: var(--gs-tx1);
  font-size: 1.25rem;
  flex-shrink: 0;
  transition: background .15s, color .15s;
}
.gs-hamburger:hover { background: var(--gs-bg2); color: var(--gs-tx0); }
.gs-hamburger:focus-visible { outline: none; box-shadow: var(--gs-foc); }

/* Canonical hamburger (gs-burger) — new pages */
.gs-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 36px;
  height: 36px;
  border: 1px solid var(--gs-bd1);
  border-radius: var(--gs-rmd);
  background: none;
  cursor: pointer;
  padding: .5rem;
  flex-shrink: 0;
  color: var(--gs-tx1);
  font-size: 1.25rem;
  transition: background .15s, color .15s;
}
.gs-burger:hover { background: var(--gs-bg2); color: var(--gs-tx0); }
.gs-burger:focus-visible { outline: none; box-shadow: var(--gs-foc); }

/* Dashboard mobile menu button */
.gs-mobile-menu-btn {
  display: none;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  background: none;
  border: 1px solid var(--gs-bd1);
  border-radius: var(--gs-rmd);
  color: var(--gs-tx1);
  cursor: pointer;
  font-size: 1.125rem;
  transition: background .15s, color .15s;
}
.gs-mobile-menu-btn:hover { background: var(--gs-bg2); color: var(--gs-tx0); }
.gs-mobile-menu-btn:focus-visible { outline: none; box-shadow: var(--gs-foc); }


/* ============================================================
 * § 03 · MOBILE DRAWER + BACKDROP
 *
 * Canonical IDs (enforced from search.html build forward):
 *   id="gs-drawer"        → was id="gs-mob-drawer"
 *   id="gs-burger"        → was id="gs-hamburger"
 *   class="gs-drawer"     → was class="gs-mob-drawer"
 *
 * JS contract: drawerOpen() / drawerClose() / drawerToggle()
 *   in goji-main.js MobileMenu module binds to #gs-drawer,
 *   #gs-backdrop, #gs-burger.
 *
 * Both the canonical classes AND the deprecated gs-mob-drawer-*
 * aliases are defined here so older pages (404, new, top-rated,
 * trending) continue to work until they are migrated.
 * ============================================================ */

/* ── Canonical drawer ── */
.gs-drawer {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 97%;
  background: var(--gs-sf0);
  z-index: 700;
  box-shadow: 2px 0 24px rgba(0, 0, 0, .18);
  transform: translateX(-110%);
  transition: transform .3s cubic-bezier(.4, 0, .2, 1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.gs-drawer.open { transform: translateX(0); }

.gs-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.125rem;
  height: var(--gs-nh);
  border-bottom: 1px solid var(--gs-bd0);
  flex-shrink: 0;
}
.gs-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: .75rem .875rem;
  scrollbar-width: thin;
  scrollbar-color: var(--gs-bd0) transparent;
}
.gs-drawer-footer {
  border-top: 1px solid var(--gs-bd0);
  padding: .875rem;
  display: flex;
  gap: .625rem;
  flex-shrink: 0;
}
.gs-drawer-footer .gs-btn { flex: 1; justify-content: center; }

/* Section label above a group of links */
.gs-drawer-section-label {
  font-size: .6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--gs-tx2);
  padding: .75rem .5rem .25rem;
  display: block;
}

/* Navigation link inside drawer */
.gs-drawer-link {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .625rem .875rem;
  border-radius: var(--gs-rmd);
  font-size: .9375rem;
  font-weight: 500;
  color: var(--gs-tx1);
  text-decoration: none;
  transition: background .12s, color .12s;
}
.gs-drawer-link:hover,
.gs-drawer-link.active {
  background: var(--gs-cp-s);
  color: var(--gs-cp-t);
  text-decoration: none;
}
.gs-drawer-link i {
  font-size: 1rem;
  width: 1.125rem;
  text-align: center;
  flex-shrink: 0;
  color: var(--gs-purple-800);
}
.gs-drawer-link:hover i,
.gs-drawer-link.active i { color: var(--gs-cp); }

/* Horizontal separator */
.gs-drawer-sep {
  height: 1px;
  background: var(--gs-bd0);
  margin: .625rem 0;
}

/* Drawer search bar */
.gs-drawer-search { position: relative; margin-bottom: 1.25rem; }
.gs-drawer-search-ico {
  position: absolute;
  left: .875rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--gs-tx2);
  font-size: .875rem;
  pointer-events: none;
}
.gs-drawer-search-inp {
  width: 100%;
  height: 44px;
  background: var(--gs-bg2);
  border: 1.5px solid var(--gs-bd0);
  border-radius: var(--gs-rf);
  padding: 0 1rem 0 2.625rem;
  font-family: var(--gs-fb);
  font-size: .9375rem;
  color: var(--gs-tx0);
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.gs-drawer-search-inp::placeholder { color: var(--gs-tx2); }
.gs-drawer-search-inp:focus {
  border-color: var(--gs-cp);
  box-shadow: var(--gs-foc);
}

/* ── Deprecated aliases (404, new, top-rated, trending) ── */
/* These mirror the canonical drawer so old pages render correctly
   until they are migrated to id="gs-drawer". */
.gs-mob-drawer {
  position: fixed;
  top: 0; left: 0; bottom: 0;
  width: min(80vw, 400px);
  background: var(--gs-sf0);
  z-index: 700;
  box-shadow: 2px 0 24px rgba(0, 0, 0, .18);
  transform: translateX(-110%);
  transition: transform .3s cubic-bezier(.4, 0, .2, 1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.gs-mob-drawer.open { transform: translateX(0); }

.gs-mob-drawer-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.125rem;
  height: var(--gs-nh);
  border-bottom: 1px solid var(--gs-bd0);
  flex-shrink: 0;
}
.gs-mob-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: .75rem .875rem;
  scrollbar-width: thin;
  scrollbar-color: var(--gs-bd0) transparent;
}
.gs-mob-drawer-footer {
  border-top: 1px solid var(--gs-bd0);
  padding: .875rem;
  display: flex;
  gap: .625rem;
  flex-shrink: 0;
}
.gs-mob-drawer-footer .gs-btn { flex: 1; justify-content: center; }
.gs-mob-drawer-section { margin-bottom: 1rem; }
.gs-mob-drawer-label {
  font-size: .6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--gs-tx2);
  padding: .375rem .5rem;
  display: block;
}
.gs-mob-drawer-link {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .625rem .75rem;
  border-radius: var(--gs-rmd);
  font-size: .9375rem;
  font-weight: 500;
  color: var(--gs-tx1);
  text-decoration: none;
  transition: background .12s, color .12s;
}
.gs-mob-drawer-link:hover,
.gs-mob-drawer-link.active {
  background: var(--gs-cp-s);
  color: var(--gs-cp-t);
  text-decoration: none;
}
.gs-mob-drawer-link i {
  font-size: 1.125rem;
  width: 1.25rem;
  text-align: center;
  flex-shrink: 0;
  color: var(--gs-tx2);
}
.gs-mob-drawer-link:hover i,
.gs-mob-drawer-link.active i { color: var(--gs-cp); }
.gs-mob-drawer-sep {
  height: 1px;
  background: var(--gs-bd0);
  margin: .5rem 0;
}
/* Legacy search inside old drawer */
.gs-drawer-search-icon {
  position: absolute;
  left: .75rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--gs-tx2);
  pointer-events: none;
  font-size: 1rem;
}
.gs-drawer-search-input {
  width: 100%;
  height: 44px;
  padding: 0 1rem 0 2.5rem;
  border: 1.5px solid var(--gs-bd1);
  border-radius: var(--gs-rf);
  background: var(--gs-bg1);
  font-family: var(--gs-fb);
  font-size: .9375rem;
  color: var(--gs-tx0);
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.gs-drawer-search-input::placeholder { color: var(--gs-tx2); }
.gs-drawer-search-input:focus {
  border-color: var(--gs-cp);
  box-shadow: var(--gs-foc);
}

/* Backdrop — shared by both drawer variants */
.gs-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .48);
  z-index: 690;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.gs-backdrop.active { opacity: 1; pointer-events: auto; }


/* ============================================================
 * § 04 · BREADCRUMB BAR
 * Used on 14+ pages: blog, category, compare, contact,
 * deals, new, pricing, tool-listing, top-rated, trending, etc.
 * ============================================================ */

.gs-breadcrumb-bar {
  border-bottom: 1px solid var(--gs-bd0);
  background: var(--gs-bg1);
  padding: .625rem 0;
}
.gs-bc-list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .375rem;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: .8125rem;
  color: var(--gs-tx2);
}
.gs-bc-list li { display: flex; align-items: center; gap: .375rem; }
.gs-bc-list a { color: var(--gs-tx2); transition: color .15s; }
.gs-bc-list a:hover { color: var(--gs-cp); }
.gs-bc-list .sep { color: var(--gs-bd2); font-size: .625rem; }
.gs-bc-list .current { color: var(--gs-tx1); font-weight: 500; }


/* ============================================================
 * § 05 · FOOTER — sub-components
 * Complements .gs-footer in goji-framework.css.
 * Present on all public pages.
 * ============================================================ */

.gs-footer-brand {
  display: flex;
  align-items: center;
  gap: .625rem;
  margin-bottom: 1rem;
  text-decoration: none;
}
.gs-footer-mark {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: linear-gradient(135deg, #5B21B6, #3D8B37);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.gs-footer-mark svg { width: 18px; height: 18px; }
.gs-footer-brand-name {
  font-family: var(--gs-fd);
  font-size: 1.125rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -.025em;
  line-height: 1;
  text-decoration: none;
}
.gs-footer-brand-name .dot { color: #4ADE80; }

.gs-footer-tagline {
  font-size: .875rem;
  color: rgba(255, 255, 255, .45);
  line-height: 1.65;
  max-width: 280px;
  margin-bottom: 1.5rem;
}
.gs-footer-socials { display: flex; gap: .5rem; flex-wrap: wrap; }
.gs-footer-soc {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, .06);
  border-radius: var(--gs-rmd);
  color: #9CA3AF;
  font-size: 1rem;
  transition: background .15s, color .15s;
  text-decoration: none;
}
.gs-footer-soc:hover { background: #5B21B6; color: #fff; text-decoration: none; }
.gs-footer-soc:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(167, 139, 250, .45); }

.gs-footer-col-title {
  font-family: var(--gs-fd);
  font-size: .875rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 1rem;
}
.gs-footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.gs-footer-links a { font-size: .875rem; color: #9CA3AF; text-decoration: none; transition: color .15s; }
.gs-footer-links a:hover { color: #fff; }

.gs-footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .06);
  padding: 1.5rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .875rem;
}
.gs-footer-copy { font-size: .75rem; color: #6B7280; line-height: 1.5; }
.gs-footer-copy a { color: #6B7280; text-decoration: none; transition: color .15s; }
.gs-footer-copy a:hover { color: #9CA3AF; }
.gs-footer-legal {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.25rem;
}
.gs-footer-legal a { font-size: .75rem; color: #6B7280; text-decoration: none; transition: color .15s; }
.gs-footer-legal a:hover { color: #9CA3AF; }


/* ============================================================
 * § 06 · SECTION PRIMITIVES
 * Base spacing and typography used on about, blog, pricing,
 * contact, goji-lower-sections, goji-sections.
 * ============================================================ */

.gs-sec {
  padding: 5rem 0;
  background: var(--gs-bg0);
}
.gs-sec-alt { background: var(--gs-bg1); }
.gs-sec-dark { background: #0a0d18; }
.gs-sec-hdr  { margin-bottom: 3rem; }
.gs-sec-h2 {
  font-family: var(--gs-fd);
  font-size: clamp(1.875rem, 3.5vw, 2.625rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.15;
  color: var(--gs-tx0);
  margin-bottom: .75rem;
}
.gs-sec-sub {
  font-size: 1.0625rem;
  color: var(--gs-tx1);
  line-height: 1.65;
}
.gs-sec-sub-center { text-align: center; }

/* Section eyebrow label */
.gs-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--gs-cp-t);
  background: var(--gs-cp-s);
  border: 1px solid var(--gs-cp-b);
  border-radius: var(--gs-rf);
  padding: .25rem .875rem;
  margin-bottom: .875rem;
}
[data-theme="dark"] .gs-eyebrow {
  background: rgba(91, 33, 182, .16);
  border-color: rgba(196, 181, 253, .30);
}

/* Button size variants */
.gs-btn-md  { height: 44px; padding: 0 1.25rem; }
.gs-btn-sm  { height: 36px; padding: 0 1rem; font-size: .8125rem; }
.gs-btn-lg  { height: 52px; padding: 0 1.5rem; font-size: 1rem; }
.gs-btn-sq  { width: 36px; padding: 0; }
.gs-btn-pill { border-radius: var(--gs-rf) !important; }
.gs-btn-block { width: 100%; justify-content: center; }

/* White button for dark backgrounds */
.gs-btn-white {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  background: #fff;
  border: 2px solid #fff;
  color: #5B21B6;
  font-family: var(--gs-fd);
  font-weight: 700;
  font-size: 1rem;
  height: 52px;
  padding: 0 1.75rem;
  border-radius: var(--gs-rf);
  text-decoration: none;
  cursor: pointer;
  transition: background .18s, box-shadow .18s, transform .1s;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .18);
  white-space: nowrap;
}
.gs-btn-white:hover { background: #F5F3FF; color: #5B21B6; text-decoration: none; }
.gs-btn-white:active { transform: translateY(1px); }
.gs-btn-white:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(255,255,255,.5); }

/* Ghost-white outline button for dark backgrounds */
.gs-btn-white-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  background: transparent;
  border: 2px solid rgba(255, 255, 255, .45);
  color: #fff;
  font-family: var(--gs-fd);
  font-weight: 600;
  font-size: .9375rem;
  height: 52px;
  padding: 0 1.5rem;
  border-radius: var(--gs-rf);
  text-decoration: none;
  cursor: pointer;
  transition: background .18s, border-color .18s, transform .1s;
  white-space: nowrap;
}
.gs-btn-white-outline:hover {
  background: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .7);
  color: #fff;
  text-decoration: none;
}
.gs-btn-white-outline:active { transform: translateY(1px); }


/* ============================================================
 * § 07 · BADGE COLOUR VARIANTS
 * Colour modifier classes for .gs-badge (base in framework).
 * ============================================================ */

.gs-badge-p  { background: var(--gs-cp-m);     color: var(--gs-cp-t);      }
.gs-badge-g  { background: #DCFCE7;            color: #16A34A;             }
.gs-badge-b  { background: #DBEAFE;            color: #1D4ED8;             }
.gs-badge-r  { background: #FEE2E2;            color: #DC2626;             }
.gs-badge-y  { background: #FFFBEB;            color: #92400E;             }
.gs-badge-nt { background: var(--gs-bg2);      color: var(--gs-tx1);       }

.gs-badge-solid-p { background: var(--gs-cp);      color: #fff; }
.gs-badge-solid-g { background: var(--gs-cs);      color: #fff; }
.gs-badge-solid-b { background: var(--gs-ct);      color: #fff; }
.gs-badge-solid-r { background: #DC2626;           color: #fff; }

/* Semantic shorthand badges */
.gs-badge-hot  { background: #FFF7ED; color: #C2410C; }
.gs-badge-new  { background: #DBEAFE; color: #1D4ED8; }
.gs-badge-deal { background: #DCFCE7; color: #16A34A; }
.gs-badge-warn { background: #FFFBEB; color: #92400E; }


/* ============================================================
 * § 08 · FORM FIELD HELPERS
 * Used on all auth pages, contact, and dashboard forms.
 * ============================================================ */

.gs-field { margin-bottom: 1.25rem; }

.gs-err {
  border-color: var(--gs-status-error) !important;
  background: var(--gs-error-bg) !important;
}
.gs-err:focus { box-shadow: var(--gs-focus-ring-error) !important; }

.gs-ok {
  border-color: var(--gs-status-success) !important;
}
.gs-ok:focus { box-shadow: var(--gs-focus-ring-success) !important; }

.gs-err-msg {
  display: none;
  align-items: center;
  gap: .3rem;
  font-size: .75rem;
  color: var(--gs-status-error);
  margin-top: .375rem;
  line-height: 1.4;
}
.gs-err-msg.visible { display: flex; }

.gs-ok-msg {
  display: none;
  align-items: center;
  gap: .3rem;
  font-size: .75rem;
  color: var(--gs-status-success);
  margin-top: .375rem;
}
.gs-ok-msg.visible { display: flex; }

.gs-help {
  font-size: .75rem;
  color: var(--gs-tx2);
  margin-top: .375rem;
  line-height: 1.5;
}

.gs-check-wrap {
  display: flex;
  align-items: flex-start;
  gap: .625rem;
}

/* Inline form-level alert */
.gs-form-alert {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: .875rem 1rem;
  border-radius: var(--gs-rmd);
  font-size: .875rem;
  line-height: 1.55;
  margin-bottom: 1.25rem;
  border-left: 3px solid;
}
.gs-form-alert-error   { background: var(--gs-error-bg);   border-color: var(--gs-status-error);   color: var(--gs-status-error-text); }
.gs-form-alert-success { background: var(--gs-success-bg); border-color: var(--gs-status-success); color: var(--gs-status-success-text); }
.gs-form-alert-info    { background: var(--gs-info-bg);    border-color: var(--gs-ct);             color: var(--gs-status-info-text); }

.gs-back-link {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  font-size: .875rem;
  color: var(--gs-tx2);
  text-decoration: none;
  margin-bottom: 1.5rem;
  transition: color .15s;
}
.gs-back-link:hover { color: var(--gs-cp); }


/* ============================================================
 * § 09 · OTP + PASSWORD COMPONENTS
 * Used on auth-email-verification and all auth pages.
 * ============================================================ */

.gs-otp-group {
  display: flex;
  gap: .625rem;
  justify-content: center;
}
.gs-otp-input {
  width: 52px;
  height: 60px;
  text-align: center;
  font-family: var(--gs-fd);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gs-tx0);
  border: 1.5px solid var(--gs-bd1);
  border-radius: var(--gs-rmd);
  background: var(--gs-sf0);
  outline: none;
  caret-color: var(--gs-cp);
  transition: border-color .15s, box-shadow .15s, background .15s;
  -webkit-appearance: none;
  appearance: none;
}
.gs-otp-input:focus { border-color: var(--gs-cp); box-shadow: var(--gs-foc); }
.gs-otp-input.filled { border-color: var(--gs-cp); background: var(--gs-cp-s); }
.gs-otp-input.gs-err { border-color: var(--gs-status-error) !important; background: var(--gs-error-bg) !important; }

.gs-pw-input { padding-right: 3rem; }
.gs-pw-toggle {
  position: absolute;
  right: .75rem;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--gs-tx2);
  cursor: pointer;
  padding: 0;
  transition: color .15s;
}
.gs-pw-toggle:hover { color: var(--gs-tx0); }
.gs-pw-toggle:focus-visible { outline: none; box-shadow: var(--gs-foc); border-radius: var(--gs-rsm); }
.gs-pw-label { font-size: .6875rem; font-weight: 600; color: var(--gs-tx2); }
.gs-countdown { font-size: .875rem; color: var(--gs-tx2); font-variant-numeric: tabular-nums; }


/* ============================================================
 * § 10 · STAT / KPI CARDS
 * Dashboard pages and auth left-panel stats.
 * ============================================================ */

.gs-stat-card {
  background: var(--gs-sf1);
  border: 1px solid var(--gs-bd1);
  border-radius: var(--gs-rxl);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: .375rem;
}
.gs-stat-value {
  font-family: var(--gs-fd);
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -.04em;
  color: var(--gs-tx0);
  font-variant-numeric: tabular-nums;
}
.gs-stat-label {
  font-size: .6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--gs-tx2);
}
/* Auth panel stats (white text on purple bg) */
.gs-stat-num {
  font-family: var(--gs-fd);
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.03em;
}
.gs-stat-lbl {
  font-size: .75rem;
  margin-top: .25rem;
}
/* Delta indicators */
.gs-stat-delta {
  gap: .25rem;
  font-size: .75rem;
  font-weight: 600;
}
.gs-stat-delta-up   { color: var(--gs-cs); }
.gs-stat-delta-down { color: #DC2626;      }
.gs-stat-delta-nt   { color: var(--gs-tx2); }


/* ============================================================
 * § 11 · DASHBOARD NAV HELPERS
 * Used across all 12 dashboard pages.
 * ============================================================ */

.gs-section-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--gs-tx0);
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: .5rem;
}
.gs-page-sub {
  font-size: .9375rem;
  color: var(--gs-tx2);
  line-height: 1.55;
  margin-top: .375rem;
}
.gs-sb-section-label {
  font-size: .5625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--gs-tx2);
  padding: .875rem 1.125rem .375rem;
  display: block;
  margin-bottom:0;
}
.gs-sb-nav {
  padding: .375rem .625rem;
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--gs-bd0) transparent;
}
.gs-sb-footer {
  padding: .875rem .625rem;
  border-top: 1px solid var(--gs-bd0);
  flex-shrink: 0;
}


/* ============================================================
 * § 12 · TABLE WRAPPER
 * Horizontal scroll container for .gs-table.
 * Used on dashboard-api-keys, -billing, -saved-tools, -support.
 * ============================================================ */

.gs-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--gs-bd1);
  border-radius: var(--gs-rxl);
}


/* ============================================================
 * § 13 · TOGGLE (UI switch)
 * iOS-style checkbox toggle.
 * Used on: dashboard-notifications, dashboard-settings.
 * ============================================================ */

.gs-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  gap: .75rem;
}
.gs-toggle input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}
.gs-toggle-track {
  width: 44px;
  height: 24px;
  border-radius: var(--gs-rf);
  background: var(--gs-bd2);
  transition: background .2s;
  position: relative;
  flex-shrink: 0;
}
.gs-toggle input:checked ~ .gs-toggle-track { background: var(--gs-cp); }
.gs-toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: var(--gs-shsm);
  transition: transform .2s;
}
.gs-toggle input:checked ~ .gs-toggle-track .gs-toggle-thumb { transform: translateX(20px); }
.gs-toggle input:focus-visible ~ .gs-toggle-track { box-shadow: var(--gs-foc); }
.gs-toggle-label { font-size: .875rem; color: var(--gs-tx1); user-select: none; }


/* ============================================================
 * § 14 · PRICING TOGGLE
 * Monthly / Annual billing switcher.
 * Used on: pricing, goji-lower-sections, index.
 * ============================================================ */

.gs-ptog-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 2.5rem;
}
.gs-ptog {
  display: inline-flex;
  align-items: center;
  background: var(--gs-sf2);
  border: 1px solid var(--gs-bd0);
  border-radius: var(--gs-rf);
  padding: 4px;
  gap: 2px;
}
.gs-ptog-opt {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem 1.125rem;
  border: none;
  border-radius: var(--gs-rf);
  background: transparent;
  font-family: var(--gs-fd);
  font-size: .875rem;
  font-weight: 500;
  color: var(--gs-tx2);
  cursor: pointer;
  transition: background .15s, color .15s, box-shadow .15s;
}
.gs-ptog-opt.active {
  background: var(--gs-sf0);
  color: var(--gs-tx0);
  font-weight: 600;
  box-shadow: var(--gs-shsm);
}
.gs-ptog-opt:hover:not(.active) { color: var(--gs-tx0); }
.gs-ptog-opt:focus-visible { outline: none; box-shadow: var(--gs-foc); }

.gs-save-pill {
  display: inline-flex;
  align-items: center;
  font-size: .625rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 2px 7px;
  background: #DCFCE7;
  color: #16A34A;
  border-radius: var(--gs-rf);
}


/* ============================================================
 * § 15 · PRICING CARDS
 * Used on: pricing, goji-lower-sections, index (3+ pages).
 * ============================================================ */

.gs-price-card {
  background: var(--gs-sf1);
  border: 1.5px solid var(--gs-bd0);
  border-radius: var(--gs-r2xl);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  position: relative;
}
.gs-plan-tier {
  font-size: .625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--gs-color-primary);
  margin-bottom: .5rem;
}
.gs-plan-name {
  font-family: var(--gs-fd);
  font-size: 1.625rem;
  font-weight: 800;
  color: var(--gs-tx0);
  margin-bottom: .375rem;
}
.gs-plan-desc {
  font-size: .8125rem;
  color: var(--gs-tx2);
  line-height: 1.45;
  margin-bottom: 1.5rem;
  /* keep every card's description to a uniform 2 lines */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.gs-price-display {
  display: flex;
  align-items: flex-end;
  gap: .2rem;
  margin-bottom: .375rem;
}
.gs-price-cur {
  font-family: var(--gs-fd);
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--gs-tx0);
  line-height: 1.15;
}
.gs-price-amt {
  font-family: var(--gs-fd);
  font-size: 3.75rem;
  font-weight: 800;
  letter-spacing: -.04em;
  color: var(--gs-tx0);
  line-height: .95;
}
.gs-price-per {
  font-size: .9375rem;
  color: var(--gs-tx2);
  margin-bottom: .375rem;
}
.gs-price-note {
  font-size: .75rem;
  color: var(--gs-tx2);
  margin-bottom: 1.75rem;
}
.gs-plan-divider {
  height: 1px;
  background: var(--gs-bd1);
  margin-bottom: 1.5rem;
}
.gs-plan-feats {
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: .625rem;
}
.gs-popular-pip {
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: var(--gs-color-primary);
    color: #fff;
    font-family: var(--gs-font-display);
    font-size: .625rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 5px 14px;
    border-radius: 0 0 var(--gs-radius-lg) var(--gs-radius-lg);
    white-space: nowrap;
}

/* Popular card highlight + feature check/cross colors (were missing — inline in theme) */
.gs-price-card.popular {
  border-color: var(--gs-cp);
  box-shadow: 0 14px 40px -12px rgba(91, 33, 182, .35);
}
@media (min-width: 768px) {
  .gs-price-card.popular { transform: scale(1.025); }
  .gs-price-card.popular:hover { transform: scale(1.03); }
}
.gs-price-card:not(.popular) { transition: box-shadow .2s, border-color .2s, transform .2s; }
.gs-price-card:not(.popular):hover {
  box-shadow: var(--gs-shlg, 0 12px 28px -8px rgba(17,24,39,.18));
  border-color: var(--gs-cp-b);
}
.gs-plan-feats li {
  display: flex; align-items: flex-start; gap: .625rem;
  font-size: .875rem; color: var(--gs-tx1); line-height: 1.5;
}
.gs-plan-feats .check { color: var(--gs-green-600); font-size: 1rem; flex-shrink: 0; margin-top: 1px; }
.gs-plan-feats .cross { color: #CBD5E1; font-size: 1rem; flex-shrink: 0; margin-top: 1px; }
.gs-plan-feats .off   { color: var(--gs-tx2); }
[data-theme="dark"] .gs-plan-feats .cross { color: #475569; }


/* ============================================================
 * § 16 · FAQ ACCORDION
 * Used on: blog-detail, pricing, goji-lower-sections, index.
 * ============================================================ */

.gs-faq-list { display: flex; flex-direction: column; }
.gs-faq-item { border-bottom: 1px solid var(--gs-bd0); }
.gs-faq-item:last-child { border-bottom: none; }
.gs-faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 0;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: var(--gs-fd);
  font-size: .9375rem;
  font-weight: 600;
  color: var(--gs-tx0);
  gap: 1rem;
  transition: color .15s;
}
.gs-faq-q:hover { color: var(--gs-cp); }
.gs-faq-q:focus-visible { outline: none; box-shadow: var(--gs-foc); border-radius: var(--gs-rsm); }
.gs-faq-q[aria-expanded="true"] { color: var(--gs-cp); }
.gs-faq-q i { flex-shrink: 0; transition: transform .28s; color: var(--gs-tx2); }
.gs-faq-q[aria-expanded="true"] i { transform: rotate(180deg); color: var(--gs-cp); }
.gs-faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .32s ease, padding .32s ease;
}
.gs-faq-item.open .gs-faq-a {
  max-height: 600px;
  padding-bottom: 1rem;
}
.gs-faq-a p {
  font-size: .9375rem;
  color: var(--gs-tx1);
  line-height: 1.7;
}


/* ============================================================
 * § 17 · BLOG CARD BODY
 * Card inner area on blog index and homepage sections.
 * ============================================================ */

.gs-blog-body {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.gs-blog-title {
  font-family: var(--gs-fd);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--gs-tx0);
  margin-bottom: .625rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* Coloured thumb gradients used on blog cards */
.gs-blog-thumb-marketing  { background: linear-gradient(135deg, #EA580C 0%, #9A3412 100%); }
.gs-blog-thumb-comparison { background: linear-gradient(135deg, #1D4ED8 0%, #1E3A8A 100%); }


/* ============================================================
 * § 18 · NEWSLETTER SECTION
 * Purple gradient section used on blog, blog-detail,
 * goji-lower-sections.
 * ============================================================ */

.gs-nl-sec {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #5B21B6 0%, #3B21B6 100%);
  padding: 5rem 0;
}
.gs-nl-h2 {
  font-family: var(--gs-fd);
  font-size: clamp(1.875rem, 3.5vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.15;
  color: #fff;
  margin-bottom: 1rem;
}
.gs-nl-sub {
  font-size: 1rem;
  color: rgba(255, 255, 255, .75);
  line-height: 1.65;
  margin-bottom: .25rem;
}
.gs-nl-eyebrow {
  font-size: .6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: rgba(255, 255, 255, .55);
  margin-bottom: .875rem;
}
.gs-nl-input {
  width: 100%;
  height: 50px;
  padding: 0 1.125rem;
  border: 1.5px solid rgba(255, 255, 255, .3);
  border-radius: var(--gs-rf);
  background: rgba(255, 255, 255, .15);
  color: #fff;
  font-family: var(--gs-fb);
  font-size: .9375rem;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.gs-nl-input::placeholder { color: rgba(255, 255, 255, .55); }
.gs-nl-input:focus {
  border-color: rgba(255, 255, 255, .6);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .2);
}
.gs-nl-form {
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: var(--gs-r2xl);
  padding: 1.75rem;
}
.gs-nl-form-wrap {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: var(--gs-rxl);
  padding: 2rem;
}
.gs-nl-form-title {
  font-family: var(--gs-fd);
  font-size: 1.125rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: .375rem;
}
.gs-nl-form-sub {
  font-size: .8125rem;
  color: rgba(255, 255, 255, .6);
  margin-bottom: 1.5rem;
}
.gs-nl-benefits {
  list-style: none;
  padding: 0;
  margin: 0;
}
.gs-nl-benefit {
  display: flex;
  align-items: flex-start;
  gap: .625rem;
  font-size: .9375rem;
  color: rgba(255, 255, 255, .85);
  line-height: 1.5;
  margin-bottom: .5rem;
}
.gs-nl-benefit i { color: #4ADE80; flex-shrink: 0; margin-top: 2px; }
.gs-nl-sub-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .375rem;
  width: 100%;
  height: 50px;
  border: none;
  border-radius: var(--gs-rf);
  background: #fff;
  color: #5B21B6;
  font-family: var(--gs-fd);
  font-weight: 700;
  font-size: 1rem;
  cursor: pointer;
  transition: background .18s, box-shadow .18s;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
}
.gs-nl-sub-btn:hover { background: #F5F3FF; box-shadow: 0 8px 24px rgba(0, 0, 0, .22); }
.gs-nl-disclaimer {
  font-size: .75rem;
  color: rgba(255, 255, 255, .45);
  text-align: center;
  line-height: 1.5;
}
.gs-nl-footnote {
  font-size: .75rem;
  color: rgba(255, 255, 255, .45);
  text-align: center;
  margin-top: .875rem;
}
/* Decorative blobs inside newsletter section */
.gs-nl-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
}
.gs-nl-blob-1 { width: 360px; height: 360px; top: -120px;  right: -50px; background: rgba(255, 255, 255, .06); }
.gs-nl-blob-2 { width: 280px; height: 280px; bottom: -80px; left: -30px; background: rgba(255, 255, 255, .04); }


/* ============================================================
 * § 19 · SKELETON LOADER
 * Shimmer animation used on all dashboard pages.
 * ============================================================ */

@keyframes gs-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.gs-skel {
  background: linear-gradient(
    90deg,
    var(--gs-bg2) 25%,
    var(--gs-bg1) 50%,
    var(--gs-bg2) 75%
  );
  background-size: 200% 100%;
  animation: gs-shimmer 1.5s infinite;
  border-radius: var(--gs-rsm);
  display: block;
}
.gs-skel-text   { height: .875rem;  margin-bottom: .5rem; }
.gs-skel-title  { height: 1.375rem; max-width: 60%; margin-bottom: .75rem; }
.gs-skel-circle { border-radius: 50%; }
.gs-skel-btn    { height: 2.75rem;  border-radius: var(--gs-rmd); }


/* ============================================================
 * § 20 · AUTH PAGE SHELL
 * Two-panel layout: brand left, form right.
 * Used on all 5 auth pages.
 * ============================================================ */

.gs-auth-page {
  min-height: 100dvh;
  display: grid;
  grid-template-columns: 1fr;          /* mobile: single column (brand hidden) */
}
/* Desktop: brand panel (left) + form panel (right), split screen */
@media (min-width: 768px) {
  .gs-auth-page { grid-template-columns: 1.05fr 1fr; }
}
@media (min-width: 1280px) {
  .gs-auth-page { grid-template-columns: 1.15fr 1fr; }
}
.gs-auth-form-side {
  background: var(--gs-bg0);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.5rem 2rem;
  min-height: 100dvh;
}
/* Brand panel — refined premium gradient (overrides the framework default) */
.gs-auth-brand {
  background:
    radial-gradient(120% 90% at 85% 0%, rgba(124, 58, 237, .55) 0%, transparent 55%),
    radial-gradient(100% 80% at 0% 100%, rgba(61, 139, 55, .35) 0%, transparent 50%),
    linear-gradient(155deg, #4C1D95 0%, #5B21B6 45%, #2E1065 100%);
  padding: clamp(2.5rem, 4vw, 4rem);
}
.gs-brand-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
  max-width: 32rem;
}
.gs-brand-inner-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.gs-brand-h {
  font-family: var(--gs-fd);
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 800;
  color: #fff;
  letter-spacing: -.035em;
  line-height: 1.15;
  margin-bottom: 1rem;
}
.gs-brand-sub {
  font-size: 1.0625rem;
  color: rgba(255, 255, 255, .75);
  line-height: 1.65;
  margin-bottom: 2rem;
}
.gs-brand-stats {
  display: flex;
  gap: 2rem;
  margin-bottom: 2.5rem;
  flex-wrap: wrap;
}
.gs-brand-bullets  { display: flex; flex-direction: column; gap: .875rem; }
.gs-brand-bullet   { display: flex; align-items: center; gap: .875rem; }
.gs-bullet-icon {
  width: 28px;
  height: 28px;
  border-radius: var(--gs-rsm);
  background: rgba(255, 255, 255, .12);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1rem;
}
.gs-bullet-text { font-size: .9375rem; color: rgba(255, 255, 255, .82); line-height: 1.45; }

/* Mobile-only logo (auth pages) */
.gs-mobile-logo {
  display: none;
  align-items: center;
  gap: .375rem;
  text-decoration: none;
  margin-bottom: 1.5rem;
}
.gs-mobile-mark {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: linear-gradient(135deg, #5B21B6, #3D8B37);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.gs-mobile-name {
  font-family: var(--gs-fd);
  font-weight: 800;
  font-size: 1.125rem;
  color: var(--gs-tx0);
  letter-spacing: -.025em;
}

/* ============================================================
 * HOMEPAGE S10 — "The Numbers Speak…" stats (exact match to index.html).
 * Scoped under .gs-sec-dark so the SHARED .gs-stat-card used by the dashboard
 * (overview/affiliate/support KPI cards) keeps its boxed look.
 * ============================================================ */
.gs-dark-bg-layer { position:absolute; inset:0; pointer-events:none; }
.gs-dark-bg-layer::before {
  content:''; position:absolute; top:-120px; left:-100px;
  width:560px; height:560px; border-radius:50%;
  background:radial-gradient(circle, rgba(91,33,182,.22) 0%, transparent 70%);
}
.gs-dark-bg-layer::after {
  content:''; position:absolute; bottom:-100px; right:-60px;
  width:400px; height:400px; border-radius:50%;
  background:radial-gradient(circle, rgba(61,139,55,.15) 0%, transparent 70%);
}
.gs-sec-dark .gs-stat-card {
  background:none; border:none; border-radius:0; box-shadow:none;
  text-align:center; padding:2rem 1rem;
}
@media (min-width:768px) {
  .gs-sec-dark .gs-stat-card + .gs-stat-card { border-left:1px solid rgba(255,255,255,.1); }
}
@media (max-width:767.98px) {
  .gs-sec-dark .gs-stat-card { border-bottom:1px solid rgba(255,255,255,.08); }
  .gs-sec-dark .gs-stat-card:nth-child(odd) { border-right:1px solid rgba(255,255,255,.08); }
  .gs-sec-dark .gs-stat-card:nth-last-child(-n+2) { border-bottom:none; }
}
.gs-sec-dark .gs-stat-num {
  display:block; font-family:var(--gs-fd);
  font-size:clamp(2.5rem, 5vw, 3.75rem);
  font-weight:800; letter-spacing:-.04em; line-height:1; margin:0 0 .625rem;
}
.gs-sec-dark .gs-stat-lbl {
  font-size:.875rem; color:rgba(255,255,255,.55); font-weight:500; line-height:1.4; margin:0;
}

/* Dynamic logo images in footer (white) + dashboard sidebar (color) */
.gs-footer-logo-img { width: auto; max-width: 200px; display: block; }
.gs-nav-logo-img    { max-height: 30px; width: auto; max-width: 80px; display: block; }

/* ============================================================
 * HOMEPAGE TOOL CARD (S07 Featured / S08 Trending) — extracted verbatim
 * from index.html inline <style> (gs-tool-card / gs-tc-* / gs-rating).
 * ============================================================ */
.gs-tool-card {
  position: relative;
  display: flex; flex-direction: column;
  background: var(--gs-surface-1); border: 1px solid var(--gs-border-default);
  border-radius: var(--gs-radius-2xl); padding: 1.5rem;
  box-shadow: var(--gs-shadow-sm);
  transition: transform .28s cubic-bezier(.4,0,.2,1), box-shadow .28s ease, border-color .28s ease;
  overflow: hidden;
}
/* premium top accent bar — fades in on hover */
.gs-tool-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--gs-cp,#5b21b6), #7c3aed 55%, #a78bfa);
  opacity: 0; transition: opacity .28s ease;
}
.gs-tool-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 48px -16px rgba(91,33,182,.32), 0 6px 16px rgba(2,6,23,.06);
  border-color: var(--gs-color-primary-border);
}
.gs-tool-card:hover::before { opacity: 1; }
.gs-tc-head { display: flex; align-items: flex-start; gap: .875rem; margin-bottom: 1rem; }
.gs-tc-logo {
  width: 54px; height: 54px; border-radius: 15px;
  background: linear-gradient(135deg, var(--gs-cp-s,#f5f3ff), #ffffff 70%);
  border: 1px solid var(--gs-border-default);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 1px 3px rgba(2,6,23,.06);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.55rem; color: var(--gs-cp,#5b21b6); flex-shrink: 0; overflow: hidden;
  transition: transform .28s cubic-bezier(.4,0,.2,1);
}
.gs-tool-card:hover .gs-tc-logo { transform: scale(1.07) rotate(-3deg); }
.gs-tc-logo img { width: 100%; height: 100%; object-fit: contain; }
.gs-tc-meta { flex: 1; min-width: 0; }
.gs-tc-name {
  font-family: var(--gs-font-display); font-size: 1rem; font-weight: 700;
  color: var(--gs-text-primary); line-height: 1.2; margin: 0 0 .25rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gs-tc-cat {
  font-size: .6875rem; color: var(--gs-text-tertiary); font-weight: 500;
  text-transform: uppercase; letter-spacing: .04em;
}
.gs-tc-desc {
  font-size: .875rem; color: var(--gs-text-secondary);
  line-height: 1.55; flex: 1; margin-bottom: .875rem;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.gs-tc-meta-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: .5rem; margin-bottom: .875rem;
}
.gs-rating { display: flex; align-items: center; gap: .25rem; flex-shrink: 0; }
.gs-rating i { color: var(--gs-orange-500); font-size: .75rem; }
.gs-rating-num { font-size: .8125rem; font-weight: 600; color: var(--gs-text-primary); }
.gs-rating-ct  { font-size: .75rem;   color: var(--gs-text-tertiary); }
.gs-tc-price   { font-size: .8125rem; color: var(--gs-text-primary); font-weight: 700; text-align: right; }
.gs-tc-footer  { display: flex; gap: .5rem; align-items: center; margin-top: auto; padding-top: .25rem; }
.gs-tc-footer .gs-btn-primary {
  flex: 1; font-size: .8125rem; font-weight: 600; border: 0;
  background: linear-gradient(135deg, var(--gs-cp,#5b21b6), #7c3aed);
  box-shadow: 0 4px 12px -2px rgba(91,33,182,.45);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.gs-tc-footer .gs-btn-primary:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 8px 20px -4px rgba(91,33,182,.55); }
.gs-tc-footer .gs-btn-subtle  { width: 38px; height: 38px; padding: 0; flex-shrink: 0; border-radius: var(--gs-radius-md); transition: color .2s ease, border-color .2s ease, background .2s ease; }
.gs-tc-footer .gs-btn-subtle:hover { color: var(--gs-cp,#5b21b6); border-color: var(--gs-color-primary-border); background: var(--gs-cp-s,#f5f3ff); }

/* Homepage blog thumb — soft gradient + centered emoji (theme S14 look).
   Modifier so the shared 16:9 .gs-blog-thumb (blog index image cards) is untouched. */
.gs-blog-thumb-emoji {
  aspect-ratio: auto; height: 190px;
  display: flex; align-items: center; justify-content: center;
  font-size: 3rem; overflow: hidden;
}

/* S08 Trending — horizontal snap-scroll row (verbatim from index.html) */
.gs-scroll-outer { position: relative; overflow: hidden; }
.gs-scroll-outer::after {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0;
  width: 80px; pointer-events: none;
  background: linear-gradient(to right, transparent, var(--gs-bg-base));
}
.gs-scroll-row {
  display: flex; gap: 1rem;
  overflow-x: auto; scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;
  padding-bottom: .75rem;
}
.gs-scroll-row::-webkit-scrollbar { display: none; }
.gs-scroll-row .gs-tool-card { min-width: 280px; flex-shrink: 0; scroll-snap-align: start; }

/* Brand panel logo (left, dark gradient) — dynamic from admin (logo_white) */
.gs-brand-logo {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
  margin-bottom: 2rem;
}
.gs-brand-logo-img { height: 40px; width: auto; max-width: 220px; display: block; }
/* Mobile auth logo (on the light form card) — dynamic from admin (logo) */
.gs-mobile-logo-img { height: 34px; width: auto; max-width: 190px; display: block; }

/* Auth card footer ("Don't have an account? …") — shared across login/register/forgot */
.gs-auth-footer { text-align: center; font-size: .9375rem; color: var(--gs-tx2); margin-top: 1.5rem; }
.gs-auth-footer a { font-weight: 600; white-space: nowrap; }

/* Auth header icon badge (forgot/reset/verify) — branded, clearly visible */
.gs-auth-icon {
  width: 56px; height: 56px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.625rem; line-height: 1;
  border-radius: var(--gs-rlg, 14px);
  background: linear-gradient(135deg, var(--gs-cp, #5B21B6) 0%, #7C3AED 100%);
  color: #fff;
  box-shadow: 0 8px 20px -6px rgba(91, 33, 182, .45);
  margin-bottom: 1.25rem;
}
[data-theme="dark"] .gs-auth-icon {
  background: linear-gradient(135deg, #6D28D9 0%, #A78BFA 100%);
  box-shadow: 0 8px 20px -6px rgba(124, 58, 237, .5);
}

/* ── Checkbox tick — robust override (guarantees the check shows in light mode) ── */
.gs-check {
  -webkit-appearance: none; appearance: none;
  flex-shrink: 0; width: 1.15rem; height: 1.15rem; margin-top: .1rem;
  border: 1.5px solid var(--gs-bd2, #9ca3af);
  border-radius: var(--gs-rxs, 5px);
  background-color: var(--gs-sf0, #fff);
  background-repeat: no-repeat; background-position: center;
  background-size: .7rem .7rem;
  cursor: pointer; position: relative;
  transition: background-color .15s, border-color .15s;
}
.gs-check:checked {
  background-color: var(--gs-cp, #5B21B6);
  border-color: var(--gs-cp, #5B21B6);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M3 8.5l3.2 3.2L13 5'/%3E%3C/svg%3E");
}
.gs-check:focus-visible { outline: none; box-shadow: var(--gs-foc, 0 0 0 3px rgba(91,33,182,.3)); }

/* ── Searchable country autocomplete (register) ── */
.gs-autocomplete { position: relative; }
.gs-ac-list {
  list-style: none; margin: .25rem 0 0; padding: .25rem;
  position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 50;
  background: var(--gs-sf0, #fff);
  border: 1px solid var(--gs-bd1, #e5e7eb);
  border-radius: var(--gs-rmd, 10px);
  box-shadow: 0 12px 28px -8px rgba(17,24,39,.25);
  max-height: 16rem; overflow-y: auto;
}
.gs-ac-item {
  display: flex; align-items: center; gap: .625rem;
  padding: .5rem .625rem; border-radius: var(--gs-rsm, 7px);
  cursor: pointer; font-size: .9375rem; color: var(--gs-tx1, #374151);
}
.gs-ac-item:hover, .gs-ac-item.active { background: var(--gs-cp-s, #f5f3ff); color: var(--gs-tx0, #111827); }
.gs-ac-flag { width: 24px; height: 18px; border-radius: 3px; object-fit: cover; flex-shrink: 0; box-shadow: 0 0 0 1px rgba(0,0,0,.08); }
.gs-ac-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-ac-dial { color: var(--gs-tx2, #6b7280); font-size: .8125rem; flex-shrink: 0; }

/* ── Phone field with dial-code add-on ── */
.gs-phone-wrap { display: flex; align-items: stretch; gap: .5rem; }
.gs-phone-dial {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  min-width: 3.5rem; padding: 0 .75rem;
  border: 1px solid var(--gs-bd1, #e5e7eb); border-radius: var(--gs-rmd, 10px);
  background: var(--gs-bg2, #f3f4f6); color: var(--gs-tx1, #374151);
  font-weight: 600; font-size: .9375rem;
}
.gs-phone-input { flex: 1; min-width: 0; }

/* ── Honeypot — visually hidden but present in the DOM (off-screen, not display:none) ── */
.gs-hp {
  position: absolute !important; left: -9999px !important; top: auto;
  width: 1px; height: 1px; overflow: hidden;
  opacity: 0; pointer-events: none;
}

/* ============================================================
 * FOOTER — newsletter row + legal-links + payment row
 * (newsletter/legal-links CSS extracted verbatim from index.html
 * inline <style>; payment row is the new admin-managed component)
 * ============================================================ */
.gs-footer-nl-row {
  border-top: 1px solid rgba(255,255,255,.06);
  padding: 2rem 0;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 1.25rem;
}
.gs-footer-nl-txt {
  font-size: .9375rem; color: rgba(255,255,255,.65); max-width: 320px;
  line-height: 1.5;
}
.gs-footer-nl-txt strong { color: #fff; font-weight: 600; }
.gs-footer-nl-form {
  display: flex; gap: .5rem; flex-wrap: wrap; align-items: center;
}
.gs-footer-nl-input {
  height: 44px; min-width: 220px;
  background: rgba(255,255,255,.07); border: 1.5px solid rgba(255,255,255,.12);
  border-radius: var(--gs-radius-md, 10px); padding: 0 1rem;
  font-family: var(--gs-font-body, inherit); font-size: .875rem; color: #fff; outline: none;
  transition: border-color .15s, box-shadow .15s;
  -webkit-appearance: none; appearance: none;
}
.gs-footer-nl-input::placeholder { color: rgba(255,255,255,.35); }
.gs-footer-nl-input:focus {
  border-color: rgba(255,255,255,.38);
  box-shadow: 0 0 0 3px rgba(167,139,250,.28);
}
.gs-footer-legal-links {
  display: flex; align-items: center; flex-wrap: wrap; gap: 1.25rem;
}
.gs-footer-legal-links a {
  font-size: .75rem; color: #6B7280; text-decoration: none; transition: color .15s;
}
.gs-footer-legal-links a:hover { color: #9CA3AF; text-decoration: none; }

/* Payment methods row */
.gs-footer-pay-row {
  border-top: 1px solid rgba(255,255,255,.06);
  padding: 1.5rem 0;
  display: flex; align-items: center; flex-wrap: wrap; gap: .75rem;
}
.gs-footer-pay-label {
  font-size: .75rem; color: #6B7280; margin: 0 .25rem 0 0; white-space: nowrap;
}
.gs-footer-pay-icons { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; }
.gs-footer-pay-icon {
  height: 30px; width: 46px; padding: 3px 5px;
  background: #fff; border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 2px rgba(0,0,0,.18);
}
.gs-footer-pay-icon img { max-height: 100%; max-width: 100%; object-fit: contain; display: block; }
.gs-footer-pay-more {
  font-size: .8125rem; font-weight: 600; color: var(--gs-cp, #A78BFA);
  text-decoration: none; white-space: nowrap; margin-left: .25rem;
}
.gs-footer-pay-more:hover { text-decoration: underline; color: var(--gs-cp, #A78BFA); }

/* Footer currency switcher — mega-style grid on desktop, compact dropdown on mobile */
.gs-cur { position: relative; margin-left: auto; }
.gs-cur-btn {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .5rem .8rem; border-radius: 10px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12);
  color: #E5E7EB; font-size: .85rem; font-weight: 600; cursor: pointer; line-height: 1;
  transition: background .15s, border-color .15s;
}
.gs-cur-btn:hover { background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.22); }
.gs-cur-btn .bi-globe2 { color: var(--gs-cp, #A78BFA); }
.gs-cur-code { letter-spacing: .02em; }
.gs-cur-sym { color: #9CA3AF; }
.gs-cur-caret { font-size: .7rem; color: #9CA3AF; transition: transform .2s; }
.gs-cur.open .gs-cur-caret { transform: rotate(180deg); }
.gs-cur-panel {
  position: absolute; bottom: calc(100% + .6rem); right: 0; z-index: 80;
  width: 560px; max-width: calc(100vw - 2rem);
  background: #fff; color: #1e293b; border-radius: 16px;
  box-shadow: 0 20px 50px rgba(2,6,23,.35); border: 1px solid #e5e7eb;
  padding: 1rem; animation: gsCurIn .15s ease;
}
@keyframes gsCurIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.gs-cur-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; }
.gs-cur-title { font-weight: 800; font-size: .9rem; color: #0f172a; }
.gs-cur-search {
  flex: 0 0 220px; max-width: 55%; padding: .45rem .7rem; font-size: .85rem;
  border: 1px solid #e2e8f0; border-radius: 9px; outline: none; color: #1e293b; background: #fff;
}
.gs-cur-search:focus { border-color: var(--gs-cp, #7c3aed); box-shadow: 0 0 0 3px rgba(124,58,237,.12); }
.gs-cur-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(98px, 1fr));
  gap: .4rem; max-height: 320px; overflow-y: auto; padding-right: .2rem;
}
.gs-cur-opt {
  display: flex; align-items: center; justify-content: space-between; gap: .35rem;
  padding: .5rem .6rem; border-radius: 9px; text-decoration: none;
  color: #334155; font-size: .82rem; border: 1px solid transparent; background: #f8fafc;
  transition: background .12s, border-color .12s, color .12s;
}
.gs-cur-opt:hover { background: var(--gs-cp-s, #f5f3ff); border-color: var(--gs-cp, #c4b5fd); color: #0f172a; }
.gs-cur-opt.is-active { background: var(--gs-cp, #7c3aed); color: #fff; border-color: var(--gs-cp, #7c3aed); }
.gs-cur-opt.is-active .gs-cur-opt-sym { color: rgba(255,255,255,.82); }
.gs-cur-opt-code { font-weight: 700; letter-spacing: .02em; }
.gs-cur-opt-sym { color: #94a3b8; font-weight: 600; }
.gs-cur-auto { grid-column: 1 / -1; justify-content: flex-start; gap: .45rem; font-weight: 600; background: #eef2ff; color: #4338ca; }
.gs-cur-auto:hover { background: #e0e7ff; border-color: #818cf8; color: #3730a3; }
.gs-cur-auto .bi { color: #6366f1; }
.gs-cur-empty { grid-column: 1 / -1; text-align: center; color: #94a3b8; font-size: .85rem; padding: 1rem; }
@media (max-width: 575.98px) {
  .gs-cur { margin-left: 0; width: 100%; margin-top: .5rem; }
  .gs-cur-btn { width: 100%; justify-content: center; }
  .gs-cur-panel { width: calc(100vw - 2rem); right: auto; left: 0; padding: .85rem; }
  .gs-cur-head { flex-direction: column; align-items: stretch; }
  .gs-cur-search { flex: 1 1 auto; max-width: none; }
  .gs-cur-grid { grid-template-columns: repeat(2, 1fr); max-height: 52vh; }
}
@media (max-width: 767.98px) {
  .gs-footer-nl-row { flex-direction: column; align-items: flex-start; }
  .gs-footer-nl-form { width: 100%; }
  .gs-footer-nl-input { flex: 1; min-width: 0; }
}

/* Payment methods page — grid of accepted methods */
.gs-pm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1rem; }
.gs-pm-card {
  display: flex; align-items: center; gap: .875rem;
  padding: 1rem; border: 1px solid var(--gs-bd0, #e5e7eb); border-radius: var(--gs-rlg, 14px);
  background: var(--gs-sf0, #fff);
}
.gs-pm-logo {
  height: 40px; width: 60px; flex-shrink: 0; padding: 4px 6px;
  background: #fff; border: 1px solid var(--gs-bd0, #eee); border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
}
.gs-pm-logo img { max-height: 100%; max-width: 100%; object-fit: contain; }
.gs-pm-name { font-weight: 600; font-size: .9375rem; color: var(--gs-tx0, #111827); }
.gs-pm-note { font-size: .8125rem; color: var(--gs-tx2, #6b7280); margin-top: .125rem; }
.gs-pm-section { margin-bottom: 2.25rem; }
.gs-pm-section:last-of-type { margin-bottom: 0; }
.gs-pm-section-title {
  font-family: var(--gs-fd, inherit); font-size: 1.0625rem; font-weight: 700;
  color: var(--gs-tx0, #111827); letter-spacing: -.02em;
  display: flex; align-items: center; gap: .5rem;
  margin: 0 0 1rem; padding-bottom: .625rem;
  border-bottom: 1px solid var(--gs-bd0, #e5e7eb);
}
.gs-pm-flag { font-size: 1.2rem; line-height: 1; }

/* ============================================================
 * SEARCH RESULTS PAGE — extracted verbatim from html_themes/search.html
 * inline <style> (page-specific gs-srch-* components). gs-page-btn already
 * lives in goji-framework.css.
 * ============================================================ */
.gs-srch-hero {
  background: linear-gradient(155deg, var(--gs-purple-50) 0%, var(--gs-bg0) 60%);
  border-bottom: 1px solid var(--gs-bd0);
  padding: 2.5rem 0 2rem;
  position: relative;
  overflow: hidden;
}
[data-theme="dark"] .gs-srch-hero {
  background: linear-gradient(155deg, #1a0b3d 0%, #0C0E14 45%, #071407 100%);
}
.gs-srch-blob {
  position: absolute; border-radius: 50%;
  filter: blur(80px); pointer-events: none;
}
.gs-srch-blob-1 { width:400px;height:400px;top:-160px;right:-80px;background:var(--gs-purple-300);opacity:.06; }
.gs-srch-blob-2 { width:280px;height:280px;bottom:-100px;left:-60px;background:var(--gs-green-400);opacity:.05; }
[data-theme="dark"] .gs-srch-blob { opacity:.14; }

.gs-srch-bar { position:relative; max-width:48rem; }
.gs-srch-bar-icon {
  position:absolute; left:1.125rem; top:50%; transform:translateY(-50%);
  color:var(--gs-tx2); font-size:1.125rem; pointer-events:none; z-index:1;
}
.gs-srch-input {
  width:100%; height:56px; padding:0 5rem 0 3.25rem;
  border:1.5px solid var(--gs-bd1); border-radius:var(--gs-rf);
  background:var(--gs-sf0); font-family:var(--gs-fb); font-size:1.0625rem;
  color:var(--gs-tx0); outline:none; box-shadow:var(--gs-shsm);
  transition:border-color .15s,box-shadow .15s;
}
.gs-srch-input:focus { border-color:var(--gs-cp); box-shadow:var(--gs-foc); }
.gs-srch-input::placeholder { color:var(--gs-tx2); }
.gs-srch-submit {
  position:absolute; right:.375rem; top:.375rem;
  height:calc(100% - .75rem); padding:0 1.25rem;
  background:var(--gs-cp); color:#fff; border:none;
  border-radius:var(--gs-rf); font-family:var(--gs-fd);
  font-size:.9375rem; font-weight:600; cursor:pointer;
  transition:background .15s; white-space:nowrap;
}
.gs-srch-submit:hover { background:var(--gs-cp-h); }
.gs-srch-submit:focus-visible { outline:none; box-shadow:var(--gs-foc); }

.gs-srch-layout {
  display:grid; grid-template-columns:260px 1fr;
  gap:2rem; align-items:start; padding:2rem 0 4rem;
}
@media(max-width:991.98px) { .gs-srch-layout { grid-template-columns:1fr; } }

.gs-srch-sidebar {
  background:var(--gs-sf0); border:1px solid var(--gs-bd0);
  border-radius:var(--gs-rlg); padding:1.25rem;
  position:sticky; top:calc(var(--gs-nh) + 1rem);
}
@media(max-width:991.98px) { .gs-srch-sidebar { display:none; } }
.gs-srch-sidebar.is-open { display:block; }
.gs-srch-sidebar-hd {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:1.25rem; padding-bottom:.875rem;
  border-bottom:1px solid var(--gs-bd0);
}
.gs-srch-sidebar-title { font-size:.9375rem; font-weight:700; color:var(--gs-tx0); }
.gs-srch-filter-group {
  margin-bottom:1.25rem; padding-bottom:1.25rem;
  border-bottom:1px solid var(--gs-bd0);
}
.gs-srch-filter-group:last-of-type { border-bottom:none; margin-bottom:0; padding-bottom:0; }
.gs-srch-filter-lbl {
  font-size:.75rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.07em; color:var(--gs-tx2); margin-bottom:.75rem; display:block;
}
.gs-srch-check {
  display:flex; align-items:center; gap:.625rem;
  padding:.3125rem 0; cursor:pointer; font-size:.875rem; color:var(--gs-tx1);
}
.gs-srch-check input[type="checkbox"],
.gs-srch-check input[type="radio"] {
  width:1rem; height:1rem; border-radius:.25rem;
  accent-color:var(--gs-cp); cursor:pointer; flex-shrink:0;
}
.gs-srch-check:hover { color:var(--gs-tx0); }
.gs-srch-check-count { margin-left:auto; font-size:.75rem; color:var(--gs-tx2); }

.gs-srch-hdr {
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap; margin-bottom:1.25rem;
}
.gs-srch-count { font-size:.9375rem; color:var(--gs-tx1); font-weight:500; }
.gs-srch-count strong { color:var(--gs-tx0); font-weight:700; }

.gs-srch-sort { display:flex; align-items:center; gap:.625rem; }
.gs-srch-sort select {
  height:36px; padding:0 2rem 0 .75rem;
  border:1.5px solid var(--gs-bd1); border-radius:var(--gs-rmd);
  background:var(--gs-sf0); font-family:var(--gs-fb);
  font-size:.875rem; color:var(--gs-tx0); outline:none; cursor:pointer;
  -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 16 10'%3E%3Cpath fill='none' stroke='%236B7280' stroke-width='1.5' d='M2 2l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .625rem center;
  transition:border-color .15s;
}
.gs-srch-sort select:focus { border-color:var(--gs-cp); box-shadow:var(--gs-foc); }

.gs-srch-filter-toggle { display:none; }
@media(max-width:991.98px) { .gs-srch-filter-toggle { display:flex; } }

.gs-srch-tabs {
  display:flex; border-bottom:1px solid var(--gs-bd0);
  margin-bottom:1.5rem; overflow-x:auto; scrollbar-width:none; gap:0;
}
.gs-srch-tabs::-webkit-scrollbar { display:none; }
.gs-srch-tab {
  display:inline-flex; align-items:center; gap:.375rem;
  padding:.625rem 1rem; font-size:.875rem; font-weight:500; color:var(--gs-tx2);
  border-bottom:2px solid transparent; white-space:nowrap; cursor:pointer;
  background:none; border-top:none; border-left:none; border-right:none;
  text-decoration:none; transition:color .15s,border-color .15s;
  margin-bottom:-1px; flex-shrink:0;
}
.gs-srch-tab:hover { color:var(--gs-tx0); text-decoration:none; }
.gs-srch-tab.active { color:var(--gs-cp); border-bottom-color:var(--gs-cp); font-weight:600; }
.gs-srch-tab-badge {
  background:var(--gs-bg2); color:var(--gs-tx2);
  font-size:.6875rem; font-weight:700; padding:.125rem .4rem; border-radius:var(--gs-rf);
}
.gs-srch-tab.active .gs-srch-tab-badge { background:var(--gs-cp-s); color:var(--gs-cp); }

.gs-srch-chips { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:.75rem; min-height:0; }
.gs-srch-chip {
  display:inline-flex; align-items:center; gap:.375rem;
  padding:.3125rem .75rem; background:var(--gs-cp-m); color:var(--gs-cp-t);
  font-size:.8125rem; font-weight:600; border-radius:var(--gs-rf);
  border:none; cursor:pointer; font-family:var(--gs-fd); transition:background .12s;
  text-decoration:none;
}
.gs-srch-chip:hover { background:var(--gs-cp-b); color:var(--gs-cp-t); text-decoration:none; }
.gs-srch-chip:focus-visible { outline:none; box-shadow:var(--gs-foc); }

.gs-srch-cat-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr));
  gap:.875rem; margin-bottom:2rem;
}
.gs-srch-cat-card {
  display:flex; align-items:center; gap:.75rem; padding:.875rem 1rem;
  background:var(--gs-sf0); border:1px solid var(--gs-bd0);
  border-radius:var(--gs-rlg); text-decoration:none; color:inherit;
  transition:border-color .15s,box-shadow .15s,transform .2s;
}
.gs-srch-cat-card:hover {
  border-color:var(--gs-cp-b); box-shadow:var(--gs-shsm);
  text-decoration:none; color:inherit; transform:translateY(-1px);
}
.gs-srch-cat-ico {
  width:40px; height:40px; border-radius:var(--gs-rmd);
  background:var(--gs-cp-s); display:flex; align-items:center;
  justify-content:center; font-size:1.25rem; flex-shrink:0;
}
.gs-srch-cat-name { font-size:.9375rem; font-weight:600; color:var(--gs-tx0); }
.gs-srch-cat-count { font-size:.8125rem; color:var(--gs-tx2); }

.gs-srch-tools-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));
  gap:1.25rem; margin-bottom:2rem;
}

.gs-srch-tool-card {
  background:var(--gs-sf0); border:1px solid var(--gs-bd0);
  border-radius:var(--gs-rlg); padding:1.25rem;
  display:flex; flex-direction:column; gap:.875rem;
  transition:box-shadow .2s,border-color .2s,transform .2s;
}
.gs-srch-tool-card:hover {
  box-shadow:var(--gs-shlg); border-color:var(--gs-cp-b); transform:translateY(-2px);
}
.gs-srch-tool-hd { display:flex; align-items:flex-start; gap:.875rem; }
.gs-srch-tool-logo {
  width:48px; height:48px; border-radius:var(--gs-rmd);
  background:var(--gs-bg2); border:1px solid var(--gs-bd0);
  display:flex; align-items:center; justify-content:center;
  font-size:1.75rem; flex-shrink:0; overflow:hidden;
}
.gs-srch-tool-logo img { width:100%; height:100%; object-fit:contain; }
.gs-srch-tool-name { font-family:var(--gs-fd); font-size:1rem; font-weight:700; color:var(--gs-tx0); margin-bottom:.25rem; line-height:1.25; }
.gs-srch-tool-meta { display:flex; align-items:center; gap:.375rem; flex-wrap:wrap; }
.gs-srch-tool-cat { font-size:.75rem; font-weight:600; color:var(--gs-cp-t); background:var(--gs-cp-s); padding:.125rem .5rem; border-radius:var(--gs-rf); }
.gs-srch-tool-desc { font-size:.875rem; color:var(--gs-tx2); line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; flex-grow:1; }
.gs-srch-tool-rating { display:flex; align-items:center; gap:.375rem; font-size:.875rem; }
.gs-srch-tool-stars { color:var(--gs-orange-500); font-size:.75rem; letter-spacing:1px; }
.gs-srch-tool-score { font-weight:700; color:var(--gs-tx0); }
.gs-srch-tool-reviews { color:var(--gs-tx2); font-size:.8125rem; }
.gs-srch-tool-price { font-size:.8125rem; color:var(--gs-tx2); }
.gs-srch-tool-price .free { color:var(--gs-cs); font-weight:600; }
.gs-srch-tool-actions { display:flex; gap:.5rem; margin-top:auto; }
.gs-srch-tool-actions .gs-btn { flex:1; font-size:.8125rem; height:36px; padding:0 .875rem; }

.gs-srch-blog-list { display:flex; flex-direction:column; gap:.875rem; margin-bottom:2rem; }
.gs-srch-blog-row {
  display:flex; align-items:flex-start; gap:1rem; padding:1rem;
  background:var(--gs-sf0); border:1px solid var(--gs-bd0);
  border-radius:var(--gs-rlg); text-decoration:none; color:inherit;
  transition:border-color .15s,box-shadow .15s;
}
.gs-srch-blog-row:hover { border-color:var(--gs-cp-b); box-shadow:var(--gs-shsm); text-decoration:none; color:inherit; }
.gs-srch-blog-thumb { width:80px; height:56px; border-radius:var(--gs-rmd); background:linear-gradient(135deg,var(--gs-purple-700),var(--gs-purple-900)); flex-shrink:0; background-size:cover; background-position:center; }
.gs-srch-blog-title { font-size:.9375rem; font-weight:600; color:var(--gs-tx0); line-height:1.4; margin-bottom:.375rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.gs-srch-blog-meta { font-size:.8125rem; color:var(--gs-tx2); }

.gs-srch-empty { text-align:center; padding:4rem 2rem; }
.gs-srch-empty-icon { font-size:3rem; margin-bottom:1rem; display:block; color:var(--gs-tx2); }
.gs-srch-empty-title { font-size:1.25rem; font-weight:700; color:var(--gs-tx0); margin-bottom:.625rem; }
.gs-srch-empty-desc { font-size:.9375rem; color:var(--gs-tx2); margin-bottom:1.5rem; line-height:1.65; max-width:32rem; margin-left:auto; margin-right:auto; }
.gs-srch-empty-suggestions { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin-bottom:1.5rem; }
.gs-srch-suggestion { display:inline-flex; align-items:center; gap:.375rem; padding:.4375rem 1rem; background:var(--gs-bg2); color:var(--gs-tx1); border-radius:var(--gs-rf); font-size:.875rem; font-weight:500; text-decoration:none; transition:background .12s,color .12s; }
.gs-srch-suggestion:hover { background:var(--gs-cp-s); color:var(--gs-cp-t); text-decoration:none; }

.gs-srch-reg-banner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.75rem; background:var(--gs-cp-s); border:1px solid var(--gs-cp-b); border-radius:var(--gs-rlg); padding:.875rem 1.125rem; margin-bottom:1.5rem; }
.gs-srch-reg-text { font-size:.875rem; color:var(--gs-cp-t); font-weight:500; }

.gs-srch-results-h { font-family:var(--gs-fd); font-size:1rem; font-weight:700; color:var(--gs-tx0); margin-bottom:1rem; }

.gs-srch-pagination { display:flex; align-items:center; justify-content:center; gap:.375rem; flex-wrap:wrap; margin-top:1rem; }

@media(max-width:575.98px) {
  .gs-srch-hero { padding:1.75rem 0 1.5rem; }
  .gs-srch-input { height:50px; font-size:1rem; padding:0 4.5rem 0 3rem; }
}

/* ── Mobile / small-screen auth: fit the whole card in one screen, no scroll ──
   Applies < 768px (brand panel hidden, form is full-width). Compacts vertical
   rhythm, centers the logo, and keeps the footer on a single line. */
@media (max-width: 767.98px) {
  .gs-auth-form-side { padding: 1.25rem 1.25rem; min-height: 100dvh; }

  .gs-mobile-logo    { display: flex; justify-content: center; margin-bottom: 1rem; }

  .gs-auth-title     { font-size: 1.5rem; margin-bottom: .25rem; }
  .gs-auth-sub       { margin-bottom: 1rem; }

  .gs-oauth-btn      { height: 44px; }
  .gs-auth-divider   { margin-block: .85rem; }

  .gs-field          { margin-bottom: .8rem; }
  .gs-input          { height: 44px; }

  /* slightly smaller CTA so the card clears the fold on short phones */
  .gs-auth-card .gs-btn-lg { height: 48px; font-size: .9375rem; }

  .gs-auth-footer    { font-size: .8125rem; margin-top: 1rem; }
}

/* Tablet range (576–767px): keep a real card but with tighter padding */
@media (min-width: 576px) and (max-width: 767.98px) {
  .gs-auth-card { padding: 1.75rem; }
}

/* Extra-short viewports (small phones / landscape) — squeeze a touch more */
@media (max-width: 767.98px) and (max-height: 720px) {
  .gs-auth-form-side { padding: .875rem 1.25rem; align-items: flex-start; }
  .gs-auth-sub       { margin-bottom: .75rem; }
  .gs-field          { margin-bottom: .625rem; }
  .gs-auth-divider   { margin-block: .625rem; }
}

/* Auth blob decorations */
.gs-brand-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(72px);
  opacity: .18;
  pointer-events: none;
}
.gs-brand-blob-1 { width: 360px; height: 360px; top: -120px;  right: -60px; background: #C4B5FD; }
.gs-brand-blob-2 { width: 280px; height: 280px; bottom: -80px; left: -50px; background: #4ADE80; }
.gs-brand-blob-3 { width: 200px; height: 200px; top: 40%;     left: 30%;   background: #93C5FD; opacity: .10; }

/* Floating theme toggle on auth pages — icon tinted to match the brand logo */
.gs-theme-btn {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 600;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gs-sf0);
  border: 1px solid var(--gs-bd1);
  border-radius: var(--gs-rmd);
  color: var(--gs-cp);            /* brand purple — matches the logo */
  font-size: 1.0625rem;
  cursor: pointer;
  box-shadow: var(--gs-sh-sm, 0 1px 3px rgba(17,24,39,.08));
  transition: background .15s, color .15s, border-color .15s;
}
.gs-theme-btn:hover {
  background: var(--gs-cp-m, rgba(91,33,182,.08));
  color: var(--gs-cp);
  border-color: var(--gs-cp);
}
.gs-theme-btn:focus-visible { outline: none; box-shadow: var(--gs-foc); }
[data-theme="dark"] .gs-theme-btn { color: #A78BFA; }          /* lighter purple on dark */
[data-theme="dark"] .gs-theme-btn:hover { color: #C4B5FD; border-color: #A78BFA; }

/* Dark-mode brand panel — match the site's dark hero gradient (was unchanged) */
[data-theme="dark"] .gs-auth-brand {
  background:
    radial-gradient(120% 90% at 85% 0%, rgba(124, 58, 237, .35) 0%, transparent 55%),
    radial-gradient(100% 80% at 0% 100%, rgba(61, 139, 55, .22) 0%, transparent 50%),
    linear-gradient(155deg, #1a0b3d 0%, #0C0E14 55%, #071407 100%);
}
[data-theme="dark"] .gs-brand-blob { opacity: .12; }

/* OAuth icon sizing */
.gs-oauth-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}


/* ============================================================
 * § 21 · SEARCH OVERLAY
 * Full-screen combobox overlay triggered by goji-main.js.
 * Present on all public pages via required HTML fragment.
 *
 * JS binds to:
 *   #gs-search-overlay  role="dialog"
 *   #gs-search-input    role="combobox"  aria-expanded
 *   #gs-search-results  role="listbox"
 * ============================================================ */

.gs-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 800;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: clamp(4rem, 12vh, 8rem);
  padding-inline: 1rem;
}
.gs-search-overlay[hidden] { display: none; }

.gs-search-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: none;
  cursor: default;
  z-index: 0;
}

.gs-search-wrap {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 42rem;
}

/* Search input row */
.gs-search {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--gs-sf0);
  border: 1.5px solid var(--gs-bd0);
  border-radius: var(--gs-rlg);
  box-shadow: var(--gs-shxl);
  overflow: hidden;
}
.gs-search-icon {
  position: absolute;
  left: 1.125rem;
  color: var(--gs-tx2);
  font-size: 1.125rem;
  pointer-events: none;
  flex-shrink: 0;
  z-index: 1;
}
#gs-search-input {
  flex: 1;
  height: 58px;
  padding: 0 6rem 0 3.25rem;
  background: transparent;
  border: none;
  font-family: var(--gs-fb);
  font-size: 1.0625rem;
  color: var(--gs-tx0);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
#gs-search-input::placeholder { color: var(--gs-tx2); }
.gs-search-clear {
  position: absolute;
  right: 4rem;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--gs-tx2);
  cursor: pointer;
  font-size: 1rem;
  padding: 0;
  border-radius: var(--gs-rmd);
  transition: color .15s, background .15s;
}
.gs-search-clear:hover { color: var(--gs-tx0); background: var(--gs-bg2); }
.gs-search-esc {
  position: absolute;
  right: .875rem;
  font-family: var(--gs-fb);
  font-size: .6875rem;
  font-weight: 600;
  color: var(--gs-tx2);
  background: var(--gs-bg2);
  border: 1px solid var(--gs-bd1);
  border-radius: var(--gs-rsm);
  padding: .1875rem .4375rem;
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
}

/* Results dropdown */
#gs-search-results {
  margin-top: .5rem;
  background: var(--gs-sf0);
  border: 1px solid var(--gs-bd0);
  border-radius: var(--gs-rlg);
  box-shadow: var(--gs-shxl);
  max-height: min(60vh, 480px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--gs-bd0) transparent;
}
#gs-search-results[hidden] { display: none; }


/* ============================================================
 * § 22 · PAGINATION
 * Shared page button used on blog, category, search, deals.
 * ============================================================ */

.gs-page-btn {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--gs-bd1);
  border-radius: var(--gs-rmd);
  background: var(--gs-sf0);
  font-family: var(--gs-fd);
  font-size: .875rem;
  font-weight: 500;
  color: var(--gs-tx1);
  cursor: pointer;
  text-decoration: none;
  transition: background .12s, border-color .12s, color .12s;
  flex-shrink: 0;
}
.gs-page-btn:hover { background: var(--gs-bg2); border-color: var(--gs-bd2); color: var(--gs-tx0); text-decoration: none; }
.gs-page-btn.active { background: var(--gs-cp); border-color: var(--gs-cp); color: #fff; font-weight: 700; }
.gs-page-btn:focus-visible { outline: none; box-shadow: var(--gs-foc); }
.gs-page-ellipsis {
  font-size: .875rem;
  color: var(--gs-tx2);
  padding: 0 .25rem;
  user-select: none;
}


/* ============================================================
 * § 23 · VIEW TOGGLE
 * Grid / list view toggle on blog and category pages.
 * ============================================================ */

.gs-view-toggle {
  display: flex;
  gap: 2px;
  background: var(--gs-sf2);
  border: 1px solid var(--gs-bd0);
  border-radius: var(--gs-rmd);
  padding: 2px;
}
.gs-vt-btn {
  width: 32px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: var(--gs-rsm);
  background: none;
  color: var(--gs-tx2);
  cursor: pointer;
  font-size: .9375rem;
  transition: background .15s, color .15s;
}
.gs-vt-btn.active { background: var(--gs-sf0); color: var(--gs-cp); box-shadow: var(--gs-shsm); }
.gs-vt-btn:focus-visible { outline: none; box-shadow: var(--gs-foc); }


/* ============================================================
 * § 24 · DARK SECTION
 * Full-bleed #0a0d18 stats section used on about and pricing.
 * ============================================================ */

.gs-dark-sec {
  background: #0a0d18;
  position: relative;
  overflow: hidden;
  padding: 5rem 0;
}
.gs-dark-sec-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.gs-dark-sec-overlay::before {
  content: '';
  position: absolute;
  top: -100px; left: -80px;
  width: 500px; height: 500px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(91,33,182,.20) 0%, transparent 70%);
}
.gs-dark-sec-overlay::after {
  content: '';
  position: absolute;
  bottom: -80px; right: -60px;
  width: 380px; height: 380px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(61,139,55,.14) 0%, transparent 70%);
}
.gs-dark-stat {
  text-align: center;
  padding: 2rem 1rem;
}
.gs-dark-stat-num {
  display: block;
  font-family: var(--gs-fd);
  font-size: clamp(2.25rem, 5vw, 3.5rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1;
  margin-bottom: .5rem;
}
.gs-dark-stat-lbl {
  font-size: .875rem;
  color: rgba(255, 255, 255, .5);
  font-weight: 500;
}
/* Column separator on md+ */
@media (min-width: 768px) {
  .gs-dark-stat + .gs-dark-stat { border-left: 1px solid rgba(255, 255, 255, .08); }
}
@media (max-width: 767.98px) {
  .gs-dark-stat { border-bottom: 1px solid rgba(255, 255, 255, .08); }
  .gs-dark-stat:nth-child(odd)  { border-right: 1px solid rgba(255, 255, 255, .08); }
  .gs-dark-stat:nth-last-child(-n+2) { border-bottom: none; }
}


/* ============================================================
 * § 25 · DARK MODE OVERRIDES
 * Component-specific overrides for [data-theme="dark"].
 * Only needed where components use hardcoded light values.
 * ============================================================ */

/* Badge variants */
[data-theme="dark"] .gs-badge-p  { background: rgba(167, 139, 250, .20); color: #C4B5FD; }
[data-theme="dark"] .gs-badge-g  { background: rgba(61, 139, 55, .20);  color: #4ADE80; }
[data-theme="dark"] .gs-badge-b  { background: rgba(29, 78, 216, .20);  color: #93C5FD; }
[data-theme="dark"] .gs-badge-r  { background: rgba(220, 38, 38, .18);  color: #F87171; }
[data-theme="dark"] .gs-badge-y  { background: rgba(234, 179, 8, .14);  color: #FCD34D; }
[data-theme="dark"] .gs-badge-nt { background: var(--gs-sf2);           color: var(--gs-tx1); }

[data-theme="dark"] .gs-badge-hot  { background: rgba(249, 115, 22, .18); color: #FB923C; }
[data-theme="dark"] .gs-badge-new  { background: rgba(29, 78, 216, .20);  color: #93C5FD; }
[data-theme="dark"] .gs-badge-warn { background: rgba(234, 179, 8, .14);  color: #FDE68A; }
[data-theme="dark"] .gs-badge-deal { background: rgba(74, 222, 128, .15); color: #4ADE80; }

/* Save pill (pricing toggle) */
[data-theme="dark"] .gs-save-pill {
  background: rgba(74, 222, 128, .15);
  color: #4ADE80;
}

/* OTP input filled state */
[data-theme="dark"] .gs-otp-input.filled {
  background: var(--gs-cp-m);
  border-color: var(--gs-cp);
}

/* Skeleton on dark */
[data-theme="dark"] .gs-skel {
  background: linear-gradient(90deg, var(--gs-sf2) 25%, var(--gs-sf3) 50%, var(--gs-sf2) 75%);
  background-size: 200% 100%;
}

/* Eyebrow on dark */
[data-theme="dark"] .gs-eyebrow {
  background: rgba(91, 33, 182, .20);
  border-color: rgba(196, 181, 253, .30);
}

/* Nav pill on dark */
[data-theme="dark"] .gs-nav-pill {
  background: rgba(167, 139, 250, .22);
  color: #C4B5FD;
}

/* Drawer shadow on dark */
[data-theme="dark"] .gs-drawer,
[data-theme="dark"] .gs-mob-drawer {
  box-shadow: 2px 0 24px rgba(0, 0, 0, .55);
}

/* Search overlay backdrop on dark */
[data-theme="dark"] .gs-search-backdrop {
  background: rgba(0, 0, 0, .75);
}

/* Pricing card popular pip on dark */
[data-theme="dark"] .gs-popular-pip {
  background: var(--gs-cp);
}

/* Footer stays always-dark — override if light theme somehow applies */
.gs-footer { background: #0a0d18; border-top: 1px solid rgba(255,255,255,.04); }
[data-theme="dark"] .gs-footer { background: #070a12; }


/* ============================================================
 * § 26 · RESPONSIVE HELPERS
 * ============================================================ */

/* Show burger / hamburger; hide desktop nav at < 992px */
@media (max-width: 991.98px) {
  .gs-hamburger,
  .gs-burger,
  .gs-mobile-menu-btn { display: flex; }

  .gs-nav-links  { display: none !important; }
  .gs-nav-search { display: none !important; }

  /* Auth pages: show mobile logo */
  .gs-mobile-logo { display: flex; }
}

/* Tighter nav padding on small phones */
@media (max-width: 575.98px) {
  .gs-nav-inner { padding: 0 1rem; }
  .gs-otp-group { gap: .5rem; }
  .gs-otp-input { width: 42px; height: 52px; font-size: 1.25rem; }
  .gs-sec       { padding: 3rem 0; }
  .gs-dark-sec  { padding: 3rem 0; }
  .gs-footer-bottom { flex-direction: column; align-items: flex-start; }
}


/* ============================================================
 * § 27 · REDUCED MOTION
 * Single kill-switch overrides all animations and transitions.
 * ============================================================ */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration:        .01ms !important;
    animation-iteration-count: 1    !important;
    transition-duration:       .01ms !important;
    scroll-behavior:           auto !important;
  }
}
/* ════════════════════════════════════════════════════════════════════
   GOJI PUBLIC COMPONENTS — added so view markup matches external CSS
   (hero, strip, category card, listing/blog page headers). Token names
   use literal fallbacks so they render even if a token is absent.
════════════════════════════════════════════════════════════════════ */
.gs-sec-title{font-family:var(--gs-font-display,'Plus Jakarta Sans',sans-serif);font-size:clamp(1.5rem,3vw,2rem);font-weight:800;letter-spacing:-.02em;color:var(--gs-text-primary,#111827);margin:0}
.disc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(17.5rem,1fr));gap:1.5rem}
@media(max-width:575.98px){.disc-grid{grid-template-columns:1fr}}

/* ── Hero (homepage) ── */
.gs-hero{position:relative;overflow:hidden;padding:3.5rem 0 2.5rem;background:linear-gradient(160deg,#F5F3FF 0%,#fff 45%,#F0FDF4 100%)}
[data-theme="dark"] .gs-hero{background:linear-gradient(160deg,#1a0b3d 0%,#0C0E14 45%,#071407 100%)}
.gs-hero-blobs{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.gs-blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.10}
.gs-blob-1{width:420px;height:420px;background:#5B21B6;top:-140px;right:-80px}
.gs-blob-2{width:340px;height:340px;background:#3D8B37;bottom:-120px;left:-90px}
.gs-blob-3{width:260px;height:260px;background:#1D4ED8;top:30%;left:30%}
:root{--cp:#5B21B6;--cs:#3D8B37;--or-500:#F97316}
[data-theme="dark"]{--cp:#A78BFA;--cs:#4ADE80;--or-500:#FB923C}
.gs-hero-visual{position:relative;display:none}
@media(min-width:992px){.gs-hero-visual{display:block}}
.gs-dash-card{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-border-default,#E5E7EB);border-radius:1rem;box-shadow:0 20px 25px rgba(91,33,182,.09),0 8px 10px rgba(91,33,182,.05);overflow:hidden}
.gs-dash-titlebar{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;border-bottom:1px solid var(--gs-border-subtle,#EAECF0);background:var(--gs-bg-subtle,#F9FAFB)}
.gs-dash-dots{display:flex;gap:.35rem}
.gs-dash-dot{width:10px;height:10px;border-radius:50%}
.gs-dash-dot-r{background:#ff5f57}.gs-dash-dot-y{background:#febc2e}.gs-dash-dot-g{background:#28c840}
.gs-dash-titlebar-text{font-size:.75rem;color:var(--gs-text-tertiary,#6B7280);font-weight:500}
.gs-dash-titlebar-badge{margin-left:auto;font-size:.6rem;font-weight:700;letter-spacing:.05em;color:#fff;background:#16A34A;padding:2px 7px;border-radius:9999px}
.gs-dash-body{padding:1rem}
.gs-dash-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:1rem}
.gs-dash-stat{text-align:center;background:var(--gs-bg-subtle,#F9FAFB);border:1px solid var(--gs-border-subtle,#EAECF0);border-radius:.6rem;padding:.6rem .25rem}
.gs-dash-stat-num{font-family:var(--gs-font-display,sans-serif);font-weight:800;font-size:1.25rem;line-height:1}
.gs-dash-stat-lbl{font-size:.625rem;color:var(--gs-text-tertiary,#6B7280);text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
.gs-dash-tool-row{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}
.gs-dash-tool-item{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem;border:1px solid var(--gs-border-subtle,#EAECF0);border-radius:.6rem}
.gs-dash-tool-logo{width:32px;height:32px;border-radius:8px;background:var(--gs-bg-muted,#F3F4F6);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;font-weight:700;color:var(--gs-cp,#5B21B6)}
.gs-dash-tool-name{font-size:.8125rem;font-weight:600;color:var(--gs-text-primary,#111827)}
.gs-dash-tool-cat{font-size:.6875rem;color:var(--gs-text-tertiary,#6B7280)}
.gs-dash-tool-rating{margin-left:auto;font-size:.75rem;font-weight:600;color:var(--gs-text-primary,#111827);white-space:nowrap}
.gs-dash-tool-rating i{color:#F97316;font-size:.7rem}
.gs-dash-cats{display:flex;flex-wrap:wrap;gap:.35rem}
.gs-dash-cat-chip{font-size:.6875rem;padding:.25rem .6rem;border-radius:9999px;background:var(--gs-bg-muted,#F3F4F6);color:var(--gs-text-secondary,#374151)}
.gs-dash-cat-chip.active{background:var(--gs-cp,#5B21B6);color:#fff}
.gs-float-badge{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:.4rem;background:var(--gs-surface-1,#fff);border:1px solid var(--gs-border-default,#E5E7EB);box-shadow:0 10px 15px rgba(0,0,0,.08);border-radius:9999px;padding:.45rem .85rem;font-size:.7rem;font-weight:600;color:var(--gs-text-primary,#111827)}
.gs-float-1{top:-14px;left:-14px}
.gs-float-2{bottom:-14px;right:-14px}
.gs-eyebrow-badge{display:inline-flex;align-items:center;gap:.4rem;font-size:.8125rem;font-weight:600;color:var(--gs-cp,#5B21B6);background:var(--gs-cp-s,#F5F3FF);border:1px solid var(--gs-cp-b,#DDD6FE);padding:.35rem .85rem;border-radius:9999px;margin-bottom:1rem}
.gs-h1{font-family:var(--gs-font-display,'Plus Jakarta Sans',sans-serif);font-size:clamp(2rem,5vw,3.25rem);font-weight:800;letter-spacing:-.03em;line-height:1.1;color:var(--gs-text-primary,#111827);margin:0 0 1rem}
.gs-h1-accent{color:var(--gs-cp,#5B21B6)}
.gs-h1-green{color:var(--gs-cs,#3D8B37)}
.gs-hero-lead{font-size:1.0625rem;line-height:1.6;color:var(--gs-text-secondary,#374151);max-width:36rem;margin:0 0 1.5rem}
.gs-hero-search-wrap{position:relative;max-width:36rem;margin-bottom:1.25rem}
.gs-hs-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--gs-text-tertiary,#6B7280);z-index:1}
.gs-hs-input{width:100%;height:56px;border:2px solid var(--gs-border-default,#E5E7EB);border-radius:9999px;padding:0 9rem 0 2.75rem;font-size:1rem;background:#fff;color:#111827;box-shadow:0 10px 15px rgba(91,33,182,.06);outline:none}
.gs-hs-input:focus{border-color:var(--gs-cp,#5B21B6);box-shadow:0 0 0 3px rgba(91,33,182,.25)}
.gs-hs-btn-wrap{position:absolute;right:6px;top:50%;transform:translateY(-50%)}
.gs-hero-cta-row{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1.25rem}
.gs-hero-hints{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.8125rem;color:var(--gs-text-tertiary,#6B7280)}
.gs-hints-lbl{font-weight:600}
.gs-hint-chip{display:inline-flex;align-items:center;gap:.25rem;background:#fff;border:1px solid var(--gs-border-default,#E5E7EB);border-radius:9999px;padding:.3rem .8rem;font-size:.75rem;font-weight:500;color:var(--gs-text-secondary,#374151);text-decoration:none}
.gs-hint-chip:hover{border-color:var(--gs-cp-b,#DDD6FE);color:var(--gs-cp,#5B21B6)}
.gs-trust-row{display:flex;flex-wrap:wrap;gap:1.25rem;margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--gs-border-subtle,#EAECF0)}
.gs-trust-item{display:flex;align-items:center;gap:.4rem;font-size:.8125rem;color:var(--gs-text-tertiary,#6B7280)}
.gs-trust-item i{color:var(--gs-cs,#3D8B37)}

/* ── Social-proof strip ── */
.gs-strip{background:#0a0d18;padding:1.75rem 0}
.gs-strip-item{text-align:center;padding:.5rem 0}
.gs-strip-val{display:block;font-family:var(--gs-font-display,sans-serif);font-size:1.75rem;font-weight:800;color:#fff;line-height:1}
.gs-strip-val em{font-style:normal}
.gs-strip-lbl{font-size:.8125rem;color:rgba(255,255,255,.55)}

/* ── Category card (home) ── */
.gs-cat-card{display:flex;flex-direction:column;background:var(--gs-surface-1,#fff);border:1px solid var(--gs-border-default,#E5E7EB);border-radius:1rem;padding:1.5rem;text-decoration:none;height:100%;transition:transform .2s,box-shadow .2s,border-color .2s}
.gs-cat-card:hover{
	transform:translateY(-3px);box-shadow:var(--gs-shadow-lg,0 10px 15px rgba(91,33,182,.08));border-color:var(--gs-cp-b,#DDD6FE);
	text-decoration:none;
}
.gs-cat-card .gs-cat-icon{width:48px;height:48px;border-radius:.6rem;display:flex;align-items:center;justify-content:center;font-size:1.4rem;background:var(--gs-cp-s,#F5F3FF);color:var(--gs-cp,#5B21B6);margin-bottom:1rem}
.gs-cat-name{font-family:var(--gs-font-display,sans-serif);font-weight:700;font-size:.9375rem;color:var(--gs-text-primary,#111827);margin-bottom:.375rem}
.gs-cat-count{margin-top:auto;font-size:.75rem;color:var(--gs-text-tertiary,#6B7280)}

/* ── Page headers: listings / search / category / blog ── */
.disc-hero,.gs-cat-hero,.gs-blog-hero,.gs-art-hero{padding:2rem 0 1.5rem;background:var(--gs-bg-subtle,#F9FAFB);border-bottom:1px solid var(--gs-border-subtle,#EAECF0)}
.disc-h1,.gs-cat-h1{font-family:var(--gs-font-display,sans-serif);font-size:clamp(1.5rem,3vw,2.25rem);font-weight:800;letter-spacing:-.025em;color:var(--gs-text-primary,#111827);margin:0 0 .5rem}
.disc-hero-lead,.gs-cat-lead{font-size:1rem;color:var(--gs-text-secondary,#374151);margin:0;max-width:42rem}
.gs-subcat-strip{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 0}
.gs-subcat-chip{display:inline-flex;background:#fff;border:1px solid var(--gs-border-default,#E5E7EB);border-radius:9999px;padding:.3rem .85rem;font-size:.8125rem;color:var(--gs-text-secondary,#374151);text-decoration:none}
.gs-subcat-chip:hover{border-color:var(--gs-cp-b,#DDD6FE);color:var(--gs-cp,#5B21B6)}
.gs-blog-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.gs-blog-tabs a,.gs-blog-tab{display:inline-flex;padding:.4rem .9rem;border-radius:9999px;border:1px solid var(--gs-border-default,#E5E7EB);background:#fff;font-size:.8125rem;color:var(--gs-text-secondary,#374151);text-decoration:none}
.gs-blog-tabs a.active,.gs-blog-tab.active{background:var(--gs-cp,#5B21B6);border-color:var(--gs-cp,#5B21B6);color:#fff}

/* ── Homepage Benefits (S09) + Testimonials (S11) — match index.html ── */
.gs-ben-card{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-border-default,#E5E7EB);border-radius:1rem;padding:1.75rem;height:100%;transition:box-shadow .2s,border-color .2s}
.gs-ben-card:hover{box-shadow:var(--gs-shadow-md,0 4px 6px rgba(91,33,182,.07));border-color:var(--gs-cp-b,#DDD6FE)}
.gs-ben-icon{width:52px;height:52px;border-radius:.75rem;display:flex;align-items:center;justify-content:center;font-size:1.375rem;margin-bottom:1.125rem}
.gs-ben-title{font-family:var(--gs-font-display,sans-serif);font-size:1.0625rem;font-weight:700;color:var(--gs-text-primary,#111827);margin-bottom:.625rem}
.gs-ben-desc{font-size:.9375rem;color:var(--gs-text-secondary,#374151);line-height:1.65}
.gs-stat-card{text-align:center;padding:2rem 1rem}
.gs-testi{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-border-default,#E5E7EB);border-radius:1rem;padding:1.75rem;display:flex;flex-direction:column;height:100%;transition:box-shadow .2s}
.gs-testi:hover{box-shadow:var(--gs-shadow-lg,0 10px 15px rgba(91,33,182,.08))}
.gs-testi-stars{display:flex;gap:.25rem;margin-bottom:1rem}
.gs-testi-stars i{color:#F97316;font-size:.875rem}
.gs-testi-quote{font-style:italic;font-size:.9375rem;color:var(--gs-text-secondary,#374151);line-height:1.65;flex:1;position:relative;padding-top:1.25rem;margin-bottom:1.25rem}
.gs-testi-quote::before{content:"\201C";position:absolute;top:-.5rem;left:0;font-family:var(--gs-font-display,serif);font-size:2.5rem;font-weight:800;font-style:normal;color:var(--gs-cp,#5B21B6);line-height:1;opacity:.35}
.gs-testi-author{display:flex;align-items:center;gap:.875rem;margin-top:auto}
.gs-testi-name{font-family:var(--gs-font-display,sans-serif);font-size:.875rem;font-weight:700;color:var(--gs-text-primary,#111827)}
.gs-testi-role{font-size:.75rem;color:var(--gs-text-tertiary,#6B7280)}

/* ── 404 page (from html_themes/404.html) ── */
.gs-404-wrap{min-height:calc(100vh - var(--gs-nh,64px) - 260px);display:flex;align-items:center;justify-content:center;padding:4rem 1.5rem}
.gs-404-inner{text-align:center;max-width:36rem}
.gs-404-code{font-family:var(--gs-fd,'Plus Jakarta Sans',sans-serif);font-size:clamp(5rem,20vw,8rem);font-weight:800;letter-spacing:-.04em;line-height:1;margin-bottom:.5rem;background:linear-gradient(135deg,var(--gs-purple-300,#C4B5FD),var(--gs-purple-600,#7C3AED));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.gs-404-icon{font-size:3rem;margin-bottom:1.25rem;display:block}
.gs-404-title{font-size:clamp(1.5rem,3vw,2rem);font-weight:800;color:var(--gs-tx0,#111827);margin-bottom:.875rem}
.gs-404-desc{font-size:1.0625rem;color:var(--gs-tx2,#6B7280);line-height:1.7;margin-bottom:2rem}
.gs-404-actions{display:flex;align-items:center;justify-content:center;gap:.75rem;flex-wrap:wrap;margin-bottom:2.5rem}
.gs-404-search{position:relative;max-width:28rem;margin:0 auto 2.5rem}
.gs-404-search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--gs-tx2,#6B7280);font-size:1.125rem;pointer-events:none}
.gs-404-search-input{width:100%;height:52px;padding:0 4.5rem 0 3rem;border:1.5px solid var(--gs-bd1,#E5E7EB);border-radius:var(--gs-rf,9999px);background:var(--gs-sf0,#fff);font-family:var(--gs-fb,'DM Sans',sans-serif);font-size:1rem;color:var(--gs-tx0,#111827);outline:none;transition:border-color .15s,box-shadow .15s}
.gs-404-search-input:focus{border-color:var(--gs-cp,#5B21B6);box-shadow:var(--gs-foc,0 0 0 3px rgba(91,33,182,.35))}
.gs-404-search-input::placeholder{color:var(--gs-tx2,#6B7280)}
.gs-404-search-btn{position:absolute;right:.375rem;top:.375rem;height:calc(100% - .75rem);padding:0 1.125rem;background:var(--gs-cp,#5B21B6);color:#fff;border:none;border-radius:var(--gs-rf,9999px);font-family:var(--gs-fd,sans-serif);font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s}
.gs-404-search-btn:hover{background:var(--gs-cp-h,#6D28D9)}
.gs-404-popular-title{font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gs-tx2,#6B7280);margin-bottom:1.25rem}
.gs-404-tools{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;text-align:left}
@media(min-width:480px){.gs-404-tools{grid-template-columns:repeat(4,1fr)}}
.gs-404-tool{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.875rem .5rem;background:var(--gs-sf1,#fff);border:1px solid var(--gs-bd0,#EAECF0);border-radius:var(--gs-rlg,.75rem);text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s;text-align:center}
.gs-404-tool:hover{border-color:var(--gs-cp-b,#DDD6FE);box-shadow:var(--gs-shsm,0 1px 3px rgba(91,33,182,.06));text-decoration:none;color:inherit}
.gs-404-tool-logo{width:40px;height:40px;border-radius:var(--gs-rmd,.5rem);background:var(--gs-bg2,#F3F4F6);display:flex;align-items:center;justify-content:center;font-size:1.5rem;overflow:hidden}
.gs-404-tool-name{font-size:.8125rem;font-weight:600;color:var(--gs-tx0,#111827)}
.gs-404-tool-cat{font-size:.75rem;color:var(--gs-tx2,#6B7280)}

/* ── About page (from html_themes/about.html) ── */
.gs-about-hero{
  position:relative;overflow:hidden;
  background:linear-gradient(155deg,#F5F3FF 0%,#FFFFFF 50%,#F0FDF4 100%);
  padding:5rem 0 4.5rem;
}
[data-theme="dark"] .gs-about-hero{
  background:linear-gradient(155deg,#1a0b3d 0%,#0C0E14 50%,#071407 100%);
}
.gs-about-hero-blobs{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.gs-about-blob{
  position:absolute;border-radius:50%;
  filter:blur(80px);opacity:.06;
}
[data-theme="dark"] .gs-about-blob{opacity:.15}
.gs-about-blob-1{width:600px;height:600px;background:#5B21B6;top:-220px;right:-100px}
.gs-about-blob-2{width:400px;height:400px;background:#3D8B37;bottom:-150px;left:-80px}
.gs-about-blob-3{width:300px;height:300px;background:#1D4ED8;top:40%;left:40%}

.gs-about-eyebrow{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.8125rem;font-weight:600;color:var(--gs-cp-t);
  background:var(--gs-cp-s);border:1px solid var(--gs-cp-b);
  border-radius:var(--gs-rf);padding:.375rem 1rem;margin-bottom:1.5rem;
}
[data-theme="dark"] .gs-about-eyebrow{
  background:rgba(91,33,182,.16);border-color:rgba(167,139,250,.32);
}
.gs-about-h1{
  font-size:clamp(2.25rem,5vw,3.75rem);font-weight:800;
  letter-spacing:-.04em;line-height:1.08;
  color:var(--gs-tx0);margin-bottom:1.375rem;
}
.gs-about-h1 .acc-p{color:var(--gs-cp)}
.gs-about-h1 .acc-g{color:var(--gs-cs)}
.gs-about-lead{
  font-size:1.125rem;color:var(--gs-tx1);line-height:1.7;
  max-width:600px;margin-bottom:2rem;
}
.gs-about-hero-stats{
  display:flex;flex-wrap:wrap;gap:2rem;margin-top:2.5rem;
  padding-top:2rem;border-top:1px solid var(--gs-bd0);
}
.gs-about-hero-stat-num{
  font-family:var(--gs-fd);font-size:1.875rem;font-weight:800;
  letter-spacing:-.035em;line-height:1;color:var(--gs-tx0);
}
.gs-about-hero-stat-num em{color:var(--gs-cp);font-style:normal}
.gs-about-hero-stat-lbl{
  font-size:.75rem;color:var(--gs-tx2);margin-top:.25rem;
}
/* About hero right: mission card */
.gs-about-mission-card{
  background:var(--gs-sf0);border:1px solid var(--gs-bd1);
  border-radius:var(--gs-rxl);padding:2rem;
  box-shadow:var(--gs-shxl);
}
.gs-mission-icon{
  width:52px;height:52px;border-radius:var(--gs-rlg);
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;margin-bottom:1.25rem;
}
.gs-mission-label{
  font-size:.625rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;color:var(--gs-cp-t);margin-bottom:.5rem;
}
.gs-mission-text{
  font-size:1rem;font-weight:600;color:var(--gs-tx0);
  line-height:1.55;margin-bottom:1.25rem;
  font-style:italic;
}
.gs-mission-divider{height:1px;background:var(--gs-bd0);margin:1.25rem 0}
.gs-mission-attrs{display:flex;flex-direction:column;gap:.75rem}
.gs-mission-attr{display:flex;align-items:flex-start;gap:.625rem}
.gs-mission-attr i{color:var(--gs-cs);font-size:1rem;margin-top:1px;flex-shrink:0}
.gs-mission-attr-text{font-size:.875rem;color:var(--gs-tx1);line-height:1.5}
.gs-mission-attr-text strong{color:var(--gs-tx0);font-weight:600}

/* ══════════════════════════════════════════════════════════════════
   SECTION SHARED SYSTEM
══════════════════════════════════════════════════════════════════ */
.gs-sec{padding:5rem 0;background:var(--gs-bg0)}
.gs-sec-alt{background:var(--gs-bg1)}
.gs-sec-hdr{margin-bottom:3rem}
.gs-eyebrow{
  display:inline-block;font-size:.75rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;
  color:var(--gs-cp);margin-bottom:.625rem;
}
.gs-sec-h2{
  font-size:clamp(1.875rem,3.5vw,2.625rem);
  font-weight:800;letter-spacing:-.03em;line-height:1.15;
  color:var(--gs-tx0);margin-bottom:.75rem;
}
.gs-sec-sub{
  font-size:1.0625rem;color:var(--gs-tx1);
  line-height:1.65;
}

/* ══════════════════════════════════════════════════════════════════
   STORY SECTION — timeline
══════════════════════════════════════════════════════════════════ */
.gs-story-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:3rem;align-items:center;
}
@media(max-width:767.98px){.gs-story-grid{grid-template-columns:1fr}}

.gs-story-text p{
  font-size:1rem;color:var(--gs-tx1);line-height:1.75;margin-bottom:1rem;
}
.gs-story-text p:last-child{margin-bottom:0}
.gs-story-text strong{color:var(--gs-tx0);font-weight:600}

/* Timeline card stack (right side of story) */
.gs-timeline{display:flex;flex-direction:column;gap:0}
.gs-tl-item{
  display:flex;gap:1.25rem;padding:1.25rem 0;
  border-bottom:1px solid var(--gs-bd0);
}
.gs-tl-item:last-child{border-bottom:none;padding-bottom:0}
.gs-tl-item:first-child{padding-top:0}
.gs-tl-dot-wrap{
  display:flex;flex-direction:column;align-items:center;
  flex-shrink:0;padding-top:4px;
}
.gs-tl-dot{
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:.875rem;font-weight:700;flex-shrink:0;
  font-family:var(--gs-fd);
}
.gs-tl-line{width:1px;flex:1;background:var(--gs-bd0);margin-top:8px}
.gs-tl-item:last-child .gs-tl-line{display:none}
.gs-tl-year{
  font-size:.6875rem;font-weight:700;color:var(--gs-tx2);
  text-transform:uppercase;letter-spacing:.07em;margin-bottom:.3rem;
}
.gs-tl-title{
  font-family:var(--gs-fd);font-size:.9375rem;font-weight:700;
  color:var(--gs-tx0);margin-bottom:.3rem;
}
.gs-tl-desc{font-size:.875rem;color:var(--gs-tx1);line-height:1.5}

/* ══════════════════════════════════════════════════════════════════
   VALUES SECTION — 4-card grid
══════════════════════════════════════════════════════════════════ */
.gs-value-card{
  background:var(--gs-sf1);border:1px solid var(--gs-bd1);
  border-radius:var(--gs-rxl);padding:1.75rem;
  transition:box-shadow .2s,border-color .2s,transform .2s;
}
.gs-value-card:hover{
  box-shadow:var(--gs-shlg);
  border-color:var(--gs-cp-b);
  transform:translateY(-2px);
}
.gs-value-icon{
  width:52px;height:52px;border-radius:var(--gs-rlg);
  display:flex;align-items:center;justify-content:center;
  font-size:1.375rem;margin-bottom:1.125rem;
}
.gs-value-title{
  font-family:var(--gs-fd);font-size:1.0625rem;font-weight:700;
  color:var(--gs-tx0);margin-bottom:.625rem;
}
.gs-value-desc{font-size:.9375rem;color:var(--gs-tx1);line-height:1.65}

/* ══════════════════════════════════════════════════════════════════
   STATS DARK SECTION
══════════════════════════════════════════════════════════════════ */
.gs-dark-sec{
  background:#0a0d18;position:relative;overflow:hidden;padding:5rem 0;
}
.gs-dark-sec-overlay{position:absolute;inset:0;pointer-events:none}
.gs-dark-sec-overlay::before{
  content:'';position:absolute;top:-100px;left:-80px;
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(91,33,182,.22) 0%,transparent 70%);
}
.gs-dark-sec-overlay::after{
  content:'';position:absolute;bottom:-80px;right:-60px;
  width:380px;height:380px;border-radius:50%;
  background:radial-gradient(circle,rgba(61,139,55,.15) 0%,transparent 70%);
}
.gs-dark-stat{text-align:center;padding:2rem 1rem}
@media(min-width:768px){
  .gs-dark-stat+.gs-dark-stat{border-left:1px solid rgba(255,255,255,.08)}
}
@media(max-width:767.98px){
  .gs-dark-stat{border-bottom:1px solid rgba(255,255,255,.08)}
  .gs-dark-stat:nth-child(odd){border-right:1px solid rgba(255,255,255,.08)}
  .gs-dark-stat:nth-last-child(-n+2){border-bottom:none}
}
.gs-dark-stat-num{
  display:block;font-family:var(--gs-fd);
  font-size:clamp(2.25rem,5vw,3.5rem);
  font-weight:800;letter-spacing:-.04em;line-height:1;margin-bottom:.5rem;
}
.gs-dark-stat-lbl{font-size:.875rem;color:rgba(255,255,255,.5);font-weight:500}

/* ══════════════════════════════════════════════════════════════════
   TEAM SECTION
══════════════════════════════════════════════════════════════════ */
.gs-team-card{
  background:var(--gs-sf1);border:1px solid var(--gs-bd1);
  border-radius:var(--gs-rxl);padding:1.75rem;text-align:center;
  transition:box-shadow .2s,border-color .2s,transform .2s;
}
.gs-team-card:hover{
  box-shadow:var(--gs-shlg);border-color:var(--gs-cp-b);
  transform:translateY(-3px);
}
.gs-team-avatar{
  width:80px;height:80px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--gs-fd);font-size:1.5rem;font-weight:800;
  color:#fff;margin:0 auto 1.125rem;flex-shrink:0;
}
.gs-team-name{
  font-family:var(--gs-fd);font-size:1rem;font-weight:700;
  color:var(--gs-tx0);margin-bottom:.25rem;
}
.gs-team-role{
  font-size:.8125rem;color:var(--gs-cp-t);font-weight:600;
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem;
}
.gs-team-bio{
  font-size:.875rem;color:var(--gs-tx1);line-height:1.6;
  margin-bottom:1rem;
}
.gs-team-socials{display:flex;justify-content:center;gap:.5rem}
.gs-team-soc{
  width:32px;height:32px;border-radius:var(--gs-rmd);
  display:flex;align-items:center;justify-content:center;
  background:var(--gs-bg2);color:var(--gs-tx2);font-size:.875rem;
  text-decoration:none;transition:background .15s,color .15s;
}
.gs-team-soc:hover{background:var(--gs-cp-s);color:var(--gs-cp-t)}

/* ══════════════════════════════════════════════════════════════════
   HOW IT WORKS — 3-step visual
══════════════════════════════════════════════════════════════════ */
.gs-how-step{
  background:var(--gs-sf1);border:1px solid var(--gs-bd1);
  border-radius:var(--gs-rxl);padding:2rem;position:relative;
  transition:box-shadow .2s,border-color .2s;
}
.gs-how-step:hover{
  box-shadow:var(--gs-shlg);border-color:var(--gs-cp-b);
}
.gs-how-num{
  position:absolute;top:-16px;left:1.75rem;
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--gs-fd);font-size:.875rem;font-weight:800;
  color:#fff;background:var(--gs-cp);
  box-shadow:0 4px 12px rgba(91,33,182,.3);
}
.gs-how-icon{
  width:56px;height:56px;border-radius:var(--gs-rlg);
  display:flex;align-items:center;justify-content:center;
  font-size:1.625rem;margin-bottom:1.25rem;
  border:1px solid var(--gs-bd0);
}
.gs-how-title{
  font-family:var(--gs-fd);font-size:1.0625rem;font-weight:700;
  color:var(--gs-tx0);margin-bottom:.625rem;
}
.gs-how-desc{font-size:.9375rem;color:var(--gs-tx1);line-height:1.65}

/* ══════════════════════════════════════════════════════════════════
   PRESS / TRUST LOGOS
══════════════════════════════════════════════════════════════════ */
.gs-press-label{
  font-size:.6875rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;color:var(--gs-tx2);margin-bottom:1.5rem;
  text-align:center;
}
.gs-press-logos{
  display:flex;align-items:center;justify-content:center;
  flex-wrap:wrap;gap:2rem;
}
.gs-press-logo{
  font-family:var(--gs-fd);font-size:1rem;font-weight:800;
  color:var(--gs-tx2);letter-spacing:-.02em;opacity:.45;
  filter:grayscale(1);transition:opacity .2s,filter .2s;
  user-select:none;
}
.gs-press-logo:hover{opacity:.8;filter:none}

/* ══════════════════════════════════════════════════════════════════
   CTA SECTION
══════════════════════════════════════════════════════════════════ */
.gs-about-cta{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#5B21B6 0%,#3B21B6 100%);
  padding:5rem 0;
}
.gs-about-cta::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 72% 50%,rgba(255,255,255,.09),transparent 55%);
  pointer-events:none;
}
.gs-about-cta-blob{
  position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;
}
.gs-about-cta-blob-1{
  width:400px;height:400px;top:-150px;right:-60px;
  background:rgba(255,255,255,.06);
}
.gs-about-cta-blob-2{
  width:300px;height:300px;bottom:-100px;left:-40px;
  background:rgba(255,255,255,.04);
}
.gs-about-cta-h2{
  font-family:var(--gs-fd);
  font-size:clamp(1.875rem,3.5vw,2.75rem);
  font-weight:800;letter-spacing:-.03em;line-height:1.15;
  color:#fff;margin-bottom:1rem;
}
.gs-about-cta-sub{
  font-size:1.0625rem;color:rgba(255,255,255,.75);
  line-height:1.65;max-width:520px;margin-bottom:2rem;
}
.gs-btn-white{
  background:#fff;border:2px solid #fff;color:var(--gs-purple-800);
  font-family:var(--gs-fd);font-weight:700;font-size:1rem;
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  height:52px;padding:0 1.75rem;border-radius:var(--gs-rf);
  text-decoration:none;transition:background .18s,box-shadow .18s,transform .1s;
  box-shadow:0 4px 16px rgba(0,0,0,.18);
}
.gs-btn-white:hover{background:#F5F3FF;color:var(--gs-purple-800);text-decoration:none}
.gs-btn-white:active{transform:translateY(1px)}
.gs-btn-white-outline{
  background:transparent;border:2px solid rgba(255,255,255,.45);color:#fff;
  font-family:var(--gs-fd);font-weight:600;font-size:.9375rem;
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  height:52px;padding:0 1.5rem;border-radius:var(--gs-rf);
  text-decoration:none;transition:background .18s,border-color .18s,transform .1s;
}
.gs-btn-white-outline:hover{
  background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.7);
  color:#fff;text-decoration:none;
}

/* ════════════════════════════════════════════════════════════
   BLOG INDEX + BLOG DETAIL — component CSS extracted verbatim from
   html_themes/blog.html + blog-detail.html inline <style> (were inline-only).
════════════════════════════════════════════════════════════ */
/* Blog hero */
.gs-blog-hero-blobs{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.gs-blog-blob{position:absolute;border-radius:50%;filter:blur(72px);opacity:.07}
[data-theme="dark"] .gs-blog-blob{opacity:.14}
.gs-blog-blob-1{width:440px;height:440px;background:#5B21B6;top:-160px;right:-60px}
.gs-blog-blob-2{width:300px;height:300px;background:#3D8B37;bottom:-100px;left:-40px}
.gs-blog-eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--gs-cp-t);background:var(--gs-cp-s);border:1px solid var(--gs-cp-b);border-radius:var(--gs-rf);padding:.3rem .875rem;margin-bottom:1rem}
[data-theme="dark"] .gs-blog-eyebrow{background:rgba(91,33,182,.16);border-color:rgba(167,139,250,.32)}
.gs-blog-h1{font-size:clamp(2rem,4vw,3rem);font-weight:800;letter-spacing:-.04em;line-height:1.1;color:var(--gs-tx0);margin-bottom:.875rem}
.gs-blog-h1 .acc{color:var(--gs-cp)}
.gs-blog-lead{font-size:1.0625rem;color:var(--gs-tx1);line-height:1.7;max-width:580px;margin-bottom:1.75rem}
.gs-blog-search-form{display:flex;gap:.5rem;max-width:520px}
.gs-blog-search-wrap{position:relative;flex:1}
.gs-blog-search-icon{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);color:var(--gs-tx2);font-size:1rem;pointer-events:none}
.gs-blog-search-input{width:100%;height:48px;padding:0 1rem 0 2.75rem;border:1.5px solid var(--gs-bd1);border-radius:var(--gs-rf);background:var(--gs-sf0);font-family:var(--gs-fb);font-size:.9375rem;color:var(--gs-tx0);outline:none;transition:border-color .18s,box-shadow .18s}
.gs-blog-search-input::placeholder{color:var(--gs-tx2)}
.gs-blog-search-input:focus{border-color:var(--gs-cp);box-shadow:var(--gs-foc)}
.gs-blog-stats{display:flex;flex-wrap:wrap;gap:1.5rem;margin-top:1.5rem;font-size:.875rem;color:var(--gs-tx2)}
.gs-blog-stat{display:flex;align-items:center;gap:.375rem}
.gs-blog-stat strong{color:var(--gs-tx0);font-weight:700}
.gs-blog-stat i{font-size:.875rem;color:var(--gs-cp)}
/* Featured article */
.gs-feat-article{display:grid;grid-template-columns:1fr 1fr;gap:0;background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-r2xl);overflow:hidden;text-decoration:none;transition:box-shadow .2s,transform .2s}
.gs-feat-article:hover{box-shadow:var(--gs-shxl);transform:translateY(-2px);text-decoration:none}
.gs-feat-article:focus-visible{outline:none;box-shadow:var(--gs-foc)}
@media(max-width:767.98px){.gs-feat-article{grid-template-columns:1fr}}
.gs-feat-thumb{height:100%;min-height:280px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
@media(max-width:767.98px){.gs-feat-thumb{min-height:200px}}
.gs-feat-thumb-emoji{font-size:5rem;z-index:1}
.gs-feat-body{padding:2rem;display:flex;flex-direction:column;justify-content:center}
.gs-feat-cat{display:inline-flex;align-items:center;gap:.25rem;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--gs-cp-t);margin-bottom:.875rem}
.gs-feat-title{font-family:var(--gs-fd);font-size:clamp(1.25rem,2.5vw,1.75rem);font-weight:800;letter-spacing:-.03em;line-height:1.25;color:var(--gs-tx0);margin-bottom:.875rem}
.gs-feat-excerpt{font-size:.9375rem;color:var(--gs-tx1);line-height:1.65;margin-bottom:1.25rem}
.gs-feat-meta{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.gs-author-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--gs-fd);font-size:.75rem;font-weight:700;color:#fff;flex-shrink:0}
.gs-feat-meta-text{font-size:.8125rem;color:var(--gs-tx2);line-height:1.4}
.gs-feat-meta-text strong{color:var(--gs-tx0);display:block;font-weight:600}
/* Card reading-time badge */
.gs-thumb-badge{position:absolute;top:.75rem;right:.75rem;background:rgba(255,255,255,.85);color:var(--gs-tx1);font-size:.6875rem;font-weight:600;padding:3px 8px;border-radius:var(--gs-rf);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
[data-theme="dark"] .gs-thumb-badge{background:rgba(0,0,0,.5);color:var(--gs-tx0)}
/* List view card */
.gs-blog-list-item{display:flex;gap:1.25rem;align-items:flex-start;padding:1.25rem;background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);text-decoration:none;transition:box-shadow .2s,border-color .2s,transform .15s}
.gs-blog-list-item:hover{box-shadow:var(--gs-shmd);border-color:var(--gs-cp-b);transform:translateX(3px);text-decoration:none}
.gs-blog-list-item:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.gs-blog-list-thumb{width:100px;height:80px;border-radius:var(--gs-rlg);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:2rem;overflow:hidden}
.gs-blog-list-body{flex:1;min-width:0}
.gs-blog-list-cat{font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--gs-cp-t);margin-bottom:.375rem}
.gs-blog-list-title{font-family:var(--gs-fd);font-size:.9375rem;font-weight:700;color:var(--gs-tx0);line-height:1.35;margin-bottom:.375rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gs-blog-list-excerpt{font-size:.8125rem;color:var(--gs-tx1);line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:.5rem}
.gs-blog-list-meta{font-size:.75rem;color:var(--gs-tx2)}
/* Sidebar */
.gs-sidebar-block{background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);padding:1.25rem;margin-bottom:1.25rem}
.gs-sidebar-block:last-child{margin-bottom:0}
.gs-sb-title{font-family:var(--gs-fd);font-size:.9375rem;font-weight:700;color:var(--gs-tx0);margin-bottom:1rem;padding-bottom:.625rem;border-bottom:1px solid var(--gs-bd0);display:flex;align-items:center;gap:.5rem}
.gs-sb-title i{color:var(--gs-cp);font-size:.9375rem}
.gs-sb-post{display:flex;gap:.75rem;padding:.5rem 0;border-bottom:1px solid var(--gs-bd0);text-decoration:none}
.gs-sb-post:last-child{border-bottom:none;padding-bottom:0}
.gs-sb-post:hover .gs-sb-post-title{color:var(--gs-cp-h)}
.gs-sb-post-num{font-family:var(--gs-fd);font-size:1.25rem;font-weight:800;color:var(--gs-bd1);flex-shrink:0;width:24px;line-height:1.2}
.gs-sb-post-title{font-family:var(--gs-fd);font-size:.875rem;font-weight:600;color:var(--gs-tx0);line-height:1.4;transition:color .15s;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gs-sb-post-meta{font-size:.6875rem;color:var(--gs-tx2);margin-top:2px}
.gs-sb-cats{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.25rem}
.gs-sb-cat-item{display:flex;align-items:center;justify-content:space-between;padding:.4375rem .625rem;border-radius:var(--gs-rmd);text-decoration:none;transition:background .15s}
.gs-sb-cat-item:hover{background:var(--gs-bg2);text-decoration:none}
.gs-sb-cat-item:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.gs-sb-cat-name{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:var(--gs-tx1)}
.gs-sb-cat-name i{font-size:.875rem;color:var(--gs-cp)}
.gs-sb-cat-count{font-size:.75rem;color:var(--gs-tx2);font-weight:500}
/* ── BLOG DETAIL ── */
.gs-art-hero{padding:3rem 0 0;border-bottom:1px solid var(--gs-bd0)}
.gs-art-hero-inner{max-width:820px}
.gs-art-category{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--gs-cp-t);margin-bottom:.875rem}
.gs-art-h1{font-size:clamp(1.875rem,4vw,2.875rem);font-weight:800;letter-spacing:-.04em;line-height:1.15;color:var(--gs-tx0);margin-bottom:1rem}
.gs-art-excerpt{font-size:1.125rem;color:var(--gs-tx1);line-height:1.7;margin-bottom:1.5rem;max-width:700px}
.gs-art-meta{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.25rem 0;border-top:1px solid var(--gs-bd0)}
.gs-art-author{display:flex;align-items:center;gap:.625rem}
.gs-art-author-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--gs-fd);font-size:.875rem;font-weight:700;color:#fff;flex-shrink:0}
.gs-art-author-name{font-family:var(--gs-fd);font-size:.875rem;font-weight:700;color:var(--gs-tx0)}
.gs-art-author-role{font-size:.75rem;color:var(--gs-tx2)}
.gs-art-meta-divider{width:1px;height:28px;background:var(--gs-bd0)}
.gs-art-meta-item{display:flex;align-items:center;gap:.375rem;font-size:.8125rem;color:var(--gs-tx2)}
.gs-art-meta-item i{font-size:.875rem;color:var(--gs-tx2)}
.gs-share-btns{display:flex;align-items:center;gap:.375rem;margin-left:auto}
.gs-share-btn{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:var(--gs-rmd);background:var(--gs-sf2);border:1px solid var(--gs-bd1);color:var(--gs-tx2);text-decoration:none;font-size:.9375rem;transition:background .15s,color .15s,border-color .15s}
.gs-share-btn:hover{background:var(--gs-cp-s);border-color:var(--gs-cp-b);color:var(--gs-cp-t);text-decoration:none}
.gs-share-btn:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.gs-art-thumb{margin-top:2rem;border-radius:var(--gs-r2xl) var(--gs-r2xl) 0 0;height:340px;display:flex;align-items:center;justify-content:center;font-size:5rem;overflow:hidden;position:relative;background:linear-gradient(135deg,#EDE9FE 0%,#C4B5FD 60%,#A78BFA 100%)}
[data-theme="dark"] .gs-art-thumb{background:linear-gradient(135deg,rgba(109,40,217,.4) 0%,rgba(124,58,237,.5) 60%,rgba(167,139,250,.3) 100%)}
.gs-art-thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(91,33,182,.08) 100%)}
/* Prose (article body) — child rules */
.gs-prose{font-size:1.0625rem;line-height:1.8;color:var(--gs-tx1);max-width:720px}
.gs-prose p{margin-bottom:1.25rem}
.gs-prose p:last-child{margin-bottom:0}
.gs-prose strong{color:var(--gs-tx0);font-weight:600}
.gs-prose em{font-style:italic}
.gs-prose a{color:var(--gs-cp);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.gs-prose a:hover{color:var(--gs-cp-h)}
.gs-prose h2{font-size:1.625rem;font-weight:800;letter-spacing:-.03em;color:var(--gs-tx0);margin:2.5rem 0 1rem;padding-bottom:.75rem;border-bottom:2px solid var(--gs-bd0);scroll-margin-top:calc(var(--gs-nh) + 1rem)}
.gs-prose h3{font-size:1.25rem;font-weight:700;letter-spacing:-.02em;color:var(--gs-tx0);margin:2rem 0 .875rem;scroll-margin-top:calc(var(--gs-nh) + 1rem)}
.gs-prose h4{font-size:1.0625rem;font-weight:700;color:var(--gs-tx0);margin:1.5rem 0 .625rem}
.gs-prose ul,.gs-prose ol{padding-left:1.75rem;margin-bottom:1.25rem}
.gs-prose li{margin-bottom:.5rem;line-height:1.7}
.gs-prose blockquote{border-left:4px solid var(--gs-cp);padding:.875rem 1.25rem;background:var(--gs-cp-s);border-radius:0 var(--gs-rmd) var(--gs-rmd) 0;margin:1.5rem 0;font-style:italic;color:var(--gs-tx0);font-size:1.0625rem}
[data-theme="dark"] .gs-prose blockquote{background:var(--gs-cp-m)}
.gs-prose code{font-family:monospace;font-size:.9em;background:var(--gs-bg2);color:var(--gs-cp-t);padding:.15em .4em;border-radius:var(--gs-rsm)}
.gs-prose hr{border:none;border-top:1px solid var(--gs-bd0);margin:2.5rem 0}
.gs-prose img{border-radius:var(--gs-rxl);margin:1.5rem 0}
.gs-prose table{width:100%;border-collapse:collapse;margin:1.75rem 0;font-size:.875rem}
.gs-prose th,.gs-prose td{padding:.75rem 1rem;text-align:left;border-bottom:1px solid var(--gs-bd0)}
.gs-prose thead th{background:var(--gs-bg1);font-family:var(--gs-fd);font-weight:700}
/* Table of contents (inline) */
.gs-toc{background:var(--gs-sf2);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);padding:1.25rem 1.5rem;margin-bottom:2rem}
.gs-toc-title{font-family:var(--gs-fd);font-size:.875rem;font-weight:700;color:var(--gs-tx0);margin-bottom:.875rem;display:flex;align-items:center;gap:.5rem}
.gs-toc-title i{color:var(--gs-cp);font-size:.875rem}
.gs-toc-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.375rem;counter-reset:toc-item}
.gs-toc-item a{font-size:.875rem;color:var(--gs-tx1);text-decoration:none;display:flex;align-items:center;gap:.5rem;padding:.25rem 0;border-bottom:1px solid transparent;transition:color .15s}
.gs-toc-item a:hover{color:var(--gs-cp-t)}
.gs-toc-item a::before{content:counter(toc-item);counter-increment:toc-item;font-family:var(--gs-fd);font-size:.6875rem;font-weight:700;width:20px;height:20px;border-radius:50%;background:var(--gs-cp-m);color:var(--gs-cp-t);display:flex;align-items:center;justify-content:center;flex-shrink:0}
[data-theme="dark"] .gs-toc-item a::before{background:rgba(167,139,250,.22);color:#C4B5FD}
/* Comparison table */
.gs-art-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1.75rem 0;border-radius:var(--gs-rxl);border:1px solid var(--gs-bd1)}
.gs-art-table{width:100%;border-collapse:collapse;min-width:480px;font-size:.875rem}
.gs-art-table th,.gs-art-table td{padding:.75rem 1rem;text-align:left;border-bottom:1px solid var(--gs-bd0)}
.gs-art-table thead th{background:var(--gs-bg1);font-family:var(--gs-fd);font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gs-tx2)}
.gs-art-table tbody tr:last-child td{border-bottom:none}
.gs-art-table tbody tr:hover{background:var(--gs-bg1)}
/* Sticky TOC sidebar */
.gs-article-toc-sticky{position:sticky;top:calc(var(--gs-nh) + 1.5rem);background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);padding:1.25rem;max-height:calc(100vh - var(--gs-nh) - 3rem);overflow-y:auto;scrollbar-width:thin}
.gs-toc-sticky-title{font-family:var(--gs-fd);font-size:.8125rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gs-tx2);margin-bottom:.875rem}
.gs-toc-sticky-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.125rem}
.gs-toc-sticky-item a{display:block;font-size:.875rem;color:var(--gs-tx2);text-decoration:none;padding:.375rem .5rem;border-left:2px solid transparent;border-radius:0 var(--gs-rsm) var(--gs-rsm) 0;line-height:1.4;transition:color .15s,border-color .15s,background .15s}
.gs-toc-sticky-item a:hover{color:var(--gs-cp-t);border-left-color:var(--gs-cp-b);background:var(--gs-cp-s)}
.gs-toc-sticky-item.active a{color:var(--gs-cp-t);border-left-color:var(--gs-cp);font-weight:600;background:var(--gs-cp-s)}
[data-theme="dark"] .gs-toc-sticky-item.active a{background:var(--gs-cp-m)}
.gs-toc-sticky-item.h3 a{padding-left:1.25rem;font-size:.8125rem}
/* Article tags */
.gs-art-tags{display:flex;flex-wrap:wrap;gap:.375rem;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--gs-bd0)}
.gs-art-tag{display:inline-flex;align-items:center;padding:.3rem .75rem;border-radius:var(--gs-rf);font-size:.75rem;font-weight:500;color:var(--gs-tx2);background:var(--gs-sf2);border:1px solid var(--gs-bd1);text-decoration:none;transition:background .15s,border-color .15s,color .15s}
.gs-art-tag:hover{background:var(--gs-cp-s);border-color:var(--gs-cp-b);color:var(--gs-cp-t);text-decoration:none}
/* Author bio */
.gs-author-bio{display:flex;gap:1.25rem;align-items:flex-start;background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-r2xl);padding:1.75rem;margin-top:2.5rem}
.gs-bio-avatar{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--gs-fd);font-size:1.25rem;font-weight:700;color:#fff;flex-shrink:0}
.gs-bio-name{font-family:var(--gs-fd);font-size:1.0625rem;font-weight:800;color:var(--gs-tx0);margin-bottom:.25rem}
.gs-bio-role{font-size:.8125rem;color:var(--gs-cp-t);font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.625rem}
.gs-bio-text{font-size:.9375rem;color:var(--gs-tx1);line-height:1.65;margin-bottom:.875rem}
.gs-bio-socials{display:flex;gap:.375rem}
.gs-bio-soc{width:32px;height:32px;border-radius:var(--gs-rmd);display:flex;align-items:center;justify-content:center;background:var(--gs-bg2);border:1px solid var(--gs-bd1);color:var(--gs-tx2);font-size:.875rem;text-decoration:none;transition:background .15s,color .15s}
.gs-bio-soc:hover{background:var(--gs-cp-s);color:var(--gs-cp-t);text-decoration:none}
/* Editorial disclosure */
.gs-editorial-note{display:flex;align-items:flex-start;gap:.75rem;background:var(--gs-bg1);border:1px solid var(--gs-bd0);border-left:3px solid var(--gs-cp);border-radius:0 var(--gs-rmd) var(--gs-rmd) 0;padding:.875rem 1rem;margin-bottom:2rem}
.gs-editorial-note i{color:var(--gs-cp);font-size:1rem;flex-shrink:0;margin-top:2px}
.gs-editorial-note p{font-size:.8125rem;color:var(--gs-tx2);line-height:1.55}
.gs-editorial-note a{color:var(--gs-cp);text-decoration:underline}
/* Newsletter form card (blog variant) */
.gs-nl-form-card{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:var(--gs-r2xl);padding:1.75rem}

/* ════════════════════════════════════════════════════════════
   CATEGORIES INDEX (cat-*) + CATEGORY DETAIL extras — extracted verbatim
   from html_themes/categories.html + category.html inline <style> (were inline-only).
════════════════════════════════════════════════════════════ */
/* Categories hero */
.cat-hero{position:relative;overflow:hidden;background:linear-gradient(155deg,var(--gs-purple-50) 0%,var(--gs-bg0) 55%,var(--gs-green-50) 100%);border-bottom:1px solid var(--gs-bd0);padding:3.5rem 0 3rem}
[data-theme="dark"] .cat-hero{background:linear-gradient(155deg,#1a0b3d 0%,#0C0E14 50%,#071407 100%)}
.cat-hero-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.cat-hero-blob-1{width:520px;height:520px;top:-200px;right:-80px;background:var(--gs-purple-300);opacity:.07}
.cat-hero-blob-2{width:360px;height:360px;bottom:-140px;left:-60px;background:var(--gs-green-400);opacity:.06}
[data-theme="dark"] .cat-hero-blob{opacity:.15}
.cat-hero-eyebrow{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gs-cp-t);background:var(--gs-cp-s);border:1px solid var(--gs-cp-b);border-radius:var(--gs-rf);padding:.25rem .875rem;margin-bottom:1.25rem}
[data-theme="dark"] .cat-hero-eyebrow{background:rgba(91,33,182,.16);border-color:rgba(167,139,250,.32)}
.cat-hero-h1{font-family:var(--gs-fd);font-size:clamp(2rem,4vw,2.875rem);font-weight:800;letter-spacing:-.04em;line-height:1.1;color:var(--gs-tx0);margin-bottom:.875rem}
.cat-hero-h1 .acc{color:var(--gs-cp)}
.cat-hero-lead{font-size:1.0625rem;color:var(--gs-tx1);line-height:1.65;max-width:540px;margin-bottom:2rem}
.cat-hero-stats{display:flex;flex-wrap:wrap;gap:1.75rem;padding-top:1.75rem;border-top:1px solid var(--gs-bd0)}
.cat-hero-stat-num{font-family:var(--gs-fd);font-size:1.625rem;font-weight:800;letter-spacing:-.035em;line-height:1;color:var(--gs-tx0)}
.cat-hero-stat-num em{color:var(--gs-cp);font-style:normal}
.cat-hero-stat-lbl{font-size:.75rem;color:var(--gs-tx2);margin-top:.25rem;font-weight:500}
/* Breadcrumb bar */
.cat-bc-bar{border-bottom:1px solid var(--gs-bd0);background:var(--gs-bg1);padding:.625rem 0}
/* Section layout */
.cat-section{padding:3.5rem 0}
.cat-section-alt{background:var(--gs-bg1)}
.cat-section-h2{font-family:var(--gs-fd);font-size:clamp(1.375rem,2.5vw,1.75rem);font-weight:800;letter-spacing:-.03em;color:var(--gs-tx0);margin-bottom:.5rem}
.cat-section-sub{font-size:.9375rem;color:var(--gs-tx2);line-height:1.6}
/* Category cards */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:1.25rem}
.cat-card{background:var(--gs-sf0);border:1px solid var(--gs-bd0);border-radius:var(--gs-rxl);padding:1.75rem;display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:box-shadow .2s,border-color .2s,transform .2s;position:relative;overflow:hidden}
.cat-card:hover{box-shadow:var(--gs-shlg);border-color:var(--gs-cp-b);transform:translateY(-3px);text-decoration:none;color:inherit}
.cat-card:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.cat-card-bg{position:absolute;inset:0;opacity:0;transition:opacity .25s}
.cat-card:hover .cat-card-bg{opacity:1}
.cat-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;margin-bottom:1rem}
.cat-card-icon{width:52px;height:52px;border-radius:var(--gs-rlg);display:flex;align-items:center;justify-content:center;font-size:1.375rem;flex-shrink:0;position:relative;z-index:1}
.cat-card-count{font-size:.75rem;font-weight:700;color:var(--gs-tx2);background:var(--gs-bg2);border-radius:var(--gs-rf);padding:.25rem .625rem;position:relative;z-index:1;white-space:nowrap}
.cat-card-name{font-family:var(--gs-fd);font-size:1.125rem;font-weight:800;letter-spacing:-.025em;color:var(--gs-tx0);margin-bottom:.5rem;position:relative;z-index:1}
.cat-card-desc{font-size:.875rem;color:var(--gs-tx2);line-height:1.6;flex-grow:1;margin-bottom:1.125rem;position:relative;z-index:1}
.cat-card-subs{display:flex;flex-wrap:wrap;gap:.375rem;margin-bottom:1.125rem;position:relative;z-index:1}
.cat-card-sub{font-size:.6875rem;font-weight:600;color:var(--gs-tx2);background:var(--gs-bg2);border-radius:var(--gs-rf);padding:.1875rem .5rem;transition:background .12s,color .12s}
.cat-card:hover .cat-card-sub{background:var(--gs-sf0);color:var(--gs-tx1)}
.cat-card-cta{display:inline-flex;align-items:center;gap:.375rem;font-family:var(--gs-fd);font-size:.875rem;font-weight:700;color:var(--gs-cp);position:relative;z-index:1;transition:gap .15s}
.cat-card:hover .cat-card-cta{gap:.625rem}
/* Platform stats strip */
.cat-stats-strip{background:#0a0d18;padding:3rem 0;position:relative;overflow:hidden}
.cat-stats-strip::before{content:'';position:absolute;top:-100px;left:-80px;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(91,33,182,.2) 0%,transparent 70%);pointer-events:none}
.cat-stats-strip::after{content:'';position:absolute;bottom:-80px;right:-60px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(61,139,55,.14) 0%,transparent 70%);pointer-events:none}
.cat-stat-item{text-align:center;padding:1.25rem 1rem}
.cat-stat-num{display:block;font-family:var(--gs-fd);font-size:clamp(2rem,4vw,3rem);font-weight:800;letter-spacing:-.04em;line-height:1;margin-bottom:.5rem}
.cat-stat-lbl{font-size:.875rem;color:rgba(255,255,255,.5);font-weight:500}
/* CTA section */
.cat-cta-section{background:linear-gradient(135deg,#5B21B6 0%,#3B21B6 100%);padding:4rem 0;position:relative;overflow:hidden}
.cat-cta-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 72% 50%,rgba(255,255,255,.08),transparent 55%);pointer-events:none}
.cat-cta-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.cat-cta-blob-1{width:400px;height:400px;top:-150px;right:-60px;background:rgba(255,255,255,.06)}
.cat-cta-blob-2{width:280px;height:280px;bottom:-100px;left:-40px;background:rgba(255,255,255,.04)}
.cat-cta-h2{font-family:var(--gs-fd);font-size:clamp(1.75rem,3vw,2.375rem);font-weight:800;letter-spacing:-.035em;line-height:1.15;color:#fff;margin-bottom:.875rem}
.cat-cta-sub{font-size:1rem;color:rgba(255,255,255,.75);line-height:1.65;max-width:480px;margin-bottom:2rem}
/* ── CATEGORY DETAIL extras (gs-cat-*) ── */
.gs-cat-blob{position:absolute;border-radius:50%;filter:blur(72px);opacity:.07}
[data-theme="dark"] .gs-cat-blob{opacity:.15}
.gs-cat-hero-blobs{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.gs-cat-blob-1{width:480px;height:480px;background:#5B21B6;top:-180px;right:-60px}
.gs-cat-blob-2{width:320px;height:320px;background:#3D8B37;bottom:-120px;left:-40px}
.gs-cat-eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--gs-cp-t);background:var(--gs-cp-s);border:1px solid var(--gs-cp-b);border-radius:var(--gs-rf);padding:.3rem .875rem;margin-bottom:1rem}
[data-theme="dark"] .gs-cat-eyebrow{background:rgba(91,33,182,.16);border-color:rgba(167,139,250,.32)}
.gs-cat-stats{display:flex;flex-wrap:wrap;gap:1.5rem;font-size:.875rem;color:var(--gs-tx2)}
.gs-cat-stat{display:flex;align-items:center;gap:.375rem}
.gs-cat-stat strong{color:var(--gs-tx0);font-weight:700}
.gs-cat-stat i{font-size:.875rem;color:var(--gs-cp)}
.gs-cat-search-wrap{margin-top:1.75rem}
.gs-cat-search-form{display:flex;gap:.5rem;max-width:560px}
.gs-cat-search-icon-wrap{position:relative;flex:1}
.gs-cat-search-icon{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);color:var(--gs-tx2);font-size:1rem;pointer-events:none}
.gs-cat-search-input{flex:1;width:100%;height:48px;padding:0 1.125rem 0 2.75rem;border:1.5px solid var(--gs-bd1);border-radius:var(--gs-rf);background:var(--gs-sf0);font-family:var(--gs-fb);font-size:.9375rem;color:var(--gs-tx0);outline:none;transition:border-color .18s,box-shadow .18s}
.gs-cat-search-input::placeholder{color:var(--gs-tx2)}
.gs-cat-search-input:focus{border-color:var(--gs-cp);box-shadow:var(--gs-foc)}
/* Filter / sort toolbar */
.gs-filter-bar{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;padding:1.25rem 0;border-bottom:1px solid var(--gs-bd0)}
.gs-filter-label{font-size:.8125rem;font-weight:600;color:var(--gs-tx2);flex-shrink:0}
.gs-filter-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;flex:1}
.gs-sort-wrap{display:flex;align-items:center;gap:.5rem;margin-left:auto;flex-shrink:0}
.gs-sort-label{font-size:.8125rem;color:var(--gs-tx2);flex-shrink:0;white-space:nowrap}
.gs-sort-select{width:auto;min-width:160px;height:36px;padding:0 2rem 0 .75rem;font-size:.8125rem;border-color:var(--gs-bd1)}
.gs-results-count{font-size:.8125rem;color:var(--gs-tx2);flex-shrink:0}
.gs-results-count strong{color:var(--gs-tx0)}
/* List-view variant for the auto grid (view toggle) */
.gs-grid-auto.is-list{grid-template-columns:1fr}
@media(max-width:767.98px){.gs-filter-bar{gap:.5rem}.gs-sort-wrap{margin-left:0;width:100%;justify-content:space-between}.cat-cta-section{padding:3rem 0}}
@media(max-width:575.98px){.cat-grid{grid-template-columns:1fr}}

/* ════════════════════════════════════════════════════════════
   COMPARE PAGE (cmp-*) — extracted verbatim from html_themes/compare.html
   inline <style> (was inline-only; absent from external CSS).
════════════════════════════════════════════════════════════ */
.cmp-hero{position:relative;overflow:hidden;background:linear-gradient(155deg,var(--gs-purple-50) 0%,var(--gs-bg0) 55%,var(--gs-blue-50) 100%);border-bottom:1px solid var(--gs-bd0);padding:3.5rem 0 3rem}
[data-theme="dark"] .cmp-hero{background:linear-gradient(155deg,#1a0b3d 0%,#0C0E14 50%,#071126 100%)}
.cmp-hero-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.cmp-hero-blob-1{width:520px;height:520px;top:-180px;right:-80px;background:var(--gs-purple-300);opacity:.07}
.cmp-hero-blob-2{width:380px;height:380px;bottom:-130px;left:-60px;background:var(--gs-blue-300);opacity:.06}
[data-theme="dark"] .cmp-hero-blob{opacity:.14}
.cmp-hero-eyebrow{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gs-cp-t);background:var(--gs-cp-s);border:1px solid var(--gs-cp-b);border-radius:var(--gs-rf);padding:.25rem .875rem;margin-bottom:1.25rem}
[data-theme="dark"] .cmp-hero-eyebrow{background:rgba(91,33,182,.16);border-color:rgba(167,139,250,.32)}
.cmp-hero-h1{font-family:var(--gs-fd);font-size:clamp(1.6rem,2.8vw,2.2rem);white-space:nowrap;font-weight:800;letter-spacing:-.04em;line-height:1.1;color:var(--gs-tx0);margin-bottom:.875rem}
.cmp-hero-h1 .acc{color:var(--gs-cp)}
.cmp-hero-lead{font-size:1.0625rem;color:var(--gs-tx1);line-height:1.65;margin-bottom:2rem}
.cmp-builder{background:var(--gs-sf0);border:1px solid var(--gs-bd1);border-radius:var(--gs-r2xl);padding:1.75rem 2rem;box-shadow:var(--gs-shmd)}
.cmp-builder-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gs-tx2);margin-bottom:.625rem;display:block}
.cmp-tool-input-wrap{position:relative}
.cmp-tool-input-ico{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);color:var(--gs-tx2);font-size:.9375rem;pointer-events:none;z-index:1}
.cmp-tool-input{width:100%;height:50px;padding:0 1rem 0 2.625rem;border:1.5px solid var(--gs-bd1);border-radius:var(--gs-rmd);background:var(--gs-bg1);font-family:var(--gs-fb);font-size:.9375rem;color:var(--gs-tx0);outline:none;transition:border-color .15s,box-shadow .15s}
.cmp-tool-input:focus{border-color:var(--gs-cp);box-shadow:var(--gs-foc);background:var(--gs-sf0)}
.cmp-tool-input::placeholder{color:var(--gs-tx2)}
.cmp-vs-badge{width:36px;height:36px;border-radius:50%;background:var(--gs-bg2);border:2px solid var(--gs-bd1);display:flex;align-items:center;justify-content:center;font-family:var(--gs-fd);font-size:.6875rem;font-weight:800;color:var(--gs-tx2);flex-shrink:0;letter-spacing:.04em}
.cmp-add-tool-btn{background:none;border:1.5px dashed var(--gs-bd1);border-radius:var(--gs-rmd);height:50px;padding:0 1.25rem;font-family:var(--gs-fb);font-size:.875rem;color:var(--gs-tx2);cursor:pointer;width:100%;transition:border-color .15s,color .15s,background .15s;display:flex;align-items:center;justify-content:center;gap:.375rem}
.cmp-add-tool-btn:hover{border-color:var(--gs-cp);color:var(--gs-cp);background:var(--gs-cp-s)}
.cmp-add-tool-btn:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.cmp-section{padding:3.5rem 0}
.cmp-section-alt{background:var(--gs-bg1)}
.cmp-section-h2{font-family:var(--gs-fd);font-size:clamp(1.375rem,2.5vw,1.75rem);font-weight:800;letter-spacing:-.03em;color:var(--gs-tx0);margin-bottom:.5rem}
.cmp-section-sub{font-size:.9375rem;color:var(--gs-tx2);line-height:1.6}
.cmp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:1rem}
.cmp-card{display:flex;flex-direction:column;background:var(--gs-sf0);border:1px solid var(--gs-bd0);border-radius:var(--gs-rxl);padding:1.25rem;text-decoration:none;color:inherit;transition:box-shadow .2s,border-color .2s,transform .2s}
.cmp-card:hover{box-shadow:var(--gs-shlg);border-color:var(--gs-cp-b);transform:translateY(-2px);text-decoration:none;color:inherit}
.cmp-card:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.cmp-card-logos{display:flex;align-items:center;gap:.625rem;margin-bottom:1rem}
.cmp-card-logo{width:44px;height:44px;border-radius:var(--gs-rmd);display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0;border:1px solid var(--gs-bd0);background:var(--gs-bg1)}
.cmp-card-vs{font-size:.6875rem;font-weight:800;color:var(--gs-tx2);letter-spacing:.06em;flex-shrink:0}
.cmp-card-title{font-family:var(--gs-fd);font-size:.9375rem;font-weight:700;color:var(--gs-tx0);margin-bottom:.375rem;line-height:1.3}
.cmp-card-meta{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-bottom:.875rem}
.cmp-card-cat{font-size:.6875rem;font-weight:600;color:var(--gs-cp-t);background:var(--gs-cp-s);border-radius:var(--gs-rf);padding:.125rem .5rem}
.cmp-card-views{font-size:.6875rem;color:var(--gs-tx2)}
.cmp-card-cta{margin-top:auto;display:flex;align-items:center;gap:.375rem;font-family:var(--gs-fd);font-size:.8125rem;font-weight:700;color:var(--gs-cp);transition:gap .15s}
.cmp-card:hover .cmp-card-cta{gap:.625rem}
.cmp-cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:.75rem}
.cmp-cat-link{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;background:var(--gs-sf0);border:1px solid var(--gs-bd0);border-radius:var(--gs-rlg);text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s,background .15s}
.cmp-cat-link:hover{border-color:var(--gs-cp-b);box-shadow:var(--gs-shsm);background:var(--gs-cp-s);text-decoration:none;color:inherit}
.cmp-cat-link:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.cmp-cat-ico{width:36px;height:36px;border-radius:var(--gs-rmd);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}
.cmp-cat-name{font-family:var(--gs-fd);font-size:.875rem;font-weight:700;color:var(--gs-tx0);line-height:1.25}
.cmp-cat-count{font-size:.75rem;color:var(--gs-tx2)}
.cmp-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--gs-bd0);border-radius:var(--gs-rxl)}
.cmp-table{width:100%;border-collapse:collapse;min-width:480px;font-size:.875rem}
.cmp-table th{padding:.875rem 1rem;text-align:left;background:var(--gs-bg1);font-family:var(--gs-fd);font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gs-tx2);border-bottom:1px solid var(--gs-bd0)}
.cmp-table th.cmp-col-hl{background:var(--gs-cp-s);color:var(--gs-cp-t);border-bottom-color:var(--gs-cp-b)}
.cmp-table td{padding:.75rem 1rem;border-bottom:1px solid var(--gs-bd0);color:var(--gs-tx1);vertical-align:middle}
.cmp-table td.cmp-col-hl{background:rgba(91,33,182,.03)}
[data-theme="dark"] .cmp-table td.cmp-col-hl{background:rgba(109,40,217,.08)}
.cmp-table tbody tr:last-child td{border-bottom:none}
.cmp-table tbody tr:hover td{background:var(--gs-bg1)}
.cmp-table tbody tr:hover td.cmp-col-hl{background:var(--gs-cp-s)}
.cmp-table .cmp-feat-name{font-weight:600;color:var(--gs-tx0);font-size:.875rem}
.cmp-table .cmp-feat-cat{font-size:.6875rem;color:var(--gs-tx2);display:block}
.cmp-table td.cmp-center{text-align:center}
.cmp-check-yes{color:var(--gs-cs);font-size:1.0625rem}
.cmp-check-no{color:var(--gs-neutral-300);font-size:1.0625rem}
[data-theme="dark"] .cmp-check-no{color:var(--gs-neutral-600)}
.cmp-check-part{font-size:.75rem;font-weight:600;color:var(--gs-orange-500);background:rgba(249,115,22,.1);padding:.125rem .5rem;border-radius:var(--gs-rf)}
.cmp-step{display:flex;gap:1.25rem;align-items:flex-start}
.cmp-step-num{width:40px;height:40px;border-radius:50%;background:var(--gs-cp);color:#fff;font-family:var(--gs-fd);font-size:.9375rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 12px rgba(91,33,182,.28)}
.cmp-step-title{font-family:var(--gs-fd);font-size:1rem;font-weight:700;color:var(--gs-tx0);margin-bottom:.375rem}
.cmp-step-desc{font-size:.875rem;color:var(--gs-tx2);line-height:1.6}
.cmp-cta{background:linear-gradient(135deg,#5B21B6 0%,#3B21B6 100%);padding:4rem 0;position:relative;overflow:hidden}
.cmp-cta::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 72% 50%,rgba(255,255,255,.08),transparent 55%);pointer-events:none}
.cmp-cta-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.cmp-cta-blob-1{width:400px;height:400px;top:-150px;right:-60px;background:rgba(255,255,255,.06)}
.cmp-cta-blob-2{width:280px;height:280px;bottom:-100px;left:-40px;background:rgba(255,255,255,.04)}
.cmp-cta-h2{font-family:var(--gs-fd);font-size:clamp(1.75rem,3vw,2.375rem);font-weight:800;letter-spacing:-.035em;line-height:1.15;color:#fff;margin-bottom:.875rem}
.cmp-cta-sub{font-size:1rem;color:rgba(255,255,255,.75);line-height:1.65;max-width:480px;margin-bottom:2rem}
@media(max-width:767.98px){.cmp-builder{padding:1.25rem 1.25rem}.cmp-hero{padding:2.5rem 0 2rem}.cmp-section{padding:2.5rem 0}.cmp-cta{padding:3rem 0}}
@media(max-width:575.98px){.cmp-hero{padding:2rem 0 1.75rem}.cmp-grid{grid-template-columns:1fr}.cmp-cat-grid{grid-template-columns:1fr 1fr}}

/* ════════════════════════════════════════════════════════════
   CONTACT PAGE — extracted verbatim from html_themes/contact.html
   inline <style> (was inline-only; absent from external CSS).
════════════════════════════════════════════════════════════ */
.gs-contact-hero{position:relative;overflow:hidden;background:linear-gradient(155deg,#F5F3FF 0%,#FFFFFF 50%,#F0FDF4 100%);padding:4rem 0 3.5rem}
[data-theme="dark"] .gs-contact-hero{background:linear-gradient(155deg,#1a0b3d 0%,#0C0E14 50%,#071407 100%)}
.gs-ch-blobs{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.gs-ch-blob{position:absolute;border-radius:50%;filter:blur(72px);opacity:.06}
[data-theme="dark"] .gs-ch-blob{opacity:.14}
.gs-ch-blob-1{width:520px;height:520px;background:#5B21B6;top:-200px;right:-80px}
.gs-ch-blob-2{width:340px;height:340px;background:#3D8B37;bottom:-120px;left:-60px}
.gs-ch-eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.8125rem;font-weight:600;color:var(--gs-cp-t);background:var(--gs-cp-s);border:1px solid var(--gs-cp-b);border-radius:var(--gs-rf);padding:.375rem 1rem;margin-bottom:1.5rem}
[data-theme="dark"] .gs-ch-eyebrow{background:rgba(91,33,182,.16);border-color:rgba(167,139,250,.32)}
.gs-ch-h1{font-size:clamp(2rem,4.5vw,3.25rem);font-weight:800;letter-spacing:-.04em;line-height:1.1;color:var(--gs-tx0);margin-bottom:1.125rem}
.gs-ch-h1 .acc{color:var(--gs-cp)}
.gs-ch-sub{font-size:1.0625rem;color:var(--gs-tx1);line-height:1.7;max-width:560px;margin-bottom:0}
/* Routing cards */
.gs-route-card{display:flex;flex-direction:column;gap:1rem;background:var(--gs-sf1);border:1.5px solid var(--gs-bd1);border-radius:var(--gs-r2xl);padding:1.75rem;text-decoration:none;transition:box-shadow .2s,border-color .2s,transform .2s;cursor:pointer;height:100%}
.gs-route-card:hover{box-shadow:var(--gs-shlg);border-color:var(--gs-cp-b);transform:translateY(-3px);text-decoration:none}
.gs-route-card.selected{border-color:var(--gs-cp);box-shadow:0 0 0 3px var(--gs-cp-m)}
.gs-route-card:focus-visible{outline:none;box-shadow:var(--gs-foc);border-color:var(--gs-cp)}
.gs-route-icon{width:52px;height:52px;border-radius:var(--gs-rlg);display:flex;align-items:center;justify-content:center;font-size:1.375rem;flex-shrink:0}
.gs-route-tag{display:inline-flex;align-items:center;gap:.3rem;font-size:.5625rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:2px 7px;border-radius:var(--gs-rf);background:var(--gs-cp-m);color:var(--gs-cp-t);margin-bottom:.25rem;align-self:flex-start}
[data-theme="dark"] .gs-route-tag{background:rgba(167,139,250,.22);color:#C4B5FD}
.gs-route-title{font-family:var(--gs-fd);font-size:1.0625rem;font-weight:700;color:var(--gs-tx0);margin-bottom:.25rem}
.gs-route-desc{font-size:.875rem;color:var(--gs-tx1);line-height:1.55}
.gs-route-link{display:flex;align-items:center;gap:.375rem;font-size:.8125rem;font-weight:600;color:var(--gs-cp-t);margin-top:auto;padding-top:.25rem;transition:gap .15s}
.gs-route-card:hover .gs-route-link{gap:.625rem}
.gs-route-link i{font-size:.75rem;transition:transform .15s}
.gs-route-card:hover .gs-route-link i{transform:translateX(3px)}
/* Form card + fields */
.gs-form-card{background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-r2xl);padding:2.5rem;box-shadow:var(--gs-shxl)}
@media(max-width:575.98px){.gs-form-card{padding:1.5rem}}
.gs-field-group{margin-bottom:1.25rem}
.gs-field-group:last-child{margin-bottom:0}
.gs-field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:575.98px){.gs-field-row{grid-template-columns:1fr}}
.gs-field-footer{display:flex;align-items:center;justify-content:space-between}
.gs-input.error,.gs-textarea.error,.gs-select.error{border-color:#DC2626;box-shadow:0 0 0 3px rgba(220,38,38,.2)}
.gs-field-err{font-size:.75rem;color:#DC2626;margin-top:.375rem;display:flex;align-items:center;gap:.25rem}
.gs-field-err i{font-size:.75rem;flex-shrink:0}
.gs-field-hint{font-size:.75rem;color:var(--gs-tx2);margin-top:.375rem}
.gs-char-count{font-size:.6875rem;color:var(--gs-tx2);text-align:right;margin-top:.25rem}
.gs-char-count.warn{color:var(--gs-orange-500)}
/* Form success state */
.gs-form-success{display:none;flex-direction:column;align-items:center;text-align:center;padding:2.5rem 1.5rem}
.gs-form-success.visible{display:flex}
.gs-success-icon{width:64px;height:64px;border-radius:50%;background:var(--gs-green-100);border:2px solid var(--gs-green-200);display:flex;align-items:center;justify-content:center;font-size:1.75rem;margin-bottom:1.25rem}
[data-theme="dark"] .gs-success-icon{background:rgba(61,139,55,.2);border-color:rgba(74,222,128,.3)}
.gs-success-title{font-family:var(--gs-fd);font-size:1.25rem;font-weight:700;color:var(--gs-tx0);margin-bottom:.5rem}
.gs-success-sub{font-size:.9375rem;color:var(--gs-tx1);line-height:1.6}
/* Info sidebar cards */
.gs-info-card{background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);padding:1.375rem 1.5rem;display:flex;align-items:flex-start;gap:1rem;transition:box-shadow .2s,border-color .2s}
.gs-info-card:hover{box-shadow:var(--gs-shmd);border-color:var(--gs-cp-b)}
.gs-info-icon{width:40px;height:40px;border-radius:var(--gs-rmd);display:flex;align-items:center;justify-content:center;font-size:1.125rem;flex-shrink:0}
.gs-info-label{font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--gs-tx2);margin-bottom:.25rem}
.gs-info-val{font-family:var(--gs-fd);font-size:.9375rem;font-weight:600;color:var(--gs-tx0);margin-bottom:.2rem}
.gs-info-sub{font-size:.8125rem;color:var(--gs-tx2);line-height:1.5}
.gs-info-link{font-size:.8125rem;color:var(--gs-cp-t);text-decoration:none;transition:color .15s;margin-top:.25rem;display:inline-flex;align-items:center;gap:.25rem}
.gs-info-link:hover{color:var(--gs-cp-h)}
.gs-info-link i{font-size:.625rem}
/* Response badge */
.gs-resp-badge{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:600;padding:.375rem .875rem;border-radius:var(--gs-rf);background:var(--gs-green-100);color:var(--gs-green-700);border:1px solid var(--gs-green-200)}
[data-theme="dark"] .gs-resp-badge{background:rgba(61,139,55,.2);color:#4ADE80;border-color:rgba(74,222,128,.25)}
.gs-resp-dot{width:7px;height:7px;border-radius:50%;background:var(--gs-green-600);flex-shrink:0;animation:gs-pulse 2s ease-in-out infinite}
@keyframes gs-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}
/* Help links */
.gs-help-link{display:flex;align-items:center;gap:.875rem;padding:1.125rem 1.25rem;background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);text-decoration:none;transition:box-shadow .2s,border-color .2s,transform .15s}
.gs-help-link:hover{box-shadow:var(--gs-shmd);border-color:var(--gs-cp-b);transform:translateX(3px);text-decoration:none}
.gs-help-link:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.gs-help-link-ico{width:36px;height:36px;border-radius:var(--gs-rmd);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}
.gs-help-link-title{font-family:var(--gs-fd);font-size:.875rem;font-weight:600;color:var(--gs-tx0);margin-bottom:1px;transition:color .15s}
.gs-help-link:hover .gs-help-link-title{color:var(--gs-cp-t)}
.gs-help-link-sub{font-size:.75rem;color:var(--gs-tx2)}
.gs-help-link-arr{font-size:.75rem;color:var(--gs-tx2);margin-left:auto;transition:transform .15s,color .15s;flex-shrink:0}
.gs-help-link:hover .gs-help-link-arr{transform:translateX(3px);color:var(--gs-cp)}

/* ══════════════════════════════════════════════════════════════════
   PRICING PAGE — component CSS extracted from html_themes/pricing.html
   (inline-only there). Hero, billing toggle deps already exist; these
   were genuinely missing from the external stylesheets.
══════════════════════════════════════════════════════════════════ */
.gs-pricing-hero{
  position:relative;overflow:hidden;
  background:linear-gradient(155deg,#F5F3FF 0%,#FFFFFF 50%,#F0FDF4 100%);
  padding:4.5rem 0 3rem;
  text-align:center;
}
[data-theme="dark"] .gs-pricing-hero{
  background:linear-gradient(155deg,#1a0b3d 0%,#0C0E14 50%,#071407 100%);
}
.gs-ph-blobs{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.gs-ph-blob{position:absolute;border-radius:50%;filter:blur(72px);opacity:.06}
[data-theme="dark"] .gs-ph-blob{opacity:.14}
.gs-ph-blob-1{width:560px;height:560px;background:#5B21B6;top:-200px;right:-80px}
.gs-ph-blob-2{width:380px;height:380px;background:#3D8B37;bottom:-140px;left:-60px}
.gs-ph-eyebrow{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.8125rem;font-weight:600;color:var(--gs-cp-t,#5B21B6);
  background:var(--gs-cp-s,#F5F3FF);border:1px solid var(--gs-cp-b,#DDD6FE);
  border-radius:var(--gs-rf,9999px);padding:.375rem 1rem;margin-bottom:1.5rem;
}
[data-theme="dark"] .gs-ph-eyebrow{background:rgba(91,33,182,.16);border-color:rgba(167,139,250,.32)}
.gs-ph-h1{
  font-size:clamp(2rem,4.5vw,3.25rem);font-weight:800;
  letter-spacing:-.04em;line-height:1.1;
  color:var(--gs-tx0);margin-bottom:1.125rem;
}
.gs-ph-h1 .acc{color:var(--gs-cp,#5B21B6)}
.gs-ph-sub{
  font-size:1.0625rem;color:var(--gs-tx1);line-height:1.7;
  max-width:560px;margin:0 auto 2.5rem;
}
/* Compare table */
.gs-compare-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.gs-compare-table{width:100%;border-collapse:collapse;min-width:620px;font-size:.875rem}
.gs-compare-table th,
.gs-compare-table td{padding:.875rem 1rem;text-align:left;border-bottom:1px solid var(--gs-bd0)}
.gs-compare-table thead tr{background:var(--gs-bg1)}
.gs-compare-table thead th{font-family:var(--gs-fd);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gs-tx2)}
.gs-compare-table thead th:first-child{min-width:200px}
.gs-compare-table thead th:not(:first-child){text-align:center;min-width:130px}
.gs-compare-table tbody tr:hover{background:var(--gs-bg1)}
.gs-compare-table td:not(:first-child){text-align:center}
.gs-compare-table td:first-child{font-weight:500;color:var(--gs-tx0)}
.gs-compare-check{color:var(--gs-cs,#16A34A);font-size:1.0625rem}
.gs-compare-cross{color:var(--gs-neutral-300,#D1D5DB);font-size:1.0625rem}
[data-theme="dark"] .gs-compare-cross{color:#4B5563}
.gs-compare-val{color:var(--gs-tx1);font-weight:500}
.gs-ct-group-hd{background:var(--gs-bg1)}
.gs-ct-group-hd td{font-family:var(--gs-fd);font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--gs-tx2);padding:.625rem 1rem}
/* Social-proof logo strip */
.gs-proof-strip{background:var(--gs-bg1);border-top:1px solid var(--gs-bd0);border-bottom:1px solid var(--gs-bd0);padding:2rem 0}
.gs-proof-label{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gs-tx2);text-align:center;margin-bottom:1.25rem}
.gs-proof-logos{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:2rem}
.gs-proof-logo{font-family:var(--gs-fd);font-size:.9375rem;font-weight:800;color:var(--gs-tx2);letter-spacing:-.02em;opacity:.4;filter:grayscale(1);transition:opacity .2s,filter .2s;user-select:none}
.gs-proof-logo:hover{opacity:.75;filter:none}
/* Vendor testimonials */
.gs-vtesti{background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);padding:1.75rem;display:flex;flex-direction:column;transition:box-shadow .2s}
.gs-vtesti:hover{box-shadow:var(--gs-shlg)}
.gs-vtesti-stars{display:flex;gap:.25rem;margin-bottom:1rem}
.gs-vtesti-stars i{color:var(--gs-orange-500,#F97316);font-size:.875rem}
.gs-vtesti-quote{font-style:italic;font-size:.9375rem;color:var(--gs-tx1);line-height:1.7;flex:1;margin-bottom:1.25rem;position:relative;padding-top:1.25rem}
.gs-vtesti-quote::before{content:"\201C";position:absolute;top:-.5rem;left:0;font-family:var(--gs-fd);font-size:2.5rem;font-weight:800;font-style:normal;color:var(--gs-cp);line-height:1;opacity:.3}
.gs-vtesti-author{display:flex;align-items:center;gap:.875rem;margin-top:auto}
.gs-vtesti-avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:var(--gs-fd);font-size:.8125rem;font-weight:700;color:#fff}
.gs-vtesti-name{font-family:var(--gs-fd);font-size:.875rem;font-weight:700;color:var(--gs-tx0);margin-bottom:1px}
.gs-vtesti-role{font-size:.75rem;color:var(--gs-tx2)}
.gs-vtesti-plan{display:inline-flex;align-items:center;gap:.3rem;font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:2px 7px;border-radius:var(--gs-rf);background:var(--gs-cp-m,#EDE9FE);color:var(--gs-cp-t,#5B21B6);margin-top:4px}
[data-theme="dark"] .gs-vtesti-plan{background:rgba(167,139,250,.22);color:#C4B5FD}
/* "Why list" cards */
.gs-why-card{display:flex;flex-direction:column;gap:.75rem;padding:1.75rem;background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);transition:box-shadow .2s,border-color .2s,transform .2s}
.gs-why-card:hover{box-shadow:var(--gs-shlg);border-color:var(--gs-cp-b);transform:translateY(-2px)}
.gs-why-icon{width:52px;height:52px;border-radius:var(--gs-rlg);display:flex;align-items:center;justify-content:center;font-size:1.375rem;flex-shrink:0}
.gs-why-title{font-family:var(--gs-fd);font-size:1.0625rem;font-weight:700;color:var(--gs-tx0)}
.gs-why-desc{font-size:.9375rem;color:var(--gs-tx1);line-height:1.65}
/* Process steps */
.gs-step{display:flex;gap:1.25rem;padding:1.5rem;background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rxl);transition:box-shadow .2s,border-color .2s}
.gs-step:hover{box-shadow:var(--gs-shmd);border-color:var(--gs-cp-b)}
.gs-step-num{width:40px;height:40px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:var(--gs-fd);font-size:.9375rem;font-weight:800;color:#fff;background:var(--gs-cp);box-shadow:0 4px 10px rgba(91,33,182,.28)}
.gs-step-title{font-family:var(--gs-fd);font-size:1rem;font-weight:700;color:var(--gs-tx0);margin-bottom:.375rem}
.gs-step-desc{font-size:.875rem;color:var(--gs-tx1);line-height:1.6}
/* Dark stats overlay (gs-dark-sec/-stat already present) */
.gs-dark-overlay{position:absolute;inset:0;pointer-events:none}
.gs-dark-overlay::before{content:'';position:absolute;top:-80px;left:-60px;width:440px;height:440px;border-radius:50%;background:radial-gradient(circle,rgba(91,33,182,.22) 0%,transparent 70%)}
.gs-dark-overlay::after{content:'';position:absolute;bottom:-60px;right:-40px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(61,139,55,.15) 0%,transparent 70%)}
/* CTA banner blobs + heading (gs-pricing-cta/gs-btn-white already present) */
.gs-cta-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.gs-cta-blob-1{width:360px;height:360px;top:-120px;right:-50px;background:rgba(255,255,255,.06)}
.gs-cta-blob-2{width:280px;height:280px;bottom:-80px;left:-30px;background:rgba(255,255,255,.04)}
.gs-cta-h2{font-family:var(--gs-fd);font-size:clamp(1.875rem,3.5vw,2.625rem);font-weight:800;letter-spacing:-.03em;line-height:1.15;color:#fff;margin-bottom:.875rem}
.gs-cta-sub{font-size:1.0625rem;color:rgba(255,255,255,.75);line-height:1.65;margin-bottom:2rem;max-width:480px}
/* "Ready to get listed?" CTA — the SECTION needs its own dark banner background (the bare .gs-pricing-cta
   class is the card-CTA helper). Targeting section.* avoids that collision. Moved here from inline styles
   so the white text is always on a dark surface and stays visible in BOTH light and dark theme. */
section.gs-pricing-cta{position:relative;overflow:hidden;text-align:center;padding:4.5rem 0;
  background:linear-gradient(135deg,#5B21B6 0%,#3a1a8a 55%,#0C0E14 100%)}
section.gs-pricing-cta .gs-cta-inner{position:relative;z-index:1;text-align:center}
.gs-cta-eyebrow{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.6);margin-bottom:.875rem}
.gs-cta-note{font-size:.75rem;color:rgba(255,255,255,.55);margin-top:1.25rem}
@media(max-width:575.98px){section.gs-pricing-cta{padding:3rem 0}}
@media(max-width:991.98px){.gs-pricing-hero{padding:3.5rem 0 2.5rem}}
@media(max-width:575.98px){.gs-pricing-hero{padding:2.5rem 0 2rem}}


/* ============================================================
 * § 28 · PHASE 1 — GLOBAL UI ENHANCEMENTS
 * Scope: typography, spacing, accessibility, consistency.
 * No class name changes. No HTML structure changes. No PHP.
 * ============================================================ */


/* -- 28.1  SKIP-TO-CONTENT LINK (accessibility) ------------ */
/* .gs-skip-link is defined in goji-framework.css §33.
 * layout.php updated to use class="gs-skip-link" (was "skip-link"). */


/* -- 28.2  BOOTSTRAP ALERT BRIDGE -------------------------- */
.alert {
  border-radius: var(--gs-radius-card-sm, 12px);
  font-size: var(--gs-text-sm);
  border-width: 1px;
  border-style: solid;
  padding: var(--gs-space-3) var(--gs-space-4);
  font-family: var(--gs-fb);
  line-height: var(--gs-leading-relaxed);
}
.alert-success {
  background-color: var(--gs-status-success-bg);
  border-color: var(--gs-status-success-border);
  color: var(--gs-status-success-text);
}
.alert-warning {
  background-color: var(--gs-status-warning-bg);
  border-color: var(--gs-status-warning-border);
  color: var(--gs-status-warning-text);
}
.alert-danger {
  background-color: var(--gs-status-error-bg);
  border-color: var(--gs-status-error-border);
  color: var(--gs-status-error-text);
}
.alert-info {
  background-color: var(--gs-status-info-bg);
  border-color: var(--gs-status-info-border);
  color: var(--gs-status-info-text);
}
.alert .btn-close { opacity: 0.5; }
.alert .btn-close:hover { opacity: 0.8; }


/* -- 28.3  IMAGE QUALITY & LAZY-LOADING -------------------- */
img { image-rendering: -webkit-optimize-contrast; }
@keyframes gs-img-reveal {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.gs-img-skeleton {
  background: linear-gradient(
    90deg,
    var(--gs-bg-muted) 25%,
    var(--gs-bg-emphasis) 50%,
    var(--gs-bg-muted) 75%
  );
  background-size: 200% 100%;
  animation: gs-shimmer 1.5s ease-in-out infinite;
  border-radius: var(--gs-radius-image);
}

/* Card logo reveal */
.gs-card-tool-logo img {
  opacity: 0;
  transition: opacity var(--gs-duration-slow) var(--gs-ease-out);
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.gs-card-tool-logo img.gs-loaded {
  animation: gs-img-reveal var(--gs-duration-slow) var(--gs-ease-out) 50ms both;
}


/* -- 28.4  GLOBAL NATIVE FOCUS-VISIBLE --------------------- */
a:focus-visible,
button:not(.gs-btn):focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--gs-cp);
  outline-offset: 2px;
  border-radius: var(--gs-radius-xs);
  box-shadow: var(--gs-foc, var(--gs-focus-ring));
}
.gs-nav-link:focus-visible,
.gs-footer-link:focus-visible {
  outline: 2px solid var(--gs-cp);
  outline-offset: 2px;
  border-radius: var(--gs-radius-xs);
}


/* -- 28.5  STAR RATING UTILITIES --------------------------- */
.gs-stars {
  display: inline-flex;
  align-items: center;
  gap: 1px;
  font-size: var(--gs-text-xs);
  color: var(--gs-orange-500, #F97316);
  letter-spacing: 0.5px;
  line-height: 1;
}
.gs-stars-sm { font-size: 0.6875rem; }
.gs-stars-md { font-size: var(--gs-text-sm); }
.gs-stars-lg { font-size: var(--gs-text-base); }
.gs-star-empty { color: var(--gs-neutral-300, #D1D5DB); }
[data-theme="dark"] .gs-star-empty { color: var(--gs-neutral-600, #4B5563); }

.gs-rating-inline {
  display: inline-flex;
  align-items: center;
  gap: var(--gs-space-1_5);
  font-size: var(--gs-text-xs);
  color: var(--gs-tx1, var(--gs-text-secondary));
}
.gs-rating-score {
  font-family: var(--gs-fd);
  font-weight: var(--gs-weight-bold);
  font-size: var(--gs-text-sm);
  color: var(--gs-tx0, var(--gs-text-primary));
  font-variant-numeric: tabular-nums;
}


/* -- 28.6  FLUID SECTION HEADINGS (clamp) ------------------ */
.gs-h1,
.disc-h1 {
  font-size: clamp(2rem, 4.5vw + 0.5rem, 3.5rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.1;
  font-optical-sizing: auto;
}
.gs-blog-h1,
.gs-art-h1 {
  font-size: clamp(1.75rem, 3.5vw + 0.5rem, 2.75rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.15;
}
.gs-cat-h1,
.gs-contact-h1,
.gs-pricing-h1,
.gs-compare-h1,
.gs-404-h1 {
  font-size: clamp(1.75rem, 3vw + 0.5rem, 2.5rem);
  letter-spacing: -0.025em;
  line-height: 1.15;
}

/* Eyebrow labels */
.gs-eyebrow,
.gs-section-eyebrow,
.gs-blog-eyebrow {
  font-size: var(--gs-text-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gs-cp-t, #5B21B6);
  margin-bottom: var(--gs-space-2);
  display: block;
}
[data-theme="dark"] .gs-eyebrow,
[data-theme="dark"] .gs-section-eyebrow,
[data-theme="dark"] .gs-blog-eyebrow { color: var(--gs-cp-t); }

/* Section title — fluid */
.gs-sec-title {
  font-family: var(--gs-fd);
  font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--gs-tx0, var(--gs-text-primary));
}
.gs-sec-title .acc {
  color: var(--gs-cp-t);
  font-style: italic;
}


/* -- 28.7  PROSE & LEAD TEXT QUALITY ----------------------- */
.gs-prose {
  line-height: 1.72;
  letter-spacing: -0.01em;
  max-width: 68ch;
}
.gs-prose p { margin-bottom: var(--gs-space-5); }
.gs-prose > *:last-child { margin-bottom: 0; }

.gs-lead,
.gs-hero-lead,
.disc-hero-lead {
  font-size: clamp(1rem, 1.5vw + 0.25rem, 1.1875rem);
  line-height: 1.65;
  color: var(--gs-tx1, var(--gs-text-secondary));
  letter-spacing: -0.005em;
}


/* -- 28.8  CATEGORY & BENEFIT CARD HOVER CONSISTENCY ------- */
.gs-cat-card {
  transition: box-shadow var(--gs-duration-normal) var(--gs-ease-out),
              border-color var(--gs-duration-normal) var(--gs-ease-out),
              transform var(--gs-duration-normal) var(--gs-ease-out);
}
.gs-cat-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--gs-shlg);
  border-color: var(--gs-cp-b);
}
.gs-cat-card:focus-visible {
  outline: 2px solid var(--gs-cp);
  outline-offset: 2px;
}

.gs-ben-card {
  transition: box-shadow var(--gs-duration-normal) var(--gs-ease-out),
              border-color var(--gs-duration-normal) var(--gs-ease-out),
              transform var(--gs-duration-normal) var(--gs-ease-out);
}
.gs-ben-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--gs-shlg);
  border-color: var(--gs-cp-b);
}


/* -- 28.9  WHY-CARD, STEP & VTESTI HOVER CONSISTENCY ------- */
.gs-why-card:hover {
  box-shadow: var(--gs-shlg);
  border-color: var(--gs-cp-b);
  transform: translateY(-3px);
}
.gs-vtesti:hover {
  box-shadow: var(--gs-shxl, 0 24px 32px rgba(91,33,182,0.12));
  transform: translateY(-2px);
  border-color: var(--gs-cp-b);
}
.gs-dark-stat { transition: transform var(--gs-duration-normal) var(--gs-ease-out); }
.gs-dark-stat:hover { transform: translateY(-2px); }


/* -- 28.10  FORM FIELD CONSISTENCY (auth views) ------------ */
.gs-form-group { gap: var(--gs-space-2); }
.gs-err-msg {
  font-size: var(--gs-text-xs);
  color: var(--gs-error, #DC2626);
  margin-top: var(--gs-space-1);
  display: none;
  line-height: 1.35;
}
.gs-form-group.has-error .gs-err-msg { display: block; }
.gs-form-group.has-error .gs-input,
.gs-form-group.has-error .gs-select {
  border-color: var(--gs-error, #DC2626);
  background-color: var(--gs-status-error-bg, #FEF2F2);
}


/* -- 28.11  SCROLLBAR (webkit) ----------------------------- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: var(--gs-bd2, var(--gs-border-strong));
  border-radius: 9999px;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--gs-cp-b, #DDD6FE);
  background-clip: content-box;
}
[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.15);
  background-clip: content-box;
}
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(167,139,250,0.35);
  background-clip: content-box;
}


/* -- 28.12  PRINT IMPROVEMENTS ----------------------------- */
@media print {
  .gs-card,
  .gs-card-tool,
  .gs-blog-card,
  .gs-pricing-card {
    box-shadow: none !important;
    border: 1px solid #ccc !important;
    break-inside: avoid;
  }
  .gs-navbar,
  .gs-topbar,
  .gs-footer,
  .gs-sidebar,
  .gs-drawer { display: none !important; }
}


/* ============================================================
 * § 29 · PHASE 2 — Navigation, Mega Menu, Drawer, Footer
 * Scope: Header, nav bar, mega menu, mobile drawer, footer.
 * Rules: CSS only — no PHP logic changed; all content/routes
 *        preserved. Removes inline styles via equivalent rules.
 * ============================================================ */

/* ── 29.1  Navbar — scrolled glass state ──────────────────── */
/* goji-main.js Navbar module adds .scrolled when scrollY > 8px */
.gs-navbar.scrolled {
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(12px) saturate(1.4);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
  box-shadow: 0 2px 16px rgba(17, 24, 39, 0.10),
              0 1px 4px  rgba(91, 33, 182, 0.06);
  border-bottom-color: transparent;
}
[data-theme="dark"] .gs-navbar.scrolled {
  background: rgba(15, 23, 42, 0.95);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.28),
              0 1px 4px  rgba(0, 0, 0, 0.20);
}

/* ── 29.2  Navbar — chevron rotation when mega menu open ──── */
/* Replaces inline style="font-size:.65rem" on the chevron icon */
.gs-nav-chevron {
  font-size: .625rem;
  margin-left: .125rem;
  vertical-align: middle;
  transition: transform .22s var(--gs-ease-out, cubic-bezier(.2,.8,.4,1));
}
#gs-nav-trigger[aria-expanded="true"] .gs-nav-chevron {
  transform: rotate(180deg);
}

/* HOT pill — minor vertical rhythm fix */
.gs-nav-pill {
  font-size: .575rem;
  vertical-align: 1px;
}
/* HOT badge → small raised corner badge hugging the "Deals" label (not a wide inline pill) */
.gs-nav-link-hot { position: relative; }
.gs-nav-pill.gs-nav-pill-hot {
  font-size: .5rem;
  font-weight: 800;
  letter-spacing: .04em;
  padding: 1px 4px;
  margin-left: 1px;
  line-height: 1.1;
  vertical-align: top;
  position: relative;
  top: -.5rem;
  background: var(--gs-or-500, #f97316);
  color: #fff;
}

/* ── 29.3  Navbar — logo sizing (replaces inline style) ────── */
.gs-logo-img {
  height: 55px;
  width: auto;
  display: block;
}

/* ── 29.4  Navbar — action buttons sizing normalisation ────── */
/* Overrides the inline height/padding/font-size on .gs-btn-md
   buttons inside .gs-nav-actions without touching PHP */
.gs-nav-actions .gs-btn.gs-btn-md {
  height: 36px;
  padding: 0 1rem;
  font-size: .8125rem;
}

/* ── 29.5  Navbar — search icon button ─────────────────────── */
/* New .gs-nav-search-btn added to nav actions in layout.php */
.gs-nav-search-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: none;
  background: none;
  color: var(--gs-tx1);
  border-radius: var(--gs-rmd);
  cursor: pointer;
  text-decoration: none;
  font-size: .9375rem;
  flex-shrink: 0;
  transition: background .15s, color .15s;
}
.gs-nav-search-btn:hover {
  background: var(--gs-bg2);
  color: var(--gs-tx0);
  text-decoration: none;
}
.gs-nav-search-btn:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
  box-shadow: var(--gs-foc);
  border-radius: var(--gs-rmd);
}
@media (max-width: 991.98px) {
  /* Hide search btn on mobile — drawer has its own search input */
  .gs-nav-search-btn { display: none; }
}

/* ── 29.6  Mega menu — inline style replacements ───────────── */
/* "View all categories" de-emphasis (replaces style="opacity:.85") */
.gs-mega-cat-all {
  opacity: .85;
}
.gs-mega-cat-all:hover,
.gs-mega-cat-all:focus-visible {
  opacity: 1;
}
/* Tool logo fallback span centring (replaces inline flex styles) */
span.gs-mega-tool-logo {
  display: flex;
  align-items: center;
  justify-content: center;
}
/* Accessible focus rings across all mega menu interactive items */
.gs-mega-cat-item:focus-visible,
.gs-mega-subcat-link:focus-visible,
.gs-mega-tool-item:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
  box-shadow: var(--gs-foc);
  border-radius: var(--gs-rmd);
}

/* ── 29.7  Mobile drawer — inline style replacements ─────── */
/* Brand mark & name sizing in drawer (replaces 3 inline styles) */
.gs-drawer .gs-brand-mark {
  width: 30px;
  height: 30px;
  border-radius: 8px;
}
.gs-drawer .gs-brand-mark svg {
  width: 16px;
  height: 16px;
}
.gs-drawer .gs-brand-name {
  font-size: 1.0625rem;
}
/* Ensure 44 px minimum touch target on drawer links */
.gs-drawer-link {
  min-height: 44px;
}
/* Active state for current-page links in drawer
   (goji-main.js Navbar._markActive adds .active class) */
.gs-drawer-link.active {
  background: var(--gs-cp-m);
  color: var(--gs-cp-t);
  font-weight: 600;
}
.gs-drawer-link.active i {
  color: var(--gs-cp);
}
/* Search input transition (focus already sets border-color) */
.gs-drawer-search-inp {
  transition: border-color .15s, box-shadow .15s;
}
/* Section label — tighter tracking */
.gs-drawer-section-label {
  letter-spacing: .09em;
}

/* ── 29.8  Footer — inline style replacements ───────────── */
/* Contact list (replaces the long style= block in layout.php) */
.gs-footer-contact {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  font-size: .875rem;
  color: rgba(255, 255, 255, .6);
}
.gs-footer-contact i {
  opacity: .75;
}
/* Footer grid padding (removes need for Bootstrap pt-5 pb-4) */
.gs-footer-grid {
  padding-top: 3.5rem;
  padding-bottom: 2.5rem;
}
/* Footer social icon — improve touch target & add lift hover */
.gs-footer-soc {
  transition: background .15s, color .15s, transform .15s;
}
.gs-footer-soc:hover {
  transform: translateY(-2px);
}
/* Footer bottom — responsive stacking on small screens */
@media (max-width: 575.98px) {
  .gs-footer-bottom {
    flex-direction: column;
    align-items: center;
    gap: .75rem;
    text-align: center;
    padding-inline: 1rem;
  }
  .gs-footer-legal {
    flex-wrap: wrap;
    justify-content: center;
    gap: .5rem 1rem;
  }
}

/* ── 29.9  Topbar — close button touch target & focus ──────── */
.gs-topbar-close:hover {
  background: rgba(255, 255, 255, .15);
}
.gs-topbar-close:focus-visible {
  outline: 2px solid rgba(255, 255, 255, .7);
  outline-offset: 2px;
  border-radius: var(--gs-rmd);
}


/* ============================================================
 * § 30 · PHASE 3 — Homepage sections
 * Scope: hero, strip, categories, tools grid, benefits,
 *        statistics, testimonials, newsletter, section headers.
 * Rules: CSS only (+ targeted PHP class-swap & inline-style
 *        removals). Content/links/routes unchanged.
 * ============================================================ */

/* ── 30.1  Hero — breathing room ────────────────────────── */
.gs-hero {
  padding: 5.5rem 0 4.5rem;
}
@media (max-width: 767.98px) {
  .gs-hero { padding: 4rem 0 3.5rem; }
}
/* Position context for blobs (replaces inline z-index on container) */
.gs-hero > .gs-container {
  position: relative;
  z-index: 1;
}
/* Blobs — slightly more visible for depth */
.gs-blob { opacity: .14; }
.gs-blob-1 { opacity: .18; width: 480px; height: 480px; }

/* Eyebrow badge — more breathing room */
.gs-eyebrow-badge {
  font-size: .875rem;
  padding: .4rem 1rem;
  margin-bottom: 1.25rem;
}
/* Hero h1 — bolder clamp for large viewports */
.gs-h1 {
  font-size: clamp(2.25rem, 5.5vw, 3.75rem);
  line-height: 1.08;
  margin-bottom: 1.375rem;
}
/* Lead — slightly larger for readability */
.gs-hero-lead {
  font-size: 1.125rem;
  line-height: 1.72;
  max-width: 38rem;
}
/* Search input — smooth hover state */
.gs-hs-input {
  transition: border-color .2s, box-shadow .2s;
}
.gs-hs-input:hover:not(:focus) {
  border-color: var(--gs-cp-b, #DDD6FE);
}
/* CTA ghost button bordered variant (replaces inline border style) */
.gs-btn-ghost-bordered {
  border: 2px solid var(--gs-bd1, #E5E7EB);
}
.gs-btn-ghost-bordered:hover {
  border-color: var(--gs-cp-b, #DDD6FE);
  background: var(--gs-cp-s, #F5F3FF);
  color: var(--gs-cp, #5B21B6);
}
/* Hint chip deal icon (replaces inline color+size) */
.gs-hint-deal-icon {
  color: var(--or-500, #F97316);
  font-size: .6875rem;
}
/* Trust row — refined spacing & stronger signal */
.gs-trust-row {
  gap: 1.5rem;
  margin-top: 1.75rem;
}
.gs-trust-item {
  font-weight: 500;
  font-size: .8125rem;
}
.gs-trust-item i {
  font-size: 1.0625rem;
}
/* Float badges — richer elevation */
.gs-float-badge {
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12), 0 2px 8px rgba(91, 33, 182, .08);
  font-size: .75rem;
  padding: .5rem .95rem;
}
/* Hero dashboard card — deeper shadow */
.gs-dash-card {
  box-shadow: 0 24px 40px rgba(91, 33, 182, .12), 0 8px 16px rgba(17, 24, 39, .07);
}
/* Dash tool logo img (replaces inline style on <img>) */
.gs-dash-tool-logo-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 8px;
}
/* Dash tool info wrapper (replaces inline flex:1;min-width:0) */
.gs-dash-tool-info {
  flex: 1;
  min-width: 0;
}

/* ── 30.2  Social-proof strip ────────────────────────────── */
.gs-strip {
  background: linear-gradient(90deg, #070910 0%, #0f1424 50%, #070910 100%);
  border-top: 1px solid rgba(255, 255, 255, .04);
  border-bottom: 1px solid rgba(255, 255, 255, .04);
  padding: 2.25rem 0;
}
/* Vertical rule between strip items on md+ */
.gs-strip-item {
  position: relative;
}
@media (min-width: 768px) {
  .gs-strip-item + .gs-strip-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 2.5rem;
    background: rgba(255, 255, 255, .07);
  }
}
/* Stat number — bolder visual weight */
.gs-strip-val {
  font-size: 2.125rem;
  letter-spacing: -.04em;
  margin-bottom: .25rem;
}
.gs-strip-lbl {
  font-size: .8125rem;
  letter-spacing: .02em;
  color: rgba(255, 255, 255, .5);
}

/* ── 30.3  Categories section ───────────────────────────── */
/* Cat card — CSS now owns display/height; inline style removed from PHP */
.gs-cat-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}
/* Icon — larger, rounder, animated on hover */
.gs-cat-card .gs-cat-icon {
  width: 52px;
  height: 52px;
  border-radius: .875rem;
  font-size: 1.5rem;
  margin-bottom: 1.125rem;
  transition: background .22s, color .22s, transform .22s;
}
.gs-cat-card:hover .gs-cat-icon {
  background: var(--gs-cp, #5B21B6);
  transform: scale(1.06);
}
/* Name — slightly bolder */
.gs-cat-name { font-size: 1rem; }
.gs-cat-count {
    display: flex;
    align-items: center;
    gap: .3rem;
    font-size: .75rem;
    font-weight: 500;
    color: var(--gs-text-tertiary);
    margin-top: auto;
    padding-top: .5rem;
    transition: color .15s;
}
.gs-cat-card:hover .gs-cat-count { opacity: 1; transform: translateX(0); }
@media (hover: none) {
  /* Always show "Explore" on touch devices */
  .gs-cat-count { opacity: 1; transform: none; color: var(--gs-tx2); font-weight: 500; }
}

/* ── 30.4  Section headers — eyebrow badge style ─────────── */
/* Restore badge treatment on eyebrows inside .gs-sec */
.gs-sec .gs-eyebrow,
.gs-sec-alt .gs-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  background: var(--gs-cp-s, #F5F3FF);
  border: 1px solid var(--gs-cp-b, #DDD6FE);
  border-radius: var(--gs-rf);
  padding: .25rem .875rem;
  font-size: .7rem;
  letter-spacing: .1em;
  margin-bottom: .875rem;
  color: var(--gs-cp-t, var(--gs-cp));
  font-weight: 700;
  text-transform: uppercase;
}
[data-theme="dark"] .gs-sec .gs-eyebrow,
[data-theme="dark"] .gs-sec-alt .gs-eyebrow {
  background: rgba(91, 33, 182, .16);
  border-color: rgba(196, 181, 253, .30);
  color: #C4B5FD;
}
/* "View all" button border refinement */
.gs-sec .gs-btn-ghost.gs-btn-sm,
.gs-sec-alt .gs-btn-ghost.gs-btn-sm {
  border: 1.5px solid var(--gs-bd1);
  font-weight: 600;
  white-space: nowrap;
}
.gs-sec .gs-btn-ghost.gs-btn-sm:hover,
.gs-sec-alt .gs-btn-ghost.gs-btn-sm:hover {
  border-color: var(--gs-cp-b);
  color: var(--gs-cp);
}

/* ── 30.5  Benefits cards ───────────────────────────────── */
/* Left border accent on hover */
.gs-ben-card {
  border-left: 3px solid transparent;
  transition: box-shadow .22s, border-color .22s, transform .22s;
}
.gs-ben-card:hover {
  border-left-color: var(--gs-cp, #5B21B6);
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(91, 33, 182, .09), 0 4px 8px rgba(17, 24, 39, .05);
}
/* Icon — slightly larger */
.gs-ben-icon {
  width: 56px;
  height: 56px;
  border-radius: 1rem;
  margin-bottom: 1.25rem;
}

/* ── 30.6  Statistics section ───────────────────────────── */
/* Container z-index (replaces inline style) */
.gs-container-rel {
  position: relative;
  z-index: 1;
}
/* Stats section title light variant */
.gs-sec-title-light { color: #fff; }

/* Dark section — richer background + radial glow */
.gs-sec-dark {
  background: linear-gradient(140deg, #060610 0%, #0d1128 50%, #060810 100%);
  position: relative;
  overflow: hidden;
}

/* Stat numbers in dark section — display size */
.gs-sec-dark .gs-stat-num {
  font-size: clamp(2rem, 4.5vw, 3.25rem);
  font-family: var(--gs-fd, 'Plus Jakarta Sans', sans-serif);
  letter-spacing: -.04em;
  display: block;
  line-height: 1;
  margin-bottom: .375rem;
}
.gs-sec-dark .gs-stat-lbl {
  font-size: .8125rem;
  letter-spacing: .04em;
  font-weight: 500;
}
/* Stat card in dark section — dividers */
.gs-sec-dark .gs-stat-card {
  padding: 2.5rem 1rem 2rem;
  text-align: center;
}
@media (min-width: 768px) {
  .gs-sec-dark .gs-stat-card { border-right: 1px solid rgba(255, 255, 255, .07); }
  .gs-sec-dark .col-md-3:last-child .gs-stat-card { border-right: none; }
}
@media (max-width: 767.98px) {
  .gs-sec-dark .gs-stat-card { border-bottom: 1px solid rgba(255, 255, 255, .07); }
  .gs-sec-dark .col-6:nth-child(odd) .gs-stat-card { border-right: 1px solid rgba(255, 255, 255, .07); }
}

/* ── 30.7  Testimonials ──────────────────────────────────── */
/* Card — stronger hover lift */
.gs-testi {
  transition: transform .22s, box-shadow .22s, border-color .22s;
}
.gs-testi:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 32px rgba(91, 33, 182, .11), 0 6px 12px rgba(17, 24, 39, .06);
  border-color: var(--gs-cp-b, #DDD6FE);
}
/* Stars — slightly bigger */
.gs-testi-stars i { font-size: .9375rem; }
/* Quote — slightly larger */
.gs-testi-quote { font-size: .9375rem; line-height: 1.7; }
/* Quote open mark — more prominent */
.gs-testi-quote::before {
  font-size: 3rem;
  opacity: .25;
  color: var(--gs-cp, #5B21B6);
}
/* Name — tighter tracking */
.gs-testi-name { letter-spacing: -.01em; }

/* ── 30.8  Newsletter section ────────────────────────────── */
/* Richer gradient */
.gs-nl-sec {
  background: linear-gradient(140deg, #3B0D8F 0%, #5B21B6 45%, #3B21B6 100%);
  padding: 5.5rem 0;
}
/* Eyebrow in NL section */
.gs-nl-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .25rem .875rem;
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: var(--gs-rf);
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .85);
  margin-bottom: 1rem;
}
/* Benefits list items — flex alignment for icon + text */
.gs-nl-benefits li {
  display: flex;
  align-items: flex-start;
  gap: .625rem;
  font-size: .9375rem;
  color: rgba(255, 255, 255, .88);
  line-height: 1.6;
  margin-bottom: .625rem;
}
.gs-nl-benefits li i {
  color: #4ADE80;
  flex-shrink: 0;
  margin-top: 3px;
  font-size: 1rem;
}
/* Form wrap — deeper glass effect */
.gs-nl-form-wrap {
  background: rgba(255, 255, 255, .10);
  border: 1px solid rgba(255, 255, 255, .22);
  box-shadow: 0 8px 40px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .15);
  border-radius: var(--gs-rxl);
  padding: 2.25rem;
}
/* Newsletter form layout */
.gs-nl-form {
  background: none;
  border: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
/* Submit button — correct styling (gs-nl-sub was the subtitle text class) */
.gs-nl-sub-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  width: 100%;
  height: 50px;
  border: none;
  border-radius: var(--gs-rf);
  background: #fff;
  color: #5B21B6;
  font-family: var(--gs-fd);
  font-weight: 700;
  font-size: 1rem;
  cursor: pointer;
  transition: background .18s, box-shadow .18s, transform .12s;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .18);
}
.gs-nl-sub-btn:hover {
  background: #F5F3FF;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .24);
  transform: translateY(-1px);
}
.gs-nl-sub-btn:active { transform: translateY(0); }
/* Disclaimer */
.gs-nl-disclaimer {
  font-size: .75rem;
  color: rgba(255, 255, 255, .48);
  line-height: 1.5;
  text-align: center;
}
.gs-nl-disclaimer a {
  color: rgba(255, 255, 255, .65);
  text-decoration: underline;
}
.gs-nl-disclaimer a:hover { color: #fff; }

/* ── 30.9  Dark overlay (gs-dark-overlay in stats section) ── */
/* Already defined earlier; enhance the dark section overlay */
.gs-sec-dark .gs-dark-overlay {
  background: none;
}
.gs-sec-dark .gs-dark-overlay::before {
  top: -100px;
  left: -80px;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(91, 33, 182, .22) 0%, transparent 70%);
}
.gs-sec-dark .gs-dark-overlay::after {
  bottom: -80px;
  right: -60px;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, rgba(61, 139, 55, .15) 0%, transparent 70%);
}

/* ── 30.10  Section consistency ──────────────────────────── */
/* Consistent section padding for all homepage sections */
.gs-sec, .gs-sec-alt { padding: 5.5rem 0; }
@media (max-width: 767.98px) {
  .gs-sec, .gs-sec-alt { padding: 4rem 0; }
}
/* Section title sizing */
.gs-sec-title {
  font-size: clamp(1.625rem, 3vw, 2.375rem);
  letter-spacing: -.032em;
  line-height: 1.15;
}
/* Dark section padding */
.gs-sec-dark { padding: 5.5rem 0; }
@media (max-width: 767.98px) { .gs-sec-dark { padding: 4rem 0; } }


/* ============================================================
 * § 31 · PHASE 4 — Listing, Category, Search, Compare, Deals
 * Scope: tool cards, filters, sort/view toggle, pagination,
 *        sub-category strip, compare table, CTAs, empty states.
 * Rules: CSS only (+ targeted class-swap / inline-style removal
 *        in PHP views). Content/routes/PHP logic unchanged.
 * ============================================================ */

/* ── 31.1  Tool card — visual improvements ───────────────── */

/* Equal-width footer buttons (replaces style="flex:1") */
.gs-card-tool-footer .gs-ct-action { flex: 1; }

/* Category label — pill badge treatment */
.gs-card-tool .gs-card-tool-cat {
  display: inline-flex;
  align-items: center;
  font-size: .6875rem;
  font-weight: 600;
  color: var(--gs-cp-t, var(--gs-cp));
  background: var(--gs-cp-s, #F5F3FF);
  border-radius: var(--gs-rf);
  padding: .15rem .55rem;
  line-height: 1.4;
  max-width: 13rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-theme="dark"] .gs-card-tool .gs-card-tool-cat {
  background: rgba(91, 33, 182, .18);
  color: #C4B5FD;
}

/* Stars — slightly larger for readability */
.gs-card-tool-stars { font-size: .875rem; letter-spacing: 1.5px; }

/* Price — stronger visual weight */
.gs-card-tool-price { font-size: .8125rem; font-weight: 600; color: var(--gs-tx1); }

/* Free price — green badge */
.gs-card-tool-price-free {
  color: var(--gs-cs, #15803D);
  background: rgba(21, 128, 61, .09);
  border-radius: var(--gs-rf);
  padding: .1rem .5rem;
  font-weight: 700;
}
[data-theme="dark"] .gs-card-tool-price-free {
  background: rgba(74, 222, 128, .12);
  color: #4ADE80;
}

/* Paid price — same weight, primary ink */
.gs-card-tool-price-paid {
  color: var(--gs-tx0);
  font-weight: 700;
}

/* Description — clamp enforced */
.gs-card-tool-desc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Focus-within ring for keyboard users */
.gs-card-tool:focus-within {
  border-color: var(--gs-cp-b);
  box-shadow: 0 0 0 3px rgba(91, 33, 182, .12);
}

/* ── 31.2  Page hero — listings & search ────────────────── */

/* More breathing room + subtle gradient */
.disc-hero {
  padding: 2.75rem 0 2.25rem;
  background: linear-gradient(180deg, var(--gs-bg1, #F9FAFB) 0%, var(--gs-bg0, #fff) 100%);
}
[data-theme="dark"] .disc-hero {
  background: linear-gradient(180deg, var(--gs-bg2) 0%, var(--gs-bg0) 100%);
}

/* H1 — tighter tracking, bolder clamp */
.disc-h1 {
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  letter-spacing: -.035em;
}

/* Lead — slightly larger */
.disc-hero-lead { font-size: 1.0625rem; }

/* ── 31.3  Results bar & listing container ───────────────── */

/* Bottom padding (replaces style="padding-bottom:4rem") */
.gs-listing-body { padding-bottom: 4rem; }

/* Results / sort bar — used by listing.php & search.php */
.gs-listing-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem .75rem;
  padding: 1.125rem 0;
  border-bottom: 1px solid var(--gs-bd0);
  margin-bottom: 1.5rem;
}
/* Smaller variant for search (no sort controls) */
.gs-listing-bar.gs-listing-bar-sm { padding: .875rem 0; margin-bottom: 1.25rem; }

/* ── 31.4  Filter / sort toolbar enhancements ────────────── */

/* Filter bar — background card for contrast */
.gs-filter-bar {
  background: var(--gs-sf0);
  border-radius: var(--gs-rlg);
  border: 1px solid var(--gs-bd0);
  padding: .75rem 1.25rem;
  margin-top: .25rem;
  margin-bottom: 1.5rem;
  border-bottom: none; /* override the hairline-only default */
}
[data-theme="dark"] .gs-filter-bar { background: var(--gs-bg1); }

/* Sort select — refined */
.gs-sort-select {
  background-color: var(--gs-bg0);
  border-radius: var(--gs-rmd);
  font-size: .8125rem;
  color: var(--gs-tx0);
  transition: border-color .15s, box-shadow .15s;
  cursor: pointer;
}
.gs-sort-select:hover { border-color: var(--gs-cp-b); }
.gs-sort-select:focus { border-color: var(--gs-cp); box-shadow: var(--gs-foc); outline: none; }

/* View toggle — cleaner */
.gs-view-toggle {
  background: var(--gs-bg0);
  border: 1px solid var(--gs-bd1);
  border-radius: var(--gs-rmd);
  padding: 3px;
}
.gs-vt-btn {
  width: 34px;
  height: 30px;
  border-radius: calc(var(--gs-rmd) - 2px);
  font-size: .875rem;
  transition: background .15s, color .15s;
}
.gs-vt-btn.active {
  background: var(--gs-cp-s);
  color: var(--gs-cp);
  box-shadow: 0 1px 4px rgba(91, 33, 182, .15);
}

/* ── 31.5  Sub-category strip ────────────────────────────── */

/* Sticky under navbar when scrolling */
.gs-subcat-strip {
  position: sticky;
  top: var(--gs-navbar-height, 4rem);
  z-index: 90;
  background: var(--gs-bg0);
  border-top: 1px solid var(--gs-bd0);
  border-bottom: 1px solid var(--gs-bd0);
  padding: .625rem 0;
  margin-bottom: 0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
}
[data-theme="dark"] .gs-subcat-strip { background: var(--gs-bg1); }

/* Inner wrapper — horizontal scroll on mobile, wrap on desktop */
.gs-subcat-inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: .375rem;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 1px;
}
.gs-subcat-inner::-webkit-scrollbar { display: none; }
@media (min-width: 768px) {
  .gs-subcat-inner { flex-wrap: wrap; overflow-x: visible; }
}

/* Chip — improved spacing, transitions */
.gs-subcat-chip {
  padding: .375rem 1rem;
  font-size: .8125rem;
  font-weight: 500;
  white-space: nowrap;
  flex-shrink: 0;
  transition: border-color .15s, background .15s, color .15s;
  cursor: pointer;
}
.gs-subcat-chip:hover {
  background: var(--gs-cp-s);
  border-color: var(--gs-cp-b);
  color: var(--gs-cp-t, var(--gs-cp));
  text-decoration: none;
}
/* Active state — filled pill */
.gs-subcat-chip.active {
  background: var(--gs-cp);
  border-color: var(--gs-cp);
  color: #fff;
  font-weight: 600;
}
.gs-subcat-chip.active:hover { background: var(--gs-cp-t); }
[data-theme="dark"] .gs-subcat-chip { background: var(--gs-bg2); border-color: var(--gs-bd1); color: var(--gs-tx1); }
[data-theme="dark"] .gs-subcat-chip:hover { background: rgba(91, 33, 182, .2); border-color: rgba(167, 139, 250, .4); color: #C4B5FD; }
[data-theme="dark"] .gs-subcat-chip.active { background: var(--gs-cp); border-color: var(--gs-cp); color: #fff; }

/* Sub-category chip count */
.gs-subcat-chip-count { font-size: .75rem; opacity: .7; margin-left: .25rem; }

/* ── 31.6  Category page hero ────────────────────────────── */

/* Cat hero container z-index now via gs-container-rel (defined in §30.6) */

/* More padding */
.gs-cat-hero { padding: 2.75rem 0 2.25rem; }

/* Category search form — wider max */
.gs-cat-search-form { max-width: 38rem; }
.gs-cat-search-input { height: 48px; font-size: .9375rem; }

/* Tool grid top spacing (replaces style="margin-top:1.5rem") */
.gs-tool-grid-wrap { margin-top: 1.5rem; }

/* ── 31.7  Pagination ────────────────────────────────────── */

.gs-pagination-center {
  justify-content: center;
  margin-top: 2.5rem;
}
.gs-page-btn {
  min-width: 2.25rem;
  height: 2.25rem;
  font-size: .875rem;
  font-weight: 600;
  border-radius: var(--gs-rmd);
  transition: background .15s, border-color .15s, color .15s, transform .1s, box-shadow .15s;
}
.gs-page-btn:hover:not(.active):not([aria-disabled="true"]) {
  border-color: var(--gs-cp-b);
  color: var(--gs-cp);
  transform: translateY(-1px);
}
.gs-page-btn.active {
  box-shadow: 0 2px 8px rgba(91, 33, 182, .28);
}

/* ── 31.8  Empty state icon ──────────────────────────────── */

/* Replaces inline style="font-size:2.5rem;color:var(--gs-tx2)" on icons */
.gs-empty-icon {
  font-size: 2.5rem;
  color: var(--gs-tx2);
  display: block;
  margin-bottom: .25rem;
}

/* ── 31.9  Compare page ──────────────────────────────────── */

/* Quick-suggestion chips (replace inline height/font/padding/radius) */
.gs-cmp-chip {
  height: 28px;
  font-size: .75rem;
  padding: 0 .625rem;
  border-radius: var(--gs-rf);
  font-weight: 600;
  transition: background .15s, border-color .15s, color .15s, transform .1s;
}
.gs-cmp-chip:hover {
  background: var(--gs-cp-s);
  border-color: var(--gs-cp-b);
  color: var(--gs-cp-t, var(--gs-cp));
  transform: translateY(-1px);
}

/* "Try:" label (replaces inline style) */
.gs-cmp-try-label {
  font-size: .75rem;
  font-weight: 600;
  color: var(--gs-tx2);
  align-self: center;
  flex-shrink: 0;
}

/* Compare Now button — full width (replaces style="width:100%;white-space:nowrap") */
.gs-cmp-go-btn { width: 100%; white-space: nowrap; }

/* Compare table — alternating row tint for readability */
.cmp-table tbody tr:nth-child(even) td {
  background: var(--gs-bg1);
}
.cmp-table tbody tr:nth-child(even) td.cmp-col-hl {
  background: rgba(91, 33, 182, .055);
}
[data-theme="dark"] .cmp-table tbody tr:nth-child(even) td { background: var(--gs-bg2); }
[data-theme="dark"] .cmp-table tbody tr:nth-child(even) td.cmp-col-hl { background: rgba(109, 40, 217, .12); }

/* Column label column — narrower min-width on mobile */
@media (max-width: 575.98px) {
  .cmp-table th:first-child,
  .cmp-table td:first-child { min-width: 120px; }
  .cmp-table-wrap { border-radius: var(--gs-rmd); }
}

/* Check/cross icons — slightly larger */
.cmp-check-yes { font-size: 1.25rem; }
.cmp-check-no  { font-size: 1.125rem; opacity: .45; }

/* Compare builder — more elevation */
.cmp-builder {
  box-shadow: 0 8px 32px rgba(91, 33, 182, .10), 0 2px 8px rgba(17, 24, 39, .05);
}

/* VS badge — branded */
.cmp-vs-badge {
  width: 40px;
  height: 40px;
  background: var(--gs-cp-s);
  border-color: var(--gs-cp-b);
  color: var(--gs-cp-t, var(--gs-cp));
  font-size: .75rem;
}

/* Popular comparison cards — logo scale on hover */
.cmp-card-logo { transition: transform .2s; }
.cmp-card:hover .cmp-card-logo { transform: scale(1.08); }

/* CTA section — taller, stronger presence */
.cmp-cta { padding: 5rem 0; }
@media (max-width: 767.98px) { .cmp-cta { padding: 3.5rem 0; } }

/* Compare sections — more breathing room */
.cmp-section { padding: 4rem 0; }
@media (max-width: 767.98px) { .cmp-section { padding: 2.75rem 0; } }

/* Hero — taller */
.cmp-hero { padding: 4rem 0 3.5rem; }
@media (max-width: 767.98px) { .cmp-hero { padding: 2.75rem 0 2.25rem; } }

/* ── 31.10  CTA visibility — dark-section & page CTAs ────── */

/* White buttons in dark sections — bolder */
.gs-btn-white {
  font-weight: 700;
  letter-spacing: -.01em;
  transition: background .18s, box-shadow .18s, transform .12s;
}
.gs-btn-white:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
  transform: translateY(-1px);
}
.gs-btn-white:active { transform: translateY(0); }

/* Outline ghost variant on dark — clearer border */
.gs-btn-white-outline {
  font-weight: 600;
  transition: background .18s, transform .12s;
}
.gs-btn-white-outline:hover {
  background: rgba(255, 255, 255, .14);
  transform: translateY(-1px);
}

/* CTA Compare Now align with view — remove button stretches on mobile */
@media (max-width: 575.98px) {
  .gs-cmp-go-btn { width: 100%; }
}

/* Deals listing — hint badge (for future use via PHP class addition) */
.gs-deal-badge {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .2rem .625rem;
  background: rgba(249, 115, 22, .12);
  color: var(--or-500, #F97316);
  border-radius: var(--gs-rf);
  font-size: .6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
}


/* ============================================================
 * § 32 · MEGA MENU v2 + MOBILE DRAWER TWO-PANEL
 * Fixes: button-based Zone A tabs, 3-col subcats, panel header,
 * two-panel sliding mobile drawer with category browser.
 * ============================================================ */

/* ── 32.1  Zone A — button reset (now <button> not <a>) ──── */
button.gs-mega-cat-item {
  width: 100%;
  border: none;
  background: none;
  font-family: inherit;
  text-align: left;
}
.gs-mega-cat-name  { flex: 1; min-width: 0; }
.gs-mega-cat-arrow {
  font-size: .7rem;
  flex-shrink: 0;
  color: var(--gs-tx2);
  margin-left: auto;
  transition: color .15s;
  pointer-events: none;
}
.gs-mega-cat-item.active .gs-mega-cat-arrow { color: var(--gs-cp-t); }
/* "All Categories" link — slightly de-emphasised */
.gs-mega-cat-all-link {
  margin-top: .5rem;
  padding-top: .5rem;
  border-top: 1px solid var(--gs-bd0);
  opacity: .8;
}
.gs-mega-cat-all-link:hover,
.gs-mega-cat-all-link:focus-visible { opacity: 1; }

/* ── 32.2  Zone B — panel header ─────────────────────────── */
.gs-mega-panel-hd {
  margin-bottom: 1.125rem;
  padding-bottom: .875rem;
  border-bottom: 1px solid var(--gs-bd0);
}
.gs-mega-panel-hd-top {
  display: flex;
  align-items: center;
  gap: .625rem;
  flex-wrap: wrap;
}
.gs-mega-panel-badge {
  display: inline-flex;
  align-items: center;
  gap: .3125rem;
  background: var(--gs-cp-s);
  color: var(--gs-cp-t);
  font-size: .6875rem;
  font-weight: 700;
  padding: .2rem .5625rem;
  border-radius: var(--gs-rf);
  letter-spacing: .02em;
  text-transform: uppercase;
}
.gs-mega-panel-count {
  font-size: .75rem;
  color: var(--gs-tx2);
  font-weight: 500;
}
.gs-mega-panel-link {
  font-size: .8125rem;
  font-weight: 600;
  color: var(--gs-cp-t);
  text-decoration: none;
  margin-left: auto;
  white-space: nowrap;
  flex-shrink: 0;
}
.gs-mega-panel-link:hover { text-decoration: underline; }
.gs-mega-panel-desc {
  margin: .375rem 0 0;
  font-size: .8125rem;
  color: var(--gs-tx2);
  line-height: 1.5;
}

/* Bullet dot for text-only subcategories (no icon stored) */
.gs-mega-subcat-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--gs-tx2);
  flex-shrink: 0;
  transition: background .15s;
}
.gs-mega-subcat-link:hover .gs-mega-subcat-dot { background: var(--gs-cp); }

/* ── 32.4  Zone C — featured tools improvements ─────────── */
.gs-mega-tool-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
}
.gs-mega-tool-logo-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gs-tx2);
}
/* "Browse all tools" link at foot of Zone C */
.gs-mega-browse-all {
  display: flex;
  align-items: center;
  gap: .375rem;
  font-size: .8125rem;
  font-weight: 600;
  color: var(--gs-cp-t);
  text-decoration: none;
  padding: .5rem .25rem;
  margin-top: .5rem;
  border-top: 1px solid var(--gs-bd0);
  transition: opacity .15s;
}
.gs-mega-browse-all:hover { opacity: .75; text-decoration: none; }

/* ── 32.5  Mobile drawer — two-panel sliding track ──────── */
.gs-drawer-track {
  display: flex;
  flex: 1;
  min-height: 0;
  /* each screen is 100% wide; track width = 200% so both fit */
  transition: transform .3s cubic-bezier(.4, 0, .2, 1);
  will-change: transform;
}
.gs-drawer-track.is-cats { transform: translateX(-50%); }

/* Each screen exactly fills the drawer width */
.gs-drawer-screen {
  flex: 0 0 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
/* Screen 1 body keeps the existing scrollable drawer-body */
.gs-drawer-screen .gs-drawer-body {
  flex: 1;
  overflow-y: auto;
}

/* ── 32.6  Categories browser header (screen 2 top) ─────── */
.gs-drawer-cats-header {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .375rem .875rem .375rem .375rem;
  border-bottom: 1px solid var(--gs-bd0);
  flex-shrink: 0;
  font-weight: 600;
  font-size: .9375rem;
  color: var(--gs-tx0);
  min-height: 48px;
}
.gs-drawer-back {
  display: inline-flex;
  align-items: center;
  gap: .3125rem;
  background: none;
  border: none;
  padding: .375rem .625rem;
  border-radius: var(--gs-rmd);
  font-size: .875rem;
  font-weight: 500;
  color: var(--gs-cp-t);
  cursor: pointer;
  font-family: inherit;
  transition: background .12s;
  min-height: 40px;
}
.gs-drawer-back:hover { background: var(--gs-cp-s); }

/* Split pane: left tabs + right subcategory list */
.gs-drawer-cats-wrap {
  display: flex;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.gs-drawer-cat-tabs {
  width: 130px;
  flex-shrink: 0;
  border-right: 1px solid var(--gs-bd0);
  overflow-y: auto;
  padding: .375rem 0;
  scrollbar-width: thin;
  scrollbar-color: var(--gs-bd0) transparent;
}
.gs-drawer-cat-tab {
  display: flex;
  align-items: center;
  gap: .4375rem;
  width: 100%;
  padding: .625rem .625rem .625rem .75rem;
  border: none;
  border-left: 2px solid transparent;
  background: none;
  font-family: inherit;
  font-size: .8125rem;
  font-weight: 500;
  color: var(--gs-tx1);
  text-align: left;
  cursor: pointer;
  transition: background .1s, color .1s;
  line-height: 1.3;
}
.gs-drawer-cat-tab:hover { background: var(--gs-bg2); color: var(--gs-tx0); }
.gs-drawer-cat-tab.active {
  background: var(--gs-cp-s);
  color: var(--gs-cp-t);
  border-left-color: var(--gs-cp);
  font-weight: 600;
}
.gs-drawer-cat-tab i { font-size: .8125rem; flex-shrink: 0; width: .875rem; text-align: center; }

/* Sub-category panel column */
.gs-drawer-subcat-wrap {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--gs-bd0) transparent;
}
.gs-drawer-subcat-pane { display: none; padding: .375rem .5rem; }
.gs-drawer-subcat-pane.active { display: block; }
.gs-drawer-subcat-link {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem .625rem;
  border-radius: var(--gs-rmd);
  font-size: .8125rem;
  font-weight: 400;
  color: var(--gs-tx1);
  text-decoration: none;
  min-height: 36px;
  transition: background .1s, color .1s;
}
.gs-drawer-subcat-link:hover { background: var(--gs-cp-s); color: var(--gs-cp-t); text-decoration: none; }
/* "View all" link pinned at top */
.gs-drawer-subcat-link-view {
  font-weight: 600;
  color: var(--gs-cp-t);
  border-bottom: 1px solid var(--gs-bd0);
  border-radius: 0;
  padding-bottom: .625rem;
  margin-bottom: .25rem;
  min-height: auto;
}
.gs-drawer-subcat-link-view:hover { background: none; opacity: .8; }
.gs-drawer-subcat-link-view i { color: var(--gs-cp); font-size: .875rem; }

/* ── 32.7  "Browse Categories" trigger button in screen 1 ── */
.gs-drawer-cats-btn {
  display: flex;
  align-items: center;
  gap: .75rem;
  width: 100%;
  padding: .625rem .875rem;
  border-radius: var(--gs-rmd);
  border: none;
  background: none;
  font-family: inherit;
  font-size: .9375rem;
  font-weight: 500;
  color: var(--gs-tx1);
  text-align: left;
  cursor: pointer;
  min-height: 44px;
  transition: background .12s, color .12s;
}
.gs-drawer-cats-btn:hover { background: var(--gs-cp-s); color: var(--gs-cp-t); text-decoration: none; }
.gs-drawer-cats-btn i.gs-drw-icon { color: var(--gs-tx2); font-size: 1rem; width: 1.125rem; text-align: center; flex-shrink: 0; }
.gs-drawer-cats-btn:hover i.gs-drw-icon { color: var(--gs-cp); }
.gs-drawer-cats-btn i.gs-drw-arrow { font-size: .75rem; margin-left: auto; flex-shrink: 0; color: var(--gs-tx2); }
.gs-drawer-cats-btn:hover i.gs-drw-arrow { color: var(--gs-cp); }

/* ── 32.8  Responsive — hide Zone C at medium widths ─────── */
@media (max-width: 1199.98px) {
  .gs-mega-featured { display: none; }
  .gs-mega-subcats  { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1023.98px) {
  /* Tighter Zone A at 1024px breakpoint */
  .gs-mega-cats { width: 12rem; }
}


/* ============================================================
 * § 33 · PHASE 5b — Header & Mega Menu Refinements
 * Fixes: hover, max-width 1100px, Zone-A compactness, navbar
 * shadow, nav-promo styling, mobile drawer slide direction,
 * sticky header shadow, category descriptions.
 * ============================================================ */

/* ── 33.1  Navbar — remove default shadow; clean sticky ─── */
.gs-navbar {
  box-shadow: none;
  border-bottom: 1px solid var(--gs-bd0);
}
/* Subtle shadow appears only after scrolling */
.gs-navbar.scrolled {
  background: rgba(255, 255, 255, 0.97) !important;
  backdrop-filter: blur(14px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.5) !important;
  box-shadow: 0 2px 20px rgba(17, 24, 39, .08) !important;
  border-bottom-color: transparent !important;
}
[data-theme="dark"] .gs-navbar.scrolled {
  background: rgba(9, 9, 11, 0.95) !important;
  box-shadow: 0 2px 20px rgba(0, 0, 0, .35) !important;
}

/* Animated dot indicator */
.gs-topbar::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22c55e;
    flex-shrink: 0;
    animation: gs-promo-pulse 2s infinite;
}

@keyframes gs-promo-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255,255,255,.7);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(255,255,255,0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255,255,255,0);
    }
}
.gs-topbar-msg {
  margin: 0;
  font-weight: 500;
  line-height: 1.5;
  margin-left:10px;
}
.gs-topbar-msg strong { font-weight: 700; }
.gs-topbar-close {
  position: absolute;
  right: .75rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: .3125rem;
  color: var(--gs-tx2);
  cursor: pointer;
  display: flex;
  align-items: center;
  border-radius: var(--gs-rsm, .375rem);
  font-size: .875rem;
  line-height: 1;
  transition: background .12s, color .12s;
}
.gs-topbar-close:hover { background: var(--gs-bg2); color: var(--gs-tx0); }
.gs-mega-menu.open {
  transform: translateX(-50%) translateY(0);
}

/* ── 33.4  Mega menu — Zone A compact sidebar ───────────── */
.gs-mega-cats-label {
  display: block;
  font-size: .6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--gs-tx2);
  padding: .75rem .875rem .375rem;
}
/* Shrink sidebar + items */
.gs-mega-cats {
  width: 13rem;
  padding-block: .25rem .5rem;
}
.gs-mega-cat-item {
  padding: .4375rem .75rem;
  font-size: .8125rem;
  gap: .5rem;
}
.gs-mega-cat-icon {
  font-size: .9375rem;
  width: 1rem;
  flex-shrink: 0;
  width: 1.25rem;
  color:var(--gs-purple-800)
}
/* "All Categories" footer link */
.gs-mega-cat-all-link { margin-top: .375rem; }

/* ── 33.5  Mega menu — panel description clean rendering ── */
.gs-mega-panel-desc {
  /* Description text is extracted from HTML with strip_tags */
  font-size: .8125rem;
  color: var(--gs-tx2);
  line-height: 1.55;
  margin-top: .375rem;
  margin-bottom: 0;
}

/* ── 33.6  Mobile drawer — correct slide (100% not 50%) ─── */
/* Two screens inside track: each screen = 100% of drawer.
   translateX(-100%) shifts track by its full width = one screen. */
.gs-drawer-track { overflow: visible; }  /* parent drawer clips */
.gs-drawer-track.is-cats { transform: translateX(-100%) !important; }

/* ── 33.7  Responsive mega menu — full-width on < 992px ─── */
/* Mega menu doesn't show on mobile, but ensure 1100px cap */
@media (max-width: 1119.98px) {
  .gs-mega-menu { width: calc(100vw - 1.5rem); }
}

/* Zone A — category sidebar, fills the left edge */
.gs-mega-cats {
  width: 14.5rem;
  background: var(--gs-sf1);
  border-right: 1px solid var(--gs-bd0);
  padding: .875rem .625rem;
  display: flex; flex-direction: column; gap: 1px;
}
.gs-mega-cats-label { padding: .25rem .625rem .5rem; }
.gs-mega-cat-item {
  padding: .5rem .625rem;
  border-radius: 9px;
  border-left: none;               /* drop the old left-bar look */
  font-size: .8125rem;
  color: var(--gs-tx1);
}
.gs-mega-cat-item:hover { background: var(--gs-bg2); color: var(--gs-tx0); }
.gs-mega-cat-item.active {
  background: var(--gs-cp-s);
  color: var(--gs-cp-t);
  font-weight: 600;
  border-left: none;
}
.gs-mega-cat-item.active .gs-mega-cat-arrow { color: var(--gs-cp); }
.gs-mega-cat-arrow { margin-left: auto; font-size: .7rem; opacity: .6; transition: transform .15s; }
.gs-mega-cat-item.active .gs-mega-cat-arrow { opacity: 1; transform: translateX(2px); }
.gs-mega-cat-all-link {
  margin-top: .375rem; padding-top: .625rem;
  border-top: 1px solid var(--gs-bd0);
  color: var(--gs-cp-t); font-weight: 600;
}

/* Zone B — content, comfortable padding */
.gs-mega-content { padding: 1.375rem 1.5rem; }
.gs-mega-panel-hd { margin-bottom: 1rem; padding-bottom: .875rem; border-bottom: 1px solid var(--gs-bd0); }
.gs-mega-panel-badge { font-size: .9375rem; font-weight: 700; color: var(--gs-tx0); display: inline-flex; align-items: center; gap: .4rem; }
.gs-mega-panel-badge i { color: var(--gs-cp); }
.gs-mega-panel-count { font-size: .75rem; color: var(--gs-tx2); margin-left: .625rem; }
.gs-mega-panel-link { margin-left: auto; font-size: .8125rem; font-weight: 600; color: var(--gs-cp-t); }
.gs-mega-panel-desc { margin: .5rem 0 0; }

/* 3-column subcategory grid — clean rows with rounded hover */
.gs-mega-subcat-link:hover { background: var(--gs-cp-s); color: var(--gs-cp-t); }
.gs-mega-subcat-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--gs-bd2, #cbd5e1); flex-shrink: 0; transition: background .15s; }
.gs-mega-subcat-link:hover .gs-mega-subcat-dot { background: var(--gs-cp); }

/* Zone C — featured, fills the right edge */
.gs-mega-featured {
  width: 17rem;
  background: var(--gs-sf1);
  border-left: 1px solid var(--gs-bd0);
  padding: 1.375rem 1.125rem;
}
.gs-mega-tool-item { border-radius: 9px; }
.gs-mega-tool-item:hover { background: var(--gs-bg2); }
.gs-mega-browse-all {
  display: inline-flex; align-items: center; gap: .35rem;
  margin-top: .75rem; padding: .5rem .25rem;
  font-size: .8125rem; font-weight: 600; color: var(--gs-cp-t); text-decoration: none;
}
.gs-mega-browse-all:hover { text-decoration: underline; }

/* ── Sticky header (ALL screens, incl. mobile) ──
   <header> wraps only the bar, so position:sticky on .gs-navbar un-sticks once
   the short header scrolls out of view. display:contents removes the header box
   so the navbar's sticky containing block becomes <body> (full page) → it pins.
   The mobile drawer/backdrop are position:fixed, so they're unaffected. */
header { display: contents; }

/* Smooth sticky navbar — refined scrolled state */
.gs-navbar { transition: box-shadow .25s ease, background .25s ease, border-color .25s ease; }
.gs-navbar.scrolled {
  background: var(--gs-sf0);
  box-shadow: 0 4px 22px -6px rgba(17, 24, 39, .12);
  border-bottom-color: transparent;
}
[data-theme="dark"] .gs-navbar.scrolled { background: var(--gs-sf0); box-shadow: 0 4px 22px -6px rgba(0,0,0,.45); }

/* ============================================================
 * Dashboard sidebar fixes — collapse button visibility + mobile drawer
 * ============================================================ */
.gs-sb-foot-actions { display: flex; align-items: center; gap: .5rem; }
.gs-sb-foot-actions .gs-sb-footer-link { flex: 1; }
/* clearer collapse button (it now lives in the footer, next to Log Out) */
.gs-sb-collapse-btn { width: 2rem; height: 2rem; border: 1px solid var(--gs-border-default); }
/* when collapsed: stack the footer actions so the collapse button is fully visible + centered */
.gs-sidebar.collapsed .gs-sb-foot-actions { flex-direction: column; gap: .45rem; }
.gs-sidebar.collapsed .gs-sb-foot-actions .gs-sb-footer-link { flex: none; width: 100%; justify-content: center; }
.gs-sidebar.collapsed .gs-sb-collapse-btn { width: 2.25rem; height: 2.25rem; margin: 0 auto; color: var(--gs-cp); border-color: var(--gs-cp); }

/* Mobile: the drawer is always full-width — never apply the desktop "collapsed"
   (icon-only) look, which otherwise leaves a big empty gap where labels would be. */
@media (max-width: 991.98px) {
  .gs-sidebar.collapsed .gs-collapsed-hide,
  .gs-sidebar.collapsed .gs-sb-label { opacity: 1; max-width: 12rem; pointer-events: auto; }
  .gs-sidebar.collapsed .gs-sb-badge { opacity: 1; pointer-events: auto; }
  .gs-sidebar.collapsed .gs-sb-foot-actions { flex-direction: row; }
  .gs-sidebar.collapsed .gs-sb-foot-actions .gs-sb-footer-link { flex: 1; width: auto; justify-content: flex-start; }
}

/* Dashboard sidebar — clearer ACTIVE link highlight (current page) */
.gs-sb-link.active,
.gs-sb-link[aria-current="page"] {
  background: var(--gs-cp-s);
  color: var(--gs-cp-t, var(--gs-cp));
  border-left-color: var(--gs-cp);
  font-weight: 700;
}
.gs-sb-link.active .gs-sb-icon,
.gs-sb-link.active .gs-sb-icon i,
.gs-sb-link[aria-current="page"] .gs-sb-icon,
.gs-sb-link[aria-current="page"] .gs-sb-icon i { color: var(--gs-cp); }


/* ════════════════════════════════════════════════════════════════
   REVIEWS PAGE (/reviews) — ported from html_themes/reviews.html
   ════════════════════════════════════════════════════════════════ */
:root{--gs-orange-400:#FB923C;--gs-orange-600:#EA580C;--gs-green-200:#BBF7D0;--gs-ct-s:#EFF6FF;--gs-sf1:var(--gs-sf0)}
/* ── Page hero ───────────────────────────────────────────── */
.rv-hero{background:var(--gs-bg0);border-bottom:1px solid var(--gs-bd0);padding:2rem 0 0}
.rv-hero-band{display:flex;align-items:flex-start;gap:1.25rem;flex-wrap:wrap;padding-bottom:1.75rem}
.rv-tool-logo{width:68px;height:68px;border-radius:var(--gs-rlg);background:var(--gs-bg2);border:1px solid var(--gs-bd1);display:flex;align-items:center;justify-content:center;font-size:2.125rem;flex-shrink:0;box-shadow:var(--gs-shsm);overflow:hidden}
.rv-hero-text{flex:1;min-width:0}
.rv-back-link{display:inline-flex;align-items:center;gap:.3rem;font-size:.8125rem;color:var(--gs-tx2);font-weight:500;margin-bottom:.375rem;text-decoration:none;transition:color .15s}
.rv-back-link:hover{color:var(--gs-cp)}
.rv-hero-h1{font-size:clamp(1.5rem,3.5vw,2.25rem);font-weight:800;letter-spacing:-.035em;line-height:1.15;color:var(--gs-tx0);margin-bottom:.75rem}
.rv-hero-meta{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;font-size:.875rem;color:var(--gs-tx2)}
.rv-score-inline{display:flex;align-items:baseline;gap:.2rem;font-family:var(--gs-fd)}
.rv-score-inline .n{font-size:2rem;font-weight:800;letter-spacing:-.04em;color:var(--gs-tx0);line-height:1}
.rv-score-inline .d{font-size:.875rem;color:var(--gs-tx2)}
.rv-stars-sm{display:flex;gap:1px}
.rv-stars-sm i{color:var(--gs-orange-500);font-size:.9375rem}
.rv-meta-sep{width:1px;height:1rem;background:var(--gs-bd1);flex-shrink:0}
.rv-hero-actions{display:flex;flex-wrap:wrap;gap:.625rem;padding:1.125rem 0;border-top:1px solid var(--gs-bd0);margin-top:1rem}

/* ── Two-col layout ─────────────────────────────────────── */
.rv-body-wrap{padding:2rem 0 4rem}
.rv-two-col{display:grid;grid-template-columns:1fr 348px;gap:2rem;align-items:start}
@media(max-width:991.98px){.rv-two-col{grid-template-columns:1fr}}

/* ── Content panels (rounded card) ─────────────────────── */
.rv-panel{background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-r2xl);padding:1.75rem;margin-bottom:1.5rem}
.rv-panel:last-child{margin-bottom:0}
.rv-panel-title{font-family:var(--gs-fd);font-size:1.125rem;font-weight:800;letter-spacing:-.025em;color:var(--gs-tx0);margin-bottom:1.25rem;display:flex;align-items:center;gap:.5rem}
.rv-panel-title i{font-size:1rem;color:var(--gs-cp)}

/* ── Rating snapshot ─────────────────────────────────────── */
.rv-snapshot{display:grid;grid-template-columns:auto 1fr auto;gap:2rem;align-items:start}
@media(max-width:767.98px){.rv-snapshot{grid-template-columns:1fr 1fr;gap:1.25rem}}
@media(max-width:479px){.rv-snapshot{grid-template-columns:1fr}}
.rv-big-num{text-align:center}
.rv-big-num .score{font-family:var(--gs-fd);font-size:4rem;font-weight:800;letter-spacing:-.06em;line-height:1;color:var(--gs-tx0)}
.rv-big-num .stars{display:flex;gap:3px;justify-content:center;margin:.25rem 0}
.rv-big-num .stars i{color:var(--gs-orange-500);font-size:1.125rem}
.rv-big-num .label{font-size:.8125rem;color:var(--gs-tx2)}
.rv-big-num .recommend{font-size:.8125rem;font-weight:600;color:var(--gs-cs);margin-top:.25rem}
/* Bar chart */
.rv-bars{display:flex;flex-direction:column;gap:.4375rem}
.rv-bar-row{display:flex;align-items:center;gap:.625rem;cursor:pointer;padding:.125rem .25rem;border-radius:var(--gs-rsm);transition:background .12s}
.rv-bar-row:hover,.rv-bar-row.active{background:rgba(91,33,182,.06)}
[data-theme="dark"] .rv-bar-row:hover,[data-theme="dark"] .rv-bar-row.active{background:rgba(167,139,250,.08)}
.rv-bar-row:focus-visible{outline:none;box-shadow:var(--gs-foc);border-radius:var(--gs-rsm)}
.rv-bar-lbl{width:32px;font-size:.75rem;font-weight:600;color:var(--gs-tx2);text-align:right;flex-shrink:0;white-space:nowrap}
.rv-bar-lbl i{color:var(--gs-orange-500);font-size:.625rem;margin-left:1px}
.rv-bar-track{flex:1;height:8px;background:var(--gs-bg2);border-radius:var(--gs-rf);overflow:hidden;min-width:60px}
.rv-bar-fill{height:100%;border-radius:var(--gs-rf);background:var(--gs-orange-500);transition:width .6s cubic-bezier(.34,1.56,.64,1)}
.rv-bar-count{width:36px;font-size:.75rem;font-weight:500;color:var(--gs-tx2);flex-shrink:0}
.rv-bar-pct{width:28px;font-size:.75rem;color:var(--gs-tx2);flex-shrink:0;text-align:right}
/* Dimension mini-scores */
.rv-dims{display:flex;flex-direction:column;gap:.625rem;min-width:180px}
@media(max-width:767.98px){.rv-dims{grid-column:1 / -1}}
.rv-dim-head{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gs-tx2);margin-bottom:.375rem}
.rv-dim-row{display:flex;align-items:center;gap:.625rem;font-size:.8125rem}
.rv-dim-name{color:var(--gs-tx2);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv-dim-bar{flex:0 0 80px;height:6px;background:var(--gs-bg2);border-radius:var(--gs-rf);overflow:hidden}
.rv-dim-fill{height:100%;border-radius:var(--gs-rf);background:linear-gradient(90deg,var(--gs-cp),var(--gs-purple-400));transition:width .6s .1s cubic-bezier(.34,1.56,.64,1)}
.rv-dim-val{font-family:var(--gs-fd);font-size:.8125rem;font-weight:700;color:var(--gs-tx0);min-width:24px;text-align:right;flex-shrink:0}

/* ── Sentiment tag clouds ───────────────────────────────── */
.rv-sent-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:575.98px){.rv-sent-grid{grid-template-columns:1fr}}
.rv-sent-block{background:var(--gs-bg1);border:1px solid var(--gs-bd0);border-radius:var(--gs-rxl);padding:1.125rem}
.rv-sent-head{display:flex;align-items:center;gap:.4rem;font-family:var(--gs-fd);font-size:.875rem;font-weight:700;margin-bottom:.75rem}
.rv-sent-head.pos{color:var(--gs-cs)}
.rv-sent-head.neg{color:var(--gs-orange-600)}
[data-theme="dark"] .rv-sent-head.neg{color:var(--gs-orange-400)}
.rv-sent-tags{display:flex;flex-wrap:wrap;gap:.375rem}
.rv-tag{display:inline-flex;align-items:center;gap:.25rem;font-size:.8125rem;font-weight:500;padding:.3125rem .75rem;border-radius:var(--gs-rf);cursor:pointer;border:1px solid transparent;transition:background .12s,border-color .12s,color .12s,transform .1s}
.rv-tag:active{transform:scale(.97)}
.rv-tag:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.rv-tag.pos{background:var(--gs-cs-s);border-color:rgba(61,139,55,.2);color:var(--gs-cs)}
.rv-tag.pos:hover{background:var(--gs-green-100);border-color:rgba(61,139,55,.35)}
[data-theme="dark"] .rv-tag.pos{background:rgba(61,139,55,.12);border-color:rgba(74,222,128,.2);color:#4ADE80}
.rv-tag.neg{background:#FFF7ED;border-color:#FED7AA;color:#C2410C}
.rv-tag.neg:hover{background:#FFEDD5;border-color:#FDBA74}
[data-theme="dark"] .rv-tag.neg{background:rgba(194,65,12,.12);border-color:rgba(251,146,60,.25);color:var(--gs-orange-400)}
.rv-tag .cnt{font-size:.6875rem;opacity:.65}

/* ── Filter bar ─────────────────────────────────────────── */
.rv-filters{background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-r2xl);padding:1.125rem 1.375rem;margin-bottom:1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}
.rv-filter-lbl{font-size:.8125rem;font-weight:600;color:var(--gs-tx2);flex-shrink:0}
.rv-chip{display:inline-flex;align-items:center;gap:.25rem;padding:.3125rem .75rem;border-radius:var(--gs-rf);font-family:var(--gs-fd);font-size:.8125rem;font-weight:500;color:var(--gs-tx2);background:var(--gs-sf2);border:1px solid var(--gs-bd1);cursor:pointer;transition:all .12s;white-space:nowrap}
.rv-chip:hover{border-color:var(--gs-cp-b);color:var(--gs-cp-t);background:var(--gs-cp-s)}
.rv-chip.active{background:var(--gs-cp);color:#fff;border-color:var(--gs-cp)}
.rv-chip:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.rv-filter-sep{width:1px;height:1.25rem;background:var(--gs-bd1);flex-shrink:0}
.rv-sort-wrap{margin-left:auto;display:flex;align-items:center;gap:.5rem;flex-shrink:0}
.rv-sort-lbl{font-size:.8125rem;color:var(--gs-tx2)}
.rv-sort-sel{height:36px;padding:0 2rem 0 .75rem;font-size:.8125rem;color:var(--gs-tx0);background:var(--gs-sf0);border:1.5px solid var(--gs-bd1);border-radius:var(--gs-rlg);cursor:pointer;outline:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 16 10'%3E%3Cpath fill='none' stroke='%236B7280' stroke-width='1.5' d='M2 2l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .6rem center;transition:border-color .15s}
.rv-sort-sel:focus{border-color:var(--gs-cp);box-shadow:var(--gs-foc)}
[data-theme="dark"] .rv-sort-sel{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 16 10'%3E%3Cpath fill='none' stroke='%23B4BAD0' stroke-width='1.5' d='M2 2l6 6 6-6'/%3E%3C/svg%3E")}
/* ── List header ─────────────────────────────────────────── */
.rv-list-hd{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;margin-bottom:1.25rem}
.rv-list-count{font-size:.9375rem;font-weight:600;color:var(--gs-tx0)}
.rv-list-count span{font-weight:400;color:var(--gs-tx2)}

/* ── Featured review ─────────────────────────────────────── */
.rv-featured{background:linear-gradient(135deg,var(--gs-cp-s) 0%,var(--gs-cs-s) 100%);border:1.5px solid var(--gs-cp-b);border-radius:var(--gs-r2xl);padding:1.625rem;margin-bottom:1rem;position:relative;overflow:hidden}
.rv-featured::after{content:'';position:absolute;top:-50px;right:-50px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(91,33,182,.07),transparent 70%);pointer-events:none}
[data-theme="dark"] .rv-featured{background:linear-gradient(135deg,rgba(109,40,217,.12) 0%,rgba(61,139,55,.08) 100%);border-color:var(--gs-cp-b)}
.rv-featured-eyebrow{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gs-cp-t);margin-bottom:.875rem;display:flex;align-items:center;gap:.375rem}

/* ── Review card ─────────────────────────────────────────── */
.rv-card{background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-r2xl);padding:1.5rem;margin-bottom:1rem;transition:box-shadow .2s,border-color .2s}
.rv-card:hover{box-shadow:var(--gs-shlg);border-color:var(--gs-bd2)}
.rv-card:last-of-type{margin-bottom:0}
/* Head row */
.rv-card-head{display:flex;align-items:flex-start;gap:.875rem;margin-bottom:1rem}
.rv-avatar{width:42px;height:42px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:var(--gs-fd);font-size:.875rem;font-weight:700;color:#fff}
.rv-meta{flex:1;min-width:0}
.rv-name{font-family:var(--gs-fd);font-size:.9375rem;font-weight:700;color:var(--gs-tx0);margin-bottom:.1875rem}
.rv-details{display:flex;align-items:center;gap:.4375rem;flex-wrap:wrap;font-size:.75rem;color:var(--gs-tx2)}
.rv-role{color:var(--gs-tx1)}
.rv-verified{display:inline-flex;align-items:center;gap:.2rem;background:var(--gs-cs-s);color:var(--gs-cs);border:1px solid rgba(61,139,55,.2);border-radius:var(--gs-rf);padding:1px 6px;font-size:.5625rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
[data-theme="dark"] .rv-verified{background:rgba(61,139,55,.12);border-color:rgba(74,222,128,.25);color:#4ADE80}
.rv-card-stars{display:flex;gap:1px;flex-shrink:0;margin-left:auto}
.rv-card-stars i{color:var(--gs-orange-500);font-size:.9375rem}
.rv-card-stars i.off{color:var(--gs-bd2)}
/* Recommend pill */
.rv-recommend{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;font-weight:600;padding:.25rem .625rem;border-radius:var(--gs-rf);margin-bottom:.875rem}
.rv-recommend.yes{background:var(--gs-cs-s);color:var(--gs-cs);border:1px solid rgba(61,139,55,.2)}
.rv-recommend.no{background:#FFF7ED;color:#C2410C;border:1px solid #FECACA}
[data-theme="dark"] .rv-recommend.yes{background:rgba(61,139,55,.12);border-color:rgba(74,222,128,.25);color:#4ADE80}
[data-theme="dark"] .rv-recommend.no{background:rgba(194,65,12,.12);border-color:rgba(251,146,60,.28);color:var(--gs-orange-400)}
/* Headline + body */
.rv-headline{font-family:var(--gs-fd);font-size:1rem;font-weight:700;color:var(--gs-tx0);margin-bottom:.625rem;line-height:1.35}
.rv-body{font-size:.9375rem;color:var(--gs-tx1);line-height:1.7;margin-bottom:.875rem;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.rv-body.expanded{display:block}
/* Dimension sub-scores */
.rv-card-dims{display:flex;flex-wrap:wrap;gap:.625rem;padding:.875rem;background:var(--gs-bg1);border-radius:var(--gs-rlg);margin-bottom:.875rem}
.rv-cdim{display:flex;align-items:center;gap:.375rem;font-size:.75rem}
.rv-cdim-lbl{color:var(--gs-tx2)}
.rv-cdim-stars{display:flex;gap:1px}
.rv-cdim-stars i{color:var(--gs-orange-500);font-size:.625rem}
.rv-cdim-stars i.off{color:var(--gs-bd2)}
.rv-cdim-val{font-family:var(--gs-fd);font-weight:700;color:var(--gs-tx0)}
/* Usage note */
.rv-usage{font-size:.75rem;color:var(--gs-tx2);margin-bottom:.875rem;display:flex;align-items:center;gap:.375rem;flex-wrap:wrap}
.rv-usage i{font-size:.75rem}
/* Actions row */
.rv-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding-top:.875rem;border-top:1px solid var(--gs-bd0)}
.rv-act{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;font-weight:500;color:var(--gs-tx2);background:none;border:1px solid var(--gs-bd1);border-radius:var(--gs-rf);padding:.3125rem .75rem;cursor:pointer;transition:background .12s,color .12s,border-color .12s}
.rv-act:hover{background:var(--gs-bg2);color:var(--gs-tx0);border-color:var(--gs-bd2)}
.rv-act.helpful.voted{background:var(--gs-cp-s);color:var(--gs-cp-t);border-color:var(--gs-cp-b)}
.rv-act:focus-visible{outline:none;box-shadow:var(--gs-foc)}
/* Vendor reply */
.rv-vreply{background:var(--gs-bg1);border-left:3px solid var(--gs-ct);border-radius:0 var(--gs-rmd) var(--gs-rmd) 0;padding:.875rem 1rem;margin-top:.875rem}
.rv-vreply-head{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gs-ct);margin-bottom:.375rem;display:flex;align-items:center;gap:.375rem}
.rv-vreply-body{font-size:.875rem;color:var(--gs-tx1);line-height:1.65}

/* ── Write review CTA card ───────────────────────────────── */
.rv-write-cta{background:var(--gs-sf1);border:1.5px dashed var(--gs-bd2);border-radius:var(--gs-r2xl);padding:2rem 1.75rem;text-align:center;margin-top:1rem;transition:border-color .15s,background .15s}
.rv-write-cta:hover{border-color:var(--gs-cp-b);background:var(--gs-cp-s)}
/* Star picker inside CTA */
.rv-star-pick{display:flex;justify-content:center;gap:.25rem;margin:.875rem 0}
.rv-sp-star{background:none;border:none;cursor:pointer;color:var(--gs-bd2);font-size:2rem;transition:color .12s,transform .1s;padding:.125rem;line-height:1}
.rv-sp-star:hover,.rv-sp-star.on{color:var(--gs-orange-500);transform:scale(1.1)}
.rv-sp-star:focus-visible{outline:none;box-shadow:var(--gs-foc);border-radius:50%}

/* ── Write review modal ─────────────────────────────────── */
.rv-modal-back{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;padding:1rem;opacity:0;pointer-events:none;transition:opacity .2s}
.rv-modal-back.open{opacity:1;pointer-events:auto}
.rv-modal-overlay{position:absolute;inset:0;background:rgba(9,10,16,.65);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.rv-modal-box{position:relative;z-index:1;background:var(--gs-sf0);border:1px solid var(--gs-bd0);border-radius:var(--gs-r2xl);box-shadow:0 20px 60px rgba(0,0,0,.22);width:min(calc(100vw - 2rem),600px);max-height:calc(100dvh - 2rem);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--gs-bd0) transparent;transform:translateY(10px);transition:transform .22s}
.rv-modal-back.open .rv-modal-box{transform:translateY(0)}
.rv-mhd{position:sticky;top:0;background:var(--gs-sf0);z-index:1;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--gs-bd0)}
.rv-mhd-title{font-family:var(--gs-fd);font-size:1.0625rem;font-weight:700;color:var(--gs-tx0)}
.rv-mbody{padding:1.5rem}
.rv-mft{position:sticky;bottom:0;background:var(--gs-sf0);padding:1rem 1.5rem;border-top:1px solid var(--gs-bd0);display:flex;justify-content:flex-end;gap:.625rem}
.rv-field{margin-bottom:1.125rem}
.gs-lbl{display:block;font-family:var(--gs-fd);font-size:.875rem;font-weight:600;color:var(--gs-tx0);margin-bottom:.375rem}
.gs-inp,.gs-txa,.gs-sel{width:100%;font-family:var(--gs-fb);font-size:.9375rem;color:var(--gs-tx0);background:var(--gs-sf0);border:1.5px solid var(--gs-bd1);border-radius:var(--gs-rmd);outline:none;-webkit-appearance:none;appearance:none;transition:border-color .15s,box-shadow .15s}
.gs-inp{height:48px;padding:0 .875rem}
.gs-txa{padding:.6875rem .875rem;resize:vertical;min-height:110px;line-height:1.65}
.gs-sel{height:48px;padding:0 2.5rem 0 .875rem;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 16 10'%3E%3Cpath fill='none' stroke='%236B7280' stroke-width='1.5' d='M2 2l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .875rem center}
[data-theme="dark"] .gs-sel{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 16 10'%3E%3Cpath fill='none' stroke='%23B4BAD0' stroke-width='1.5' d='M2 2l6 6 6-6'/%3E%3C/svg%3E")}
.gs-inp::placeholder,.gs-txa::placeholder{color:var(--gs-tx2)}
.gs-inp:focus,.gs-txa:focus,.gs-sel:focus{border-color:var(--gs-cp);box-shadow:0 0 0 1px var(--gs-sf0),0 0 0 4px rgba(91,33,182,.20)}
/* Modal star picker */
.rv-mstars{display:flex;gap:.375rem;margin-bottom:.25rem}
.rv-ms{background:none;border:none;cursor:pointer;font-size:2.125rem;color:var(--gs-bd2);transition:color .1s,transform .1s;padding:.125rem;line-height:1}
.rv-ms.on{color:var(--gs-orange-500)}
.rv-ms:hover{color:var(--gs-orange-400);transform:scale(1.08)}
.rv-ms:focus-visible{outline:none;box-shadow:var(--gs-foc);border-radius:4px}
/* Dimension sliders in modal */
.rv-mdim{display:flex;align-items:center;gap:.75rem;margin-bottom:.625rem;font-size:.875rem}
.rv-mdim label{min-width:110px;color:var(--gs-tx1);font-weight:500;flex-shrink:0}
.rv-mdim-sl{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:var(--gs-bg2);border-radius:var(--gs-rf);outline:none;cursor:pointer}
.rv-mdim-sl::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--gs-cp);box-shadow:0 2px 6px rgba(91,33,182,.3);cursor:pointer}
.rv-mdim-sl:focus-visible{box-shadow:var(--gs-foc)}
.rv-mdim-val{min-width:24px;font-family:var(--gs-fd);font-weight:700;font-size:.875rem;color:var(--gs-tx0);text-align:right;flex-shrink:0}

/* ── Pagination ──────────────────────────────────────────── */
.rv-pagination{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.375rem;margin-top:2rem}
.rv-pg{min-width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0 .5rem;font-family:var(--gs-fd);font-size:.875rem;font-weight:500;color:var(--gs-tx1);background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-rmd);cursor:pointer;transition:all .12s;text-decoration:none;user-select:none}
.rv-pg:hover{background:var(--gs-bg2);color:var(--gs-tx0);text-decoration:none}
.rv-pg.active{background:var(--gs-cp);color:#fff;border-color:var(--gs-cp)}
.rv-pg:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}
.rv-pg:focus-visible{outline:none;box-shadow:var(--gs-foc)}
.rv-pg-dots{display:flex;align-items:center;height:40px;padding:0 .25rem;color:var(--gs-tx2);pointer-events:none}

/* ── Sidebar ─────────────────────────────────────────────── */
.rv-sidebar-inner{position:sticky;top:calc(var(--gs-nh) + 1.25rem);display:flex;flex-direction:column;gap:1.25rem}
@media(max-width:991.98px){.rv-sidebar-inner{position:static}}
.rv-sb-card{background:var(--gs-sf1);border:1px solid var(--gs-bd1);border-radius:var(--gs-r2xl);padding:1.5rem}
.rv-sb-logo{width:52px;height:52px;border-radius:var(--gs-rlg);background:var(--gs-bg2);border:1px solid var(--gs-bd1);display:flex;align-items:center;justify-content:center;font-size:1.625rem;margin-bottom:.875rem;overflow:hidden}
.rv-sb-name{font-family:var(--gs-fd);font-size:1.0625rem;font-weight:800;color:var(--gs-tx0);margin-bottom:.25rem;letter-spacing:-.02em}
.rv-sb-tag{font-size:.875rem;color:var(--gs-tx2);line-height:1.5;margin-bottom:1rem}
.rv-sb-score-row{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}
.rv-sb-score-row .stars i{color:var(--gs-orange-500);font-size:.875rem}
.rv-sb-score-row .sc{font-family:var(--gs-fd);font-weight:700;color:var(--gs-tx0)}
.rv-sb-score-row .ct{font-size:.8125rem;color:var(--gs-tx2)}
.rv-sb-price{display:flex;align-items:baseline;gap:.375rem;margin-bottom:1rem}
.rv-sb-price .fr{font-family:var(--gs-fd);font-size:1.0625rem;font-weight:700;color:var(--gs-cs)}
.rv-sb-price .pd{font-size:.875rem;color:var(--gs-tx2)}
.rv-sb-facts{display:flex;flex-direction:column;gap:.4375rem;border-top:1px solid var(--gs-bd0);padding-top:1rem;margin:1rem 0}
.rv-sb-fact{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;color:var(--gs-tx1)}
.rv-sb-fact i{font-size:.875rem;color:var(--gs-cs);flex-shrink:0}
.rv-sb-affi{font-size:.6875rem;color:var(--gs-tx2);line-height:1.5;text-align:center;margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--gs-bd0)}
.rv-sb-affi a{color:var(--gs-tx2);text-decoration:underline;text-underline-offset:2px}
/* Stats list */
.rv-sb-stats{display:flex;flex-direction:column;gap:.5rem}
.rv-sb-stat{display:flex;align-items:center;justify-content:space-between;font-size:.8125rem}
.rv-sb-stat .lbl{color:var(--gs-tx2)}
.rv-sb-stat .val{font-weight:600;color:var(--gs-tx0)}
/* Segments chart */
.rv-sb-segs{display:flex;flex-direction:column;gap:.5rem}
.rv-sb-seg-row{font-size:.8125rem}
.rv-sb-seg-lbl{display:flex;justify-content:space-between;margin-bottom:.25rem}
.rv-sb-seg-lbl span:first-child{color:var(--gs-tx2)}
.rv-sb-seg-lbl span:last-child{font-weight:600;color:var(--gs-tx0)}
.rv-sb-seg-bar{height:5px;background:var(--gs-bg2);border-radius:var(--gs-rf);overflow:hidden}
.rv-sb-seg-fill{height:100%;border-radius:var(--gs-rf);background:var(--gs-cp)}
/* Alternatives in sidebar */
.rv-sb-alt{display:flex;align-items:center;gap:.625rem;padding:.5rem;border-radius:var(--gs-rmd);text-decoration:none;transition:background .12s}
.rv-sb-alt:hover{background:var(--gs-bg2);text-decoration:none}
.rv-sb-alt-logo{width:32px;height:32px;border-radius:var(--gs-rmd);background:var(--gs-bg2);border:1px solid var(--gs-bd0);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}
.rv-sb-alt-name{font-family:var(--gs-fd);font-size:.875rem;font-weight:600;color:var(--gs-tx0)}
.rv-sb-alt-cat{font-size:.6875rem;color:var(--gs-tx2)}
.rv-sb-alt-score{display:flex;align-items:center;gap:.2rem;font-size:.75rem;color:var(--gs-tx2);margin-left:auto;flex-shrink:0}
.rv-sb-alt-score i{color:var(--gs-orange-500);font-size:.6875rem}
.rv-sb-alt-score strong{color:var(--gs-tx0)}

/* ── Responsive overrides ────────────────────────────────── */
@media(max-width:767.98px){
  .rv-body-wrap{padding:1.5rem 0 3rem}
  .rv-panel{padding:1.25rem}
  .rv-card{padding:1.25rem}
  .rv-filters{padding:.875rem 1rem;gap:.5rem}
  .rv-card-dims{display:none}
}
@media(max-width:575.98px){
  .rv-mhd{padding:1rem 1.25rem}
  .rv-mbody{padding:1.125rem}
  .rv-mft{padding:.875rem 1.25rem}
  .rv-mdim label{min-width:80px}
}

/* Reviews sidebar: stretch the aside so .rv-sidebar-inner can stick while scrolling */
.rv-two-col > aside{align-self:stretch}
@media(max-width:991.98px){.rv-two-col > aside{align-self:auto}}

/* ============================================================ UX-05 EMPTY STATES */
.gs-empty{text-align:center;padding:3rem 1.5rem;max-width:440px;margin:1rem auto}
.gs-empty-icon{width:72px;height:72px;border-radius:50%;background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto 1rem}
.gs-empty-title{font-size:1.15rem;font-weight:700;margin:0 0 .35rem;color:var(--gs-tx1,#1e293b)}
.gs-empty-text{color:var(--gs-tx2,#64748b);font-size:.9rem;margin:0 0 1.1rem}
.gs-empty-cta{display:inline-flex;align-items:center;gap:.4rem}
.gs-empty-help{margin-top:1.2rem;font-size:.8rem;color:var(--gs-tx2,#94a3b8);background:var(--gs-surface-1,#f8fafc);border-radius:.5rem;padding:.55rem .8rem;display:inline-flex;align-items:center;gap:.4rem}
@media(max-width:575.98px){.gs-empty{padding:2rem 1rem}.gs-empty-icon{width:60px;height:60px;font-size:1.6rem}}

/* ============================================================
 * DASHBOARD-UX-02 — full-height BRAND sidebar on the LEFT
 * Full-height left rail pulled to the very top, painted with the workspace
 * brand colour (--gs-rail-bg) + readable foreground (--gs-rail-fg, set
 * per-request in dashboard/layout.php). Scoped to .gs-dash-shell so the
 * public site navbar is untouched.
 * ============================================================ */
.gs-dash-shell .gs-sidebar{
  background:var(--gs-rail-bg,#5B21B6);
  color:var(--gs-rail-fg,#fff);
  border-left:0;
}
@media (min-width:992px){
  /* full-height fixed left rail */
  .gs-dash-shell .gs-sidebar{
    position:fixed; top:0; left:0; bottom:0; right:auto;
    height:100vh; width:var(--gs-sidebar-width);
    border-right:1px solid rgba(255,255,255,.14);
    box-shadow:8px 0 28px rgba(2,6,23,.12);
    z-index:999;
  }
  .gs-dash-shell .gs-sidebar.collapsed{ width:var(--gs-sidebar-collapsed); }
  /* keep the topbar + page content to the RIGHT of the rail */
  .gs-dash-shell .gs-navbar{ padding-left:calc(var(--gs-sidebar-width) + 1.25rem); }
  .gs-dash-shell .gs-dash-layout{ margin-left:var(--gs-sidebar-width); min-height:100vh; }
  .gs-dash-shell:has(.gs-sidebar.collapsed) .gs-navbar{ padding-left:calc(var(--gs-sidebar-collapsed) + 1.25rem); }
  .gs-dash-shell:has(.gs-sidebar.collapsed) .gs-dash-layout{ margin-left:var(--gs-sidebar-collapsed); }
  /* Collapsed rail: hide shortcut-key badges (icons only) + show the label as a FIXED tooltip
     (positioned by JS) so it isn't clipped by the rail's overflow / hidden behind the page. */
  .gs-dash-shell .gs-sidebar.collapsed .gs-sb-kbd{ display:none !important; }
  .gs-dash-shell .gs-sidebar.collapsed .gs-sb-tooltip{ position:fixed; left:auto; right:auto; transform:translateY(-50%); z-index:3000; }
  .gs-dash-shell .gs-sidebar.collapsed .gs-sb-tooltip::before{ left:-4px; right:auto; }
}
/* ---- brand-on-rail recolouring (all breakpoints) ---- */
.gs-dash-shell .gs-sidebar .gs-sb-search{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.22); color:var(--gs-rail-fg,#fff); }
.gs-dash-shell .gs-sidebar .gs-sb-search::placeholder{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 60%,transparent); }
.gs-dash-shell .gs-sidebar .gs-sb-search:focus{ border-color:rgba(255,255,255,.5); }
.gs-dash-shell .gs-sidebar .gs-sb-search-wrap>.bi-search{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 70%,transparent); }
.gs-dash-shell .gs-sidebar .gs-sb-search-x{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 70%,transparent); }
.gs-dash-shell .gs-sidebar .gs-sb-group-hd{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 70%,transparent); }
.gs-dash-shell .gs-sidebar .gs-sb-group-hd:hover{ color:var(--gs-rail-fg,#fff); }
.gs-dash-shell .gs-sidebar .gs-sb-group+.gs-sb-group>.gs-sb-group-hd{ border-top-color:rgba(255,255,255,.13); }
.gs-dash-shell .gs-sidebar .gs-active-section>.gs-sb-group-hd,
.gs-dash-shell .gs-sidebar .gs-active-section>.gs-sb-group-hd .gs-sb-chev{ color:var(--gs-rail-fg,#fff); }
/* Sub-items sit a little darker/softer than the pure-white parent headers (clear hierarchy). */
.gs-dash-shell .gs-sidebar .gs-sb-link{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 90%,transparent); border-left-color:transparent; border-radius:9px; font-weight:500; }
.gs-dash-shell .gs-sidebar .gs-sb-icon{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 50%,transparent); }
.gs-dash-shell .gs-sidebar .gs-sb-link:hover{ background:rgba(255,255,255,.18); color:#fff; }
.gs-dash-shell .gs-sidebar .gs-sb-link:hover .gs-sb-icon{ color:#fff; }
.gs-dash-shell .gs-sidebar .gs-sb-link.active,
.gs-dash-shell .gs-sidebar .gs-sb-link[aria-current="page"]{
  background:rgba(255,255,255,.26); color:#fff; border-left-color:#fff; font-weight:700;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}
.gs-dash-shell .gs-sidebar .gs-sb-link.active .gs-sb-icon{ color:#fff; }
.gs-dash-shell .gs-sidebar .gs-sb-kbd{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 70%,transparent); border-color:rgba(255,255,255,.32); background:rgba(255,255,255,.06); }
.gs-dash-shell .gs-sidebar .gs-sb-noresults{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 60%,transparent); }
.gs-dash-shell .gs-sidebar .gs-sb-footer{ border-top-color:rgba(255,255,255,.14); }
.gs-dash-shell .gs-sidebar .gs-sb-footer-link{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 90%,transparent); }
.gs-dash-shell .gs-sidebar .gs-sb-footer-link:hover{ background:rgba(255,255,255,.12); color:var(--gs-rail-fg,#fff); }
.gs-dash-shell .gs-sidebar .gs-sb-collapse-btn{ color:color-mix(in srgb,var(--gs-rail-fg,#fff) 75%,transparent); }
.gs-dash-shell .gs-sidebar .gs-sb-collapse-btn:hover{ background:rgba(255,255,255,.16); color:var(--gs-rail-fg,#fff); }

/* ==== LIGHT THEME: white dashboard sidebar with theme-colour accents (dark mode keeps the rail) ==== */
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar{
  --gs-rail-fg: var(--gs-tx1,#1e293b);
  background: var(--gs-surface-0,#fff);
  color: var(--gs-tx1,#1e293b);
  border-right-color: var(--gs-border,#e5e7eb);
  box-shadow: 2px 0 18px rgba(15,23,42,.05);
}
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-search{ background:var(--gs-surface-1,#f8fafc); border-color:var(--gs-border,#e5e7eb); color:var(--gs-tx1,#1e293b); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-search::placeholder{ color:var(--gs-tx2,#94a3b8); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-search:focus{ border-color:var(--gs-cp,#5b21b6); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-search-wrap>.bi-search,
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-search-x{ color:var(--gs-tx2,#94a3b8); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-group-hd{ color:var(--gs-tx2,#94a3b8); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-group-hd:hover{ color:var(--gs-tx1,#475569); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-chev{ color:var(--gs-tx2,#94a3b8); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-group+.gs-sb-group>.gs-sb-group-hd{ border-top-color:var(--gs-border,#e5e7eb); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-active-section>.gs-sb-group-hd,
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-active-section>.gs-sb-group-hd .gs-sb-chev{ color:var(--gs-cp,#5b21b6); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-link{ color:var(--gs-tx1,#334155); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-icon{ color:var(--gs-tx2,#94a3b8); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-link:hover{ background:var(--gs-surface-1,#f1f5f9); color:var(--gs-tx1,#1e293b); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-link:hover .gs-sb-icon{ color:var(--gs-cp,#5b21b6); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-link.active,
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-link[aria-current="page"]{
  background:color-mix(in srgb, var(--gs-cp,#5b21b6) 12%, #fff);
  color:var(--gs-cp,#5b21b6); border-left-color:var(--gs-cp,#5b21b6); font-weight:700; box-shadow:none;
}
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-link.active .gs-sb-icon{ color:var(--gs-cp,#5b21b6); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-kbd{ color:var(--gs-tx2,#94a3b8); border-color:var(--gs-border,#e5e7eb); background:var(--gs-surface-1,#f8fafc); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-noresults{ color:var(--gs-tx2,#94a3b8); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-footer{ border-top-color:var(--gs-border,#e5e7eb); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-footer-link{ color:var(--gs-tx1,#334155); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-footer-link:hover{ background:var(--gs-surface-1,#f1f5f9); color:var(--gs-tx1,#1e293b); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-collapse-btn{ color:var(--gs-tx2,#94a3b8); }
html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar .gs-sb-collapse-btn:hover{ background:var(--gs-surface-1,#f1f5f9); color:var(--gs-cp,#5b21b6); }
@media (max-width:991.98px){
  html:not([data-theme="dark"]) .gs-dash-shell .gs-sidebar{ border-right-color:var(--gs-border,#e5e7eb); }
}

/* ---- mobile: drawer slides in from the LEFT ---- */
@media (max-width:991.98px){
  .gs-dash-shell .gs-sidebar{ right:auto; left:0; transform:translateX(-100%); border-right:1px solid rgba(255,255,255,.14); border-left:0; }
  .gs-dash-shell .gs-sidebar.mobile-open{ transform:translateX(0); }
}

/* ============================================================
 * DASHBOARD-UX-03 — Home spacing + MOBILE fixes
 * ============================================================ */
.gs-dash-shell .gs-sb-home{ margin:.15rem .25rem .4rem; } /* Home sits above Recent with breathing room */
.gs-dash-shell .gs-sidebar .gs-sb-group-hd:hover{ background:rgba(255,255,255,.08); }
.gs-dash-shell .gs-sidebar .gs-sb-chev{ color:#fff; opacity:.9; }
.gs-dash-shell .gs-sidebar .gs-sb-group-hd:hover .gs-sb-chev{ opacity:1; }
.gs-dash-shell .gs-sidebar .gs-active-section>.gs-sb-group-hd,
.gs-dash-shell .gs-sidebar .gs-active-section>.gs-sb-group-hd .gs-sb-group-label{ color:#fff; }
.gs-sb-group-items{
	margin-left:10px;
}
.gs-dash-shell .gs-sidebar .gs-sb-link:hover::before,
.gs-dash-shell .gs-sidebar .gs-sb-link.active::before{ opacity:.9; }
/* Home is the primary entry — keep it clean without a bullet. */
.gs-dash-shell .gs-sidebar .gs-sb-home::before{ display:none; }

/* ---- MOBILE (≤991.98px): make the whole dashboard usable on phones/tablets ---- */
@media (max-width:991.98px){
  /* Drawer: full-height, comfortable width, ABOVE the topbar; overlay just beneath it. */
  .gs-dash-shell .gs-sidebar{
    top:0; height:100dvh; width:min(86vw,310px) !important;
    z-index:1085; box-shadow:0 0 48px rgba(2,6,23,.45);
  }
  .gs-dash-shell .gs-sb-overlay{ z-index:1084; }
  /* Topbar: tighten so the controls fit a small screen. */
  .gs-dash-shell .gs-navbar{ padding-left:.7rem; padding-right:.7rem; gap:.35rem; }
  .gs-dash-shell .gs-nav-right{ gap:.2rem; }
  .gs-dash-shell .gs-hdr-help-btn{ display:none; }        /* keyboard-shortcuts button = desktop only */
  /* No accidental sideways scroll on any dashboard page. */
  .gs-dash-shell .gs-dash-main{ max-width:100vw; overflow-x:hidden; }
}
/* ---- PHONES (≤575.98px): denser spacing + safe tables/grids ---- */
@media (max-width:575.98px){
  .gs-dash-shell .gs-dash-content{ padding:1rem .9rem !important; }
  .gs-dash-shell .gs-dash-header{ padding:1rem .9rem !important; }
  .gs-dash-shell .gs-page-title{ font-size:1.35rem; line-height:1.2; }
  /* Wide tables scroll inside their card instead of stretching the page. */
  .gs-dash-shell .table-responsive,
  .gs-dash-shell .acc-scroll{ -webkit-overflow-scrolling:touch; }
  .gs-dash-shell table{ font-size:.82rem; }
  /* Cards: trim padding so content isn't cramped edge-to-edge. */
  .gs-dash-shell .gs-card-body,
  .gs-dash-shell .dh-card,
  .gs-dash-shell .gs-card{ padding-left:.85rem; padding-right:.85rem; }
  /* KPI / stat strips: 2-up on phones (was auto-fit, can get too tight). */
  .gs-dash-shell .dh-health{ grid-template-columns:repeat(2,1fr); }
  .gs-dash-shell .dh-strip{ grid-template-columns:repeat(3,1fr); }
  /* Quick-create chips wrap cleanly. */
  .gs-dash-shell .dh-qa a,.gs-dash-shell .cc-qa a{ flex:1 1 auto; justify-content:center; }
  /* Header dropdown menus never exceed the viewport. */
  .gs-dash-shell .gs-hdr-menu{ max-width:92vw; }
}
/* very small phones — single KPI column */
@media (max-width:380px){
  .gs-dash-shell .dh-health{ grid-template-columns:1fr; }
}

/* ============================================================
 * DASHBOARD form fields — single clean focus ring + label gap
 * The framework focus ring (white halo + strong 4px purple) layered on the 1.5px border read as a
 * "double border" and touched the label above. One soft ring + a gap below labels fixes it for all
 * dashboard inputs. Scoped to .gs-dash-shell so the public site keeps its own focus style.
 * ============================================================ */
.gs-dash-shell .gs-label{ display:block; margin-bottom:.35rem; }
.gs-dash-shell .gs-input:focus,
.gs-dash-shell .gs-select:focus,
.gs-dash-shell .gs-textarea:focus{
  border-color:var(--gs-cp,#5b21b6);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--gs-cp,#5b21b6) 16%, transparent);
  outline:none;
}

/* ===================== KNOWLEDGE CENTER (/help) — HELP-09A ===================== */
.kc-hero{background:var(--gs-surface-1,#f8fafc);border-bottom:1px solid var(--gs-border);padding:2.5rem 0;text-align:center}
.kc-h1{font-size:clamp(1.6rem,4vw,2.2rem);font-weight:800;margin:0 0 .35rem;color:var(--gs-text-primary,#0f172a)}
.kc-sub{color:var(--gs-text-secondary,#64748b);margin:0 0 1.25rem}
.kc-search{display:flex;align-items:center;gap:.5rem;max-width:560px;margin:0 auto;position:relative}
.kc-search .bi-search{position:absolute;left:14px;color:var(--gs-text-tertiary,#94a3b8);font-size:1.05rem;pointer-events:none}
.kc-search input{flex:1;height:46px;padding:0 .9rem 0 2.4rem;border:1px solid var(--gs-border);border-radius:12px;background:var(--gs-surface-0,#fff);color:var(--gs-text-primary,#0f172a);font-size:.95rem}
.kc-search input:focus{outline:none;border-color:var(--gs-cp,#5b21b6);box-shadow:0 0 0 3px color-mix(in srgb,var(--gs-cp,#5b21b6) 18%,transparent)}
.kc-search-sm{max-width:520px;margin:0 0 1.25rem}
.kc-quick{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-top:1rem}
.kc-chip{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--gs-border);background:var(--gs-surface-0,#fff);color:var(--gs-cp,#5b21b6);border-radius:999px;padding:.4rem .85rem;font-size:.85rem;font-weight:600;cursor:pointer;text-decoration:none}
.kc-chip:hover{background:var(--gs-cp-s,#f5f3ff);border-color:var(--gs-cp,#5b21b6)}
.kc-wrap{padding:2rem 0 3rem}
.kc-h2{font-size:1.3rem;font-weight:800;margin:0 0 1rem;color:var(--gs-text-primary,#0f172a)}
.kc-h3{font-size:.95rem;font-weight:700;margin:0 0 .6rem;color:var(--gs-text-primary,#0f172a);display:flex;align-items:center;gap:.4rem}
.kc-sub-l{color:var(--gs-text-secondary,#64748b);margin:-.4rem 0 1.25rem}
.kc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.9rem;margin-bottom:2rem}
.kc-cat{display:flex;flex-direction:column;gap:.15rem;padding:1.1rem;border:1px solid var(--gs-border);border-radius:14px;background:var(--gs-surface-0,#fff);text-decoration:none;transition:border-color .14s ease,box-shadow .14s ease,transform .14s ease}
.kc-cat:hover{border-color:var(--gs-cp,#5b21b6);box-shadow:0 8px 22px rgba(2,6,23,.08);transform:translateY(-2px)}
.kc-cat-ic{width:42px;height:42px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);font-size:1.25rem;margin-bottom:.55rem}
.kc-cat-name{font-weight:700;color:var(--gs-text-primary,#0f172a)}
.kc-cat-count{font-size:.82rem;color:var(--gs-text-secondary,#64748b)}
.kc-cols{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.kc-col{border:1px solid var(--gs-border);border-radius:14px;padding:1.1rem 1.25rem;background:var(--gs-surface-0,#fff)}
.kc-link{display:block;padding:.5rem 0;border-bottom:1px solid var(--gs-border);color:var(--gs-text-primary,#334155);text-decoration:none;font-size:.92rem}
.kc-link:last-child{border-bottom:0}
.kc-link:hover{color:var(--gs-cp,#5b21b6)}
.kc-link.is-active{color:var(--gs-cp,#5b21b6);font-weight:700}
.kc-side-n{float:right;color:var(--gs-text-tertiary,#94a3b8);font-size:.8rem}
.kc-empty{color:var(--gs-text-secondary,#64748b);font-size:.9rem;padding:.5rem 0}
.kc-linkbtn{background:none;border:0;color:var(--gs-cp,#5b21b6);font-weight:600;cursor:pointer;padding:0}
.kc-bc{font-size:.82rem;color:var(--gs-text-tertiary,#94a3b8);margin-bottom:.75rem;display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.kc-bc a{color:var(--gs-cp,#5b21b6);text-decoration:none}
.kc-cols-side{display:grid;grid-template-columns:240px 1fr;gap:1.75rem;align-items:start}
.kc-side{border:1px solid var(--gs-border);border-radius:14px;padding:1rem 1.1rem;background:var(--gs-surface-0,#fff);position:sticky;top:1rem}
.kc-art{display:block;position:relative;padding:1rem 2.2rem 1rem 1.1rem;border:1px solid var(--gs-border);border-radius:12px;background:var(--gs-surface-0,#fff);text-decoration:none;margin-bottom:.7rem}
.kc-art:hover{border-color:var(--gs-cp,#5b21b6);box-shadow:0 6px 18px rgba(2,6,23,.07)}
.kc-art-t{display:block;font-weight:700;color:var(--gs-text-primary,#0f172a)}
.kc-art-ex{display:block;font-size:.86rem;color:var(--gs-text-secondary,#64748b);margin-top:.2rem}
.kc-art-arrow{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:var(--gs-text-tertiary,#cbd5e1)}
.kc-result-cat{font-size:.72rem;font-weight:600;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff);padding:.05rem .5rem;border-radius:999px;margin-left:.4rem;vertical-align:middle}
.kc-article{min-width:0}
.kc-h1-art{font-size:clamp(1.45rem,3.5vw,2rem);font-weight:800;margin:0 0 .35rem;color:var(--gs-text-primary,#0f172a)}
.kc-meta{font-size:.82rem;color:var(--gs-text-tertiary,#94a3b8);margin:0 0 1.25rem;display:flex;align-items:center;gap:.4rem}
.kc-helpful{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:1.75rem 0 0;padding-top:1.25rem;border-top:1px solid var(--gs-border);font-size:.9rem;color:var(--gs-text-secondary,#64748b)}
.kc-related{margin-top:1.75rem;padding-top:1.25rem;border-top:1px solid var(--gs-border)}
.kc-noresult{padding:1.5rem;border:1px dashed var(--gs-border);border-radius:14px;text-align:center;color:var(--gs-text-secondary,#64748b)}
.kc-noresult .kc-quick{margin-top:.9rem}
@media(max-width:768px){
  .kc-cols,.kc-cols-side{grid-template-columns:1fr}
  .kc-side{position:static}
  .kc-search input{height:44px}
}
/* Knowledge Center FAQ page */
.kc-faq{border:1px solid var(--gs-border);border-radius:14px;background:var(--gs-surface-0,#fff);overflow:hidden}
.kc-faq-item{border-bottom:1px solid var(--gs-border)}
.kc-faq-item:last-child{border-bottom:0}
.kc-faq-q{display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer;list-style:none;padding:.9rem 1.1rem;font-weight:600;color:var(--gs-text-primary,#0f172a)}
.kc-faq-q::-webkit-details-marker{display:none}
.kc-faq-q i{transition:transform .18s ease;color:var(--gs-text-tertiary,#94a3b8)}
.kc-faq-item[open] .kc-faq-q i{transform:rotate(180deg)}
.kc-faq-a{padding:0 1.1rem 1rem;color:var(--gs-text-secondary,#475569);line-height:1.6}
/* Knowledge Center language switcher + translation notice */
.kc-langsw{display:inline-flex;gap:2px;border:1px solid var(--gs-border);border-radius:999px;padding:3px;margin:0 auto .9rem;background:var(--gs-surface-0,#fff)}
.kc-hero .kc-langsw{margin-bottom:1rem}
.kc-langsw-r{float:right;margin:0 0 .5rem}
.kc-langsw a{padding:.25rem .7rem;border-radius:999px;font-size:.8rem;font-weight:600;color:var(--gs-text-secondary,#64748b);text-decoration:none}
.kc-langsw a.is-on{background:var(--gs-cp,#5b21b6);color:#fff}
.kc-tr-note{clear:both;background:var(--gs-cp-s,#f5f3ff);border:1px solid var(--gs-border);border-radius:10px;padding:.6rem .8rem;margin:0 0 1rem;font-size:.85rem;color:var(--gs-text-secondary,#475569)}
/* Knowledge Center — What's New feed */
.kc-rn{display:flex;gap:1rem;margin-bottom:1rem}
.kc-rn-date{flex:0 0 96px;text-align:right;font-size:.78rem;color:var(--gs-text-tertiary,#94a3b8);padding-top:.2rem}
.kc-rn-new{display:inline-block;margin-top:.3rem;padding:1px 8px;border-radius:999px;background:var(--gs-cs-s,#dcfce7);color:var(--gs-cs,#16a34a);font-size:.66rem;font-weight:700}
.kc-rn-card{flex:1;border:1px solid var(--gs-border);border-radius:14px;background:var(--gs-surface-0,#fff);padding:1rem 1.1rem}
.kc-rn-title{font-weight:700;font-size:1.02rem;color:var(--gs-text-primary,#0f172a);text-decoration:none}
.kc-rn-title:hover{color:var(--gs-cp,#5b21b6)}
.kc-rn-desc{margin:.4rem 0 .5rem;color:var(--gs-text-secondary,#64748b);font-size:.9rem;line-height:1.55}
.kc-rn-more{font-size:.84rem;color:var(--gs-cp,#5b21b6);text-decoration:none;font-weight:600}
.kc-rn-soon{align-self:flex-start;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:2px 8px;border-radius:999px;border:1px solid var(--gs-border);color:var(--gs-text-tertiary,#94a3b8)}
@media(max-width:640px){.kc-rn-date{flex-basis:72px}}

/* Knowledge Center — video player (article reader) */
.kc-video{position:relative;margin:1.1rem 0 1.4rem;border-radius:14px;overflow:hidden;background:#0b0e19;aspect-ratio:16/9}
.kc-video iframe,.kc-video .kc-video-self{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;object-fit:cover}
.kc-video-yt{position:absolute;inset:0;background-size:cover;background-position:center;background-color:#11142b;cursor:pointer;display:flex;align-items:center;justify-content:center}
.kc-video-yt::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(91,33,182,.45),rgba(11,14,25,.55))}
.kc-video-play{position:relative;z-index:1;width:72px;height:72px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--gs-cp,#5b21b6);font-size:2rem;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 28px rgba(0,0,0,.35);transition:transform .15s}
.kc-video-yt:hover .kc-video-play{transform:scale(1.08)}

/* Knowledge Center — auto-generated walkthrough "video" */
.kc-wt{margin:1.1rem 0 1.4rem;border-radius:14px;overflow:hidden;border:1px solid var(--gs-border);background:#0b0e19}
.kc-wt-stage{position:relative;aspect-ratio:16/9;background:radial-gradient(120% 120% at 0% 0%,#3b1d8f 0%,#0b0e19 60%),radial-gradient(120% 120% at 100% 100%,#155e45 0%,transparent 55%);color:#fff;overflow:hidden}
.kc-wt-slide{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:.8rem;padding:clamp(1.2rem,4vw,2.6rem);opacity:0;transform:translateY(14px);transition:opacity .5s,transform .5s;pointer-events:none}
.kc-wt-slide.is-on{opacity:1;transform:none;pointer-events:auto}
.kc-wt-tag{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:.3rem .75rem;border-radius:999px;background:rgba(255,255,255,.15)}
.kc-wt-tag-done{background:rgba(34,197,94,.22);color:#bbf7d0}
.kc-wt-h{font-size:clamp(1.3rem,3.5vw,2rem);font-weight:800;margin:0;line-height:1.2;color:#fff}
.kc-wt-p{font-size:clamp(.92rem,2vw,1.05rem);color:rgba(255,255,255,.82);margin:0;max-width:46ch;line-height:1.55}
.kc-wt-step-no{font-size:.82rem;font-weight:700;color:#c4b5fd;letter-spacing:.04em;text-transform:uppercase}
.kc-wt-step-no small{color:rgba(255,255,255,.5)}
.kc-wt-step{font-size:clamp(1.05rem,2.6vw,1.5rem);font-weight:600;line-height:1.4;margin:0;max-width:40ch;color:#fff}
.kc-wt-bar{height:4px;background:rgba(255,255,255,.12)}
.kc-wt-bar #kc-wt-fill{display:block;height:100%;width:0;background:linear-gradient(90deg,#a78bfa,#34d399)}
.kc-wt-ctrls{display:flex;align-items:center;gap:.55rem;padding:.55rem .8rem;background:#11142b;color:#fff}
.kc-wt-btn{width:34px;height:34px;border:0;border-radius:8px;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:1rem}
.kc-wt-btn:hover{background:rgba(255,255,255,.2)}
.kc-wt-count{font-size:.82rem;color:rgba(255,255,255,.7);font-weight:600}
.kc-wt-note{margin-left:auto;font-size:.72rem;color:rgba(255,255,255,.45)}
@media(max-width:560px){.kc-wt-note{display:none}}

/* Knowledge Center — guided learning path */
.kc-sub-l{color:var(--gs-text-secondary,#64748b);margin:-.4rem 0 1rem;font-size:.92rem}
.kc-path{list-style:none;margin:0 0 2rem;padding:0;display:flex;flex-direction:column;gap:.55rem;counter-reset:none}
.kc-path-step{display:flex;align-items:center;gap:.85rem;border:1px solid var(--gs-border);border-radius:12px;background:var(--gs-surface-0,#fff);padding:.7rem .9rem}
.kc-path-step.is-soon{opacity:.78}
.kc-path-no{flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);font-weight:700;font-size:.85rem;display:flex;align-items:center;justify-content:center}
.kc-path-link{flex:1;font-weight:600;color:var(--gs-text-primary,#0f172a);text-decoration:none}
.kc-path-link:hover{color:var(--gs-cp,#5b21b6)}
.kc-path-tag{font-size:.74rem;font-weight:700;color:var(--gs-cp,#5b21b6);white-space:nowrap}
.kc-path-step.is-soon .kc-path-tag{color:var(--gs-text-tertiary,#94a3b8);font-weight:600}

/* Knowledge Center — video grid */
.kc-vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.1rem;margin:.4rem 0 1.4rem}
.kc-vcard{display:flex;flex-direction:column;border:1px solid var(--gs-border);border-radius:14px;overflow:hidden;background:var(--gs-surface-0,#fff);text-decoration:none;transition:transform .15s,box-shadow .15s}
.kc-vcard:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(15,23,42,.1)}
.kc-vcard.is-soon{opacity:.85}
.kc-vthumb{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,#5b21b6,#7c3aed);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;color:#fff;font-size:2.2rem}
.kc-vsoon{position:absolute;bottom:8px;left:8px;font-style:normal;font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:rgba(0,0,0,.55);padding:2px 8px;border-radius:999px}
.kc-vbody{padding:.8rem .9rem;display:flex;flex-direction:column;gap:.3rem}
.kc-vcat{font-size:.72rem;font-weight:600;color:var(--gs-cp,#5b21b6);display:flex;align-items:center;gap:.3rem}
.kc-vtitle{font-weight:700;font-size:.98rem;color:var(--gs-text-primary,#0f172a);line-height:1.3}
.kc-vexc{font-size:.82rem;color:var(--gs-text-secondary,#64748b);line-height:1.45}

/* Knowledge Center — "Was this helpful?" feedback */
.kc-helpful-no{flex-basis:100%;margin-top:.9rem;padding:1rem;border:1px solid var(--gs-border);border-radius:12px;background:var(--gs-surface-1,#f8fafc)}
.kc-helpful-lbl{display:block;font-weight:600;font-size:.9rem;color:var(--gs-text-primary,#0f172a);margin-bottom:.6rem}
.kc-helpful-lbl span{font-weight:400;color:var(--gs-text-secondary,#64748b)}
.kc-reason-chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:.7rem}
.kc-reason-chip{padding:.35rem .8rem;border:1px solid var(--gs-border);border-radius:999px;background:var(--gs-surface-0,#fff);color:var(--gs-text-secondary,#475569);font-size:.82rem;font-weight:600;cursor:pointer}
.kc-reason-chip:hover{border-color:var(--gs-cp,#5b21b6);color:var(--gs-cp,#5b21b6)}
.kc-reason-chip.is-on{background:var(--gs-cp,#5b21b6);border-color:var(--gs-cp,#5b21b6);color:#fff}
.kc-helpful-comment{width:100%;border:1px solid var(--gs-border);border-radius:10px;padding:.6rem .7rem;font:inherit;font-size:.88rem;resize:vertical;background:var(--gs-surface-0,#fff);color:var(--gs-text-primary,#0f172a)}
.kc-helpful-actions{display:flex;gap:.5rem;margin-top:.7rem}
.kc-helpful-thanks{flex-basis:100%;margin:.8rem 0 0;color:var(--gs-cs,#16a34a);font-weight:600;font-size:.9rem}

/* Knowledge Center — pagination */
.kc-pagination{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.4rem}
.kc-page{min-width:38px;height:38px;padding:0 .7rem;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--gs-border);border-radius:10px;background:var(--gs-surface-0,#fff);color:var(--gs-text-primary,#0f172a);font-weight:600;font-size:.88rem;text-decoration:none}
.kc-page:hover{border-color:var(--gs-cp,#5b21b6);color:var(--gs-cp,#5b21b6)}
.kc-page.is-on{background:var(--gs-cp,#5b21b6);border-color:var(--gs-cp,#5b21b6);color:#fff}

/* ===== CUSTOMER-01Q+ : plan feature "?" help tooltip ===== */
.gs-feat-q{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;
  border:1px solid var(--gs-cp,#5B21B6);background:transparent;color:var(--gs-cp,#5B21B6);font-size:.68rem;font-weight:700;
  cursor:pointer;margin-left:.2rem;line-height:1;padding:0;vertical-align:middle;flex:none}
.gs-feat-q:hover,.gs-feat-q:focus-visible{background:var(--gs-cp,#5B21B6);color:#fff;outline:none}
.gs-feat-pop{position:fixed;z-index:9999;max-width:260px;background:#1e293b;color:#fff;font-size:.8rem;line-height:1.45;
  padding:.5rem .65rem;border-radius:8px;box-shadow:0 8px 24px rgba(15,23,42,.22);pointer-events:none}

/* ===== Plan slider (desktop-only, manual arrows, 3 per view when >3 plans) ===== */
.gs-plan-slider{position:relative}
.gs-plan-arrow{display:none;position:absolute;top:42%;transform:translateY(-50%);z-index:6;width:44px;height:44px;
  border-radius:50%;border:1px solid var(--gs-border,#e2e8f0);background:#fff;color:var(--gs-cp,#5B21B6);
  align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 18px rgba(15,23,42,.14);font-size:1.05rem}
.gs-plan-arrow:hover{background:var(--gs-cp,#5B21B6);color:#fff}
.gs-plan-arrow[disabled]{opacity:.3;cursor:default;box-shadow:none}
.gs-plan-arrow.prev{left:-8px}.gs-plan-arrow.next{right:-8px}
@media (min-width:992px){
  /* transform carousel — exactly 3 full cards per view; clip the rest (viewport), reveal with the arrows */
  .gs-plan-slider.is-slider .gs-plan-viewport{overflow:hidden}
  .gs-plan-slider.is-slider .gs-plan-track{flex-wrap:nowrap!important;justify-content:flex-start!important;
    margin-left:0!important;margin-right:0!important;transition:transform .35s ease;padding:1.5rem 0 .75rem}
  .gs-plan-slider.is-slider .gs-plan-track > [class*="col-"]{flex:0 0 33.333%!important;max-width:33.333%!important}
  /* the "most popular" scale overflows its column and peeks as a 4th card — keep it flat while sliding */
  .gs-plan-slider.is-slider .gs-price-card.popular{transform:none!important}
  /* arrow visibility is driven by JS (inline display) so prev hides on the first view, next hides at the end */
}

/* ===== Business Settings Center (SETTINGS-03C) — left nav (desktop) / scroll-tabs (mobile) ===== */
.biz-settings{display:flex;gap:1.25rem;align-items:flex-start}
.biz-settings-nav{flex:0 0 220px;position:sticky;top:1rem;display:flex;flex-direction:column;gap:.2rem;
  background:var(--gs-surface-0,#fff);border:1px solid var(--gs-bd0,#e5e7eb);border-radius:.85rem;padding:.5rem}
.biz-nav-item{display:flex;align-items:center;gap:.6rem;padding:.6rem .75rem;border-radius:.6rem;
  color:var(--gs-tx1,#334155);text-decoration:none;font-size:.9rem;font-weight:600;white-space:nowrap}
.biz-nav-item i{font-size:1.05rem;color:var(--gs-tx2,#64748b);flex:none}
.biz-nav-item:hover{background:var(--gs-sf1,#f8fafc)}
.biz-nav-item.active{background:color-mix(in srgb,var(--gs-cp,#5b21b6) 12%,#fff);color:var(--gs-cp,#5b21b6)}
.biz-nav-item.active i{color:var(--gs-cp,#5b21b6)}
.biz-settings-body{flex:1;min-width:0}
@media (max-width:860px){
  .biz-settings{flex-direction:column;gap:.85rem}
  .biz-settings-nav{flex:none;width:100%;position:static;flex-direction:row;overflow-x:auto;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding:.4rem}
  .biz-settings-nav::-webkit-scrollbar{display:none}
  .biz-nav-item{flex:0 0 auto}
}

/* ===== TOOL AVAILABILITY — operational status banner (detail) + badge (cards) ===== */
.gs-tool-notice{display:flex;gap:.85rem;align-items:flex-start;padding:.9rem 1.1rem;margin:0 0 1.25rem;border-radius:12px;
  border:1px solid color-mix(in srgb,var(--an-c,#d97706) 32%,transparent);
  background:color-mix(in srgb,var(--an-c,#d97706) 9%,transparent);
  border-left:4px solid var(--an-c,#d97706)}
.gs-tool-notice-ic{flex:0 0 auto;font-size:1.4rem;color:var(--an-c,#d97706);line-height:1.1}
.gs-tool-notice-body{display:flex;flex-direction:column;gap:.12rem}
.gs-tool-notice-body strong{font-size:.98rem;color:var(--gs-tx1,#0f172a)}
.gs-tool-notice-body span{font-size:.88rem;color:var(--gs-tx2,#475569)}
.gs-tool-avail-badge{display:inline-flex;align-items:center;gap:.25rem;font-weight:600;white-space:nowrap}

/* ===== Goji Suite catalog (pricing cards): savings + upgrade hint ===== */
.gs-suite-savings{display:inline-flex;align-items:center;gap:.3rem;margin:.1rem 0 .45rem;font-size:.7rem;font-weight:600;
  white-space:nowrap;max-width:100%;letter-spacing:.005em;
  color:#15803d;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:999px;padding:.2rem .6rem}
.gs-suite-savings .bi{font-size:.78rem;flex:0 0 auto}
.gs-suite-upgrade{margin:.55rem 0 0;font-size:.78rem;color:var(--gs-tx2,#64748b);line-height:1.35}

/* ===== Pricing per-tool filter chips (/pricing/{tool-slug}) ===== */
.gs-pricing-filter{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin:1.4rem auto 1.75rem;max-width:900px}
.gs-pf-chip{display:inline-flex;align-items:center;padding:.4rem .85rem;border-radius:999px;font-size:.84rem;font-weight:600;
  text-decoration:none;border:1px solid color-mix(in srgb,var(--gs-cp,#5b21b6) 30%,transparent);
  color:var(--gs-cp,#5b21b6);background:transparent;transition:background .15s,color .15s}
.gs-pf-chip:hover{background:color-mix(in srgb,var(--gs-cp,#5b21b6) 10%,transparent)}
.gs-pf-chip.is-active{background:var(--gs-cp,#5b21b6);color:#fff;border-color:var(--gs-cp,#5b21b6)}

/* Guard against horizontal overflow site-wide. `clip` (not `hidden`) removes the x-scroll WITHOUT
   creating a scroll container, so position:sticky (navbar) keeps working and vertical scroll is unaffected. */
html{overflow-x:clip}

/* --- UI-ARCH-01: from customer/returns-new.php --- */
.cp-radio{flex:1;border:1px solid #e2e8f0;border-radius:10px;padding:.6rem;font-size:.86rem;display:flex;align-items:center;gap:.4rem;cursor:pointer}
.cp-itemrow{display:flex;align-items:center;gap:.5rem;border-bottom:1px solid #f1f5f9;padding:.5rem 0;font-size:.9rem}
.cp-itemrow input{width:18px;height:18px}

/* UI: Suite bundle "Included products" rows — match the existing .gs-plan-feats feature-line style
   (bundle <li> inherits the normal feature-line layout; no flex right-align, so long names never push
   the "worth" onto an awkward second line). */
.gs-bundle-block{margin:.25rem 0 .5rem}
.gs-bundle-head{display:flex;align-items:center;flex-wrap:nowrap;gap:.3rem;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.01em;color:var(--gs-tx2,#64748b);margin:0 0 .5rem;white-space:nowrap}
.gs-bundle-head .bi{font-size:.8rem;flex:0 0 auto}
.gs-bundle-worth-total{margin-left:auto;font-weight:600;text-transform:none;letter-spacing:0;color:var(--gs-cs,#16a34a);white-space:nowrap}
.gs-bundle-list{margin-bottom:.5rem}
.gs-bundle-name{font-weight:600;color:var(--gs-cp,#5b21b6)}
/* equal-height plan cards: push the CTA to the bottom so buttons line up (no-op on natural-height cards) */
.gs-price-card.h-100 .gs-btn-block{margin-top:auto}
/* "+N more features" — the LAST item inside the features list (cards cap to a uniform total) */
.gs-feat-more-li{list-style:none}
.gs-feat-more-link{font-size:.8125rem;font-weight:600;color:var(--gs-cp,#5b21b6);text-decoration:none}
.gs-feat-more-link:hover{text-decoration:underline}
.gs-feat-more-link .bi{font-size:.72rem;vertical-align:baseline}
/* worth + Learn-more now live INSIDE the ? popover (gs-feat-pop-rich), so the row stays a clean single line */
.gs-feat-pop-rich{pointer-events:auto;max-width:280px}
.gs-feat-pop-desc{margin-bottom:.4rem}
.gs-feat-pop-worth{font-weight:700;color:#86efac}
.gs-feat-pop-link{display:inline-block;margin-top:.45rem;color:#c4b5fd;font-weight:600;text-decoration:none}
.gs-feat-pop-link:hover{text-decoration:underline;color:#ddd6fe}

/* ===== Homepage — User Dashboard showcase (scroll-animated, device-friendly) ===== */
.gs-dboard [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:var(--d,0ms)}
.gs-dboard.is-in [data-reveal]{opacity:1;transform:none}
.gs-dboard-feats{list-style:none;margin:1.5rem 0;padding:0;display:flex;flex-direction:column;gap:1rem}
.gs-dboard-feats li{display:flex;gap:.85rem;align-items:flex-start}
.gs-dboard-ficon{flex:0 0 40px;width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1.05rem;color:var(--gs-cp,#5b21b6);background:linear-gradient(135deg,var(--gs-cp-s,#f5f3ff),#fff)}
.gs-dboard-ftext{display:flex;flex-direction:column;line-height:1.4}
.gs-dboard-ftext strong{font-size:.95rem;color:var(--gs-text-primary)}
.gs-dboard-ftext span{font-size:.85rem;color:var(--gs-text-secondary)}
.gs-dboard-stage{position:relative;max-width:640px;margin-inline:auto}
.gs-dboard-mock{width:100%;overflow:hidden}
/* left sidebar (kept) + body that mirrors the real Business Workspace overview */
.gs-dboard-shell{display:flex;min-height:300px}
.gs-dboard-side{flex:0 0 140px;background:var(--gs-surface-1,#fff);border-right:1px solid var(--gs-bd0,#e2e8f0);padding:.85rem .55rem;display:flex;flex-direction:column;gap:.25rem}
.gs-dboard-navitem{display:flex;align-items:center;gap:.5rem;font-size:.74rem;color:var(--gs-tx2,#64748b);padding:.4rem .55rem;border-radius:8px;white-space:nowrap}
.gs-dboard-navitem.is-active{background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);font-weight:600}
.gs-dboard-body{flex:1;min-width:0;padding:.85rem;display:flex;flex-direction:column;gap:.65rem;background:var(--gs-sf2,#f8fafc)}
.gs-dboard-welcome{background:linear-gradient(135deg,#5b21b6,#7c3aed);color:#fff;border-radius:12px;padding:.7rem .85rem;display:flex;align-items:center;justify-content:space-between;gap:.6rem}
.gs-dboard-welcome-txt{display:flex;flex-direction:column;gap:.2rem;min-width:0;flex:1}
.gs-dboard-welcome-txt strong{font-size:.78rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-dboard-welcome-txt > span{font-size:.66rem;opacity:.85}
.gs-dboard-prog{height:6px;background:rgba(255,255,255,.28);border-radius:99px;overflow:hidden;margin-top:.2rem}
.gs-dboard-prog i{display:block;height:100%;width:0;background:#fff;border-radius:99px;transition:width 1s cubic-bezier(.16,.84,.44,1) .3s}
.gs-dboard.is-in .gs-dboard-prog i{width:var(--w,80%)}
.gs-dboard-welcome-pct{font-size:1.35rem;font-weight:800;flex:0 0 auto}
.gs-dboard-chips{display:flex;flex-wrap:wrap;gap:.35rem}
.gs-dboard-chip{display:inline-flex;align-items:center;gap:.25rem;font-size:.64rem;font-weight:600;color:var(--gs-cp,#5b21b6);background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:8px;padding:.25rem .45rem}
.gs-dboard-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.gs-dboard-kpi{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-left:3px solid var(--gs-bd0,#e2e8f0);border-radius:10px;padding:.5rem .6rem}
.gs-dboard-kpi .l{font-size:.58rem;text-transform:uppercase;letter-spacing:.04em;color:var(--gs-tx2,#64748b);font-weight:700}
.gs-dboard-kpi .n{font-size:.95rem;font-weight:800;color:var(--gs-text-primary);line-height:1.15;margin-top:.2rem;white-space:nowrap}
.gs-dboard-kpi.k-rev{border-left-color:#16a34a}
.gs-dboard-kpi.k-ord{border-left-color:#0ea5e9}
.gs-dboard-kpi.k-cus{border-left-color:#8b5cf6}
.gs-dboard-kpi.k-net{border-left-color:#10b981}
.gs-dboard-orders{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:12px;padding:.7rem .8rem}
.gs-dboard-orders-hd{display:flex;justify-content:space-between;align-items:center;font-size:.72rem;font-weight:700;color:var(--gs-text-primary);margin-bottom:.55rem}
.gs-dboard-orders-hd span{color:var(--gs-tx2,#64748b);font-weight:500}
.gs-dboard-ostat{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.gs-dboard-ostat:last-child{margin-bottom:0}
.gs-dboard-ostat .lbl{flex:0 0 66px;font-size:.66rem;font-weight:600}
.gs-dboard-ostat .bar{flex:1;height:13px;background:var(--gs-sf2,#f1f5f9);border-radius:99px;overflow:hidden}
.gs-dboard-ostat .bar i{display:block;height:100%;width:0;border-radius:99px;transition:width .85s cubic-bezier(.16,.84,.44,1);transition-delay:var(--d,0ms)}
.gs-dboard.is-in .gs-dboard-ostat .bar i{width:var(--w,50%)}
.gs-dboard-ostat .ct{flex:0 0 16px;font-size:.7rem;font-weight:700;color:var(--gs-text-primary);text-align:right}
.gs-dboard-badge{position:absolute;display:inline-flex;align-items:center;gap:.4rem;background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);box-shadow:0 10px 30px -10px rgba(2,6,23,.25);border-radius:999px;padding:.4rem .7rem;font-size:.75rem;font-weight:600;color:var(--gs-text-primary);z-index:2}
.gs-dboard-badge i{color:var(--gs-cp,#5b21b6)}
.gs-dboard-badge-1{bottom:16%;left:-14px}
.gs-dboard-badge-2{bottom:12%;right:-10px}
.gs-dboard.is-in .gs-dboard-badge{animation:gsDbFloat 4s ease-in-out infinite}
@keyframes gsDbFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media(max-width:575.98px){
  .gs-dboard-side{flex-basis:46px;padding:.7rem .3rem}
  .gs-dboard-navitem{font-size:0;gap:0;justify-content:center}
  .gs-dboard-navitem i{font-size:1rem}
  .gs-dboard-kpis{grid-template-columns:repeat(2,1fr)}
  .gs-dboard-welcome-txt strong{font-size:.72rem;white-space:normal}
  .gs-dboard-badge{display:none}
}
@media(prefers-reduced-motion:reduce){
  .gs-dboard [data-reveal]{opacity:1;transform:none;transition:none}
  .gs-dboard .gs-dboard-prog i,.gs-dboard .gs-dboard-ostat .bar i{transition:none}
  .gs-dboard.is-in .gs-dboard-badge{animation:none}
}

/* ===== Homepage S06 — Browse by Category: brand promo card + featured grid (brand-colored) ===== */
.gs-feat-wrap{display:grid;grid-template-columns:minmax(290px,1fr) 2fr;gap:2rem;align-items:stretch}
.gs-feat-promo{position:relative;overflow:hidden;border-radius:20px;padding:2.4rem;color:#fff;display:flex;flex-direction:column;background:linear-gradient(150deg,var(--gs-cp,#5b21b6),#7c3aed 58%,#4c1d95);box-shadow:0 24px 50px -22px rgba(91,33,182,.6)}
.gs-feat-promo-glow{position:absolute;width:280px;height:280px;border-radius:50%;top:-90px;right:-70px;background:radial-gradient(circle,rgba(255,255,255,.22),transparent 70%);pointer-events:none}
.gs-feat-promo-icon{width:56px;height:56px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem;color:#fff;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);box-shadow:0 8px 24px -8px rgba(0,0,0,.35);margin-bottom:1.5rem}
.gs-feat-promo-eyebrow{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.7);margin:0 0 .6rem}
.gs-feat-promo-title{font-family:var(--gs-font-display,inherit);font-size:clamp(1.5rem,2.4vw,2rem);font-weight:800;line-height:1.15;letter-spacing:-.02em;margin:0 0 .85rem}
.gs-feat-promo-sub{font-size:.95rem;line-height:1.6;color:rgba(255,255,255,.82);margin:0 0 1.6rem}
.gs-feat-promo-btn{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:.5rem;background:#fff;color:var(--gs-cp,#5b21b6);font-weight:700;font-size:.9rem;border-radius:999px;padding:.7rem 1.4rem;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.gs-feat-promo-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px -8px rgba(0,0,0,.4);color:var(--gs-cp,#5b21b6)}
.gs-feat-promo-btn i{transition:transform .2s ease}
.gs-feat-promo-btn:hover i{transform:translateX(3px)}
.gs-feat-main{display:flex;flex-direction:column}
.gs-feat-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-bottom:1rem;margin-bottom:1.5rem;border-bottom:1px solid var(--gs-bd0,#e2e8f0)}
.gs-feat-label{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--gs-tx2,#64748b)}
.gs-feat-all{display:inline-flex;align-items:center;gap:.3rem;font-size:.82rem;font-weight:700;color:var(--gs-cp,#5b21b6);text-decoration:none;white-space:nowrap}
.gs-feat-all:hover{color:var(--gs-cp-h,#6d28d9);text-decoration:underline}
.gs-feat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem 2rem}
.gs-feat-item{display:flex;gap:.95rem;align-items:flex-start;text-decoration:none;border-radius:12px;padding:.35rem;margin:-.35rem;transition:background .2s ease,transform .2s ease}
.gs-feat-item:hover{background:var(--gs-cp-s,#f5f3ff);transform:translateX(2px)}
.gs-feat-item-icon{flex:0 0 46px;width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:1.35rem;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff);transition:transform .2s ease}
.gs-feat-item:hover .gs-feat-item-icon{transform:scale(1.08)}
.gs-feat-item-body{display:flex;flex-direction:column;min-width:0}
.gs-feat-item-name{font-family:var(--gs-font-display,inherit);font-size:1.05rem;font-weight:700;color:var(--gs-text-primary);line-height:1.25;display:flex;align-items:center;gap:.35rem}
.gs-feat-item-name i{font-size:.8rem;opacity:0;transform:translateX(-4px);color:var(--gs-cp,#5b21b6);transition:opacity .2s ease,transform .2s ease}
.gs-feat-item:hover .gs-feat-item-name{color:var(--gs-cp,#5b21b6)}
.gs-feat-item:hover .gs-feat-item-name i{opacity:1;transform:none}
.gs-feat-item-desc{font-size:.85rem;color:var(--gs-text-secondary);line-height:1.5;margin-top:.25rem;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media(min-width:1200px){.gs-feat-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:991.98px){.gs-feat-wrap{grid-template-columns:1fr}.gs-feat-promo{padding:2rem}}
@media(max-width:575.98px){.gs-feat-grid{grid-template-columns:1fr}}

/* ===== Homepage S06b — Goji AI live chat showcase (brand-colored, animated) ===== */
.gs-ai-sec [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:var(--d,0ms)}
.gs-ai-sec.is-in [data-reveal]{opacity:1;transform:none}
.gs-ai-feats{list-style:none;margin:1.5rem 0;padding:0;display:flex;flex-direction:column;gap:1rem}
.gs-ai-feats li{display:flex;gap:.85rem;align-items:flex-start}
.gs-ai-ficon{flex:0 0 42px;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff)}
.gs-ai-ftext{display:flex;flex-direction:column;line-height:1.45}
.gs-ai-ftext strong{font-size:.95rem;color:var(--gs-text-primary)}
.gs-ai-ftext span{font-size:.85rem;color:var(--gs-text-secondary)}
.gs-ai-stage{position:relative;max-width:560px;margin-inline:auto}
.gs-ai-chat{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:20px;overflow:hidden;box-shadow:0 28px 60px -28px rgba(91,33,182,.5)}
.gs-ai-chat-head{display:flex;align-items:center;gap:.7rem;padding:.85rem 1rem;background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);color:#fff}
.gs-ai-ava{flex:0 0 38px;width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1.15rem;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.25)}
.gs-ai-chat-id{display:flex;flex-direction:column;line-height:1.2;flex:1;min-width:0}
.gs-ai-chat-id strong{font-size:.92rem}
.gs-ai-status{font-size:.68rem;opacity:.9;display:flex;align-items:center;gap:.35rem}
.gs-ai-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 0 rgba(74,222,128,.7);animation:gsAiPulse 2s infinite}
@keyframes gsAiPulse{0%{box-shadow:0 0 0 0 rgba(74,222,128,.6)}70%{box-shadow:0 0 0 6px rgba(74,222,128,0)}100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}
.gs-ai-channels{display:flex;gap:.5rem;font-size:.9rem;opacity:.85}
.gs-ai-chat-body{padding:1rem;display:flex;flex-direction:column;gap:.7rem;background:var(--gs-sf2,#f8fafc);min-height:320px;max-height:400px;overflow-y:auto;scroll-behavior:smooth}
.gs-ai-msg{display:flex;flex-direction:column;max-width:82%}
.gs-ai-msg.in{align-self:flex-start;align-items:flex-start}
.gs-ai-msg.out{align-self:flex-end;align-items:flex-end}
.gs-ai-ch{font-size:.64rem;font-weight:700;color:var(--gs-tx2,#64748b);margin:0 0 .25rem .15rem;display:inline-flex;align-items:center;gap:.3rem;text-transform:uppercase;letter-spacing:.03em}
.gs-ai-bubble{font-size:.84rem;line-height:1.5;padding:.6rem .85rem;border-radius:16px}
.gs-ai-msg.in .gs-ai-bubble{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);color:var(--gs-text-primary);border-bottom-left-radius:5px}
.gs-ai-msg.out .gs-ai-bubble{background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);color:#fff;border-bottom-right-radius:5px}
.gs-ai-typing{align-self:flex-end;display:none;gap:.25rem;padding:.6rem .8rem;background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);border-radius:16px;border-bottom-right-radius:5px}
.gs-ai-typing.show{display:inline-flex}
.gs-ai-typing span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.85);animation:gsAiType 1.2s infinite}
.gs-ai-typing span:nth-child(2){animation-delay:.2s}.gs-ai-typing span:nth-child(3){animation-delay:.4s}
@keyframes gsAiType{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.gs-ai-chat.is-armed .gs-ai-msg{display:none}
.gs-ai-chat.is-armed .gs-ai-msg.shown{display:flex;animation:gsAiIn .45s cubic-bezier(.16,.84,.44,1)}
@keyframes gsAiIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.gs-ai-badge{position:absolute;display:inline-flex;align-items:center;gap:.4rem;background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);box-shadow:0 12px 30px -10px rgba(2,6,23,.28);border-radius:999px;padding:.42rem .75rem;font-size:.75rem;font-weight:700;color:var(--gs-text-primary);z-index:2}
.gs-ai-badge i{color:var(--gs-cp,#5b21b6)}
.gs-ai-badge-1{top:16%;left:-18px}
.gs-ai-badge-2{bottom:14%;right:-14px}
.gs-ai-sec.is-in .gs-ai-badge{animation:gsDbFloat 4.5s ease-in-out infinite}
@media(max-width:575.98px){.gs-ai-badge{display:none}.gs-ai-msg{max-width:90%}}
@media(prefers-reduced-motion:reduce){
  .gs-ai-sec [data-reveal]{opacity:1;transform:none;transition:none}
  .gs-ai-chat.is-armed .gs-ai-msg{display:flex;animation:none}
  .gs-ai-dot,.gs-ai-typing span,.gs-ai-sec.is-in .gs-ai-badge{animation:none}
}

/* ===== Homepage S06d — Order journey pipeline (chat → dashboard → customer), looped ===== */
.gs-flow-sec [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:var(--d,0ms)}
.gs-flow-sec.is-in [data-reveal]{opacity:1;transform:none}
.gs-flow{display:flex;align-items:stretch;justify-content:center;gap:0;margin-top:2.5rem}
.gs-flow-step{flex:1 1 0;max-width:320px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}
.gs-flow-num{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem;background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);border:2px solid var(--gs-bd0,#e2e8f0);margin-bottom:1rem;transition:all .3s ease;z-index:2}
.gs-flow-step.is-on .gs-flow-num{background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);color:#fff;border-color:transparent;box-shadow:0 6px 18px -4px rgba(91,33,182,.5);transform:scale(1.1)}
.gs-flow-card{width:100%;background:var(--gs-surface-1,#fff);border:1.5px solid var(--gs-bd0,#e2e8f0);border-radius:16px;padding:1.1rem;box-shadow:var(--gs-shadow-sm);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;min-height:148px;text-align:left}
.gs-flow-step.is-on .gs-flow-card{border-color:var(--gs-cp,#5b21b6);transform:translateY(-6px);box-shadow:0 22px 44px -18px rgba(91,33,182,.45)}
.gs-flow-card-hd{display:flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--gs-tx2,#64748b);margin-bottom:.7rem}
.gs-flow-card-hd i{color:var(--gs-cp,#5b21b6)}
.gs-flow-bubble{display:inline-block;background:var(--gs-sf2,#f1f5f9);border-radius:14px;border-bottom-left-radius:5px;padding:.5rem .8rem;font-size:.85rem;color:var(--gs-text-primary);margin-bottom:.65rem}
.gs-flow-ok{display:flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:600;color:#16a34a;opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.gs-flow-step.is-on .gs-flow-ok{opacity:1;transform:none}
.gs-flow-toast,.gs-flow-note{display:flex;align-items:center;gap:.6rem;background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:12px;padding:.55rem .65rem;box-shadow:0 8px 22px -10px rgba(2,6,23,.2);opacity:0;transform:translateX(14px);transition:opacity .45s ease,transform .5s cubic-bezier(.16,.84,.44,1)}
.gs-flow-step.is-on .gs-flow-toast,.gs-flow-step.is-on .gs-flow-note{opacity:1;transform:none}
.gs-flow-note{margin-top:.55rem}
.gs-flow-step.is-on .gs-flow-push{transition-delay:.35s}
.gs-flow-toast .ic,.gs-flow-note .ic{flex:0 0 30px;width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.85rem;background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed)}
.gs-flow-email .ic{background:linear-gradient(135deg,#0ea5e9,#2563eb)}
.gs-flow-push .ic{background:linear-gradient(135deg,#16a34a,#22c55e)}
.gs-flow-toast .bd,.gs-flow-note .bd{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.gs-flow-toast .bd strong,.gs-flow-note .bd strong{font-size:.8rem;color:var(--gs-text-primary)}
.gs-flow-toast .bd span,.gs-flow-note .bd span{font-size:.7rem;color:var(--gs-tx2,#64748b)}
.gs-flow-kpi{margin-top:.7rem;font-size:.78rem;color:var(--gs-tx2,#64748b)}
.gs-flow-kpi b{color:var(--gs-cp,#5b21b6);font-size:1rem}
.gs-flow-label{font-size:.82rem;font-weight:600;color:var(--gs-text-secondary);margin-top:.85rem}
.gs-flow-conn{flex:0 0 56px;align-self:flex-start;height:3px;background:var(--gs-bd0,#e2e8f0);border-radius:99px;margin-top:50px;position:relative;overflow:hidden}
.gs-flow-conn span{position:absolute;inset:0;width:0;background:linear-gradient(90deg,var(--gs-cp,#5b21b6),#7c3aed);border-radius:99px;transition:width .6s ease}
.gs-flow-conn.fill span{width:100%}
@media(max-width:767.98px){
  .gs-flow{flex-direction:column;align-items:center;gap:.25rem}
  .gs-flow-step{max-width:380px;width:100%}
  .gs-flow-conn{flex-basis:auto;width:3px;height:28px;margin:0}
  .gs-flow-conn span{inset:0;width:100%;height:0;transition:height .6s ease}
  .gs-flow-conn.fill span{height:100%;width:100%}
}
@media(prefers-reduced-motion:reduce){
  .gs-flow-sec [data-reveal]{opacity:1;transform:none;transition:none}
  .gs-flow-ok,.gs-flow-toast,.gs-flow-note{opacity:1;transform:none;transition:none}
  .gs-flow-conn span{transition:none}
}
.gs-flow-count{display:inline-block}
.gs-flow-step.is-on .gs-flow-count{animation:gsFlowPop .45s ease}
@keyframes gsFlowPop{0%{transform:scale(1)}45%{transform:scale(1.4);color:#16a34a}100%{transform:scale(1)}}

/* ===== Homepage S06e — Team & staff collaboration (gs-tmwk-*, brand-colored, looped) ===== */
.gs-tmwk-sec [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:var(--d,0ms)}
.gs-tmwk-sec.is-in [data-reveal]{opacity:1;transform:none}
.gs-tmwk-org{display:flex;flex-direction:column;align-items:center}
.gs-tmwk-owner{display:flex;align-items:center;gap:.85rem;width:100%;background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);color:#fff;border-radius:16px;padding:1rem 1.1rem;box-shadow:0 18px 40px -18px rgba(91,33,182,.55)}
.gs-tmwk-ava{flex:0 0 46px;width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);color:#fff}
.gs-tmwk-meta{display:flex;flex-direction:column;line-height:1.3;flex:1;min-width:0}
.gs-tmwk-meta strong{font-size:.98rem}
.gs-tmwk-meta span{font-size:.74rem;opacity:.85}
.gs-tmwk-tag{flex:0 0 auto;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;background:rgba(255,255,255,.2);border-radius:999px;padding:.25rem .6rem}
.gs-tmwk-trunk{position:relative;width:3px;height:34px;background:linear-gradient(var(--gs-cp,#5b21b6),var(--gs-bd0,#e2e8f0));overflow:hidden}
.gs-tmwk-trunk-2{height:30px}
.gs-tmwk-pulse{position:absolute;left:50%;top:-8px;width:8px;height:8px;border-radius:50%;background:var(--gs-cp,#5b21b6);transform:translateX(-50%)}
.gs-tmwk-sec.is-in .gs-tmwk-pulse{animation:gsTeamFlow 1.6s ease-in-out infinite}
@keyframes gsTeamFlow{0%{top:-8px;opacity:0}20%{opacity:1}100%{top:34px;opacity:0}}
.gs-tmwk-staff{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem;width:100%}
.gs-tmwk-card{display:flex;align-items:flex-start;gap:.8rem;text-align:left;background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:14px;padding:1rem;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.gs-tmwk-card:hover{transform:translateY(-3px);border-color:var(--gs-cp,#5b21b6);box-shadow:0 16px 34px -18px rgba(91,33,182,.4)}
.gs-tmwk-ava.sm{flex:0 0 40px;width:40px;height:40px;border-radius:11px;font-size:1.1rem;background:var(--gs-cp-s,#f5f3ff);border:1px solid var(--gs-bd0,#e2e8f0);color:var(--gs-cp,#5b21b6)}
.gs-tmwk-cbody{display:flex;flex-direction:column;min-width:0}
.gs-tmwk-cname-row{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;margin-bottom:.3rem}
.gs-tmwk-name{font-size:.92rem;font-weight:700;color:var(--gs-text-primary)}
.gs-tmwk-role-pill{font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff);border-radius:999px;padding:.12rem .45rem;white-space:nowrap}
.gs-tmwk-role-pill.alt{color:#15803d;background:rgba(34,197,94,.13)}
.gs-tmwk-can{font-size:.8rem;color:var(--gs-text-secondary);line-height:1.45}
.gs-tmwk-customer{display:flex;align-items:center;gap:.85rem;width:100%;background:var(--gs-cp-s,#f5f3ff);border:1.5px dashed var(--gs-cp,#5b21b6);border-radius:14px;padding:.95rem 1.05rem}
.gs-tmwk-ava.cust{flex:0 0 44px;width:44px;height:44px;border-radius:12px;font-size:1.25rem;background:#fff;border:1px solid var(--gs-bd0,#e2e8f0);color:var(--gs-cp,#5b21b6)}
.gs-tmwk-note{display:flex;align-items:center;gap:.45rem;font-size:.8rem;color:var(--gs-tx2,#64748b);margin:1.1rem 0 0}
.gs-tmwk-note i{color:var(--gs-cp,#5b21b6)}
.gs-tmwk-feed{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:18px;overflow:hidden;box-shadow:0 24px 54px -26px rgba(2,6,23,.3)}
.gs-tmwk-feed-hd{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.85rem 1.1rem;border-bottom:1px solid var(--gs-bd0,#e2e8f0);background:var(--gs-sf2,#f8fafc)}
.gs-tmwk-live{display:inline-flex;align-items:center;gap:.45rem;font-size:.82rem;font-weight:700;color:var(--gs-text-primary)}
.gs-tmwk-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.7);animation:gsAiPulse 2s infinite}
.gs-tmwk-feed-sub{font-size:.72rem;color:var(--gs-tx2,#64748b)}
.gs-tmwk-feed-body{padding:.85rem 1rem;display:flex;flex-direction:column;gap:.75rem;min-height:330px}
.gs-tmwk-act{display:flex;align-items:center;gap:.75rem}
.gs-tmwk-act-ic{flex:0 0 38px;width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff)}
.gs-tmwk-act-bd{display:flex;flex-direction:column;line-height:1.35;flex:1;min-width:0}
.gs-tmwk-act-who{font-size:.84rem;color:var(--gs-text-primary)}
.gs-tmwk-act-role{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff);border-radius:999px;padding:.1rem .4rem;margin-left:.25rem}
.gs-tmwk-act-do{font-size:.78rem;color:var(--gs-text-secondary)}
.gs-tmwk-act-t{flex:0 0 auto;font-size:.7rem;color:var(--gs-tx3,#94a3b8)}
.gs-tmwk-feed.is-armed .gs-tmwk-act{display:none}
.gs-tmwk-feed.is-armed .gs-tmwk-act.shown{display:flex;animation:gsAiIn .45s cubic-bezier(.16,.84,.44,1)}
@media(max-width:575.98px){.gs-tmwk-staff{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){
  .gs-tmwk-sec [data-reveal]{opacity:1;transform:none;transition:none}
  .gs-tmwk-sec.is-in .gs-tmwk-pulse,.gs-tmwk-dot{animation:none}
  .gs-tmwk-feed.is-armed .gs-tmwk-act{display:flex;animation:none}
}

/* ===== Homepage S06f — Dashboard power tools (⌘K command palette demo) ===== */
.gs-cmd-sec [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:var(--d,0ms)}
.gs-cmd-sec.is-in [data-reveal]{opacity:1;transform:none}
.gs-kbd{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.66rem;font-weight:700;color:var(--gs-tx2,#64748b);background:var(--gs-sf2,#f1f5f9);border:1px solid var(--gs-bd0,#e2e8f0);border-bottom-width:2px;border-radius:6px;padding:.12rem .42rem;white-space:nowrap;line-height:1}
.gs-cmd-feats{list-style:none;margin:1.5rem 0 0;padding:0;display:flex;flex-direction:column;gap:.85rem}
.gs-cmd-feats li{display:flex;align-items:center;gap:.85rem;background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:13px;padding:.8rem .9rem;transition:border-color .2s ease,transform .2s ease}
.gs-cmd-feats li:hover{border-color:var(--gs-cp,#5b21b6);transform:translateX(2px)}
.gs-cmd-ficon{flex:0 0 40px;width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff)}
.gs-cmd-ftext{display:flex;flex-direction:column;line-height:1.4;flex:1;min-width:0}
.gs-cmd-ftext strong{font-size:.9rem;color:var(--gs-text-primary)}
.gs-cmd-ftext span{font-size:.8rem;color:var(--gs-text-secondary)}
.gs-cmd{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:18px;overflow:hidden;box-shadow:0 28px 60px -26px rgba(91,33,182,.45)}
.gs-cmd-bar{display:flex;align-items:center;gap:.5rem;padding:.95rem 1.1rem;border-bottom:1px solid var(--gs-bd0,#e2e8f0);font-size:.95rem;color:var(--gs-text-primary)}
.gs-cmd-bar > .bi-search{color:var(--gs-cp,#5b21b6);font-size:1.05rem}
.gs-cmd-typed{min-height:1em;color:var(--gs-text-primary)}
.gs-cmd-caret{display:inline-block;width:2px;height:1.05em;background:var(--gs-cp,#5b21b6);margin-left:1px;vertical-align:-2px;animation:gsCmdCaret 1s steps(1) infinite}
@keyframes gsCmdCaret{50%{opacity:0}}
.gs-kbd-r{margin-left:auto}
.gs-cmd-acts{display:flex;align-items:center;gap:.5rem;padding:.7rem 1.1rem;border-bottom:1px solid var(--gs-bd0,#e2e8f0);background:var(--gs-sf2,#f8fafc)}
.gs-cmd-btn{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:600;border-radius:9px;padding:.4rem .7rem;background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);color:#fff}
.gs-cmd-btn.ghost{background:var(--gs-surface-1,#fff);border:1px solid var(--gs-bd0,#e2e8f0);color:var(--gs-tx2,#64748b)}
.gs-cmd-acts .gs-cmd-btn.ghost:last-child,.gs-cmd-acts .gs-cmd-btn.ghost:nth-last-child(2){margin-left:0}
.gs-cmd-acts .ghost:last-child{margin-left:auto}
.gs-cmd-panel{padding:.6rem .65rem .8rem}
.gs-cmd-group{font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gs-tx3,#94a3b8);padding:.5rem .6rem .3rem}
.gs-cmd-row{display:flex;align-items:center;gap:.65rem;padding:.55rem .65rem;border-radius:10px;font-size:.86rem;color:var(--gs-text-primary);border-left:3px solid transparent;transition:background .2s ease,border-color .2s ease}
.gs-cmd-row .ic{flex:0 0 30px;width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.9rem;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff)}
.gs-cmd-row .lb{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gs-cmd-row .gs-kbd{margin-left:auto}
.gs-cmd-row.is-active{background:var(--gs-cp-s,#f5f3ff);border-left-color:var(--gs-cp,#5b21b6)}
.gs-cmd-row.is-active .ic{background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);color:#fff}
@media(prefers-reduced-motion:reduce){
  .gs-cmd-sec [data-reveal]{opacity:1;transform:none;transition:none}
  .gs-cmd-caret{animation:none}
}

/* ===== Homepage S11 — Testimonials (real reviews, refined; armed only when JS animates) ===== */
.gs-testi-sec.is-armed [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:var(--d,0ms)}
.gs-testi-sec.is-armed.is-in [data-reveal]{opacity:1;transform:none}
.gs-testi-sec .gs-testi{border-radius:18px;padding:1.75rem;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.gs-testi-sec .gs-testi:hover{transform:translateY(-5px);border-color:var(--gs-cp,#5b21b6);box-shadow:0 24px 50px -22px rgba(91,33,182,.4)}
.gs-testi-top{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.4rem}
.gs-testi-sec .gs-testi-stars{margin-bottom:0}
.gs-testi-sec .gs-testi-stars i.off{color:var(--gs-bd0,#e2e8f0)}
.gs-testi-verified{display:inline-flex;align-items:center;gap:.3rem;font-size:.68rem;font-weight:700;color:#15803d;background:rgba(34,197,94,.12);border-radius:999px;padding:.18rem .5rem;white-space:nowrap}
blockquote.gs-testi-quote{margin:0 0 1.25rem}
.gs-testi-ava{flex:0 0 46px;width:46px;height:46px;border-radius:50%;object-fit:cover;border:1px solid var(--gs-bd0,#e2e8f0)}
.gs-testi-ava-i{display:flex;align-items:center;justify-content:center;font-family:var(--gs-font-display,inherit);font-weight:800;font-size:.95rem;color:#fff;background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);border:0}
.gs-testi-id{display:flex;flex-direction:column;min-width:0}
@media(prefers-reduced-motion:reduce){.gs-testi-sec.is-armed [data-reveal]{opacity:1;transform:none;transition:none}}

/* ===== Homepage S11 — Testimonials sliding marquee (auto-scroll, hover-pause) ===== */
.gs-testi-marquee{position:relative;overflow:hidden;padding:.5rem 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.gs-testi-track{display:flex;align-items:stretch;gap:1.5rem;width:max-content;animation:gsTestiSlide 48s linear infinite}
.gs-testi-marquee:hover .gs-testi-track{animation-play-state:paused}
@keyframes gsTestiSlide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.gs-testi-marquee .gs-testi{flex:0 0 360px;width:360px}
@media(max-width:575.98px){.gs-testi-marquee .gs-testi{flex-basis:300px;width:300px}.gs-testi-track{animation-duration:36s}}
@media(prefers-reduced-motion:reduce){
  .gs-testi-track{animation:none;width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.5rem}
  .gs-testi-marquee{-webkit-mask-image:none;mask-image:none}
  .gs-testi-marquee .gs-testi{scroll-snap-align:start}
}

/* ===== Homepage S10 — Developer API workflow (dark section + animated terminal) ===== */
.gs-api-sec.is-armed [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:var(--d,0ms)}
.gs-api-sec.is-armed.is-in [data-reveal]{opacity:1;transform:none}
.gs-api-eyebrow{color:#c4b5fd}
.gs-api-sub{font-size:1rem;line-height:1.7;color:rgba(255,255,255,.78);margin:0 0 1.6rem}
.gs-api-feats{list-style:none;margin:0 0 1.6rem;padding:0;display:flex;flex-direction:column;gap:1rem}
.gs-api-feats li{display:flex;gap:.85rem;align-items:flex-start}
.gs-api-ficon{flex:0 0 42px;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#c4b5fd;background:rgba(124,58,237,.22);border:1px solid rgba(196,181,253,.25)}
.gs-api-ftext{display:flex;flex-direction:column;line-height:1.45}
.gs-api-ftext strong{font-size:.95rem;color:#fff}
.gs-api-ftext span{font-size:.85rem;color:rgba(255,255,255,.62)}
.gs-api-term{background:#0b1020;border:1px solid rgba(167,139,250,.22);border-radius:16px;overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.7),0 0 70px -24px rgba(124,58,237,.5);height:100%;display:flex;flex-direction:column}
.gs-api-term-hd{flex:0 0 auto}
.gs-api-term-hd{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;background:rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.08)}
.gs-api-dots{display:flex;gap:.4rem}
.gs-api-dots i{width:11px;height:11px;border-radius:50%;background:#475569}
.gs-api-dots i:nth-child(1){background:#ff5f57}.gs-api-dots i:nth-child(2){background:#febc2e}.gs-api-dots i:nth-child(3){background:#28c840}
.gs-api-term-title{font-size:.75rem;color:rgba(255,255,255,.55);font-family:ui-monospace,Menlo,monospace}
.gs-api-method{margin-left:auto;font-size:.62rem;font-weight:700;letter-spacing:.05em;color:#a78bfa;background:rgba(124,58,237,.25);border-radius:6px;padding:.15rem .45rem}
.gs-api-term-body{padding:1.1rem 1.2rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem;line-height:1.5;color:#cbd5e1;white-space:normal;overflow-x:auto;flex:1 1 auto;display:flex;flex-direction:column}
.gs-api-out{flex:0 0 auto}
.gs-api-line{white-space:nowrap;padding:.06rem 0}
.gs-api-codes{margin-top:auto;display:flex;flex-wrap:wrap;gap:.5rem;padding-top:1.1rem;border-top:1px solid rgba(255,255,255,.08)}
.gs-api-code{display:inline-flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:600;border-radius:8px;padding:.32rem .6rem;border:1px solid transparent;white-space:nowrap}
.gs-api-code.ok{color:#4ade80;background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.28)}
.gs-api-code.err{color:#f87171;background:rgba(248,113,113,.1);border-color:rgba(248,113,113,.26)}
.gs-api-code.warn{color:#fbbf24;background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.26)}
.t-prompt{color:#a78bfa;font-weight:700}
.t-str{color:#86efac}.t-key{color:#7dd3fc}.t-num{color:#fdba74}.t-pun{color:#94a3b8}.t-dim{color:#64748b}
.t-ok{color:#22c55e;font-weight:700;background:rgba(34,197,94,.14);border-radius:5px;padding:.05rem .4rem}
.gs-api-caret{display:inline-block;width:8px;height:1em;background:#a78bfa;margin-left:3px;vertical-align:-2px;animation:gsCmdCaret 1s steps(1) infinite}
.gs-api-sec.is-armed .gs-api-line{opacity:0;transform:translateY(4px);transition:opacity .3s ease,transform .3s ease}
.gs-api-sec.is-armed .gs-api-line.shown{opacity:1;transform:none}
@media(max-width:575.98px){.gs-api-term-body{font-size:.74rem}}
@media(prefers-reduced-motion:reduce){
  .gs-api-sec.is-armed [data-reveal]{opacity:1;transform:none;transition:none}
  .gs-api-sec.is-armed .gs-api-line{opacity:1;transform:none}
  .gs-api-caret{animation:none}
}

/* ===== Hero dashboard mock — animated "live" presentation (scoped, wow) ===== */
.gs-hero-visual .gs-dash-card{box-shadow:0 24px 50px -18px rgba(91,33,182,.28),0 0 60px -26px rgba(124,58,237,.45);transition:box-shadow .3s ease}
.gs-hero-visual.is-live .gs-dash-card{animation:gsHeroFloat 7s ease-in-out infinite}
@keyframes gsHeroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.gs-hero-visual.is-live .gs-float-badge{animation:gsDbFloat 5s ease-in-out infinite}
.gs-hero-visual.is-live .gs-float-2{animation-delay:-2.5s}
.gs-hero-visual.is-live .gs-dash-titlebar-badge{position:relative;animation:gsHeroLive 2s ease-in-out infinite}
@keyframes gsHeroLive{0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}55%{box-shadow:0 0 0 6px rgba(34,197,94,0)}}
.gs-hero-visual .gs-dash-stat{transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.gs-hero-visual.is-live .gs-dash-stat:hover{transform:translateY(-3px);border-color:var(--gs-cp,#5b21b6)}
/* tool rows: armed reveal + cycling focus highlight (draws the eye to the tools) */
.gs-hero-visual.is-armed .gs-dash-tool-item{opacity:0;transform:translateX(14px)}
.gs-hero-visual.is-armed .gs-dash-tool-item.in{opacity:1;transform:none;transition:opacity .5s ease,transform .5s cubic-bezier(.16,.84,.44,1)}
.gs-dash-tool-item{transition:background .35s ease,transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.gs-dash-tool-item.is-focus{background:var(--gs-cp-s,#f5f3ff);border-color:var(--gs-cp,#5b21b6);transform:scale(1.035);box-shadow:0 12px 26px -10px rgba(91,33,182,.4);position:relative;z-index:1}
.gs-dash-tool-item.is-focus .gs-dash-tool-name{color:var(--gs-cp,#5b21b6)}
.gs-dash-tool-item.is-focus .gs-dash-tool-logo{transform:scale(1.08)}
.gs-dash-tool-logo{transition:transform .35s ease}
.gs-dash-cat-chip{transition:background .35s ease,color .35s ease,transform .35s ease}
.gs-dash-cat-chip.active{transform:translateY(-1px)}
@media(prefers-reduced-motion:reduce){
  .gs-hero-visual.is-live .gs-dash-card,.gs-hero-visual.is-live .gs-float-badge,.gs-hero-visual.is-live .gs-dash-titlebar-badge{animation:none}
  .gs-hero-visual.is-armed .gs-dash-tool-item{opacity:1;transform:none}
  .gs-dash-tool-item.is-focus{transform:none}
}

/* Hero mock — 5-tool sliding strip (viewport shows 3) + one-line scrolling chips */
.gs-dash-tool-vp{overflow:hidden;margin-bottom:1rem}
.gs-dash-tool-vp .gs-dash-tool-row{margin-bottom:0;transition:transform .55s cubic-bezier(.16,.84,.44,1)}
.gs-dash-cats{display:flex;flex-wrap:nowrap;gap:.4rem;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:2px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.gs-dash-cats::-webkit-scrollbar{display:none}
.gs-dash-cat-chip{flex:0 0 auto;white-space:nowrap}

.gs-tool-logo-img{width:100%;height:100%;object-fit:contain}

/* Mega-menu Featured — modern, eye-catching tool rows + best-seller highlight */
.gs-mega-featured .gs-mega-tool-item{position:relative;display:flex;align-items:center;gap:.65rem;padding:.5rem .6rem;border-radius:11px;text-decoration:none;transition:background .2s ease,transform .2s ease,box-shadow .2s ease}
.gs-mega-featured .gs-mega-tool-item:hover{background:var(--gs-cp-s,#f5f3ff);transform:translateX(3px);box-shadow:0 12px 26px -16px rgba(91,33,182,.55)}
.gs-mega-featured .gs-mega-tool-logo{flex:0 0 38px;width:38px;height:38px;border-radius:10px;background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);font-size:1.05rem;border:1px solid var(--gs-bd0,#e2e8f0);transition:transform .2s ease,background .2s ease,color .2s ease}
.gs-mega-featured .gs-mega-tool-item:hover .gs-mega-tool-logo{background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);color:#fff;transform:scale(1.08) rotate(-3deg);border-color:transparent}
.gs-mega-tool-info{flex:1;min-width:0;display:flex;flex-direction:column}
.gs-mega-tool-name{font-weight:700;font-size:.875rem;color:var(--gs-tx0,#111827);display:flex;align-items:center;gap:.4rem;line-height:1.2}
.gs-mega-featured .gs-mega-tool-item:hover .gs-mega-tool-name{color:var(--gs-cp,#5b21b6)}
.gs-mega-tool-cat{font-size:.72rem;color:var(--gs-tx2,#64748b);margin-top:1px}
.gs-mega-tool-arrow{margin-left:auto;font-size:.72rem;color:var(--gs-cp,#5b21b6);opacity:0;transform:translateX(-5px);transition:opacity .2s ease,transform .2s ease}
.gs-mega-featured .gs-mega-tool-item:hover .gs-mega-tool-arrow{opacity:1;transform:none}
.gs-mega-tool-badge{display:inline-flex;align-items:center;gap:.2rem;font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:#fff;background:linear-gradient(135deg,#f59e0b,#ef4444);border-radius:999px;padding:.08rem .42rem;white-space:nowrap}
.gs-mega-tool-top{background:linear-gradient(135deg,var(--gs-cp-s,#f5f3ff),transparent 80%);box-shadow:inset 3px 0 0 0 var(--gs-cp,#5b21b6)}
.gs-mega-tool-top .gs-mega-tool-logo{background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);color:#fff;border-color:transparent}

/* Mega-menu Featured — roomier spacing + more professional finish */
.gs-mega-featured{width:18.5rem;display:flex;flex-direction:column;gap:.45rem;padding:1.4rem 1.15rem}
.gs-mega-featured-title{margin:0 0 .3rem;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gs-tx2,#64748b);display:flex;align-items:center;gap:.4rem}
.gs-mega-featured-title .bi{color:var(--gs-cp,#5b21b6)}
.gs-mega-featured .gs-mega-tool-item{padding:.62rem .7rem;margin:0}
.gs-mega-featured .gs-mega-tool-logo{flex:0 0 40px;width:40px;height:40px}
.gs-mega-featured .gs-mega-browse-all{margin:.4rem 0 0;padding:.95rem .25rem 0;border-top:1px solid var(--gs-bd0,#e2e8f0);font-weight:700}

/* Compare builder — custom autocomplete dropdown (cross-excludes already-picked tools) */
.cmp-tool-input-wrap{position:relative}
.cmp-ac{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:60;background:var(--gs-sf0,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:var(--gs-rmd,12px);box-shadow:0 18px 40px -18px rgba(15,23,42,.45);padding:.35rem;max-height:18rem;overflow-y:auto}
.cmp-ac-item{display:block;width:100%;text-align:left;border:0;background:transparent;padding:.55rem .7rem;border-radius:9px;font-size:.9rem;color:var(--gs-tx0,#111827);cursor:pointer;transition:background .15s ease,color .15s ease}
.cmp-ac-item:hover,.cmp-ac-item:focus{background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);outline:none}
.cmp-ac-item b{color:var(--gs-cp,#5b21b6);font-weight:700}

/* Compare table — richer, more professional rows (tool header, pricing-model pills, feature list) */
.cmp-th-tool{padding-top:1rem !important;padding-bottom:1rem !important}
.cmp-th-logo{display:flex;align-items:center;justify-content:center;width:46px;height:46px;margin:0 auto .55rem;border-radius:12px;background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);font-size:1.3rem;border:1px solid var(--gs-bd0,#e2e8f0);overflow:hidden}
.cmp-th-name{display:block;font-weight:800;font-size:1rem;color:var(--gs-tx0,#111827);text-decoration:none;line-height:1.25}
.cmp-th-name:hover{color:var(--gs-cp,#5b21b6)}
.cmp-th-cat{display:block;font-size:.72rem;color:var(--gs-tx2,#64748b);margin-top:.15rem}
.cmp-th-remove{display:inline-flex;align-items:center;gap:.25rem;margin-top:.55rem;font-size:.7rem;font-weight:600;color:var(--gs-tx2,#94a3b8);text-decoration:none}
.cmp-th-remove:hover{color:#ef4444}
.cmp-pm{display:inline-block;font-size:.75rem;font-weight:700;padding:.22rem .65rem;border-radius:999px;letter-spacing:.01em}
.cmp-pm-free{background:rgba(22,163,74,.12);color:#15803d}
.cmp-pm-freemium{background:rgba(37,99,235,.12);color:#1d4ed8}
.cmp-pm-paid{background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6)}
.cmp-pm-ent{background:rgba(217,119,6,.14);color:#b45309}
.cmp-muted{color:var(--gs-tx2,#94a3b8);font-weight:500}
.cmp-feat-list{list-style:none;margin:0;padding:0;text-align:left;display:inline-block}
.cmp-feat-list li{display:flex;align-items:flex-start;gap:.4rem;font-size:.8125rem;color:var(--gs-tx1,#334155);padding:.18rem 0;line-height:1.4}
.cmp-feat-list li .cmp-check-yes{font-size:.9rem;margin-top:.1rem;flex-shrink:0}

/* ===== All Tools listing — modern hero + filter toolbar + empty state ===== */
.tools-hero{position:relative;overflow:hidden;padding:2.75rem 0 2.25rem;background:linear-gradient(180deg,var(--gs-cp-s,#f5f3ff) 0%,transparent 100%)}
.tools-hero-blob{position:absolute;top:-40%;right:-10%;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(124,58,237,.16),transparent 70%);pointer-events:none}
.tools-hero-eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gs-cp,#5b21b6);background:#fff;border:1px solid var(--gs-bd0,#e2e8f0);border-radius:999px;padding:.32rem .8rem;box-shadow:var(--gs-sh-sm,0 1px 2px rgba(15,23,42,.06))}
.tools-hero-h1{font-family:var(--gs-fd);font-size:clamp(1.9rem,3.4vw,2.6rem);font-weight:800;letter-spacing:-.03em;color:var(--gs-tx0,#111827);margin:.9rem 0 .5rem}
.tools-hero-lead{font-size:1.05rem;color:var(--gs-tx1,#475569);line-height:1.6;max-width:640px;margin:0}
.tools-hero-stats{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}
.tools-stat{display:flex;flex-direction:column;gap:.1rem;background:#fff;border:1px solid var(--gs-bd0,#e2e8f0);border-radius:14px;padding:.7rem 1.1rem;min-width:7rem;box-shadow:var(--gs-sh-sm,0 1px 2px rgba(15,23,42,.05))}
.tools-stat-num{font-family:var(--gs-fd);font-size:1.35rem;font-weight:800;color:var(--gs-cp,#5b21b6);line-height:1;display:flex;align-items:center;gap:.25rem}
.tools-stat-num .bi{font-size:.85rem;color:#f59e0b}
.tools-stat-lbl{font-size:.74rem;color:var(--gs-tx2,#64748b);font-weight:600}

.tools-filter-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;background:var(--gs-sf0,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:14px;padding:.85rem 1.1rem;margin:1.5rem 0;box-shadow:var(--gs-sh-sm,0 1px 2px rgba(15,23,42,.05))}
.tools-filter-count{font-size:.95rem;color:var(--gs-tx1,#475569)}
.tools-filter-count strong{color:var(--gs-tx0,#111827);font-size:1.05rem}
.tools-filter-controls{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem}
.tools-select-wrap{position:relative;margin:0}
.tools-select{appearance:none;-webkit-appearance:none;background:var(--gs-sf1,#f8fafc) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%2364748b' viewBox='0 0 16 16'%3E%3Cpath d='M3.2 5.6 8 10.4l4.8-4.8'/%3E%3C/svg%3E") no-repeat right .7rem center;border:1px solid var(--gs-bd0,#e2e8f0);border-radius:10px;padding:.55rem 2rem .55rem .85rem;font-size:.875rem;font-weight:600;color:var(--gs-tx0,#111827);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.tools-select:hover{border-color:var(--gs-cp,#5b21b6)}
.tools-select:focus{outline:none;border-color:var(--gs-cp,#5b21b6);box-shadow:0 0 0 3px var(--gs-cp-s,#ede9fe)}
.tools-clear{display:inline-flex;align-items:center;gap:.3rem;font-size:.82rem;font-weight:600;color:var(--gs-tx2,#64748b);text-decoration:none;padding:.5rem .4rem}
.tools-clear:hover{color:#ef4444}

.tools-empty{text-align:center;padding:3.5rem 1.5rem;background:var(--gs-sf0,#fff);border:1px dashed var(--gs-bd0,#e2e8f0);border-radius:18px}
.tools-empty-icon{font-size:2.5rem;color:var(--gs-cp,#5b21b6);opacity:.5}
.tools-empty-title{font-family:var(--gs-fd);font-size:1.25rem;font-weight:700;color:var(--gs-tx0,#111827);margin:.75rem 0 .25rem}
.tools-empty-sub{color:var(--gs-tx2,#64748b);margin-bottom:1rem}
@media(max-width:575.98px){.tools-filter-bar{flex-direction:column;align-items:stretch}.tools-filter-controls{justify-content:space-between}.tools-select{flex:1}}

/* Curated listings — ranked cards + sorted-by pill */
.gs-card-tool-rank{flex-shrink:0;align-self:flex-start;min-width:2rem;height:2rem;padding:0 .5rem;display:inline-flex;align-items:center;justify-content:center;font-family:var(--gs-fd);font-weight:800;font-size:.85rem;line-height:1;color:var(--gs-tx2,#64748b);background:var(--gs-sf1,#f1f5f9);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:9px;box-shadow:var(--gs-sh-sm,0 1px 2px rgba(15,23,42,.08))}
.gs-card-tool-rank-top{color:#fff;background:linear-gradient(135deg,var(--gs-cp,#5b21b6),#7c3aed);border-color:transparent;box-shadow:0 6px 16px -8px rgba(91,33,182,.6)}
.tools-listing-bar{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;margin:1.5rem 0}
.tools-sort-pill{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:700;color:var(--gs-cp,#5b21b6);background:var(--gs-cp-s,#f5f3ff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:999px;padding:.28rem .75rem}

/* About — team member photo (matches the avatar circle) */
.gs-team-photo{width:96px;height:96px;border-radius:50%;object-fit:cover;display:block;margin:0 auto 1.125rem;border:3px solid var(--gs-sf0,#fff);box-shadow:0 6px 18px -8px rgba(91,33,182,.45),0 0 0 1px var(--gs-bd0,#e2e8f0)}

/* Pricing — "+N more features" overflow link (jumps to the compare table) */
.gs-plan-more{display:inline-flex;align-items:center;gap:.35rem;margin-top:.55rem;font-size:.82rem;font-weight:700;color:var(--gs-cp,#5b21b6);text-decoration:none;align-self:flex-start}
.gs-plan-more:hover{text-decoration:underline;color:var(--gs-cp-d,#4c1d95)}
.gs-sec[id="compare"]{scroll-margin-top:90px}

/* ===================== DOMAIN landing (/domain) — DOMAIN-01A ===================== */
.dom-hero{position:relative;overflow:hidden;padding:3.5rem 0 3rem;background:linear-gradient(180deg,var(--gs-cp-s,#f5f3ff) 0%,transparent 100%)}
.dom-hero-blob{position:absolute;border-radius:50%;pointer-events:none;filter:blur(8px);opacity:.5}
.dom-hero-blob-1{top:-30%;left:-6%;width:380px;height:380px;background:radial-gradient(circle,rgba(124,58,237,.16),transparent 70%)}
.dom-hero-blob-2{bottom:-40%;right:-6%;width:420px;height:420px;background:radial-gradient(circle,rgba(61,139,55,.14),transparent 70%)}
.dom-hero-inner{max-width:760px;margin:0 auto}
.dom-h1{font-family:var(--gs-fd);font-size:clamp(2rem,4.5vw,3rem);font-weight:800;letter-spacing:-.03em;line-height:1.12;color:var(--gs-tx0,#111827);margin:1rem 0 .75rem}
.dom-h1 .acc{color:var(--gs-cp,#5b21b6)}
.dom-lead{font-size:1.0625rem;color:var(--gs-tx1,#475569);line-height:1.6;max-width:620px;margin:0 auto 1.75rem}
.dom-search{max-width:680px;margin:0 auto}
.dom-chips,.dom-suggest{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.5rem;margin-top:1.1rem}
.dom-chips-label{font-size:.8rem;font-weight:700;color:var(--gs-tx2,#64748b)}
.dom-suggest-btn{font-size:.82rem;font-weight:600;color:var(--gs-cp,#5b21b6);background:none;border:1px dashed var(--gs-bd1,#cbd5e1);border-radius:999px;padding:.3rem .8rem;cursor:pointer;transition:background .15s,border-color .15s}
.dom-suggest-btn:hover{background:var(--gs-cp-s,#f5f3ff);border-color:var(--gs-cp,#5b21b6)}
.dom-results-hd{margin-bottom:1.5rem}
.dom-result-list{display:flex;flex-direction:column;gap:.85rem;max-width:780px;margin:0 auto}
.dom-result-card{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;background:var(--gs-sf0,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:14px;padding:1rem 1.25rem;transition:box-shadow .2s,border-color .2s}
.dom-result-card:hover{box-shadow:0 14px 30px -18px rgba(15,23,42,.4);border-color:var(--gs-cp-b,#c4b5fd)}
.dom-result-card.is-unavail{opacity:.72}
.dom-result-main{display:flex;align-items:center;gap:.7rem;min-width:0}
.dom-result-ico .bi{font-size:1.25rem}
.dom-result-card .dom-result-ico .bi-check-circle-fill{color:var(--gs-cs,#16a34a)}
.dom-result-card .dom-result-ico .bi-x-circle-fill{color:#ef4444}
.dom-result-name{font-family:var(--gs-fd);font-weight:700;font-size:1.0625rem;color:var(--gs-tx0,#111827);word-break:break-all}
.dom-result-badge{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:.18rem .55rem;border-radius:999px}
.dom-result-badge.ok{background:rgba(22,163,74,.12);color:#15803d}
.dom-result-badge.no{background:rgba(148,163,184,.18);color:#64748b}
.dom-result-end{display:flex;align-items:center;gap:1rem}
.dom-result-price{font-family:var(--gs-fd);font-weight:800;color:var(--gs-tx0,#111827)}
.dom-result-price small{font-weight:500;color:var(--gs-tx2,#94a3b8)}
.dom-result-price.muted{color:var(--gs-tx2,#94a3b8);font-weight:600}
.dom-icard{padding:1.6rem}
.dom-icard-ico{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:13px;background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);font-size:1.4rem;margin-bottom:.9rem}
.dom-icard-title{font-family:var(--gs-fd);font-size:1.0625rem;font-weight:700;color:var(--gs-tx0,#111827);margin:0 0 .4rem}
.dom-icard-desc{font-size:.9rem;color:var(--gs-tx1,#475569);line-height:1.55;margin:0}
.dom-tld-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem}
.dom-tld-card{display:flex;flex-direction:column;gap:.2rem;background:var(--gs-sf0,#fff);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:14px;padding:1.25rem;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s}
.dom-tld-card:hover{transform:translateY(-3px);box-shadow:0 16px 32px -18px rgba(91,33,182,.5);border-color:var(--gs-cp-b,#c4b5fd)}
.dom-tld-name{font-family:var(--gs-fd);font-size:1.5rem;font-weight:800;color:var(--gs-cp,#5b21b6);line-height:1}
.dom-tld-use{font-size:.82rem;color:var(--gs-tx2,#64748b);margin-bottom:.5rem}
.dom-tld-price{font-size:.8rem;color:var(--gs-tx1,#475569)}
.dom-tld-price .from{display:block;font-size:.68rem;color:var(--gs-tx2,#94a3b8)}
.dom-tld-price strong{font-family:var(--gs-fd);font-size:1.05rem;color:var(--gs-tx0,#111827)}
.dom-tld-price small{color:var(--gs-tx2,#94a3b8)}
.dom-feature{padding:1.4rem;text-align:center}
.dom-feature-ico{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:var(--gs-cp-s,#f5f3ff);color:var(--gs-cp,#5b21b6);font-size:1.3rem;margin-bottom:.75rem}
.dom-feature-title{font-family:var(--gs-fd);font-size:1rem;font-weight:700;color:var(--gs-tx0,#111827);margin:0 0 .35rem}
.dom-feature-desc{font-size:.85rem;color:var(--gs-tx1,#475569);line-height:1.5;margin:0}
.dom-transfer{display:grid;grid-template-columns:1.2fr .8fr;gap:2.5rem;align-items:center;background:linear-gradient(135deg,#1a0b3d 0%,#2e1065 55%,#0c2a14 100%);border-radius:24px;padding:2.5rem;color:#fff}
.dom-transfer-h2{font-family:var(--gs-fd);font-size:clamp(1.5rem,3vw,2rem);font-weight:800;letter-spacing:-.02em;color:#fff;margin:.25rem 0 .75rem}
.dom-transfer-sub{color:rgba(255,255,255,.8);line-height:1.6;margin-bottom:1.5rem}
.dom-transfer-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.85rem}
.dom-transfer-steps li{display:flex;align-items:center;gap:.75rem;font-size:.9rem;color:rgba(255,255,255,.92);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:.7rem .9rem}
.dom-transfer-steps .n{flex:0 0 26px;width:26px;height:26px;border-radius:50%;background:#fff;color:#2e1065;font-family:var(--gs-fd);font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center}
.dom-price-wrap{overflow-x:auto;border:1px solid var(--gs-bd0,#e2e8f0);border-radius:16px;background:var(--gs-sf0,#fff)}
.dom-price-table{width:100%;border-collapse:collapse;min-width:560px}
.dom-price-table th,.dom-price-table td{text-align:left;padding:.9rem 1.1rem;border-bottom:1px solid var(--gs-bd0,#e2e8f0);font-size:.92rem;color:var(--gs-tx1,#475569)}
.dom-price-table thead th{font-family:var(--gs-fd);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--gs-tx2,#64748b);background:var(--gs-sf1,#f8fafc)}
.dom-price-table tbody tr:last-child td{border-bottom:0}
.dom-price-table tbody tr:hover{background:var(--gs-cp-s,#f5f3ff)}
.dom-price-table small{color:var(--gs-tx2,#94a3b8)}
.dom-price-tld{font-family:var(--gs-fd);font-size:1.05rem;color:var(--gs-cp,#5b21b6)}
.dom-th-act{text-align:right}
.dom-cta{position:relative;overflow:hidden;text-align:center;padding:4rem 0;background:linear-gradient(135deg,#1a0b3d 0%,#2e1065 55%,#0c2a14 100%);color:#fff}
.dom-cta-blob{position:absolute;top:-50%;left:50%;transform:translateX(-50%);width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(124,58,237,.35),transparent 65%);pointer-events:none}
.dom-cta-h2{font-family:var(--gs-fd);font-size:clamp(1.75rem,3.5vw,2.5rem);font-weight:800;letter-spacing:-.03em;color:#fff;margin:0 0 .6rem}
.dom-cta-sub{color:rgba(255,255,255,.82);font-size:1.05rem;max-width:520px;margin:0 auto 1.75rem}
@media(max-width:767.98px){
  .dom-transfer{grid-template-columns:1fr;gap:1.75rem;padding:1.75rem}
  .dom-result-card{flex-direction:column;align-items:flex-start}
  .dom-result-end{width:100%;justify-content:space-between}
}
@media(max-width:560px){
  .dom-price-table{min-width:0}
  .dom-price-table thead{display:none}
  .dom-price-table tbody tr{display:block;border-bottom:1px solid var(--gs-bd0,#e2e8f0);padding:.5rem 0}
  .dom-price-table td{display:flex;justify-content:space-between;border:0;padding:.45rem 1.1rem}
  .dom-price-table td::before{content:attr(data-label);font-weight:700;color:var(--gs-tx2,#64748b);font-size:.78rem}
  .dom-th-act{justify-content:flex-end !important}
  .dom-th-act::before{content:none !important}
}

/* DOMAIN-01D — live search states */
.dom-maint{display:inline-flex;align-items:center;gap:.6rem;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:12px;padding:.85rem 1.25rem;font-weight:600;margin-top:.5rem}
.dom-maint .bi{font-size:1.1rem}
.dom-result-loading{display:flex;align-items:center;justify-content:center;gap:.6rem;color:var(--gs-tx2,#64748b);font-weight:600;padding:1.5rem 0}
.dom-spinner{width:18px;height:18px;border:2px solid var(--gs-bd1,#cbd5e1);border-top-color:var(--gs-cp,#5b21b6);border-radius:50%;animation:dom-spin .7s linear infinite;display:inline-block}
@keyframes dom-spin{to{transform:rotate(360deg)}}
.dom-result-msg{text-align:center;color:var(--gs-tx1,#475569);background:var(--gs-sf1,#f8fafc);border:1px dashed var(--gs-bd0,#e2e8f0);border-radius:12px;padding:1.1rem;max-width:780px;margin:0 auto}
.dom-result-badge.muted{background:rgba(148,163,184,.18);color:#64748b}

/* ===== Domain search results — modern upgrade (overrides above) ===== */
.dom-result-list{max-width:840px;gap:.7rem}
.dom-result-card{padding:1.05rem 1.4rem;border-radius:16px;align-items:center}
.dom-result-card:hover{transform:translateY(-2px);box-shadow:0 20px 42px -22px rgba(15,23,42,.45);border-color:var(--gs-cp-b,#c4b5fd)}
.dom-result-main{gap:.9rem}
.dom-result-ico .bi{font-size:1.4rem;line-height:1}
.dom-result-namecol{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.dom-result-name{display:inline-flex;align-items:baseline;gap:0;font-size:1.2rem;line-height:1.1;word-break:break-word}
.dom-rc-sld{font-weight:800;color:var(--gs-tx0,#0f172a)}
.dom-rc-tld{font-weight:700;color:var(--gs-cp,#5b21b6)}
.dom-result-metarow{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.dom-result-tag{font-size:.64rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--gs-cp,#5b21b6);background:rgba(124,58,237,.10);padding:.12rem .5rem;border-radius:999px}
.dom-result-badge.ok{display:inline-flex;align-items:center;gap:.35rem}
.dom-result-badge.ok::before{content:"";width:.42rem;height:.42rem;border-radius:50%;background:#16a34a;display:inline-block}
.dom-result-end{gap:1.15rem}
.dom-result-price{font-size:1.2rem;white-space:nowrap}
.dom-result-price small{font-size:.78rem;font-weight:600;color:var(--gs-tx2,#94a3b8);margin-left:.05rem}
.dom-result-cta{border-radius:999px;padding:.5rem 1.2rem;font-weight:700;transition:transform .12s,box-shadow .2s}
.dom-result-cta:hover{transform:translateY(-1px);box-shadow:0 10px 22px -10px rgba(91,33,182,.7)}
/* Best-match / featured card */
.dom-result-card.is-feature{border:1.5px solid var(--gs-cp,#5b21b6);background:linear-gradient(180deg,rgba(124,58,237,.055),rgba(124,58,237,.012));box-shadow:0 20px 44px -24px rgba(91,33,182,.55)}
.dom-result-card.is-feature .dom-result-name{font-size:1.5rem}
.dom-result-card.is-feature .dom-result-ico .bi{font-size:1.7rem;color:var(--gs-cs,#16a34a)}
.dom-result-card.is-feature .dom-result-price{font-size:1.45rem;color:var(--gs-cp,#5b21b6)}
.dom-result-card.is-feature .dom-result-cta{padding:.62rem 1.5rem}
@media(max-width:640px){
  .dom-result-card{padding:1rem 1.1rem}
  .dom-result-name{font-size:1.08rem}
  .dom-result-card.is-feature .dom-result-name{font-size:1.25rem}
  .dom-result-end{width:100%;justify-content:space-between;gap:.6rem}
}
/* Align the "Search results" heading with the result column + tighten the gap from the hero above */
#dom-results{padding-top:1.75rem}
.dom-results-hd{max-width:840px;margin-left:auto;margin-right:auto}
/* FIX: .dom-chips/.dom-suggest use display:flex which beats the [hidden] attribute — force-hide them */
.dom-chips[hidden],.dom-suggest[hidden]{display:none!important}
/* Once a search runs, pull the suggestions up close to the main result (kill the big hero gap) */
.dom-searched .dom-hero{padding-bottom:1rem!important}
.dom-searched #dom-results{padding-top:.5rem!important}
.dom-searched .dom-results-hd{margin-bottom:1rem}
/* Main/exact-match result shown right below the search box */
.dom-main-result{max-width:840px;margin:1.35rem auto 0}
.dom-main-result .dom-result-card{margin:0}
.dom-main-loading{display:flex;align-items:center;justify-content:center;gap:.6rem;color:var(--gs-tx2,#64748b);font-weight:600;padding:1.1rem;background:var(--gs-sf1,#f8fafc);border:1px dashed var(--gs-bd0,#e2e8f0);border-radius:16px}

/* ===== Checkout cart drawer (Phase 1) ===== */
.dom-cart-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:1090;opacity:0;transition:opacity .25s}
.dom-cart-overlay.open{opacity:1}
.dom-cart{position:fixed;top:0;right:0;height:100%;width:min(440px,100%);background:var(--gs-sf0,#fff);z-index:1091;box-shadow:-14px 0 44px rgba(15,23,42,.2);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1)}
.dom-cart.open{transform:translateX(0)}
.dom-cart-head{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 1.3rem;border-bottom:1px solid var(--gs-bd0,#e2e8f0);flex:none}
.dom-cart-head h3{font-size:1.05rem;font-weight:800;margin:0;display:flex;align-items:center;gap:.55rem;color:var(--gs-tx0,#0f172a)}
.dom-cart-head h3 .bi{color:var(--gs-cp,#5b21b6)}
.dom-cart-x{border:0;background:none;font-size:1.7rem;line-height:1;color:var(--gs-tx2,#94a3b8);cursor:pointer;padding:0 .3rem}
.dom-cart-x:hover{color:var(--gs-tx0,#0f172a)}
.dom-cart-body{flex:1;overflow-y:auto;padding:1.3rem}
.dci-card{border:1px solid var(--gs-bd0,#e2e8f0);border-radius:14px;padding:1.1rem;margin-bottom:1.1rem}
.dci-row{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}
.dci-name{font-weight:800;font-size:1.08rem;color:var(--gs-tx0,#0f172a);word-break:break-word}
.dci-name .tld{color:var(--gs-cp,#5b21b6)}
.dci-price{font-weight:800;color:var(--gs-tx0,#0f172a);white-space:nowrap}
.dci-sub{font-size:.82rem;color:var(--gs-tx2,#64748b)}
.dci-meta{margin-top:.85rem;padding-top:.85rem;border-top:1px dashed var(--gs-bd0,#e2e8f0);display:flex;flex-direction:column;gap:.5rem;font-size:.85rem;color:var(--gs-tx1,#475569)}
.dci-meta .bi{color:var(--gs-cp,#5b21b6);margin-right:.45rem}
.dci-total-row{display:flex;align-items:center;justify-content:space-between;margin:.45rem 0;color:var(--gs-tx1,#475569)}
.dci-total-row.grand{font-size:1.25rem;font-weight:800;color:var(--gs-tx0,#0f172a);border-top:1px solid var(--gs-bd0,#e2e8f0);padding-top:.7rem;margin-top:.7rem}
.dom-cart-pay{width:100%;justify-content:center;margin-top:1rem;border-radius:999px}
.dci-gw{display:grid;gap:.55rem;margin:.6rem 0 .2rem}
.dci-gw label{display:flex;align-items:center;gap:.6rem;border:1.5px solid var(--gs-bd0,#e2e8f0);border-radius:12px;padding:.7rem .9rem;cursor:pointer;font-weight:600;color:var(--gs-tx1,#475569);transition:border-color .15s,background .15s}
.dci-gw label:has(input:checked){border-color:var(--gs-cp,#5b21b6);background:rgba(124,58,237,.05)}
.dci-gw label.is-pref{border-color:var(--gs-cp,#5b21b6)}
.dci-gw .bi{color:var(--gs-cp,#5b21b6);font-size:1.15rem}
.dci-gw-pref{margin-left:auto;font-size:.66rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:#fff;background:var(--gs-cp,#5b21b6);border-radius:999px;padding:.18rem .5rem;white-space:nowrap}
.dci-back{background:none;border:0;color:var(--gs-cp,#5b21b6);font-weight:600;cursor:pointer;padding:0;margin-bottom:.85rem;display:inline-flex;align-items:center;gap:.35rem;font-size:.9rem}
.dci-note{font-size:.8rem;color:var(--gs-tx2,#94a3b8);margin-top:.7rem;text-align:center;display:flex;align-items:center;justify-content:center;gap:.4rem}
/* Phase 2 — suggestions + multi-item cart */
.dci-sg-hd{display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--gs-tx0,#0f172a);margin-bottom:.6rem}
.dci-link{background:none;border:0;color:var(--gs-cp,#5b21b6);font-weight:700;font-size:.85rem;cursor:pointer;padding:0}
.dci-sg{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:1px solid var(--gs-bd0,#e2e8f0);border-radius:12px;padding:.7rem .85rem;margin-bottom:.55rem}
.dci-sg-main{min-width:0}
.dci-sg-name{font-size:14px;color:var(--gs-tx0,#0f172a)}
.dci-sg-hide{display:flex;align-items:center;gap:.5rem;margin:.35rem 0 .8rem;font-size:.85rem;font-weight:500;color:var(--gs-tx2,#64748b);cursor:pointer}
.dci-sg-hide input{flex:none;margin:0}
.dci-sg-items{transition:filter .25s ease,opacity .25s ease}
.dci-sg-items.is-blurred{filter:blur(4px);opacity:.5;pointer-events:none;user-select:none}
.dci-sg-sub{font-size:.8rem;color:var(--gs-tx2,#64748b)}
.dci-sg-end{display:flex;align-items:center;gap:.6rem;flex:none}
.dci-sg-price{font-size:.82rem;font-weight:700;color:var(--gs-tx1,#475569);white-space:nowrap}
.dci-sg-add{width:34px;height:34px;border-radius:9px;border:1.5px solid var(--gs-cp,#5b21b6);background:#fff;color:var(--gs-cp,#5b21b6);cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none;transition:background .15s}
.dci-sg-add.on{background:var(--gs-cp,#5b21b6);color:#fff}
.dci-sg-badge{font-size:.72rem;font-weight:700;line-height:1;padding:.34rem .55rem;border-radius:999px;border:1px solid currentColor;background:#fff;white-space:nowrap}
.dci-sg.is-unavail{opacity:.7}
.dci-sg.is-unavail .dci-sg-name{color:var(--gs-tx2,#64748b)}
.dci-unavail-note{font-size:.82rem;color:var(--gs-tx1,#475569);background:var(--gs-sf1,#f8fafc);border:1px solid var(--gs-bd0,#e2e8f0);border-radius:10px;padding:.7rem .85rem;text-align:center}
.dci-skip{display:block;width:100%;text-align:center;margin-top:.7rem}
.dci-card-title{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--gs-tx2,#64748b);margin-bottom:.5rem}
.dci-line{display:flex;align-items:center;justify-content:space-between;padding:.4rem 0;color:var(--gs-tx1,#475569);font-size:.9rem}
.dci-line-end{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;color:var(--gs-tx0,#0f172a)}
.dci-rm{border:0;background:none;color:#ef4444;font-size:1.15rem;line-height:1;cursor:pointer;padding:0 .2rem}
/* Smaller add button + tool detail view */
.dci-sg-add{width:28px;height:28px;border-radius:8px}
.dci-sg-add .bi{font-size:.82rem}
.dci-sg-main{cursor:pointer;flex:1;min-width:0}
.dci-sg-main:hover .dci-sg-name{color:var(--gs-cp,#5b21b6)}
.dci-detail{text-align:center;border:1px solid var(--gs-bd0,#e2e8f0);border-radius:16px;padding:1.5rem 1.25rem;margin-bottom:.9rem}
.dci-detail-ico{margin-bottom:.55rem}
.dci-detail-name{font-size:1.3rem;font-weight:800;color:var(--gs-tx0,#0f172a)}
.dci-detail-tag{font-size:.9rem;color:var(--gs-tx1,#475569);margin-top:.2rem}
.dci-detail-desc{font-size:.85rem;color:var(--gs-tx2,#64748b);margin:.85rem 0 1.1rem;line-height:1.55}
.dci-detail-plan{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:1.5px solid var(--gs-cp,#5b21b6);border-radius:12px;padding:.85rem 1rem;text-align:left;margin-bottom:1rem}
.dci-detail-planname{font-weight:800;color:var(--gs-tx0,#0f172a)}
.dci-detail-price{font-weight:800;color:var(--gs-tx0,#0f172a)}
.dci-detail-sub{font-size:.8rem;color:var(--gs-tx2,#64748b)}
/* Dynamic tool icon in list + detail, plan selector, payment icon, add-on tooltip */
.dci-sg-main{display:flex;align-items:center;gap:.6rem}
.dci-sg-ico{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;font-size:1.2rem;font-weight:800;color:var(--gs-cp,#5b21b6);flex:none}
.dci-sg-ico img{width:28px;height:28px;border-radius:7px;object-fit:contain}
.dci-detail-ico{font-size:2rem;font-weight:800;color:var(--gs-cp,#5b21b6)}
.dci-detail-ico img{width:54px;height:54px;border-radius:12px;object-fit:contain}
.dci-detail-ico .bi{font-size:2.3rem;color:var(--gs-cp,#5b21b6)}
.dci-plan-label{font-size:.78rem;font-weight:700;color:var(--gs-tx2,#64748b);text-align:left;margin:.2rem 0 .5rem}
.dci-plan-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}
.dci-plan{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:1.5px solid var(--gs-bd0,#e2e8f0);border-radius:12px;padding:.8rem 1rem;text-align:left;cursor:pointer;transition:border-color .15s,background .15s}
.dci-plan.sel{border-color:var(--gs-cp,#5b21b6);background:rgba(124,58,237,.05)}
.dci-gw-img{width:22px;height:22px;border-radius:5px;object-fit:contain;vertical-align:middle}
.dci-addon-note{cursor:help;display:inline-flex;align-items:center;gap:.3rem}
/* Payment processing animation */
.dci-pay-anim{text-align:center;padding:2rem 1rem}
.dci-pay-anim .dom-spinner{margin:0 auto 1.25rem}
.dci-pay-steps{list-style:none;margin:0 auto;padding:0;text-align:left;max-width:280px}
.dci-pay-steps li{display:flex;align-items:center;gap:.6rem;padding:.4rem 0;color:var(--gs-tx2,#94a3b8);opacity:.45;transition:opacity .3s,color .3s}
.dci-pay-steps li.on{opacity:1;color:var(--gs-tx1,#334155)}
.dci-pay-dot{width:.55rem;height:.55rem;border-radius:50%;background:var(--gs-bd1,#cbd5e1);flex:none;transition:background .3s}
.dci-pay-steps li.on .dci-pay-dot{background:var(--gs-cs,#16a34a)}
.dci-qr{text-align:center;padding:.25rem 0 1rem}
.dci-qr-amount{display:inline-flex;flex-direction:column;align-items:center;gap:.1rem;margin:0 auto 1rem;padding:.7rem 1.4rem;background:linear-gradient(135deg,var(--gs-cp,#7c3aed),#9333ea);border-radius:14px;color:#fff;box-shadow:0 8px 22px rgba(124,58,237,.30)}
.dci-qr-amount-lbl{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;opacity:.9}
.dci-qr-amount-val{font-size:1.6rem;font-weight:800;line-height:1.05}
.dci-qr-hint{color:var(--gs-tx2,#64748b);font-size:.88rem;line-height:1.5;max-width:300px;margin:0 auto 1rem}
.dci-qr-box{position:relative;display:inline-block;padding:1rem;background:#fff;border-radius:18px;box-shadow:0 10px 30px rgba(2,6,23,.12)}
.dci-qr-corner{position:absolute;width:20px;height:20px;border:3px solid var(--gs-cp,#7c3aed)}
.dci-qr-corner.tl{top:9px;left:9px;border-right:0;border-bottom:0;border-radius:8px 0 0 0}
.dci-qr-corner.tr{top:9px;right:9px;border-left:0;border-bottom:0;border-radius:0 8px 0 0}
.dci-qr-corner.bl{bottom:9px;left:9px;border-right:0;border-top:0;border-radius:0 0 0 8px}
.dci-qr-corner.br{bottom:9px;right:9px;border-left:0;border-top:0;border-radius:0 0 8px 0}
.dci-qr-img{display:block;width:224px;height:224px;max-width:62vw;max-height:62vw;object-fit:contain;image-rendering:pixelated}
.dci-qr-wait{margin-top:1rem;font-size:.9rem;font-weight:600;color:var(--gs-tx1,#475569);display:flex;align-items:center;justify-content:center;gap:.5rem}
.dci-qr-pulse{width:.6rem;height:.6rem;border-radius:50%;background:var(--gs-cs,#16a34a);display:inline-block;animation:dciPulse 1.3s infinite}
@keyframes dciPulse{0%{box-shadow:0 0 0 0 rgba(22,163,74,.5)}70%{box-shadow:0 0 0 8px rgba(22,163,74,0)}100%{box-shadow:0 0 0 0 rgba(22,163,74,0)}}
.dci-qr-apps{margin-top:1.25rem;padding-top:1.1rem;border-top:1px solid var(--gs-bd1,#eef2f7)}
.dci-qr-apps-lbl{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gs-tx3,#94a3b8);margin-bottom:.6rem}
.dci-qr-apps-row{display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center}
.dci-qr-app{display:inline-flex;align-items:center;gap:.4rem;padding:.34rem .75rem;font-size:.8rem;font-weight:600;color:var(--gs-tx1,#334155);background:var(--gs-sf1,#f8fafc);border:1px solid var(--gs-bd1,#e2e8f0);border-radius:999px}
.dci-qr-app::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--c,#7c3aed);flex:none}
.dci-qr-fullpage{display:inline-block;margin-top:1.1rem;font-size:.88rem;font-weight:600;color:var(--gs-cp,#7c3aed);text-decoration:none}
.dci-qr-fullpage:hover{text-decoration:underline}
.dci-error{text-align:center;padding:1.75rem .5rem 1rem}
.dci-error-icon{display:inline-flex;align-items:center;justify-content:center;width:66px;height:66px;margin:0 auto .9rem;border-radius:50%;background:#fef3c7;color:#f59e0b;font-size:2rem;line-height:1}
.dci-error-title{font-size:1.18rem;font-weight:800;color:var(--gs-tx1,#1e293b);margin-bottom:.5rem}
.dci-error-msg{color:var(--gs-tx2,#64748b);font-size:.92rem;line-height:1.55;max-width:340px;margin:0 auto 1.25rem}
.dci-err-back{display:inline-flex;align-items:center;justify-content:center;width:100%;margin-top:.6rem;padding:.6rem;background:none;border:none;color:var(--gs-cp,#7c3aed);font-weight:600;font-size:.92rem;cursor:pointer;border-radius:10px;transition:background .15s}
.dci-err-back:hover{background:var(--gs-cp-s,#f5f3ff);text-decoration:none}
/* In-drawer auth (login + register + social) */
.dci-auth-tabs{display:flex;gap:.5rem;margin-bottom:1rem;border-bottom:1px solid var(--gs-bd1,#e2e8f0)}
.dci-auth-tab{flex:1;padding:.6rem;background:none;border:none;border-bottom:2px solid transparent;font-weight:700;font-size:.92rem;color:var(--gs-tx2,#64748b);cursor:pointer;margin-bottom:-1px}
.dci-auth-tab.is-active{color:var(--gs-cp,#7c3aed);border-bottom-color:var(--gs-cp,#7c3aed)}
.dci-auth-form{display:none;flex-direction:column;gap:.7rem}
.dci-auth-form.is-active{display:flex}
.dci-auth-field{display:flex;flex-direction:column;gap:.3rem;font-size:.8rem;font-weight:600;color:var(--gs-tx2,#475569)}
.dci-auth-field input,.dci-auth-field select{padding:.6rem .7rem;border:1px solid var(--gs-bd1,#e2e8f0);border-radius:9px;font-size:.9rem;color:var(--gs-tx1,#1e293b);background:#fff;font-weight:500}
.dci-auth-field input:focus,.dci-auth-field select:focus{outline:none;border-color:var(--gs-cp,#7c3aed);box-shadow:0 0 0 3px rgba(124,58,237,.12)}
.dci-auth-2col{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.dci-phone{display:flex;align-items:stretch}
.dci-phone-dial{display:inline-flex;align-items:center;padding:0 .55rem;background:var(--gs-sf1,#f1f5f9);border:1px solid var(--gs-bd1,#e2e8f0);border-right:0;border-radius:9px 0 0 9px;font-size:.82rem;font-weight:700;color:var(--gs-tx2,#64748b);white-space:nowrap}
.dci-phone input{border-radius:0 9px 9px 0!important;flex:1;min-width:0}
.dci-auth-row{display:flex;align-items:center;justify-content:space-between;font-size:.82rem;margin:.1rem 0}
.dci-auth-check{display:flex;align-items:flex-start;gap:.45rem;font-size:.8rem;font-weight:500;color:var(--gs-tx2,#64748b);cursor:pointer;line-height:1.45}
.dci-auth-check input{margin-top:.15rem;flex:none}
.dci-auth-check a,.dci-auth-link{color:var(--gs-cp,#7c3aed);text-decoration:none;font-weight:600}
.dci-auth-alert{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;border-radius:9px;padding:.6rem .75rem;font-size:.85rem;margin-bottom:.75rem}
.dci-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none}
.dci-ac{position:relative}
.dci-ac-list{position:absolute;top:100%;left:0;right:0;z-index:40;margin:.25rem 0 0;padding:.25rem;list-style:none;background:#fff;border:1px solid var(--gs-bd1,#e2e8f0);border-radius:10px;box-shadow:0 14px 34px rgba(2,6,23,.18);max-height:240px;overflow-y:auto}
.dci-ac-item{display:flex;align-items:center;gap:.55rem;padding:.5rem .6rem;border-radius:8px;cursor:pointer;font-size:.88rem;color:var(--gs-tx1,#1e293b)}
.dci-ac-item:hover{background:var(--gs-cp-s,#f5f3ff)}
.dci-ac-flag{width:24px;height:18px;flex:none;border-radius:3px;object-fit:cover;border:1px solid rgba(0,0,0,.08);display:inline-block}
.dci-ac-name{flex:1;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dci-ac-dial{color:var(--gs-tx2,#64748b);font-size:.8rem;font-weight:700;flex:none}
.dci-auth .gs-oauth-grid{margin-bottom:.4rem}
/* Social "More ways to sign in" collapse toggle (global — login/register/drawer/connected-accounts) */
.gs-oauth-more{display:flex;align-items:center;justify-content:center;gap:.45rem;width:100%;margin-top:.55rem;padding:.6rem;background:transparent;border:1px dashed var(--gs-bd1,#cbd5e1);border-radius:10px;color:var(--gs-tx2,#64748b);font-size:.85rem;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.gs-oauth-more:hover{background:var(--gs-cp-s,#f5f3ff);border-color:var(--gs-cp,#a78bfa);color:var(--gs-cp,#7c3aed)}
.gs-oauth-more-caret{font-size:.7rem;transition:transform .2s}
.gs-oauth-wrap.is-open .gs-oauth-more-caret{transform:rotate(180deg)}