*, *::before, *::after{box-sizing:border-box;}
:root{
  /* PURE brand palette (from brand guidelines) */
  --pure-gold: #AF9F90;
  --dim-grey: #727175;
  --jet-black: #2C2C2D;
  --cinereous: #A08D8F;
  --champagne: #E8E3DE;

  /* Site tokens */
  --bg: var(--jet-black);
  --panel: rgba(255,255,255,0.06);
  --panel2: rgba(255,255,255,0.10);
  --text: rgba(255,255,255,0.92);
  --muted: rgba(255,255,255,0.72);
  --muted2: rgba(255,255,255,0.58);
  --brand: var(--pure-gold);
  --brand2: var(--champagne);
  --ink: #151518;
  --max: 980px;
  --radius: 22px;
  --shadow: 0 20px 60px rgba(0,0,0,0.45);

  /* Typography */
  --font-body: "Poppins", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  --font-accent: Didot, "Didot LT STD", "Hoefler Text", "Bodoni MT", "Didone Room Numbers", serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: var(--font-body);
  background: radial-gradient(1400px 700px at 70% 10%, rgba(175,159,144,0.22), transparent 60%),
              radial-gradient(1000px 500px at 20% 30%, rgba(232,227,222,0.10), transparent 55%),
              var(--bg);
  color: var(--text);
  line-height: 1.55;
  font-size: 10pt;
}

a{color:inherit}
.container{max-width:var(--max);margin:0 auto;padding:0 16px}
.small{font-size:0.92rem;color:var(--muted)}
.badge{
  display:inline-flex;gap:10px;align-items:center;
  padding:8px 14px;border-radius:999px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
  color: var(--muted);
  letter-spacing:0.12em;text-transform:uppercase;font-size:0.72rem;
}

