/* ============================================================
   RMG location / venue templates: DARK-GLASS skin (.v8hub)
   ------------------------------------------------------------
   This file re-skins the geo + venue landing templates from the
   old cream `.v8loc` system to the approved dark-glass `.v8hub`
   system. It is the geo sibling of dark-content.css: the same
   dark field, the same glass, the same gold script.

   It carries ONLY the geo-specific pieces that hub.css and
   dark-content.css do not already provide: the breadcrumb hero,
   the local intro band, the two-craft tiles, the venue cards
   grid, the Wedding Hub callout, the local testimonial panel and
   the town/county/venue interlink chips.

   Everything generic is reused verbatim and NOT redefined here:
     - tokens, base type, .container, .section, .btn, .btn-primary,
       .eyebrow, .script, .lead, .reveal, .panel-glass, the .faq*
       accordion and the .bg-field come from hub.css.
     - the content hero (.dhero), the final CTA (.dfinal) and the
       frosted enquiry form (.enquiry/.formcard) come from
       dark-content.css.

   Every selector is scoped under .v8hub so the dark theme can
   never leak into the homepage (.v8), the cream .v8loc pages, the
   portal, the CRM/dashboard or anywhere else. Google Fonts are
   already loaded in index.html, so nothing font-related is
   imported here. No tokens, no .btn, no .glass, no .faq are
   redefined: they all inherit from hub.css.
   ============================================================ */

/* ============================================================
   GEO HERO  (.ghero)
   Image-backed hero with a breadcrumb, sitting inside the .v8hub
   dark field. Mirrors the dark-content .dhero scrim so cream type
   and the gold script always read, and adds the breadcrumb +
   hero CTA row that the geo template needs.
   ============================================================ */
.v8hub .ghero{position:relative;min-height:100vh;display:flex;align-items:flex-end;overflow:hidden;padding:140px 0 60px}
.v8hub .ghero .gbg{position:absolute;inset:0;background-size:cover;background-position:center 30%;z-index:0}
.v8hub .ghero::after{content:"";position:absolute;inset:0;z-index:1;background:
  linear-gradient(180deg,rgba(15,21,18,.34),rgba(0,40,24,.5) 44%,rgba(15,21,18,.92)),
  radial-gradient(70% 60% at 18% 100%,rgba(0,96,58,.45),transparent 70%)}
.v8hub .ghero-inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;width:100%;padding:0 40px;color:var(--cream)}
.v8hub .ghero .crumb{font-family:var(--font-label);font-size:var(--fs-meta);color:rgba(255,250,241,.72);letter-spacing:.04em;margin-bottom:18px}
.v8hub .ghero .crumb a:hover{color:var(--gold-light)}
.v8hub .ghero .crumb span{opacity:.5;margin:0 7px}
.v8hub .ghero h1{font-size:clamp(2.6rem,6vw,5rem);line-height:.98;color:var(--cream);text-shadow:0 2px 30px rgba(0,0,0,.5)}
.v8hub .ghero h1 .script{color:var(--gold-light);font-size:.62em}
.v8hub .ghero p{font-size:var(--fs-lead);color:rgba(255,250,241,.9);font-weight:300;margin:18px 0 28px;max-width:46ch}
.v8hub .ghero-ctas{display:flex;gap:14px;flex-wrap:wrap}

