/* =========================================================
   BMK SIGNATURE MOMENTS — SHARED WEBSITE SYSTEM v1
   This file owns the visual "house":
   colors, content width, navigation, footer, buttons,
   typography helpers, and shared responsive behavior.
========================================================= */
:root {
  --bmk-ivory: #f7f3ec;
  --bmk-cream: #fbf8f2;
  --bmk-white: #fffdf8;
  --bmk-forest: #173d32;
  --bmk-forest-deep: #0f2d25;
  --bmk-navy: #162f49;
  --bmk-gold: #b78a47;
  --bmk-ink: #20231f;
  --bmk-muted: #656b66;
  --bmk-meta: #747a75;
  --bmk-line: rgba(23,61,50,.14);
  --bmk-serif: 'DM Serif Display', Georgia, serif;
  --bmk-sans: 'Libre Franklin', Arial, sans-serif;

  --bmk-page: min(1480px, 90vw);
  --bmk-reading: 690px;
  --bmk-section-y: clamp(76px, 7vw, 118px);
  --bmk-nav-h: 78px;
}

/* Global normalization */
html { scroll-padding-top: calc(var(--bmk-nav-h) + 18px); }
body { overflow-x: hidden; }
.sr-only {
  position:absolute!important;width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;overflow:hidden!important;
  clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* =========================================================
   FLOATING / STICKY NAVIGATION — SITE-WIDE
   Not a rounded pill. Full-width edge-to-edge treatment.
   Transparent over hero; becomes ivory on scroll.
========================================================= */
.bmk-site-header {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  right: 0;
  color: #fff;
  transition:
    background-color .28s ease,
    color .28s ease,
    box-shadow .28s ease,
    backdrop-filter .28s ease;
}

.bmk-site-header.is-scrolled {
  color: var(--bmk-forest-deep);
  background: rgba(251,248,242,.95);
  box-shadow: 0 8px 28px rgba(17,32,27,.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(23,61,50,.08);
}

.bmk-nav-shell {
  width: 100%;
  min-height: var(--bmk-nav-h);
  padding: 0 4.2vw;
  display: grid;
  grid-template-columns: 245px 1fr auto;
  align-items: center;
  gap: 28px;
}

.bmk-brand {
  display: inline-flex;
  flex-direction: column;
  width: fit-content;
  color: inherit;
  line-height: .84;
  text-decoration: none;
}

.bmk-brand-mark {
  font-family: var(--bmk-serif);
  font-size: 42px;
  letter-spacing: .035em;
}

.bmk-brand-sub {
  margin-top: 8px;
  font-family: var(--bmk-sans);
  font-size: 8px;
  font-weight: 500;
  letter-spacing: .27em;
}

.bmk-primary-nav {
  display: flex;
  justify-content: center;
  gap: clamp(22px, 2.4vw, 40px);
  font-family: var(--bmk-sans);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.bmk-primary-nav a {
  position: relative;
  color: inherit;
  text-decoration: none;
  padding: 30px 0 25px;
  opacity: .92;
}

.bmk-primary-nav a::after {
  content:"";
  position:absolute;
  left:0; right:100%; bottom:20px;
  height:1px;
  background: currentColor;
  transition:right .22s ease;
}

.bmk-primary-nav a:hover::after,
.bmk-primary-nav a[aria-current="page"]::after { right:0; }

.bmk-header-cta {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding: 0 20px;
  color:#fff;
  background:rgba(15,45,37,.72);
  border:1px solid rgba(255,255,255,.52);
  font-size:10px;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  transition:.25s ease;
}
.bmk-site-header.is-scrolled .bmk-header-cta {
  background:var(--bmk-forest);
  border-color:var(--bmk-forest);
}
.bmk-header-cta:hover { background:var(--bmk-forest-deep); }

.bmk-menu-toggle {
  display:none;
  border:0;
  background:transparent;
  color:inherit;
  padding:10px;
  cursor:pointer;
}
.bmk-menu-toggle span:not(.sr-only) {
  display:block;width:26px;height:1px;background:currentColor;margin:6px 0;
}

/* Shared active-page treatment */
body[data-page="planning"] .bmk-primary-nav [data-page="planning"],
body[data-page="destinations"] .bmk-primary-nav [data-page="destinations"],
body[data-page="travel-services"] .bmk-primary-nav [data-page="services"],
body[data-page="journal"] .bmk-primary-nav [data-page="journal"],
body[data-page="about"] .bmk-primary-nav [data-page="about"],
body[data-page="connect"] .bmk-primary-nav [data-page="connect"] {
  opacity:1;
}
body[data-page="planning"] .bmk-primary-nav [data-page="planning"]::after,
body[data-page="destinations"] .bmk-primary-nav [data-page="destinations"]::after,
body[data-page="travel-services"] .bmk-primary-nav [data-page="services"]::after,
body[data-page="journal"] .bmk-primary-nav [data-page="journal"]::after,
body[data-page="about"] .bmk-primary-nav [data-page="about"]::after,
body[data-page="connect"] .bmk-primary-nav [data-page="connect"]::after {
  right:0;
}

/* =========================================================
   SHARED FOOTER
========================================================= */
.bmk-site-footer {
  background:var(--bmk-forest-deep);
  color:#fff;
  padding:58px 5vw 28px;
  font-family:var(--bmk-sans);
}
.bmk-footer-grid {
  display:grid;
  grid-template-columns:1.6fr .75fr .85fr 1.2fr;
  gap:clamp(32px,4vw,72px);
  padding-bottom:42px;
}
.bmk-footer-brand p {
  margin:24px 0 18px;
  color:rgba(255,255,255,.68);
  font-family:var(--bmk-serif);
  font-style:italic;
  line-height:1.45;
}
.bmk-social-links {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  font-size:10px;
}
.bmk-social-links a,
.bmk-footer-col a { color:rgba(255,255,255,.78); text-decoration:none; }
.bmk-footer-col {
  display:flex;
  flex-direction:column;
  gap:10px;
}
.bmk-footer-col > span {
  margin-bottom:5px;
  color:rgba(255,255,255,.48);
  font-size:9px;
  letter-spacing:.14em;
}
.bmk-footer-col a,
.bmk-footer-col p {
  margin:0;
  font-size:11px;
  line-height:1.6;
}
.bmk-footer-legal {
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.14);
  display:flex;
  justify-content:space-between;
  gap:30px;
  color:rgba(255,255,255,.48);
  font-size:9px;
}
.bmk-footer-legal div { display:flex; gap:22px; }
.bmk-footer-legal a { color:inherit; }

/* Shared page-width helper, for use during refinement */
.bmk-page-shell { width:var(--bmk-page); margin-inline:auto; }

/* Shared focus state */
a:focus-visible, button:focus-visible, input:focus-visible {
  outline:2px solid var(--bmk-gold);
  outline-offset:4px;
}

/* =========================================================
   TABLET / MOBILE NAVIGATION
========================================================= */
@media (max-width: 980px) {
  .bmk-nav-shell {
    grid-template-columns:1fr auto;
    min-height:70px;
    padding:0 24px;
  }
  .bmk-brand-mark { font-size:35px; }
  .bmk-header-cta { display:none; }
  .bmk-menu-toggle { display:block; grid-column:2; grid-row:1; }

  .bmk-primary-nav {
    position:absolute;
    top:70px; left:0; right:0;
    display:none;
    flex-direction:column;
    gap:0;
    background:rgba(251,248,242,.98);
    color:var(--bmk-forest-deep);
    border-top:1px solid var(--bmk-line);
    box-shadow:0 14px 30px rgba(17,32,27,.10);
  }
  .bmk-site-header.menu-open .bmk-primary-nav { display:flex; }
  .bmk-primary-nav a {
    padding:17px 24px;
    border-bottom:1px solid rgba(23,61,50,.08);
  }
  .bmk-primary-nav a::after { display:none; }
  .bmk-site-header:not(.is-scrolled).menu-open {
    background:rgba(251,248,242,.98);
    color:var(--bmk-forest-deep);
  }

 .bmk-footer-grid {
  grid-template-columns: 1.4fr .8fr .9fr 1.2fr;
  gap: 28px;
}

.bmk-footer-col:last-child {
  grid-column: auto;
}
}
/* =========================================================
   PHONE FOOTER — CLEAN STACK
========================================================= */

@media (max-width: 650px) {

  .bmk-footer-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .bmk-footer-brand,
  .bmk-footer-col,
  .bmk-footer-col:last-child {
    grid-column: 1;
    width: 100%;
    margin: 0;
  }

  .bmk-footer-legal {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
}
/* =========================================================
   BMK GLOBAL SUBHERO HEIGHT NORMALIZATION
========================================================= */

@media (min-width: 1200px) {

  .planning-hero,
  .destination-hero,
  .services-hero,
  .journal-hero,
  .about-hero,
  .connect-hero {
    height: min(68vh, 720px);
    min-height: 600px;
  }
}
/* =========================================================
   BMK GLOBAL SUBHERO COPY ALIGNMENT
========================================================= */

@media (min-width: 1200px) {

  .planning-hero__copy,
  .destination-hero-copy,
  .services-hero__copy,
  .journal-hero-copy,
  .about-hero-copy,
  .connect-hero .hero-copy {
    width: min(1680px, 94vw);
    max-width: none;
    margin-inline: auto;
    padding-top: 190px;
  }
}
/* =========================================================
   BMK GLOBAL SUBHERO — FIXED COPY ANCHOR
   Guarantees eyebrow starts in same place on every subpage
========================================================= */

@media (min-width: 1200px) {

  .planning-hero,
  .destination-hero,
  .services-hero,
  .journal-hero,
  .about-hero,
  .connect-hero {
    position: relative;
  }

  .planning-hero__copy,
  .destination-hero-copy,
  .services-hero__copy,
  .journal-hero-copy,
  .about-hero-copy,
  .connect-hero .hero-copy {
    position: absolute !important;

    top: 190px !important;
    left: 50% !important;

    width: min(1680px, 94vw) !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: translateX(-50%) !important;
  }
}
/* =========================================================
   BMK GLOBAL SUBHERO — INTERNAL TEXT RHYTHM
========================================================= */

@media (min-width: 1200px) {

  /* Eyebrow → headline */
  .planning-hero__copy .eyebrow,
  .destination-hero-copy .eyebrow,
  .services-hero__copy .eyebrow,
  .journal-hero-copy .eyebrow,
  .about-hero-copy .eyebrow,
  .connect-hero .hero-copy .eyebrow {
    margin-bottom: 18px !important;
  }

  /* Headline */
  .planning-hero__copy h1,
  .destination-hero-copy h1,
  .services-hero__copy h1,
  .journal-hero-copy h1,
  .about-hero-copy h1,
  .connect-hero .hero-copy h1 {
    margin-top: 0 !important;
    margin-bottom: 26px !important;
  }

  /* Description */
  .planning-hero__copy h1 + p,
  .destination-hero-copy h1 + p,
  .services-hero__copy h1 + p,
  .journal-hero-copy h1 + p,
  .about-hero-copy h1 + p,
  .connect-hero .hero-copy h1 + p {
    margin-top: 0 !important;
  }
}
/* =========================================================
   BMK MULTI-LINE SUBHERO FIT
   Keep shared hero height/anchor; scale longer hero copy
========================================================= */

@media (min-width: 1200px) {

  .planning-hero__copy h1,
  .destination-hero h1,
  .services-hero__copy h1 {
    max-width: 1000px;
    font-size: clamp(52px, 4.4vw, 78px) !important;
    line-height: .98;
    text-wrap: balance;
  }

  .planning-hero__copy > p:not(.eyebrow),
  .destination-hero-copy > p:not(.eyebrow), 
  .services-hero__copy > p:not(.eyebrow) {
    max-width: 680px;
    font-size: 16px;
    line-height: 1.6;
  }
}
/* =========================================================
   GLOBAL EDITORIAL TEXT-LINK MOTION
========================================================= */

.text-link,
.text-cta,
.quiet-link,
.section-cta,
.services-text-link,
.story-link,
.view-all,
.read-link {
  position: relative;
  display: inline-block;
  width: fit-content;

  padding-bottom: 5px;
  border-bottom: 1px solid var(--gold, var(--bmk-gold, #c79245)) !important;

  text-decoration: none;
  transition:
    color 200ms ease,
    transform 200ms ease;
}

/* Short resting line */
.text-link::after,
.text-cta::after,
.quiet-link::after,
.section-cta::after,
.services-text-link::after,
.story-link::after,
.view-all::after,
.read-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;

  width: 32px;
  height: 1px;
  background: var(--gold, var(--bmk-gold, #c79245));

  transition: width 250ms ease;
}

/* Movement and expanding line */
.text-link:hover,
.text-link:focus-visible,
.text-cta:hover,
.text-cta:focus-visible,
.quiet-link:hover,
.quiet-link:focus-visible,
.section-cta:hover,
.section-cta:focus-visible,
.services-text-link:hover,
.services-text-link:focus-visible,
.story-link:hover,
.story-link:focus-visible,
.view-all:hover,
.view-all:focus-visible,
.read-link:hover,
.read-link:focus-visible {
  transform: translateX(3px);
}

.text-link:hover::after,
.text-link:focus-visible::after,
.text-cta:hover::after,
.text-cta:focus-visible::after,
.quiet-link:hover::after,
.quiet-link:focus-visible::after,
.section-cta:hover::after,
.section-cta:focus-visible::after,
.services-text-link:hover::after,
.services-text-link:focus-visible::after,
.story-link:hover::after,
.story-link:focus-visible::after,
.view-all:hover::after,
.view-all:focus-visible::after,
.read-link:hover::after,
.read-link:focus-visible::after {
  width: 100%;
}

/* Accessible keyboard indicator */
.text-link:focus-visible,
.text-cta:focus-visible,
.quiet-link:focus-visible,
.section-cta:focus-visible,
.services-text-link:focus-visible,
.story-link:focus-visible,
.view-all:focus-visible,
.read-link:focus-visible {
  outline: 1px solid currentColor;
  outline-offset: 5px;
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
  .text-link,
  .text-cta,
  .quiet-link,
  .section-cta,
  .services-text-link,
  .story-link,
  .view-all,
  .read-link,
  .text-link::after,
  .text-cta::after,
  .quiet-link::after,
  .section-cta::after,
  .services-text-link::after,
  .story-link::after,
  .view-all::after,
  .read-link::after {
    transition: none;
  }
}

.text-link.light::after,
.text-cta.light::after,
.quiet-link.light::after,
.services-text-link--light::after {
  background: rgba(255, 250, 242, 0.78);
}

.text-link,
.text-cta,
.quiet-link,
.section-cta,
.services-text-link,
.story-link,
.view-all,
.read-link {
  position: relative;
  display: inline-block;
  width: fit-content;

  padding-bottom: 5px;
  border-bottom: 1px solid var(--gold, var(--bmk-gold, #c79245)) !important;

  text-decoration: none;
  transition:
    color 200ms ease,
    transform 200ms ease;
}

.text-link::after,
.text-cta::after,
.quiet-link::after,
.section-cta::after,
.services-text-link::after,
.story-link::after,
.view-all::after,
.read-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;

  width: 32px;
  height: 1px;
  background: currentColor;

  transition: width 250ms ease;
}

.text-link:hover,
.text-link:focus-visible,
.text-cta:hover,
.text-cta:focus-visible,
.quiet-link:hover,
.quiet-link:focus-visible,
.section-cta:hover,
.section-cta:focus-visible,
.services-text-link:hover,
.services-text-link:focus-visible,
.story-link:hover,
.story-link:focus-visible,
.view-all:hover,
.view-all:focus-visible,
.read-link:hover,
.read-link:focus-visible {
  color: var(--teal, var(--bmk-forest, #0f4538));
  transform: translateX(3px);
}

/* =========================================================
   SHARED FINAL CTA PROPORTIONS
   Home · Destinations · Travel Services
========================================================= */

@media (min-width: 1200px) {

  body[data-page="home"] .final-cta,
  body[data-page="destinations"] .planning-cta {
    min-height: 400px !important;
  }

  body[data-page="travel-services"] .services-final-cta {
    padding-top: 68px !important;
    padding-bottom: 68px !important;
  }

  body[data-page="home"] .final-cta-inner,
  body[data-page="destinations"] .planning-cta-copy,
  body[data-page="travel-services"] .services-final-cta__inner {
    width: min(1480px, 90vw);
    margin-right: auto;
    margin-left: auto;
    text-align: center;
  }

  body[data-page="home"] .final-cta h2,
  body[data-page="destinations"] .planning-cta h2,
  body[data-page="travel-services"] .services-final-cta h2 {
    max-width: 1000px;
    margin: 18px auto 0 !important;

    font-size: clamp(44px, 3.6vw, 58px) !important;
    line-height: 1.02 !important;
  }

  body[data-page="home"] .final-cta-deck,
  body[data-page="destinations"]
  .planning-cta-copy > p:not(.eyebrow),
  body[data-page="travel-services"]
  .services-final-cta__inner >
  p:not(.eyebrow, .services-final-cta__disclosure) {
    max-width: 680px !important;
    margin: 20px auto 26px !important;

    font-size: 16px;
    line-height: 1.65;
  }

  body[data-page="home"] .final-cta .button-light,
  body[data-page="destinations"] .planning-cta .button-light,
  body[data-page="travel-services"]
  .services-final-cta .services-button {
    min-height: 44px;
    padding: 0 22px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  body[data-page="travel-services"]
  .services-final-cta__disclosure {
    margin-top: 38px !important;
  }
}

@media (min-width: 761px) and (max-width: 1199px) {

  body[data-page="home"] .final-cta,
  body[data-page="destinations"] .planning-cta {
    min-height: 360px !important;
  }

  body[data-page="travel-services"] .services-final-cta {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }

  body[data-page="home"] .final-cta h2,
  body[data-page="destinations"] .planning-cta h2,
  body[data-page="travel-services"] .services-final-cta h2 {
    font-size: clamp(42px, 5vw, 54px) !important;
  }
}