/*
Theme Name: Cruise Group Planner – The Captain’s Manifest
Theme URI: https://cruisegroupplanner.com/
Author: Cruise Group Planner
Author URI: https://cruisegroupplanner.com/about
Description: A cinematic GeneratePress child theme crafted for creators, coders, and craftsmen who refuse to drift with the current. Built with brass, balance, and a captain’s touch.
Version: 1.0.0
Template: generatepress
Text Domain: captains-manifest
Tags: clean, responsive, modular, nautical, developer-friendly, cinematic, custom-theme
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* =========================================================
   Cruise Group Planner – The Captain’s Manifest
   CSS v1.0.0  |  Owner: You  |  Date: 2025-10-14
   Notes:
   - Keep rules inside the right @layer to avoid fighty overrides.
   - New tweaks go in the proper section, not at the bottom.
   ========================================================= */


/* ---------- 1) TOKENS / DESIGN SYSTEM ---------- */
:root{
  /* brand */
  --blue-900:#0a3a74;
  --blue-800:#05234e;
  --gold-500:#ffb703;
  --white:#fff;

  /* text & layout */
  --text-1:#111; --text-2:#444;
  --max:1140px; --gutter:24px;

  /* radii & shadows */
  --radius-1:8px; --radius-2:12px;
  --shadow-1:0 4px 12px rgba(0,0,0,.12);
  --shadow-2:0 14px 22px rgba(0,0,0,.22);

  /* z */
  --z-header:1000;
}
/* ---------- 4) SITE CUSTOM STYLES (moved from Additional CSS) ---------- */
@layer overrides {
/* START OVERRIDES */

/* ==========================================================
   CRUISE GROUP PLANNER — HEADER / HERO POLISH (v1.3)
   ========================================================== */



/* ===== [HERO BACKDROP] Transparent with sea-foam → blue fade ===== */
/* Applies a subtle transparent gradient behind your hero/upper content */
body.home .site-content{
  background:
    linear-gradient(
      to bottom,
      rgba(255,255,255,0) 0%,
      rgba(200,243,255,.22) 22%,
      rgba(0,180,255,.18) 56%,
      rgba(0,119,200,.16) 100%
    ) !important;
}

/* If you’re using a specific hero wrapper (e.g., .page-hero or .cc-hero), you can boost it too: */
.page-hero, .cc-hero{
  background-color: transparent !important;  /* keep content visible over the gold */
}



/* --- 2) Slightly elevate the nav bar for visual balance --- */
.main-navigation .inside-navigation {
  padding: 14px 0 !important;
}

/* --- 3) Hero background: bring back transparency blend --- */
body.home .site-content {
  background: linear-gradient(
    to bottom,
    rgba(17, 175, 230, 0.6) 0%,       /* top sea foam blue */
    rgba(11, 138, 206, 0.4) 30%,      /* mid gradient */
    rgba(255, 215, 128, 0.3) 60%,     /* golden haze */
    transparent 100%
  ) !important;
}

/* Optional polish for smoother depth feel */
body.home {
  background: linear-gradient(
    180deg,
    rgba(0, 163, 255, 0.3) 0%,
    rgba(255, 210, 120, 0.3) 50%,
    rgba(255, 255, 255, 0.0) 100%
  ) !important;
}

/* --- 4) Optional link spacing adjustment on narrow screens --- */
@media (max-width: 1150px) {
  .main-navigation .main-nav > ul { gap: 1rem; }
  .main-navigation .main-nav > ul > li > a {
    font-size: 0.9em;
    padding: 6px 10px !important;
  }
}

/* NAV NORMALIZE — make every chip the same height */
.main-navigation .main-nav > ul > li > a{
  line-height: 1 !important;            /* no hidden extra height */
  font-weight: 700 !important;
  letter-spacing: .02em;
  padding: 10px 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: .35rem;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* kill any inherited line-height from li or wrapper */
.main-navigation .main-nav > ul > li{
  line-height: 1 !important;
}


/* keep a single row on desktop; progressively tighten */
.main-navigation .main-nav > ul{
  flex-wrap: nowrap !important;
  gap: 1.1rem;               /* start a touch tighter */
}

@media (max-width: 1200px){ .main-navigation .main-nav > ul{ gap: .9rem; } }
@media (max-width: 1120px){ .main-navigation .main-nav > ul{ gap: .7rem; } }
@media (max-width: 1050px){
  .main-navigation .main-nav > ul > li > a{ padding: 8px 12px !important; font-size: .93rem; }
}
/* below your mobile breakpoint, let GP toggle take over */

/* STICKY STABILIZER */
.navigation-stick .main-navigation .inside-navigation{
  padding: 10px 0 !important;   /* match non-sticky */
}
.navigation-stick .main-navigation .main-nav > ul{
  gap: inherit !important;      /* keep the same spacing */
}
.navigation-stick .main-navigation .main-nav > ul > li > a{
  padding: 10px 14px !important;
  border-radius: 10px !important;
}

/* GLASS CHIP RELIABILITY + SAFARI FALLBACK */
.main-navigation .main-nav > ul > li > a{
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.25);
  color:#fff !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
@supports not ((-webkit-backdrop-filter: blur(8px)) or (backdrop-filter: blur(8px))){
  .main-navigation .main-nav > ul > li > a{
    background: rgba(255,255,255,.22);   /* slightly more opaque if no blur */
  }
}

/* ===== TIMMY — centered, ~60% size, full-bleed waves + footer fade ===== */

#timmy-crew{
  position: relative;
  max-width: 900px;
  margin: clamp(2rem,6vw,4rem) auto 0;
  padding: clamp(1.5rem,4vw,2.5rem) 1rem 0;
  text-align: center;
  z-index: 1;
  /* keep this roughly >= the wave height minus the “bottom” lift */
  padding-bottom: clamp(200px, 26vw, 320px);
  overflow: visible;
}

/* Lift the waves UP so they sit under Timmy’s shell */
#timmy-crew::before{
  content:"";
  position:absolute;
  left:50%; transform:translateX(-50%);
  bottom: 72px;                          /* ⬅ raise band (try 60–90px) */
  width: 100vw;
  height: clamp(260px, 30vw, 360px);      /* taller band for coverage */
  background: url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp")
              bottom center / cover no-repeat;
  opacity:.9;
  z-index:0;
  pointer-events:none;
}

/* Keep the footer fade aligned to the new wave position */
#timmy-crew::after{
  content:"";
  position:absolute;
  left:50%; transform:translateX(-50%);
  bottom: 72px;                          /* ⬅ match ::before bottom */
  width: 100vw;
  height: 90px;                           /* fade length */
  background: linear-gradient(to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,27,77,0.45) 55%,
      #003366 100%);
  z-index:1;
  pointer-events:none;
}

/* Pull Timmy slightly into the waves */
#timmy-crew .timmy-figure img{
  display:block;
  width: clamp(160px, 20vw, 260px);
  height:auto;
  margin: 0 auto calc(-1 * clamp(36px, 5vw, 70px));  /* ⬅ deeper overlap */
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.25));
}

/* Caption & blurb above the waves, a hair closer */
#timmy-crew .timmy-nameplate{ position:relative; z-index:2; margin-top:.3rem; }
#timmy-crew .timmy-blurb{ position:relative; z-index:2; margin-top:.3rem; max-width:640px; margin-left:auto; margin-right:auto; line-height:1.55; opacity:.95; text-align:center; }

/* Remove any thin border/line between waves and footer */
.site-footer{ position:relative; z-index:0; padding-top: clamp(2.5rem, 5vw, 4rem); border-top: 0 !important; }

/* 1) Lift the wave band, but not so high it crosses the text */
#timmy-crew::before,
#timmy-crew::after{
  bottom: 56px;                     /* was 72px */
}

/* 2) Let Timmy overlap the wave a touch */
#timmy-crew .timmy-figure img{
  margin-bottom: calc(-1 * clamp(26px, 3.8vw, 52px)); /* a bit less overlap than before */
}

/* 3) Nudge caption & blurb UP so they sit above the waves cleanly */
#timmy-crew .timmy-nameplate,
#timmy-crew .timmy-blurb{
  transform: translateY(-10px);
}

/* 4) Slight soften at top of waves so text reads clearly */
#timmy-crew::before{
  /* add a subtle top softening over the wave image */
  background:
    linear-gradient(to top, rgba(255,255,255,0) 0%, rgba(255,255,255,.18) 22%, rgba(255,255,255,0) 42%),
    url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp")
      bottom center / cover no-repeat;
}
/* === FINAL FIX: Clear white background and perfect overlap === */

/* Remove any background color or container panel */
#timmy-crew,
#timmy-crew .grid-container,
#timmy-crew .inside-article {
  background: transparent !important;
}

/* Wave band: lift slightly higher and ensure it's full width */
#timmy-crew::before {
  bottom: 64px;  /* adjust + / - for perfect overlap */
  height: clamp(280px, 30vw, 380px);
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  background: 
    linear-gradient(to top, rgba(255,255,255,0) 0%, rgba(255,255,255,.1) 22%, rgba(255,255,255,0) 45%),
    url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp") 
    bottom center / cover no-repeat;
  opacity: 0.95;
  z-index: 0;
  pointer-events: none;
}

/* Keep Timmy fully visible and lifted above */
#timmy-crew .timmy-figure img {
  position: relative;
  z-index: 2;
  margin-bottom: calc(-1 * clamp(36px, 5vw, 72px));
  width: clamp(160px, 22vw, 260px);
  height: auto;
}

/* Keep text layers above the water as well */
#timmy-crew .timmy-nameplate,
#timmy-crew .timmy-blurb {
  position: relative;
  z-index: 2;
  transform: translateY(-6px);
}

/* Clean footer transition */
.site-footer {
  position: relative;
  z-index: 1;
  margin-top: 0;
  padding-top: clamp(2.5rem,5vw,4rem);
  border-top: none !important;
}
/* === Remove all hidden white panels under Timmy === */
.page-id-138 .inside-article,
.page-id-138 .site-main > .grid-container,
.page-id-138 .entry-content,
#timmy-crew {
  background: transparent !important;
  box-shadow: none !important;
}

/* Ensure Timmy’s section has no padding blocking the overlap */
#timmy-crew {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  position: relative;
  overflow: visible;
}

/* Optional — extend waves higher for a perfect seam */
#timmy-crew::before {
  bottom: 75px; /* adjust up/down as needed */
}
/* Nudge wave band a touch higher */
#timmy-crew::before,
#timmy-crew::after{
  bottom: 68px;            /* try 64–72px; 68px usually nails it */
}

/* Let Timmy overlap the water a bit more */
#timmy-crew .timmy-figure img{
  margin-bottom: -42px;    /* was ~-36px; adjust -38 to -46 if needed */
}

/* Lift caption + blurb fully above the foam and improve readability */
#timmy-crew .timmy-nameplate,
#timmy-crew .timmy-blurb{
  transform: translateY(-14px);  /* move text up */
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

/* In case a background is sneaking in from the content container */
#timmy-crew,
#timmy-crew .grid-container,
#timmy-crew .inside-article,
#timmy-crew .entry-content{
  background: transparent !important;
  box-shadow: none !important;
}
/* === FINAL SMOOTH SEAM FIX: one seamless wave band === */
#timmy-crew::before {
  background: none !important; /* kill duplicate background */
}

