/* ==========================================================================
   Sola Safari Travels - shared stylesheet
   1. Design tokens
   2. Reset and base
   3. Layout helpers
   4. Header and navigation
   5. Buttons and links
   6. Hero
   7. Sections and cards
   8. Stats, steps, badges, tables
   9. Forms
   10. Footer
   11. Responsive
   ========================================================================== */

/* 1. Design tokens ------------------------------------------------------- */
:root {
  /* Primary */
  --color-primary: #5C3D2E;
  --color-primary-dark: #3A2518;
  --color-primary-hover: #4A3020;

  /* Gold Accent — used on the dark brown bands */
  --color-accent: #C4973B;
  --color-accent-hover: #B8882F;

  /* Logo Red — the accent on light backgrounds */
  --color-red: #B04A2F;
  --color-red-hover: #8F3B24;

  /* Surfaces */
  --color-canvas: #FAF5EF;
  --color-card: #F0E8DA;
  --color-card-strong: #E6D9C7;
  --color-dark: #1A1410;
  --color-dark-elevated: #2A221A;

  /* Text */
  --color-ink: #2C2420;
  --color-body: #4A4038;
  --color-muted: #7A6E62;
  --color-on-dark: #FAF5EF;
  --color-on-dark-soft: #B0A898;
  --color-white: #FFFFFF;

  /* Borders */
  --color-border: #D9CFC2;
  --color-border-soft: #E6DDD0;

  /* Semantic */
  --color-success: #5DB872;
  --color-error: #C64545;

  /* Typography */
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Spacing */
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-section: 80px;

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 9999px;

  /* Derived */
  --wrap: 1200px;
  --shadow-subtle: 0 1px 3px rgba(26, 20, 16, 0.08);
  --shadow-card: 0 10px 30px rgba(26, 20, 16, 0.10);
}

/* 2. Reset and base ------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--color-canvas);
  color: var(--color-body);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.65;
  text-wrap: pretty;
}

img { max-width: 100%; display: block; }

h1, h2, h3, h4 {
  font-family: var(--font-display);
  color: var(--color-ink);
  font-weight: 600;
  line-height: 1.15;
  margin: 0 0 var(--space-md);
  letter-spacing: -0.01em;
}

h1 { font-size: clamp(34px, 6vw, 60px); }
h2 { font-size: clamp(28px, 4.2vw, 44px); }
h3 { font-size: clamp(20px, 2.4vw, 26px); }
h4 { font-size: 18px; }

p { margin: 0 0 var(--space-md); }
p:last-child { margin-bottom: 0; }

ul, ol { margin: 0 0 var(--space-md); padding-left: 1.2em; }
li { margin-bottom: var(--space-xs); }

a { color: var(--color-primary); text-decoration: underline; text-underline-offset: 3px; }
a:hover { color: var(--color-primary-hover); }

strong { color: var(--color-ink); font-weight: 600; }

hr { border: 0; border-top: 1px solid var(--color-border); margin: var(--space-xl) 0; }

:focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

.skip-link {
  position: absolute;
  left: var(--space-md);
  top: -60px;
  z-index: 100;
  background: var(--color-accent);
  color: var(--color-dark);
  font-weight: 600;
  padding: var(--space-sm) var(--space-md);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: top 0.15s ease-out;
}
.skip-link:focus { top: var(--space-md); }

.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 3. Layout helpers ------------------------------------------------------ */
.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--space-lg); }
.wrap-narrow { max-width: 820px; }

.section { padding: var(--space-section) 0; }
.section-tight { padding: var(--space-2xl) 0; }

.bg-canvas { background: var(--color-canvas); }
.bg-card { background: var(--color-card); }
.bg-card-strong { background: var(--color-card-strong); }
.bg-primary { background: var(--color-primary); color: var(--color-on-dark); }
.bg-dark { background: var(--color-dark); color: var(--color-on-dark); }

.bg-primary h1, .bg-primary h2, .bg-primary h3, .bg-primary h4,
.bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4 { color: var(--color-on-dark); }
.bg-primary p, .bg-dark p { color: var(--color-on-dark-soft); }
.bg-primary a, .bg-dark a { color: var(--color-accent); }
/* Dark brown bands keep the gold accent: the logo red goes muddy against them */
.bg-dark .eyebrow, .bg-primary .eyebrow, .hero .eyebrow, .overlay-card .eyebrow { color: var(--color-accent); }
.bg-dark .rule, .bg-primary .rule { background: var(--color-accent); }
.bg-dark .card-num, .card-dark .card-num { color: var(--color-accent); }
.bg-dark .step-icon, .card-dark .step-icon { color: var(--color-accent); }
.bg-dark .checklist .icon, .card-dark .checklist .icon { color: var(--color-accent); }
.bg-dark .stars, .card-dark .stars { color: var(--color-accent); }
.bg-dark .btn-primary, .bg-primary .btn-primary, .hero .btn-primary, .site-header .btn-primary {
  background: var(--color-accent); color: var(--color-dark);
}
.bg-dark .btn-primary:hover, .bg-primary .btn-primary:hover, .hero .btn-primary:hover, .site-header .btn-primary:hover {
  background: var(--color-accent-hover); color: var(--color-dark);
}

.section-head { max-width: 720px; margin: 0 auto var(--space-2xl); text-align: center; }
.section-head.left { margin-left: 0; text-align: left; }
.section-head p { font-size: 17px; color: var(--color-muted); }
.bg-dark .section-head p, .bg-primary .section-head p { color: var(--color-on-dark-soft); }

.eyebrow {
  display: block;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-red);
  margin-bottom: var(--space-sm);
}

.rule {
  width: 64px; height: 2px; background: var(--color-red);
  margin: var(--space-lg) auto 0; border: 0;
}
.section-head.left .rule { margin-left: 0; }

.grid { display: grid; gap: var(--space-lg); }
.grid-2 { grid-template-columns: 1fr; }
.grid-3 { grid-template-columns: 1fr; }
.grid-4 { grid-template-columns: 1fr; }

.split { display: grid; gap: var(--space-2xl); align-items: center; }

