/* ── CNY Travel · home.css ───────────────────────────────────────────────
   Homepage-only design layer, matching the approved "Tropical Getaway"
   mockup. Loaded AFTER style.css and only on index.html, so every other
   page (promo.html, Syracuse, cruises, group travel…) keeps the existing
   production styling untouched.

   Palette sampled directly from the approved mockup:
     deep navy    #18284b     vivid orange #e76828
     steel blue   #4d8eb5     muted teal   #779da5
     pale blue    #edf3f7     warm cream   #fbf3ea / #f9ece4 / #f9e7da
     warm gold    #fdd699 / #fdd9a7 / #fcc897
     white        #fcfcfc
   ─────────────────────────────────────────────────────────────────────── */

.nt-body {
  --hp-navy: #18284b;
  --hp-navy-soft: #22375f;
  --hp-orange: #e76828;
  --hp-orange-dark: #cf5a1d;
  --hp-steel: #4d8eb5;
  --hp-teal: #779da5;
  --hp-pale: #edf3f7;
  --hp-cream: #fbf3ea;
  --hp-peach: #f9ece4;
  --hp-peach-2: #f9e7da;
  --hp-gold: #fdd699;
  --hp-gold-2: #fdd9a7;
  --hp-gold-3: #fcc897;
  --hp-white: #fcfcfc;

  --hp-radius: 18px;
  --hp-radius-sm: 14px;
  --hp-border: 1px solid rgba(24, 40, 75, .10);
  --hp-shadow: 0 6px 18px rgba(24, 40, 75, .07);
  --hp-shadow-md: 0 14px 34px rgba(24, 40, 75, .11);
  --hp-shadow-lg: 0 24px 60px rgba(24, 40, 75, .18);

  --hp-max: 1200px;
  --hp-gutter: 24px;

  background: var(--hp-white);
  color: #2b3350;
}

.nt-body h1, .nt-body h2, .nt-body h3 { font-family: 'Inter', system-ui, sans-serif; color: var(--hp-navy); }

