/* ==========================================================
   IslandTravelAtlas — Tool Page Contrast and Spacing V3

   All main tool-page sections use light backgrounds and dark
   text by default.

   Only explicit review panels, mega-menu introduction panels,
   and the footer remain dark.
   ========================================================== */

body.ita-tool-page-contrast-fixed {
  --ita-tp-page: #f4f8f6;
  --ita-tp-surface: #ffffff;
  --ita-tp-soft: #edf5f2;
  --ita-tp-border: #d7e4de;

  --ita-tp-ink: #13271f;
  --ita-tp-text: #40574d;
  --ita-tp-muted: #64776e;

  --ita-tp-accent: #078675;
  --ita-tp-accent-hover: #066d60;

  --ita-tp-dark: #092d25;
  --ita-tp-dark-two: #12483b;

  --ita-tp-on-dark: #f5fbf8;
  --ita-tp-on-dark-muted: #d3e7de;

  --ita-tp-section-space:
    clamp(48px, 5.5vw, 72px);

  --ita-tp-hero-space:
    clamp(54px, 6.5vw, 82px);

  --ita-tp-gap:
    clamp(18px, 2.3vw, 26px);

  background: var(--ita-tp-page) !important;
  color: var(--ita-tp-text) !important;
}

body.ita-tool-page-contrast-fixed main {
  background: var(--ita-tp-page) !important;
  color: var(--ita-tp-text) !important;
}

/* ==========================================================
   TOP-LEVEL SECTIONS
   ========================================================== */

body.ita-tool-page-contrast-fixed main > section {
  margin: 0 !important;

  padding-top:
    var(--ita-tp-section-space) !important;

  padding-bottom:
    var(--ita-tp-section-space) !important;

  border-top: 0 !important;
  border-bottom: 0 !important;

  background-color:
    var(--ita-tp-surface) !important;

  background-image:
    none !important;

  color:
    var(--ita-tp-text) !important;
}

body.ita-tool-page-contrast-fixed
main > section:nth-of-type(even) {
  background-color:
    var(--ita-tp-soft) !important;
}

body.ita-tool-page-contrast-fixed
main > section:first-child {
  padding-top:
    var(--ita-tp-hero-space) !important;

  padding-bottom:
    var(--ita-tp-hero-space) !important;

  background:
    radial-gradient(
      circle at 92% 0%,
      rgba(7, 134, 117, 0.12),
      transparent 32%
    ),
    linear-gradient(
      180deg,
      #f7fcfa 0%,
      #eaf5f1 100%
    ) !important;
}

body.ita-tool-page-contrast-fixed
main > section + section {
  border-top:
    1px solid var(--ita-tp-border) !important;
}

/* ==========================================================
   DARK TEXT ON LIGHT SECTIONS
   ========================================================== */