header.site-header{
  position: sticky; top:0; z-index:50;
  background: rgba(10,10,11,0.72);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-mark{
  width:42px;height:42px;border-radius:14px;
  background: linear-gradient(135deg, var(--brand), #8f4d74);
  box-shadow: 0 12px 30px rgba(175,159,144,0.22);
}
.brand-name{font-weight:800;letter-spacing:0.08em}
.brand-sub{display:block;font-size:0.78rem;color:var(--muted2);letter-spacing:0.14em}

nav ul{list-style:none;margin:0;padding:0;display:flex;gap:18px;align-items:center}
nav a{
  font-size: 9pt;
  text-decoration:none;
  padding:10px 12px;border-radius:999px;
  color: var(--muted);
}
nav a:hover{background:rgba(255,255,255,0.08);color:var(--text)}
nav a[aria-current="page"]{background:rgba(192,108,159,0.22);border:1px solid rgba(192,108,159,0.35);color:var(--text)}

.nav-toggle{display:none;background:transparent;border:1px solid rgba(255,255,255,0.18);color:var(--text);padding:10px 12px;border-radius:12px}

.hero{padding:34px 0 14px}
.hero-grid{display:grid;grid-template-columns: 1.05fr 0.95fr;gap:22px;align-items:center}
h1{font-size: clamp(1.6rem, 3vw, 2.4rem);line-height:1.08;margin:16px 0 10px}
.hero h1{font-size: clamp(1.6rem, 2.8vw, 2.4rem);}
.page-hero .page-title{font-size: clamp(2.0rem, 3.6vw, 3.0rem);}
.lead{color:var(--muted);max-width:56ch;font-size:1.05rem}
.hero-card{
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.hero-card img{width:96%;height:auto;display:block;margin:0 auto}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 18px;border-radius:999px;border:1px solid rgba(255,255,255,0.14);
  text-decoration:none;font-weight:700;
}
.btn.primary{
  background: var(--brand);
  border-color: rgba(255,255,255,0.0);
  color:#fff;
}
.btn.primary:hover{filter:brightness(1.04)}
.btn.ghost{background:rgba(255,255,255,0.08)}
.btn.ghost:hover{background:rgba(255,255,255,0.12)}

.section{padding:34px 0}
.section.light{
  background: rgba(255,255,255,0.03);
  border-top: 1px solid rgba(255,255,255,0.07);
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.section h2{font-size: clamp(1.5rem, 2.6vw, 2.2rem);margin:10px 0 10px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.card{
  background: var(--panel);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--radius);
  padding:16px;
}
.card strong{display:block;font-size:1.05rem;margin:8px 0}
.card p{margin:10px 0 0;color:var(--muted)}
.card img{width:96%;height:auto;margin:0 auto;display:block;border-radius:18px;border:1px solid rgba(255,255,255,0.10);background:#fff}

.kpis{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}
.kpi{padding:10px 14px;border-radius:14px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.10);color:var(--muted);font-size:0.92rem}

.split{display:grid;grid-template-columns: 1fr 1fr;gap:22px;align-items:start}
.list{margin:10px 0 0;padding-left:18px;color:var(--muted)}
.list li{margin:8px 0}
hr.sep{border:none;border-top:1px solid rgba(255,255,255,0.10);margin:18px 0}

.table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border-radius: 16px;
  border:1px solid rgba(255,255,255,0.12);
}
.table th, .table td{
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,0.10);
  text-align:left;
}
.table th{background:rgba(255,255,255,0.06);color:var(--text);font-size:0.92rem}
.table td{color:var(--muted)}
.table tr:last-child td{border-bottom:none}

.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.gallery a{display:block;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,0.10);background:#fff}
.gallery img{width:96%;height:auto;display:block;margin:0 auto}

.form{
  display:grid;gap:12px;
}
input, textarea, select{
  width:100%;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.14);
  background: rgba(0,0,0,0.25);
  color: var(--text);
}
label{font-weight:700;font-size:0.92rem;color:var(--muted)}
textarea{min-height:120px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.notice{padding:14px;border-radius:16px;background:rgba(232,227,222,0.10);border:1px solid rgba(242,199,221,0.22);color:var(--muted)}

footer{padding:26px 0;color:var(--muted2)}
.footer-inner{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
.footer-links{display:flex;gap:14px;flex-wrap:wrap}
.footer-links a{color:var(--muted2);text-decoration:none}
.footer-links a:hover{color:var(--text)}

@media (max-width: 920px){
  .hero-grid{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .grid-2{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  nav ul{display:none}
  nav ul.open{display:flex;flex-direction:column;align-items:flex-start;position:absolute;right:20px;top:66px;background:rgba(10,10,11,0.95);padding:12px;border-radius:16px;border:1px solid rgba(255,255,255,0.10);min-width:220px}
  .nav-toggle{display:inline-flex}
}


h1, h2, h3{font-family: var(--font-accent); letter-spacing:0.015em}

.brand-logo{
  height: 52px;
  width: auto;
  display:block;
}
.brand{gap:14px;}
.brand-mark{display:none;}
@media (max-width: 420px){
  .brand-logo{height:28px}
}


/* --- Image Enhancements --- */

/* Hero image overlay */
.hero-image{
  position: relative;
  overflow: hidden;
  border-radius: 22px;
}

.hero-image::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    135deg,
    rgba(175,159,144,0.25),
    rgba(44,44,45,0.4)
  );
}

.hero-image img{
  width:96%;
  margin:0 auto;
  height:auto;
  display:block;
  filter: saturate(105%) contrast(102%);
}

/* About team image spacing + polish */
.team-img{
  border-radius: 22px;
  box-shadow: 0 30px 80px rgba(0,0,0,0.5);
  margin-top: 10px;
}

/* Improve section spacing */
.hero{
  padding-bottom: 40px;
}


/* =========================
   LUXE UPGRADE (high-end)
   ========================= */

/* Softer, more premium global background */
body{
  background:
    radial-gradient(1200px 650px at 70% 10%, rgba(175,159,144,0.20), transparent 60%),
    radial-gradient(900px 520px at 20% 25%, rgba(232,227,222,0.10), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,0.00), rgba(0,0,0,0.35)),
    var(--bg);
}

/* Subtle film-grain effect (CSS-only) */
body::before{
  content:"";
  position: fixed;
  inset: 0;
  pointer-events:none;
  opacity: 0.035;
  mix-blend-mode: overlay;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,0.06), rgba(255,255,255,0.06) 1px, rgba(0,0,0,0.00) 2px, rgba(0,0,0,0.00) 4px),
    repeating-linear-gradient(90deg, rgba(255,255,255,0.04), rgba(255,255,255,0.04) 1px, rgba(0,0,0,0.00) 2px, rgba(0,0,0,0.00) 5px);
  z-index: 0;
}

/* Ensure content sits above grain */
header, main, footer{position:relative; z-index:1;}

