/* pages.css — additive, page-scoped styles for the four skeleton pages
   (location.html, packages.html, single-service.html, occasion.html).
   index.html never links this file and styles.css is untouched; every class
   here is new, and the few shared selectors styled (.revfx h2, .revfx
   .sec-eyebrow) are scoped under a new-class ancestor so nothing leaks.
   Palette vars come from styles.css. */

/* hero note line under the CTAs (price anchor / serving line) */
.hero-note{margin-top:26px;font-size:.95rem;color:var(--ink-soft);max-width:52ch}

/* reviews: the testimony stage. One review lit at a time over a fixed
   full-bleed photograph (integrated 2026-08-10 from the wedding-reviews
   variants round, 06, then rolled out to every page's testimonial slot; the
   old three-card .revs grid died with it). Shared by all four skeleton pages;
   each page keeps its own heading and quote order, pages.js steps the stage.
   The photograph is FIXED: it holds still while the page scrolls over it.
   iOS Safari renders background-attachment:fixed at the wrong scale, so
   touch devices get the same fallback styles.css uses for .ed and .fixbg,
   a viewport-fixed pseudo element clipped to the section box. url() is
   relative to THIS stylesheet at the site root, so images/ resolves from
   subdirectory pages too. */
.revfx{position:relative;color:#fff;text-align:center;display:grid;align-items:center;min-height:min(92vh,860px);padding:84px 0 64px;
  background-color:#000;
  background-image:linear-gradient(rgba(20,16,12,.74),rgba(20,16,12,.74)),url(images/ballroom-checkered-360.webp);
  background-size:auto,cover;background-position:center;background-attachment:fixed,fixed}
@media(hover:none){
  .revfx{background-image:none;clip-path:inset(0)}
  .revfx::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-color:#000;background-image:linear-gradient(rgba(20,16,12,.74),rgba(20,16,12,.74)),url(images/ballroom-checkered-360.webp);background-size:auto,cover;background-position:center}
  .revfx .wrap{position:relative;z-index:1}
}
.revfx .sec-eyebrow{color:var(--gold-pale)}
.revfx h2{color:var(--paper);margin-bottom:0}
.revfx h2 em{color:var(--gold-pale)}
/* Was the character U+2726, which no self-hosted subset carries, so iOS fell
   through to Apple Color Emoji and painted it green. Same star, drawn in CSS. */
.revfx-star{color:var(--gold-pale);font-size:0;line-height:0;margin:26px 0 22px}
.revfx-star::before{
  content:"";display:inline-block;width:15px;height:15px;background:currentColor;
  -webkit-clip-path:polygon(50% 0,57% 43%,100% 50%,57% 57%,50% 100%,43% 57%,0 50%,43% 43%);
  clip-path:polygon(50% 0,57% 43%,100% 50%,57% 57%,50% 100%,43% 57%,0 50%,43% 43%);
}
.revfx-rule{width:min(620px,72%);height:1px;background:rgba(250,246,239,.28);margin:0 auto}
.revfx-stage{position:relative;min-height:340px;display:grid;place-items:center;margin:14px auto 0}
.revfx-q{grid-area:1/1;max-width:62ch;margin:0;opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease;pointer-events:none}
.revfx-q.is-live{opacity:1;transform:none;pointer-events:auto}
.revfx-q blockquote{font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-weight:500;font-size:1.42rem;line-height:1.55;margin:0 0 28px;color:var(--paper)}
.revfx-q.short blockquote{font-size:1.9rem;line-height:1.42}
.revfx-q figcaption{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.24em;color:rgba(250,246,239,.78)}
.revfx-q figcaption b{color:var(--paper);margin-right:12px}
.revfx-foot{margin-top:26px}
.revfx-count{margin-top:20px;font-size:.68rem;font-weight:700;letter-spacing:.3em;color:rgba(250,246,239,.85)}
.revfx-arrow{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--paper);font-size:1.9rem;line-height:1;cursor:pointer;padding:18px;opacity:.75;transition:opacity .25s,color .25s,transform .25s;z-index:2}
.revfx-arrow:hover{opacity:1;color:var(--gold-pale)}
.revfx-arrow.prev{left:clamp(8px,4vw,72px)}
.revfx-arrow.next{right:clamp(8px,4vw,72px)}
.revfx-arrow.prev:hover{transform:translateY(-50%) translateX(-3px)}
.revfx-arrow.next:hover{transform:translateY(-50%) translateX(3px)}
@media(max-width:820px){
  .revfx-stage{min-height:460px}
  .revfx-q blockquote{font-size:1.16rem}
  .revfx-q.short blockquote{font-size:1.5rem}
  .revfx-arrow{top:auto;bottom:10px;transform:none}
  .revfx-arrow.prev:hover{transform:translateX(-3px)}
  .revfx-arrow.next:hover{transform:translateX(3px)}
}
@media(prefers-reduced-motion:reduce){.revfx-q{transition:none}}