#timmy-crew::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 260px; /* or adjust 240–280px */
  background: url('https://cruisegroupplanner.com/wp-content/uploads/2025/10/your-wave-image.jpg') 
              no-repeat center bottom / cover;
  z-index: -1;
  opacity: 1;
}

/* Optional: tidy up Timmy’s placement */
#timmy-crew .timmy-figure img {
  margin-bottom: -46px !important;
}

#timmy-crew {
  overflow: hidden;
  position: relative;
  background: transparent !important;
}


/* =====================================================
   FINAL POLISH — MENU + HERO RESTORE (v2.3 Stable)
   ===================================================== */

/* --- 1) CENTER NAVIGATION + CLEAN BUTTON GEOMETRY --- */
.main-navigation .inside-navigation{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:12px 0 !important;
}

.main-navigation .main-nav{ width:100%; }
.main-navigation .main-nav > ul{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  flex-wrap:nowrap !important;
  gap:1.1rem;
}

/* Uniform chip buttons */
.main-navigation .main-nav > ul > li > a{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:10px 16px !important;
  line-height:1 !important;
  font-size:.95rem !important;
  font-weight:700 !important;
  text-transform:uppercase;
  color:#fff !important;
  border-radius:10px;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  transition:all .25s ease-in-out;
}

/* Hover + active state */
.main-navigation .main-nav > ul > li > a:hover,
.main-navigation .main-nav > ul > li.current-menu-item > a{
  background:rgba(255,255,255,.9);
  color:var(--sky-400) !important;
  transform:translateY(-1px);
  box-shadow:0 2px 8px rgba(0,0,0,.2);
}

/* Mid-width tightening */
@media (max-width:1150px){
  .main-navigation .main-nav > ul{ gap:.8rem; }
  .main-navigation .main-nav > ul > li > a{ padding:8px 12px !important; font-size:.9rem; }
}

/* --- 2) HERO PATTERN / SEA FOAM RESTORE --- */
body.home .site-content{
  background:
    linear-gradient(
      to bottom,
      rgba(17,175,230,.65) 0%,     /* bright sea-foam top */
      rgba(11,138,206,.45) 30%,    /* mid-sky blue */
      rgba(255,220,120,.28) 70%,   /* soft gold transition */
      rgba(255,220,120,0) 100%
    ),
    url('https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Water-Tile.jpg'); /* optional texture */
  background-repeat: repeat-x;
  background-size: auto 280px;
  background-position: top center;
  background-attachment: scroll;
}

/* Optional: fade behind the captain’s wheel only */
.cc-hero, .page-hero{
  background:transparent !important;
  position:relative;
  isolation:isolate;
}


/* ===============================================
   CAPTAIN’S NAV — polished alignment + ocean blue
   =============================================== */

/* 1) Top navigation background */
.site-header {
  background-color: #3C98C8 !important;   /* sampled blue */
  border-bottom: 3px solid rgba(255,255,255,.2);
  box-shadow: 0 2px 10px rgba(0,0,0,.12);
}

/* 2) Navigation layout and alignment */
.main-navigation .inside-navigation {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 12px 0 !important;
}

.main-navigation .main-nav {
  width: 100%;
}
.main-navigation .main-nav > ul {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 1.1rem;
}

/* 3) Uniform “chip” buttons */
.main-navigation .main-nav > ul > li > a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  height: 42px;
  padding: 0 16px !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  text-transform: uppercase;
  letter-spacing: .02em;

  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 10px;
  backdrop-filter: blur(6px);
  transition: all .25s ease;
}

/* 4) Hover & active states */
.main-navigation .main-nav > ul > li > a:hover,
.main-navigation .main-nav > ul > li.current-menu-item > a,
.main-navigation .main-nav > ul > li.current-menu-ancestor > a {
  background: rgba(255,255,255,.92);
  color: #0B8ACE !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
}

/* 5) Gentle “wave shimmer” animation */
@keyframes shimmer {
  0%, 100% { background: rgba(255,255,255,.12); }
  50%      { background: rgba(255,255,255,.22); }
}
.main-navigation .main-nav > ul > li > a {
  animation: shimmer 2.5s ease-in-out infinite;
  animation-delay: calc(var(--i, 0) * 0.2s); /* slight offset between buttons */
}

/* assign subtle delay to each item for organic rhythm */
.main-navigation .main-nav > ul > li:nth-child(1) > a { --i: 1; }
.main-navigation .main-nav > ul > li:nth-child(2) > a { --i: 2; }
.main-navigation .main-nav > ul > li:nth-child(3) > a { --i: 3; }
.main-navigation .main-nav > ul > li:nth-child(4) > a { --i: 4; }
.main-navigation .main-nav > ul > li:nth-child(5) > a { --i: 5; }
.main-navigation .main-nav > ul > li:nth-child(6) > a { --i: 6; }
.main-navigation .main-nav > ul > li:nth-child(7) > a { --i: 7; }

/* 6) Responsiveness */
@media (max-width: 1150px) {
  .main-navigation .main-nav > ul { gap: .75rem; }
  .main-navigation .main-nav > ul > li > a {
    height: 38px;
    padding: 0 12px !important;
    font-size: .9rem;
  }
}

/* ——— NAV CHIP: force single line + perfect centering ——— */
.main-navigation .main-nav > ul > li > a{
  white-space: nowrap;           /* no wrapping */
  height: 42px;                  /* fixed chip height */
  line-height: 42px;             /* vertical centering by line-height */
  padding: 0 16px !important;    /* horizontal breathing room */
}

/***********************************************
 NAVIGATION — Active Gold Text on Load, White on Hover
***********************************************/
.main-navigation .main-nav ul li a {
  color: #FFB703;                 /* Gold text by default */
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  transition: all 0.25s ease;
}

/* On hover or active item — invert for contrast */
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation .main-nav ul li.current-menu-ancestor > a {
  color: #ffffff;                 /* White text */
  background-color: rgba(0,0,0,0.15); /* Optional slight highlight */
  border-radius: 6px;
}

/* Add subtle text glow for readability over sky */
.main-navigation .main-nav ul li a {
  text-shadow: 0 0 4px rgba(0,0,0,0.25);
}


/* Nudge the 3 long labels so they stay one line on most widths */
.main-navigation .main-nav > ul > li:nth-child(2) > a,  /* Meet the Captain */
.main-navigation .main-nav > ul > li:nth-child(3) > a,  /* Plan Your Cruise */
.main-navigation .main-nav > ul > li:nth-child(4) > a { /* Best Cruise Deals */
  font-size: .88rem; 
  letter-spacing: .01em;
  padding: 0 14px !important;
}

/* Tighten progressively if space gets snug */
@media (max-width: 1200px){
  .main-navigation .main-nav > ul > li > a{ font-size: .90rem; }
  .main-navigation .main-nav > ul > li:nth-child(2) > a,
  .main-navigation .main-nav > ul > li:nth-child(3) > a,
  .main-navigation .main-nav > ul > li:nth-child(4) > a{ font-size: .84rem; }
}
@media (max-width: 1050px){
  .main-navigation .main-nav > ul { gap: .6rem; }
  .main-navigation .main-nav > ul > li > a{
    height: 38px; line-height: 38px;
    padding: 0 10px !important; font-size: .86rem;
  }
}


/* === Fix section seam and background splits === */
.separate-containers .site-main,
.separate-containers .site-content,
body.page .site-content {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Smooth gradient transition continuity */
body {
  background: linear-gradient(180deg,#BCE4F6 0%,#FDF7E8 100%) !important;
  background-attachment: fixed;
}


/* Seamless page background + remove container seams */
.separate-containers .site-main,
.separate-containers .site-content {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Global page gradient (sky → cream) */
body {
  background: linear-gradient(180deg, #BCE4F6 0%, #FDF7E8 100%) !important;
  background-attachment: fixed; /* silky on desktop */
}

/* Disable fixed backgrounds on small devices to avoid jank */
@media (max-width: 900px) {
  body { background-attachment: scroll; }
}


/* Book hero panel polish */
.cc-hero.book-hero,
.wp-block-group.cc-book-hero {
  position: relative;
  margin-top: -12px !important;          /* overlap the section above slightly */
  border-radius: 18px;
  overflow: hidden;                       /* hide any inner overflow bars */
  box-shadow: 0 10px 35px rgba(0,0,0,.25);
  background: linear-gradient(
    180deg,
    #0B6FAF 0%,
    #0F8CC1 40%,
    #0CA3B2 75%,
    #069C86 100%
  ) !important;                           /* deep-water fade */
}

/* If the booking tool sits in our "frame", hide any internal overflow too */
.cc-hero.book-hero .cb-iframe__frame,
.wp-block-group.cc-book-hero .cb-iframe__frame {
  overflow: hidden !important;
}

/* If the embed injects a tiny horizontal scrollbar, nuke it at the card edge */
.cc-hero.book-hero::-webkit-scrollbar,
.wp-block-group.cc-book-hero::-webkit-scrollbar { height: 0 !important; }


/* Wave bands wrapper — add class "sea-bands" to the Group around the card */
.sea-bands {
  position: relative;
  padding: clamp(32px, 5vw, 56px) 16px;
  isolation: isolate;
}

/* Top wave */
.sea-bands::before,
.sea-bands::after {
  content: "";
  position: absolute; left: 0; right: 0;
  height: clamp(80px, 14vw, 160px);
  background-image: url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp");
  background-repeat: repeat-x;
  background-size: 1400px auto;            /* density; tweak 1200–1600px as you like */
  background-position: center;
  pointer-events: none;
  z-index: 0;
  opacity: .95;
  /* soft edge fade */
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0));
          mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0));
}

.sea-bands::before { top: -1px; }
.sea-bands::after  {
  bottom: -1px;
  transform: scaleY(-1);                   /* mirror for the bottom band */
  -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0));
          mask-image: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0));
}

/* Make sure the card sits above the waves */
.sea-bands > * { position: relative; z-index: 1; }

/*********************************************************
 CAPTAIN CRUISE BOOKER – BUTTON SHAPE STANDARDIZATION
 Soft-rectangle aesthetic (10px corners)
**********************************************************/

/* Primary nav buttons */
.main-navigation .menu-bar-item > a,
.main-navigation .main-nav ul li a {
  border-radius: 10px !important;
}

/* Hero & CTA buttons */
.wp-block-button__link,
button,
input[type="button"],
input[type="submit"] {
  border-radius: 10px !important;
  transition: all 0.25s ease;
}

/* On hover – clean lift and glow */
.wp-block-button__link:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.2);
}

/* Secondary or “outline” variants */
.wp-block-button.is-style-outline .wp-block-button__link {
  border-radius: 10px !important;
  border-width: 2px;
  box-shadow: none;
}

/* Optional: form and widget buttons match */
form button,
.widget button {
  border-radius: 10px !important;
}

/*********************************************************
 CAPTAIN'S HORIZON — FOOTER GRADIENT MATCH
 Elegant fade from golden dusk to deep ocean navy
**********************************************************/

.site-footer,
.footer-widgets {
  background: linear-gradient(
    180deg,
    #F5E3C3 0%,     /* sand reflection (beach tone) */
    #E6CFA9 8%,     /* warm coastal haze */
    #0077C8 55%,    /* ocean heart */
    #004C8C 85%,    /* twilight blue */
    #002B5C 100%    /* deep nautical midnight */
  ) !important;
  color: #ffffff !important;
  border-top: 3px solid var(--gold-500);
  padding: 60px 20px !important;
  text-align: center;
  box-shadow: inset 0 8px 18px rgba(0,0,0,0.15);
}