/* Premium header */
header.site-header{
  background: rgba(10,10,11,0.62);
  border-bottom: 1px solid rgba(232,227,222,0.10);
}
nav a{
  letter-spacing: 0.02em;
}
nav a:hover{
  background: rgba(232,227,222,0.08);
}
nav a[aria-current="page"]{
  background: rgba(175,159,144,0.18);
  border: 1px solid rgba(175,159,144,0.32);
}

/* Refined cards */
.card{
  background: rgba(255,255,255,0.045);
  border: 1px solid rgba(232,227,222,0.12);
  box-shadow: 0 24px 70px rgba(0,0,0,0.40);
}
.card:hover{
  border-color: rgba(232,227,222,0.18);
}

/* Buttons: understated luxury */
.btn.primary{
  background: linear-gradient(135deg, var(--pure-gold), #8f7f70);
  box-shadow: 0 14px 34px rgba(175,159,144,0.22);
}
.btn.primary:hover{filter:brightness(1.05)}
.btn.ghost{
  background: rgba(232,227,222,0.08);
  border-color: rgba(232,227,222,0.14);
}

/* Elegant reveal animations */
@keyframes fadeUp{
  from{opacity:0; transform: translateY(10px);}
  to{opacity:1; transform: translateY(0);}
}
.hero, .section{
  animation: fadeUp 700ms ease both;
}
.section{animation-delay: 70ms;}
.card{transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;}
.card:hover{transform: translateY(-2px); box-shadow: 0 34px 90px rgba(0,0,0,0.48);}

/* Gallery polish */
.gallery a{
  transition: transform 220ms ease, box-shadow 220ms ease;
}
.gallery a:hover{
  transform: translateY(-2px);
  box-shadow: 0 28px 70px rgba(0,0,0,0.45);
}

/* About page: let the team image feel intentional */
.team-img{
  width:100%;
  height:auto;
  object-fit: cover;
  border-radius: 22px;
  border: 1px solid rgba(232,227,222,0.12);
}


/* About page image vertical alignment adjustment */
.about-image-card{
  
}
@media (max-width: 920px){
  .about-image-card{
     /* smaller offset on mobile */
  }
}


/* Ensure image card hugs the bottom cleanly */
.about-image-card{
  margin-top: 0;
  display: flex;
  
}

/* Maintain proper mobile stacking */
@media (max-width: 920px){
  .split{
    
  }
  .about-image-card{
    margin-top: 30px;
  }
}


/* Force image column to bottom */
.about-image-card{
  display: flex;
  align-self: flex-end;
  margin-top: auto;
}

/* Ensure the image itself sits at bottom of the card */
.about-image-card .team-img{
  display:block;
}

/* Mobile adjustments */
@media (max-width: 920px){
  .split{
    min-height: auto;
  }
  .about-image-card{
    margin-top: 40px;
  }
}


/* ===== Manual About Image Lower Alignment ===== */

.about-image-card{
  margin-top: 220px; /* strong downward move to match red line */
}

@media (max-width: 1200px){
  .about-image-card{
    margin-top: 180px;
  }
}

@media (max-width: 920px){
  .about-image-card{
    margin-top: 60px;
  }
}


/* Package card image styling */
.package-image{
  list-style:none;
  padding:0;
  margin:0;
}

.package-image img{
  width:100%;
  height:220px;
  object-fit:cover;
  border-radius:18px;
  margin:10px 0 4px 0;
  border:1px solid rgba(232,227,222,0.12);
  box-shadow:0 20px 50px rgba(0,0,0,0.45);
}


/* ===== Luxe Package Image Upgrade ===== */

.package-image{
  list-style:none;
  padding:0;
  margin:0;
}

.package-image img{
  width:100%;
  height:290px;              /* Taller, more editorial */
  object-fit:cover;
  border-radius:22px;        /* Softer luxury curve */
  margin:12px 0 8px 0;
  border:1px solid rgba(232,227,222,0.18);
  box-shadow:0 30px 80px rgba(0,0,0,0.55);
  transition: transform 500ms ease, box-shadow 500ms ease;
  position:relative;
}

/* Subtle gold gradient overlay */
.package-image{
  position:relative;
}

.package-image::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:22px;
  background:linear-gradient(
      180deg,
      rgba(175,159,144,0.18) 0%,
      rgba(0,0,0,0.15) 60%,
      rgba(0,0,0,0.35) 100%
  );
  pointer-events:none;
}