.lead { font-size: 18px; color: var(--color-body); }
.fine { font-size: 14px; color: var(--color-muted); }
.center { text-align: center; }
.stack { display: flex; flex-direction: column; gap: var(--space-md); }
.row { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.row-lg { display: flex; flex-wrap: wrap; gap: var(--space-md); }

.icon { width: 20px; height: 20px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.icon-sm { width: 16px; height: 16px; }
.icon-lg { width: 26px; height: 26px; }

/* 4. Header and navigation ----------------------------------------------- */
.site-header { background: var(--color-primary-dark); color: var(--color-on-dark); }

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  padding-top: var(--space-md);
  padding-bottom: var(--space-md);
}

.brand { display: flex; align-items: center; gap: var(--space-sm); text-decoration: none; }
.brand-mark { width: 38px; height: auto; flex: none; }
.footer-logo { width: 190px; height: auto; margin-bottom: var(--space-md); }
.brand-badge {
  width: 38px; height: 38px; flex: none;
  display: grid; place-items: center;
  border: 1px solid rgba(196, 151, 59, 0.55);
  border-radius: var(--radius-pill);
  color: var(--color-accent);
}
.brand-name {
  font-family: var(--font-display);
  font-size: 18px;
  white-space: nowrap;
  font-weight: 600;
  color: var(--color-on-dark);
  line-height: 1.1;
  letter-spacing: 0.01em;
}
.brand-name span { display: block; font-family: var(--font-body); font-size: 10px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: var(--color-accent); }

.site-nav { flex: 1 0 100%; order: 3; border-top: 1px solid rgba(250,245,239,0.12); padding-top: var(--space-sm); }
.site-nav ul { row-gap: var(--space-xs); }
.site-nav ul { display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-md); list-style: none; margin: 0; padding: 0; }
.header-inner > .btn { margin-left: auto; flex: none; white-space: nowrap; }
/* Below 480px the header CTA is dropped: the hero repeats it immediately underneath */
@media (max-width: 479px) { .header-inner > .btn { display: none; } }
.site-nav a {
  color: var(--color-on-dark);
  text-decoration: none;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 6px 2px;
  border-bottom: 2px solid transparent;
}
.site-nav a:hover { color: var(--color-accent); }
.site-nav a[aria-current="page"] { color: var(--color-accent); border-bottom-color: var(--color-accent); }

/* 5. Buttons -------------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-xs);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 14px var(--space-lg);
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  text-decoration: none;
  cursor: pointer;
  text-align: center;
}
.btn-primary { background: var(--color-red); color: var(--color-canvas); }
.btn-primary:hover { background: var(--color-red-hover); color: var(--color-canvas); }
.btn-secondary { background: var(--color-primary); color: var(--color-on-dark); }
.btn-secondary:hover { background: var(--color-primary-hover); color: var(--color-on-dark); }
.btn-outline { border-color: var(--color-border); background: transparent; color: var(--color-primary); }
.btn-outline:hover { border-color: var(--color-primary); color: var(--color-primary-hover); }
.btn-on-dark { border-color: rgba(250, 245, 239, 0.5); background: transparent; color: var(--color-on-dark); }
.btn-on-dark:hover { border-color: var(--color-accent); color: var(--color-accent); }
.btn-sm { padding: 10px var(--space-md); font-size: 13px; }
.btn-block { width: 100%; }

.link-arrow {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 600; color: var(--color-primary);
  text-decoration: none; letter-spacing: 0.02em;
}
.link-arrow:hover { color: var(--color-red-hover); text-decoration: underline; }
.bg-dark .link-arrow { color: var(--color-accent); }

/* 6. Hero ---------------------------------------------------------------- */
.hero { position: relative; background: var(--color-dark); overflow: hidden; }
.hero-media { position: absolute; inset: 0; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(26, 20, 16, 0.75) 0%, rgba(26, 20, 16, 0.55) 45%, rgba(26, 20, 16, 0.88) 100%);
}
.hero-content { position: relative; z-index: 1; padding: 110px 0 90px; max-width: 780px; }
.hero-content h1 { color: var(--color-white); }
.hero-content h1 em { font-style: italic; color: var(--color-accent); }
.hero-content p { color: #EDE4D8; font-size: 18px; max-width: 60ch; }
.hero-sub { padding: 72px 0 64px; }
.hero-center { margin-left: auto; margin-right: auto; text-align: center; }
.hero-center p { margin-left: auto; margin-right: auto; }
.hero-center .hero-tags { justify-content: center; }
.hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-md); margin-top: var(--space-xl); }
.hero-center .hero-actions { justify-content: center; }
.hero-tags { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-lg); }

.pill {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 6px 14px; border-radius: var(--radius-pill);
  background: rgba(250, 245, 239, 0.12);
  color: var(--color-on-dark);
  border: 1px solid rgba(250, 245, 239, 0.25);
}
.pill-solid { background: var(--color-accent); color: var(--color-dark); border-color: transparent; }
.pill-light { background: var(--color-card-strong); color: var(--color-primary); border-color: transparent; }

.breadcrumb { font-size: 13px; color: var(--color-on-dark-soft); margin-bottom: var(--space-md); }
.breadcrumb a { color: var(--color-on-dark-soft); }
.breadcrumb a:hover { color: var(--color-accent); }

/* 7. Cards --------------------------------------------------------------- */
.card {
  background: var(--color-white);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
}
.card-plain { background: var(--color-card); border-color: transparent; }
.card-dark { background: var(--color-dark-elevated); border-color: rgba(250, 245, 239, 0.1); color: var(--color-on-dark-soft); }
.card-dark h3, .card-dark h4 { color: var(--color-on-dark); }
.card h3 { margin-bottom: var(--space-xs); }
.card > :last-child { margin-bottom: 0; }

.card-num {
  font-family: var(--font-display);
  font-size: 40px;
  line-height: 1;
  color: var(--color-red);
  display: block;
  margin-bottom: var(--space-md);
}

.media-card {
  background: var(--color-white);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.media-card > img { width: 100%; height: 230px; object-fit: cover; }
.media-card-body { padding: var(--space-lg); display: flex; flex-direction: column; gap: var(--space-sm); flex: 1; }
.media-card-body > :last-child { margin-top: auto; }
.media-card h3 { margin: 0; }
.media-card p { margin: 0; font-size: 15px; }

.meta {
  display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-md);
  font-size: 13px; font-weight: 500; color: var(--color-muted);
  letter-spacing: 0.03em;
}
.meta span { display: inline-flex; align-items: center; gap: 6px; }

.price { font-family: var(--font-display); font-size: 24px; color: var(--color-primary); }
.price small { font-family: var(--font-body); font-size: 12px; color: var(--color-muted); letter-spacing: 0.06em; text-transform: uppercase; display: block; }

.tag {
  display: inline-block;
  font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--color-primary); background: var(--color-card-strong);
  padding: 4px 10px; border-radius: var(--radius-sm);
}