/* Footer links */
.site-footer a,
.footer-widgets a {
  color: #fffbea !important;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.25s ease, text-shadow 0.25s ease;
}

.site-footer a:hover,
.footer-widgets a:hover {
  color: var(--gold-500) !important;
  text-shadow: 0 0 8px rgba(255,183,3,0.6);
}

/* Footer copyright / site-info */
.site-info {
  border-top: 1px solid rgba(255,255,255,0.25) !important;
  margin-top: 25px;
  padding-top: 15px;
  font-size: 0.92rem;
  color: #e8e8e8 !important;
}



/*********************************************************
  CAPTAIN'S HORIZON — FOOTER MOONLIGHT SHIMMER
  Adds gentle reflective gleam to footer links & buttons
**********************************************************/

/* Base animation keyframes */
@keyframes moonlight-glint {
  0%   { background-position: -120% 0; }
  100% { background-position: 220% 0; }
}

/* Footer links + CTA buttons */
.site-footer a,
.footer-widgets a,
.site-footer .wp-block-button__link {
  position: relative;
  display: inline-block;
  overflow: hidden;
  transition: color .25s ease, transform .25s ease;
}

/* Shimmer overlay */
.site-footer a::after,
.footer-widgets a::after,
.site-footer .wp-block-button__link::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
      120deg,
      transparent 0%,
      rgba(255,255,255,0.45) 40%,
      rgba(255,255,255,0.05) 70%,
      transparent 100%
  );
  background-size:200% 100%;
  transform:translateX(-100%);
  opacity:0;
  pointer-events:none;
}

/* Hover interaction */
.site-footer a:hover,
.footer-widgets a:hover,
.site-footer .wp-block-button__link:hover {
  color:var(--gold-500) !important;
  transform:translateY(-1px);
}

.site-footer a:hover::after,
.footer-widgets a:hover::after,
.site-footer .wp-block-button__link:hover::after {
  opacity:.9;
  animation:moonlight-glint 1.8s linear forwards;
}

/* Optional: refine footer buttons for cohesion */
.site-footer .wp-block-button__link {
  border-radius:10px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.25);
  backdrop-filter:blur(4px);
  color:#fff;
  font-weight:600;
  padding:10px 22px;
}

/*********************************************************
  CAPTAIN'S HORIZON — FOOTER RADIUS SMOOTHING
  Softens footer top edge for a continuous flow
**********************************************************/

.site-footer,
.footer-widgets {
  border-top-left-radius: 22px !important;
  border-top-right-radius: 22px !important;
  overflow: hidden;
}

/* Optional: smooth the transition edge where the footer meets the page */


.site-footer::before {
  content: "";
  position: absolute;
  top: -22px;
  left: 0;
  width: 100%;
  height: 22px;
  background: linear-gradient(to bottom, rgba(0,0,0,0.08), transparent);
  border-top-left-radius: 22px;
  border-top-right-radius: 22px;
  pointer-events: none;
}


/*********************************************************
 CAPTAIN'S HORIZON — INNER FOOTER CURVATURE & COLOR SYNC
**********************************************************/

/* Smooth inner footer box (the darker blue band) */
.footer-widgets .inside-footer-widgets,
.site-footer .footer-bar,
.site-footer .inside-site-info {
  background: linear-gradient(
    180deg,
    #005A9E 0%,   /* bright mid-blue top */
    #004C8C 45%,  /* rich nautical core */
    #003366 100%  /* deep ocean base */
  );
  border-top-left-radius: 22px !important;
  border-top-right-radius: 22px !important;
  padding: 30px 20px;
  box-shadow: inset 0 10px 25px rgba(0, 0, 0, 0.25);
}

/* Tighten footer edges to remove white gap above */
.footer-widgets {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: none !important;
}

/* Ensure footer logo and text breathe evenly inside */
.site-footer .site-info {
  padding-top: 20px !important;
  padding-bottom: 10px !important;
  margin: 0 auto;
  text-align: center;
  max-width: 1200px;
}

/*********************************************************
  CAPTAIN'S HORIZON — COMPLETE FOOTER CURVATURE (vFinal)
  Smooths both outer and inner footer layers.
**********************************************************/

/* Outer footer container */
.site-footer,
.footer-widgets {
  background: linear-gradient(180deg, #004E92 0%, #003366 100%) !important;
  border-top-left-radius: 28px !important;
  border-top-right-radius: 28px !important;
  overflow: hidden !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  border: none !important;
  position: relative;
  box-shadow: 0 -6px 25px rgba(0, 0, 0, 0.25) inset;
}

/* Inner blue panel inside footer */
.footer-widgets .inside-footer-widgets,
.site-footer .footer-bar,
.site-footer .inside-site-info {
  background: linear-gradient(180deg, #005A9E 0%, #004C8C 60%, #003366 100%);
  border-radius: 22px !important;
  margin: 24px auto !important;
  padding: 30px 24px !important;
  max-width: 1200px;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.25) inset;
}

/* Shadow fade between footer and the sand section above */
.site-footer::before {
  content: "";
  position: absolute;
  top: -22px;
  left: 0;
  width: 100%;
  height: 28px;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.15),
    rgba(0, 0, 0, 0.05),
    transparent
  );
  border-top-left-radius: 28px;
  border-top-right-radius: 28px;
  pointer-events: none;
}


/*********************************************************
  CAPTAIN'S HORIZON — SEAMLESS FOOTER MERGE (v5 Hull Lock)
**********************************************************/

/* Force the bottom layer to share the same curvature and gradient */
.site-footer,
.footer-widgets,
.site-info,
.footer-bar {
  background: linear-gradient(180deg, #004E92 0%, #003366 100%) !important;
  border-top-left-radius: 28px !important;
  border-top-right-radius: 28px !important;
  overflow: hidden !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Inner darker inset footer box (logo + text area) */
.footer-widgets .inside-footer-widgets,
.site-footer .footer-bar,
.site-footer .inside-site-info {
  background: linear-gradient(180deg, #005A9E 0%, #004C8C 60%, #003366 100%);
  border-radius: 22px !important;
  box-shadow: inset 0 8px 20px rgba(0, 0, 0, 0.25);
  margin: 24px auto !important;
  padding: 28px 24px 34px !important;
  max-width: 1200px;
  position: relative;
}

/* Remove that leftover darker band at the very bottom */
.footer-widgets + .site-info {
  display: none !important;
}

/* Optional: add a subtle depth shadow fade under footer */
body::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 40px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), transparent);
  pointer-events: none;
}

/*********************************************************
  CAPTAIN'S HORIZON — FOOTER CENTERING ALIGNMENT
**********************************************************/

/* Center all footer contents perfectly */
.site-footer .footer-widgets,
.site-footer .inside-footer-widgets,
.site-footer .footer-bar,
.site-footer .inside-site-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center !important;
}

/* Tidy up spacing between text and logo */
.site-footer .site-info {
  margin: 0 auto !important;
  padding: 10px 0 20px !important;
  text-align: center !important;
}

/* Optional: center logo and give it subtle breathing room */
.site-footer img {
  display: block;
  margin: 15px auto 10px !important;
  max-width: 140px;
}


/*********************************************************
  CAPTAIN'S HORIZON — SMOOTH HERO/SAND SEAM BLEND
**********************************************************/

/* Remove the hard edge between sections */
.main-navigation,
.site-header,
.page-hero,
.hero-section,
.site-content {
  box-shadow: none !important;
  border: none !important;
}