/* glass CTA used on the geo hero + final block (dark-glass variant) */
.v8hub .btn-glass{background:rgba(255,250,241,.12);border-color:rgba(255,250,241,.5);color:var(--cream);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.v8hub .btn-glass:hover{background:rgba(255,250,241,.2);border-color:var(--cream)}

/* ============================================================
   LOCAL INTRO BAND  (.intro)
   The unique-per-town opening. A narrow editorial column of cream
   prose over the dark field, signed off by Aaron & Hayden.
   ============================================================ */
.v8hub .intro .container{max-width:920px}
.v8hub .intro .eyebrow{margin-bottom:14px}
.v8hub .intro h2 .script{color:var(--gold-light)}
.v8hub .intro p{font-size:var(--fs-lead);color:rgba(255,250,241,.84);font-weight:300;margin-top:18px;line-height:1.85}
.v8hub .intro .sig{margin-top:24px;display:flex;align-items:center;gap:14px;font-family:var(--font-label);font-size:var(--fs-meta);color:rgba(255,250,241,.66)}
.v8hub .intro .sig b{color:var(--gold-light);font-family:var(--font-display);font-weight:400;font-size:var(--fs-body)}

/* ============================================================
   TWO CRAFTS  (.crafts)
   Photography + Film, as two image-backed tiles with a green→ink
   scrim. Reuses the dark scrim idiom from the film cards.
   ============================================================ */
.v8hub .crafts{padding:60px 0}
.v8hub .crafts-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.v8hub .craft{position:relative;border-radius:18px;overflow:hidden;min-height:320px;padding:30px;display:flex;flex-direction:column;justify-content:flex-end;color:var(--cream);
  border:1px solid var(--rule-light);box-shadow:0 24px 60px -34px rgba(0,0,0,.7)}
.v8hub .craft .cbg{position:absolute;inset:0;background-size:cover;background-position:center 30%;transition:.8s var(--ease)}
.v8hub .craft::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12),transparent 32%,rgba(0,40,24,.9))}
.v8hub .craft:hover .cbg{transform:scale(1.06)}
.v8hub .craft>*{position:relative;z-index:2}
.v8hub .craft h3{font-family:var(--font-display);font-weight:400;color:var(--cream);font-size:1.7rem;margin-bottom:8px}
.v8hub .craft p{font-size:var(--fs-meta);color:rgba(255,250,241,.9);font-weight:300}

/* ============================================================
   VENUE CARDS  (.venues / .vgrid / .venue)
   "Where we shoot": a header row plus a grid of frosted glass
   venue cards. Glass cards replace the old white cards so they
   sit in the dark family.
   ============================================================ */
.v8hub .venues .vhead{display:grid;grid-template-columns:1fr 1.3fr;gap:50px;align-items:end;margin-bottom:46px}
.v8hub .venues .vhead .eyebrow{margin-bottom:10px}
.v8hub .venues .vhead h2 .script{color:var(--gold-light)}
.v8hub .venues .vhead .lead{color:rgba(255,250,241,.78)}
.v8hub .vgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.v8hub .venue{border-radius:18px;overflow:hidden;background:var(--glass);border:1px solid var(--glass-brd);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--gshadow);position:relative}
.v8hub .venue .vimg{height:170px;background-size:cover;background-position:center 30%}
.v8hub .venue .vbody{padding:22px;position:relative;z-index:1}
.v8hub .venue h4{font-family:var(--font-display);font-weight:400;font-size:var(--fs-lead);color:var(--cream);margin-bottom:6px}
.v8hub .venue p{font-size:var(--fs-meta);color:rgba(255,250,241,.78);font-weight:300}

/* ============================================================
   WEDDING HUB CALLOUT  (.hubcta)
   A single wide green→deep panel with a gold bloom, holding the
   "your private Wedding Hub" pitch and the link into the Hub.
   ============================================================ */
.v8hub .hubcta{padding:30px 0}
.v8hub .hubcta .panel{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;border-radius:24px;padding:44px;
  background:linear-gradient(120deg,var(--green),var(--green-deep));border:1px solid var(--glass-brd);color:var(--cream);position:relative;overflow:hidden;
  box-shadow:0 30px 80px -30px rgba(0,30,18,.7)}
.v8hub .hubcta .panel::after{content:"";position:absolute;top:-120px;right:-100px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(208,165,74,.28),transparent 65%);pointer-events:none}
.v8hub .hubcta .panel>*{position:relative;z-index:1}
.v8hub .hubcta .eyebrow,.v8hub .hubcta .eyebrow.light{color:var(--gold-light)}
.v8hub .hubcta h3{font-family:var(--font-display);font-weight:400;color:var(--cream);font-size:1.9rem}
.v8hub .hubcta h3 .script{color:var(--gold-light)}
.v8hub .hubcta p{color:rgba(255,250,241,.88);font-weight:300;margin:12px 0 0}
.v8hub .hubcta .side{text-align:right}

/* ============================================================
   LOCAL TESTIMONIAL  (.gtesti)
   A centred frosted glass panel holding the sample local review.
   Reuses .panel-glass from hub.css for the frosted slab; this only
   styles the quote type and the attribution line.
   ============================================================ */
