@charset "UTF-8";

/* Original BGVP visual language, centralized without changing values. */
:root {
  --bgvp-hero-media-ratio: 1 / 1;
  --bgvp-hero-display-size: 36.5rem;
  --bgvp-color-hero-surface: #fff;
  --bgvp-color-brand-ink: #15212d;
  --bgvp-color-brand-ink-soft: #243140;
  --bgvp-color-brand-blue: #1769d1;
  --bgvp-color-brand-blue-dark: #0d4f9e;
  --bgvp-color-action-blue: #1769d1;
  --bgvp-color-action-blue-dark: #0d4f9e;
  --bgvp-color-content-blue-dark: #164e8f;
  --bgvp-color-cyan: #71b8e6;
  --bgvp-color-ice-page: #fbfcfd;
  --bgvp-color-metal-soft: #e9edef;
  --bgvp-color-media-surface: #f7f9fa;
  --bgvp-color-media-substrate: #eef1f3;
  --bgvp-color-media-line: #d3dbe0;
  --bgvp-color-paper-veil: rgba(255, 255, 255, 0.62);
  --bgvp-color-brand-blue-soft: rgba(23, 105, 209, 0.05);
  --bgvp-color-hero-indicator: rgba(21, 33, 45, 0.35);
  --bgvp-color-nav-deep: #071a2b;
  --bgvp-color-nav-text: #fff;
  --bgvp-color-nav-line: rgba(193, 211, 223, 0.18);
  --bgvp-color-nav-active: rgba(113, 184, 230, 0.12);
  --bgvp-color-nav-light-surface: var(--bgvp-color-ice-page);
  --bgvp-color-nav-dropdown-surface: var(--bgvp-color-paper);
  --bgvp-color-nav-link: var(--bgvp-color-brand-ink);
  --bgvp-color-nav-logo-tile: var(--bgvp-color-nav-deep);
  --bgvp-color-nav-hover: var(--bgvp-color-brand-blue-soft);
  --bgvp-color-nav-dropdown-line: var(--bgvp-color-storefront-line);
  --bgvp-color-nav-toggle-surface: var(--bgvp-color-paper);
  --bgvp-color-nav-toggle-stroke: var(--bgvp-color-nav-deep);
  --bgvp-color-nav-mobile-panel: var(--bgvp-color-paper);
  --bgvp-color-nav-mobile-action: var(--bgvp-color-paper);
  --bgvp-color-nav-mobile-line: var(--bgvp-color-storefront-line);
  --bgvp-color-footer-surface: var(--bgvp-color-ice-page);
  --bgvp-color-footer-raised: var(--bgvp-color-paper);
  --bgvp-color-footer-text: var(--bgvp-color-brand-ink);
  --bgvp-color-footer-muted: var(--bgvp-color-storefront-muted);
  --bgvp-color-footer-line: var(--bgvp-color-storefront-line);
  --bgvp-color-storefront-hero-surface: #0b2237;
  --bgvp-color-storefront-hero-line: rgba(113, 184, 230, 0.24);
  --bgvp-color-storefront-card-hover-line: rgba(23, 105, 209, 0.45);
  --bgvp-color-storefront-media-surface: var(--bgvp-color-media-substrate);
  --bgvp-color-admin-utility-surface: var(--bgvp-color-ice-page);
  --bgvp-color-admin-utility-text: var(--bgvp-color-brand-ink-soft);
  --bgvp-color-admin-search-surface: var(--bgvp-color-paper);

  --bgvp-color-paper: #fbfcfd;
  --bgvp-color-storefront-canvas: #f3f5f6;
  --bgvp-color-admin-canvas: #f0f2f3;
  --bgvp-color-storefront-soft: #e9edef;
  --bgvp-color-admin-soft: #e7ebee;
  --bgvp-color-storefront-line: #d5dce1;
  --bgvp-color-admin-line: #d2d9df;
  --bgvp-color-content-line: #d5dce1;
  --bgvp-color-storefront-muted: #596776;
  --bgvp-color-admin-muted: #62707c;
  --bgvp-color-content-muted: #61707c;

  --bgvp-color-success: #0a664d;
  --bgvp-color-admin-success: #168765;
  --bgvp-color-danger: #97313b;
  --bgvp-color-notice-danger-surface: #fff0f1;
  --bgvp-color-notice-warning-surface: #fff5dd;
  --bgvp-color-notice-warning-ink: #79530b;
  --bgvp-color-notice-info-surface: #eaf3ff;
  --bgvp-color-admin-danger: #b8474f;

  --bgvp-shadow-storefront: 0 12px 30px rgba(21, 33, 45, 0.07);
  --bgvp-shadow-admin: 0 10px 24px rgba(21, 33, 45, 0.06);
  --bgvp-shadow-sm: 0 5px 16px rgba(21, 33, 45, 0.06);
  --bgvp-shadow-card: 0 10px 28px rgba(21, 33, 45, 0.07);
  --bgvp-shadow-elevated: 0 18px 42px rgba(7, 26, 43, 0.16);
  --bgvp-shadow-hero-media: 0 10px 24px rgba(21, 33, 45, 0.06);
  --bgvp-shadow-navigation: 0 0.5rem 1.5rem rgba(7, 26, 43, 0.14);
  --bgvp-shadow-navigation-light: 0 0.4rem 1.1rem rgba(21, 33, 45, 0.06);
  --bgvp-focus-ring-navigation: 0 0 0 3px rgba(23, 105, 209, 0.18);
  --bgvp-shadow-footer: 0 -0.35rem 1rem rgba(21, 33, 45, 0.035);

  --bgvp-type-micro: max(0.8125rem, 13px);
  --bgvp-type-metadata: max(0.875rem, 14px);
  --bgvp-type-label: max(0.875rem, 14px);
  --bgvp-type-small: max(0.875rem, 14px);
  --bgvp-type-compact: max(0.875rem, 14px);
  --bgvp-type-control: max(0.9375rem, 15px);
  --bgvp-type-support: max(0.9375rem, 15px);
  --bgvp-type-body: max(1rem, 16px);
  --bgvp-type-value: max(1rem, 16px);
  --bgvp-type-card-meta: max(0.8125rem, 13px);
  --bgvp-type-card-title: max(0.9375rem, 15px);
  --bgvp-type-card-price: max(1rem, 16px);
  --bgvp-type-policy: max(1rem, 16px);
  --bgvp-type-page-title: clamp(1.5rem, 2.2vw, 2.25rem);
  --bgvp-type-section-title: clamp(1.25rem, 1.8vw, 1.65rem);
  --bgvp-type-admin-page-title: clamp(1.5rem, 1.6vw, 1.85rem);

  --bgvp-space-1: 0.25rem;
  --bgvp-space-2: 0.5rem;
  --bgvp-space-3: 0.75rem;
  --bgvp-space-4: 1rem;
  --bgvp-space-5: 1.5rem;
  --bgvp-space-6: 2rem;
  --bgvp-space-8: 3rem;
  --bgvp-section-gap: clamp(1.5rem, 3vw, 2.5rem);
  --bgvp-panel-padding: clamp(0.75rem, 1.5vw, 1.25rem);
  --bgvp-stack-gap: clamp(0.5rem, 1vw, 0.9rem);
  --bgvp-inline-gap: clamp(0.35rem, 0.8vw, 0.65rem);

  --bgvp-surface-canvas: var(--bgvp-color-storefront-canvas);
  --bgvp-surface-paper: var(--bgvp-color-paper);
  --bgvp-surface-soft: var(--bgvp-color-storefront-soft);
  --bgvp-surface-raised: #ffffff;
  --bgvp-radius-panel: 10px;
  --bgvp-radius-card: 12px;
  --bgvp-radius-pill: 999px;
  /* Storefront frames (panels, cards, notices, table rows, option cards, steppers) share one corner radius so
     nested boxes never mix rounded and square edges. Pills and circles keep --bgvp-radius-pill / 50%. */
  --bgvp-radius-frame: 4px;

  /* Motion envelope: attack = interaction feedback, sustain = reveals, reverb = brand storytelling only. */
  --bgvp-motion-attack: 160ms;
  --bgvp-motion-sustain: 560ms;
  --bgvp-motion-reverb: 1200ms;
  --bgvp-motion-curtain: 900ms;
  --bgvp-ease-attack: cubic-bezier(0.2, 0.9, 0.3, 1);
  --bgvp-ease-decay: cubic-bezier(0.16, 1, 0.3, 1);
  --bgvp-ease-curtain: cubic-bezier(0.7, 0, 0.2, 1);
  --bgvp-motion-fast: 140ms;
  --bgvp-motion-base: 220ms;
  --bgvp-motion-slow: 420ms;
  --bgvp-motion-reveal: var(--bgvp-motion-sustain);
  --bgvp-motion-quiet: 220ms;
  --bgvp-motion-hero-text: 720ms;
  --bgvp-motion-hero-media: 1100ms;
  --bgvp-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --bgvp-motion-reveal-ease: var(--bgvp-ease-decay);
  --bgvp-motion-distance: 12px;
  --bgvp-motion-reveal-distance: 28px;
  --bgvp-motion-quiet-distance: 8px;
  --bgvp-motion-media-scale: 1.06;
  --bgvp-motion-stagger-step: 70ms;
  --bgvp-motion-stagger-cap: 420ms;
  --bgvp-intro-duration: 1400ms;
  --bgvp-intro-offset: 0ms;
  --bgvp-carousel-interval: 6000ms;

  --bgvp-content-max: 1320px;
  --bgvp-admin-max: 1440px;
  --bgvp-reading-measure: 70ch;
  --bgvp-page-gutter: clamp(1rem, 3vw, 2rem);
  --bgvp-admin-workspace-min: 72px;
  --bgvp-admin-dense-padding: 0.75rem;
  --bgvp-admin-dense-gap: 0.5rem;
  --bgvp-admin-empty-min: 8rem;

  --bgvp-control-radius: 8px;
  --bgvp-button-height: 48px;
  --bgvp-compact-control-height: 44px;
  --bgvp-field-height: 50px;
  --bgvp-control-border: #dce4ee;
  --bgvp-control-border-hover: #c5d1df;
  --bgvp-control-placeholder: #7b899c;
  --bgvp-control-readonly: #edf2f8;
  --bgvp-focus-ring: 0 0 0 3px rgba(31, 98, 199, 0.14);

  --bgvp-color-legacy-store-ink: #101827;
  --bgvp-color-legacy-store-muted: #697386;
  --bgvp-color-legacy-store-line: #dfe5ed;
  --bgvp-color-legacy-store-soft: #f0f3f7;
  --bgvp-color-legacy-store-accent: #3979ed;
}

