/* =========================================================
   Married In Moments — brand stylesheet
   Palette: peach · cream · gold
   Fonts: Cormorant Garamond (display), Nunito (body),
          Pinyon Script (wordmark accent)
   ========================================================= */

:root{
  --cream:      #FCF6F3;
  --cream-2:    #F7E7E6;
  --peach-soft: #F6D9DD;
  --peach:      #EDB4BE;
  --peach-deep: #DD6E80;   /* rosy coral — primary accent */
  --coral-deep: #C4536A;   /* deeper rose for hover/press */
  --gold:       #D98AA0;   /* soft rose (was gold) */
  --gold-deep:  #B0576E;   /* deep rose for eyebrows/text */
  --ink:        #43323A;   /* warm plum-charcoal */
  --ink-soft:   #7C6570;   /* muted mauve */
  --white:      #FFFFFF;
  --shadow:     0 18px 45px rgba(74,53,64,.13);
  --shadow-sm:  0 8px 24px rgba(74,53,64,.10);
  --radius:     18px;
  --maxw:       1140px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Montserrat',system-ui,sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

h1,h2,h3,h4{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-weight:600;
  line-height:1.12;
  color:var(--ink);
  letter-spacing:.2px;
}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.section{padding:88px 0}
.center{text-align:center}
.eyebrow{
  font-family:'Montserrat',sans-serif;
  text-transform:uppercase;
  letter-spacing:3px;
  font-size:.72rem;
  font-weight:800;
  color:var(--gold-deep);
  margin-bottom:14px;
}
.script{
  font-family:'Pinyon Script','Cormorant Garamond',Georgia,serif;
  color:var(--peach-deep);
  font-weight:400;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-block;
  padding:15px 34px;
  border-radius:999px;
  font-weight:800;
  font-size:.95rem;
  letter-spacing:.4px;
  cursor:pointer;
  border:2px solid transparent;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn-primary{
  background:var(--peach-deep);
  color:#fff;
  box-shadow:var(--shadow-sm);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow);background:var(--coral-deep)}
.btn-ghost{
  background:transparent;
  border-color:var(--gold);
  color:var(--gold-deep);
}
.btn-ghost:hover{background:var(--gold);color:#fff}
.btn-lg{padding:18px 44px;font-size:1.02rem}

/* Deep-linked headings must clear the sticky header when jumped to. */
.prose h2[id]{scroll-margin-top:110px}

/* ---------- Header / Nav ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(251,244,234,.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(199,110,132,.25);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 24px;max-width:var(--maxw);margin:0 auto;
}
.brand{display:flex;align-items:center;gap:10px;line-height:1}
.brand-logo{height:46px;width:46px;flex-shrink:0}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand .mark{
  font-family:'Pinyon Script','Cormorant Garamond',Georgia,serif;
  font-size:2rem;color:var(--peach-deep);
}
.brand .sub{
  font-family:'Montserrat',sans-serif;
  text-transform:uppercase;letter-spacing:2.5px;
  font-size:.58rem;font-weight:800;color:var(--gold-deep);
  margin-top:2px;
}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{font-weight:700;font-size:.95rem;color:var(--ink-soft);transition:color .15s}
.nav-links a:hover{color:var(--peach-deep)}
.nav-links .btn{padding:11px 24px}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;font-size:1.6rem;color:var(--ink)}
.nav-close{display:none}

/* ---------- Hero ---------- */
.hero{
  position:relative;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(233,150,168,.55), transparent 60%),
    radial-gradient(900px 500px at 0% 110%, rgba(199,110,132,.30), transparent 55%),
    linear-gradient(180deg,var(--cream),var(--cream-2));
  padding:96px 0 88px;
  overflow:hidden;
}
.hero-inner{max-width:820px;margin:0 auto;text-align:center;padding:0 24px}
.hero .script{font-size:2.4rem;display:block;margin-bottom:6px}
.hero h1{font-size:clamp(2.6rem,6vw,4.4rem);margin:4px 0 18px}
.hero p.lead{font-size:1.18rem;color:var(--ink-soft);max-width:620px;margin:0 auto 30px}
.hero-cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:#fff;border:1px solid rgba(199,110,132,.4);
  padding:8px 18px;border-radius:999px;
  font-size:.82rem;font-weight:800;color:var(--gold-deep);
  box-shadow:var(--shadow-sm);margin-bottom:24px;letter-spacing:.5px;
}