.v8hub .gtesti{padding:70px 0}
.v8hub .gtesti .panel{max-width:900px;margin:0 auto;padding:48px;text-align:center}
.v8hub .gtq{font-family:var(--font-display);font-size:clamp(1.4rem,2.6vw,2rem);color:var(--cream);line-height:1.4}
.v8hub .gtq em{font-family:var(--font-script);font-style:normal;color:var(--gold-light)}
.v8hub .gtw{font-family:var(--font-label);font-size:var(--fs-meta);color:rgba(255,250,241,.6);margin-top:16px}

/* ============================================================
   INTERLINK  (.interlink)
   Town / county / venue / nearby-areas chips. Critical for SEO,
   so every link is preserved. This only restyles the chips to
   dark glass with a gold-on-hover fill.
   ============================================================ */
.v8hub .interlink{padding:60px 0}
.v8hub .interlink .panel{border-radius:22px;padding:40px;background:var(--glass);border:1px solid var(--glass-brd);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--gshadow);position:relative;overflow:hidden}
.v8hub .interlink .panel::before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at 100% 0,rgba(208,165,74,.12),transparent 55%)}
.v8hub .interlink .panel>*{position:relative;z-index:1}
.v8hub .interlink h3{font-family:var(--font-display);font-weight:400;color:var(--cream);font-size:1.5rem;margin-bottom:8px}
.v8hub .interlink .lead{color:rgba(255,250,241,.78)}
.v8hub .ilrow{margin-top:18px}
.v8hub .ilrow .ill{font-family:var(--font-label);font-size:var(--fs-meta);color:var(--gold-light);letter-spacing:.04em;margin-bottom:10px}
.v8hub .ilchips{display:flex;flex-wrap:wrap;gap:10px}
.v8hub .ilchips a{display:inline-flex;align-items:center;min-height:44px;font-family:var(--font-label);font-size:var(--fs-meta);color:var(--cream);background:rgba(255,250,241,.06);border:1px solid var(--rule-light);border-radius:100px;padding:9px 18px;transition:.2s var(--ease)}
.v8hub .ilchips a:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}

/* ============================================================
   FINAL CTA: geo deltas only
   The frosted enquiry form (.enquiry/.formcard) and the centred
   CTA card (.dfinal) both come from dark-content.css. The geo
   template renders the form as a bare .gform (not wrapped in
   .enquiry), carries an extra small-print line (.sc) and a phone
   CTA row (.ctas), so those few pieces are styled here, reusing
   the dark-content field treatment.
   ============================================================ */
.v8hub .gfinal{padding:110px 0;text-align:center;position:relative;overflow:hidden}
.v8hub .gfinal .stage{position:absolute;inset:0;background-size:cover;background-position:center 30%;z-index:0}
.v8hub .gfinal::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(15,21,18,.78),rgba(0,40,24,.9)),radial-gradient(60% 50% at 50% 0,rgba(208,165,74,.16),transparent 65%)}
.v8hub .gfinal .container{position:relative;z-index:2}
.v8hub .gfinal .card{max-width:720px;margin:0 auto;color:var(--cream)}
.v8hub .gfinal .eyebrow,.v8hub .gfinal .eyebrow.light{color:var(--gold-light)}
.v8hub .gfinal h2{color:var(--cream)}
.v8hub .gfinal h2 .script{color:var(--gold-light);display:block}
.v8hub .gfinal p{color:rgba(255,250,241,.86);font-weight:300;margin:16px auto 14px;max-width:44ch}
.v8hub .gfinal .sc{font-family:var(--font-label);font-size:var(--fs-meta);color:var(--gold-light);margin-bottom:26px}
.v8hub .gfinal .ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* enquiry form: frosted glass card with dark fields (geo .gform variant,
   matching the .enquiry/.formcard treatment in dark-content.css) */
.v8hub .gform{position:relative;z-index:2;max-width:560px;margin:30px auto 0;padding:34px;text-align:left;border-radius:22px;
  background:var(--glass);border:1px solid var(--glass-brd);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--gshadow);overflow:hidden}