/* Smooth gradient from sky to sand */
.site-content {
  background: linear-gradient(to bottom,
    #c8e8f8 0%,
    #e9f4e9 30%,
    #f5eddc 100%) !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Optional: hide any thin pseudo-element shadows WordPress might inject */
body::before,
body::after,
.site-content::before,
.site-content::after {
  box-shadow: none !important;
  background: none !important;
}


/* add a subtle mist on the top/bottom of the wave strip */
.waves-band::before,
.waves-band::after{
  content:"";
  position:absolute; left:0; right:0;
  height:48px; pointer-events:none;
  z-index:1;
}
.waves-band::before{ /* top fade */
  top:-1px;
  background:linear-gradient(to bottom, rgba(255,255,255,.65), rgba(255,255,255,0));
  filter:blur(0.3px);
}
.waves-band::after{ /* bottom fade */
  bottom:-1px;
  background:linear-gradient(to top, rgba(0,0,0,.08), rgba(0,0,0,0));
  filter:blur(0.3px);
}
.waves-band{ position:relative; overflow:hidden; }


/* micro parallax drift for the wave texture */
@keyframes cgpWaveDrift {
  0%   { background-position: 50% 0; }
  100% { background-position: 49% 6px; }
}
.waves-band{
  background-attachment: fixed;          /* subtle depth */
  animation: cgpWaveDrift 18s ease-in-out infinite alternate;
}

/*********************************************************
  CAPTAIN'S HORIZON — OCEAN BLEND FOR .page-hero
**********************************************************/

/* Create a soft horizon fade (above and below waves) */
.page-hero {
  position: relative;
  overflow: hidden;
}

/* Fix "Just 3 Simple Steps" number alignment in the hero */
.page-hero ol,
.cb-steps ol{
  list-style: decimal inside !important;  /* keep number with the text */
  margin: 0 !important;
  padding-left: 0 !important;            /* remove theme padding that causes gaps */
}

/* Tidy the list item spacing */
.page-hero ol li,
.cb-steps ol li{
  display: block;
  line-height: 1.55;
  padding-left: .15em;                   /* tiny nudge for breathing room */
  text-indent: 0 !important;
}

/* (Optional) Make markers pop a little, keep on-brand */
.page-hero ol li::marker,
.cb-steps ol li::marker{
  font-weight: 800;
  color: var(--gold-500);
}


/* ============================================
   CRUISE GROUP PLANNER — NAV COLOR FIX
   ============================================ */

.main-navigation .main-nav ul li a {
  background-color: var(--blue-700);  /* matches top bar */
  color: #ffffff;                     /* clean white text */
  border-radius: 6px;                 /* keep slight roundness */
  transition: all 0.25s ease-in-out;
}

/* hover / active state */
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item > a {
  background-color: #ffffff;          /* turns white on hover */
  color: var(--blue-800);             /* contrast text */
  box-shadow: 0 3px 8px rgba(0,0,0,0.1);
}

/* optional: tone down text shadow if theme adds it */
.main-navigation .main-nav ul li a {
  text-shadow: none !important;
}

/* ============================================
   CRUISE GROUP PLANNER — NAV COLOR + GOLD HOVER
   ============================================ */

.main-navigation .main-nav ul li a {
  background-color: var(--blue-700);     /* matches top bar */
  color: #ffffff;                        /* crisp white text */
  border-radius: 6px;
  padding: 8px 16px;
  font-weight: 600;
  transition: all 0.25s ease-in-out;
  border: 2px solid transparent;         /* prepares for gold hover border */
}

/* Hover + Active states */
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item > a {
  background-color: #ffffff;             /* white on hover */
  color: var(--blue-800);                /* blue text for contrast */
  border-color: var(--gold-500);         /* glowing gold border */
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.12);
  transform: translateY(-1px);           /* slight lift on hover */
}

/* Optional: add subtle transition when returning to default */
.main-navigation .main-nav ul li a:active {
  transform: translateY(0);
}

/* Keep things tidy if your theme injects unwanted text-shadow */
.main-navigation .main-nav ul li a {
  text-shadow: none !important;
}


/* --- Mobile horizontal scroll lock (safe site-wide) --- */
html, body {
  max-width: 100%;
  overflow-x: hidden !important;
}

/* Make sure the theme’s outer wrappers don’t spill */


/* Any full-bleed/100vw sections should never exceed viewport */
[class*="hero"],
[class*="full"],
[class*="wrap"],
[class*="container"] {
  max-width: 100vw;
}

/* Media that can push width on small screens */
img, video, svg, canvas, iframe, embed, object {
  max-width: 100%;
  height: auto;
  display: block;          /* prevents inline gaps causing overflow */
}

/* Booking widget & other embeds (just in case) */
.cb-iframe__frame,
.cb-iframe__frame iframe {
  max-width: 100% !important;
  width: 100% !important;
  overflow: hidden;
}

/* Background images: avoid mobile overflow from fixed parallax */
@media (max-width: 1024px){
  .page-hero,
  .cc-hero,
  .hero,
  .page-hero,
  .inside-page-hero {
    background-attachment: scroll !important;
  }
}

/* Guard against negative margins/transforms causing edge bleed */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Buttons/badges that might have box-shadows past the edge */
.btn, .button, .wp-block-button__link,
.main-navigation .main-nav > ul {
  overflow: visible; /* keeps glow visible while wrappers are clipped */
}

/* iOS momentum scroll quirks */
html {
  -webkit-text-size-adjust: 100%;
}

/* ---- Mobile nav: wrap buttons + tighten spacing (prevents sideways scroll) ---- */
@media (max-width: 780px){
  /* Keep the container inside the viewport */
  .site-header,
  .main-navigation,
  .main-navigation .inside-navigation{
    max-width: 100%;
    overflow-x: hidden;
    padding-inline: 12px !important; /* trims wide padding that can cause overflow */
  }

  /* Let the menu wrap to multiple rows */
  .main-navigation .main-nav > ul{
    display: flex !important;
    flex-wrap: wrap !important;     /* <-- key: allow wrapping */
    justify-content: center !important;
    align-items: center !important;
    gap: .5rem .75rem;               /* vertical / horizontal gap */
    width: 100%;
  }

  /* Undo any nowrap that forces a single line on desktop */
  .main-navigation .main-nav > ul > li{
    white-space: normal !important;
  }

  /* Slightly smaller/tighter pills on phones so they fit comfortably */
  .main-navigation .main-nav > ul > li > a{
    padding: 7px 12px !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    border-radius: 10px;             /* keep your rounded feel */
  }
}

/* If you want this behavior on small tablets too, bump the breakpoint: 900px or 1024px */

/* 1) Global hard-clamp: never allow horizontal scrolling on mobile */
html, body {
  max-width: 100%;
  overflow-x: hidden !important;
  position: relative;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;                 /* prefer vertical scrolling */
  overscroll-behavior-x: none;
}

/* If any site wrappers exist, clamp them too */


/* Safety: images/icons can never exceed viewport */
img, svg, video, canvas {
  max-width: 100%;
  height: auto;
}

/* 2) Mobile nav: wrap pills, remove nowrap, trim spacing */
@media (max-width: 780px){
  .main-navigation,
  .main-navigation .inside-navigation{
    max-width: 100%;
    overflow-x: hidden;                /* local clamp */
    padding-inline: 12px !important;
  }

  .main-navigation .main-nav {
    width: 100%;
  }

  .main-navigation .main-nav > ul{
    display: flex !important;
    flex-wrap: wrap !important;        /* <-- allow wrapping */
    justify-content: center !important;
    align-items: center !important;
    gap: .5rem .75rem;                 /* row/column gap */
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
  }

  .main-navigation .main-nav > ul > li{
    white-space: normal !important;    /* undo desktop nowrap */
    flex: 0 1 auto;                    /* allow items to shrink */
  }

  .main-navigation .main-nav > ul > li > a{
    padding: 7px 12px !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    border-radius: 10px;               /* keep your feel */
  }
}

/* 3) Guard against super-wide shadows/translated elements */
.cc-hero, .hero, .page-hero {
  contain: layout paint;               /* prevent children from affecting page width */
}

/* 4) Rare but helpful: remove accidental 100vw gutters */
[style*="width: 100vw"] {
  width: 100% !important;
}


/***** GP MOBILE HAMBURGER: FORCE ON + VISIBLE @1024px *****/
@media (max-width:1024px){
  /* Show the toggle button */
  .main-navigation .menu-toggle{
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:46px; height:46px;
    margin-left:auto;
    border:2px solid var(--gold-500);
    border-radius:50%;
    background: var(--blue-900);
    color:#fff; /* controls icon color via currentColor */
    cursor:pointer;
    transition:all .25s ease;
  }
  /* Hide menu until toggled */
  .main-navigation .main-nav > ul{ display:none !important; }
  .main-navigation.toggled .main-nav > ul{
    display:flex !important;
    flex-direction:column;
    width:100%;
    background: var(--blue-900);
    padding:1rem 0;
  }
  .main-navigation.toggled .main-nav > ul > li > a{
    color:#fff; text-align:center; padding:.9rem;
    border-bottom:1px solid rgba(255,255,255,.1);
  }
  .main-navigation.toggled .main-nav > ul > li > a:hover{
    background: var(--gold-500); color: var(--blue-900);
  }
}

/* Make sure the SVG icon actually shows (some installs use fill, others stroke) */
.menu-toggle .gp-icon svg path,
.menu-toggle .gp-icon svg rect,
.menu-toggle .gp-icon svg line{
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* Keep nav above hero imagery / overlays */
.main-navigation,
.site-header { position:relative; z-index:1000; }

/***** HAMBURGER VISIBILITY + DROPDOWN CONTRAST (Above Header) *****/
@media (max-width:1024px){
  /* Toggle button (label + icon) */
  .navigation-above-header .menu-toggle{
    display:flex !important; align-items:center; justify-content:center;
    margin-left:auto;            /* push to the right */
    padding:.45rem .9rem;
    color:#fff;                  /* readable label */
    background: var(--blue-900);
    border:2px solid var(--gold-500);
    border-radius: 9999px;       /* pill */
    font-weight:600;
    box-shadow:0 6px 18px rgba(0,0,0,.15);
    transition:background .2s ease, color .2s ease, box-shadow .2s ease;
  }
  .navigation-above-header .menu-toggle:hover{
    background: var(--gold-500);
    color: var(--blue-900);
    box-shadow:0 8px 24px rgba(0,0,0,.22);
  }
  /* ensure the hamburger icon adopts the text color */
  .menu-toggle .gp-icon svg *{ fill:currentColor !important; stroke:currentColor !important; }

  /* Hide menu until opened */
  .navigation-above-header .main-nav > ul{ display:none !important; }

  /* Dropdown panel */
  .navigation-above-header.toggled .main-nav > ul{
    display:flex !important; flex-direction:column;
    width:100%;
    background: rgba(0,34,77,.94);          /* deep navy w/ slight translucency */
    border:1px solid rgba(255,255,255,.08);
    border-radius:12px;
    padding:.35rem;
    margin-top:.6rem;
    box-shadow:0 14px 32px rgba(0,0,0,.25);
    backdrop-filter: saturate(120%) blur(6px);
  }

  /* Menu items */
  .navigation-above-header.toggled .main-nav > ul > li > a{
    color:#fff;
    background: transparent;
    text-align:left;
    padding:.8rem 1rem;
    border-radius:10px;
    border:0;
  }
  .navigation-above-header.toggled .main-nav > ul > li > a:hover,
  .navigation-above-header.toggled .main-nav > ul > li.current-menu-item > a{
    background: var(--gold-500);
    color: var(--blue-900);
  }

  /* Keep nav above hero imagery */
  .site-header, .main-navigation.navigation-above-header{ position:relative; z-index:1000; }

  /* Accessibility focus ring */
  .navigation-above-header .menu-toggle:focus,
  .navigation-above-header.toggled .main-nav a:focus{
    outline:2px solid var(--gold-500); outline-offset:2px;
  }
}

/*********************************************************
  MOBILE MENU BUTTON FIX  (using .mobile-menu span)
**********************************************************/
@media (max-width: 1024px){
  /* Style the Menu toggle */
  .menu-toggle {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .4rem .9rem;
    background: var(--blue-900);
    border: 2px solid var(--gold-500);
    border-radius: 9999px;
    color: #fff;             /* controls both icon + text */
    font-weight: 600;
    box-shadow: 0 6px 18px rgba(0,0,0,.15);
    cursor: pointer;
    transition: background .25s ease, color .25s ease, box-shadow .25s ease;
  }

  /* Text label inside */
  .menu-toggle .mobile-menu {
    color: #fff !important;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .02em;
  }

  /* Icon color (bars) */
  .menu-toggle .gp-icon svg * {
    fill: currentColor !important;
    stroke: currentColor !important;
  }

  /* Hover effect */
  .menu-toggle:hover {
    background: var(--gold-500);
    color: var(--blue-900);
    box-shadow: 0 8px 24px rgba(0,0,0,.25);
  }

  /* Open dropdown styling */
  .main-navigation.toggled .main-nav > ul {
    display: flex !important;
    flex-direction: column;
    background: rgba(0,34,77,.94);
    border-radius: 12px;
    padding: .5rem;
    width: 100%;
    margin-top: .6rem;
    box-shadow: 0 14px 32px rgba(0,0,0,.25);
    backdrop-filter: saturate(120%) blur(6px);
  }

  .main-navigation.toggled .main-nav > ul > li > a {
    color: #fff;
    padding: .8rem 1rem;
    border-radius: 8px;
    text-align: left;
  }

  .main-navigation.toggled .main-nav > ul > li > a:hover {
    background: var(--gold-500);
    color: var(--blue-900);
  }

  /* Keep nav above hero */
  .site-header, .main-navigation { position: relative; z-index: 1000; }
}

/* Tidy up the Menu button size */
@media (max-width:1024px){
  .menu-toggle{
    padding: .35rem .75rem;   /* slightly smaller */
    font-size: .9rem;          /* trims text nicely */
    line-height: 1.2;
  }
  .menu-toggle .mobile-menu{
    font-size: .9rem;
  }
}
/* Hide the "Menu" text label, keep hamburger icon visible */
@media (max-width:1024px){
  .menu-toggle .mobile-menu{
    display:none !important;   /* hides the word "Menu" */
  }

  /* make sure the icon centers itself perfectly */
  .menu-toggle{
    width:46px; height:46px;
    padding:0;
    display:flex !important;
    align-items:center; justify-content:center;
    border-radius:50%;
    background:var(--blue-900);
    border:2px solid var(--gold-500);
    color:#fff;
    cursor:pointer;
    transition:background .25s ease, color .25s ease, box-shadow .25s ease;
  }

  .menu-toggle:hover{
    background:var(--gold-500);
    color:var(--blue-900);
    box-shadow:0 0 12px rgba(0,0,0,.25);
  }

  /* ensure the SVG bars adopt current color */
  .menu-toggle .gp-icon svg *{
    fill:currentColor !important;
    stroke:currentColor !important;
  }
}

/* Animate hamburger into an "X" when toggled */
.menu-toggle .gp-icon svg{
  transition:transform .35s ease;
}
.toggled .menu-toggle .gp-icon svg{
  transform:rotate(90deg);
}

/*********************************************************
  CAPTAIN’S NAVY HAMBURGER — bold, visible, refined
**********************************************************/
@media (max-width:1024px){

  /* Button background + outline */
  .menu-toggle {
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    background:rgba(255,255,255,0.55); /* soft frosted look */
    border:2px solid var(--gold-500);  /* subtle gold outline */
    border-radius:50%;
    cursor:pointer;
    box-shadow:0 4px 12px rgba(0,0,0,0.1);
    transition:background .25s ease, transform .25s ease;
  }

  /* Hover effect */
  .menu-toggle:hover {
    background:rgba(255,255,255,0.8);
    transform:scale(1.05);
  }

  /* Hamburger bars */
  .menu-toggle .gp-icon svg {
    width:22px; height:22px;
  }
  .menu-toggle .gp-icon svg * {
    fill:none !important;
    stroke: var(--blue-900) !important;   /* dark navy lines */
    stroke-width:3;                      /* thicken the bars */
    stroke-linecap:round;
    transition: stroke .25s ease;
  }

  /* On hover — gold accent lines */
  .menu-toggle:hover .gp-icon svg * {
    stroke: var(--gold-500) !important;
  }

  /* Hide text label */
  .menu-toggle .mobile-menu {
    display:none !important;
  }
}

/* -------------------------------------------
   Captain's Wheel Depth Shadow
------------------------------------------- */
.captain-wheel img {
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.25));
}

