/* ============================================================
   Springtide Digital — shared plugin styles
   Each page carries its own full design CSS inline; this file
   holds brand-token fallbacks and staging/editor chrome fixes.
   Brand: navy #0B2431 · aqua #22B4C2 · Fraunces / Inter / JetBrains Mono
   ============================================================ */

:root {
  --navy-950: #06161E; --navy-900: #0B2431; --navy-800: #123244; --navy-700: #1B4258;
  --navy-600: #2e5f74; --navy-500: #3C6B80; --navy-300: #7FA0AF; --navy-100: #C7D6DE;
  --paper-50: #F6F8F9; --paper-100: #EEF1F3; --paper-200: #DDE3E7;
  --aqua-50: #E6F6F8; --aqua-100: #B8E6EB; --aqua-300: #6CCFD8; --aqua-500: #22B4C2;
  --aqua-600: #0A97A8; --aqua-700: #007585;
}

/* Staging ribbon sits above the fixed navs — push them (and the drawer) down. */
body.stde-staged .site-nav,
body.stde-staged .sp-nav { top: 30px; }
body.stde-staged .booking-drawer,
body.stde-staged .mobile-menu { top: 30px; height: calc(100% - 30px); }

/* Header logo: lands 50% bigger, settles back to standard size on scroll.
   Scaled as one unit via transform so it can't clash with per-page sizing rules. */
.nav-logo, .sp-logo { transform: scale(1.5); transform-origin: left center; transition: transform 0.4s cubic-bezier(0.16,1,0.3,1); will-change: transform; }
.site-nav.scrolled .nav-logo, .sp-nav.scrolled .sp-logo { transform: scale(1); }
@media (max-width: 640px) {
  .nav-logo, .sp-logo { transform: scale(1.28); }
  .site-nav.scrolled .nav-logo, .sp-nav.scrolled .sp-logo { transform: scale(1); }
}

/* ── Questions & answers (appended by the plugin on every page) ── */
.stde-faq { background: var(--paper-50); padding: 96px 80px; border-top: 1px solid rgba(127,160,175,0.18); font-family: 'Inter', system-ui, sans-serif; }
.stde-faq-inner { max-width: 860px; margin: 0 auto; }
.stde-faq-kicker { font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--aqua-600); margin: 0 0 14px; }
.stde-faq h2 { font-family: 'Fraunces', Georgia, serif; font-weight: 300; font-variation-settings: "SOFT" 40, "opsz" 144; font-size: clamp(30px, 3.6vw, 44px); letter-spacing: -0.03em; line-height: 1; color: var(--navy-950); margin: 0 0 30px; }
.stde-faq h2 em { font-style: italic; color: var(--aqua-600); }
.stde-faq details { border-bottom: 1px solid rgba(127,160,175,0.25); }
.stde-faq summary { cursor: pointer; list-style: none; display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 18px 0; font-size: 17px; font-weight: 500; color: var(--navy-900); transition: color 0.2s; }
.stde-faq summary:hover { color: var(--aqua-600); }
.stde-faq summary::-webkit-details-marker { display: none; }
.stde-faq summary::after { content: '+'; font-family: 'JetBrains Mono', monospace; font-size: 16px; color: var(--aqua-600); flex-shrink: 0; transition: transform 0.25s ease; }
.stde-faq details[open] summary::after { transform: rotate(45deg); }
.stde-faq .stde-faq-a { padding: 0 0 20px; color: var(--navy-700); font-size: 15px; line-height: 1.65; max-width: 720px; }
@media (max-width: 768px) { .stde-faq { padding: 64px 24px; } }

/* While the inline editor is open, keep everything visible and calm. */
body.lsce-editing .intro,
body.lsce-editing .cursor-dot,
body.lsce-editing .cursor-ring { display: none !important; }
body.lsce-editing .reveal { opacity: 1 !important; transform: none !important; }
body.lsce-editing { cursor: auto !important; }