/* Hand-drawn orange brush stroke, used for script underlines. */
.nt-body .hp-stroke {
  position: relative;
  display: inline-block;
}
.nt-body .hp-stroke::after {
  content: "";
  position: absolute;
  left: -2%;
  right: -2%;
  bottom: -.14em;
  height: .28em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9C40 4 78 3 118 6.5c22 2 48 1.5 79 -2.5' stroke='%23e76828' stroke-width='5.5' fill='none' stroke-linecap='round'/%3E%3Cpath d='M14 11.5c34-3 70-4 104-1.5' stroke='%23e76828' stroke-width='2' fill='none' stroke-linecap='round' opacity='.55'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════════════════
   HEADER / NAVIGATION — white bar, navy text, orange CTA
   ═══════════════════════════════════════════════════════════════════════ */
.nt-body .masthead {
  position: sticky;
  top: 0;
  z-index: 60;
  background: var(--hp-white);
  border-bottom: 1px solid rgba(24, 40, 75, .09);
  box-shadow: none;
  transition: box-shadow .2s ease;
}
.nt-body .masthead.is-stuck { box-shadow: 0 6px 20px rgba(24, 40, 75, .10); }

.nt-body .masthead-inner {
  max-width: var(--hp-max);
  margin: 0 auto;
  padding: 14px var(--hp-gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.nt-body .masthead-brand { color: var(--hp-navy); }
.nt-body .masthead-brand:hover { color: var(--hp-navy); text-decoration: none; }
.nt-body .masthead-mark {
  background: var(--hp-pale);
  color: var(--hp-navy);
  border-radius: 12px;
}
.nt-body .masthead-brand:hover .masthead-mark { background: var(--hp-cream); }
.nt-body .masthead-name { color: var(--hp-navy); font-weight: 800; letter-spacing: -.01em; }
.nt-body .masthead-sub { color: var(--hp-teal); }

.nt-body .masthead-links a {
  color: var(--hp-navy);
  font-size: 15px;
  font-weight: 600;
  border-bottom: 0;
  padding: 6px 2px;
  border-radius: 6px;
}
.nt-body .masthead-links a:hover { background: transparent; color: var(--hp-orange); }
.nt-body .masthead-links .masthead-cta {
  display: inline-block;
  margin-left: 6px;
  padding: 10px 20px;
  background: var(--hp-orange);
  color: #fff !important;
  font-weight: 700;
  border-radius: 999px;
  box-shadow: 0 6px 16px rgba(231, 104, 40, .28);
}
.nt-body .masthead-links .masthead-cta:hover { background: var(--hp-orange-dark); color: #fff !important; }

.nt-body .nav-toggle { color: var(--hp-navy); border-color: rgba(24, 40, 75, .18); }
.nt-body .nav-toggle:hover { background: var(--hp-pale); }
.nt-body .nav-toggle[aria-expanded="true"] { background: var(--hp-pale); }

/* ═══════════════════════════════════════════════════════════════════════
   HERO — full-bleed tropical image, navy scrim, form card on the right
   ═══════════════════════════════════════════════════════════════════════ */
.nt-body .hero-wrap { position: relative; }

.nt-body .hero {
  position: relative;
  background: var(--hp-navy) url('/images/hero-tropical.jpg') center 42% / cover no-repeat;
  padding: 0;
  overflow: hidden;
  isolation: isolate;
}
.nt-body .hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(100deg, rgba(15, 28, 56, .90) 0%, rgba(20, 38, 72, .74) 42%, rgba(24, 40, 75, .30) 68%, rgba(24, 40, 75, .18) 100%),
    linear-gradient(to top, rgba(12, 22, 45, .55), rgba(12, 22, 45, 0) 45%);
}
.nt-body .hero-inner {
  position: relative;
  z-index: 1;
  max-width: var(--hp-max);
  margin: 0 auto;
  padding: 40px var(--hp-gutter) 44px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: end;
  min-height: min(500px, 72vh);
}

/* Narrow screens: the quote card lives in its own section directly below the
   hero, on the same cream ground the rest of the page uses, so it still reads
   as part of the hero rather than an unrelated form page. */
.nt-body .quote-section {
  background: var(--hp-cream);
  padding: 24px var(--hp-gutter) 40px;
  border-top: 1px solid rgba(24, 40, 75, .07);
  /* The form column is narrow on phones. Turnstile is data-size="flexible", so in
     production it shrinks to this column — but if the widget fails to load it
     falls back to a fixed 300px box. Clip it so a third-party widget can never
     introduce page-level horizontal scroll. */
  overflow-x: clip;
}
.nt-body .quote-section .hero-card { max-width: 560px; margin: 0 auto; }

/* Mobile-only primary CTA — at ≥1000px the form sits beside this copy. */
.nt-body .hero-cta { margin: 20px 0 0; }
.nt-body .hero-cta-btn {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 30px;
  font-size: 16px;
  font-weight: 800;
}

/* Desktop / large tablet: the photo and scrim stretch across both columns so
   the card still sits on the image, and the tall form column no longer forces
   the visual hero to grow. */
@media (min-width: 1000px) {
  .nt-body .hero-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(420px, 42%, 520px);
    gap: 48px;
    align-items: stretch;
    background: var(--hp-navy) url('/images/hero-tropical.jpg') center 42% / cover no-repeat;
    overflow: hidden;
    isolation: isolate;
    padding: 56px max(var(--hp-gutter), calc((100% - var(--hp-max)) / 2)) 64px;
  }
  .nt-body .hero-wrap::before {
    content: "";
    position: absolute;
    inset: 0;
    /* Stop the scrim at the quote column's left edge. The containing block is the
       padding box, so the inset must cover BOTH the wrap's centring padding and
       the card column: padding-right + card width. Percentage bases differ
       between the grid track (content box) and `right` (padding box), so this
       deliberately rounds the card column up — a scrim that stops a few px
       early is harmless, one that runs long would tint the card. */
    right: calc(max(var(--hp-gutter), calc((100% - var(--hp-max)) / 2)) + clamp(420px, 42%, 520px));
    z-index: 0;
    background:
      linear-gradient(100deg, rgba(15, 28, 56, .90) 0%, rgba(20, 38, 72, .76) 38%, rgba(24, 40, 75, .34) 66%, rgba(24, 40, 75, 0) 100%),
      linear-gradient(to top, rgba(12, 22, 45, .52), rgba(12, 22, 45, 0) 48%);
  }
  /* Both grid items are positioned and stacked above the scrim. A static grid item
     would paint in the block-background layer, *under* the z-index:0 pseudo-element,
     which tinted the white card blue. */
  .nt-body .hero-wrap > .hero,
  .nt-body .hero-wrap > .quote-section {
    position: relative;
    z-index: 1;
  }
  .nt-body .hero {
    background: none;
    overflow: visible;
    display: flex;
  }
  .nt-body .hero::before { content: none; }
  .nt-body .hero-inner {
    padding: 0;
    max-width: none;
    margin: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }
  .nt-body .quote-section {
    background: none;
    border-top: 0;
    padding: 0;
    overflow: visible;
  }
  .nt-body .quote-section .hero-card { max-width: none; margin: 0; }
  .nt-body .hero-cta { display: none; }

  /* The form column is very tall; pin the promise of the hero while it scrolls. */
  .nt-body .hero-copy { position: sticky; top: 104px; }
}

/* — left copy — */
.nt-body .hero-eyebrow {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--hp-gold);
  background: rgba(24, 40, 75, .40);
  border: 1px solid rgba(253, 214, 153, .38);
  padding: 7px 14px;
  border-radius: 999px;
  margin-bottom: 20px;
}
.nt-body .hero-title {
  color: #fff;
  font-size: clamp(2.5rem, 5.2vw, 4.25rem);
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -.02em;
  margin-bottom: 20px;
}
.nt-body .hero-title .hero-script {
  font-family: 'Caveat', cursive;
  font-style: normal;
  font-weight: 700;
  font-size: 1.16em;
  line-height: 1.02;
  color: #fff;
  display: inline-block;
  margin-top: .06em;
}
.nt-body .hero-title .hero-script::after {
  content: "";
  display: block;
  height: .22em;
  margin-top: -.04em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 14' preserveAspectRatio='none'%3E%3Cpath d='M4 9c46-5 92-6 138-1.5 22 2.2 48 1.6 74-2.4' stroke='%23e76828' stroke-width='6' fill='none' stroke-linecap='round'/%3E%3Cpath d='M18 12c40-3.4 82-4 122-1' stroke='%23e76828' stroke-width='2.2' fill='none' stroke-linecap='round' opacity='.5'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.nt-body .hero-sub {
  color: rgba(255, 255, 255, .92);
  font-size: 17px;
  line-height: 1.6;
  max-width: 34ch;
  margin-bottom: 24px;
}
.nt-body .hero-badges {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
}
.nt-body .hero-badges li {
  font-size: 13px;
  font-weight: 600;
  color: var(--hp-navy);
  background: var(--hp-gold);
  padding: 6px 12px;
  border-radius: 999px;
}

/* — right quote card — */
.nt-body .hero-card {
  background: var(--hp-white);
  border-radius: var(--hp-radius);
  box-shadow: var(--hp-shadow-lg);
  border: 1px solid rgba(24, 40, 75, .08);
  padding: 26px 26px 28px;
}
.nt-body .hero-card-head { text-align: center; margin-bottom: 20px; }
.nt-body .hero-card-title {
  font-size: 25px;
  font-weight: 800;
  color: var(--hp-navy);
  margin-bottom: 6px;
  letter-spacing: -.01em;
}
.nt-body .hero-card-sub { font-size: 14px; color: #5b6580; line-height: 1.5; margin: 0; }
.nt-body .hero-card-reassure {
  text-align: center;
  font-size: 12px;
  color: #6b7590;
  margin: 12px 0 0;
}

/* Compact the (very long) form inside the hero card. */
.nt-body .hero-card #lead-form fieldset { padding: 12px 0 2px; margin-bottom: 2px; }
.nt-body .hero-card #lead-form fieldset + fieldset { border-top: 1px solid rgba(24, 40, 75, .09); }
.nt-body .hero-card #lead-form legend {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--hp-steel);
  padding: 0 8px 0 0;
  margin-bottom: 8px;
}
.nt-body .hero-card #lead-form .field { margin-bottom: 10px; }
.nt-body .hero-card #lead-form .field-row { margin-bottom: 8px; }
.nt-body .hero-card #lead-form label { font-size: 13px; font-weight: 600; color: var(--hp-navy); margin-bottom: 4px; }
.nt-body .hero-card #lead-form input[type="text"],
.nt-body .hero-card #lead-form input[type="email"],
.nt-body .hero-card #lead-form input[type="tel"],
.nt-body .hero-card #lead-form input[type="date"],
.nt-body .hero-card #lead-form select { min-height: 44px; }
.nt-body .hero-card #lead-form .check-grid { gap: 6px 12px; }
.nt-body .hero-card #lead-form .check-opt { font-size: 13px; padding: 3px 0; }
.nt-body .hero-card #lead-form .field-hint { font-size: 12px; margin-top: 4px; }
.nt-body .hero-card #lead-form .pill { font-size: 13px; padding: 8px 12px; }
.nt-body .hero-card #lead-form .radio-opt { font-size: 13px; padding: 3px 0; }
.nt-body .hero-card #lead-form textarea { min-height: 78px; }
.nt-body .hero-card #lead-form .btn-submit {
  width: 100%;
  background: var(--hp-orange);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  border-radius: 12px;
  padding: 15px 20px;
  box-shadow: 0 8px 20px rgba(231, 104, 40, .30);
  justify-content: center;
}
.nt-body .hero-card #lead-form .btn-submit:hover { background: var(--hp-orange-dark); }