.v8hub .gform::before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at 0 0,rgba(255,255,255,.12),transparent 45%),radial-gradient(circle at 100% 100%,rgba(208,165,74,.1),transparent 55%)}
.v8hub .gform>*{position:relative;z-index:1}
.v8hub .gform .field{margin-bottom:14px}
.v8hub .gform label{display:block;font-family:var(--font-label);font-size:var(--fs-meta);font-weight:500;letter-spacing:.04em;color:rgba(255,250,241,.78);margin-bottom:7px}
.v8hub .gform input,
.v8hub .gform textarea{width:100%;font-family:var(--font-body);font-size:var(--fs-body);color:var(--cream);background:rgba(255,250,241,.06);border:1px solid var(--rule-light);border-radius:12px;padding:13px 15px;transition:border-color .2s var(--ease),background .2s var(--ease)}
.v8hub .gform input::-moz-placeholder, .v8hub .gform textarea::-moz-placeholder{color:rgba(255,250,241,.4)}
.v8hub .gform input::placeholder,
.v8hub .gform textarea::placeholder{color:rgba(255,250,241,.4)}
.v8hub .gform input:focus,
.v8hub .gform textarea:focus{outline:none;border-color:var(--gold);background:rgba(255,250,241,.1)}
.v8hub .gform textarea{resize:none}
.v8hub .gform input[type="date"]{color-scheme:dark}
.v8hub .gform .gbtn{width:100%;margin-top:6px}
.v8hub .gform .gbtn:disabled{opacity:.65;cursor:not-allowed}
.v8hub .gform .fmsg{font-family:var(--font-label);font-size:var(--fs-meta);text-align:center;margin-top:14px}
.v8hub .gform .fmsg.ok{color:var(--gold-light)}
.v8hub .gform .fmsg.err{color:#ff9a8f}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:980px){
  .v8hub .ghero{padding:120px 0 44px;min-height:auto}
  .v8hub .ghero-inner{padding:0 20px}
  .v8hub .crafts{padding:40px 0}
  .v8hub .crafts-grid,.v8hub .hubcta .panel,.v8hub .venues .vhead{grid-template-columns:1fr;gap:22px}
  .v8hub .vgrid{grid-template-columns:1fr 1fr}
  .v8hub .hubcta .side{text-align:left}
  .v8hub .gfinal{padding:70px 0}
}
@media(max-width:560px){.v8hub .vgrid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){
  .v8hub .reveal{opacity:1;transform:none}
  .v8hub *{animation:none!important;transition:none!important}
}

/* Wedding Hub band alignment (geo pages).
   The shared HubStrip defaults to a 1180 centred card, which sits ~30px more
   inset than every other section on a geo page (whose .container caps at
   --maxw 1320 with a 40px gutter). Give the band the same 40px page gutter and
   cap its card to the container's content width (1320 - 2*40 = 1240) so the
   card edge lines up with all the other content. Mirrors the Contact and Areas
   HubStrip overrides. */
.v8hub .hubstrip{padding-left:40px;padding-right:40px}
.v8hub .hubstrip .hs-in{max-width:1120px}
@media(max-width:768px){.v8hub .hubstrip{padding-left:20px;padding-right:20px}}

/* ============================================================================
   GEO MEDIA BREAKS
   The geo pages were very copy-heavy (only a hero and a closing image). These
   classes break the prose up with real RMG work photography, the Wedding Hub
   explainer video, and two image CTA cards (Packages + Real Weddings). All sit
   inside .container so they share the page margin. Reused across every geo page.
   ============================================================================ */

/* Full-width image band */
.v8hub .geo-fig{margin:0;border-radius:18px;overflow:hidden;position:relative}
.v8hub .geo-fig img{width:100%;height:auto;-o-object-fit:cover;object-fit:cover;-o-object-position:center 30%;object-position:center 30%;aspect-ratio:16/7}
.v8hub .geo-fig figcaption{position:absolute;left:24px;bottom:18px;z-index:2;color:var(--cream);
  font-family:var(--font-label);font-size:var(--fs-meta);letter-spacing:.16em;text-transform:uppercase;
  text-shadow:0 2px 24px rgba(0,0,0,.7)}
.v8hub .geo-fig::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 52%,rgba(11,15,12,.55))}

