/* ============================================================
   GAIA DO MAR — interior page components
   Loaded after style.css and centered.css. Reuses the existing
   palette, typography and spacing; adds no new design language.
   ============================================================ */

.container.narrow{ width:min(860px,calc(100% - var(--gaia-gutter,35px) * 2)); }

/* ---------- page banner ---------- */
.page-banner-content .page-lead{
  max-width:640px;
  margin:18px 0 0;
  font-size:17px;
  line-height:1.7;
  color:#e8eff0;
}
.page-banner-actions{ margin-top:26px; }

/* ---------- editorial blocks ---------- */
.page-editorial p{ color:#50606a; line-height:1.85; margin:0 0 18px; }
.page-editorial .container.narrow > h2{ margin-bottom:22px; }
.feature-list{
  list-style:none;
  margin:26px 0 0;
  padding:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 28px;
}
.feature-list li{
  border-top:1px solid rgba(7,25,37,.14);
  padding:13px 0;
  font-size:14px;
  line-height:1.6;
  color:#4d5d66;
}
.feature-list li:before{ content:"✦"; color:var(--gaia-gold,#d6ad57); margin-right:10px; }
.section-dark .feature-list li{ border-color:rgba(255,255,255,.2); color:#dbe5e6; }

/* ---------- split image + copy ---------- */
.split-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:clamp(32px,5vw,72px);
  align-items:center;
}
.page-split.reverse .split-media{ order:2; }
.split-media img{
  width:100%;
  height:clamp(320px,46vw,560px);
  object-fit:cover;
  display:block;
}
.split-copy p{ color:#50606a; line-height:1.85; margin:0 0 16px; }
.split-copy .feature-list{ grid-template-columns:1fr; }

/* ---------- cards ---------- */
.page-card-grid{ display:grid; gap:20px; }
.page-card-grid.cols-3{ grid-template-columns:repeat(3,1fr); }
.page-card-grid.cols-2{ grid-template-columns:repeat(2,1fr); }
.page-card{
  background:#fff;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  box-shadow:0 12px 30px rgba(4,24,35,.06);
}
.section-sand .page-card{ box-shadow:none; }
.page-card img{ width:100%; height:230px; object-fit:cover; display:block; }
.page-card-body{ padding:26px 24px 28px; display:flex; flex-direction:column; gap:10px; flex:1; }
.page-card-body h3{
  font:500 26px/1.15 "Playfair Display",Georgia,serif;
  margin:0;
  color:#0a1c2a;
}
.page-card-body p{ margin:0; color:#55656e; font-size:14px; line-height:1.72; }
.card-meta{ list-style:none; margin:6px 0 0; padding:0; }
.card-meta li{
  border-top:1px solid rgba(7,25,37,.12);
  padding:9px 0;
  font-size:12px;
  letter-spacing:.02em;
  color:#5c6c75;
}
.page-card .button-link{ margin-top:auto; align-self:flex-start; padding-top:14px; }

/* ---------- comparison table ---------- */
.compare-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.compare-table{
  width:100%;
  min-width:640px;
  border-collapse:collapse;
  background:#fff;
}
.compare-table th,.compare-table td{
  border-bottom:1px solid rgba(7,25,37,.12);
  padding:16px 18px;
  text-align:left;
  font-size:14px;
  color:#44545d;
}
.compare-table thead th{
  font:700 10px/1.4 "DM Sans",Arial,sans-serif;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#0a1c2a;
  background:#f0e8d9;
}
.compare-table tbody td:first-child{ font-weight:600; color:#0a1c2a; }

/* ---------- FAQ ---------- */
.faq-item{
  border-bottom:1px solid rgba(7,25,37,.16);
  padding:4px 0;
}
.faq-item summary{
  cursor:pointer;
  list-style:none;
  padding:20px 40px 20px 0;
  position:relative;
  font:500 20px/1.4 "Playfair Display",Georgia,serif;
  color:#0a1c2a;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary:after{
  content:"+";
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  color:var(--gaia-gold,#d6ad57);
  font-size:22px;
}
.faq-item[open] summary:after{ content:"–"; }
.faq-item p{ margin:0 0 22px; color:#55656e; line-height:1.8; max-width:70ch; }

/* ---------- forms ---------- */
.gaia-form .form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-bottom:18px;
}
.form-field{ display:flex; flex-direction:column; gap:8px; }
.form-field.wide{ grid-column:1 / -1; }
.form-field > span{
  font:700 9px/1 "DM Sans",Arial,sans-serif;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:#5b6b73;
}
.gaia-form input,.gaia-form select,.gaia-form textarea{
  border:1px solid rgba(7,25,37,.2);
  background:#fff;
  padding:13px 12px;
  font:400 15px "DM Sans",Arial,sans-serif;
  color:#0a1c2a;
  border-radius:0;
}
.gaia-form input:focus,.gaia-form select:focus,.gaia-form textarea:focus{
  outline:2px solid var(--gaia-gold,#d6ad57);
  outline-offset:1px;
}
.gaia-form .checkbox{ margin:6px 0 14px; }
.gaia-form .form-status{ min-height:22px; margin:0 0 10px; font-size:13px; color:#057f8d; }
.gaia-form .form-status.error{ color:#9b4a4a; }
.gaia-form [aria-invalid="true"]{ border-color:#9b4a4a; }

/* ---------- related pages ---------- */
.related-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.related-card{
  display:block;
  background:#fff;
  overflow:hidden;
  transition:transform .3s ease;
  box-shadow:0 12px 30px rgba(4,24,35,.06);
}
.related-card:hover{ transform:translateY(-4px); }
.related-card img{ width:100%; height:190px; object-fit:cover; display:block; }
.related-card div{ padding:22px 22px 26px; }
.related-card h3{
  font:500 24px/1.2 "Playfair Display",Georgia,serif;
  margin:0 0 8px;
  color:#0a1c2a;
}
.related-card p{ margin:0; font-size:13px; color:#5c6c75; line-height:1.6; }

/* ---------- closing call to action ---------- */
.page-cta{ background:var(--gaia-navy,#0a1c2a); color:#fff; padding:88px 0; }
.page-cta-inner{ text-align:center; }
.page-cta h2{
  font:500 clamp(32px,4vw,54px)/1.05 "Playfair Display",Georgia,serif;
  margin:0 0 16px;
  color:#fff;
}
.page-cta p{ margin:0 auto; max-width:560px; color:#cbd9db; line-height:1.75; }
.page-cta-actions{
  margin-top:30px;
  display:flex;
  gap:16px;
  justify-content:center;
  flex-wrap:wrap;
}
.page-cta .button{ display:inline-flex; align-items:center; min-height:46px; }

/* ---------- active navigation state ---------- */
.nav-links a.is-current,
.mega-links a.is-current b,
.sun-footer-column a.is-current{ color:var(--gaia-gold,#d6ad57); }
.nav-links a.is-current{ border-bottom:1px solid currentColor; }

/* ---------- responsive ---------- */
@media(max-width:1180px){
  .page-card-grid.cols-3,.related-grid{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:900px){
  .split-grid{ grid-template-columns:1fr; gap:26px; }
  .page-split.reverse .split-media{ order:0; }
  .split-media img{ height:clamp(240px,58vw,340px); }
  .feature-list{ grid-template-columns:1fr; }
  .page-card-grid.cols-3,.page-card-grid.cols-2,.related-grid{ grid-template-columns:1fr; }
  .page-card img{ height:210px; }
  .gaia-form .form-grid{ grid-template-columns:1fr; }
  .page-cta{ padding:60px 0; }
  .page-cta-actions .button{ width:100%; justify-content:center; }
  .faq-item summary{ font-size:18px; padding:18px 36px 18px 0; }
  .container.narrow{ width:min(860px,calc(100% - var(--gaia-gutter,20px) * 2)); }
}

/* ---------- motion preference ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .hero-slide{ transition:none !important; }
}

/* ---------- visible focus for keyboard users ---------- */
a:focus-visible,button:focus-visible,summary:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--gaia-gold,#d6ad57);
  outline-offset:3px;
}

/* ---------- floating home button (mirrors the assistance bubble) ---------- */
.home-bubble{
  position:fixed;
  z-index:150;
  left:35px;
  bottom:27px;
  width:74px;
  height:74px;
  border-radius:50%;
  background:var(--gaia-navy,#0a1c2a);
  display:grid;
  place-items:center;
  box-shadow:0 12px 25px rgba(0,0,0,.25);
  transition:.2s;
}
.home-bubble svg{
  width:30px;
  height:30px;
  fill:none;
  stroke:#fff;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.home-bubble:hover{ background:var(--gaia-gold,#d6ad57); }
.home-bubble:hover svg{ stroke:var(--gaia-navy,#0a1c2a); }
/* the home page does not need it */
body:not(.subpage) .home-bubble{ display:none; }
@media(max-width:900px){
  .home-bubble{ left:17px; bottom:17px; width:59px; height:59px; }
  .home-bubble svg{ width:25px; height:25px; }
}
@media(max-width:430px){
  .home-bubble{ width:52px; height:52px; }
  .home-bubble svg{ width:22px; height:22px; }
}

/* ---------- mega menu submenus ---------- */
.mega-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.mega-item > a{ flex:1; }
.mega-toggle{
  flex:0 0 auto;
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.35);
  background:transparent;
  color:#fff;
  font-size:20px;
  line-height:1;
  display:grid;
  place-items:center;
  transition:.25s;
}
.mega-toggle:hover{ border-color:var(--gaia-gold,#d6ad57); color:var(--gaia-gold,#d6ad57); }
.mega-toggle[aria-expanded="true"]{
  background:var(--gaia-gold,#d6ad57);
  border-color:var(--gaia-gold,#d6ad57);
  color:var(--gaia-navy,#0a1c2a);
  transform:rotate(45deg);
}
/* a display value would override the hidden attribute, so state it explicitly */
.mega-sub[hidden]{ display:none !important; }
.mega-sub{
  display:grid;
  gap:2px;
  margin:2px 0 10px;
  padding:6px 0 10px 22px;
  border-left:1px solid rgba(255,255,255,.22);
}
.mega-sub a{
  font:400 14px/1.5 "DM Sans",Arial,sans-serif;
  letter-spacing:.02em;
  color:#cbd9db;
  padding:9px 0;
  min-height:auto;
}
.mega-sub a:hover{ color:var(--gaia-gold,#d6ad57); }
@media(max-width:900px){
  .mega-toggle{ width:44px; height:44px; font-size:22px; }
  .mega-sub{ padding-left:18px; }
  .mega-sub a{ font-size:15px; padding:11px 0; }
}