.overlay-card { position: relative; border-radius: var(--radius-lg); overflow: hidden; min-height: 340px; display: flex; }
.overlay-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.overlay-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26,20,16,0.15) 30%, rgba(26,20,16,0.9) 100%); }
.overlay-card-body { position: relative; z-index: 1; margin-top: auto; padding: var(--space-xl); color: var(--color-on-dark); }
.overlay-card-body h3 { color: var(--color-white); margin-bottom: var(--space-xs); }
.overlay-card-body p { color: #E4DACD; font-size: 15px; }
.overlay-card-body .link-arrow { color: var(--color-accent); }

.checklist { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-sm); }
.checklist li { display: flex; gap: var(--space-sm); margin: 0; font-size: 15px; }
.checklist .icon { color: var(--color-red); margin-top: 3px; }
.checklist-no .icon { color: var(--color-muted); }

.quote { font-family: var(--font-display); font-size: 19px; line-height: 1.5; color: var(--color-ink); }
.stars { display: flex; gap: 3px; color: var(--color-red); }
.stars svg { width: 16px; height: 16px; fill: currentColor; stroke: none; }
.reviewer { display: flex; align-items: center; gap: var(--space-sm); margin-top: var(--space-md); }
.reviewer-avatar { width: 42px; height: 42px; border-radius: var(--radius-pill); object-fit: cover; }
.reviewer strong { display: block; font-size: 15px; }
.reviewer span { font-size: 13px; color: var(--color-muted); }

/* 8. Stats, steps, badges, tables ---------------------------------------- */
.stats { background: var(--color-primary); }
.stats-grid { display: grid; grid-template-columns: repeat(2, 1fr); }
.stat { padding: var(--space-xl) var(--space-md); text-align: center; border-bottom: 1px solid rgba(250, 245, 239, 0.14); border-right: 1px solid rgba(250, 245, 239, 0.14); }
.stat:nth-child(2n) { border-right: 0; }
.stat-num { display: block; font-family: var(--font-display); font-size: clamp(32px, 5vw, 46px); line-height: 1; color: var(--color-accent); }
.stat-label { display: block; margin-top: var(--space-xs); font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-on-dark); }

.steps { counter-reset: step; display: grid; gap: var(--space-lg); }
.step { position: relative; padding: var(--space-xl); background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-lg); }
.step::before {
  counter-increment: step; content: "0" counter(step);
  font-family: var(--font-display); font-size: 15px; letter-spacing: 0.1em;
  color: var(--color-primary); background: var(--color-card-strong);
  padding: 4px 10px; border-radius: var(--radius-sm); display: inline-block; margin-bottom: var(--space-md);
}
.step h3 { font-size: 21px; }
.step p { font-size: 15px; margin: 0; }
.step-icon { color: var(--color-red); margin-bottom: var(--space-sm); }

.ribbon { background: var(--color-dark); padding: var(--space-lg) 0; }
.ribbon-list { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-md) var(--space-2xl); list-style: none; margin: 0; padding: 0; }
.ribbon-list li { display: flex; align-items: center; gap: var(--space-xs); margin: 0; font-size: 13px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-on-dark); }
.ribbon-list .icon { color: var(--color-accent); }

.logo-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-md); align-items: stretch; }
.logo-box {
  display: grid; place-items: center; text-align: center;
  min-height: 84px; padding: var(--space-md);
  background: var(--color-white); border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  font-size: 13px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-muted);
  text-decoration: none;
}
.logo-box:hover { border-color: var(--color-red); color: var(--color-primary); }

.facts { display: grid; grid-template-columns: 1fr; gap: 0; border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; background: var(--color-white); }
.fact { padding: var(--space-lg); border-bottom: 1px solid var(--color-border-soft); }
.fact:last-child { border-bottom: 0; }
.fact dt { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-muted); margin-bottom: 4px; }
.fact dd { margin: 0; font-family: var(--font-display); font-size: 20px; color: var(--color-ink); }

.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.data {
  width: 100%; border-collapse: collapse; background: var(--color-white);
  border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden;
  font-size: 15px; min-width: 560px;
}
table.data caption { caption-side: top; text-align: left; font-size: 14px; color: var(--color-muted); padding-bottom: var(--space-sm); }
table.data th, table.data td { padding: var(--space-md); text-align: left; border-bottom: 1px solid var(--color-border-soft); }
table.data thead th { background: var(--color-primary); color: var(--color-on-dark); font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
table.data tbody tr:last-child td { border-bottom: 0; }
table.data tbody tr:nth-child(even) { background: var(--color-canvas); }
table.data td strong { color: var(--color-primary); }

/* Accordions */
.accordion { display: grid; gap: var(--space-sm); }
details.qa {
  background: var(--color-white);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  padding: 0;
}
details.qa summary {
  cursor: pointer;
  list-style: none;
  display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-md);
  padding: var(--space-md) var(--space-lg);
  font-family: var(--font-display);
  font-size: 19px;
  color: var(--color-ink);
}
details.qa summary::-webkit-details-marker { display: none; }
details.qa summary::after {
  content: "+";
  font-family: var(--font-body); font-size: 20px; line-height: 1;
  color: var(--color-red); flex: none;
}
details.qa[open] summary::after { content: "\2013"; }
details.qa[open] summary { border-bottom: 1px solid var(--color-border-soft); }
details.qa .qa-body { padding: var(--space-md) var(--space-lg) var(--space-lg); font-size: 15px; }
details.qa .qa-body > :last-child { margin-bottom: 0; }
details.qa summary:hover { color: var(--color-primary); }

.gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-sm); }
.gallery img { width: 100%; height: 150px; object-fit: cover; border-radius: var(--radius-md); }

.map-placeholder {
  min-height: 260px; border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background:
    repeating-linear-gradient(0deg, rgba(176,74,47,0.13) 0 1px, transparent 1px 42px),
    repeating-linear-gradient(90deg, rgba(176,74,47,0.13) 0 1px, transparent 1px 42px),
    var(--color-card);
  display: grid; place-items: center; text-align: center; padding: var(--space-lg);
}
.map-placeholder p { font-size: 14px; color: var(--color-muted); max-width: 34ch; }
.map-pin { color: var(--color-primary); }

.note {
  border-left: 3px solid var(--color-red);
  background: var(--color-card);
  padding: var(--space-lg);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-size: 15px;
}

.template-note {
  background: var(--color-dark-elevated);
  color: var(--color-on-dark-soft);
  border-radius: var(--radius-md);
  padding: var(--space-md) var(--space-lg);
  font-size: 14px;
  display: flex; gap: var(--space-sm); align-items: flex-start;
}
.template-note .icon { color: var(--color-accent); margin-top: 3px; }
.template-note strong { color: var(--color-accent); }

.filter-tabs { display: flex; flex-wrap: wrap; gap: var(--space-sm); justify-content: center; margin-bottom: var(--space-2xl); }
.filter-tabs a {
  font-size: 13px; font-weight: 600; letter-spacing: 0.06em;
  padding: 10px var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  background: var(--color-white);
  color: var(--color-primary);
  text-decoration: none;
}
.filter-tabs a:hover { border-color: var(--color-red); background: var(--color-card); }