/* Wedding Hub explainer video */
.v8hub .geo-video{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:16/9;
  background:#0b0f0c;border:1px solid var(--glass-brd)}
.v8hub .geo-video video{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center 30%;object-position:center 30%}

/* CTA cards (Packages / Real Weddings) */
.v8hub .geo-cta{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.v8hub .geo-cta-card{position:relative;isolation:isolate;border-radius:18px;overflow:hidden;
  min-height:290px;display:flex;flex-direction:column;justify-content:flex-end;padding:32px;
  text-decoration:none;color:var(--cream)}
.v8hub .geo-cta-card .gc-bg{position:absolute;inset:0;z-index:-2;background-size:cover;
  background-position:center 30%;transition:transform .7s var(--ease)}
.v8hub .geo-cta-card::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(11,15,12,.18),rgba(11,15,12,.84))}
.v8hub .geo-cta-card:hover .gc-bg{transform:scale(1.06)}
.v8hub .geo-cta-card .gc-eyebrow{font-family:var(--font-label);font-size:var(--fs-meta);
  letter-spacing:.18em;text-transform:uppercase;color:var(--gold-light);margin-bottom:10px}
.v8hub .geo-cta-card h3{font-family:var(--font-display);font-weight:400;color:var(--cream);
  font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15;margin-bottom:8px}
.v8hub .geo-cta-card p{font-family:var(--font-body);color:rgba(246,241,230,.82);
  font-size:var(--fs-body);line-height:1.55;margin-bottom:16px;max-width:40ch}
.v8hub .geo-cta-card .gc-go{font-family:var(--font-label);font-size:var(--fs-label);
  letter-spacing:.16em;text-transform:uppercase;color:var(--cream)}
.v8hub .geo-cta-card .gc-go::after{content:" \2192"}

@media(max-width:768px){
  .v8hub .geo-cta{grid-template-columns:1fr}
  .v8hub .geo-fig img{aspect-ratio:4/3}
  .v8hub .geo-cta-card{min-height:230px;padding:24px}
}

/* Geo FAQ, Packages style: a centred, simple, always-open Q and A column with a
   hairline divider and a serif question, matching /packages. Replaces the
   left-aligned accordion so the section reads clean and elegant. */
.v8hub .faq-centered .sec-top{text-align:center;max-width:720px;margin-left:auto;margin-right:auto}
.v8hub .faq-simple{max-width:820px;margin:0 auto}
.v8hub .faq-simple .faq-q{border-top:1px solid var(--rule-light);padding:24px 0;text-align:center}
.v8hub .faq-simple .faq-q:last-child{border-bottom:1px solid var(--rule-light)}
.v8hub .faq-simple .faq-q h4{font-family:var(--font-display);font-weight:400;font-size:1.3rem;line-height:1.35;color:var(--cream);margin-bottom:10px;text-align:center}
.v8hub .faq-simple .faq-q p{font-family:var(--font-body);color:rgba(246,241,230,.72);font-size:var(--fs-body);line-height:1.65}