/* ═══════════════════════════════════════════════════════════════════════
   TRUST STRIP
   ═══════════════════════════════════════════════════════════════════════ */
.nt-body .trustbar {
  background: var(--hp-white);
  padding: 0;
  border-bottom: 1px solid rgba(24, 40, 75, .07);
}
.nt-body .trustbar-list {
  list-style: none;
  max-width: var(--hp-max);
  margin: 0 auto;
  padding: 0 var(--hp-gutter);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.nt-body .trustbar-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 22px 20px;
  justify-content: center;
  text-align: left;
}
.nt-body .trustbar-item + .trustbar-item { border-left: 1px solid rgba(24, 40, 75, .10); }
.nt-body .trustbar-ico {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--hp-pale);
  color: var(--hp-steel);
  display: grid;
  place-items: center;
}
.nt-body .trustbar-ico svg { width: 19px; height: 19px; }
.nt-body .trustbar-text {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--hp-navy);
  line-height: 1.35;
}

/* ═══════════════════════════════════════════════════════════════════════
   SERVICE CARDS
   ═══════════════════════════════════════════════════════════════════════ */
.nt-body .services { background: var(--hp-white); }
.nt-body .services .section-inner { max-width: var(--hp-max); }
.nt-body .services h2 { font-size: clamp(1.7rem, 3.2vw, 2.6rem); font-weight: 800; letter-spacing: -.02em; }
.nt-body .services .eyebrow { color: var(--hp-orange); }
.nt-body .services .section-sub { color: #5b6580; max-width: 62ch; }

.nt-body .service-grid {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 20px;
  margin-top: 34px;
}
.nt-body .service-card {
  background: var(--hp-white);
  border: var(--hp-border);
  border-radius: var(--hp-radius-sm);
  box-shadow: var(--hp-shadow);
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.nt-body .service-card:hover { transform: translateY(-4px); box-shadow: var(--hp-shadow-md); border-color: rgba(231, 104, 40, .30); }
.nt-body .service-link { display: block; color: inherit; height: 100%; }
.nt-body .service-link:hover { text-decoration: none; }
.nt-body .service-photo { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--hp-pale); }
.nt-body .service-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nt-body .service-card:hover .service-photo img { transform: scale(1.04); }
.nt-body .service-photo img { transition: transform .35s ease; }

.nt-body .service-ico {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: -22px auto 0;
  background: var(--hp-white);
  color: var(--hp-teal);
  border: 2px solid var(--hp-pale);
  border-radius: 50%;
  position: relative;
  z-index: 1;
}
.nt-body .service-ico svg { width: 20px; height: 20px; }

.nt-body .service-body { display: block; padding: 14px 18px 20px; text-align: center; }
.nt-body .service-title { display: block; font-size: 17px; font-weight: 800; color: var(--hp-navy); margin-bottom: 6px; letter-spacing: -.01em; }
.nt-body .service-desc { display: block; font-size: 13.5px; line-height: 1.55; color: #5b6580; margin-bottom: 12px; }
.nt-body .service-cta { display: block; font-size: 14px; font-weight: 700; color: var(--hp-steel); }
.nt-body .service-card:hover .service-cta { color: var(--hp-orange); }

/* ═══════════════════════════════════════════════════════════════════════
   ADVISOR
   ═══════════════════════════════════════════════════════════════════════ */
.nt-body .advisor { background: var(--hp-pale); padding: 60px var(--hp-gutter); }
.nt-body .advisor-inner {
  max-width: var(--hp-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) minmax(0, 300px);
  gap: 44px;
  align-items: start;
}
.nt-body .advisor-portrait {
  border-radius: var(--hp-radius);
  overflow: hidden;
  box-shadow: var(--hp-shadow-md);
  border: 5px solid var(--hp-white);
  background: var(--hp-cream);
}
.nt-body .advisor-portrait img {
  display: block;
  width: 100%;
  height: 340px;
  object-fit: cover;
  object-position: center 32%;
}
.nt-body .advisor-eyebrow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--hp-steel);
  margin-bottom: 10px;
}
.nt-body .advisor-title { font-size: clamp(1.6rem, 2.6vw, 2.15rem); font-weight: 800; letter-spacing: -.02em; margin-bottom: 14px; }
.nt-body .advisor-copy p { color: #3d4763; line-height: 1.65; margin-bottom: 14px; max-width: 56ch; }
.nt-body .advisor-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0 22px; }
.nt-body .advisor-points { list-style: none; display: grid; gap: 10px; }
.nt-body .advisor-points li { display: flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 600; color: var(--hp-navy); }
.nt-body .advisor-point-ico {
  flex: 0 0 auto;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--hp-white);
  color: var(--hp-teal);
  display: grid; place-items: center;
  border: 1px solid rgba(119, 157, 165, .30);
}
.nt-body .advisor-point-ico svg { width: 15px; height: 15px; }