/* Subtle zoom on hover */
.card:hover .package-image img{
  transform: scale(1.035);
  box-shadow:0 40px 100px rgba(0,0,0,0.65);
}

/* Edge-to-edge feel inside card */
.card ul{
  padding-left:0;
}


/* Minis flyer image */
.flyer-img{
  width:100%;
  height:auto;
  display:block;
  border-radius: 22px;
  border:1px solid rgba(232,227,222,0.14);
  box-shadow: 0 30px 90px rgba(0,0,0,0.55);
}


/* ===== Editorial Landing Page (Ladies & Aesthetics) ===== */
html{scroll-behavior:smooth;}

.page-hero .page-title{
  margin: 12px 0 10px;
  font-size: clamp(2.2rem, 4vw, 3.2rem);
}
.page-hero .page-lead{
  max-width: 72ch;
  opacity: 0.95;
}

.section-head{
  display:flex;
  align-items:flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}
.section-head h2{margin:0;}
.section-head .small{margin:0; max-width: 70ch;}

.subnav{
  position: sticky;
  top: 72px;
  z-index: 5;
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px;
  margin-top: 16px;
  background: rgba(10,10,11,0.55);
  border: 1px solid rgba(232,227,222,0.12);
  border-radius: 18px;
  backdrop-filter: blur(10px);
}
.subnav-link{
  display:inline-flex;
  align-items:center;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(232,227,222,0.12);
  background: rgba(255,255,255,0.05);
  color: rgba(255,255,255,0.92);
  text-decoration:none;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.subnav-link:hover{
  background: rgba(175,159,144,0.16);
  border-color: rgba(175,159,144,0.30);
}

.flyer-card{
  padding: 16px;
  max-width: 980px;
  margin-inline: auto;
}

/* Stack multiple flyers nicely (e.g. Ladies page) */
.flyer-stack{
  display: grid;
  gap: 16px;
}
.flyer-actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 14px;
}

.back-to-top{
  display:flex;
  justify-content:center;
  margin-top: 18px;
}

/* Better section spacing */
.section{padding-top: 46px; padding-bottom: 46px;}
@media (max-width: 920px){
  .section-head{flex-direction:column; align-items:flex-start;}
  .subnav{top: 64px;}
}

.subnav-link.is-active{
  background: rgba(175,159,144,0.22);
  border-color: rgba(175,159,144,0.40);
}


/* Keep main menu on one line (where possible) */
.nav, nav{
  flex-wrap: nowrap;
}
nav a{
  white-space: nowrap;
}
@media (max-width: 980px){
  nav{overflow-x:auto; -webkit-overflow-scrolling: touch;}
  nav::-webkit-scrollbar{height:8px;}
}


/* Thank-you page polish */
a[href^="tel:"], a[href^="mailto:"]{text-decoration:none;}

/* Enquiry error message */
.form-error{
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(175,159,144,0.35);
  background: rgba(175,159,144,0.12);
  color: rgba(255,255,255,0.92);
}


/* Brand logo sizing (wide logo) */
.brand-logo{
  height: 52px;
  width: auto;
  max-width: 210px;
  display:block;
}
@media (max-width: 900px){
  .brand-logo{ height: 30px; max-width: 180px; }
}
@media (max-width: 520px){
  .brand-logo{ height: 28px; max-width: 160px; }
}

/* Header nav spacing tune */
.header-inner{gap:14px;}
nav ul{gap:14px;}


/* Smooth scroll + anchor highlight */
html {
  scroll-behavior: smooth;
}

#luxury-treatments {
  scroll-margin-top: 120px; /* offset for sticky header */
}

.highlight-section {
  animation: highlightFade 2s ease-out;
}

@keyframes highlightFade {
  0% { box-shadow: 0 0 0 0 rgba(175,159,144,0.6); }
  50% { box-shadow: 0 0 0 18px rgba(175,159,144,0.15); }
  100% { box-shadow: 0 0 0 0 rgba(175,159,144,0); }
}


/* Mobile responsiveness (desktop-like) */
img{max-width:100%;height:auto;}

.site-container, .container{
  width: min(1200px, 100%);
  margin-inline: auto;
  padding-inline: 20px;
}

@media (max-width: 980px){
  .site-container, .container{ padding-inline: 16px; }
}