/* If your image is inside a block or hero container, this works too: */
.hero-area img,
.hero-container img {
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.25));
}


/* Captain's wheel subtle depth */
.cc-head img.cc-composite{
  filter: drop-shadow(0 14px 22px rgba(0,0,0,.22));
}

/* ensure the shadow isn't clipped by a parent */
.cc-head, .cc-wrap, .cc-hero { overflow: visible; }

/* Slightly softer on small screens */
@media (max-width: 768px){
  .cc-head img.cc-composite{
    filter: drop-shadow(0 12px 18px rgba(0,0,0,.18));
  }
}

footer-grid
/* ==========================
   FOOTER GRID LAYOUT
   ========================== */
.footer-grid {
  background: linear-gradient(to bottom, var(--blue-900), var(--blue-800));
  color: #fff;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  padding: 60px 8%;
  text-align: left;
  align-items: start;
}

/* Column content */
.footer-grid p,
.footer-grid a,
.footer-grid li {
  color: #f0f0f0;
  font-size: 16px;
  line-height: 1.6;
}

.footer-grid a:hover {
  color: var(--gold-500);
  text-decoration: underline;
}

/* Headings like “Explore” or “Contact” */
.footer-grid h2,
.footer-grid h3 {
  color: var(--gold-500);
  font-size: 18px;
  margin-bottom: 0.8rem;
}

/* Align the social buttons horizontally */
.footer-grid .wp-block-buttons {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}

/* Buttons styling */
.footer-grid .wp-block-button__link {
  background-color: var(--blue-600);
  color: #fff;
  border-radius: 6px;
  padding: 8px 14px;
  font-weight: 600;
  transition: all 0.3s ease;
}

.footer-grid .wp-block-button__link:hover {
  background-color: var(--gold-500);
  color: #000;
}

