/* =====================================================================
   MUEVO · Pro components (pricing table, horizontal calendar, full flow)
   Token-driven + responsive. Loaded after muevo-portal.css.
   ===================================================================== */

/* ---------------- pricing table (packages) — faithful to project .price-card ---------------- */
.mv-pricing-wrap{ container-type:inline-size; }
.mv-pricing{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; align-items:stretch; }
@container (max-width:640px){ .mv-pricing{ grid-template-columns:1fr; } }
.mv-pcard{ position:relative; overflow:hidden; display:flex; flex-direction:column;
  background:var(--muevo-surface); border:var(--muevo-stroke-width) solid var(--muevo-border); border-radius:var(--muevo-radius-lg);
  padding:32px; transition:border-color .5s, transform .5s var(--muevo-ease), background .5s; }
.mv-pcard:hover{ transform:translateY(-6px); border-color:var(--muevo-border-strong); }
.mv-pcard.feat{ background:var(--muevo-feature-fill); border-color:var(--muevo-border-strong); }
.mv-pcard .pk{ font-family:var(--muevo-font-mono); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muevo-primary); }
.mv-pcard h3{ font-family:var(--muevo-font-display); font-weight:var(--muevo-display-weight); font-size:1.55rem; letter-spacing:-.01em; margin:14px 0 6px; color:var(--muevo-text); }
.mv-pcard .amt{ font-family:var(--muevo-font-display); font-size:2.6rem; font-weight:300; letter-spacing:-.02em; margin-top:10px; line-height:1; color:var(--muevo-text); }
.mv-pcard .amt small{ font-family:var(--muevo-font); font-size:.9rem; color:var(--muevo-text-muted); font-weight:400; }
.mv-pcard .pdesc{ color:var(--muevo-text-muted); font-size:.9rem; margin-top:6px; }
.mv-pcard ul{ list-style:none; margin:24px 0; padding:0; display:flex; flex-direction:column; gap:13px; flex:1; }
.mv-pcard ul li{ display:flex; gap:11px; align-items:flex-start; color:var(--muevo-text-soft); font-size:.93rem; }
.mv-pcard ul li svg{ width:18px; height:18px; flex-shrink:0; color:var(--muevo-primary); margin-top:2px; }
.mv-pcard ul li.off{ color:var(--muevo-text-faint); }
.mv-pcard ul li.off svg{ color:var(--muevo-text-faint); }
.mv-pcard .mv-btn{ width:100%; justify-content:center; }
/* two stacked CTAs (Book + Customize) per the handoff package card */
.mv-pcard .pk-actions{ display:flex; flex-direction:column; gap:10px; margin-top:auto; }
.mv-pcard .pk-actions .mv-btn{ width:100%; }
.mv-pcard .pkg-meta{ display:inline-flex; align-items:center; gap:8px; font-family:var(--muevo-font-mono); font-size:.72rem; letter-spacing:.06em; color:var(--muevo-text-muted); margin-top:10px; }
.mv-pcard .pkg-meta svg{ width:14px; height:14px; color:var(--muevo-primary); flex-shrink:0; }
/* diagonal corner ribbon — exactly like project .ribbon */
.mv-ribbon-corner{ position:absolute; top:18px; right:-34px; transform:rotate(45deg); z-index:3;
  background:var(--muevo-primary); color:var(--muevo-on-primary); font-family:var(--muevo-font-mono);
  font-size:.6rem; letter-spacing:.16em; padding:5px 40px; text-transform:uppercase; }
/* no-badge variant: drop ribbon + feat treatment for a plain comparison */
.mv-pricing.no-badge .mv-pcard.feat{ background:var(--muevo-surface); border-color:var(--muevo-border); }
.mv-pricing.no-badge .mv-ribbon-corner{ display:none; }