/* Two-up image pair (reuses .geo-fig for caption + gradient). */
.v8hub .geo-duo{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.v8hub .geo-duo .geo-fig img{aspect-ratio:4/3;height:100%}
@media(max-width:768px){.v8hub .geo-duo{grid-template-columns:1fr}}

/* ---- Geo pages: match the normal-page hero rule and content column ----
   The geo hero was only 74vh while the site's shared hero (.phero) is full
   height, and the geo content column was 1320 while the inner pages use 1200.
   Bring both into line so the geo pages sit consistently with the rest of the
   site. Scoped to .content-sec (geo only) and the geo .dhero.tall. */
.v8hub .dhero.tall{min-height:100vh}
.v8hub .dhero.tall .dhero-in{max-width:1200px}
.v8hub .content-sec .container{max-width:1200px}
@media(max-width:768px){
  .v8hub .dhero.tall{min-height:100vh}
}

/* Centre the geo hero content, matching the site's other heroes (.phero /
   .dhero-center). The geo .dhero was bottom-left aligned; this stacks the
   eyebrow, headline and lead centred like every other page. */
.v8hub .dhero.tall{align-items:center;justify-content:center;text-align:center}
.v8hub .dhero.tall .dhero-in{display:flex;flex-direction:column;align-items:center;text-align:center}
.v8hub .dhero.tall .dhero-in p{margin-left:auto;margin-right:auto}

/* Opener section set to two text columns with no heading rail (.pcol). The
   editorial heading+prose grid is cancelled and the prose flows across two
   balanced columns so the long opener reads more easily. */
.v8hub .content-sec.pcol .container:has(> .prose-dark){display:block}
.v8hub .content-sec.pcol .container:has(> .prose-dark) > .prose-dark{max-width:none;-moz-column-count:2;column-count:2;-moz-column-gap:56px;column-gap:56px}
.v8hub .content-sec.pcol .prose-dark p{-moz-column-break-inside:auto;break-inside:auto;margin-bottom:18px}
@media(max-width:768px){
  .v8hub .content-sec.pcol .container:has(> .prose-dark) > .prose-dark{-moz-column-count:1;column-count:1}
}

/* Centred prose section (.ctr): heading and body centred in a narrow column,
   cancelling the editorial heading-rail grid. Used for the primary-service and
   local-context sections on the geo pages. */
.v8hub .content-sec.ctr .container:has(> .prose-dark){display:block;text-align:center}
.v8hub .content-sec.ctr .container:has(> .prose-dark) > .sec-top{max-width:720px;margin:0 auto 34px;position:static;text-align:center}
.v8hub .content-sec.ctr .container:has(> .prose-dark) > .prose-dark{max-width:720px;margin:0 auto;text-align:center}
.v8hub .content-sec.ctr .container:has(> .prose-dark) > .spec-card{max-width:760px;margin:28px auto 0}

/* When a .pcol section keeps its heading (e.g. Why couples choose us), the
   heading sits on top rather than in a sticky rail. */
.v8hub .content-sec.pcol .container:has(> .prose-dark) > .sec-top{position:static;margin:0 auto 32px;max-width:720px;text-align:center}

/* Standalone glass-card break, sits between the two centred geo sections. */
.v8hub .content-sec.spec-sec{padding:20px 0}
.v8hub .spec-break{max-width:860px;margin-left:auto;margin-right:auto}

/* "Keep looking" cards: photo-backed glass cards matching the Areas We Cover
   location cards, centred grid. Each card carries a background (nearby town
   photos from the areas page; Real Weddings, Areas and Packages use their own
   page hero). */
.v8hub .keep-sec .sec-top{max-width:720px;margin:0 auto 44px;text-align:center;position:static}
/* Centre the intro blurb block itself, not just its text. Its max-width would
   otherwise sit flush-left inside the centred header. */
.v8hub .keep-sec .sec-top p{margin-left:auto;margin-right:auto}
.v8hub .keep-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
.v8hub .keep-card{flex:0 1 300px;position:relative;min-width:0;overflow:hidden;text-decoration:none;color:var(--cream);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;
  min-height:200px;padding:36px 30px;border-radius:20px;
  background:rgba(15,21,18,.62);border:1px solid var(--glass-brd);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  box-shadow:var(--gshadow);transition:transform .4s var(--ease),border-color .3s ease}
.v8hub .keep-card:hover{transform:translateY(-4px);border-color:var(--gold-soft)}
.v8hub .keep-card .keep-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center 30%;
  opacity:.3;transition:opacity .4s ease,transform .6s var(--ease)}
.v8hub .keep-card:hover .keep-bg{opacity:.42;transform:scale(1.05)}
.v8hub .keep-card::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(15,21,18,.35),rgba(15,21,18,.72))}
.v8hub .keep-card > *{position:relative;z-index:2}
.v8hub .keep-card .keep-name{font-family:var(--font-display);font-weight:400;font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1.1;color:var(--cream);margin:0;text-shadow:0 2px 18px rgba(0,0,0,.5)}
.v8hub .keep-card .keep-sub{font-family:var(--font-label);font-size:var(--fs-meta);color:rgba(255,250,241,.82);max-width:26ch}

/* Glass button pair placed after content sections (matches the site header
   .cine-btn: liquid glass, gold border and lift on hover). Two per row,
   centred: check your date / call now, or packages / contact where fitting. */
.v8hub .geo-btns{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:38px}
/* Homepage-style pill button: underline at rest that unfolds into a liquid
   glass fill on hover. Ported from the .v8in inner-page button into the .v8hub
   dark geo scope. Primary = gold, ghost = cream. */
.v8hub .btn-outline{
  position:relative;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;gap:10px;
  padding:14px 30px;border-radius:100px;font-family:var(--font-label);font-size:var(--fs-label);letter-spacing:.28em;text-transform:uppercase;font-weight:500;
  text-decoration:none;background:transparent;border:1px solid transparent;box-sizing:border-box;
  isolation:isolate;transition:color .35s ease,transform .4s cubic-bezier(.22,.61,.36,1)}
