/* ==========================================================================
   TEMPORARY colour preview — full azure palette.
   Replaces every site colour from style.css with an azure-family match:
   dark navy -> deep azure, teal buttons/links -> azure blue,
   sand/gold accents -> sky blue, cream backgrounds -> pale azure.

   To go back to the original colours, delete the line
     <link rel="stylesheet" href="assets/css/theme-preview.css?...">
   from index.html, products.html, gallery.php and 404.html (or delete this file).
   To keep these colours for good, copy the values into :root in style.css instead.
   ========================================================================== */
:root {
  /* Dark tones */
  --ink: #0C2A48;         /* was #13222C — headings and main text */
  --ink-soft: #4A6583;    /* was #53616B — body / secondary text */
  --navy: #0A3A66;        /* was #0F2533 — hero, history, page headers, dark panels */
  --navy-deep: #06294A;   /* was #0A1A24 — top bar and footer */
  --navy-line: #174C7C;   /* was #1A3040 — lines on dark backgrounds */
  --navy-border: #22598B; /* was #22394A — borders on dark backgrounds */
  --slate: #8DAECE;       /* was #7F97A3 — muted text on dark backgrounds */
  --mist: #BCD4EA;        /* was #B3C2CB — light text on dark backgrounds */

  /* Buttons, links and highlights (were teal) */
  --teal: #0A6FD1;        /* was #0A7C86 — buttons, icons, active states */
  --teal-text: #0862B8;   /* was #0A6B74 — links and small coloured text */
  --teal-hover: #085BAD;  /* was #07616A — button hover */
  --teal-dark: #064A8C;   /* was #064E55 — link hover */

  /* Accents (were sand / gold) */
  --sand: #7CC4F5;        /* was #D9B98A — "built to last", timeline, highlights on dark */
  --sand-dark: #4FA3E0;   /* was #C7AE86 — accent bars and bullets on light */
  --steel: #BFD6E8;       /* was #C9D3D9 — input and tag borders */

  /* Light tones (were cream) */
  --cream: #EEF7FB;       /* was #F5F1EA — page and section backgrounds, image areas, tags */
  --cream-deep: #DCEDF5;  /* was #EAE3D7 — placeholders, dividers inside cards */
  --line: #D0E4EE;        /* was #E3DACB — header / section borders */
  --card-line: #C2D9E5;   /* was #DDD3C2 — card borders, chips, language toggle */
}

/* Colours written directly in style.css / index.html, re-tinted to match */
.btn--ghost, .timeline__btn, .timeline__btn:disabled, .lightbox__btn { border-color: #4F7DA8; }
.hero::before {
  background: linear-gradient(to right, rgba(6,41,74,.94) 0%, rgba(10,58,102,.86) 32%, rgba(10,58,102,.35) 62%, rgba(10,58,102,.05) 100%);
}
[dir="rtl"] .hero::before {
  background: linear-gradient(to left, rgba(6,41,74,.94) 0%, rgba(10,58,102,.86) 32%, rgba(10,58,102,.35) 62%, rgba(10,58,102,.05) 100%);
}
@media (max-width: 1080px) {
  .hero::before, [dir="rtl"] .hero::before {
    background: linear-gradient(to bottom, rgba(6,41,74,.9) 0%, rgba(10,58,102,.82) 60%, rgba(10,58,102,.7) 100%);
  }
}
.lightbox::backdrop { background: rgba(6, 41, 74, .92); }
.lightbox__btn { background: rgba(6, 41, 74, .6); }
.cta-band p { color: #DCEBFA; }
.field input::placeholder, .field textarea::placeholder { color: #8298AE; }
/* Distributor badge rings (drawn in index.html) */
.distributor__badge circle:nth-child(1) { stroke: var(--teal); }
.distributor__badge circle:nth-child(2) { stroke: var(--sand); }