:root {
      --navy:       #0A2342;
      --navy-dark:  #061529;
      --cream:      #F8F5F0;
      --cream-dark: #EDE8E0;
      --charcoal:   #3A3A3A;
      --orange:     #D85C43;
      --orange-dark:#bf4d36;
      --green:      #2E5C3D;
      --gold:       #D4AF37;
      --gold-light: #e8c94a;
      --white:      #ffffff;
      --shadow-sm:  0 2px 8px rgba(10,35,66,0.08);
      --shadow-md:  0 8px 32px rgba(10,35,66,0.12);
      --shadow-lg:  0 20px 60px rgba(10,35,66,0.18);
      --radius:     4px;
      --radius-lg:  10px;
      --transition: 0.25s cubic-bezier(0.4,0,0.2,1);
      --font-serif: 'Cormorant Garamond', Georgia, serif;
      --font-sans:  'DM Sans', 'Helvetica Neue', Arial, sans-serif;
    }
button.is-loading, a.btn.is-loading {
  position: relative;
  color: transparent !important;
  pointer-events: none;
}
button.is-loading::after, a.btn.is-loading::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1rem;
  height: 1rem;
  margin: -.5rem 0 0 -.5rem;
  border: 2px solid rgba(255,255,255,.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: cc-spin .7s linear infinite;
}
@keyframes cc-spin { to { transform: rotate(360deg); } }
@media (max-width: 768px) {
  #booking-section .btn, #signup .btn, #gift-modal .btn, .payment-button {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    min-height: 48px;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: center;
    justify-content: center;
    letter-spacing: 0;
  }
  #booking-section > .card .btn { display: flex; width: 100%; margin-top: 12px; padding: 12px; }
  #gift-modal .btn { flex-basis: 100% !important; padding: 12px; }
}
#site-header .btn, #mobile-nav .btn, #footer .btn {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      padding: 0.85rem 2rem;
      font-family: var(--font-sans);
      font-size: 0.875rem;
      font-weight: 600;
      letter-spacing: 0.05em;
      border-radius: var(--radius);
      transition: all var(--transition);
      text-align: center;
      white-space: nowrap;
    }
#site-header .btn-primary, #mobile-nav .btn-primary, #footer .btn-primary {
      background: var(--orange);
      color: var(--white);
    }
#site-header .btn-primary:hover, #mobile-nav .btn-primary:hover, #footer .btn-primary:hover { background: var(--orange-dark); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(216,92,67,0.4); }
#site-header .btn-secondary, #mobile-nav .btn-secondary, #footer .btn-secondary {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
    }
#site-header .btn-secondary:hover, #mobile-nav .btn-secondary:hover, #footer .btn-secondary:hover { background: var(--navy); color: var(--white); }
#site-header .btn-white, #mobile-nav .btn-white, #footer .btn-white {
      background: var(--white);
      color: var(--navy);
    }
#site-header .btn-white:hover, #mobile-nav .btn-white:hover, #footer .btn-white:hover { background: var(--cream); transform: translateY(-1px); }
#site-header .btn-lg, #mobile-nav .btn-lg, #footer .btn-lg { padding: 1rem 2.5rem; font-size: 1rem; }
#site-header .container, #mobile-nav .container, #footer .container {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 1.5rem;
    }
#site-header .btn, #mobile-nav .btn, #footer .btn { max-width:100%; white-space:normal; text-align:center; }
#site-header {
      position: relative;
      z-index: 1000;
      background: var(--white);
      border-bottom: 1px solid rgba(10,35,66,0.08);
    }
#site-header .header-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 72px;
      gap: 2rem;
    }
#site-header .logo, #footer .logo {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      flex-shrink: 0;
    }
#site-header .logo-wordmark, #footer .logo-wordmark {
      font-family: var(--font-sans);
      font-weight: 700;
      font-size: 1.4rem;
      letter-spacing: 0.04em;
      color: var(--navy);
    }
#site-header .logo-wordmark span, #footer .logo-wordmark span { color: var(--gold); }
#site-header .logo-drop, #footer .logo-drop {
      width: 8px;
      height: 10px;
      background: var(--orange);
      border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
      display: inline-block;
      margin: 0 0.5px;
      vertical-align: middle;
      transform: translateY(-1px);
    }
#site-header .nav-links {
      display: flex;
      align-items: center;
      gap: 0.25rem;
    }
#site-header .nav-links a {
      font-size: 0.85rem;
      font-weight: 500;
      color: var(--charcoal);
      padding: 0.5rem 0.75rem;
      border-radius: var(--radius);
      transition: color var(--transition), background var(--transition);
    }
#site-header .nav-links a:hover { color: var(--navy); background: var(--cream); }
#site-header .nav-right {
      display: flex;
      align-items: center;
      gap: 0.75rem;
    }