.v8hub .btn-outline::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(233,200,126,.5);background:transparent;
  clip-path:inset(calc(100% - 1px) 22px 0 22px round 100px);-webkit-clip-path:inset(calc(100% - 1px) 22px 0 22px round 100px);
  transition:clip-path .3s cubic-bezier(.22,.61,.36,1) .18s;z-index:0}
.v8hub .btn-outline::after{
  content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:calc(100% - 44px);height:1px;background:rgba(233,200,126,.5);pointer-events:none;z-index:1;opacity:1;transition:opacity .12s linear 0s}
.v8hub .btn-outline .btn-glass{
  position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,250,241,.14),rgba(255,250,241,.06));
  backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 0 0 1px rgba(255,255,255,.08) inset,0 18px 40px -18px rgba(0,0,0,.55);
  opacity:0;visibility:hidden;transition:opacity .18s cubic-bezier(.22,.61,.36,1) 0s,visibility 0s linear .18s;z-index:0}
.v8hub .btn-outline .btn-label{position:relative;z-index:2;display:inline-flex;align-items:center}
.v8hub .btn-outline:hover,.v8hub .btn-outline:focus-visible{transform:scale(1.015);outline:none}
.v8hub .btn-outline:hover::before,.v8hub .btn-outline:focus-visible::before{clip-path:inset(0 0 0 0 round 100px);-webkit-clip-path:inset(0 0 0 0 round 100px);transition-delay:0s}
.v8hub .btn-outline:hover::after,.v8hub .btn-outline:focus-visible::after{opacity:0;transition-delay:.26s}
.v8hub .btn-outline:hover .btn-glass,.v8hub .btn-outline:focus-visible .btn-glass{opacity:1;visibility:visible;transition:opacity .18s cubic-bezier(.22,.61,.36,1) .32s,visibility 0s linear .32s}
.v8hub .btn-outline-primary{color:var(--gold-light)}
.v8hub .btn-outline-primary::after{background:rgba(208,165,74,.85)}
.v8hub .btn-outline-primary::before{border-color:rgba(208,165,74,.7)}
.v8hub .btn-outline-primary .btn-glass{background:linear-gradient(180deg,rgba(233,200,126,.24),rgba(208,165,74,.12));box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 0 0 1px rgba(233,200,126,.18) inset,0 18px 40px -18px rgba(0,0,0,.5)}
.v8hub .btn-outline-primary:hover,.v8hub .btn-outline-primary:focus-visible{color:#F3D89A}
.v8hub .btn-outline-ghost{color:rgba(255,250,241,.85)}
.v8hub .btn-outline-ghost::after{background:rgba(255,250,241,.55)}
.v8hub .btn-outline-ghost::before{border-color:rgba(255,250,241,.4)}
.v8hub .btn-outline-ghost:hover,.v8hub .btn-outline-ghost:focus-visible{color:#FFFAF1}
@media(prefers-reduced-motion:reduce){
  .v8hub .btn-outline::before{clip-path:inset(0 0 0 0 round 100px);-webkit-clip-path:inset(0 0 0 0 round 100px);opacity:0;transition:opacity .18s ease}
  .v8hub .btn-outline .btn-glass{transition:opacity .18s ease}
  .v8hub .btn-outline:hover::before,.v8hub .btn-outline:focus-visible::before{opacity:1;transition-delay:0s}
  .v8hub .btn-outline:hover .btn-glass,.v8hub .btn-outline:focus-visible .btn-glass{transition-delay:0s}
  .v8hub .btn-outline:hover,.v8hub .btn-outline:focus-visible{transform:none}
}

/* Centre a page-local review/testimonial card inside a centred (.ctr) section
   (its own page style only sets margin-top, leaving it left-aligned). */
.v8hub .content-sec.ctr .review-card{margin-left:auto;margin-right:auto}

/* Filmed testimonial: a single centred vertical (9:16) video in place of a
   text review card. Stars removed. */
.v8hub .geo-vtesti{max-width:380px;margin:34px auto 0;text-align:center}
.v8hub .geo-vtesti-wrap{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:9/16;background:#0b0f0c;border:1px solid var(--glass-brd);box-shadow:var(--gshadow)}
.v8hub .geo-vtesti-wrap video{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center 30%;object-position:center 30%;display:block}
.v8hub .geo-vtesti-cite{margin-top:14px;font-family:var(--font-label);font-size:var(--fs-meta);letter-spacing:.04em;color:rgba(255,250,241,.7)}