/* 9. Forms --------------------------------------------------------------- */
form { margin: 0; }
.form-grid { display: grid; gap: var(--space-md); }
.field { display: flex; flex-direction: column; gap: 6px; }
.field label { font-size: 14px; font-weight: 600; color: var(--color-ink); }
.field .hint { font-size: 13px; color: var(--color-muted); }
.field .req { color: var(--color-error); }

input[type="text"], input[type="email"], input[type="tel"], input[type="date"],
input[type="number"], select, textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--color-ink);
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 12px var(--space-md);
}
textarea { min-height: 130px; resize: vertical; }
select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--color-primary) 50%), linear-gradient(135deg, var(--color-primary) 50%, transparent 50%); background-position: calc(100% - 20px) calc(50% + 2px), calc(100% - 14px) calc(50% + 2px); background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; padding-right: 42px; }
input:focus, select:focus, textarea:focus { border-color: var(--color-red); outline: 3px solid rgba(176, 74, 47, 0.22); outline-offset: 0; }
input::placeholder, textarea::placeholder { color: #A79B8D; }
input:invalid:not(:placeholder-shown), textarea:invalid:not(:placeholder-shown) { border-color: var(--color-error); }

fieldset { border: 0; padding: 0; margin: 0 0 var(--space-lg); }
legend { font-family: var(--font-display); font-size: 22px; color: var(--color-ink); padding: 0; margin-bottom: var(--space-md); }

.form-card {
  background: var(--color-white);
  border: 1px solid var(--color-border-soft);
  border-top: 3px solid var(--color-red);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  box-shadow: var(--shadow-card);
}

.newsletter { display: grid; gap: var(--space-sm); }
.newsletter input { background: rgba(250, 245, 239, 0.08); border-color: rgba(250, 245, 239, 0.3); color: var(--color-on-dark); }
.newsletter input::placeholder { color: var(--color-on-dark-soft); }

/* 10. Footer ------------------------------------------------------------- */
.site-footer { background: var(--color-dark); color: var(--color-on-dark-soft); padding: var(--space-section) 0 0; }
.footer-grid { display: grid; gap: var(--space-2xl); }
.site-footer h4 { color: var(--color-on-dark); font-family: var(--font-display); font-size: 20px; margin-bottom: var(--space-md); }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-xs); }
.site-footer a { color: var(--color-on-dark-soft); text-decoration: none; font-size: 15px; }
.site-footer a:hover { color: var(--color-accent); text-decoration: underline; }
.site-footer .brand-name { color: var(--color-on-dark); }
.footer-contact { display: grid; gap: var(--space-sm); font-size: 15px; margin-top: var(--space-md); }
.footer-contact div { display: flex; gap: var(--space-sm); align-items: flex-start; }
.footer-contact .icon { color: var(--color-accent); margin-top: 3px; }
.footer-bottom {
  margin-top: var(--space-2xl);
  border-top: 1px solid rgba(250, 245, 239, 0.12);
  padding: var(--space-lg) 0;
  display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-lg);
  justify-content: space-between;
  font-size: 13px;
}
.footer-bottom p { margin: 0; }

/* 11. Responsive --------------------------------------------------------- */
@media (min-width: 768px) {
  :root { --space-section: 96px; }
  .site-nav a { font-size: 13px; }
  .brand-mark { width: 52px; }
  .brand-name { font-size: 20px; }
  .grid-2 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .split { grid-template-columns: 1fr 1fr; }
  .stats-grid { grid-template-columns: repeat(4, 1fr); }
  .stat { border-bottom: 0; }
  .stat:nth-child(2n) { border-right: 1px solid rgba(250, 245, 239, 0.14); }
  .stat:last-child { border-right: 0; }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .logo-row { grid-template-columns: repeat(3, 1fr); }
  .facts { grid-template-columns: repeat(2, 1fr); }
  .fact { border-right: 1px solid var(--color-border-soft); }
  .fact:nth-child(2n) { border-right: 0; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .gallery { grid-template-columns: repeat(3, 1fr); }
  .gallery img { height: 180px; }
  .form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }
  .form-row-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); }
  .newsletter { grid-template-columns: 1fr auto; }
  .hero-content { padding: 150px 0 120px; }
  .hero-sub { padding: 104px 0 88px; }
  .form-card { padding: var(--space-2xl); }
}

@media (min-width: 1180px) {
  .site-nav { flex: 0 1 auto; order: 0; border-top: 0; padding-top: 0; min-width: 0; }
  .brand-name { font-size: 24px; }
}

@media (min-width: 1024px) {
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-4 { grid-template-columns: repeat(4, 1fr); }
  .steps { grid-template-columns: repeat(4, 1fr); }
  .logo-row { grid-template-columns: repeat(5, 1fr); }
  .facts { grid-template-columns: repeat(3, 1fr); }
  .fact:nth-child(2n) { border-right: 1px solid var(--color-border-soft); }
  .fact:nth-child(3n) { border-right: 0; }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1.3fr; }
  .split-wide { grid-template-columns: 1.1fr 0.9fr; }
  .split-sidebar { grid-template-columns: 1.4fr 0.8fr; align-items: start; }
  .hero-content { padding: 180px 0 140px; }
}