body.ita-tool-page-contrast-fixed
main > section
:where(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  strong,
  b,
  dt
) {
  color:
    var(--ita-tp-ink) !important;

  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
main > section
:where(
  p,
  li,
  dd,
  label,
  figcaption,
  small
) {
  color:
    var(--ita-tp-text) !important;

  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
main > section
:where(
  .breadcrumbs,
  .rf-kicker,
  .ita-tool-eyebrow,
  .ita-live-results__eyebrow,
  .ita-wl-eyebrow
) {
  color:
    var(--ita-tp-accent-hover) !important;

  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
main > section a {
  color:
    var(--ita-tp-accent-hover) !important;

  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
main > section:first-child h1 {
  max-width: 900px;

  color:
    var(--ita-tp-ink) !important;

  font-size:
    clamp(2.2rem, 4.8vw, 3.55rem) !important;

  line-height: 1.04 !important;
  letter-spacing: -0.05em !important;
}

body.ita-tool-page-contrast-fixed
main > section h2 {
  color:
    var(--ita-tp-ink) !important;

  font-size:
    clamp(1.65rem, 3vw, 2.35rem) !important;

  line-height: 1.12 !important;
  letter-spacing: -0.035em !important;
}

body.ita-tool-page-contrast-fixed
main > section h3 {
  color:
    var(--ita-tp-ink) !important;

  font-size:
    clamp(1.05rem, 1.8vw, 1.3rem) !important;

  line-height: 1.25 !important;
}

body.ita-tool-page-contrast-fixed
main > section
:where(p, li, dd) {
  line-height: 1.65 !important;
}

/* ==========================================================
   SECTION SPACING
   ========================================================== */

body.ita-tool-page-contrast-fixed
main > section >
:where(
  .rf-shell,
  .ita-tool-shell,
  .ita-live-results__shell,
  .ita-wl-shell,
  .hp-shell,
  .pm-shell,
  .container,
  .site-container
) > :first-child {
  margin-top: 0 !important;
}

body.ita-tool-page-contrast-fixed
main > section >
:where(
  .rf-shell,
  .ita-tool-shell,
  .ita-live-results__shell,
  .ita-wl-shell,
  .hp-shell,
  .pm-shell,
  .container,
  .site-container
) > :last-child {
  margin-bottom: 0 !important;
}

body.ita-tool-page-contrast-fixed
:where(
  .rf-section-heading,
  .ita-section-heading,
  .ita-live-results__intro,
  .ita-wl-heading,
  .section-heading
) {
  margin-top: 0 !important;

  margin-bottom:
    clamp(24px, 3vw, 34px) !important;
}

body.ita-tool-page-contrast-fixed
:where(
  .ita-tool-grid,
  .ita-provider-grid,
  .ita-options-grid,
  .ita-decision-grid,
  .ita-live-results__layout,
  .ita-wl-search-layout,
  .ita-wl-results-layout,
  .rf-destination-grid,
  .rf-feature-grid,
  .grid
) {
  gap:
    var(--ita-tp-gap) !important;
}

/* ==========================================================
   CARDS
   ========================================================== */

body.ita-tool-page-contrast-fixed
main
:where(
  article,
  .ita-tool-card,
  .ita-provider-card,
  .ita-affiliate-card,
  .ita-option-card,
  .ita-decision-card,
  .ita-route-card,
  .ita-widget-panel,
  .ita-live-widget,
  .ita-wl-search-card,
  .ita-wl-results-card,
  .rf-tool-panel,
  .rf-library-item,
  .rf-library-group
) {
  border-color:
    var(--ita-tp-border) !important;

  background:
    var(--ita-tp-surface) !important;

  color:
    var(--ita-tp-text) !important;

  box-shadow:
    0 12px 34px rgba(16, 49, 39, 0.08);
}

body.ita-tool-page-contrast-fixed
main
:where(
  article,
  .ita-tool-card,
  .ita-provider-card,
  .ita-affiliate-card,
  .ita-option-card,
  .ita-decision-card,
  .ita-route-card,
  .ita-widget-panel,
  .ita-live-widget,
  .ita-wl-search-card,
  .ita-wl-results-card,
  .rf-tool-panel,
  .rf-library-item,
  .rf-library-group
)
:where(
  h1,
  h2,
  h3,
  h4,
  strong,
  b,
  dt
) {
  color:
    var(--ita-tp-ink) !important;

  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
main
:where(
  article,
  .ita-tool-card,
  .ita-provider-card,
  .ita-affiliate-card,
  .ita-option-card,
  .ita-decision-card,
  .ita-route-card,
  .ita-widget-panel,
  .ita-live-widget,
  .ita-wl-search-card,
  .ita-wl-results-card,
  .rf-tool-panel,
  .rf-library-item,
  .rf-library-group
)
:where(
  p,
  li,
  dd,
  label,
  small,
  span
) {
  color:
    var(--ita-tp-text) !important;

  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
main
:where(
  .ita-provider-card,
  .ita-affiliate-card,
  .ita-option-card,
  .ita-tool-card
) a {
  color:
    var(--ita-tp-accent-hover) !important;

  font-weight: 800 !important;
}

/* ==========================================================
   FORMS
   ========================================================== */

body.ita-tool-page-contrast-fixed
main
:where(
  input,
  select,
  textarea
) {
  border:
    1px solid #c9d9d2 !important;

  background:
    var(--ita-tp-surface) !important;

  color:
    var(--ita-tp-ink) !important;

  opacity: 1 !important;
}

body.ita-tool-page-contrast-fixed
main
:where(
  input,
  textarea
)::placeholder {
  color:
    var(--ita-tp-muted) !important;

  opacity: 1 !important;
}

body.ita-tool-page-contrast-fixed
main
:where(
  input,
  select,
  textarea
):focus {
  border-color:
    var(--ita-tp-accent) !important;

  outline:
    3px solid rgba(7, 134, 117, 0.13) !important;
}

/* ==========================================================
   BUTTONS
   ========================================================== */

body.ita-tool-page-contrast-fixed
main
:where(
  .rf-button-primary,
  .hp-button-primary,
  .ita-button-primary,
  .ita-live-widget__load,
  .ita-wl-button,
  button[type="submit"]
) {
  border-color:
    var(--ita-tp-accent) !important;

  background:
    var(--ita-tp-accent) !important;

  color:
    #ffffff !important;

  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
main
:where(
  .rf-button-primary,
  .hp-button-primary,
  .ita-button-primary,
  .ita-live-widget__load,
  .ita-wl-button,
  button[type="submit"]
):hover {
  border-color:
    var(--ita-tp-accent-hover) !important;

  background:
    var(--ita-tp-accent-hover) !important;

  color:
    #ffffff !important;
}

/* ==========================================================
   EXPLICIT DARK PANELS
   ========================================================== */

body.ita-tool-page-contrast-fixed
:where(
  .ita-live-review,
  .ita-wl-review,
  .pm-mega-intro,
  .pm-footer
) {
  background:
    linear-gradient(
      145deg,
      var(--ita-tp-dark),
      var(--ita-tp-dark-two)
    ) !important;

  color:
    var(--ita-tp-on-dark) !important;
}

body.ita-tool-page-contrast-fixed
:where(
  .ita-live-review,
  .ita-wl-review,
  .pm-mega-intro,
  .pm-footer
)
:where(
  h1,
  h2,
  h3,
  h4,
  strong,
  b,
  a
) {
  color:
    #ffffff !important;

  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
:where(
  .ita-live-review,
  .ita-wl-review,
  .pm-mega-intro,
  .pm-footer
)
:where(
  p,
  li,
  dd,
  label,
  small,
  span,
  button
) {
  color:
    var(--ita-tp-on-dark-muted) !important;

  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-tool-page-contrast-fixed
:where(
  .ita-live-review,
  .ita-wl-review
)
input[type="checkbox"] {
  accent-color: #63d0b6;
}

/* ==========================================================
   LIGHT MEGA-MENU COLUMNS
   ========================================================== */

body.ita-tool-page-contrast-fixed
.pm-mega-columns,
body.ita-tool-page-contrast-fixed
.pm-destination-grid {
  color:
    var(--ita-tp-text) !important;
}

body.ita-tool-page-contrast-fixed
.pm-mega-columns
:where(
  h2,
  h3,
  strong,
  a
),
body.ita-tool-page-contrast-fixed
.pm-destination-grid
:where(
  h2,
  h3,
  strong,
  a
) {
  color:
    var(--ita-tp-ink) !important;
}

body.ita-tool-page-contrast-fixed
.pm-mega-columns
:where(
  p,
  small,
  span
),
body.ita-tool-page-contrast-fixed
.pm-destination-grid
:where(
  p,
  small,
  span
) {
  color:
    var(--ita-tp-text) !important;

  opacity: 1 !important;
}

/* ==========================================================
   CONNECTIVITY-PAGE HARD RESET
   ========================================================== */

body.ita-connectivity-page
main > section
:where(
  h1,
  h2,
  h3,
  h4,
  p,
  li,
  strong,
  small,
  span,
  label
) {
  opacity: 1 !important;
  text-shadow: none !important;
}

body.ita-connectivity-page
main > section:not(:has(.ita-live-review))
:where(
  h1,
  h2,
  h3,
  h4,
  strong
) {
  color:
    var(--ita-tp-ink) !important;
}

body.ita-connectivity-page
main > section:not(:has(.ita-live-review))
:where(
  p,
  li,
  small,
  span,
  label
) {
  color:
    var(--ita-tp-text) !important;
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 760px) {
  body.ita-tool-page-contrast-fixed {
    --ita-tp-section-space: 40px;
    --ita-tp-hero-space: 46px;
    --ita-tp-gap: 16px;
  }

  body.ita-tool-page-contrast-fixed
  main > section:first-child h1 {
    font-size:
      clamp(2rem, 10vw, 2.8rem) !important;
  }

  body.ita-tool-page-contrast-fixed
  main > section h2 {
    font-size:
      clamp(1.5rem, 7vw, 2rem) !important;
  }
}