.nt-body .advisor-quote { margin: 0; position: relative; }
.nt-body .advisor-quote blockquote {
  margin: 0;
  font-family: 'Caveat', cursive;
  font-size: clamp(1.7rem, 2.4vw, 2.2rem);
  font-weight: 600;
  line-height: 1.22;
  color: var(--hp-navy);
}
.nt-body .advisor-quote figcaption { margin-top: 14px; font-size: 14px; font-weight: 700; color: var(--hp-orange); letter-spacing: .04em; }
.nt-body .advisor-quote::after {
  content: "";
  position: absolute;
  left: -6px; top: -10px; bottom: 34px;
  width: 5px;
  border-radius: 3px;
  background: linear-gradient(to bottom, var(--hp-orange), rgba(231, 104, 40, .15));
}

/* ═══════════════════════════════════════════════════════════════════════
   POPULAR DESTINATIONS
   ═══════════════════════════════════════════════════════════════════════ */
.nt-body .destinations { background: var(--hp-white); }
.nt-body .destinations .section-inner { max-width: var(--hp-max); }
.nt-body .destinations .eyebrow { color: var(--hp-orange); }
.nt-body .destinations h2 { font-size: clamp(1.8rem, 3.4vw, 2.8rem); font-weight: 800; letter-spacing: -.02em; }
.nt-body .destinations .section-sub { color: #5b6580; max-width: 52ch; }

.nt-body .destinations-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  margin-bottom: 34px;
}
.nt-body .destinations-cta { margin: 0 0 4px; }
.nt-body .btn-outline {
  display: inline-block;
  border: 2px solid var(--hp-navy);
  color: var(--hp-navy);
  font-weight: 700;
  font-size: 15px;
  padding: 12px 22px;
  border-radius: 999px;
  background: transparent;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.nt-body .btn-outline:hover { background: var(--hp-navy); color: #fff; text-decoration: none; border-color: var(--hp-navy); }

.nt-body .destination-grid {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}
.nt-body .destination-card {
  position: relative;
  border-radius: var(--hp-radius);
  overflow: hidden;
  box-shadow: var(--hp-shadow);
  aspect-ratio: 4 / 5;
  background: var(--hp-pale);
  transition: transform .2s ease, box-shadow .2s ease;
}
.nt-body .destination-card:hover { transform: translateY(-4px); box-shadow: var(--hp-shadow-md); }
.nt-body .destination-link { display: block; height: 100%; color: inherit; }
.nt-body .destination-link:hover { text-decoration: none; }
.nt-body .destination-photo { display: block; height: 100%; }
.nt-body .destination-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.nt-body .destination-card:hover .destination-photo img { transform: scale(1.06); }
.nt-body .destination-overlay {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 40px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: linear-gradient(to top, rgba(13, 26, 52, .88) 0%, rgba(13, 26, 52, .55) 45%, rgba(13, 26, 52, 0) 100%);
}
.nt-body .destination-name { color: #fff; font-size: 21px; font-weight: 800; letter-spacing: -.01em; }
.nt-body .destination-tag { color: var(--hp-gold); font-size: 12.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }

/* ═══════════════════════════════════════════════════════════════════════
   BUTTONS (homepage palette)
   ═══════════════════════════════════════════════════════════════════════ */
.nt-body .btn-cta {
  background: var(--hp-orange);
  color: #fff;
  font-weight: 700;
  border-radius: 999px;
  padding: 13px 24px;
  box-shadow: 0 8px 20px rgba(231, 104, 40, .28);
}
.nt-body .btn-cta:hover { background: var(--hp-orange-dark); text-decoration: none; }
.nt-body .btn-outline-solid {
  border: 2px solid var(--hp-navy);
  color: var(--hp-navy);
  border-radius: 999px;
  padding: 11px 22px;
  font-weight: 700;
  background: var(--hp-white);
}
.nt-body .btn-outline-solid:hover { background: var(--hp-navy); color: #fff; text-decoration: none; }

/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE — desktop nav breakpoint 1000px matches app.js
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 1199px) {
  .nt-body .service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nt-body .advisor-inner { grid-template-columns: 220px minmax(0, 1fr); }
  .nt-body .advisor-quote { grid-column: 1 / -1; padding-top: 8px; }
  .nt-body .advisor-quote::after { left: 0; right: auto; top: 0; bottom: 0; width: 5px; }
  .nt-body .advisor-quote blockquote br { display: none; }
}

@media (max-width: 999px) {
  .nt-body .hero-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
    padding: 44px var(--hp-gutter) 52px;
  }
  .nt-body .hero-sub { max-width: 46ch; }
  .nt-body .hero-card { max-width: 560px; }
  .nt-body .trustbar-list { grid-template-columns: repeat(2, 1fr); }
  .nt-body .trustbar-item:nth-child(3) { border-left: 0; }
  .nt-body .trustbar-item:nth-child(n+3) { border-top: 1px solid rgba(24, 40, 75, .10); }
  .nt-body .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nt-body .destination-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nt-body .advisor-inner { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .nt-body .advisor-portrait { max-width: 300px; }
  .nt-body .advisor-portrait img { height: 300px; }
}

@media (max-width: 719px) {
  .nt-body { --hp-gutter: 18px; }
  .nt-body .hero-title { font-size: clamp(2.1rem, 8.4vw, 2.9rem); }
  .nt-body .hero-card { padding: 22px 18px 24px; }
  .nt-body .trustbar-list { grid-template-columns: 1fr; }
  .nt-body .trustbar-item { justify-content: flex-start; padding: 15px 4px; }
  .nt-body .trustbar-item + .trustbar-item { border-left: 0; }
  .nt-body .trustbar-item:nth-child(n+2) { border-top: 1px solid rgba(24, 40, 75, .10); }
  .nt-body .service-grid { grid-template-columns: 1fr; gap: 18px; }
  .nt-body .destination-grid { grid-template-columns: 1fr; }
  .nt-body .destination-card { aspect-ratio: 3 / 2; }
  .nt-body .destinations-head { align-items: flex-start; }
  .nt-body .advisor-quote::after { display: none; }
  .nt-body .advisor-quote { padding-left: 14px; border-left: 4px solid var(--hp-orange); }
}

@media (max-width: 399px) {
  .nt-body .hero-title { font-size: 2rem; }
  .nt-body .hero-card-title { font-size: 22px; }
  .nt-body .hero-card #lead-form .field-row { grid-template-columns: 1fr; }
  .nt-body .advisor-points li { font-size: 14px; }
}

/* Tighter tap targets where the new compact markup shrank controls. */
@media (max-width: 719px) {
  .nt-body .hero-card #lead-form input,
  .nt-body .hero-card #lead-form select,
  .nt-body .hero-card #lead-form .pill { min-height: 48px; }
  .nt-body .service-cta { padding: 4px 0; }
}

@media (prefers-reduced-motion: reduce) {
  .nt-body .service-card,
  .nt-body .service-photo img,
  .nt-body .destination-card,
  .nt-body .destination-photo img { transition: none; }
  .nt-body .service-card:hover,
  .nt-body .destination-card:hover { transform: none; }
  .nt-body .service-card:hover .service-photo img,
  .nt-body .destination-card:hover .destination-photo img { transform: none; }
}

/* Visible focus rings for the new interactive surfaces. */
.nt-body a:focus-visible,
.nt-body button:focus-visible,
.nt-body input:focus-visible,
.nt-body select:focus-visible,
.nt-body textarea:focus-visible {
  outline: 3px solid var(--hp-orange);
  outline-offset: 2px;
  border-radius: 6px;
}