/* Mobile layout */
@media (max-width: 768px) {
  .footer-grid {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .footer-grid .wp-block-buttons {
    justify-content: center;
  }
}

/************ Footer layout + centering ************/
.footer-wrap{
  background: linear-gradient(180deg, var(--blue-900,#0a3a74) 0%, #051f46 100%);
  color:#fff;
  padding:48px 0;                 /* vertical padding for the whole footer */
}

.footer-grid{
  max-width:1140px;               /* centers the content */
  margin:0 auto;                  /* <- THIS centers it */
  padding:0 24px;                 /* side breathing room */
  display:grid;
  grid-template-columns: 1.2fr .

/* Footer layout & centering */
.footer-grid{
  background: linear-gradient(to bottom, var(--blue-900,#003366), var(--blue-800,#094b82));
  color:#fff;
  padding:48px 0;                    /* vertical breathing room */
}
.footer-grid__inner{
  max-width: 1120px;                 /* center the content */
  margin: 0 auto;
  padding: 0 16px;                    /* side gutters */
  display: grid;
  grid-template-columns: 1.2fr .9fr .9fr;
  gap: 28px;
}

/* Typography & links */
.footer-grid p, .footer-grid li, .footer-grid a{ font-size:16px; line-height:1.6; color:#f3f6fb; }
.footer-grid a:hover{ color: var(--gold-500,#ffb703); text-decoration: underline; }
.footer-grid h3, .footer-grid h4{ margin:.2rem 0 .6rem; color: var(--gold-500,#ffb703); }

/* Social buttons row (if you used Buttons) */
.footer-grid .wp-block-buttons{ display:flex; gap:10px; margin-top:10px; }

/* Mobile stack */
@media (max-width: 768px){
  .footer-grid__inner{ grid-template-columns: 1fr; gap:18px; text-align:center; }
  .footer-grid .wp-block-buttons{ justify-content:center; }
}

	/* =========================================
   CRUISE GROUP PLANNER — FOOTER (STABLE)
   ========================================= */
.cgp-footer {
  background: linear-gradient(180deg, var(--blue-900, #003366) 0%, var(--blue-800, #005a9e) 100%);
  color: #fff;
  padding: 60px 0;
  font-size: 16px;
}

.cgp-footer__inner {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1.2fr 0.9fr 0.9fr;
  gap: 2rem;
  align-items: start;
}

/* Columns */
.cgp-col h4 {
  color: var(--gold-500, #ffb703);
  font-size: 18px;
  margin-bottom: 0.6rem;
}
.cgp-col p,
.cgp-col li,
.cgp-col a {
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.6;
}
.cgp-col a:hover {
  color: var(--gold-500, #ffb703);
  text-decoration: underline;
}

/* Social buttons row (YouTube, Facebook) */
.cgp-footer .wp-block-buttons {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}
.cgp-footer .wp-block-button__link {
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  border-radius: 6px;
  padding: 8px 14px;
  font-weight: 600;
  transition: all 0.3s ease;
}
.cgp-footer .wp-block-button__link:hover {
  background-color: var(--gold-500, #ffb703);
  color: #001b3d;
}

/* Responsive */
@media (max-width: 768px) {
  .cgp-footer__inner {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .cgp-footer .wp-block-buttons {
    justify-content: center;
  }
}
	
	/*********************************************************
 CRUISE GROUP PLANNER — NAVIGATION DROPDOWN STYLING
**********************************************************/

/* Dropdown background panel */
.main-navigation ul ul {
  background: linear-gradient(180deg, var(--blue-700, #004C8C) 0%, var(--blue-500, #0077C8) 100%);
  border-radius: 0 0 8px 8px;
  box-shadow: 0 8px 16px rgba(0,0,0,0.25);
  padding: 8px 0;
}

/* Dropdown menu links */
.main-navigation ul ul li a {
  color: var(--white, #fff);
  padding: 10px 18px;
  font-size: 15px;
  line-height: 1.3;
  transition: all 0.25s ease-in-out;
}

/* Hover + focus effect */
.main-navigation ul ul li a:hover,
.main-navigation ul ul li.sfHover > a {
  background-color: rgba(255, 183, 3, 0.15); /* soft gold glow */
  color: var(--gold-500, #FFB703);
  transform: translateX(3px);
}

/* Divider lines between items */
.main-navigation ul ul li:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Dropdown arrow indicator (optional tweak) */
.main-navigation ul li.menu-item-has-children > a::after {
  border-top-color: var(--gold-500, #FFB703);
}

.crew-member {
  display: flex;
  align-items: center;
  gap: 2rem;
  margin: 3rem 0;
  flex-wrap: wrap;
}
.crew-member img {
  width: 230px;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.crew-info h2 {
  font-size: 1.6rem;
  color: var(--blue-500);
  margin-bottom: 0.2rem;
}
.crew-info .tagline {
  color: var(--gold-500);
  font-style: italic;
  margin-bottom: 0.8rem;
}
.crew-info .bio {
  color: #ffffff;
  max-width: 600px;
  line-height: 1.6;
}
@media(max-width:768px){
  .crew-member{
    flex-direction: column;
    text-align:center;
  }
  .crew-info .bio{
    max-width:100%;
  }
}

	/****************************************************
  FOOTER BAR — Centered Logo + Builder Credit
****************************************************/
#footer-widgets {
  background: linear-gradient(180deg, #004C8C, #003366);
  text-align: center;
  padding: 40px 0;        /* 40px top + bottom space */
}

#footer-widgets img {
  width: 90px;
  height: auto;
  display: block;
  margin: 0 auto 8px auto;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4));
}

.footer-logo-credit {
  color: #ffffff;
  font-size: 0.9rem;
  opacity: 0.9;
  margin: 0;
}

.footer-logo-credit strong {
  color: #FFB703;
}

.site-info {
  margin-top: 0; /* Removes double footer gap */
}
/********  Desktop dropdown styled like mobile hamburger  ********/

/* Panel container (the dark rounded box) */
.main-navigation .sub-menu {
  background: #0b2a45;                /* same dark navy as mobile */
  border-radius: 16px;
  padding: 14px;
  box-shadow: 0 14px 30px rgba(0,0,0,.35);
  min-width: 280px;                    /* roomy like the slideout */
  transform: translateY(10px);
  opacity: 0;
  pointer-events: none;
  transition: all .22s ease;
}

/* Show on hover/click */
.main-navigation li:hover > .sub-menu,
.main-navigation li.sfHover > .sub-menu,
.main-navigation li:focus-within > .sub-menu {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

/* Align panel under the parent item */
.main-navigation .main-nav ul li {
  position: relative;
}
.main-navigation .main-nav ul li .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;                            /* use right:0; to right-align */
  z-index: 999;
}

/* Each link styled as a pill button */
.main-navigation .sub-menu a {
  display: block;
  background: rgba(255,255,255,.06);
  color: #eaf6ff;
  padding: 10px 14px;
  margin: 6px 0;
  border-radius: 10px;
  text-decoration: none;
  line-height: 1.3;
  transition: background .2s ease, transform .2s ease, color .2s ease;
}

/* Hover/active states like mobile */
.main-navigation .sub-menu a:hover,
.main-navigation .sub-menu li.current-menu-item > a {
  background: rgba(255,183,3,.18);      /* soft gold glow */
  color: #FFB703;                        /* brand gold */
  transform: translateX(4px);
}

/* Small divider feel (optional) */
.main-navigation .sub-menu li + li {
  border-top: 1px solid rgba(255,255,255,.06);
  margin-top: 6px;
  padding-top: 6px;
}

/* Caret color to match brand */
.main-navigation li.menu-item-has-children > a:after {
  border-top-color: #FFB703;
}

/* Reduce default GP spacing so the panel hugs the bar nicely */
.main-navigation .main-nav ul ul {
  margin-top: 8px;
}
	
	/* Turn default footer band into ocean water layer */
.site-info {
  background: url('https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Water-Tile.webp') repeat-x center bottom;
  background-size: cover;
  height: 180px;
  margin: 0;
  padding: 0;
  border: none;
}
.inside-site-info {
  display: none; /* Keeps it empty */
}

/*********************************************************
  CLEAN FOOTER STRUCTURE — CRUISE GROUP PLANNER
  (Removes GP default footer bar and fixes spacing)
**********************************************************/

/* Remove the default GeneratePress footer info bar */
.site-info,
.inside-site-info {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* Ensure no gap remains where that bar used to be */
.site-footer {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Maintain clean transition from booking box to footer */
body .cgp-footer {
  margin-top: 0 !important;
  padding-top: 40px !important;
  border-top: none !important;
}

/* General polish — unify footer gradient */
.cgp-footer {
  background: linear-gradient(to bottom, #033a75 0%, #02295c 100%);
  color: var(--white);
}
	
	/* Round the big gradient band and clip its contents */
.home .gradient-band {
  border-radius: 28px;
  overflow: hidden;           /* the rounded mask “clips” the gradient again */
  border: none !important;
  box-shadow: none !important;
}

/* Let the card's shadow breathe without clipping */
.home .gradient-band .book-panel {
  overflow: visible !important;
  margin-bottom: 0 !important;   /* spacing handled by the section, not the card */
}

/* Let the last section above the footer show shadows and breathe */
.home .site-main > .wp-block-group:last-of-type,
.home .site-main > .gb-container:last-of-type,
.home .site-main > .generateblocks-container:last-of-type {
  overflow: visible !important;       /* prevents the shadow from getting cut */
  padding-bottom: 64px !important;    /* space for the fade of the shadow */
}

/* If your card has margin-bottom, zero it so the section controls spacing */
.home .booking-card,
.home .book-panel {
  margin-bottom: 0 !important;
}
.home .booking-card,
.home .book-panel {
  box-shadow: 0 28px 60px rgba(0,0,0,.18), 0 10px 24px rgba(0,0,0,.10) !important;
}
/* Round the big gradient band and clip its contents */
.home .gradient-band {
  border-radius: 28px;
  overflow: hidden;           /* the rounded mask “clips” the gradient again */
  border: none !important;
  box-shadow: none !important;
}

/* Let the card's shadow breathe without clipping */
.home .gradient-band .book-panel {
  overflow: visible !important;
  margin-bottom: 0 !important;   /* spacing handled by the section, not the card */
}
/* Remove GP section separators that create the thin dark line */
.separate-containers .site-main > * {
  border-top: 0 !important;
  box-shadow: none !important;
}

/* If the next section after the band still shows a line, target it too */
.separate-containers .site-main > .wp-block-group,
.separate-containers .site-main > .gb-container {
  border: 0 !important;
  box-shadow: none !important;
}
/******** Tidy band + softer card shadow ********/

/* 1) Square corners on the big gradient band
      and allow shadows to breathe */
.home .gradient-band {
  border-radius: 0 !important;      /* no rounded corners */
  overflow: visible !important;      /* don't clip the card shadow */
  border: none !important;
  box-shadow: none !important;
}

/* 2) Give the band some room below for the fade */
.home .gradient-band {
  padding-bottom: 56px !important;   /* adjust to taste: 40–64px */
}

/* 3) Soften the card shadow a bit */
.home .gradient-band .book-panel {
  margin-bottom: 0 !important;
  overflow: visible !important;
  box-shadow:
    0 18px 40px rgba(0,0,0,.16),     /* primary, softer */
    0 6px 18px rgba(0,0,0,.10) !important;  /* secondary feather */
}

/* Optional: slightly reduce the card's background contrast */
.home .gradient-band .book-panel {
  /* remove if you don't need this */
  /* background: rgba(255,255,255,0.04); */
}

	/* =========================================
   CREW PAGE — White Glass Background Card
========================================= */

.crew-glass-card {
  background: rgba(255, 255, 255, 0.28); /* frosted white look */
  backdrop-filter: blur(16px) saturate(160%);
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  border-radius: 24px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0, 0, 0, 0.10);
  padding: 60px 40px;
  margin: 40px auto;
  max-width: 1200px;
  border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Slight inner glow to give glass depth */
.crew-glass-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,0.3), rgba(255,255,255,0.05));
  pointer-events: none;
}

/* Ensure avatars stay centered and layered */
.crew-glass-card img {
  z-index: 2;
  position: relative;
}

/* Optional: soft fade-in animation */
.crew-glass-card {
  animation: glassFadeIn 0.8s ease forwards;
}

@keyframes glassFadeIn {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

	/* Make the glass style apply whether the class is on the block
   or its inner wrapper (GP/GenerateBlocks/Gutenberg) */
.crew-glass-text,
.crew-glass-text > .wp-block-group__inner-container,
.crew-glass-text > .gb-inside-container {
  background: rgba(255, 255, 255, 0.32);
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
  padding: 50px 40px;
  max-width: 1100px;
  margin: 60px auto 40px;
  position: relative;
  z-index: 2;
  color: #002b5c;
}

.crew-glass-text::before,
.crew-glass-text > .wp-block-group__inner-container::before,
.crew-glass-text > .gb-inside-container::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.25),
    rgba(255, 255, 255, 0.05)
  );
  pointer-events: none;
}

	/* ===== Glass cards: subtle sunlight shimmer ===== */
.crew-glass {
  position: relative;
  overflow: hidden; /* keep the shimmer clipped to the rounded card */
}

.crew-glass::after {
  content: "";
  position: absolute;
  top: -150%;
  left: -120%;
  width: 60%;
  height: 400%;
  pointer-events: none;
  /* narrow highlight streak */
  background: linear-gradient(120deg, rgba(255,255,255,0) 0%,
                                       rgba(255,255,255,0.25) 50%,
                                       rgba(255,255,255,0) 100%);
  transform: rotate(25deg) translateX(-100%);
  animation: cgpShimmer 10s ease-in-out infinite;
  opacity: .55; /* subtle */
}
@keyframes cgpShimmer {
  0%   { transform: rotate(25deg) translateX(-120%); }
  50%  { transform: rotate(25deg) translateX(140%); }
  100% { transform: rotate(25deg) translateX(140%); }
}

/* ===== Fade-in on load (no JS) ===== */
.reveal {
  opacity: 0;
  transform: translateY(12px);
  animation: cgpFadeUp .8s ease forwards;
  animation-delay: .15s; /* base, can be overridden with delay classes */
}
@keyframes cgpFadeUp {
  to { opacity: 1; transform: none; }
}

/* Stagger helpers */
.delay-1 { animation-delay: .25s; }
.delay-2 { animation-delay: .4s;  }
.delay-3 { animation-delay: .55s; }

	/* ================  GLASS CARD + LOOPING SHIMMER  ================ */
/* Scope to Meet the Crew page id appears in body classes */
.page-id-46 .glass-card{
  position: relative;
  /* frosted glass base */
  background: rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(9px) saturate(120%);
  backdrop-filter: blur(9px) saturate(120%);
  border-radius: 28px;
  box-shadow: 0 22px 42px rgba(15, 23, 42, 0.18);
  overflow: hidden;               /* so the shimmer is clipped to rounded corners */
  will-change: transform;         /* hint for smoothness */
}

/* The shimmering sunlight beam */
.page-id-46 .glass-card::before{
  content: "";
  position: absolute;
  top: -20%;
  left: -40%;
  width: 60%;                      /* thickness of the beam */
  height: 140%;
  /* bright core with soft falloff */
  background: linear-gradient(
    120deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.42) 50%,
    rgba(255,255,255,0) 100%
  );
  transform: skewX(-18deg) translateX(-120%);
  animation: glassShimmer 7s linear infinite;  /* speed + loop */
  pointer-events: none;            /* don't block clicks */
  mix-blend-mode: screen;          /* plays nicely over teal/sea hues */
}

/* The sweep animation */
@keyframes glassShimmer {
  0%   { transform: skewX(-18deg) translateX(-120%); }
  100% { transform: skewX(-18deg) translateX(220%); }
}

/* Respect users who prefer less motion */
@media (prefers-reduced-motion: reduce){
  .page-id-46 .glass-card::before{
    animation: none;
  }
}

	/*************************************************************
 🌴 CREW ANIMATION ENHANCEMENT PACK — Captain Cruise Booker Edition
*************************************************************/

/* 1️⃣ Soft Lift on Hover — adds premium depth */
.page-id-46 .glass-card {
  transition: transform 0.5s ease, box-shadow 0.5s ease;
}
.page-id-46 .glass-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 25px 55px rgba(15, 23, 42, 0.35);
}

/* 2️⃣ Smooth Fade-Up Entrance — scroll reveal */
.page-id-46 .glass-card {
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.8s ease-out;
}
.page-id-46 .glass-card.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Scroll animation trigger (requires below JS snippet) */
@media (prefers-reduced-motion: reduce) {
  .page-id-46 .glass-card {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* 3️⃣ Gold Nameplate Glint (10s gentle diagonal shimmer) */
.nameplate {
  position: relative;
  overflow: hidden;
}
.nameplate::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.3) 50%,
    rgba(255,255,255,0) 100%
  );
  animation: nameplateGlint 10s linear infinite;
  pointer-events: none;
}
@keyframes nameplateGlint {
  0% { transform: translateX(0); opacity: 0; }
  40% { opacity: 1; transform: translateX(150%); }
  70% { opacity: 0; transform: translateX(300%); }
  100% { opacity: 0; transform: translateX(300%); }
}
/* OCEAN SECTION — sits right under the sand header */
.ocean-section{
  background-image:url(https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp'); /* <- replace */
  background-size:cover;
  background-position:center top;
  background-repeat:no-repeat;
  width:100%;
  margin:0;
  padding:64px 0;              /* vertical breathing room; adjust as needed */
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:1;
}

/* gentle fade so it blends into the sand header above (optional) */
.ocean-section::before{
  content:"";
  position:absolute;
  top:0;left:0;width:100%;height:60px;
  background:linear-gradient(to bottom,#f7f0dc 0%,transparent 100%);
  z-index:2;
}

/* keeps your content centered with a max width */
.ocean-inner{
  position:relative;
  z-index:3;
  width: min(1200px, 92vw);
  margin:0 auto;
}

/* Prevent empty wrapper spacing at the top of content area */
.home .site.grid-container.container.hfeed {
  padding-top: 0 !important;
  margin-top: 0 !important;
  background: transparent !important;
}

/* Safety: kill any leftover wrapper/padding variants */
.home .site.grid-container.container.hfeed { 
  padding-top: 0 !important; 
  margin-top: 0 !important; 
  background: transparent !important; 
}
	
	.ocean-section{
  background-image: url('https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp');
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  display: flex; align-items: center; justify-content: center;
  padding: 64px 0;           /* adjust height here */
  width: 100%; position: relative; z-index: 1;
}
.ocean-inner{ width: min(1200px,92vw); margin:0 auto; position:relative; z-index:2; }



/* Ensure hero touches ocean directly */
.page-hero,
.cc-hero {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Optional — safety override if a background color is hardcoded */
body.home {
  background: #fff !important;
}
/* Remove the default content wrapper (the beige block) on Home */
.home #page {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* Just in case another empty “inside hero” container remains */
.home .inside-page-hero.grid-container.grid-parent {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Ensure the hero hugs the section below */
.page-hero,
.cc-hero { margin-bottom: 0 !important; padding-bottom: 0 !important; }
/* =====================================================
   OCEAN SECTION – BOOKING STYLE RESTORE
   ===================================================== */

.ocean-section {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-image: url('https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp');
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  padding: clamp(60px, 8vw, 120px) 20px;
  text-align: center;
  color: #fff;
  isolation: isolate;
  border-top: 2px solid rgba(255,255,255,0.15);
  border-bottom: 2px solid rgba(255,255,255,0.15);
}

.ocean-inner {
  width: min(1200px, 92%);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.section-title {
  font-size: clamp(2rem, 4vw, 2.8rem);
  font-weight: 800;
  margin-bottom: 12px;
  text-shadow: 0 3px 8px rgba(0,0,0,0.4);
}

.section-tagline {
  font-size: 1.1rem;
  margin-bottom: 2rem;
  color: #f0f8ff;
  opacity: 0.95;
}

/* Booking frame container */
.booking-frame iframe {
  width: 100%;
  max-width: 900px;
  height: 480px;
  border: 0;
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.4);
  background: rgba(0,0,0,0.2);
}

/* Button fallback link */
.booking-fallback {
  margin-top: 20px;
}

.btn-book {
  display: inline-block;
  padding: 12px 28px;
  background: #2BAA9A;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  border-radius: 50px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.3);
  transition: all 0.25s ease;
}

.btn-book:hover {
  background: #0077C8;
  transform: translateY(-2px);
}

/* Make sure the hero connects to the ocean */
.page-hero,
.cc-hero {
  margin-bottom: 0 ;
  padding-bottom: 0 ;
}


	/* Smooth handoff from ocean section to footer */
.ocean-section {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center top;
  min-height: 100vh; /* fills the screen height */
  margin-bottom: -1px; /* tucks under the footer border */
}

.ocean-section::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px; /* fade blend into footer */
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, #002B5C 100%);
  pointer-events: none;
}

/* Optional: tighten hero bottom edge for perfect contact */
.page-hero {
  margin-bottom: -2px !important;
}
/*-------------------------------------------
  SAND CARD BACKGROUND UNDER HERO
-------------------------------------------*/
.ocean-section {
  background: var(--sand-color, #FAEBD7); /* soft sand tone */
  border-radius: 24px;
  padding: 4rem 2rem;
  max-width: 1200px;
  margin: 2rem auto;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  position: relative;
  z-index: 2;
}

/* Make sure waves stay visible behind it */
body {
  background: url('https://cruisegroupplanner.com/wp-content/uploads/2025/10/your-water-image.webp')
              center top / cover no-repeat fixed;
  background-color: #eaf6f9; /* fallback for slow loads */
}

/* Optional subtle fade from card to ocean */
.ocean-section::after {
  content: "";
  position: absolute;
  bottom: -50px;
  left: 0;
  width: 100%;
  height: 100px;
  background: linear-gradient(to bottom, rgba(250,235,215,1) 0%, rgba(250,235,215,0) 100%);
  z-index: -1;
}
/* ----------------------------------------
   REMOVE SAND BACKGROUND FROM BODY / PAGE
----------------------------------------*/


/* Keep the footer area intact */
.cgp-footer {
  background: var(--blue-900);
}

/* Optional: restore slight wave fade above footer */
.ocean-section {
  background: url('https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp')
              center top / cover no-repeat;
  background-attachment: fixed;
  margin-bottom: 0;
}
/* ----- Restore the site’s sand background globally ----- */
:root{
  --sand-top: #f8eed9;   /* tweak if your sand is slightly different */
  --sand-bottom: #f3e3c2;
}


/* ----- Water only behind the booking section ----- */
.ocean-wrap{
  background: url('https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp')
              center top / cover no-repeat;
  padding: clamp(40px, 6vw, 80px) 16px;
  margin: 0;
}

/* Make sure the card itself doesn’t reintroduce a background */
.cc-hero.book-hero,
.cc-hero.book-hero .cc-card { background-color: transparent !important; }

/* Optional: gentle blend into footer */
.ocean-wrap::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-1px; height:90px;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,29,61,.6) 100%);
  pointer-events:none;
}
.ocean-wrap::after {
  content: "";
  display: block;
  height: 120px;
  margin-top: -60px;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, #012b5c 100%);
  pointer-events: none;
}
@media (min-width: 781px) {
  .home .cc-hero.persona-captain {
    background-attachment: fixed;
  }
}
@media (max-width: 780px){
  .home .cc-hero.persona-captain {
    background-attachment: scroll !important;
    background-size: cover !important;
  }
}
/* Remove any hero overlays/tints on the homepage */
.home .page-hero:before,
.home .page-hero:after,
.home .inside-page-hero:before,
.home .inside-page-hero:after,
.home .cc-hero.persona-captain:before,
.home .cc-hero.persona-captain:after,
.home .ocean-wrap:before,
.home .ocean-wrap:after {
  content: none !important;
  background: none !important;
  opacity: 0 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  box-shadow: none !important;
}

/* Make sure the section itself isn't adding color */
.home .page-hero,
.home .inside-page-hero,
.home .cc-hero.persona-captain {
  background: transparent !important;
  filter: none !important;
}
/* === Warm Caribbean Haze for Hero === */
.cc-hero.persona-captain::after {
  content: "";
  position: absolute;
  inset: 0;
  background: 
    linear-gradient(
      to bottom,
      rgba(255, 202, 128, 0.08),
      rgba(255, 175, 70, 0.06) 40%,
      rgba(0, 90, 140, 0.05) 80%
    );
  pointer-events: none;
  mix-blend-mode: soft-light;
  opacity: 1;
  z-index: 0;
}

/* --- TIMMY: resized + centered --- */
#timmy-crew{
  position: relative;
  isolation: isolate;
  max-width: 900px; /* slightly narrower overall container */
  margin: clamp(2rem,6vw,4rem) auto 0;
  padding: clamp(1.5rem,4vw,2.5rem) 1rem 0;
  text-align: center;
  z-index: 1;
}

/* Waves remain behind him */
#timmy-crew::before{
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 120%;
  height: clamp(140px, 20vw, 240px);
  background: url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp") no-repeat bottom center / cover;
  opacity: .9;
  z-index: 0;
  pointer-events: none;
}

/* Centered + smaller Timmy */
#timmy-crew .timmy-figure{
  position: relative;
  z-index: 1;
  display: inline-block;
  margin: 0 auto;
}

#timmy-crew .timmy-figure img{
  display: block;
  width: clamp(160px, 20vw, 260px); /* ~60% of previous size */
  height: auto;
  margin: 0 auto calc(-1 * clamp(30px, 4vw, 60px));
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.25));
}

#timmy-crew .timmy-nameplate{
  margin-top: .5rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-align: center;
}

#timmy-crew .timmy-blurb{
  position: relative;
  z-index: 1;
  max-width: 600px;
  margin: .5rem auto 0;
  opacity: .9;
  line-height: 1.55;
  text-align: center;
}

.site-footer{
  position: relative;
  z-index: 0;
  padding-top: clamp(2.5rem, 5vw, 4rem);
}
/* ==== RESTORE: Timmy with full-bleed waves + footer fade ==== */
#timmy-crew,
#timmy-crew .grid-container,
#timmy-crew .inside-article,
#timmy-crew .entry-content{
  background: transparent !important;
  box-shadow: none !important;
}

#timmy-crew{
  position: relative;
  max-width: 900px;
  margin: clamp(2rem,6vw,4rem) auto 0;
  padding: clamp(1.5rem,4vw,2.5rem) 1rem 0;
  text-align: center;
  /* reserve space for the wave band; keep this >= (::before height - bottom) */
  padding-bottom: 260px;
  overflow: visible;
  z-index: 1;
}

/* WAVES (edge-to-edge) */
#timmy-crew::before{
  content:"";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 64px;                             /* raise/lower waves */
  width: 100vw;
  height: 300px;                             /* wave band height */
  background: url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp")
              bottom center / cover no-repeat;
  opacity: .95;
  z-index: 0;                                /* behind Timmy/text */
  pointer-events: none;
}

/* FADE into footer */
#timmy-crew::after{
  content:"";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 64px;                             /* match ::before */
  width: 100vw;
  height: 90px;
  background: linear-gradient(to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,27,77,.45) 55%,
      #003366 100%);
  z-index: 1;
  pointer-events: none;
}

/* Timmy overlaps the surf a touch */
#timmy-crew .timmy-figure img{
  position: relative;
  display: block;
  width: clamp(160px, 22vw, 260px);
  height: auto;
  margin: 0 auto -42px;                      /* overlap amount */
  z-index: 2;                                /* above waves/fade */
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.25));
}

/* Caption + blurb above the waves */
#timmy-crew .timmy-nameplate,
#timmy-crew .timmy-blurb{
  position: relative;
  z-index: 2;
  transform: translateY(-8px);               /* lift text slightly */
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}
/* --- LOCK WAVES BACK ON TOP OF THE BODY GRADIENT --- */
#timmy-crew{ position: relative; isolation: isolate; background: transparent !important; }