/* ---------------- horizontal calendar (date strip) ---------------- */
.mv-hcal .hc-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.mv-hcal .hc-month{ font-family:var(--muevo-font-display); font-weight:var(--muevo-display-weight); font-size:1.05rem; color:var(--muevo-text); }
.mv-hstrip{ display:flex; gap:10px; overflow-x:auto; padding:4px 2px 12px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
.mv-hstrip::-webkit-scrollbar{ height:6px; }
.mv-hstrip::-webkit-scrollbar-thumb{ background:var(--muevo-border); border-radius:100px; }
.mv-hday{ scroll-snap-align:start; flex:0 0 auto; width:62px; text-align:center; border:var(--muevo-stroke-width) solid var(--muevo-border);
  border-radius:var(--muevo-radius-md); padding:12px 0; background:var(--muevo-surface); cursor:pointer; transition:.22s var(--muevo-ease); }
.mv-hday .dow{ font-family:var(--muevo-font-mono); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muevo-text-muted); }
.mv-hday .dnum{ font-family:var(--muevo-font-display); font-size:1.3rem; color:var(--muevo-text); margin-top:6px; line-height:1; }
.mv-hday .ddot{ width:5px; height:5px; border-radius:50%; background:var(--muevo-success); margin:7px auto 0; }
.mv-hday:hover{ border-color:var(--muevo-border-strong); }
.mv-hday.sel{ background:var(--muevo-primary); border-color:var(--muevo-primary); }
.mv-hday.sel .dow, .mv-hday.sel .dnum{ color:var(--muevo-on-primary); }
.mv-hday.sel .ddot{ background:var(--muevo-on-primary); }
.mv-hday.off{ opacity:.4; pointer-events:none; }
.mv-hday.off .ddot{ background:var(--muevo-text-faint); }

/* ---------------- 3-phase booking wizard ---------------- */
/* phase 1 category cards reuse .mv-pick; the chevron sits on the right */
.mv-bookwiz [data-hc-cat]{ cursor:pointer; }
.mv-bookwiz [data-hc-cat] .mv-pick-meta .mv-ar{ display:inline-flex; color:var(--muevo-text-faint); transition:transform .25s var(--muevo-ease), color .25s; }
.mv-bookwiz [data-hc-cat]:hover .mv-pick-meta .mv-ar{ transform:translateX(3px); color:var(--muevo-primary); }
/* back link between phases */
.mv-wiz-back{ display:inline-flex; align-items:center; gap:5px; margin-bottom:14px; padding:0; border:0; background:none;
  font:inherit; font-size:.84rem; font-weight:600; color:var(--muevo-text-muted); cursor:pointer; transition:color .2s; }
.mv-wiz-back svg{ width:15px; height:15px; }
.mv-wiz-back:hover{ color:var(--muevo-text); }
/* active CTA — themed: uses the theme accent (gold on luxury, purple on modern/glass, etc.) */
.mv-btn.mv-btn--book{ background:var(--muevo-primary); border-color:var(--muevo-primary); color:var(--muevo-on-primary); }
.mv-btn.mv-btn--book:hover:not(:disabled){ filter:brightness(.94); }
.mv-btn.mv-btn--book:disabled{ opacity:.45; cursor:not-allowed; }
.mv-btn.mv-btn--book .mv-ar{ margin-left:.1em; }
/* RTL (Arabic): mirror directional icons not covered by the core .mv-btn rule —
   the category-card forward arrow and the "back" chevrons between phases/steps. */