#site-header .nav-login {
      font-size: 0.85rem;
      font-weight: 500;
      color: var(--charcoal);
      padding: 0.5rem 0.75rem;
      border-radius: var(--radius);
      transition: color var(--transition);
    }
#site-header .nav-login:hover { color: var(--navy); }
#site-header .hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      padding: 0.5rem;
      cursor: pointer;
    }
#site-header .hamburger span {
      display: block;
      width: 24px;
      height: 2px;
      background: var(--navy);
      border-radius: 2px;
      transition: all var(--transition);
    }
#mobile-nav {
      display: none;
      position: relative;
      background: var(--navy);
      padding: 1rem 1.5rem 1.5rem;
      gap: .25rem;
    }
#mobile-nav a {
      font-family: var(--font-serif);
      font-size: 2rem;
      padding: .8rem 1rem;
      font-weight: 600;
      color: var(--cream);
      transition: color var(--transition);
    }
#mobile-nav a:hover { color: var(--gold); }
#mobile-nav .nav-new-badge { display:inline-block; background:#D4AF37; color:#061529; font-family:var(--font-sans); font-size:.62rem; font-weight:700; line-height:1.7; padding:.15rem .45rem; border-radius:100px; vertical-align:middle; letter-spacing:.05em; margin-left:.2rem; }
#mobile-nav .mobile-sign-in { display:flex; align-items:center; gap:.75rem; margin-top:.75rem; padding-top:1.25rem; border-top:1px solid rgba(248,245,240,.25); }
#mobile-nav .mobile-sign-in svg { width:24px; height:24px; flex-shrink:0; }
body.mobile-menu-open #cc-ai-widget, body.mobile-menu-open #cc-online-tooltip, body.mobile-menu-open #cc-mobile-sticky-cta { display:none !important; }
#mobile-nav .mobile-close {
      justify-self: end;
      min-width:44px;
      min-height:44px;
      color: var(--cream);
      font-size: 2rem;
      cursor: pointer;
    }
#footer {
      background: var(--navy-dark);
      padding: 4rem 0 2rem;
    }
#footer .footer-top {
      display: grid;
      grid-template-columns: 2fr 1fr 1fr 1fr;
      gap: 3rem;
      padding-bottom: 1rem;
      border-bottom: 1px solid rgba(255,255,255,0.06);
      margin-bottom: 2rem;
    }
#footer .footer-brand .logo-wordmark { color: var(--white); }
#footer .footer-brand .logo-wordmark span { color: var(--gold); }
#footer .footer-tagline {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: 1rem;
      color: rgba(248,245,240,0.5);
      margin: 0.75rem 0 1.25rem;
    }
#footer .footer-social {
      display: flex;
      gap: 0.75rem;
      margin-top: 0.25rem;
    }
#footer .social-link {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      border: 1px solid rgba(255,255,255,0.15);
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgba(248,245,240,0.6);
      font-size: 0.9rem;
      transition: all var(--transition);
    }
#footer .social-link:hover { border-color: var(--gold); color: var(--gold); }
#footer .footer-col h4 {
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: rgba(248,245,240,0.4);
      margin-bottom: 1.25rem;
    }
#footer .footer-col a {
      display: block;
      font-size: 0.88rem;
      color: rgba(248,245,240,0.65);
      margin-bottom: 0.6rem;
      transition: color var(--transition);
    }
#footer .footer-col a:hover { color: var(--white); }
#footer .footer-bottom {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      flex-wrap: wrap;
    }
#footer .footer-copy { font-size: 0.78rem; color: rgba(248,245,240,0.35); }
#footer .footer-legal {
      display: flex;
      gap: 1.25rem;
      flex-wrap: wrap;
    }
#footer .footer-legal a {
      font-size: 0.78rem;
      color: rgba(248,245,240,0.35);
      transition: color var(--transition);
    }