/* Paint the wave band (edge-to-edge) */
body #timmy-crew::before{
  content:"" !important;
  position:absolute !important;
  left:50% !important; transform:translateX(-50%) !important;
  bottom:64px !important;                 /* raise/lower under shell */
  width:100vw !important; height:300px !important;
  background: url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp")
              bottom center / cover no-repeat !important;
  opacity:.95 !important; z-index:0 !important; pointer-events:none !important;
}

/* Fade into footer */
body #timmy-crew::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important; transform:translateX(-50%) !important;
  bottom:64px !important; width:100vw !important; height:90px !important;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,
                               rgba(0,27,77,.45) 55%, #003366 100%) !important;
  z-index:1 !important; pointer-events:none !important;
}

/* Timmy overlapping the surf; text above it */
#timmy-crew .timmy-figure img{ margin-bottom:-42px !important; position:relative; z-index:2; }
#timmy-crew .timmy-nameplate, #timmy-crew .timmy-blurb{
  position:relative; z-index:2; transform:translateY(-8px);
}

/* Nuke any stray panel backgrounds in this section */
#timmy-crew .grid-container, #timmy-crew .inside-article, #timmy-crew .entry-content{
  background: transparent !important; box-shadow:none !important;
}

	/* DEBUG: make sure the pseudo-element is actually rendering */
#timmy-crew{ position:relative !important; min-height:120px !important; }
#timmy-crew::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important; right:0 !important;
  bottom:0 !important;
  height:40px !important;
  background:rgba(0,255,0,.5) !important; /* neon green */
  display:block !important;
  z-index:9999 !important;
}

/* ---------- 404: Timmy Hero ---------- */
#timmy-crew.is-404{
  /* full-bleed hero with your beach gradient + waves */
  text-align: center;
  padding: clamp(4rem, 7vw, 8rem) 1.25rem;
  background:
    linear-gradient(180deg, #BCE4F6 0%, #FDF7E8 100%),
    url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp") center/cover no-repeat;
  color: #003366;
  position: relative;
  isolation: isolate; /* keeps pseudo waves behind content */
}

/* soft wave strip behind content for depth */
#timmy-crew.is-404::before{
  content:"";
  position: absolute;
  inset: auto 0 0 0;
  height: clamp(180px, 28vw, 360px);
  background: url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/Caribbean-Waves-Tile.webp")
              bottom center / cover no-repeat;
  opacity: .95;
  z-index: -1;
}