/* ---------- Intro band ---------- */
.intro{background:var(--white)}
.intro h2{font-size:clamp(1.8rem,3.5vw,2.6rem);max-width:820px;margin:0 auto 18px}
.intro p{max-width:720px;margin:0 auto;color:var(--ink-soft);font-size:1.08rem}
.divider{width:64px;height:3px;background:linear-gradient(90deg,var(--peach-deep),var(--gold));margin:26px auto;border-radius:2px}

/* ---------- Packages ---------- */
.packages{background:linear-gradient(180deg,var(--cream),var(--cream-2))}
.pkg-grid{
  display:grid;gap:26px;margin-top:44px;
  grid-template-columns:repeat(3,1fr);
}
.pkg{
  background:#fff;border-radius:var(--radius);padding:34px 30px;
  box-shadow:var(--shadow-sm);border:1px solid rgba(199,110,132,.18);
  display:flex;flex-direction:column;position:relative;transition:transform .2s ease, box-shadow .2s ease;
}
.pkg:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.pkg.featured{border-color:var(--peach-deep);box-shadow:var(--shadow)}
.pkg .tag{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:linear-gradient(135deg,var(--peach-deep),var(--gold));
  color:#fff;font-size:.68rem;font-weight:800;letter-spacing:1.5px;
  text-transform:uppercase;padding:6px 16px;border-radius:999px;white-space:nowrap;
}
.pkg h3{font-size:1.9rem;margin-bottom:6px}
.pkg .blurb{color:var(--ink-soft);font-size:.98rem;min-height:66px}
.pkg .price{
  font-family:'Cormorant Garamond',serif;font-size:2.5rem;font-weight:700;
  color:var(--gold-deep);margin:14px 0 4px;
}
.pkg .price small{font-size:.8rem;font-family:'Montserrat',sans-serif;color:var(--ink-soft);font-weight:700;display:block;letter-spacing:.5px}
.pkg ul{list-style:none;margin:18px 0 26px}
.pkg ul li{position:relative;padding-left:28px;margin-bottom:12px;font-size:.94rem;color:var(--ink)}
.pkg ul li::before{
  content:"";position:absolute;left:0;top:7px;width:16px;height:16px;border-radius:50%;
  background:var(--peach-soft);
  box-shadow:inset 0 0 0 2px var(--gold);
}
.pkg .btn{margin-top:auto;text-align:center}

/* ---------- Perfect for ---------- */
.perfect{background:var(--white)}
.perfect-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:40px}
.perfect-card{
  background:var(--cream);border-radius:14px;padding:26px 18px;text-align:center;
  border:1px solid rgba(199,110,132,.18);font-weight:700;color:var(--ink);font-size:.98rem;
  display:flex;align-items:center;justify-content:center;min-height:120px;
}
.perfect-card .ico{font-size:1.8rem;display:block;margin-bottom:10px}
.perfect-note{text-align:center;margin-top:36px;font-size:1.5rem;font-family:'Cormorant Garamond',serif;color:var(--peach-deep)}

/* ---------- Process ---------- */
.process{background:linear-gradient(180deg,var(--cream-2),var(--cream))}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin-top:44px}
.step{text-align:center}
.step .num{
  width:56px;height:56px;border-radius:50%;margin:0 auto 14px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--peach-deep),var(--gold));color:#fff;
  font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:700;
  box-shadow:var(--shadow-sm);
}
.step p{font-size:.95rem;color:var(--ink-soft);font-weight:600}
.process .tagline{text-align:center;margin-top:36px;font-weight:800;letter-spacing:1px;color:var(--gold-deep)}

/* ---------- Good to know ---------- */
.goodtoknow{background:var(--white)}
.gtk-card{
  max-width:820px;margin:36px auto 0;background:var(--cream);
  border-radius:var(--radius);padding:34px 38px;border:1px solid rgba(199,110,132,.25);
}
.gtk-card h3{font-size:1.6rem;margin-bottom:14px}
.gtk-card ul{list-style:none}
.gtk-card li{padding-left:26px;position:relative;margin-bottom:12px;color:var(--ink-soft)}
.gtk-card li::before{content:"—";position:absolute;left:0;color:var(--peach-deep)}

