/* Identidad Vista Verde · 4/11/2026 · revisión 2.0 del 7/11/2026
   Tipografía display serif fina (como el isologotipo), marcas de línea (arco, palmera, fachada, loma)
   con el trazo de 1 px del logo y sin resplandor, botones lisos. Se carga después de styles.css y antes del resto.
   Fuentes propias en public/fonts: Bodoni Moda (títulos), Jost (texto y espacios operativos) y Montserrat (universos Quince e Infantiles). */
@font-face{font-family:"Bodoni Moda";src:url("/fonts/bodoni-moda.woff2") format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"Jost";src:url("/fonts/jost.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Montserrat";src:url("/fonts/montserrat-normal.woff2") format("woff2");font-weight:400 700;font-display:swap}
:root{
  /* Bodoni Moda primero (variable, con eje óptico): a tamaño óptico bajo los filetes finos no desaparecen (Nico, 7/11: "la e parece una c" con Didot). */
  --vv-display:"Bodoni Moda","Didot","Bodoni 72","Bodoni MT","Playfair Display",Georgia,"Times New Roman",serif;
  /* Jost (geométrica, variable, latín) elegida por Nico el 7/11 entre nueve opciones: Avenir Next "se veía como Arial". */
  --vv-text:"Jost","Avenir Next","Helvetica Neue","Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --vv-forest:#11231c;--vv-green:#244f41;--vv-moss:#3d6b55;--vv-accent:#657f5c;--vv-cream:#f6f5ef;--vv-sand:#e6d9b8;
  --vv-lime:var(--vv-sand);--vv-glow:none;
}

/* Marcas de línea */
.vv-mark-svg{display:inline-block;width:1em;height:1em;color:currentColor;fill:none;overflow:visible}
.vv-glow{filter:none}

/* Divisor entre secciones: la fachada sobre una línea fina */
.vv-divider{display:flex;align-items:center;justify-content:center;gap:22px;padding:34px 7vw 10px;color:#9fb790;pointer-events:none}
.vv-divider::before,.vv-divider::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,#9fb79055,transparent)}
.vv-divider svg{width:88px;height:50px}
.vv-divider.vv-divider-light{color:#7f8f78}

/* Palmera del hero */
.vv-hero-palm{position:absolute;right:max(4vw,24px);bottom:34px;width:64px;height:80px;color:#e6f0d6;opacity:.55;pointer-events:none}
@media(max-width:640px){.vv-hero-palm{width:42px;height:52px;bottom:22px;right:18px}}

/* Tipografía: títulos serif finos, rótulos tracked como el logotipo */
.vv-public h1,.vv-public h2,.vv-public .vv-hero h1,.vv-event-hero h1,.qp h1,.qp h2,.cp-event-copy h1{font-family:var(--vv-display);font-weight:500;letter-spacing:-.005em;font-variation-settings:"opsz" 14}
.vv-public h1 em,.vv-public h2 em{font-style:italic;font-weight:500}
/* Tamaño óptico fijo y bajo para toda la serif: filetes visibles también en el celular. El resto de las fuentes ignora el eje. */
.vv-public,.qp,.client-portal,.access-page{font-variation-settings:"opsz" 14}
/* Texto de la web pública y cotizador; los espacios operativos heredan Jost desde sus raíces. */
.vv-public,.qp{font-family:var(--vv-text)}
.vv-kicker,.qp-eyebrow,.eyebrow,.cp-eyebrow,.ex-kicker{font-family:var(--vv-text);font-weight:600;letter-spacing:.22em;text-transform:uppercase}
.vv-kicker{font-size:12px}
.vv-wordmark{font-family:var(--vv-text);display:inline-flex;flex-direction:column;line-height:1;letter-spacing:.14em;text-transform:uppercase}
.vv-wordmark strong{font-weight:500;font-size:1.25em}
.vv-wordmark small{font-family:var(--vv-text);font-weight:500;font-size:.5em;letter-spacing:.32em;opacity:.75;margin-top:.45em}

/* Pie de página de la web: fachada, isologo y pocos enlaces */
.vv-footer{position:relative;overflow:hidden}
.vv-footer .vv-footer-facade{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);width:min(560px,90vw);height:auto;color:#d9eeaa;opacity:.12;pointer-events:none}
.vv-footer .vv-footer-inner{position:relative;z-index:1}

/* Botones: una sola familia, lisa; responden al puntero con 1 px de elevación y al toque con una leve presión */
.vv-button,.btn.primary,.qp-button,.cp-button,.ex-button{transition:transform .18s ease,box-shadow .2s ease,background .2s ease}
.btn.primary:hover,.qp-button:hover,.cp-button:hover,.ex-button:hover{transform:translateY(-1px);box-shadow:0 8px 20px #10231a1f}
.vv-button:focus-visible,.btn:focus-visible,.qp-button:focus-visible,.cp-button:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.vv-button,.btn.primary,.qp-button,.cp-button,.ex-button{transition:none}.vv-button:hover,.btn.primary:hover,.qp-button:hover,.cp-button:hover,.ex-button:hover{transform:none}}
.vv-footer{padding:54px 7vw 60px}
.vv-footer-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;width:100%}
.vv-footer-inner>div{display:flex;gap:25px;flex-wrap:wrap}
.vv-footer-inner .vv-brand{color:#e9f1dc}
.vv-footer-inner .vv-wordmark{font-size:16px}
.vv-footer-place{font-family:var(--vv-text);letter-spacing:.18em;text-transform:uppercase;font-size:12px;opacity:.7;width:100%}
@media(max-width:640px){.vv-footer{padding:40px 25px 110px}.vv-footer-inner{gap:18px}}

/* Accesos: foto de fondo editable, arco con resplandor y palmera */
.access-story{position:relative;overflow:hidden;isolation:isolate}
.access-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.55}
.access-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,#10231c99,#10231cee)}
.access-arch{position:absolute;right:-6%;top:8%;width:46%;height:84%;color:#e9f1d4;opacity:.35;pointer-events:none}
.access-palm{position:absolute;right:10%;bottom:12%;width:72px;height:90px;color:#eaf3dc;opacity:.7;pointer-events:none}
.access-story .eyebrow,.access-caption{font-family:var(--vv-text);letter-spacing:.24em;text-transform:uppercase}
.access-story h1{font-size:44px;line-height:1.05}
.access-page h1{font-family:inherit;font-weight:500;letter-spacing:-.005em}
@media(max-width:760px){.access-arch{width:60%;right:-14%;top:4%}.access-palm{width:44px;height:56px;right:8%;bottom:10%}.access-story h1{font-size:30px}}
/* Portal y cotizador: palmera discreta en el encabezado */
.cp-event-header{position:relative}
.cp-palm,.qp-palm{position:absolute;right:26px;bottom:22px;width:48px;height:60px;color:#eef5e6;opacity:.6;pointer-events:none;z-index:2}
@media(max-width:640px){.cp-palm,.qp-palm{width:34px;height:42px;right:16px;bottom:14px}}

/* Marcas del isologo: el trazo conserva 1 px; sólo cambian escala uniforme y encuadre.
   brand.css carga antes de las hojas de cada espacio: la especificidad aquí es deliberada. */
.vv-orbit.vv-orbit-palm{
  position:absolute;width:clamp(480px,64vw,900px);height:auto;aspect-ratio:1;
  top:50%;right:-8%;bottom:auto;left:auto;transform:translateY(-50%) rotate(8deg);
  border:0;border-radius:0;box-shadow:none;clip-path:none;overflow:visible;
  color:#e9f1d4;--vv-mark-opacity:.42;opacity:var(--vv-mark-opacity);
  pointer-events:none;user-select:none;z-index:1;
}
.vv-orbit.vv-orbit-palm::before{content:none}
.vv-orbit-palm>svg.vv-mark-svg{
  position:absolute;inset:0;display:block;width:100%;height:100%;aspect-ratio:1;
  margin:0;transform:none;fill:none;border:0;border-radius:0;clip-path:none;
  color:inherit;opacity:1;overflow:visible;pointer-events:none;
}
/* 2.0: el trazo va solo, sin halo; la capa de resplandor queda apagada donde todavía exista en el HTML. */
.vv-orbit-palm>svg.vv-orbit-glow{display:none}
.vv-public .vv-hero,.vv-public .vv-event-hero,.vv-footer,.client-portal .cp-event-header{isolation:isolate;overflow:hidden}
.vv-public .vv-hero-content,.vv-public .vv-hero-bottom,.vv-event-hero .vv-event-hero-copy{position:relative;z-index:2}
.vv-public .vv-hero-bottom{position:absolute}
.vv-public .vv-event-hero{position:relative}
.vv-event-hero .vv-event-hero-copy{min-width:0}
.vv-public svg:is(.vv-hero-base,.vv-event-base,.vv-event-facade,.vv-footer-facade,.vv-footer-base),
.access-story svg.access-base,.qp .qp-hero svg.qp-brand-base,
.client-portal .cp-event-header svg:is(.cp-palm,.cp-brand-base){
  position:absolute;display:block;height:auto;fill:none;overflow:visible;
  color:#e9f1d4;opacity:var(--vv-mark-opacity,.28);pointer-events:none;user-select:none;
  z-index:1;
}
/* Fachada y líneas de base del logo repartidas: cada caja usa el aspecto de su viewBox. */
.vv-public svg.vv-hero-base{width:clamp(330px,43vw,650px);aspect-ratio:276/164;left:-9%;bottom:-25%;transform:rotate(-10deg);--vv-mark-opacity:.2}
.vv-public .vv-event-hero .vv-event-orbit{width:clamp(460px,54vw,800px);right:-17%;top:52%;--vv-mark-opacity:.2;transform:translateY(-50%) rotate(8deg)}
.vv-public svg.vv-event-base{width:clamp(330px,45vw,660px);aspect-ratio:276/164;left:-12%;bottom:-22%;transform:rotate(-8deg);--vv-mark-opacity:.17}
.vv-public .vv-event-hero-media svg.vv-event-facade{width:72%;aspect-ratio:226/128;right:-13%;top:auto;bottom:-6%;transform:none;--vv-mark-opacity:.3}
/* Variaciones de encuadre: unas firmas se reconocen y otras son sólo un trazo.
   Ninguna cambia la proporción ni prolonga el dibujo; la foto recorta la pieza. */
.vv-public .vv-hero .vv-orbit{right:-3%;transform:translateY(-50%) rotate(12deg)}
.vv-theme-wedding .vv-event-hero .vv-event-orbit{width:clamp(540px,66vw,980px);right:-7%;top:47%;transform:translateY(-50%) rotate(-14deg);--vv-mark-opacity:.26}
.vv-theme-xv .vv-event-hero .vv-event-orbit{width:clamp(450px,48vw,700px);right:-7%;top:20%;transform:translateY(-50%) rotate(24deg);--vv-mark-opacity:.3}
.vv-theme-xv .vv-event-hero-media svg.vv-event-facade{width:84%;right:-29%;bottom:5%;transform:none}
.vv-theme-kids .vv-event-hero .vv-event-orbit{width:clamp(650px,70vw,1000px);right:-15%;top:-16%;transform:translateY(-50%) rotate(-14deg);--vv-mark-opacity:.32}
.vv-theme-kids svg.vv-event-base{left:-6%;bottom:-28%;width:50%;transform:rotate(11deg)}
.vv-theme-birthday .vv-event-hero .vv-event-orbit{width:clamp(600px,65vw,920px);right:auto;left:-46%;top:35%;transform:translateY(-50%) rotate(18deg);--vv-mark-opacity:.17}
.vv-theme-birthday .vv-event-hero-media svg.vv-event-facade{width:66%;right:-7%;bottom:-4%;transform:none}
.vv-theme-business .vv-event-hero .vv-event-orbit{width:clamp(600px,73vw,1060px);right:-21%;top:-6%;transform:translateY(-50%) rotate(-24deg);--vv-mark-opacity:.23}
.vv-theme-business .vv-event-hero-media svg.vv-event-facade{width:88%;right:-25%;bottom:9%;transform:none}

/* Transiciones: alternan una fachada completa y fragmentos amplios de las otras piezas. */
.vv-public .vv-divider{position:relative;display:block;height:100px;padding:0;overflow:hidden;isolation:isolate;color:#c7dbb0}
.vv-public .vv-divider::before,.vv-public .vv-divider::after{position:absolute;top:50%;width:35%;height:1px;background:linear-gradient(90deg,transparent,#9fb79033,transparent)}
.vv-public .vv-divider::before{left:3%}.vv-public .vv-divider::after{right:3%}
.vv-public .vv-divider svg.vv-mark-svg{position:absolute;display:block;height:auto;overflow:visible;color:inherit;opacity:var(--vv-mark-opacity,.5);pointer-events:none}
/* 2.0: cada divisor dibuja su marca del logo al entrar (ver redesign.css, "Movimiento 2.0"). */
.vv-public .vv-divider--facade svg{width:150px;aspect-ratio:226/128;left:50%;top:50%;transform:translate(-50%,-50%)}
.vv-public .vv-divider--base svg{width:clamp(560px,70vw,1080px);aspect-ratio:276/164;left:-12%;top:-190px;transform:rotate(-16deg);--vv-mark-opacity:.3}
.vv-public .vv-divider--line svg{width:clamp(580px,85vw,1240px);aspect-ratio:276/164;left:-12%;top:-35px;transform:rotate(9deg);--vv-mark-opacity:.28}
.vv-public .vv-divider--palm svg{width:38px;aspect-ratio:96/194;right:13%;top:50%;transform:translateY(-50%) rotate(18deg);--vv-mark-opacity:.42}
.vv-public .vv-divider--mark svg{width:500px;aspect-ratio:1;left:auto;right:-80px;top:-35px;transform:rotate(-16deg);--vv-mark-opacity:.32}
.vv-public :is(.vv-divider--base,.vv-divider--line,.vv-divider--palm,.vv-divider--mark)::before,
.vv-public :is(.vv-divider--base,.vv-divider--line,.vv-divider--palm,.vv-divider--mark)::after{content:none}
.vv-public .vv-divider-light{color:#52735e}

/* El pie conserva su contenido y suma una fachada a la derecha y la curva larga a la izquierda. */
.vv-public .vv-footer svg.vv-footer-facade{width:clamp(300px,48vw,640px);aspect-ratio:226/128;left:auto;right:-7%;bottom:-15%;transform:none;--vv-mark-opacity:.18}
.vv-public .vv-footer svg.vv-footer-base{display:none;width:clamp(320px,44vw,620px);aspect-ratio:276/164;left:-12%;bottom:-80%;transform:rotate(-13deg);--vv-mark-opacity:.2}
.vv-public .vv-footer .vv-footer-inner{position:relative;z-index:2}

/* Accesos: misma composición de línea y halo, detrás del texto y sin tocar el formulario. */
.access-page .access-story::after,.qp.qc-compact .qp-hero::before,.qp.qc-compact .qp-hero::after{content:none;display:none}
.access-story .vv-orbit.access-orbit{width:clamp(420px,65vw,850px);right:-14%;top:46%;transform:translateY(-50%) rotate(-18deg);--vv-mark-opacity:.28}
.access-story svg.access-base{width:90%;aspect-ratio:276/164;left:-18%;bottom:-12%;transform:rotate(14deg);--vv-mark-opacity:.14}
.access-story>:is(.app-wordmark,.logo,.access-caption),.access-story>div:not([class]){position:relative;z-index:2}
/* Portal: la copa en una esquina y el arranque de la curva al pie; no cubren nombre ni fecha. */
.client-portal .cp-event-header svg.cp-palm{width:58px;aspect-ratio:96/194;right:35px;top:20px;bottom:auto;transform:rotate(12deg);--vv-mark-opacity:.38}
.client-portal .cp-event-header svg.cp-brand-base{width:380px;aspect-ratio:276/164;right:-120px;left:auto;bottom:-180px;transform:rotate(-12deg);--vv-mark-opacity:.24}
.client-portal .cp-event-copy,.client-portal .cp-reserved{z-index:2}
/* Los dos cotizadores comparten el arco, con otra esquina para las curvas del infantil. */
.qp .qp-hero .vv-orbit.qp-orbit{width:clamp(400px,47vw,680px);right:-7%;top:-15%;--vv-mark-opacity:.3;transform:translateY(-50%) rotate(18deg)}
.qp .qp-hero svg.qp-brand-base{width:clamp(310px,34vw,520px);aspect-ratio:276/164;left:-12%;bottom:-80%;transform:rotate(-9deg);--vv-mark-opacity:.16}
.qp.infantiles .qp-hero .vv-orbit.qp-orbit{right:-4%;top:46%;transform:translateY(-50%) rotate(-18deg)}
.qp.infantiles .qp-hero svg.qp-brand-base{left:auto;right:-12%;bottom:-46%;transform:rotate(14deg);--vv-mark-opacity:.14}

body[data-app-space=admin] .access-story .access-orbit{top:8%;right:-42%;transform:translateY(-50%) rotate(26deg);--vv-mark-opacity:.22}
body[data-app-space=provider] .access-story .access-orbit{width:clamp(540px,70vw,920px);top:-8%;right:-38%;transform:translateY(-50%) rotate(-25deg);--vv-mark-opacity:.23}
.qp.quince .qp-hero .vv-orbit.qp-orbit{width:clamp(400px,40vw,580px);top:40%;right:-3%;transform:translateY(-50%) rotate(-25deg)}

/* La palmera se muestra completa o se omite en los encuadres de trazos parciales.
   Su halo viene de vv-orbit-fronds; la capa de arco no contiene hojas ocultas. */
:is(.vv-theme-xv,.vv-theme-kids,.vv-theme-birthday,.vv-theme-business) .vv-orbit-palm>svg.vv-orbit-fronds,
.qp:not(.infantiles) .vv-orbit-palm>svg.vv-orbit-fronds,
body[data-app-space=admin] .access-story .vv-orbit-palm>svg.vv-orbit-fronds,
body[data-app-space=provider] .access-story .vv-orbit-palm>svg.vv-orbit-fronds{display:none}

/* Listado público de celebraciones: fragmentos amplios detrás de las tarjetas,
   sin logotipos completos ni nuevas capas sobre los enlaces. */
.vv-public :is(.vv-celebrations,.vv-other,.vv-more-events){position:relative;isolation:isolate;overflow:hidden}
.vv-public :is(.vv-celebrations,.vv-other,.vv-more-events)::before,
.vv-public .vv-celebrations::after,
.vv-public .vv-celebrations .vv-event-grid::before{
  content:'';position:absolute;pointer-events:none;z-index:-1;
  background:url('/brand-base-light.svg') no-repeat center/100% auto;
  width:clamp(700px,100vw,1600px);aspect-ratio:276/164;opacity:.24;
}
/* 2.0: una sola loma detrás de la grilla y otra detrás de "También para encontrarse"; aparecen con la sección. */
.vv-public .vv-celebrations::after,.vv-public .vv-celebrations .vv-event-grid::before{display:none}
.vv-public :is(.vv-celebrations,.vv-other)::before{opacity:0;transition:opacity 1.4s ease .4s}
.vv-public :is(.vv-celebrations,.vv-other).is-in::before{opacity:.16}
.vv-public .vv-celebrations::before{left:-40%;top:0;transform:rotate(-18deg)}
.vv-public .vv-celebrations::after{right:-45%;bottom:8%;transform:rotate(25deg);opacity:.18}
.vv-public .vv-celebrations .vv-event-grid{position:relative}
.vv-public .vv-celebrations .vv-event-grid::before{width:clamp(700px,90vw,1440px);left:-45%;top:32%;transform:rotate(12deg);opacity:.2}
.vv-public .vv-other::before{width:clamp(650px,85vw,1200px);right:-38%;top:-65%;transform:rotate(-24deg);opacity:.2}
.vv-public .vv-more-events::before{width:800px;left:-230px;bottom:-350px;transform:rotate(14deg);opacity:.18}
@media(max-width:760px){
  .vv-public .vv-celebrations::before{width:900px;left:-570px;top:8%;transform:rotate(-27deg)}
  .vv-public .vv-celebrations::after{width:850px;right:-530px;bottom:10%;transform:rotate(24deg)}
  .vv-public .vv-celebrations .vv-event-grid::before{width:850px;left:-440px;top:30%;transform:rotate(-14deg)}
  .vv-public .vv-other::before{width:760px;right:-420px;top:-130px}
}

/* Fondos fijos: capa de decoración aislada bajo el contenido, incluso en Safari móvil.
   No se usan background-attachment ni transformaciones del contenedor de formularios. */
body .client-portal,body .provider-app,.qp.qc-compact,.shell.studio-shell .workspace{position:relative;isolation:isolate}
body .client-portal::before,body .provider-app::before,.qp.qc-compact::before,.shell.studio-shell .workspace::before{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:url('/brand-facade-dark.svg'),url('/brand-base-dark.svg');
  background-repeat:no-repeat;background-size:360px auto,480px auto;
  background-position:right -65px bottom 36px,left -145px bottom -85px;
}
body .provider-app::before{background-size:420px auto,430px auto;background-position:right -120px bottom 24px,left -160px top 130px}
.qp.qc-compact::before{background-size:330px auto,520px auto;background-position:right -80px bottom 100px,left -190px top 35vh}
.shell.studio-shell .workspace::before{background-size:300px auto,450px auto;background-position:right -65px bottom 20px,left -185px bottom -95px;opacity:.7}
/* Variantes claras disponibles para superficies oscuras, sin modificar sus colores existentes. */
.vv-public .vv-divider--base{background-image:url('/brand-base-light.svg');background-repeat:no-repeat;background-size:260px auto;background-position:right -95px bottom -100px}

@media(max-width:760px){
  .vv-public .vv-hero .vv-orbit{width:560px;right:-60px;top:48%;transform:translateY(-50%) rotate(12deg);--vv-mark-opacity:.34}
  .vv-public svg.vv-hero-base{width:410px;left:-145px;bottom:-120px;--vv-mark-opacity:.18}
  .vv-public .vv-event-hero .vv-event-orbit{width:540px;right:-110px;top:28%;--vv-mark-opacity:.23}
  .vv-theme-wedding .vv-event-hero .vv-event-orbit{width:500px;right:-60px;top:24%;transform:translateY(-50%) rotate(-17deg);--vv-mark-opacity:.28}
  .vv-theme-xv .vv-event-hero .vv-event-orbit{width:560px;right:-140px;top:7%;transform:translateY(-50%) rotate(23deg);--vv-mark-opacity:.32}
  .vv-theme-kids .vv-event-hero .vv-event-orbit{width:650px;right:-160px;top:-105px;transform:translateY(-50%) rotate(-14deg);--vv-mark-opacity:.3}
  .vv-theme-birthday .vv-event-hero .vv-event-orbit{width:620px;right:auto;left:-390px;top:32%;transform:translateY(-50%) rotate(17deg);--vv-mark-opacity:.17}
  .vv-theme-business .vv-event-hero .vv-event-orbit{width:680px;right:-190px;top:-75px;transform:translateY(-50%) rotate(-23deg);--vv-mark-opacity:.25}
  .vv-public .vv-event-hero-media svg.vv-event-facade{width:86%;right:-20%;bottom:-8%;--vv-mark-opacity:.28}
  .vv-public svg.vv-event-base{width:430px;left:-190px;bottom:-100px;--vv-mark-opacity:.2}
  .vv-public .vv-divider{height:85px}
  .vv-public .vv-divider--facade svg{width:130px}
  .vv-public .vv-divider--base svg{width:540px;left:-150px;top:-150px}
  .vv-public .vv-divider--line svg{width:680px;left:-180px;top:-40px}
  .vv-public .vv-divider--palm svg{width:30px;right:12%;top:50%}
  .vv-public .vv-divider--mark svg{width:460px;right:-165px;top:-30px}
  .vv-public .vv-footer svg.vv-footer-facade{width:330px;right:-110px;bottom:-12%;--vv-mark-opacity:.16}
  .vv-public .vv-footer svg.vv-footer-base{width:360px;left:-175px;bottom:-55%;--vv-mark-opacity:.18}
  .access-story .vv-orbit.access-orbit{width:470px;right:-40px;top:60%;--vv-mark-opacity:.25}
  body[data-app-space=admin] .access-story .access-orbit{width:540px;right:-110px;top:-65px}
  body[data-app-space=provider] .access-story .access-orbit{width:530px;right:-140px;top:-100px}
  .access-story svg.access-base{width:330px;left:-130px;bottom:-90px}
  .client-portal .cp-event-header svg.cp-palm{width:46px;right:27px;top:18px;--vv-mark-opacity:.28}
  .client-portal .cp-event-header svg.cp-brand-base{width:260px;right:-100px;bottom:-115px}
  .qp .qp-hero .vv-orbit.qp-orbit{width:500px;right:-160px;top:-80px;--vv-mark-opacity:.27}
  .qp.quince .qp-hero .vv-orbit.qp-orbit{width:450px;right:-100px;top:42%}
  .qp.infantiles .qp-hero .vv-orbit.qp-orbit{width:520px;right:-40px;top:45%;transform:translateY(-50%) rotate(16deg)}
  .qp .qp-hero svg.qp-brand-base{width:310px;left:-175px;bottom:-140px}
  .qp.infantiles .qp-hero svg.qp-brand-base{left:auto;right:-170px;bottom:-100px}
  body .client-portal::before,body .provider-app::before,.qp.qc-compact::before,.shell.studio-shell .workspace::before{background-size:230px auto,330px auto;background-position:right -110px bottom 75px,left -180px bottom -10px}
}
@media(prefers-reduced-motion:no-preference){
  .vv-orbit.vv-orbit-palm,.vv-public svg:is(.vv-hero-base,.vv-event-base,.vv-event-facade,.vv-footer-facade,.vv-footer-base),
  .vv-public .vv-divider svg,.access-story svg.access-base,.qp .qp-hero svg.qp-brand-base,
  .client-portal .cp-event-header svg:is(.cp-palm,.cp-brand-base){animation:vv-mark-arrive 1.2s ease-out both}
}
@media(prefers-reduced-motion:reduce){
  .vv-orbit.vv-orbit-palm,.vv-public svg:is(.vv-hero-base,.vv-event-base,.vv-event-facade,.vv-footer-facade,.vv-footer-base),
  .vv-public .vv-divider svg,.access-story svg.access-base,.qp .qp-hero svg.qp-brand-base,
  .client-portal .cp-event-header svg:is(.cp-palm,.cp-brand-base){animation:none;transition:none}
}
@keyframes vv-mark-arrive{from{opacity:0}to{opacity:var(--vv-mark-opacity,.42)}}

/* Cotizador: título en la serif de la marca (más específico que proposal.css) */
.qp:not(.quince):not(.infantiles) .qp-hero-copy h1,.qp:not(.quince):not(.infantiles) h1{font-family:var(--vv-display);font-weight:500;letter-spacing:-.005em;font-variation-settings:"opsz" 14}

/* Galería en slides */
.vv-slides{position:relative;margin-top:28px}
.vv-slides-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 7vw;padding:4px 7vw 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch;outline:none}
.vv-slides-track::-webkit-scrollbar{display:none}
.vv-slides-track:focus-visible{box-shadow:inset 0 0 0 2px var(--vv-sand)}
.vv-slide{flex:0 0 min(72%,760px);scroll-snap-align:center;margin:0;position:relative}
.vv-slide-media{display:block;width:100%;padding:0;border:0;background:#24382a;border-radius:18px;overflow:hidden;aspect-ratio:16/10;cursor:zoom-in}
.vv-slide-media img,.vv-slide-media video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s ease}
.vv-slide-media:hover img{transform:scale(1.03)}
.vv-slide figcaption{position:absolute;left:18px;bottom:18px;right:18px;font-size:13px;letter-spacing:.02em;color:#f3f1e8;text-shadow:0 2px 12px #000c;pointer-events:none}
.vv-slides-nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:16px}
.vv-slides-arrow{width:44px;height:44px;border-radius:50%;border:1px solid #f4f1e655;background:transparent;color:#f4f1e6;font-size:16px;cursor:pointer;transition:background .2s,border-color .2s}
.vv-slides-arrow:hover{background:#f4f1e618;border-color:#f4f1e6}
.vv-slides-dots{display:flex;gap:10px}
.vv-slides-dots button{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:#f4f1e640;cursor:pointer;transition:transform .2s,background .2s}
.vv-slides-dots button[aria-selected="true"]{background:var(--vv-sand);transform:scale(1.3)}
@media(max-width:760px){.vv-slide{flex-basis:84%}.vv-slides-track{padding:4px 18px 8px;scroll-padding:0 18px;gap:12px}.vv-slide-media{aspect-ratio:4/3;border-radius:14px}}
/* Botones de Gestión, portal y proveedores: una sola familia, respuesta al toque y foco visible */
.btn{transition:transform .15s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease}
.btn:hover{border-color:#b9c7b3;box-shadow:0 6px 18px #1c2f2414}
.btn:active{transform:translateY(1px);box-shadow:none}
.btn.primary:hover{background:#1c4336}
.btn.ghost:hover{background:#eef3ea;border-color:transparent;box-shadow:none}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.btn:focus-visible,button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #6aa37f;outline-offset:2px}
/* Transiciones suaves de tarjetas y paneles al entrar (sin movimiento con reduce) */
@media(prefers-reduced-motion:no-preference){.card,.eh-panel,.fin-panel,.cp-main>section{animation:vv-rise-in .45s ease both}}
@keyframes vv-rise-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* Grillas de dos columnas en el celular: la tarjeta suelta ocupa todo el ancho */
@media(max-width:760px){.vv-menu-tabs>button:last-child:nth-child(odd),.in-game-details>:last-child:nth-child(odd),.in-included-services>:last-child:nth-child(odd),.qc-summary-chips>:last-child:nth-child(odd){grid-column:1/-1}}
/* 2.0: Quince e Infantiles tienen tipografía propia en los títulos (ver celebrations.css, universos). */
/* Diálogos: títulos operativos en Jost y lugar para el botón de cerrar */
#dialog h2,#dialog .cc-dialog h2,#dialog .ex-dialog h2{font-family:var(--vv-text);font-weight:600;letter-spacing:-.005em;padding-right:56px;line-height:1.1}
#dialog>button.close,#dialog .close{top:16px;right:16px}
/* Agenda: los días libres no repiten "Libre" treinta veces; el color alcanza (el texto queda para lectores de pantalla) */
.ag-day.is-free .ag-availability{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Portal: proporciones y navegación en el celular (revisión del 4/11) */
.skip:focus:not(:focus-visible){top:-100px}
.client-portal .cp-main{overflow-x:clip}
.client-portal .cp-main h2{font-size:24px}
.client-portal .cp-main h3{font-size:18px}
.client-portal .cp-section-heading h2{font-size:26px}
.client-portal .qp h2,.client-portal .qp-course h2{font-size:30px!important}
.cp-eyebrow,.qp-eyebrow,.ex-kicker,.cp-age,.cp-ticket-status,.cp-next-note,.cp-info{font-size:12px}
.client-portal small,.client-portal .small{font-size:12px}
@media(max-width:640px){
  .cp-nav{justify-content:flex-start;overflow-x:auto;gap:4px}
  .cp-nav a{flex:0 0 auto;min-width:64px;font-size:11px;padding:10px 8px}
  .cp-event-header{height:132px;padding:18px}
  .cp-event-copy h1{font-size:24px}
  .cp-event-copy p{margin-top:6px}
  .cp-reserved{margin-top:8px}
}

/* Cotizador y calendarios: proporciones y zonas de toque (revisión del 4/11) */
.qp-count-card>div button{min-width:44px;min-height:44px;font-size:20px}
.qp-count-card input{font-size:34px}
.qc-hero{padding:22px 26px!important;min-height:0!important}
.qc-hero h2,.qc-hero h1{font-size:28px!important}
.qc-slot-grid button{min-height:44px}
.qc-legend,.ag-legend{font-size:13px}
.ag-day .ag-availability{font-size:12px}
@media(max-width:760px){
  .ag-global-layout{display:grid;grid-template-columns:1fr}
  .ag-day-detail{order:-1}
  .qc-slot-grid button{min-height:48px}
}

/* Pestañas del portal en el celular: las siete entran sin desplazarse, con ícono grande y etiqueta legible */
@media(max-width:640px){.cp-nav{overflow:hidden;gap:0;justify-content:space-between}.cp-nav a{flex:1 1 0;min-width:0;padding:9px 1px;font-size:10px;gap:4px}.cp-nav a svg{width:20px;height:20px}}

/* Adicionales: el resumen de lo elegido acompaña el scroll (carrito) */
.client-portal .ex-selection{position:sticky;bottom:12px;z-index:6;background:#fff;box-shadow:0 12px 34px #1b2d2226;border-color:#cfdcd2}
.client-portal .ex-selection strong{font-size:24px}
@media(max-width:640px){.client-portal .ex-selection{bottom:8px;padding:12px 14px;gap:10px}.client-portal .ex-selection strong{font-size:20px}.client-portal .ex-selection .ex-button{padding:10px 14px;font-size:13px}}