#footer .footer-legal a:hover { color: rgba(248,245,240,0.7); }
#footer .footer-postcodes { font-size: 0.72rem; color: rgba(248,245,240,0.3); margin-top: 0.5rem; }
@media (max-width: 1024px) {#footer .footer-top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {#site-header .nav-links { display:none; }
#site-header .nav-right .nav-login { display:none; }
#site-header .hamburger { display:flex; min-width:44px; min-height:44px; align-items:center; justify-content:center; }
#mobile-nav.open { display:grid; }
#site-header .nav-right { gap:.5rem; }
#site-header .nav-login, #site-header .nav-right > .btn { white-space:nowrap; }
}
@media (max-width: 600px) {#site-header .container { padding-left:1rem; padding-right:1rem; }
#site-header .header-inner { gap:.5rem; height:auto; min-height:72px; padding:.65rem 0; }
#site-header .logo-wordmark, #footer .logo-wordmark { font-size:clamp(.95rem,4vw,1.25rem); }
#site-header .nav-right { gap:.25rem; flex-shrink:0; }
#site-header .nav-right > .btn { display:flex; align-items:center; justify-content:center; min-height:44px; padding:.65rem .65rem; font-size:.8rem; letter-spacing:0; }
#mobile-nav { padding:.5rem 1rem 1rem; }
}
@media (max-width: 600px) {#site-header .nav-links { display: none; }
#site-header .hamburger { display: flex; }
#footer .footer-top { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
@media (max-width: 480px) {#footer .footer-top { grid-template-columns: 1fr; }
}
#site-header, #mobile-nav, #footer { font-family:var(--font-sans); line-height:1.7; }
#site-header a, #mobile-nav a, #footer a { text-decoration:none; }
#site-header button, #mobile-nav button { font:inherit; background:none; border:0; cursor:pointer; }
#site-header .header-inner { max-width:none; margin:0; padding-left:0; padding-right:0; }
#mobile-nav .mobile-close { font-size:2rem; }
#footer .footer-postcodes { grid-column:1 / -1; }
#site-header, body.has-promo #site-header { top:auto; }
#site-header .nav-login { display:inline-flex; align-items:center; gap:.4rem; }
#site-header .nav-login svg { width:20px; height:20px; flex-shrink:0; }
#cc-promo-banner { position:relative; top:auto; left:auto; right:auto; }
/* Account dropdown shared by desktop and mobile navigation. */
.account-menu { position:relative; display:flex; align-items:center; gap:.25rem; }
.account-details { min-width:200px; max-width:260px; padding:.6rem .8rem; border-bottom:1px solid #e4e7eb; margin-bottom:.25rem; font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.account-details div:first-child { font-weight:600; }
#mobile-nav .account-details { color:var(--cream); border-color:rgba(255,255,255,.2); max-width:100%; }
#site-header .account-toggle, #mobile-nav .account-toggle { padding:.5rem; color:inherit; min-width:36px; min-height:40px; }
.account-options { position:absolute; top:100%; right:0; z-index:1100; min-width:150px; padding:.5rem; background:#fff; color:#0A2342; border:1px solid #e4e7eb; border-radius:8px; box-shadow:0 8px 24px rgba(10,35,66,.15); }
#site-header .account-options button, #mobile-nav .account-options button { display:block; width:100%; padding:.6rem .8rem; color:#0A2342; text-align:left; }
.account-options button:hover, .account-options button:focus-visible { background:#f8f5f0 !important; }
.account-options p { max-width:220px; padding:.5rem; font-size:.85rem; }
.account-menu [hidden] { display:none !important; }
#mobile-nav .mobile-account { border-top:1px solid rgba(248,245,240,.25); margin-top:.75rem; padding-top:1.25rem; color:var(--cream); flex-wrap:wrap; }
#mobile-nav .mobile-account .mobile-sign-in { border:0; margin:0; padding:0; }
#mobile-nav .account-options { position:static; flex-basis:100%; width:100%; margin-top:.35rem; background:transparent; border:0; box-shadow:none; padding:0; }
#mobile-nav .account-options a, #mobile-nav .account-options button { display:block; width:100%; color:var(--cream); font-family:var(--font-serif); font-size:1.45rem; font-weight:600; text-align:left; padding:.55rem 1rem; background:transparent; }
#mobile-nav .account-options button:hover, #mobile-nav .account-options button:focus-visible, #mobile-nav .account-options a:hover { background:transparent; color:var(--gold); }
@media (max-width:600px) { #site-header .desktop-account { display:none; } }

/* Keep the desktop header on one line, including signed-in account controls. */
#site-header .container { max-width:1440px; }
#site-header .header-inner { gap:1rem; }
#site-header .nav-links, #site-header .nav-right { flex-shrink:0; }
#site-header .nav-links a { white-space:nowrap; padding-left:.5rem; padding-right:.5rem; }
#site-header .nav-right > .btn { white-space:nowrap; flex-shrink:0; }
#site-header .nav-login { white-space:nowrap; padding-left:.25rem; padding-right:.25rem; }
#site-header .nav-login span { max-width:9rem; overflow:hidden; text-overflow:ellipsis; }
#site-header .desktop-account { flex-shrink:0; }
@media (max-width:600px) { #site-header .header-inner { gap:.5rem; } }
/* Keep full navigation readable on small desktop windows above mobile width. */
@media (min-width:601px) and (max-width:1320px) {
  #site-header .header-inner { flex-wrap:wrap; height:auto; padding-top:.75rem; padding-bottom:.5rem; gap:.5rem 1rem; }
  #site-header .nav-links { order:3; flex-basis:100%; justify-content:center; }
  #site-header .nav-right { margin-left:auto; }
}

@media (min-width:601px) and (max-width:960px) { #site-header .nav-links { flex-wrap:wrap; gap:.25rem; } }
.account-options .account-dashboard { display:block; padding:.6rem .8rem; color:#0A2342; font-size:.85rem; }