/* Storefront frames (panels, cards, summaries) get more breathing room than dense admin panels,
   so text never sits against a border. Administration keeps the :root value. */
.storefront-surface {
  --bgvp-panel-padding: clamp(1.25rem, 2.2vw, 1.75rem);
}

@media (max-width: 767.98px) {
  .storefront-surface {
    --bgvp-panel-padding: 1.125rem;
  }
}

/* Shared responsive contract for every storefront and administration page. */
@media (max-width: 767.98px) {
  :root {
    --bgvp-page-gutter: 1rem;
    --bgvp-panel-padding: clamp(0.875rem, 4vw, 1.125rem);
    --bgvp-stack-gap: 0.75rem;
    --bgvp-inline-gap: 0.5rem;
    --bgvp-button-height: 44px;
    --bgvp-compact-control-height: 44px;
    --bgvp-field-height: 44px;
    --bgvp-type-page-title: clamp(1.75rem, 7.2vw, 2rem);
    --bgvp-type-section-title: clamp(1.25rem, 5.6vw, 1.5rem);
    --bgvp-type-admin-page-title: clamp(1.5rem, 6.5vw, 1.875rem);
    --bgvp-admin-dense-padding: 0.625rem;
    --bgvp-admin-dense-gap: 0.5rem;
    --bgvp-motion-sustain: 420ms;
    --bgvp-motion-curtain: 700ms;
    --bgvp-motion-hero-text: 480ms;
    --bgvp-motion-hero-media: 800ms;
    --bgvp-motion-reveal-distance: 16px;
    --bgvp-motion-stagger-step: 50ms;
    --bgvp-motion-stagger-cap: 250ms;
    --bgvp-intro-duration: 800ms;
  }
}

@media (max-width: 359.98px) {
  :root {
    --bgvp-page-gutter: 0.875rem;
    --bgvp-panel-padding: 0.875rem;
  }
}