/* interactive venue guide (location) */
.vg{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;margin-top:54px;align-items:start}
.vg-list{display:flex;flex-direction:column}
.vg-item{display:flex;justify-content:space-between;align-items:center;gap:18px;width:100%;text-align:left;background:none;border:none;border-top:1px solid var(--line);padding:20px 12px;cursor:pointer;font:inherit;color:inherit;transition:background .25s}
.vg-item:last-of-type{border-bottom:1px solid var(--line)}
.vg-item .n{display:block;font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-weight:600;font-size:1.34rem;letter-spacing:.03em}
.vg-item .s{display:block;font-size:.85rem;color:var(--ink-soft)}
.vg-item .arr{color:var(--gold);opacity:0;flex:none;transition:opacity .25s,transform .25s}
.vg-item.is-live{background:#fff}
.vg-item.is-live .n{color:var(--gold-deep)}
.vg-item.is-live .arr{opacity:1;transform:translateX(3px)}
.vg-media{position:relative;height:330px;overflow:hidden;border:1px solid var(--line)}
.vg-media img,
.vg-media video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}
.vg-media img.is-live,
.vg-media video.is-live {opacity:1}
.vg-card{background:#fff;border:1px solid var(--line);border-top:none;padding:28px 30px}
.vg-label{font-size:.64rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:10px}
.vg-note{display:none;color:var(--ink-soft);font-size:.97rem;max-width:58ch}
.vg-note.is-live{display:block}
.vg-card .btn{margin-top:20px}
@media(max-width:900px){.vg{grid-template-columns:1fr}.vg-media{height:260px}}

/* count-up stat band */
.statband{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;margin-top:54px;text-align:center}
.statband.cols3{grid-template-columns:repeat(3,1fr)}
.statband b{display:block;font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-style:italic;font-weight:500;font-size:3.3rem;color:var(--gold-deep);line-height:1}
.statband span{display:block;margin-top:12px;font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}
@media(max-width:680px){.statband,.statband.cols3{grid-template-columns:repeat(2,1fr);gap:28px}}

/* how-it-works chapter player (single-service) */
.hiw{display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:54px;align-items:stretch}
.hiw-media{position:relative;min-height:380px;overflow:hidden;border:1px solid var(--line)}
.hiw-media img,
.hiw-media video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}
.hiw-media img.is-live,
.hiw-media video.is-live {opacity:1}
.hiw-steps{display:flex;flex-direction:column;justify-content:center}
.hiw-step{text-align:left;background:none;border:none;border-top:1px solid var(--line);padding:22px 6px;cursor:pointer;font:inherit;color:inherit;opacity:.55;transition:opacity .3s}
.hiw-step:last-of-type{border-bottom:1px solid var(--line)}
.hiw-step.is-live{opacity:1}
.hiw-step .bar{display:block;height:2px;background:var(--line);margin-bottom:16px;position:relative;overflow:hidden}
.hiw-step .bar i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--gold)}
.hiw-step .bar i.run{animation:hiwfill 5s linear forwards}
@keyframes hiwfill{from{width:0}to{width:100%}}
.hiw-step .k{font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-style:italic;font-weight:500;font-size:1.5rem;color:var(--gold);margin-right:12px}
.hiw-step .t{display:inline;font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-weight:600;font-size:1.38rem;letter-spacing:.04em}
.hiw-step p{color:var(--ink-soft);font-size:.94rem;margin-top:8px;max-width:48ch}
@media(max-width:900px){.hiw{grid-template-columns:1fr}.hiw-media{min-height:260px;height:260px}}
@media(prefers-reduced-motion:reduce){.hiw-step .bar i.run{animation:none;width:100%}}

/* included list (single-service) */
.inc-list{display:grid;grid-template-columns:1fr 1fr;gap:18px 44px;margin-top:48px;list-style:none;padding:0}
.inc-list li{border-top:1px solid var(--line);padding:18px 4px 0}
.inc-list b{display:block;font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-weight:600;font-size:1.28rem;margin-bottom:6px;letter-spacing:.03em}
.inc-list span{color:var(--ink-soft);font-size:.95rem}
@media(max-width:680px){.inc-list{grid-template-columns:1fr}}


/* card link line (what-we-offer / booths-that-fit cards) */
.booth .bn{margin-top:14px;font-style:italic;color:var(--gold-deep);font-size:.95rem}

/* featured package card + card buttons (services) */
.booth .pill{display:inline-block;background:var(--gold);color:var(--paper);font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;padding:6px 14px;border-radius:999px;margin-bottom:14px}
.booth.is-featured{border-color:var(--gold)}
.booth .btn{margin-top:20px;padding:13px 26px}

/* wedding timeline walker (occasion) */
.tl-rail{display:flex;gap:10px;flex-wrap:wrap;margin-top:54px}
.tl-stop{flex:1;min-width:150px;background:none;border:1px solid var(--line);padding:16px 10px;text-align:center;cursor:pointer;font:inherit;color:var(--ink-soft);transition:border-color .25s,color .25s,background .25s}
.tl-stop b{display:block;font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-weight:600;font-size:1.5rem;color:var(--ink);letter-spacing:.04em;line-height:1.2}
.tl-stop span{font-size:.64rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.tl-stop.is-live{border-color:var(--gold);background:#fff;color:var(--gold-deep)}
.tl-stop.is-live b{color:var(--gold-deep)}
.tl-stage{display:grid;grid-template-columns:1.05fr .95fr;margin-top:18px}
.tl-media{position:relative;height:400px;overflow:hidden;border:1px solid var(--line);border-right:none}
.tl-media img,
.tl-media video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}
.tl-media img.is-live,
.tl-media video.is-live {opacity:1}
.tl-card{background:#fff;border:1px solid var(--line);padding:38px 36px;display:flex;flex-direction:column;justify-content:center}
.tl-label{font-size:.64rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:12px}
.tl-note{display:none;color:var(--ink-soft);max-width:52ch}
.tl-note.is-live{display:block}
.tl-card .btn{margin-top:24px;align-self:flex-start}
@media(max-width:900px){.tl-stage{grid-template-columns:1fr}.tl-media{border-right:1px solid var(--line);border-bottom:none;height:280px}}