[dir="rtl"] .mv-bookwiz [data-hc-cat] .mv-pick-meta .mv-ar{ transform:scaleX(-1); }
[dir="rtl"] .mv-bookwiz [data-hc-cat]:hover .mv-pick-meta .mv-ar{ transform:scaleX(-1) translateX(3px); }
[dir="rtl"] .mv-wiz-back > svg,
[dir="rtl"] .mv-svb-back > svg,
[dir="rtl"] .gx-backlink > svg{ transform:scaleX(-1); }
/* phone-OTP verification block inside the 3-phase booker registration step */
.mv-hcal .hc-verify{ border:1px dashed var(--muevo-border-strong); border-radius:var(--muevo-radius-lg); padding:16px; margin-top:6px; transition:border-color .3s, background .3s; }
.mv-hcal .hc-verify-top{ display:flex; align-items:center; gap:12px; }
.mv-hcal .hc-vic{ width:38px; height:38px; border-radius:50%; flex-shrink:0; display:grid; place-items:center; color:var(--muevo-primary); border:1px solid var(--muevo-border-strong); background:color-mix(in srgb, var(--muevo-primary) 6%, transparent); }
.mv-hcal .hc-vic svg{ width:18px; height:18px; }
.mv-hcal .hc-verify-top b{ font-size:.95rem; display:block; color:var(--muevo-text); }
.mv-hcal .hc-vsub{ display:block; color:var(--muevo-text-muted); font-size:.8rem; }
.mv-hcal .hc-otp{ display:flex; gap:10px; margin-top:14px; }
.mv-hcal .hc-otp input{ width:48px; height:54px; text-align:center; font-family:var(--muevo-font-display); font-size:1.4rem; background:var(--muevo-surface-soft); border:1px solid var(--muevo-border); border-radius:var(--muevo-radius-md); color:var(--muevo-text); outline:none; transition:.2s; }
.mv-hcal .hc-otp input:focus{ border-color:var(--muevo-primary); }
.mv-hcal .hc-verify-actions{ display:flex; align-items:center; gap:12px; margin-top:14px; flex-wrap:wrap; }
.mv-hcal .hc-otphint{ font-family:var(--muevo-font-mono); font-size:.74rem; color:var(--muevo-text-faint); }
.mv-hcal .hc-verify.ok{ border-style:solid; border-color:color-mix(in srgb, var(--muevo-success,#7fb08a) 45%, transparent); background:color-mix(in srgb, var(--muevo-success,#7fb08a) 7%, transparent); }
.mv-hcal .hc-verify.ok .hc-vic{ color:var(--muevo-success,#7fb08a); border-color:color-mix(in srgb, var(--muevo-success,#7fb08a) 45%, transparent); background:color-mix(in srgb, var(--muevo-success,#7fb08a) 12%, transparent); }

/* phase-1 category cards — centered rectangle grid (last row centers) */
.mv-bookcat-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:16px; }
.mv-bookcat{ flex:1 1 220px; max-width:340px; min-height:150px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:13px; text-align:center; cursor:pointer; border:var(--muevo-stroke-width) solid color-mix(in srgb, var(--muevo-primary) 38%, var(--muevo-border));
  border-radius:var(--muevo-radius-lg); padding:26px 20px; background:var(--muevo-surface); transition:.25s var(--muevo-ease); }
.mv-bookcat:hover{ border-color:var(--muevo-primary); transform:translateY(-3px); box-shadow:var(--muevo-shadow-sm); }
.mv-bookcat .ic{ width:54px; height:54px; border-radius:15px; display:grid; place-items:center;
  background:color-mix(in srgb, var(--muevo-primary) 12%, transparent); color:var(--muevo-primary); }
.mv-bookcat .ic svg{ width:25px; height:25px; }
.mv-bookcat .ic img{ width:100%; height:100%; object-fit:cover; border-radius:inherit; }
.mv-cat-cell .ic img{ width:100%; height:100%; object-fit:cover; border-radius:inherit; }
.mv-bookcat b{ font-family:var(--muevo-font-display); font-weight:var(--muevo-display-weight); font-size:1.08rem; color:var(--muevo-text); }
.mv-bookcat small{ color:var(--muevo-text-muted); font-size:.82rem; }
/* fill the screen on desktop; mobile/tablet keep the single-column feel */
.mv-bookwiz{ width:100%; }
@media (max-width:680px){ .mv-bookcat{ flex:1 1 100%; max-width:none; min-height:0; flex-direction:row; gap:16px; text-align:left; justify-content:flex-start; padding:18px; } }

/* ---------------- service catalog grid ---------------- */
.mv-catalog{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; }
.mv-cat-item{ display:flex; flex-direction:column; background:var(--muevo-surface); border:var(--muevo-stroke-width) solid var(--muevo-border);
  border-radius:var(--muevo-radius-md); overflow:hidden; transition:.3s var(--muevo-ease); cursor:pointer; }
.mv-cat-item:hover{ border-color:var(--muevo-border-strong); transform:translateY(-3px); }
.mv-cat-item .ci-media{ aspect-ratio:3/2; }
.mv-cat-item .ci-body{ padding:13px 14px; display:flex; flex-direction:column; gap:4px; }
.mv-cat-item .ci-body b{ font-size:.95rem; color:var(--muevo-text); }
.mv-cat-item .ci-body .ci-meta{ color:var(--muevo-text-muted); font-size:.78rem; }
.mv-cat-item .ci-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:6px; }
.mv-cat-item .ci-foot .p{ font-family:var(--muevo-font-mono); color:var(--muevo-primary); font-size:.82rem; }

/* striped placeholder shared (mirror of .nvp-ph in case used standalone) */
.mv-ph{ position:relative; display:grid; place-items:center; color:var(--muevo-text-faint);
  background-color:var(--muevo-surface-2);
  background-image:repeating-linear-gradient(135deg, color-mix(in srgb, var(--muevo-text) 5%, transparent) 0 8px, transparent 8px 16px);
  font-family:var(--muevo-font-mono); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; }

/* ---------------- service categories — fill container ---------------- */
.mv-catgrid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; }
.mv-cat-cell{ display:flex; align-items:center; gap:13px; width:100%; text-align:start; cursor:pointer;
  background:var(--muevo-surface); border:var(--muevo-stroke-width) solid var(--muevo-border); border-radius:var(--muevo-radius-md);
  padding:15px 16px; transition:.25s var(--muevo-ease); }
.mv-cat-cell:hover{ border-color:var(--muevo-border-strong); transform:translateY(-2px); }
.mv-cat-cell.on{ border-color:var(--muevo-border-strong); background:color-mix(in srgb, var(--muevo-primary) 7%, transparent); }
.mv-cat-cell .ic{ width:40px; height:40px; flex-shrink:0; border-radius:11px; display:grid; place-items:center; color:var(--muevo-primary);
  background:color-mix(in srgb, var(--muevo-primary) 9%, transparent); border:1px solid var(--muevo-border-strong); }
.mv-cat-cell .ic svg{ width:19px; height:19px; }
.mv-cat-cell b{ font-size:.95rem; color:var(--muevo-text); display:block; }
.mv-cat-cell small{ color:var(--muevo-text-muted); font-size:.78rem; }

/* ---------------- gift card — wide / horizontal, responsive ---------------- */
.mv-giftx{ container-type:inline-size; }
.gx-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; }
@container (max-width:560px){ .gx-grid{ grid-template-columns:1fr; } }
.gx-preview{ min-width:0; }
.gx-card{ position:relative; overflow:hidden; aspect-ratio:1.6/1; border-radius:18px; padding:22px; color:#fff;
  display:flex; flex-direction:column; justify-content:space-between; box-shadow:var(--muevo-shadow-md); }
.gx-card::after{ content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(120% 90% at 100% 0, rgba(255,255,255,.22), transparent 55%); }
.gx-card > *{ position:relative; z-index:1; }
.gx-gold{ background:linear-gradient(145deg,#c9a24e,#7a5e23); }
.gx-plum{ background:linear-gradient(145deg,#8a5cd6,#3c2a63); }
.gx-rose{ background:linear-gradient(145deg,#d65a86,#7a2f49); }
.gx-green{ background:linear-gradient(145deg,#1f9b76,#0d4a39); }
.gx-ink{ background:linear-gradient(145deg,#2b3550,#0b0a09); }
.gx-row{ display:flex; align-items:center; justify-content:space-between; }
.gx-brand{ font-family:var(--muevo-font-display); font-weight:600; font-size:1.02rem; }
.gx-chip{ display:inline-flex; align-items:center; gap:5px; font-size:.64rem; background:rgba(255,255,255,.18); border-radius:100px; padding:.3em .7em; }
.gx-chip svg{ width:13px; height:13px; }
.gx-vk{ font-family:var(--muevo-font-mono); font-size:.56rem; letter-spacing:.2em; opacity:.72; display:block; margin-bottom:2px; }
.gx-val > div{ font-family:var(--muevo-font-display); font-weight:300; font-size:2rem; line-height:1; }
.gx-val small{ font-family:var(--muevo-font); font-size:.42em; opacity:.8; }
.gx-msg{ font-size:.8rem; opacity:.9; font-style:italic; min-height:1.1em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gx-foot{ display:flex; align-items:flex-end; justify-content:space-between; font-family:var(--muevo-font-mono); font-size:.58rem; letter-spacing:.1em; opacity:.85; }
.gx-foot b{ font-family:var(--muevo-font); letter-spacing:0; font-weight:600; }
.gx-panel{ min-width:0; }
.gx-step{ display:none; }
.gx-step.on{ display:block; }
.gx-swatches{ display:flex; flex-wrap:wrap; gap:9px; }
.gx-sw{ width:34px; height:34px; border-radius:9px; border:1px solid rgba(0,0,0,.18); cursor:pointer; box-shadow:inset 0 0 0 1px rgba(255,255,255,.18); transition:transform .15s var(--muevo-ease); }
.gx-sw:hover{ transform:scale(1.08); }
.gx-sw.on{ box-shadow:0 0 0 2px var(--muevo-surface),0 0 0 4px var(--muevo-primary); }
.gx-backlink{ background:none; border:0; cursor:pointer; color:var(--muevo-text-muted); font-size:.84rem; font-weight:500; display:inline-flex; align-items:center; gap:4px; padding:0; }
.gx-backlink:hover{ color:var(--muevo-text); }
.gx-backlink svg{ width:15px; height:15px; }

/* ---------------- gift card SECTION (full, branded) ---------------- */
/* Faithful port of Wellness Dream "Cartes cadeaux" section. The voucher card
   keeps its branded gold finish across themes; the surrounding section
   (eyebrow, headings, chips, buttons) follows the live theme tokens. */
.mv-gsec{ container-type:inline-size; width:100%; }
/* Full-width section: the component fills its container and both columns stretch. */
.mv-gsec-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,60px); align-items:center; width:100%; }
/* DESKTOP keeps the original two-column layout: voucher lower-left, composer right
   (the default .mv-gsec-grid above). Only PHONES & TABLETS (viewport <= 1024px)
   stack the columns and fully centre — voucher on top, then centred body text,
   theme swatches, amount chips, delivery toggle, buttons and success state. A
   viewport media query (not a container query) is used on purpose so a desktop
   view always stays two-column, even when the component sits in a narrower column.
   Form inputs keep their left text so addresses/numbers stay readable. */
@media (max-width:1024px){
  .mv-gsec-grid{ grid-template-columns:1fr; gap:40px; }
  .mv-gsec-media{ order:-1; }
  .mv-gsec-body{ text-align:center; }
  .mv-gsec-swatches,.mv-gc-denoms,.mv-gc-meta,.mv-gc-actions,.mv-gsec-step .mv-row{ justify-content:center; }
  .mv-gsec-lead,.mv-gsec-done-p{ margin-inline:auto; }
  .mv-gsec-done-ic{ margin-inline:auto; }
  .mv-gsec .mv-input,.mv-gsec .mv-textarea,.mv-gsec .mv-select{ text-align:left; }
}
.mv-gsec-media{ min-width:0; }
.mv-gc-stack{ position:relative; width:100%; max-width:440px; margin-inline:auto; aspect-ratio:1.6/1; }
.mv-gc-card{ position:absolute; inset:0; border-radius:18px; padding:clamp(20px,3.2vw,30px);
  display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; color:#f4f1ea;
  background:var(--gv-card, linear-gradient(150deg,#211b12 0%,#100d0a 60%)); border:1px solid var(--gv-border, rgba(201,162,78,.30));
  box-shadow:0 44px 90px -34px rgba(0,0,0,.75); transition:background .4s var(--muevo-ease), border-color .4s var(--muevo-ease); }
.mv-gc-card::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 80% at 0 0, var(--gv-glow, rgba(221,192,137,.22)), transparent 55%), radial-gradient(120% 90% at 100% 100%, rgba(255,255,255,.10), transparent 50%); }
.mv-gc-card::after{ content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background:repeating-linear-gradient(115deg, rgba(201,162,78,.05) 0 2px, transparent 2px 13px); }
.mv-gc-card.behind{ transform:rotate(-7deg) translate(-10%,9%) scale(.92); filter:brightness(.7) saturate(.8); z-index:0; }
.mv-gc-card.front{ z-index:1; }
.mv-gc-card > *{ position:relative; z-index:2; }
.mv-gc-top{ display:flex; align-items:center; justify-content:space-between; gap:14px; }
.mv-gc-logo{ font-family:var(--muevo-font-display); font-weight:600; font-size:1.02rem; color:#f4f1ea; }
.mv-gc-logo-img{ height:38px; width:auto; display:block; object-fit:contain; }
.mv-gc-kicker{ font-family:var(--muevo-font-mono); font-size:.62rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gv-accent,#ddc089); }
.mv-gc-amt{ font-family:var(--muevo-font-display); font-weight:300; font-size:clamp(2rem,4.6vw,2.7rem); letter-spacing:-.02em; line-height:1; }
.mv-gc-amt small{ font-family:var(--muevo-font); font-size:.42em; letter-spacing:.06em; color:var(--gv-muted,#a59d92); margin-inline-start:.3em; }
.mv-gc-msg{ font-size:.82rem; color:#d8d2c8; font-style:italic; min-height:1em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mv-gc-bottom{ display:flex; align-items:flex-end; justify-content:space-between; gap:14px; }
.mv-gc-brand{ font-family:var(--muevo-font-mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gv-muted,#a59d92); }
.mv-gc-seal{ width:38px; height:38px; border-radius:50%; border:1px solid var(--gv-border,rgba(201,162,78,.30)); display:grid; place-items:center; color:var(--gv-accent,#c9a24e); background:color-mix(in srgb, var(--gv-accent,#c9a24e) 12%, transparent); flex-shrink:0; }
/* theme-swap animation: voucher lifts up & fades, then re-enters from the top recoloured */
.mv-gc-card.gv-exit{ animation:gvExit .2s var(--muevo-ease) forwards; }
.mv-gc-card.gv-enter{ animation:gvEnter .42s var(--muevo-ease); }
@keyframes gvExit{ from{ transform:translateY(0); opacity:1; } to{ transform:translateY(-30px); opacity:0; } }
@keyframes gvEnter{ 0%{ transform:translateY(-34px); opacity:0; } 100%{ transform:translateY(0); opacity:1; } }
@media (prefers-reduced-motion: reduce){ .mv-gc-card.gv-exit,.mv-gc-card.gv-enter{ animation:none; } }
.mv-gc-seal svg{ width:18px; height:18px; }
/* right column — themed */
.mv-gsec-body{ min-width:0; }
.mv-gsec-eyebrow{ font-family:var(--muevo-font-mono); font-size:.7rem; letter-spacing:var(--muevo-label-spacing); text-transform:uppercase; color:var(--muevo-primary); transition:color .35s var(--muevo-ease); }
.mv-gsec-h2{ font-family:var(--muevo-font-display); font-weight:var(--muevo-display-weight); font-size:clamp(1.7rem,3vw,2.3rem); line-height:1.12; letter-spacing:-.01em; margin:14px 0 0; color:var(--muevo-text); }
/* Gift-card headings — match the website typography: eyebrow with a leading gold
   divider line, and the larger site H2 size. Scoped to .mv-gsec (gift card only). */
.mv-gsec .mv-gsec-eyebrow{ display:inline-flex; align-items:center; gap:.7em; font-size:.72rem; letter-spacing:.34em; }
.mv-gsec .mv-gsec-eyebrow::before{ content:""; width:26px; height:1px; background:var(--muevo-primary); opacity:.6; flex:0 0 auto; }
.mv-gsec .mv-gsec-h2{ font-size:clamp(1.9rem,3.6vw,3rem); }
.mv-gsec-lead{ color:var(--muevo-text-muted); font-size:1rem; line-height:1.6; margin:16px 0 0; max-width:46ch; }
/* small, elegant helper text near the form (max ~3 lines, subtle) */
.mv-gsec-help{ color:var(--muevo-text-muted); font-size:.82rem; line-height:1.5; margin:12px 0 0; max-width:42ch; opacity:.85; }
/* Composer fills its column so the section reads full-width and balanced. */
.mv-gsec-step{ width:100%; max-width:none; }
@media (max-width:1024px){ .mv-gsec-help{ margin-inline:auto; } }
/* Enlarge ONLY the two voucher preview cards (scale 1.2) on desktop; reset when
   the section stacks so it stays responsive and never clips. */
@media (min-width:1025px){ .mv-gsec .mv-gc-stack{ transform:scale(1.2); transform-origin:center; margin-block:42px; } }
.mv-gc-denoms{ display:flex; flex-wrap:wrap; gap:10px; }
.mv-gc-denoms button{ font-family:var(--muevo-font-mono); font-size:.8rem; letter-spacing:.04em; color:var(--muevo-text-soft); cursor:pointer;
  border:1px solid var(--muevo-primary); background:color-mix(in srgb, var(--muevo-text) 1.5%, transparent); border-radius:100px; padding:.6em 1.15em; transition:.3s var(--muevo-ease); }
.mv-gc-denoms button:hover{ border-color:var(--muevo-primary); color:var(--muevo-text); background:color-mix(in srgb, var(--muevo-primary) 7%, transparent); }
.mv-gc-denoms button.active{ background:var(--muevo-primary); border-color:var(--muevo-primary); color:var(--muevo-on-primary); }
.mv-gc-meta{ display:flex; flex-wrap:wrap; gap:12px 26px; margin-top:22px; }
.mv-gc-meta span{ display:inline-flex; align-items:center; gap:8px; font-size:.86rem; color:var(--muevo-text-muted); }
.mv-gc-meta span svg{ width:17px; height:17px; color:var(--muevo-primary); flex-shrink:0; }
.mv-gc-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:26px; justify-content:flex-end; }

/* ---- card theme picker ---- */
.mv-gsec-swatches{ display:flex; flex-wrap:wrap; gap:10px; }
.mv-gsec-sw{ width:34px; height:34px; border-radius:10px; border:1px solid rgba(0,0,0,.18); cursor:pointer;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22); transition:transform .15s var(--muevo-ease), box-shadow .2s var(--muevo-ease); }
.mv-gsec-sw:hover{ transform:scale(1.08); }
.mv-gsec-sw.on{ box-shadow:0 0 0 2px var(--muevo-surface), 0 0 0 4px var(--muevo-primary); }

/* ---- soft gold field borders (scoped to the section) ---- */
.mv-gsec .mv-input, .mv-gsec .mv-textarea, .mv-gsec .mv-select{
  border-color:rgba(201,162,78,.42);
  background:color-mix(in srgb, #c9a24e 4%, var(--muevo-surface)); }
.mv-gsec .mv-input:focus, .mv-gsec .mv-textarea:focus, .mv-gsec .mv-select:focus{
  border-color:rgba(201,162,78,.85); box-shadow:0 0 0 3px rgba(201,162,78,.18); }

/* ---- steps ---- */
.mv-gsec-step{ display:none; }
.mv-gsec-step.on{ display:block; }

/* ---- delivery segmented control ---- */
.mv-gsec-seg{ display:inline-flex; flex-wrap:wrap; }
.mv-gsec-seg button{ display:inline-flex; align-items:center; gap:7px; transition:color .3s var(--muevo-ease), background .3s var(--muevo-ease); }
.mv-gsec-seg button svg{ width:15px; height:15px; }

/* ---- success state ---- */
.mv-gsec-done{ padding-top:8px; }
.mv-gsec-done-ic{ width:54px; height:54px; border-radius:50%; display:grid; place-items:center;
  color:var(--muevo-on-primary); background:var(--muevo-primary); margin-bottom:16px; transition:background .35s var(--muevo-ease); }
.mv-gsec-done-ic svg{ width:26px; height:26px; }
.mv-gsec-done-h{ font-family:var(--muevo-font-display); font-weight:var(--muevo-display-weight); font-size:clamp(1.3rem,2.2vw,1.7rem); line-height:1.2; letter-spacing:-.01em; margin:0 0 10px; color:var(--muevo-text); }
.mv-gsec-done-p{ color:var(--muevo-text-muted); font-size:1rem; line-height:1.6; margin:0 0 22px; max-width:46ch; }
.mv-gsec-done-p b{ color:var(--muevo-text); font-weight:600; }

/* ---------------- booking SECTION (full) ---------------- */
.mv-booksec-head{ text-align:center; max-width:60ch; margin-inline:auto; }
.mv-booksec-head .mv-gsec-eyebrow{ display:inline-block; }
.mv-booksec-head .mv-gsec-lead{ margin-inline:auto; }
.mv-booksec-shell{ margin-top:34px; background:var(--muevo-surface); border:var(--muevo-stroke-width) solid var(--muevo-border);
  border-radius:var(--muevo-radius-lg); padding:clamp(18px,3vw,28px); box-shadow:var(--muevo-shadow-sm); }
.mv-booksec-shell .mv-hcal{ padding-top:0; }

/* ===================================================================
   Services browser  (muevo_catalog)  — category tabs + responsive grid
   =================================================================== */
.mv-svb{ width:100%; }
.mv-svb-head{ margin-bottom:14px; }
.mv-svb-eyebrow{ font-family:var(--muevo-font-mono); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muevo-primary); }
/* category tabs — one open at a time, horizontally scrollable on small screens */
.mv-svb-tabs{ display:flex; flex-wrap:wrap; gap:9px; margin-bottom:22px; }
.mv-svb-tab{ font-family:var(--muevo-font); font-size:.86rem; font-weight:600; color:var(--muevo-text-soft);
  background:color-mix(in srgb, var(--muevo-surface) 60%, transparent); border:var(--muevo-stroke-width) solid var(--muevo-border);
  border-radius:100px; padding:.55em 1.15em; cursor:pointer; transition:.2s; white-space:nowrap; }
.mv-svb-tab:hover{ border-color:var(--muevo-border-strong); color:var(--muevo-text); }
.mv-svb-tab.on{ background:var(--muevo-primary); border-color:var(--muevo-primary); color:var(--muevo-on-primary); }
/* responsive grid: 4-up desktop → 3 tablet → 2 → 1 */
.mv-svc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
@media (max-width:1024px){ .mv-svc-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:720px){ .mv-svc-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){ .mv-svc-grid{ grid-template-columns:1fr; } }
.mv-svc-card{ display:flex; flex-direction:column; background:var(--muevo-surface); border:var(--muevo-stroke-width) solid var(--muevo-border);
  border-radius:var(--muevo-radius-card); overflow:hidden; transition:.25s; }
.mv-svc-card:hover{ transform:translateY(-4px); border-color:var(--muevo-border-strong); box-shadow:var(--muevo-shadow-md); }
.mv-svc-media{ aspect-ratio:16/10; display:grid; place-items:center; }
.mv-svc-ic svg{ width:34px; height:34px; opacity:.9; }
.mv-svc-body{ display:flex; flex-direction:column; gap:8px; padding:15px 16px 16px; flex:1; }
.mv-svc-name{ font-family:var(--muevo-font-display); font-weight:var(--muevo-display-weight); font-size:1.05rem; line-height:1.25; margin:0; color:var(--muevo-text); }
.mv-svc-meta{ display:inline-flex; align-items:center; gap:6px; font-size:.8rem; color:var(--muevo-text-muted); }
.mv-svc-meta svg{ width:14px; height:14px; color:var(--muevo-primary); }
.mv-svc-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:6px; }
.mv-svc-price{ font-family:var(--muevo-font-display); font-size:1.15rem; font-weight:600; color:var(--muevo-text); }
.mv-svc-foot .mv-btn{ flex:none; }
.mv-svb-back{ display:inline-flex; align-items:center; gap:6px; margin-bottom:16px; font-family:var(--muevo-font); font-size:.86rem; font-weight:600;
  color:var(--muevo-text-soft); background:none; border:none; cursor:pointer; padding:6px 2px; transition:.2s; }
.mv-svb-back:hover{ color:var(--muevo-primary); }
.mv-svb-back svg{ width:16px; height:16px; }
.mv-svb-empty{ color:var(--muevo-text-muted); font-size:.9rem; padding:22px 4px; text-align:center; }

/* ===================================================================
   Modal — package booking / customize over the page (table stays visible)
   =================================================================== */
.mv-modal-ov{ position:fixed; inset:0; z-index:99999; display:flex; align-items:flex-start; justify-content:center; padding:clamp(10px,4vh,48px) clamp(10px,3vw,30px); overflow-y:auto; opacity:0; transition:opacity .2s ease; }
.mv-modal-ov.show{ opacity:1; }
.mv-modal-scrim{ position:fixed; inset:0; background:rgba(12,11,10,.62); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); }
.mv-modal-card{ position:relative; width:min(760px,100%); margin:auto; background:var(--muevo-surface,#fff); color:var(--muevo-text,#1a1a1a);
  border:1px solid var(--muevo-border,rgba(0,0,0,.12)); border-radius:var(--muevo-radius-lg,18px); box-shadow:0 40px 100px -30px rgba(0,0,0,.6);
  padding:clamp(18px,3vw,30px); transform:translateY(12px) scale(.99); transition:transform .22s ease; }
.mv-modal-ov.show .mv-modal-card{ transform:none; }
.mv-modal-x{ position:absolute; top:12px; inset-inline-end:12px; width:38px; height:38px; display:grid; place-items:center; border-radius:10px;
  border:1px solid var(--muevo-border,rgba(0,0,0,.12)); background:var(--muevo-surface,#fff); color:var(--muevo-text-soft,#555); cursor:pointer; transition:.18s; z-index:2; }
.mv-modal-x:hover{ color:var(--muevo-text,#000); border-color:var(--muevo-border-strong,rgba(0,0,0,.25)); }
.mv-modal-x svg{ width:18px; height:18px; }
.mv-modal-body{ min-width:0; }
.mv-modal-body .wdc-booking, .mv-modal-body .wdc-pkgbuilder{ margin:0; }