/* ============================================================
   BUZL — SETTINGS FILE (the single source of truth)
   Re-theme the whole site by editing ONLY this file.
   All colours come in bg/ink PAIRS so text is never invisible.
   Values here are consumed by tailwind.config (names -> vars).
   ============================================================ */

:root,
[data-theme="light"] {
  color-scheme: light;

  /* ---- Surfaces (paired with ink) ---- */
  --color-bg: #FFFFFF;            /* page / section band A (white)     */
  --color-bg-ink: #0F172A;
  --color-surface: #F4F7FD;       /* faint tint for alternating bands  */
  --color-surface-ink: #0F172A;
  --color-navy: #0F172A;          /* dark strips / footer             */
  --color-navy-ink: #F8FAFC;
  --color-navy-muted: #93ADFD;    /* secondary text on navy           */

  /* ---- Text ---- */
  --color-ink: #0F172A;           /* default body text                */
  --color-muted: #526079;         /* secondary text on light          */

  /* ---- Brand (Electric Blue) ---- */
  --color-brand: #0040FF;
  --color-brand-ink: #FFFFFF;
  --color-brand-strong: #1733EC;  /* hover                            */
  --color-soft: #EEF4FF;          /* soft brand chip bg               */
  --color-soft-ink: #1B2996;

  /* ---- Accent (Energy Amber) — CTAs / highlights only ---- */
  --color-accent: #F59E0B;
  --color-accent-ink: #0F172A;
  --color-accent-strong: #D97706; /* hover                            */
  --color-star: #F59E0B;

  /* ---- Semantic ---- */
  --color-success: #10B981;
  --color-success-ink: #FFFFFF;
  --color-danger: #DC2626;        /* form-error border / message      */
  --color-danger-ink: #FFFFFF;

  /* ---- Lines & rings ---- */
  --color-line: #D6DEEC;
  --color-ring: #0040FF;
  --color-placeholder: #7A8699;

  /* ---- Gradients (from brand kit — do not invent new ones) ---- */
  --grad-hero: linear-gradient(160deg, #0A0F3A 0%, #0040FF 62%, #3B5FF5 100%);
  --grad-hero-soft: linear-gradient(120deg, #E4EDFF 0%, #EEF1FF 42%, #F4ECFF 66%, #FFF3E2 100%);
  --grad-navy: linear-gradient(135deg, #0F172A 0%, #0040FF 100%);
  --scrim: linear-gradient(180deg, rgba(10,15,58,.15), rgba(10,15,58,.55));

  /* ---- Type ---- */
  --font-display: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-label: "Inter", ui-sans-serif, system-ui, sans-serif;

  --text-display-1: clamp(2.25rem, 1.35rem + 3.9vw, 4.5rem);   /* 36 -> 72 */
  --text-display-2: clamp(1.9rem, 1.28rem + 2.7vw, 3.25rem);   /* 30 -> 52 */
  --text-h2: clamp(1.6rem, 1.18rem + 1.9vw, 2.75rem);          /* 26 -> 44 */
  --text-h3: clamp(1.25rem, 1.06rem + 0.9vw, 1.75rem);         /* 20 -> 28 */
  --text-lead: clamp(1.06rem, 0.98rem + 0.42vw, 1.3rem);
  --text-body: clamp(1rem, 0.97rem + 0.16vw, 1.0625rem);       /* >=16px  */
  --text-eyebrow: clamp(0.72rem, 0.68rem + 0.16vw, 0.8rem);

  /* ---- Spacing ---- */
  --space-section: clamp(3.5rem, 2rem + 6vw, 7rem);
  --gutter: clamp(1.25rem, 0.6rem + 2vw, 2.5rem);

  /* ---- Radius ---- */
  --radius-input: 0.375rem;
  --radius-btn: 0.625rem;
  --radius-card: 1rem;
  --radius-pill: 9999px;

  /* ---- Shadows (rgba black only, never coloured) ---- */
  --shadow-card: 0 1px 3px rgba(0,0,0,.10), 0 1px 2px rgba(0,0,0,.06);
  --shadow-lift: 0 8px 20px rgba(0,0,0,.10), 0 3px 6px rgba(0,0,0,.06);
  --shadow-pop: 0 18px 40px rgba(0,0,0,.16), 0 8px 14px rgba(0,0,0,.08);
}

[data-theme="dark"] {
  color-scheme: dark;

  --color-bg: #070B1E;
  --color-bg-ink: #F3F6FD;
  --color-surface: #121A34;
  --color-surface-ink: #F3F6FD;
  --color-navy: #05081A;
  --color-navy-ink: #F3F6FD;
  --color-navy-muted: #9DB2E8;

  --color-ink: #F3F6FD;
  --color-muted: #A7B4CE;

  --color-brand: #5E80FF;
  --color-brand-ink: #05081A;
  --color-brand-strong: #7D98FF;
  --color-soft: #16204A;
  --color-soft-ink: #BFCFFE;

  --color-accent: #FBBF24;
  --color-accent-ink: #1A1206;
  --color-accent-strong: #FCD34D;
  --color-star: #FBBF24;

  --color-success: #34D399;
  --color-success-ink: #05140E;
  --color-danger: #F87171;
  --color-danger-ink: #1A0606;

  --color-line: #263255;
  --color-ring: #7D98FF;
  --color-placeholder: #8494B4;

  --grad-hero: linear-gradient(160deg, #05081A 0%, #10237A 60%, #274BC7 100%);
  --grad-hero-soft: linear-gradient(120deg, #0A1330 0%, #101C46 48%, #1B1636 74%, #241A05 100%);
  --grad-navy: linear-gradient(135deg, #05081A 0%, #12237A 100%);
  --scrim: linear-gradient(180deg, rgba(3,6,20,.30), rgba(3,6,20,.68));

  --shadow-card: 0 1px 3px rgba(0,0,0,.45), 0 1px 2px rgba(0,0,0,.35);
  --shadow-lift: 0 10px 24px rgba(0,0,0,.55), 0 4px 8px rgba(0,0,0,.4);
  --shadow-pop: 0 22px 48px rgba(0,0,0,.6), 0 10px 18px rgba(0,0,0,.45);
}

/* ---- High-contrast: stronger separation in both themes ---- */
@media (prefers-contrast: more) {
  :root, [data-theme="light"] {
    --color-bg: #FFFFFF;
    --color-surface: #FFFFFF;
    --color-ink: #000000;
    --color-bg-ink: #000000;
    --color-surface-ink: #000000;
    --color-muted: #26324A;
    --color-line: #1B2540;
    --color-brand: #0026B3;
    --color-accent-ink: #000000;
    --color-placeholder: #3A465E;
  }
  [data-theme="dark"] {
    --color-bg: #000000;
    --color-surface: #0B1226;
    --color-ink: #FFFFFF;
    --color-bg-ink: #FFFFFF;
    --color-surface-ink: #FFFFFF;
    --color-muted: #D4DDF2;
    --color-line: #5A6C9E;
  }
}

/* ---- Keyframes (plain-CSS exception) ---- */
@keyframes buzl-rise {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes buzl-pulse {
  0%, 100% { transform: scale(1); opacity: .55; }
  50%      { transform: scale(1.35); opacity: 0; }
}
@keyframes buzl-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}

/* Reveal-on-scroll base (JS adds .is-in) */
.reveal { opacity: 0; }
.reveal.is-in { animation: buzl-rise .6s cubic-bezier(.2,.7,.2,1) both; }

/* ---- Reduced motion (visitor setting) ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1 !important; }
}

/* ---- Save-data: drop heavy decoration (plain-CSS exception) ---- */
@media (prefers-reduced-data: reduce) {
  .decor { display: none !important; }
}

/* ---- Embedded / third-party widget tweaks (markup not ours) ---- */
.embed-frame { color-scheme: normal; }

/* ---- GrapesJS Editor Custom Overrides ---- */
.rounded-card.border.border-line\/60.bg-surface\/70.p-2.shadow-pop.backdrop-blur {
  width: 100%;
  max-width: 38em;
}
#iych3y9 {
  color: black;
  width: 100%;
  height: auto;
  display: block;
}
#inoxng5 {
  color: black;
  border-radius: 9px;
  box-shadow: 0 0 5px 0 black;
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
}
#i33sfai {
  color: black;
  border-radius: 9px;
  box-shadow: 0 0 5px 0 black;
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
}
.font-display.text-display-1.font-bold.text-ink {
  font-size: 3em;
  color: var(--color-brand);
  margin: 10px 0 0 0;
}
.font-display.text-display-1.text-ink {
  font-size: 2em;
}
#i0knx5l {
  letter-spacing: -0.28px;
}
#imbdmav {
  font-family: var(--font-body);
  font-size: 17px;
}