/* Timmy image + bobbing animation */
#timmy-crew .timmy-figure{
  margin: 0 auto clamp(1rem, 3vw, 1.75rem);
  max-width: min(640px, 90vw);
}
#timmy-crew .timmy-figure img{
  display: block;
  width: clamp(180px, 28vw, 340px);
  height: auto;
  margin: 0 auto;
  filter: drop-shadow(0 12px 28px rgba(0,0,0,.25));
  animation: timmy-float 6s ease-in-out infinite;
  will-change: transform;
}
@keyframes timmy-float{
  0%, 100% { transform: translateY(0) }
  50%      { transform: translateY(-10px) }
}
/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  #timmy-crew .timmy-figure img{ animation: none }
}

#timmy-crew .timmy-title{
  font-family: "Open Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 800;
  font-size: clamp(1.6rem, 3.2vw, 2.4rem);
  letter-spacing: .01em;
  margin: 0 0 .35rem;
  color: #003366;
}

#timmy-crew .timmy-blurb{
  max-width: 720px;
  margin: 0 auto clamp(1rem, 2.5vw, 1.5rem);
  line-height: 1.6;
  color: #24374f;
}
#timmy-crew .timmy-blurb a{
  color: #005aa8;
  text-underline-offset: 3px;
}
#timmy-crew .timmy-blurb a:hover{
  color: #003f7a;
}

/* Primary CTA */
#timmy-crew .btn-return{
  display: inline-block;
  background: #0077C8;
  color: #fff;
  font-weight: 700;
  padding: .8rem 1.4rem;
  border-radius: 999px;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  transition: transform .15s ease, background .25s ease;
}
#timmy-crew .btn-return:hover{
  background: #005da0;
  transform: translateY(-2px);
}

/* Visually hidden (for figcaption/screen readers) */
.sr-only{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip: rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Dark-mode nicety */
@media (prefers-color-scheme: dark){
  #timmy-crew.is-404{
    color: #e8f3ff;
  }
  #timmy-crew .timmy-title{ color:#e8f3ff; }
  #timmy-crew .timmy-blurb{ color:#d7e6fa; }
}
	.error404 .page-content,
.error404 .page-header {
  display: none !important;
}
#timmy-crew.is-404::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 120px;
  background: linear-gradient(to top, rgba(255,255,255,.2) 0%, transparent 100%);
  pointer-events: none;
  z-index: -1;
}
/* 404: hide the default header/content block */
.error404 .page-header,
.error404 .page-content { display:none !important; }

/* Timmy section polish */
.error404 #timmy-crew {
  position: relative;
  isolation: isolate;
  max-width: 1100px;
  margin: clamp(2rem,5vw,4rem) auto;
  padding: 0 1rem 1.5rem;
  text-align: center;
}

/* Timmy image */
.error404 #timmy-crew .timmy-figure img {
  width: clamp(220px, 30vw, 420px);
  height: auto;
  filter: drop-shadow(0 12px 28px rgba(0,0,0,.22));
}

/* Title + blurb + link */
.error404 #timmy-crew .timmy-title {
  margin: .5rem 0 .25rem;
  font-size: clamp(1.4rem, 2.2vw, 2rem);
  color: #0a3a74;
}
.error404 #timmy-crew .timmy-blurb {
  max-width: 760px;
  margin: .5rem auto 0;
  line-height: 1.6;
  color: #222;
  opacity: .95;
}
.error404 #timmy-crew .return-link {
  display: inline-block;
  margin-top: .75rem;
  font-weight: 700;
  text-decoration: underline;
  color: #0a5aa0;
  transition: color .25s ease;
}
.error404 #timmy-crew .return-link:hover { color: #ffb703; }

/* Soft “water light” from below */
.error404 #timmy-crew::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 120px;
  background: linear-gradient(to top, rgba(255,255,255,.18), transparent);
  pointer-events: none;
  z-index: -1;
}

/* Optional: gentle bubble shimmer (very subtle) */
@keyframes float-bubbles { 
  0% { transform: translateY(10px); opacity:.08; }
  50% { transform: translateY(-6px); opacity:.14; }
  100% { transform: translateY(10px); opacity:.08; }
}
.error404 #timmy-crew .timmy-figure { position: relative; }
.error404 #timmy-crew .timmy-figure::after {
  content:"";
  position:absolute; left:50%; transform:translateX(-50%);
  bottom:-8px; width:60%; height:18px;
  background: radial-gradient(ellipse at center, rgba(255,255,255,.25), rgba(255,255,255,0) 60%);
  animation: float-bubbles 4.5s ease-in-out infinite;
  filter: blur(1px);
}

/* Force 1 column on small screens */
@media (max-width: 700px){
  #meet-the-crew { grid-template-columns: 1fr !important; }
  /* If the cards sit inside a Gutenberg Columns block, stack it too */
  #meet-the-crew .wp-block-columns,
  .wp-block-columns:has(#meet-the-crew) {
    display: block !important;
  }
  #meet-the-crew .wp-block-columns > .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* Mobile typography trims */
  #meet-the-crew h3 { font-size: 1.15rem; line-height: 1.2; }
  #meet-the-crew .tagline { font-size: .95rem; }
  #meet-the-crew .btn-bio { font-size: .95rem; padding: .6rem 1rem; }
}

/* Center name, tagline, and button beneath each character */
#meet-the-crew h3,
#meet-the-crew p,
#meet-the-crew .btn-bio {
  text-align: center !important;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

/* Ensure the overall card contents are centered */
#meet-the-crew .crew-card {
  text-align: center;
  align-items: center;
  justify-content: center;
}

	.crew-credit {
  text-align: center;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  color: #E7A738;
  font-style: italic;
  margin-top: 12px;
}
.crew-credit span {
  color: #FFD86E;
}
/* Adjust crew image sizing balance */
.crew-card-orion .crew-photo-wrap {
  max-width: 550px;  /* bump to desired width */
  margin: 0 auto;
}
.crew-card-orion .crew-photo-wrap img {
  width: 100%;
  height: auto;
  display: block;
}
/* Force Dr. Orion frame to match Sterling's visual size */
.crew-card-orion .crew-photo-wrap{
  width: 720px !important;       /* target display diameter */
  max-width: 720px !important;
  margin: 0 auto;
}
.crew-card-orion .crew-photo-wrap img{
  width: 100% !important;
  height: auto !important;
  display: block;
}

/* Responsive: scale down on smaller screens */
@media (max-width: 900px){
  .crew-card-orion .crew-photo-wrap{
    width: clamp(420px, 60vw, 640px) !important;
    max-width: clamp(420px, 60vw, 640px) !important;
  }
}
/* Let Orion's column breathe if a grid is capping width */
.crew-card-orion{ max-width: none !important; }
	
	/* ---------- FOOTER REDESIGN (v2.0 Captain’s Cut) ---------- */
.site-footer {
  background: linear-gradient(to bottom, #006f7a, #004c54);
  color: #fff;
  padding: 60px 20px 40px;
  text-align: center;
  font-family: "Open Sans", system-ui, sans-serif;
}

.site-footer a {
  color: #FFD86E;
  text-decoration: none;
  transition: color 0.3s ease;
}
.site-footer a:hover {
  color: #fff;
}

.site-footer h2, .site-footer h3 {
  color: #FFD86E;
  margin-bottom: 10px;
  font-weight: 600;
}

.site-footer p {
  margin: 5px 0;
  font-size: 15px;
  opacity: 0.9;
}

.site-footer .footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  margin-top: 30px;
  padding-top: 15px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.7);
}
/* ---------- FOOTER: "Liberty Horizon" Theme ---------- */
.site-footer {
  background: linear-gradient(
    to bottom,
    #ffb347 0%,   /* warm amber sunrise */
    #ffcc33 25%,  /* golden light */
    #009aa6 100%  /* ocean teal base */
  );
  color: #fff8e7;
  text-align: center;
  padding: 70px 20px 40px;
  font-family: "Open Sans", system-ui, sans-serif;
  box-shadow: inset 0 4px 20px rgba(0,0,0,0.2);
  position: relative;
}

/* Gentle wave divider effect */
.site-footer::before {
  content: "";
  position: absolute;
  top: -40px;
  left: 0;
  width: 100%;
  height: 80px;
  background: url("https://cruisegroupplanner.com/wp-content/uploads/2025/10/wave-divider-light.svg") repeat-x;
  background-size: contain;
  transform: rotate(180deg);
  opacity: 0.8;
}

/* Headings & links */
.site-footer h2,
.site-footer h3 {
  color: #fff;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.site-footer a {
  color: #004c54;
  background: rgba(255,255,255,0.2);
  padding: 4px 8px;
  border-radius: 5px;
  text-decoration: none;
  transition: all 0.3s ease;
}
.site-footer a:hover {
  background: rgba(255,255,255,0.4);
  color: #00343b;
}

/* Bottom credits */
.footer-bottom {
  margin-top: 50px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,0.4);
  font-size: 14px;
  color: rgba(255,255,255,0.9);
  font-style: italic;
}

/* Liberty pulse for the sun */
@keyframes libertyPulse {
  0%, 100% { opacity: 0.7; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}
.site-footer::after {
  content: "☀️";
  position: absolute;
  top: -25px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 40px;
  animation: libertyPulse 6s infinite ease-in-out;
}
/* Footer layout grid */
.cgp-footer__inner{
  max-width: var(--max,1140px);
  margin: 0 auto;
  padding: 0 16px;
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
.cgp-links{list-style:none;margin:0;padding:0}
.cgp-links li{margin:.35rem 0}
.cgp-social a{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;margin-right:8px;border-radius:8px;
  background: rgba(255,255,255,.25);
}
.cgp-social a svg{display:block;fill:#004c54}
@media (max-width:900px){
  .cgp-footer__inner{grid-template-columns:1fr;text-align:center}
  .cgp-social a{margin:0 6px}
}
/* ---------- FOOTER FIXES: Liberty Horizon full width ---------- */
.cgp-footer {
  width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
  border-radius: 0;
}

.cgp-links {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.cgp-links li::marker {
  display: none;
  content: none;
}

body.home .site-main {
  margin-bottom: 0;
  padding-bottom: 0;
}

body.home {
  background: none !important;
}
/* ---------- END FOOTER FIXES ---------- */
/* ===== FOOTER FULL-WIDTH REPAIR (v2) ===== */

/* 1. Break footer out of site container */
.cgp-footer {
  position: relative;
  left: 50%;
  width: 100vw;
  margin-left: -50vw;
  border-radius: 0 !important;
  background: var(--blue-900, #003366);
  overflow: hidden;
}

/* 2. Hide rogue UL bullets that are outside our defined footer links */
.cgp-footer ul,
.cgp-footer ol {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 0 !important;
}
.cgp-footer li::marker {
  content: none !important;
  display: none !important;
}

/* 3. Center and constrain the footer inner grid */
.cgp-footer__inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1140px;
  margin: 0 auto;
  padding: 2rem 1rem;
  text-align: center;
}

/* Stack vertically on mobile */
@media (max-width: 900px) {
  .cgp-footer__inner {
    grid-template-columns: 1fr;
  }
}

/* 4. Ensure no gap above footer (especially on home page) */
.site-content,
.site-main,
.content-area,
.inside-site-content {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* 5. If the background waves are still cut off above footer */
body.home {
  background: none !important;
}

/* Prevent horizontal scroll from full-bleed trick */
html,
body {
  overflow-x: hidden;
}


	/* END OVERRIDES */
} /* end @layer overrides */