/* Header: keep desktop look, allow horizontal scrolling for menu on small screens */
@media (max-width: 860px){
  .site-header, header{
    position: sticky;
    top: 0;
    z-index: 999;
  }

  .header-inner{
    align-items: center;
    gap: 10px !important;
  }

  /* Logo scales down */
  .brand-logo, .brand img, .logo{
    height: 28px !important;
    max-width: 160px !important;
  }

  nav ul{
    display: flex;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    scrollbar-width: none;
    padding-bottom: 6px;
  }
  nav ul::-webkit-scrollbar{ display:none; }

  nav a{
    font-size: 14px;
    padding: 10px 12px;
  }
}

/* Headings: scale down slightly but keep same styling */
@media (max-width: 860px){
  h1{font-size: clamp(34px, 7vw, 54px); line-height: 1.05;}
  .hero h1{font-size: clamp(31px, 6.5vw, 51px);}
  h2{font-size: clamp(26px, 5.8vw, 40px); line-height: 1.1;}
  .hero-title{font-size: clamp(34px, 7vw, 60px);}
  .lead, .hero-subtitle{font-size: 16px; line-height: 1.6;}
}

/* Cards/columns: keep side-by-side feel by enabling swipe on mobile */
@media (max-width: 860px){
  .cards, .package-grid, .pricing-grid, .compare-grid{
    display: flex !important;
    gap: 14px !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding-bottom: 10px;
  }
  .cards > *, .package-grid > *, .pricing-grid > *, .compare-grid > *{
    min-width: 86%;
    scroll-snap-align: start;
  }
}

/* Ensure large framed images fit on mobile */
@media (max-width: 860px){
  .image-frame, .photo-frame, .frame, .media-frame{
    width: 100%;
    max-width: 100%;
  }
}

/* Section spacing */
@media (max-width: 860px){
  section{padding-top: 44px; padding-bottom: 44px;}
}



/* --- Premium flyer layout enhancements --- */
.page-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 16px 48px;
}

.flyer-stack {
  display: grid;
  gap: 22px;
  margin: 18px auto 28px;
}

.flyer-card {
  background: rgba(255,255,255,0.85);
  border-radius: 18px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.08);
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.06);
}

.package-image {
  width: 100%;
  height: auto;
  display: block;
}

/* Buttons */
.cta-row {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 6px 0 24px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 0.2px;
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 10px 24px rgba(0,0,0,0.08);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,0.10);
}

.btn-primary {
  background: #f8e6ee;
  color: #222;
}

.btn-secondary {
  background: #ffffff;
  color: #222;
}

/* Subtle fade-in on scroll */
.reveal {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .6s ease, transform .6s ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Lightbox */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.82);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
  z-index: 9999;
}

.lightbox.is-open {
  display: flex;
}

.lightbox img {
  max-width: min(1100px, 96vw);
  max-height: 92vh;
  border-radius: 14px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.35);
}

.lightbox .hint {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255,255,255,0.8);
  font-size: 14px;
  text-align: center;
}

/* Packages page cards: slightly more premium */
.package-card {
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 10px 26px rgba(0,0,0,0.08);
}



/* Packages & Prices page layout tweaks */
.packages-hero{
  padding-top: 28px;   /* move text up */
  padding-bottom: 46px;
}

.packages-cta{
  justify-content: flex-end; /* move Book Now to the right */
  margin-top: 18px;          /* move Book Now down a bit */
  margin-bottom: 8px;
}

.about-text{font-size:0.95rem;line-height:1.6;}
.team-img{display:block;margin:auto;}


/* Header phone button */
.header-call{
  flex: 0 0 auto;
  margin-left: 8px;
}
.header-call a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  padding:10px 16px;
  border-radius:999px;
  background: linear-gradient(135deg, var(--pure-gold), #8f7f70);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  font-size:0.95rem;
  box-shadow:0 14px 34px rgba(175,159,144,0.22);
  border:1px solid rgba(232,227,222,0.18);
}
.header-call a:hover{
  filter:brightness(1.05);
  transform:translateY(-1px);
}

@media (max-width: 980px){
  .header-inner{
    flex-wrap:wrap;
  }
  .header-call{
    width:100%;
    order:3;
    margin:6px 0 0;
  }
  .header-call a{
    width:100%;
    padding:10px 14px;
    font-size:0.92rem;
  }
}


