/* =========================================================
   REDUX — DESIGN TOKENS (shared across all pages)
   ========================================================= */
:root{
  /* Brand */
  --rdx-blue-50:#EAF1FB; --rdx-blue-100:#D6E3F7; --rdx-blue-200:#A8C2EC;
  --rdx-blue-300:#7AA2E2; --rdx-blue-400:#4F84D8; --rdx-blue-500:#3366CC;
  --rdx-blue-600:#2A55AA; --rdx-blue-700:#214488; --rdx-blue-800:#1A3669;
  --rdx-sky-50:#ECF6FD; --rdx-sky-100:#D6EBFA; --rdx-sky-200:#ADD7F4;
  --rdx-sky-300:#82C2EC; --rdx-sky-400:#429EDF; --rdx-sky-500:#2A8FD3;
  --title-accent-blue:var(--rdx-blue-400);

  /* Ink */
  --rdx-ink-900:#25282A; --rdx-ink-800:#2E3642; --rdx-ink-700:#364153;
  --rdx-ink-500:#51545A; --rdx-ink-400:#6B7280; --rdx-ink-300:#86868B;
  --rdx-ink-200:#9CA3AF; --rdx-ink-150:#D1D5DC; --rdx-ink-100:#E5E7EB;
  --rdx-ink-50:#F6F6F8; --rdx-ink-25:#F9FAFB;
  --rdx-paper:#FFFFFF; --rdx-soft:#F8FAFC; --rdx-stroke:#C8D8E0;

  /* Status */
  --rdx-success:#00A63E; --rdx-success-soft:#E6F5EC;
  --rdx-warning:#FBBF24; --rdx-warning-amber:#F59E0B; --rdx-warning-soft:#FEF3CD;
  --rdx-danger:#EF4444; --rdx-danger-soft:#FDECEC;
  --table-status-size:13px; --table-status-icon-size:14px;
  --table-status-gap:6px; --table-status-leading:1.25;

  /* Text */
  --text-strong:var(--rdx-ink-900); --text-default:var(--rdx-ink-700);
  --text-muted:var(--rdx-ink-400); --text-on-dark:#FFFFFF;
  --text-on-dark-2:rgba(255,255,255,0.78); --text-on-dark-3:rgba(255,255,255,0.55);

  /* Type */
  --font-display:"Open Sans","Helvetica Neue",Arial,sans-serif;
  --font-sans:"Open Sans","Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* Fluid type */
  --fluid-display-xl:clamp(44px,6vw + 12px,80px);
  --fluid-display-lg:clamp(36px,4.5vw + 8px,56px);
  --fluid-h1:clamp(28px,2.6vw + 10px,44px);
  --fluid-h2:clamp(24px,2vw + 10px,36px);
  --fluid-h3:clamp(20px,1vw + 14px,24px);
  --fluid-lead:clamp(15px,0.6vw + 13px,18px);
  --route-hero-title-font:var(--font-sans);
  --route-hero-title-size:var(--fluid-h1);
  --route-section-title-font:var(--font-sans);
  --route-section-title-size:var(--fluid-h2);
  --route-section-title-prominent-size:clamp(30px,3vw,44px);
  --route-card-title-font:var(--font-sans);
  --route-card-title-size:var(--fluid-h3);
  --pdp-hero-title-size:var(--route-hero-title-size);
  --pdp-hero-title-leading:var(--hero-title-leading);
  --pdp-hero-lede-size:15px;
  --pdp-hero-lede-leading:1.6;
  --pdp-hero-action-size:13px;

  /* Spacing */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-7:32px; --sp-8:40px; --sp-9:48px; --sp-10:64px;
  --sp-11:80px; --sp-12:96px; --sp-13:120px;

  /* Radius */
  --r-sm:6px; --r-md:8px; --r-lg:12px; --r-xl:16px; --r-2xl:24px; --r-pill:999px;

  /* Shadow */
  --sh-card:0 1px 2px rgba(0,0,0,.05),0 1px 3px rgba(0,0,0,.08);
  --sh-card-md:0 4px 12px rgba(0,0,0,.08);
  --sh-card-lg:0 12px 32px rgba(0,0,0,.10);
  --sh-glow-blue:0 8px 22px rgba(51,102,204,.30);
  --sh-glow-blue-strong:0 12px 30px rgba(51,102,204,.40);

  /* Layout */
  --container-w:1200px;
  --gutter-mobile:20px; --gutter-tablet:32px; --gutter-desktop:48px;
  --section-y-mobile:48px; --section-y-tablet:72px; --section-y-desktop:96px;
  --hit-min:44px;
  --safe-bottom:env(safe-area-inset-bottom,0px);

  /* Motion */
  --t-fast:120ms cubic-bezier(.2,.7,.3,1);
  --t-base:180ms cubic-bezier(.2,.7,.3,1);
  --t-slow:280ms cubic-bezier(.2,.7,.3,1);

  /* Decorative */
  --grad-band:linear-gradient(95deg,var(--rdx-blue-500) 0%,var(--rdx-sky-400) 100%);
  --grad-band-cta:linear-gradient(110deg,#1E4FAA 0%,#3F89E0 50%,#1E4FAA 100%);
  --grad-shield:linear-gradient(180deg,#3f95ff 0%,#1f6cd1 100%);
  --grad-band-vertical:linear-gradient(180deg,var(--rdx-blue-500) 0%,var(--rdx-blue-600) 100%);
  --shadow-hero-visual:0 24px 60px rgba(0,0,0,.40);
  --shadow-cta-rect:0 8px 22px rgba(51,102,204,.22);
  --shadow-cta-rect-hover:0 12px 30px rgba(51,102,204,.32);
  --cta-rect-radius:var(--r-md);
  --cta-rect-padding-y:14px;
  --cta-rect-padding-x:22px;
  --text-link-cta-color:var(--rdx-blue-500);
  --text-link-cta-hover:var(--rdx-blue-600);
  --text-link-cta-size:15px;
  --text-link-cta-weight:700;
  --text-link-cta-underline-offset:2px;
  --eyebrow-chip-padding-y:7px;
  --eyebrow-chip-padding-x:14px;
  --eyebrow-chip-radius:var(--r-pill);
  --eyebrow-chip-bg:var(--surface-on-dark-card-strong);
  --eyebrow-chip-border:var(--stroke-on-dark);
  --eyebrow-chip-color:var(--on-dark);
  --eyebrow-chip-size:10px;
  --eyebrow-chip-weight:800;
  --eyebrow-chip-tracking:.16em;
  --eyebrow-chip-transform:uppercase;

  /* Semantic surfaces */
  --surface-page:var(--rdx-paper);
  --surface-soft:var(--rdx-soft);
  --surface-tint:var(--rdx-blue-50);
  --surface-dark:var(--rdx-ink-900);
  --surface-dark-soft:#0F1620;
  --surface-dark-midnight:#0B1018;
  --surface-on-dark-card:rgba(255,255,255,0.04);
  --surface-on-dark-card-strong:rgba(255,255,255,0.06);
  --surface-on-dark-faint:rgba(255,255,255,0.03);

  /* On-dark text scale */
  --on-dark:#FFFFFF;
  --on-dark-strong:rgba(255,255,255,0.92);
  --on-dark-2:rgba(255,255,255,0.78);
  --on-dark-3:rgba(255,255,255,0.65);
  --on-dark-4:rgba(255,255,255,0.55);
  --on-dark-5:rgba(255,255,255,0.40);

  /* Stroke (on-dark) */
  --stroke-on-dark:rgba(255,255,255,0.08);
  --stroke-on-dark-soft:rgba(255,255,255,0.06);
  --stroke-on-dark-strong:rgba(255,255,255,0.18);

  /* Overlays / scrims */
  --scrim-soft:rgba(13,16,28,0.50);
  --scrim-strong:rgba(13,16,28,0.55);
  --scrim-black-15:rgba(0,0,0,0.15);

  /* Forms */
  --field-border:#cbd2dc;
  --field-bg:#FFFFFF;
  --field-focus-ring:rgba(51,102,204,0.18);
  --field-focus-ring-soft:rgba(36,121,217,0.15);

  /* Status soft-fill (translucent versions for chips on light bg) */
  --rdx-success-trans:rgba(31,138,91,0.10);

  /* Accent gradients/atmospherics */
  --orb-tint-blue:rgba(56,124,232,0.55);
  --orb-tint-blue-soft:rgba(56,124,232,0.20);
  --orb-tint-blue-faint:rgba(36,121,217,0.18);

  /* Homepage hero */
  --hero-surface:var(--surface-dark);
  --hero-text:var(--on-dark);
  --hero-accent:var(--title-accent-blue);
  --hero-body-text:var(--on-dark-2);
  --hero-visual-surface:var(--rdx-paper);
  --hero-visual-radius:var(--r-md);
  --hero-visual-shadow:var(--shadow-hero-visual);
  --hero-container-padding-y:0px;
  --hero-copy-max:560px;
  --hero-body-max:480px;
  --hero-title-leading:1.1;
  --hero-title-gap:18px;
  --hero-title-font:var(--font-sans);
  --hero-body-size:15px;
  --hero-body-size-md:16px;
  --hero-body-leading:1.6;
  --hero-body-gap:var(--sp-6);
  --hero-grid-gap:var(--sp-7);
  --hero-grid-gap-md:var(--sp-9);
  --hero-grid-gap-lg:var(--sp-10);
  --hero-padding-y:56px;
  --hero-padding-y-md:var(--sp-11);
  --hero-padding-y-lg:var(--sp-12);
  --hero-grid-columns-md:1.05fr 1fr;
  --hero-cta-gap:var(--sp-3);
  --hero-cta-gap-bottom:var(--sp-6);
  --hero-cta-font:var(--font-sans);
  --hero-cta-primary-hover-color:var(--on-dark);
  --hero-badge-gap:10px;
  --hero-eyebrow-display:inline;
  --hero-eyebrow-color:var(--hero-text);
  --hero-decor-z:var(--z-raised);
  --hero-content-z:calc(var(--z-raised) + 1);
  --hero-orb-radius:50%;
  --hero-orb-1-color:var(--rdx-ink-800);
  --hero-orb-1-size:380px;
  --hero-orb-1-x:-120px;
  --hero-orb-1-y:-120px;
  --hero-orb-1-opacity:.55;
  --hero-orb-2-color:var(--rdx-blue-700);
  --hero-orb-2-size:280px;
  --hero-orb-2-x:-40px;
  --hero-orb-2-y:-180px;
  --hero-orb-2-opacity:.4;

  /* Contact form */
  --contact-layout-gap:48px;
  --contact-form-surface:#F8FAFC;
  --contact-form-border:#DDE3EA;
  --contact-form-radius:var(--r-md);
  --contact-form-padding:28px;
  --contact-form-row-gap:18px;
  --contact-form-column-gap:16px;
  --contact-form-label-color:var(--rdx-ink-900);
  --contact-form-label-size:12px;
  --contact-form-label-leading:1.25;
  --contact-form-label-gap:7px;
  --contact-form-field-bg:#FFFFFF;
  --contact-form-field-border:var(--rdx-ink-100);
  --contact-form-field-radius:var(--r-sm);
  --contact-form-field-height:50px;
  --contact-form-field-padding-x:14px;
  --contact-form-field-text:var(--text-strong);
  --contact-form-field-placeholder:var(--rdx-ink-400);
  --contact-form-field-focus:var(--rdx-blue-500);
  --contact-form-field-focus-ring:var(--field-focus-ring-soft);
  --contact-form-message-min-height:154px;
  --contact-card-padding-x:24px;
  --contact-card-padding-y:22px;
  --contact-map-radius:var(--r-sm);

  /* Footer */
  --footer-bg-color:#000000;
  --footer-bg-image:url("../images/footer-bg.png");
  --footer-bg-position:50% 50%;
  --footer-bg-size:cover;
  --footer-bg-repeat:no-repeat;
  --footer-min-height:clamp(194px,calc(8vw + 92px),246px);
  --footer-inner-padding-y-start:36px;
  --footer-inner-padding-y-end:22px;
  --footer-inner-gap:32px;
  --footer-logo-width:150px;
  --footer-logo-height:auto;
  --footer-contact-color:#429edf;

  /* Storefront product detail */
  --shop-product-container-w:1256px;
  --shop-product-card-bg:var(--rdx-ink-900);
  --shop-product-card-radius:var(--r-lg);
  --shop-product-card-padding:32px;
  --shop-product-card-gap:48px;
  --shop-product-card-text:rgba(255,255,255,.8);
  --shop-product-desc-size:18px;
  --shop-product-desc-leading:1.7;
  --shop-product-callout-bg:var(--rdx-ink-25);
  --shop-product-callout-border:var(--rdx-ink-100);

  /* Shop catalog cards */
  --shop-catalog-card-bg:#FFFFFF;
  --shop-catalog-card-body-bg:#F9FAFB;
  --shop-catalog-card-border:#DDE3EA;
  --shop-catalog-card-border-hover:#B8D8EF;
  --shop-catalog-card-title:var(--rdx-ink-900);
  --shop-catalog-card-copy:var(--rdx-ink-500);
  --shop-catalog-card-media-bg:#FFFFFF;
  --shop-catalog-card-radius:0;
  --shop-catalog-card-title-size:24px;
  --shop-catalog-card-title-leading:1.18;
  --shop-catalog-card-cta-color:var(--rdx-blue-500);
  --shop-catalog-card-cta-hover:var(--rdx-blue-600);
  --shop-catalog-card-cta-size:15px;
  --mobile-product-media-ratio:4 / 3;
  --mobile-product-media-padding:var(--sp-4);
  --mobile-product-media-max-block:230px;
  --mobile-product-image-max-inline:220px;
  --mobile-product-image-max-block:190px;
  --clinic-popup-max-width:270px;
  --clinic-popup-padding-y:18px;
  --clinic-popup-padding-x:18px;
  --clinic-popup-title-size:17px;
  --clinic-popup-body-size:14px;
  --clinic-popup-phone-icon-size:16px;

  /* Electronic Rice route */
  --rice-hero-bg:var(--surface-dark);
  --rice-hero-text:var(--on-dark);
  --rice-hero-accent:var(--title-accent-blue);
  --rice-hero-muted:var(--on-dark-2);
  --rice-hero-card-bg:rgba(255,255,255,0.045);
  --rice-hero-card-border:rgba(255,255,255,0.18);
  --rice-hero-min-height:595px;
  --rice-hero-pad-y:100px;
  --rice-hero-title-size:var(--route-hero-title-size);
  --rice-tldr-bg:#FFFFFF;
  --rice-tldr-card-bg:#F3F4F7;
  --rice-tldr-card-text:var(--text-default);

  /* Z-index scale */
  --z-base:0; --z-raised:10; --z-sticky:100; --z-footer:150; --z-header:200;
  --z-overlay:800; --z-drawer:900; --z-modal:1000; --z-toast:1100;

  /* Breakpoints (reference) */
  --bp-sm:480px; --bp-md:768px; --bp-lg:1024px; --bp-xl:1280px;
}

@media (min-width:1280px){
  :root{--footer-bg-position:0% 0%}
}

@media (min-width:1024px) and (max-width:1279px){
  :root{--footer-min-height:210px}
}

@media (max-width:1023px){
  :root{
    --footer-min-height:auto;
    --footer-inner-padding-y-start:48px;
    --footer-inner-padding-y-end:24px;
    --footer-inner-gap:22px;
  }
}

@media (min-width:768px) and (max-width:1023px){
  :root{
    --footer-min-height:179px;
    --footer-inner-padding-y-start:34px;
    --footer-inner-padding-y-end:20px;
  }
}

@media (max-width:480px){
  :root{
    --contact-form-padding:20px;
    --contact-card-padding-x:20px;
    --footer-bg-size:auto;
    --footer-inner-padding-y-start:30px;
    --footer-inner-padding-y-end:14px;
    --footer-inner-gap:14px;
  }
}

/* Reset & base */
*,*::before,*::after{box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-sans);font-size:15px;line-height:1.55;color:var(--text-default);background:var(--rdx-paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
button{font:inherit;cursor:pointer;border:0;background:transparent;color:inherit}
a{color:inherit;text-decoration:none}

/* Container */
.container{width:100%;max-width:var(--container-w);margin-inline:auto;padding-inline:var(--gutter-mobile)}
@media (min-width:768px){.container{padding-inline:var(--gutter-tablet)}}
@media (min-width:1024px){.container{padding-inline:var(--gutter-desktop)}}

/* Section rhythm */
.section-y{padding-block:var(--section-y-mobile)}
@media (min-width:768px){.section-y{padding-block:var(--section-y-tablet)}}
@media (min-width:1024px){.section-y{padding-block:var(--section-y-desktop)}}

/* Type roles */
.eyebrow{font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.h1{font-weight:800;font-size:var(--fluid-h1);line-height:1.1;color:var(--text-strong);text-transform:uppercase;margin:0}
.h2{font-weight:800;font-size:var(--fluid-h2);line-height:1.1;color:var(--text-strong);text-transform:uppercase;margin:0}
.h3{font-weight:700;font-size:var(--fluid-h3);line-height:1.25;color:var(--text-strong);margin:0}
.display-lg{font-family:var(--font-display);font-weight:700;font-size:var(--fluid-display-lg);line-height:1;color:var(--text-strong);text-transform:uppercase;margin:0;letter-spacing:.01em}
.lead{font-size:var(--fluid-lead);line-height:1.55;color:var(--text-default)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding:14px 24px;border-radius:99px;border:1px solid transparent;cursor:pointer;transition:all var(--t-base);line-height:1;white-space:nowrap;min-height:var(--hit-min)}
.btn--primary{background:var(--rdx-blue-500);color:#fff;box-shadow:var(--sh-glow-blue)}
.btn--primary:hover{background:var(--rdx-blue-600);box-shadow:var(--sh-glow-blue-strong);transform:translateY(-1px)}
.btn--secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn--secondary:hover{background:rgba(255,255,255,.08);border-color:#fff}
.btn--outline{background:transparent;color:var(--rdx-blue-500);border-color:var(--rdx-blue-500)}
.btn--outline:hover{background:var(--rdx-blue-500);color:#fff}
.btn--inverted{background:#fff;color:var(--rdx-blue-500)}
.btn--inverted:hover{background:var(--rdx-blue-50)}
.arr{font-weight:700;margin-left:2px;line-height:1}

/* Rectangular CTA variant — for hero sections per design system */
.btn--rect{border-radius:var(--cta-rect-radius);padding:var(--cta-rect-padding-y) var(--cta-rect-padding-x)}
.btn--rect.btn--primary{box-shadow:var(--shadow-cta-rect)}
.btn--rect.btn--primary:hover{box-shadow:var(--shadow-cta-rect-hover);transform:translateY(-1px)}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:99px;font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.badge--check{background:var(--rdx-sky-50);color:var(--rdx-blue-500);border:1px solid var(--rdx-blue-100);padding:8px 14px}
.badge--check .check{width:16px;height:16px;border-radius:50%;background:var(--rdx-blue-500);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:10px}
.hero .badge--check,.page-hero .badge--check{background:transparent;color:var(--on-dark);border-color:var(--stroke-on-dark-strong)}
.eyebrow-chip{display:inline-flex;align-items:center;padding:var(--eyebrow-chip-padding-y) var(--eyebrow-chip-padding-x);border-radius:var(--eyebrow-chip-radius);background:var(--eyebrow-chip-bg);border:1px solid var(--eyebrow-chip-border);color:var(--eyebrow-chip-color);font-size:var(--eyebrow-chip-size);font-weight:var(--eyebrow-chip-weight);letter-spacing:var(--eyebrow-chip-tracking);text-transform:var(--eyebrow-chip-transform)}
.badge--soft{background:var(--rdx-blue-50);color:var(--rdx-blue-500)}
.badge--dark{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.12)}

/* Icon tile */
.icon-tile{width:56px;height:56px;border-radius:var(--r-md);background:var(--rdx-blue-500);color:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(51,102,204,.25)}
.icon-tile svg{width:26px;height:26px}
.icon-tile--circle{border-radius:50%}

/* Image placeholder utility (for product photos) */
.img-slot{background:repeating-linear-gradient(135deg,#eef2f7 0 12px,#e3e9f1 12px 24px);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:11px;color:var(--text-muted)}