/* ---------- Service area ---------- */
.area{
  background:
    radial-gradient(900px 500px at 100% 0%, rgba(233,150,168,.4), transparent 55%),
    linear-gradient(180deg,var(--cream),var(--cream-2));
  text-align:center;
}
.area h2{font-size:clamp(1.8rem,3.5vw,2.6rem)}
.area p{max-width:680px;margin:16px auto 0;color:var(--ink-soft);font-size:1.06rem}
.area .counties{margin-top:24px;font-weight:800;color:var(--gold-deep);letter-spacing:.5px}

/* ---------- Gallery ---------- */
.gallery-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px;
}
.gallery-grid .gimg{
  width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:14px;
  box-shadow:var(--shadow-sm);
}
.gallery-grid .ph{
  aspect-ratio:1/1;border-radius:14px;
  background:linear-gradient(135deg,var(--peach-soft),var(--cream-2));
  display:flex;align-items:center;justify-content:center;
  color:var(--gold-deep);font-weight:700;font-size:.8rem;text-align:center;
  border:1px dashed rgba(176,87,110,.45);
}

/* ---------- Email capture ---------- */
.capture{background:linear-gradient(135deg,var(--peach-deep),var(--gold));color:#fff;text-align:center}
.capture h2{color:#fff;font-size:clamp(1.8rem,3.5vw,2.6rem)}
.capture p{max-width:560px;margin:14px auto 26px;opacity:.95}
.capture form{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;max-width:520px;margin:0 auto}
.capture input{
  flex:1;min-width:240px;padding:15px 20px;border-radius:999px;border:none;
  font-family:'Montserrat',sans-serif;font-size:1rem;
}
.capture .btn-primary{background:#fff;color:var(--peach-deep)}

/* ---------- CTA band ---------- */
.cta-band{background:var(--white);text-align:center}
.cta-band h2{font-size:clamp(2rem,4vw,3rem);margin-bottom:10px}
.cta-band p{color:var(--ink-soft);margin-bottom:26px;font-size:1.1rem}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:#EFE3D6;padding:60px 0 30px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.site-footer .mark{font-family:'Pinyon Script','Cormorant Garamond',Georgia,serif;font-size:2rem;color:var(--peach)}
.site-footer p{color:#C9B8A8;font-size:.95rem;margin-top:10px}
.site-footer h4{font-family:'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:.75rem;color:var(--gold);margin-bottom:16px}
.site-footer a{color:#D9CBBC;display:block;margin-bottom:10px;font-size:.95rem}
.site-footer a:hover{color:var(--peach)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-top:22px;text-align:center;color:#A8998A;font-size:.85rem}
.footer-bottom a{color:#C9B8A8;display:inline}

/* ---------- Footer newsletter ---------- */
.newsletter{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-top:34px}
.newsletter-inner{max-width:520px;margin:0 auto;text-align:center;position:relative}
.newsletter h4{font-family:'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:.75rem;color:var(--gold)}
.newsletter p{color:#C9B8A8;font-size:.92rem}
.newsletter-form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.newsletter-form input[type="email"]{
  flex:1 1 240px;padding:13px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.25);
  font-family:'Montserrat',sans-serif;font-size:.98rem;background:rgba(255,255,255,.08);color:#fff;
}
.newsletter-form input[type="email"]::placeholder{color:#A8998A}
.newsletter-form .btn{padding:13px 26px}
.newsletter-msg{color:var(--peach)}

/* ---------- Booking / embed ---------- */
.embed-note{
  max-width:820px;margin:0 auto 30px;text-align:center;color:var(--ink-soft);
}
.embed-frame{
  max-width:900px;margin:0 auto;background:#fff;border-radius:var(--radius);
  box-shadow:var(--shadow-sm);border:1px solid rgba(199,110,132,.2);
  min-height:520px;display:flex;align-items:center;justify-content:center;
  color:var(--ink-soft);text-align:center;padding:40px;
}

/* ---------- Simple content pages ---------- */
.page-hero{
  background:linear-gradient(180deg,var(--cream),var(--cream-2));
  padding:64px 0;text-align:center;
}
.page-hero h1{font-size:clamp(2.4rem,5vw,3.6rem)}
.page-hero p{color:var(--ink-soft);margin-top:10px;font-size:1.1rem}
.prose{max-width:800px;margin:0 auto}
.prose h2{font-size:1.7rem;margin:34px 0 12px;color:var(--peach-deep)}
.prose h3{font-size:1.25rem;margin:24px 0 8px}
.prose p{margin-bottom:14px;color:var(--ink-soft)}
.prose ul{margin:0 0 16px 22px;color:var(--ink-soft)}
.prose li{margin-bottom:8px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:10px}
.contact-card{background:#fff;border-radius:var(--radius);padding:34px;box-shadow:var(--shadow-sm);border:1px solid rgba(199,110,132,.18)}
.contact-card h3{color:var(--peach-deep);margin-bottom:14px}
.contact-card p{margin-bottom:10px}
.field{margin-bottom:16px}
.field label{display:block;font-weight:700;margin-bottom:6px;font-size:.9rem}
.field input,.field textarea,.field select{
  width:100%;padding:13px 16px;border-radius:12px;border:1px solid rgba(176,87,110,.35);
  font-family:'Montserrat',sans-serif;font-size:1rem;background:var(--cream);
}
.field textarea{min-height:120px;resize:vertical}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .pkg-grid{grid-template-columns:1fr;max-width:460px;margin-inline:auto}
  .perfect-grid{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery-grid .gimg{min-width:0}
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .contact-grid{grid-template-columns:1fr}
  /* IMPORTANT: backdrop-filter on .site-header makes it the containing block
     for position:fixed children, which trapped the menu inside the header box
     (short panel, links spilling onto the page). Removing it on mobile lets the
     overlay position against the viewport. Header stays opaque instead. */
  .site-header{
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    background:var(--cream);
  }

  .nav-links{
    position:fixed;
    inset:0;
    width:100vw;
    width:100dvw;
    height:100vh;
    height:100dvh;
    max-width:none;
    background:var(--cream);   /* fully opaque — nothing shows through */
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:6px;
    padding:84px 26px calc(40px + env(safe-area-inset-bottom));
    margin:0;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    transform:translateX(100%);
    transition:transform .25s ease;
    box-shadow:none;
    /* above the chat widget, which sits at z-index:99999 in widget.js */
    z-index:100000;
  }
  .nav-links.open{transform:translateX(0)}

  /* Hide the chat bubble/panel while the menu is open so nothing floats over it */
  body.nav-open #nb-bubble,
  body.nav-open #nb-panel{display:none !important}

  .nav-links a{
    font-size:1.15rem;
    padding:16px 4px;
    border-bottom:1px solid rgba(199,110,132,.18);
    color:var(--ink);
  }
  .nav-links a:last-child{border-bottom:none}
  .nav-links .btn{
    margin-top:22px;
    text-align:center;
    padding:16px 24px;
    font-size:1rem;
    border-bottom:none;
    color:#fff;
  }

  /* X close button — injected by main.js so every page gets it */
  .nav-close{
    /* fixed, not absolute: the panel scrolls, and the X must stay put */
    position:fixed;
    top:18px;
    right:18px;
    width:44px;
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:none;
    border:none;
    cursor:pointer;
    font-size:2rem;
    line-height:1;
    color:var(--ink);
    z-index:2;
  }
  .nav-close:hover{color:var(--peach-deep)}

  .nav-toggle{display:block}

  /* Lock the page behind the overlay */
  body.nav-open{overflow:hidden}
}
@media (max-width:520px){
  .section{padding:60px 0}
  .perfect-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  /* Photo crops tighter on phones and can land on a bright patch —
     deepen the scrim so the headline and subheadline stay readable. */
  .hero-overlay{
    background:linear-gradient(180deg,rgba(38,26,32,.82),rgba(38,26,32,.74) 50%,rgba(120,44,66,.84));
  }
  .hero p.lead,.hero .lead{font-size:1.06rem}
}

/* =========================================================
   Imagery layer — photos throughout
   ========================================================= */
.hero{position:relative;padding:130px 0 110px;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.hero-overlay{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(48,34,42,.72),rgba(48,34,42,.6) 50%,rgba(150,58,82,.72))}
.hero .hero-inner{position:relative;z-index:2}
.hero h1,.hero .script{color:#fff}
/* NOTE: `.hero p.lead` earlier in this file sets color:var(--ink-soft) and has
   HIGHER specificity than a plain `.hero .lead`, so the subheadline was rendering
   in muted mauve on top of a dark photo — near-invisible, worst on phones.
   Matching that specificity here is what actually fixes it. */
.hero p.lead,.hero .lead{color:#fff}
.hero h1,.hero .script{text-shadow:0 2px 22px rgba(30,18,24,.75)}
.hero p.lead,.hero .lead{
  text-shadow:0 1px 3px rgba(20,12,16,.9), 0 2px 18px rgba(20,12,16,.7);
  font-weight:600;
}
.hero .hero-badge{background:rgba(255,255,255,.94);color:var(--gold-deep)}
.hero .btn-ghost{border-color:#fff;color:#fff}
.hero .btn-ghost:hover{background:#fff;color:var(--peach-deep)}

/* Intro becomes photo + copy */
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;text-align:left}
.intro-grid .intro-photo{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}
.intro-grid h2{font-size:clamp(1.7rem,3vw,2.4rem);margin:0 0 4px}
.intro-grid .divider{margin:22px 0}
.intro-grid p{margin:0;color:var(--ink-soft);font-size:1.06rem}

/* Photo at the top of each package card */
.pkg .pkg-photo{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:12px;margin:-6px 0 16px}

/* Photo hero for interior pages */
.page-hero.has-photo{position:relative;overflow:hidden;padding:120px 0}
.page-hero .ph-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.page-hero .ph-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(67,50,58,.55),rgba(221,110,128,.45))}
.page-hero.has-photo .wrap{position:relative;z-index:2}
.page-hero.has-photo h1,.page-hero.has-photo p,.page-hero.has-photo .script{color:#fff}

/* Two-column feature band (photo + copy) */
.feature-band{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;text-align:left}
.feature-band .feature-photo{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}
.feature-band h2{font-size:clamp(1.7rem,3vw,2.4rem)}
.feature-band .divider{margin:20px 0}
.feature-band p{color:var(--ink-soft)}

@media (max-width:960px){
  .intro-grid,.feature-band{grid-template-columns:1fr;text-align:center}
  .intro-grid .divider,.feature-band .divider{margin-inline:auto}
  .intro-grid .intro-photo,.feature-band .feature-photo{max-width:420px;margin-inline:auto}
}

/* ---------- Detailed service sections ---------- */
.service-detail{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start;padding:60px 0;border-top:1px solid rgba(199,110,132,.22)}
.service-detail:first-of-type{border-top:none;padding-top:8px}
.sd-photo{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:var(--radius);box-shadow:var(--shadow);position:sticky;top:96px}
.sd-name{font-family:'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:.72rem;font-weight:800;color:var(--gold-deep);margin-bottom:6px}
.service-detail h3{font-size:2.1rem;margin-bottom:6px}
.sd-meta{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin:8px 0 16px}
.sd-price{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:700;color:var(--peach-deep)}
.sd-deposit{font-size:.9rem;color:var(--ink-soft);font-weight:600}
.sd-dur{font-size:.75rem;color:var(--gold-deep);font-weight:800;background:var(--cream-2);padding:5px 12px;border-radius:999px;letter-spacing:.5px}
.service-detail p.sd-desc{color:var(--ink-soft);margin-bottom:6px}
.service-detail h4{font-family:'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:1.5px;font-size:.75rem;font-weight:800;color:var(--peach-deep);margin:22px 0 10px}
.service-detail ul{list-style:none;margin:0}
.service-detail li{position:relative;padding-left:22px;margin-bottom:8px;color:var(--ink);font-size:.96rem}
.service-detail li::before{content:"–";position:absolute;left:0;color:var(--peach-deep);font-weight:700}
.service-detail li ul{margin:8px 0 8px 4px}
.sd-note{background:var(--cream);border:1px solid rgba(199,110,132,.28);border-radius:12px;padding:14px 18px;margin:16px 0;font-size:.92rem;color:var(--ink)}
@media(max-width:820px){.service-detail{grid-template-columns:1fr;gap:24px}.sd-photo{position:static;max-width:400px;margin-inline:auto}}

/* ---------- Booking form ---------- */
.book-form{max-width:720px;margin:0 auto;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);border:1px solid rgba(199,110,132,.2);padding:36px}
.book-form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.book-form .field{margin-bottom:16px}
.book-form label{display:block;font-weight:700;margin-bottom:6px;font-size:.85rem}
.book-form input,.book-form select,.book-form textarea{
  width:100%;padding:13px 16px;border-radius:12px;border:1px solid rgba(176,87,110,.35);
  font-family:'Montserrat',sans-serif;font-size:1rem;background:var(--cream)}
.book-form textarea{min-height:110px;resize:vertical}
.book-form .hint{font-size:.82rem;color:var(--ink-soft);margin-top:4px}
.book-form .addons{display:flex;flex-direction:column;gap:12px;margin-top:6px}
.book-form .addons label{display:flex;align-items:center;gap:9px;font-weight:600;font-size:.92rem;margin:0;cursor:pointer}
.book-form input[type="checkbox"]{width:auto;margin:0;accent-color:var(--peach-deep);transform:scale(1.15)}
.book-form .check-line{display:flex;align-items:flex-start;gap:10px;font-weight:600;font-size:.9rem;line-height:1.5;margin:0;cursor:pointer}
.book-form .check-line input{margin-top:3px;flex:0 0 auto}
@media(max-width:600px){.book-form .addons{grid-template-columns:1fr}}
.deposit-note{max-width:720px;margin:18px auto 0;font-size:.86rem;color:var(--ink-soft);text-align:center}
@media(max-width:600px){.book-form .row{grid-template-columns:1fr}}

/* =========================================================
   Spanish-language service (added 2026-09-08)
   ========================================================= */
/* "Español" link in the nav — subtle pill so Spanish speakers spot it fast */
.nav-links a.nav-es{
  color:var(--gold-deep);
  border:1px solid rgba(199,110,132,.45);
  border-radius:999px;
  padding:6px 14px;
  font-size:.86rem;
  letter-spacing:.4px;
}
.nav-links a.nav-es:hover{background:var(--peach-soft);color:var(--coral-deep)}
@media (max-width:960px){
  .nav-links a.nav-es{
    border:none;border-bottom:1px solid rgba(199,110,132,.18);
    border-radius:0;padding:16px 4px;font-size:1.15rem;color:var(--gold-deep);
  }
}

/* Bilingual notice band (homepage + services) */
.es-band{background:var(--white)}
.es-band .es-card{
  max-width:900px;margin:0 auto;
  background:linear-gradient(135deg,var(--cream-2),var(--white));
  border:1px solid rgba(199,110,132,.28);border-radius:var(--radius);
  box-shadow:var(--shadow-sm);padding:40px 36px;text-align:center;
}
.es-band .es-card h2{font-size:clamp(1.7rem,3.2vw,2.4rem);margin-bottom:10px}
.es-band .es-card p{color:var(--ink-soft);max-width:640px;margin:0 auto}
.es-band .es-card p.en{font-size:.92rem;margin-top:12px}
.es-band .es-card .hero-cta{margin-top:24px}

/* Three-step "how to book" grid used on the Spanish page */
.steps.steps-3{grid-template-columns:repeat(3,1fr);max-width:900px;margin-inline:auto}
@media (max-width:960px){.steps.steps-3{grid-template-columns:1fr;max-width:420px}}

/* Language hint above the booking embed */
.lang-note{
  max-width:720px;margin:0 auto 22px;
  background:var(--white);border:1px solid rgba(199,110,132,.28);border-radius:12px;
  padding:16px 20px;font-size:.95rem;color:var(--ink);text-align:center;
}
.lang-note strong{color:var(--gold-deep)}

/* Desktop nav: keep every link on one line now that there are six of them */
@media (min-width:961px){
  .nav-links{gap:22px;flex-shrink:0}
  .nav-links a{white-space:nowrap}
  .brand{margin-right:16px}
}
/* Hamburger: 44x44 tap target (WCAG) — the glyph stays the same size */
.nav-toggle{min-width:44px;min-height:44px;display:none;align-items:center;justify-content:center;padding:0;margin:-7px -10px -7px 0}
@media (max-width:960px){.nav-toggle{display:flex}}
/* Contact cards: long emails/addresses wrap instead of forcing horizontal scroll on small phones */
.contact-grid{min-width:0}
.contact-card{min-width:0;overflow-wrap:anywhere}
@media (max-width:520px){.contact-card{padding:26px 20px}}
/* Interior page heroes: deeper scrim + soft shadow so white text over the photo
   meets WCAG AA (measured 2.1–2.8:1 before; homepage hero already fixed the same way) */
.page-hero .ph-overlay{background:linear-gradient(180deg,rgba(38,26,32,.74),rgba(38,26,32,.66) 50%,rgba(120,44,66,.78))}
.page-hero.has-photo h1,.page-hero.has-photo .script{text-shadow:0 2px 22px rgba(30,18,24,.75)}
.page-hero.has-photo p{text-shadow:0 1px 3px rgba(30,18,24,.9),0 0 18px rgba(30,18,24,.6)}

/* =========================================================
   Little Extras — ceremony add-ons (added 2026-09-09)
   Four photo cards + two bundles. Options/tiers live in Acuity.
   ========================================================= */
.extras{background:var(--white)}
.extras .lead{max-width:620px;margin:14px auto 0;color:var(--ink-soft);font-size:1.08rem}
.extras-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:44px}
.extra{
  background:var(--cream);border-radius:var(--radius);padding:14px 14px 22px;
  border:1px solid rgba(199,110,132,.18);text-align:left;
  display:flex;flex-direction:column;transition:transform .2s ease, box-shadow .2s ease;
}
.extra:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.extra img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:12px;margin-bottom:16px}
.extra h3{font-size:1.55rem;margin:0 4px 4px}
.extra p{color:var(--ink-soft);font-size:.92rem;margin:0 4px;line-height:1.55;flex:1}
.extra .xprice{margin:14px 4px 0;font-weight:800;color:var(--gold-deep);font-size:1.05rem;letter-spacing:.3px}
.extra .xprice small{font-weight:700;color:var(--ink-soft);font-size:.72rem;text-transform:uppercase;letter-spacing:1.4px;margin-right:6px}
.extras .bundle-title{font-size:clamp(1.6rem,3vw,2.1rem);margin-top:6px}
.bundle-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;max-width:820px;margin:34px auto 0;text-align:left}
.bundle-grid .pkg{padding-top:38px}
.bundle-grid .pkg .blurb{min-height:0;margin-bottom:6px}
.bundle-grid .pkg .price .was{
  font-size:1rem;font-family:'Montserrat',sans-serif;color:var(--ink-soft);
  font-weight:600;text-decoration:line-through;margin-left:10px;vertical-align:middle;
}
.bundle-grid .pkg .btn{margin-top:18px}
.extras-note{max-width:680px;margin:34px auto 0;color:var(--ink-soft);font-size:.94rem}
.extras-note strong{color:var(--gold-deep)}
@media (max-width:960px){
  .extras-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .bundle-grid{grid-template-columns:1fr;max-width:460px}
}
@media (max-width:520px){
  .extras-grid{gap:12px}
  .extra{padding:10px 10px 16px;border-radius:14px}
  .extra h3{font-size:1.3rem}
  .extra p{font-size:.85rem}
}

/* Styled Backdrop — lead card in Little Extras (before/after pair) */
.extra-wide{grid-column:1/-1;padding:16px 16px 24px}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ba figure{margin:0;position:relative}
.ba img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:12px;display:block}
.ba figcaption{
  position:absolute;left:10px;bottom:10px;
  background:rgba(255,255,255,.9);color:var(--gold-deep);
  font-size:.66rem;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  padding:5px 11px;border-radius:999px;
}
.ba figure.after figcaption{background:var(--peach-deep);color:#fff}
.extra-wide .xw-body{display:grid;grid-template-columns:1fr auto;gap:8px 32px;align-items:end;margin-top:18px}
.extra-wide h3{font-size:1.8rem;margin:0 4px 4px}
.extra-wide p{margin:0 4px;max-width:720px}
.extra-wide .xprice{margin:0 4px 6px;font-size:1.25rem;white-space:nowrap}
.extra-wide .xw-note{font-size:.8rem;color:var(--ink-soft);margin-top:10px;opacity:.9}
@media (max-width:640px){
  .extra-wide .xw-body{grid-template-columns:1fr}
  .extra-wide .xprice{margin-top:10px}
  .extra-wide h3{font-size:1.5rem}
}

/* Services page: extras sit between two white sections, so give the band a cream ground and white cards */
.extras.on-cream{background:linear-gradient(180deg,var(--cream),var(--cream-2));padding-top:64px}
.extras.on-cream .extra{background:#fff}