/* ============================================================
   MYCAESTATEPLAN — Español color scheme
   Warm cream background with deep blue accents.
   Golden marigold highlights. Warm sage green for positive.
   Loaded AFTER site-v5.css to override the English navy scheme.
   ============================================================ */

:root {
  --bg: #fdf6f0;
  --surface: #fffaf5;
  --text: #3d2820;
  --muted: #7a5e50;
  --terracotta: #1a5276;
  --coral: #5b9bd5;
  --sand: #f2c94c;
  --sage: #8fbc8f;
  --blue: #f7e8c0;
  --border: #e8d5c4;
  --brand-main: #0c2338;
}

/* --- Logo colors — identical to English for consistency --- */
.brand-my,
.brand-line-2 {
  color: #0a1628;
}

.brand-ca {
  color: #1a3a6e;
}

body {
  background: #fdf6f0;
  color: #3d2820;
}

/* --- Header --- */
.site-header {
  background: rgba(253, 246, 240, 0.96);
}

.main-nav a {
  color: #5a3a30;
}

.main-nav a:hover {
  color: #1a5276;
}

/* --- Cards --- */
.card, .package-card, .doc-card {
  box-shadow: 0 8px 20px rgba(80, 40, 30, 0.06);
}

.warm {
  background: #fff5ee;
}

.cream {
  background: #fffaf2;
}

.soft-green {
  background: #eaf5ea;
}

.soft-blue {
  background: #fef9ed;
}

/* --- Buttons --- */
.primary {
  background: #1a5276;
  color: #fff;
}

.secondary {
  background: #fff;
  border-color: #5b9bd5;
  color: #0c2338;
}

.tertiary {
  background: transparent;
  border-color: #e8d5c4;
  color: #3d2820;
}

/* --- Language toggle --- */
.lang-toggle {
  background: #1a5276;
  color: #fff;
  border-color: #1a5276;
  box-shadow: 0 2px 0 rgba(80, 40, 30, 0.14);
}

.lang-toggle:hover {
  background: #154360;
  border-color: #154360;
}

/* --- Typography --- */
.lead {
  color: #6b4d3d;
}

label {
  color: #4a3025;
}

/* --- Form inputs --- */
input, select, textarea {
  border-color: #dbbfaa;
}

#productSelect[disabled] {
  background: #fff5ee;
  color: #3d2820;
}

/* --- Eyebrow / accent --- */
.eyebrow {
  color: #1a5276;
}

/* --- Package cards --- */
.essentials {
  background: #eef2f7;
  border-color: #b0c4d8;
}

.solo {
  background: #e8eef5;
  border-color: #8baac4;
}

.family {
  background: #f0f5e5;
  border-color: #b0cc90;
}

/* --- Compare table --- */
.compare-table th {
  background: #e8eef5;
}

.compare-table .yes {
  color: #4a8c3f;
}

.compare-table .no {
  color: #c0392b;
}

/* --- FAQ --- */
.faq-list details[open] summary {
  color: #1a5276;
}

/* --- Mobile nav --- */
@media (max-width: 860px) {
  .main-nav {
    box-shadow: 0 10px 28px rgba(80, 40, 30, 0.12);
  }
}

/* --- Footer --- */
.footer-cols a:hover {
  color: #1a5276;
}

/* --- Focus rings --- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline-color: #f2c94c;
}

/* --- Skip link --- */
.skip-link {
  background: #1a5276;
}

/* --- Intake step bar --- */
.intake-step-bar .step.active {
  background: #1a5276;
  border-color: #1a5276;
}

/* --- Compare horizontal scroll --- */
.compare-table {
  background: #fffaf5;
}

/* --- Badges --- */
.trust-badge {
  background: #fffaf5;
  border-color: #e8d5c4;
}

/* --- Preview image shadow --- */
.pkg-preview img,
.doc-preview img {
  box-shadow: 0 6px 16px rgba(80, 40, 30, 0.08);
}