/* Goldcrest updates */
.footer-contact{
  font-size:0.88rem;
  color:var(--muted);
}
.footer-contact a{
  text-decoration:none;
}
.areas-links{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}
.area-link{
  display:inline-flex;
  align-items:center;
  padding:10px 14px;
  border-radius:999px;
  text-decoration:none;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.10);
  color:var(--text);
}
.area-link:hover,
.area-link.active{
  background:rgba(255,255,255,0.12);
}
.header-inner{
  position:relative;
  padding-right:160px;
}
.header-call{
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  margin-left:0;
}
.header-call a{
  padding:6px 12px;
  font-size:0.8rem;
  box-shadow:none;
}
@media (max-width: 980px){
  .header-inner{
    padding-right:0;
  }
  .header-call{
    position:static;
    transform:none;
    width:100%;
    order:3;
    margin:6px 0 0;
  }
  .footer-inner{
    gap:10px;
    flex-direction:column;
    align-items:flex-start;
  }
}


.header-call{display:none !important;}


.page-phone{
  position:absolute;
  top:88px;
  right:150px;
  z-index:20;
  font-size:14px;
  font-weight:600;
  letter-spacing:0.03em;
}
.page-phone a{
  color:#ffffff;
  text-decoration:none;
}
.page-phone a:hover{
  color:var(--brand2);
}
@media (max-width: 1200px){
  .page-phone{right:90px;}
}
@media (max-width: 920px){
  .page-phone{top:78px; right:20px; font-size:13px;}
}


/* ===== Mobile optimisation fix pack ===== */
html, body {
  overflow-x: hidden;
}

iframe, video, table {
  max-width: 100%;
}

@media (max-width: 920px){
  body{
    font-size: 16px;
  }

  .container,
  .site-container{
    padding-inline: 14px !important;
  }

  .header-inner{
    padding-right: 0 !important;
    align-items: center;
    gap: 10px !important;
  }

  nav{
    width: auto;
    margin-left: auto;
    overflow: visible !important;
  }

  nav ul{
    display: none !important;
  }

  nav ul.open{
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    position: absolute;
    left: 14px;
    right: 14px;
    top: calc(100% + 8px);
    max-height: calc(100vh - 110px);
    overflow-y: auto;
    gap: 6px !important;
    padding: 10px;
    background: rgba(10,10,11,0.98);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.45);
    z-index: 1000;
  }

  .nav-toggle{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    font-size: 15px;
  }

  nav a{
    display: block;
    width: 100%;
    padding: 12px 14px;
    font-size: 15px;
    white-space: normal;
  }

  .page-phone{
    position: static;
    padding: 8px 14px 0;
    text-align: center;
    font-size: 14px;
  }

  .hero,
  .section{
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }

  .hero-grid,
  .grid-2,
  .grid-3,
  .split,
  .form-row{
    grid-template-columns: 1fr !important;
  }

  .hero-actions,
  .cta-row,
  .flyer-actions{
    flex-direction: column;
    align-items: stretch;
  }

  .hero-actions .btn,
  .cta-row .btn,
  .flyer-actions .btn,
  .form button.btn,
  .btn{
    width: 100%;
  }

  .kpis{
    gap: 10px;
  }

  .kpi{
    width: 100%;
    text-align: center;
  }

  .badge{
    line-height: 1.35;
    white-space: normal;
  }

  h1,
  .hero h1,
  .page-hero .page-title{
    font-size: clamp(1.9rem, 9vw, 2.7rem) !important;
    line-height: 1.12 !important;
  }

  h2{
    font-size: clamp(1.5rem, 7vw, 2.15rem) !important;
  }

  .lead,
  .small,
  p,
  li,
  label,
  input,
  textarea,
  select{
    font-size: 1rem;
  }

  .gallery{
    grid-template-columns: 1fr 1fr !important;
  }

  .table-wrap{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .table{
    min-width: 620px;
  }

  .card,
  .hero-card,
  .notice,
  input,
  textarea,
  select{
    border-radius: 18px;
  }

  .footer-links,
  .areas-links{
    gap: 10px;
  }

  .footer-contact{
    word-break: break-word;
  }
}

@media (max-width: 560px){
  .brand-logo{
    height: 26px !important;
    max-width: 150px !important;
  }

  .gallery{
    grid-template-columns: 1fr !important;
  }

  .page-phone{
    font-size: 13px;
  }

  .hero-card img,
  .card img,
  .gallery img,
  .hero-image img{
    width: 100% !important;
  }
}