@media print {
  .site-header, .site-footer, .hero-media { display: none; }
  body { background: #fff; }
}






/* === SOLA STICKY HEADER (managed) === */
/* HFE sets #masthead{position:relative}. Override it decisively. */
html body #page > #masthead,
body #masthead,
#masthead {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  box-shadow: 0 2px 14px rgba(26,20,16,0.18);
}
/* sticky fails if any scroll ancestor clips */
html, body, #page, .hfeed.site, #content, .site-content { overflow: visible !important; }
body.admin-bar #masthead { top: 32px !important; }
@media screen and (max-width:782px){ body.admin-bar #masthead { top: 46px !important; } }
/* === END SOLA STICKY HEADER === */




/* === SOLA UI FIXES (managed) === */
/* Footer link lists: no tick icons, matching the reference footer. */
#colophon .elementor-icon-list-icon,
.site-footer .elementor-icon-list-icon { display:none !important; }
#colophon .elementor-icon-list-item, #colophon .elementor-icon-list-text { padding-left:0 !important; }
/* WPForms: keep forms to a readable width and tighten the spacing. */
.wpforms-container { max-width:640px; margin-left:auto; margin-right:auto; }
.wpforms-container .wpforms-field { padding:10px 0 !important; }
.wpforms-container .wpforms-field-label { font-family:'Inter',sans-serif !important; font-size:14px !important; font-weight:600 !important; color:#2C2420 !important; margin-bottom:6px !important; }
.wpforms-container input[type=text], .wpforms-container input[type=email], .wpforms-container input[type=tel], .wpforms-container input[type=number], .wpforms-container input[type=date], .wpforms-container select, .wpforms-container textarea {
  font-family:'Inter',sans-serif !important; font-size:15px !important; padding:11px 14px !important;
  border:1px solid #D9CFC2 !important; border-radius:6px !important; background:#fff !important; max-width:100% !important;
}
.wpforms-container textarea { min-height:110px !important; }
.wpforms-container .wpforms-submit {
  font-family:'Inter',sans-serif !important; font-size:13px !important; font-weight:600 !important;
  text-transform:uppercase !important; letter-spacing:1px !important;
  background:#B04A2F !important; color:#FAF5EF !important; border:0 !important;
  padding:14px 32px !important; border-radius:6px !important; cursor:pointer;
}
.wpforms-container .wpforms-submit:hover { background:#8E3A22 !important; }
.wpforms-container .wpforms-field-description { font-size:13px !important; color:#7A6E62 !important; }
/* === END SOLA UI FIXES === */

/* === SOLA BLOG ARCHIVE (managed) === */
body.blog #content.site-main, body.archive #content.site-main, body.single-post #content.site-main { max-width:none; padding:0; }
body.blog .page-header, body.archive .page-header {
  background:#3A2518; padding:96px 24px 84px; margin:0; text-align:center;
  background-image:linear-gradient(rgba(26,20,16,.70),rgba(26,20,16,.70)),url('/wp-content/uploads/2026/09/safari-vehicle-savanna.jpg');
  background-size:cover; background-position:center;
}
body.blog .page-header .entry-title, body.archive .page-header .entry-title {
  font-family:'Cormorant Garamond',Georgia,serif; font-weight:600; font-size:clamp(32px,5vw,46px); color:#FAF5EF; margin:0;
}
body.blog .page-header::after, body.archive .page-header::after { content:''; display:block; width:56px; height:3px; background:#C4973B; margin:18px auto 0; }
/* Equal, standard sized cards - never stretched. */
body.blog .page-content, body.archive .page-content {
  background:#FAF5EF; padding:64px 24px 80px; margin:0;
  display:grid; gap:26px; grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  max-width:1200px; margin-inline:auto; align-items:stretch;
}
body.blog article.post, body.archive article.post {
  background:#fff; border:1px solid #E6DDD0; border-radius:10px; margin:0; padding:0; overflow:hidden;
  display:flex; flex-direction:column; transition:box-shadow .2s ease, transform .2s ease;
}
body.blog article.post:hover, body.archive article.post:hover { box-shadow:0 10px 28px rgba(26,20,16,.10); transform:translateY(-2px); }
body.blog article.post .sola-thumb, body.archive article.post .sola-thumb { display:block; width:100%; height:190px; overflow:hidden; background:#EFE7DA; }
body.blog article.post .sola-thumb img, body.archive article.post .sola-thumb img { width:100%; height:100%; object-fit:cover; display:block; border-radius:0; margin:0; }
body.blog article.post .sola-body, body.archive article.post .sola-body { padding:20px 22px 22px; display:flex; flex-direction:column; gap:10px; flex:1; }
body.blog .sola-cat, body.archive .sola-cat {
  display:inline-block; align-self:flex-start; font-family:'Inter',sans-serif; font-size:10px; font-weight:600;
  letter-spacing:1.4px; text-transform:uppercase; color:#B04A2F; background:#F7EDE4; padding:5px 10px; border-radius:4px;
}
body.blog .sola-meta, body.archive .sola-meta { font-family:'Inter',sans-serif; font-size:12.5px; color:#7A6E62; display:flex; gap:14px; flex-wrap:wrap; }
body.blog article.post .entry-title, body.archive article.post .entry-title {
  font-family:'Cormorant Garamond',Georgia,serif; font-size:21px; font-weight:600; line-height:1.28; margin:0;
}
body.blog article.post .entry-title a, body.archive article.post .entry-title a { color:#2C2420; text-decoration:none; }
body.blog article.post .entry-title a:hover, body.archive article.post .entry-title a:hover { color:#B04A2F; }
body.blog .sola-excerpt, body.archive .sola-excerpt { font-family:'Inter',sans-serif; font-size:14.5px; line-height:1.7; color:#4A4038; margin:0; }
body.blog .sola-more, body.archive .sola-more {
  margin-top:auto; align-self:flex-start; display:inline-block; font-family:'Inter',sans-serif; font-size:12px; font-weight:600;
  letter-spacing:1px; text-transform:uppercase; color:#FAF5EF; background:#B04A2F; padding:10px 20px; border-radius:6px; text-decoration:none;
}
body.blog .sola-more:hover, body.archive .sola-more:hover { background:#8E3A22; color:#FAF5EF; }
/* Pagination */
body.blog .navigation, body.archive .navigation, .pagination, .nav-links { grid-column:1/-1; display:flex; gap:8px; justify-content:center; padding-top:14px; }
.nav-links .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0 12px; border:1px solid #D9CFC2; border-radius:6px; color:#5C3D2E; text-decoration:none; font-family:'Inter',sans-serif; font-size:14px; font-weight:600; }
.nav-links .page-numbers.current { background:#B04A2F; border-color:#B04A2F; color:#FAF5EF; }
/* Single post: hero then content */
body.single-post .sola-post-hero { position:relative; min-height:420px; display:flex; align-items:flex-end; background:#3A2518; background-size:cover; background-position:center; }
body.single-post .sola-post-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(26,20,16,.35) 30%,rgba(26,20,16,.88) 100%); }
body.single-post .sola-post-hero-inner { position:relative; z-index:1; max-width:900px; margin:0 auto; padding:0 24px 54px; width:100%; }
body.single-post .sola-post-hero .sola-cat { background:rgba(250,245,239,.14); color:#C4973B; }
body.single-post .sola-post-hero h1 { font-family:'Cormorant Garamond',Georgia,serif; font-size:clamp(30px,4.6vw,46px); font-weight:600; color:#FAF5EF; margin:12px 0 10px; line-height:1.15; }
body.single-post .sola-post-hero .sola-meta { color:#D9CFC2; }
body.single-post .page-content { background:#FAF5EF; padding:56px 24px 80px; }
body.single-post .page-content > * { max-width:760px; margin-inline:auto; }
body.single-post .page-content h2 { font-family:'Cormorant Garamond',Georgia,serif; font-size:29px; font-weight:600; color:#2C2420; margin:34px auto 12px; }
body.single-post .page-content p { font-family:'Inter',sans-serif; font-size:16.5px; line-height:1.8; color:#4A4038; margin:0 auto 16px; }
body.single-post .page-content img { border-radius:10px; }
@media (max-width:781px){ body.blog .page-content, body.archive .page-content { padding:44px 20px 60px; } body.blog .page-header, body.archive .page-header { padding:64px 20px 56px; } }
/* === END SOLA BLOG ARCHIVE === */


/* === SOLA SPACING (managed) === */
/* Cards and columns sat flush against each other. Elementor's column gap becomes
   the card's inner padding once a column has its own background, so the visible
   gap disappears. Margin on the populated wrapper restores it without touching
   the percentage widths. */
.elementor-column:not(:only-child) > .elementor-element-populated { margin-left:14px; margin-right:14px; }
.elementor-column:not(:only-child):first-child > .elementor-element-populated { margin-left:0; }
.elementor-column:not(:only-child):last-child > .elementor-element-populated { margin-right:0; }
/* Stacked rows of cards need vertical separation too. */
.elementor-column:not(:only-child) > .elementor-element-populated { margin-bottom:6px; }
/* Header and footer keep their own tight rhythm. */
#masthead .elementor-column > .elementor-element-populated,
#colophon .elementor-column > .elementor-element-populated { margin-left:0; margin-right:0; margin-bottom:0; }
#colophon .elementor-column:not(:only-child) > .elementor-element-populated { margin-right:26px; }
#colophon .elementor-column:not(:only-child):last-child > .elementor-element-populated { margin-right:0; }
/* On tablet and below columns stack, so switch the gap to vertical. */
@media (max-width:1024px){
  .elementor-column:not(:only-child) > .elementor-element-populated { margin-left:0; margin-right:0; margin-bottom:24px; }
  #colophon .elementor-column:not(:only-child) > .elementor-element-populated { margin-right:0; margin-bottom:30px; }
}
/* A little more air inside cards so text is not tight to the edge. */
.elementor-widget-heading + .elementor-widget-text-editor { margin-top:2px; }
/* === END SOLA SPACING === */


/* === SOLA IMAGE RADIUS (managed) === */
/* Every content image gets softened corners, including ones outside cards. */
.elementor-widget-image img,
.elementor-widget-theme-post-featured-image img,
article.post .sola-thumb img,
body.single-post .page-content img,
.wp-block-image img,
.entry-content img,
.page-content img { border-radius:10px; }
/* Card thumbnails keep square tops so they sit flush inside the card frame. */
body.blog article.post .sola-thumb img,
body.archive article.post .sola-thumb img { border-radius:0; }
/* Logos, icons and avatars should not be rounded. */
#masthead img,
#colophon img,
.elementor-widget-social-icons img,
.elementor-widget-icon img { border-radius:0 !important; }
/* Hero background images are already clipped by their section. */
.sola-post-hero { border-radius:0; }
/* === END SOLA IMAGE RADIUS === */


/* === SOLA MOBILE (managed) === */
/* Elementor writes a per-element font size for every heading and none of them
   carry a mobile override, so headings arrive at desktop size on a phone.
   Scale by tag rather than editing 46 headings across 59 templates. */
@media (max-width:767px){
  .elementor-widget-heading h1.elementor-heading-title { font-size:30px !important; line-height:1.18 !important; }
  .elementor-widget-heading h2.elementor-heading-title { font-size:25px !important; line-height:1.22 !important; }
  .elementor-widget-heading h3.elementor-heading-title { font-size:22px !important; line-height:1.25 !important; }
  .elementor-widget-heading h4.elementor-heading-title { font-size:18px !important; line-height:1.3 !important; }
  .elementor-widget-heading h5.elementor-heading-title { font-size:16px !important; }
  .elementor-widget-heading h6.elementor-heading-title { font-size:11px !important; letter-spacing:1.6px !important; }
  /* Body copy and buttons */
  .elementor-widget-text-editor { font-size:15px !important; line-height:1.7 !important; }
  .elementor-button { font-size:12px !important; padding:13px 22px !important; }
  .elementor-widget-button .elementor-button-wrapper { text-align:center !important; }
  /* Heroes: 500-600px of empty brown on a phone is wasted screen. */
  .elementor-46 .elementor-section.elementor-section-height-min-height,
  .elementor:not(.elementor-67):not(.elementor-68) .elementor-section.elementor-section-height-min-height { min-height:340px !important; }
  /* Header and footer templates must never inherit the hero min-height. */
  #masthead .elementor-section, #colophon .elementor-section { min-height:0 !important; }
  .sola-post-hero { min-height:280px !important; }
  .sola-post-hero h1 { font-size:26px !important; }
  /* Tables were the worst offender: they forced the whole page sideways. */
  .elementor-widget-text-editor table { min-width:540px; }
  .elementor-widget-text-editor:has(table) { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .elementor-widget-text-editor table th, .elementor-widget-text-editor table td { padding:10px 12px !important; font-size:13.5px !important; }
  /* Stat bars read better two-up than stacked five deep. */
  .elementor-section .elementor-container > .elementor-column[class*="elementor-col-20"],
  .elementor-section .elementor-container > .elementor-column[class*="elementor-col-25"] { width:50% !important; }
  /* Cards go full width with real separation. */
  .elementor-column:not(:only-child) > .elementor-element-populated { margin:0 0 18px !important; }
  /* Section padding: tighter sides, keep vertical rhythm. */
  .elementor-section > .elementor-container { padding-left:0; padding-right:0; }
  /* Blog cards one per row, comfortable height. */
  body.blog .page-content, body.archive .page-content { grid-template-columns:1fr !important; gap:20px !important; padding:40px 18px 56px !important; }
  body.blog article.post .sola-thumb, body.archive article.post .sola-thumb { height:180px !important; }
  body.blog .page-header, body.archive .page-header { padding:58px 18px 50px !important; }
  /* Forms fill the width on a phone. */
  .wpforms-container { max-width:100% !important; }
  .wpforms-container input, .wpforms-container select, .wpforms-container textarea { font-size:16px !important; }
  .wpforms-container .wpforms-submit { width:100% !important; }
  /* Popups must not exceed the viewport. */
  .pum-container { max-width:92vw !important; left:4vw !important; }
  /* Nothing should ever scroll the page sideways. */
  html, body { overflow-x:hidden !important; max-width:100vw; }
  img { max-width:100%; height:auto; }
}
/* Header on phones: logo left, burger right, quote button full width beneath. */
@media (max-width:1024px){
  #masthead .elementor-container { flex-wrap:wrap !important; align-items:center !important; }
  #masthead .elementor-column:nth-child(1) { width:60% !important; }
  #masthead .elementor-column:nth-child(2) { width:40% !important; order:2; }
  #masthead .elementor-column:nth-child(3) { width:100% !important; order:3; padding-bottom:12px; }
  #masthead .elementor-widget-button .elementor-button { width:100%; display:block; text-align:center; }
  #masthead .hfe-nav-menu-icon, #masthead .sub-menu-toggle { color:#FAF5EF; }
  #masthead img { max-width:150px; height:auto; }
}
/* Footer stacks cleanly. */
@media (max-width:767px){
  #colophon .elementor-column { width:100% !important; }
  #colophon .elementor-column > .elementor-element-populated { margin:0 0 26px !important; }
  #colophon .elementor-widget-social-icons { text-align:left; }
}
/* === END SOLA MOBILE === */



/* === SOLA ARTICLES (managed) === */
.sola-art-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.sola-art-card{display:flex;flex-direction:column;background:#FFFDFA;border:1px solid #E6DACA;border-radius:10px;overflow:hidden;text-decoration:none!important;transition:transform .25s ease,box-shadow .25s ease;}
.sola-art-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(44,36,32,.14);}
.sola-art-thumb{display:block;width:100%;height:190px;background-size:cover;background-position:center;background-color:#E6DACA;}
.sola-art-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px;}
.sola-art-cat{display:inline-block;align-self:flex-start;background:#F0E8DA;color:#B04A2F;font-family:Inter,sans-serif;font-size:11px;font-weight:600;letter-spacing:1.4px;text-transform:uppercase;padding:5px 11px;border-radius:3px;margin-bottom:12px;}
.sola-art-title{font-family:'Cormorant Garamond',Georgia,serif;font-size:21px;line-height:1.3;color:#2C2420;margin-bottom:10px;}
.sola-art-card:hover .sola-art-title{color:#B04A2F;}
.sola-art-meta{font-family:Inter,sans-serif;font-size:12.5px;color:#7A6E62;margin-bottom:16px;}
.sola-art-more{margin-top:auto;font-family:Inter,sans-serif;font-size:12px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;color:#B04A2F;}
.sola-art-more:after{content:' \2192';}
@media (max-width:1024px){.sola-art-grid{grid-template-columns:repeat(2,1fr);gap:20px;}}
@media (max-width:767px){.sola-art-grid{grid-template-columns:1fr;gap:18px;}.sola-art-thumb{height:180px;}.sola-art-title{font-size:19px;}}
/* === END SOLA ARTICLES === */



/* === SOLA ACCORDION (managed) === */
.elementor-widget-toggle .elementor-toggle-item{border:1px solid #E6DDD0;border-radius:8px;margin-bottom:10px;overflow:hidden;background:#FFFDFA;transition:box-shadow .2s ease,border-color .2s ease;}
.elementor-widget-toggle .elementor-tab-title{padding:17px 22px !important;background:#FFFDFA;border:0 !important;display:flex;align-items:center;gap:12px;cursor:pointer;}
.elementor-widget-toggle .elementor-tab-title:hover{background:#FAF5EF;}
.elementor-widget-toggle .elementor-tab-title .elementor-toggle-icon{margin-left:auto;order:2;color:#B04A2F;}
/* Open state has to be obvious, especially on a phone where only one fits the screen. */
.elementor-widget-toggle .elementor-toggle-item:has(.elementor-tab-title.elementor-active){border-color:#B04A2F;box-shadow:0 6px 22px rgba(176,74,47,.13);}
.elementor-widget-toggle .elementor-tab-title.elementor-active{background:#F0E8DA !important;color:#B04A2F !important;box-shadow:inset 3px 0 0 #B04A2F;}
.elementor-widget-toggle .elementor-tab-title.elementor-active a,.elementor-widget-toggle .elementor-tab-title.elementor-active .elementor-toggle-title{color:#B04A2F !important;}
.elementor-widget-toggle .elementor-tab-content{padding:6px 22px 22px !important;background:#FFFDFA;border:0 !important;}
.elementor-widget-toggle .elementor-tab-content table{width:100%;border-collapse:collapse;}
.elementor-widget-toggle .elementor-tab-content ul{padding-left:18px;}
@media (max-width:767px){
  .elementor-widget-toggle .elementor-tab-title{padding:15px 16px !important;font-size:14.5px !important;line-height:1.35;}
  .elementor-widget-toggle .elementor-tab-content{padding:4px 16px 18px !important;font-size:14.5px !important;}
  .elementor-widget-toggle .elementor-tab-title.elementor-active{box-shadow:inset 4px 0 0 #B04A2F;}
  .elementor-widget-toggle .elementor-toggle-item:has(.elementor-tab-title.elementor-active){border-color:#B04A2F;border-width:1px;box-shadow:0 8px 24px rgba(176,74,47,.18);}
  .elementor-widget-toggle .elementor-tab-content table{display:block;overflow-x:auto;min-width:0;}
  .elementor-widget-toggle .elementor-tab-content table tr{display:table;width:100%;}
}
/* === END SOLA ACCORDION === */

/* === SOLA IMAGE FIT (managed) === */
/* Cards were built with different padding values, so a fixed negative margin
   overshot on some and undershot on others. Instead: strip the card's padding
   and hand it back to the children that are not the image. Padding agnostic. */
.elementor-element-populated:has(> .elementor-widget-image.sola-card-img){padding:0 !important;overflow:hidden;}
.elementor-element-populated:has(> .elementor-widget-image.sola-card-img) > .elementor-widget:not(.sola-card-img){padding-left:22px !important;padding-right:22px !important;}
.elementor-element-populated:has(> .elementor-widget-image.sola-card-img) > .elementor-widget:last-child{padding-bottom:24px !important;margin-bottom:0 !important;}
.elementor-widget-image.sola-card-img{margin:0 0 18px !important;width:100% !important;max-width:none !important;}
.elementor-widget-image.sola-card-img > .elementor-widget-container{width:100% !important;line-height:0;text-align:left !important;}
.elementor-widget-image.sola-card-img figure,.elementor-widget-image.sola-card-img a{display:block;width:100%;margin:0;}
.elementor-widget-image.sola-card-img img{width:100% !important;height:210px !important;object-fit:cover !important;object-position:center !important;display:block;border-radius:0 !important;max-width:none !important;}
/* Image strips: a row of images with no text beside them, one standard height. */
.elementor-widget-image.sola-strip-img > .elementor-widget-container{width:100% !important;line-height:0;text-align:left !important;}
.elementor-widget-image.sola-strip-img figure,.elementor-widget-image.sola-strip-img a{display:block;width:100%;margin:0;}
.elementor-widget-image.sola-strip-img img{width:100% !important;height:250px !important;object-fit:cover !important;display:block;border-radius:10px !important;max-width:none !important;}
/* Side images sit beside a block of text and keep their own proportions.
   Cropping these to a fixed height is what made them look wrong. */
.elementor-widget-image.sola-side-img > .elementor-widget-container{line-height:0;}
.elementor-widget-image.sola-side-img img{width:100% !important;height:auto !important;display:block;border-radius:10px !important;}
@media (max-width:1024px){.elementor-widget-image.sola-strip-img img{height:210px !important;}.elementor-widget-image.sola-card-img img{height:195px !important;}}
@media (max-width:767px){.elementor-widget-image.sola-strip-img img{height:200px !important;}.elementor-widget-image.sola-card-img img{height:190px !important;}}
/* === END SOLA IMAGE FIT === */

/* === SOLA NAV (managed) === */
/* ---------- Desktop dropdowns ---------- */
@media (min-width:1025px){
  #masthead .elementor-widget-navigation-menu ul.sub-menu{background-color:#2E1D12 !important;border:0 !important;border-radius:0 0 6px 6px;box-shadow:0 18px 40px rgba(0,0,0,.34);padding:6px 0 !important;min-width:250px;}
  #masthead .elementor-widget-navigation-menu ul.sub-menu li a.hfe-sub-menu-item{color:#FAF5EF !important;background:transparent !important;padding:11px 20px !important;font-size:13px !important;letter-spacing:.6px;border-bottom:1px solid rgba(250,245,239,.08) !important;white-space:nowrap;}
  #masthead .elementor-widget-navigation-menu ul.sub-menu li:last-child a.hfe-sub-menu-item{border-bottom:0 !important;}
  #masthead .elementor-widget-navigation-menu ul.sub-menu li a.hfe-sub-menu-item:hover{color:#C4973B !important;background:rgba(196,151,59,.12) !important;}
  /* Third level flies out to the side rather than stacking. */
  #masthead .elementor-widget-navigation-menu ul.sub-menu ul.sub-menu{top:0;left:100%;border-radius:6px;max-height:70vh;overflow-y:auto;}
  #masthead .elementor-widget-navigation-menu ul.sub-menu li.menu-item-has-children > .hfe-has-submenu-container > a:after,
  #masthead .elementor-widget-navigation-menu ul.sub-menu li.menu-item-has-children > a:after{content:'\203A';float:right;color:#C4973B;font-size:17px;line-height:1;}
}
/* ---------- Phone and tablet panel ---------- */
@media (max-width:1024px){
  /* HFE positions the panel against the nav column, so right:0 landed 176px
     off the viewport edge. Anchor it to the viewport as a proper drawer. */
  #masthead .elementor-widget-navigation-menu nav.hfe-dropdown,
  #masthead .elementor-widget-navigation-menu nav.hfe-dropdown-expandible{position:fixed !important;top:0 !important;right:0 !important;left:auto !important;bottom:0 !important;width:88vw !important;max-width:380px !important;height:100vh !important;overflow-y:auto !important;-webkit-overflow-scrolling:touch;background-color:#2E1D12 !important;box-shadow:-16px 0 44px rgba(0,0,0,.45);z-index:100000 !important;padding-bottom:24px;}
  body.admin-bar #masthead .elementor-widget-navigation-menu nav.hfe-dropdown{top:46px !important;height:calc(100vh - 46px) !important;}
  #masthead .elementor-widget-navigation-menu nav{background-color:#2E1D12 !important;}
  #masthead .elementor-widget-navigation-menu nav ul.hfe-nav-menu,
  #masthead .elementor-widget-navigation-menu nav .sub-menu{background-color:#2E1D12 !important;width:100% !important;}
  #masthead .elementor-widget-navigation-menu nav li a.hfe-menu-item,
  #masthead .elementor-widget-navigation-menu nav li a.hfe-sub-menu-item{color:#FAF5EF !important;background-color:transparent !important;border-bottom:1px solid rgba(250,245,239,.12) !important;padding:15px 22px !important;font-size:14.5px !important;letter-spacing:.7px !important;text-align:left !important;}
  #masthead .elementor-widget-navigation-menu nav li a.hfe-menu-item:hover,
  #masthead .elementor-widget-navigation-menu nav li.current-menu-item > a.hfe-menu-item{color:#C4973B !important;background-color:rgba(196,151,59,.10) !important;}
  #masthead .elementor-widget-navigation-menu nav .sub-menu a.hfe-sub-menu-item{padding-left:38px !important;font-size:13.5px !important;background:rgba(0,0,0,.16) !important;}
  #masthead .elementor-widget-navigation-menu nav .sub-menu .sub-menu a.hfe-sub-menu-item{padding-left:54px !important;font-size:13px !important;background:rgba(0,0,0,.28) !important;}
  /* The expand arrow was sitting outside the panel. Pin it inside the row. */
  #masthead .elementor-widget-navigation-menu nav .hfe-has-submenu-container{position:relative;display:block;}
  #masthead .elementor-widget-navigation-menu nav .hfe-menu-toggle,
  #masthead .elementor-widget-navigation-menu nav .sub-arrow{position:absolute !important;right:14px !important;top:50% !important;transform:translateY(-50%) !important;margin:0 !important;width:30px;height:30px;display:flex !important;align-items:center;justify-content:center;color:#C4973B !important;background:rgba(250,245,239,.08);border-radius:4px;}
  #masthead .hfe-nav-menu__toggle{margin-left:auto;}
  #masthead .hfe-nav-menu__toggle, #masthead .hfe-nav-menu-icon, #masthead .hfe-nav-menu__toggle svg{color:#FAF5EF !important;fill:#FAF5EF !important;}
  /* Injected header block inside the panel. */
  .sola-menu-head{padding:22px 22px 18px;border-bottom:1px solid rgba(250,245,239,.14);text-align:center;}
  .sola-menu-head img{max-width:150px;height:auto;margin:0 auto 16px;display:block;}
  .sola-menu-head a.sola-menu-cta{display:block;background:#C4973B;color:#2C2420 !important;font-family:Inter,sans-serif;font-size:13px;font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:13px 18px;border-radius:4px;text-decoration:none;}
  .sola-menu-social{display:flex;justify-content:center;gap:14px;padding:22px;border-top:1px solid rgba(250,245,239,.14);}
  .sola-menu-social a{width:38px;height:38px;border-radius:50%;background:rgba(250,245,239,.10);color:#FAF5EF !important;display:flex;align-items:center;justify-content:center;font-size:15px;text-decoration:none;}
  .sola-menu-social a:hover{background:#C4973B;color:#2C2420 !important;}
}
/* Sticky header on every width. */
#masthead{position:-webkit-sticky !important;position:sticky !important;top:0 !important;z-index:9999 !important;}
body.admin-bar #masthead{top:32px !important;}
@media (max-width:782px){body.admin-bar #masthead{top:46px !important;}}
/* === END SOLA NAV === */