/* Snas · versión verde de 3 páginas (1/11/2026).
   Pared de césped con el nombre en blanco, paneles de papel sobre verde, Erode en todo.
   Cinco tamaños por página: --t-s, --t-b, --t-l, --t-h y --t-x (el grande de cada página). */

@font-face { font-family: "Erode"; src: url("/assets/fonts/erode-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Erode"; src: url("/assets/fonts/erode-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  --verde: #1c3a27;
  --verde-hondo: #12261a;
  --verde-boton: #2f5d3d;
  --verde-boton-2: #244a30;
  --papel: #eef1ec;
  --papel-2: #e1e7df;
  --tinta: #142219;
  --gris: #3f4d44;
  --claro: #eef1ec;
  --claro-2: #b9c7bc;
  --oro: #9a7208;
  --g: clamp(1rem, 3vw, 2.5rem);
  --gap: 12px;
  --r: 20px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --t-s: 0.9375rem;
  --t-b: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  --t-l: clamp(1.25rem, 1.05rem + 0.8vw, 1.625rem);
  --t-h: clamp(2.375rem, 1.3rem + 3.4vw, 4.25rem);
  --t-x: clamp(3.25rem, 1.6rem + 6.4vw, 7.5rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--verde); -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body { margin: 0; background: var(--verde); color: var(--claro); font-family: "Erode", Georgia, "Times New Roman", serif; font-size: var(--t-b); line-height: 1.55; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; }
h1, h2, h3, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
h1, h2, h3 { font-weight: 400; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: 0.22em; text-decoration-thickness: 1px; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.nowrap { white-space: nowrap; }
.skip { position: absolute; left: var(--g); top: 0.75rem; z-index: 20; padding: 0.75rem 1.25rem; background: var(--papel); color: var(--tinta); border-radius: 999px; text-decoration: none; clip-path: inset(50%); }
.skip:focus { clip-path: none; }

/* ---------- botones ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 3.25rem; padding: 0 1.75rem; border: 0; border-radius: 999px; font-weight: 500; font-size: var(--t-b); line-height: 1; text-decoration: none; cursor: pointer; white-space: nowrap; transition: transform 140ms var(--ease), background-color 200ms ease; }
.btn:active { transform: scale(0.97); }
.btn--claro { background: var(--papel); color: var(--tinta); }
.btn--verde { background: var(--verde-boton); color: #fff; }
@media (hover: hover) {
  .btn--claro:hover { background: #fff; }
  .btn--verde:hover { background: var(--verde-boton-2); }
}
.more { display: inline-block; font-weight: 500; text-decoration: underline; }
.btn--claro:focus-visible { outline-color: var(--papel); }
.btn[hidden] { display: none; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ---------- cabecera ---------- */
.bar { position: relative; z-index: 5; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem 2rem; padding: 1.25rem var(--g); font-size: var(--t-s); color: var(--claro); }
.bar--sobre { position: absolute; top: 0; left: 0; right: 0; font-size: var(--t-b); }
.bar__brand { justify-self: start; display: flex; flex-direction: column; gap: 0.15rem; text-decoration: none; line-height: 1.2; }
.bar__mark { font-weight: 500; font-size: var(--t-l); letter-spacing: 0.1em; text-transform: uppercase; line-height: 1; }
.bar__what { color: var(--claro-2); }
.bar--sobre .bar__what { color: var(--claro); }
.bar__nav { display: flex; gap: 2.25rem; }
.bar__nav a { text-decoration: none; padding: 0.5rem 0; }
.bar__nav a[aria-current="page"] { text-decoration: underline; }
@media (hover: hover) { .bar__nav a:hover { text-decoration: underline; } }
.bar__cta { justify-self: end; }
.bar__cta .btn { min-height: 2.875rem; padding: 0 1.4rem; font-size: var(--t-s); }
html.is-cta-a-la-vista .bar__cta { visibility: hidden; }
@media (max-width: 63.99em) and (min-width: 48em) { .bar__what { display: none; } }
@media (max-width: 47.99em) {
  .bar { grid-template-columns: 1fr auto; grid-template-areas: "brand cta" "nav nav"; row-gap: 0.75rem; padding-top: 1rem; }
  .bar__brand { grid-area: brand; }
  .bar__cta { grid-area: cta; }
  .bar__nav { grid-area: nav; gap: 1.5rem; }
  .bar__what { display: none; }
}

/* ---------- Inicio · la pared de césped ---------- */
.hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; color: #fff; background: #1f3b22; overflow: clip; container-type: inline-size; }
.hero__cesped { position: absolute; inset: 0; z-index: 0; }
.hero__cesped img { width: 100%; height: 100%; object-fit: cover; }
.hero__cesped::after { content: ""; position: absolute; inset: 0; background: rgba(6, 20, 10, 0.3); }
.hero__body { position: relative; z-index: 1; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(1.25rem, 3svh, 2.25rem); padding: 7.5rem var(--g) clamp(2.5rem, 7svh, 4.5rem); text-align: center; }
.hero__name { font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; padding-left: 0.06em; line-height: 0.82; font-size: min(calc((100vw - 2 * var(--g)) / 2.55), 52vh); font-size: min(calc((100cqw - 2 * var(--g)) / 2.55), 52svh); overflow: clip; padding-top: 0.04em; padding-bottom: 0.02em; }
.hero__letters { display: inline-flex; }
.hero__letters > span { display: block; }
.hero__lead { max-width: 32ch; font-size: var(--t-l); line-height: 1.35; text-wrap: balance; }
.hero__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem 1.75rem; }
.rating-line { display: inline-flex; align-items: center; gap: 0.6rem; font-size: var(--t-b); text-decoration: none; }
.rating-line .stars { width: 5.5rem; color: #fff; }
@media (hover: hover) { .rating-line:hover span:last-child { text-decoration: underline; } }
@media (max-width: 47.99em) {
  .hero__body { padding-top: 8.5rem; }
  .rating-line { flex-direction: column; gap: 0.4rem; font-size: var(--t-s); }
}
@media (prefers-reduced-motion: no-preference) {
  .hero__cesped img { animation: cesped 1600ms var(--ease) both; }
  .hero__letters > span { animation: letra 1100ms cubic-bezier(0.16, 1, 0.3, 1) both; }
  .hero__letters > span:nth-child(2) { animation-delay: 70ms; }
  .hero__letters > span:nth-child(3) { animation-delay: 140ms; }
  .hero__letters > span:nth-child(4) { animation-delay: 210ms; }
  .hero__lead, .hero__actions { animation: subir 900ms var(--ease) 420ms both; }
}
@keyframes cesped { from { transform: scale(1.08); } }
@keyframes letra { from { transform: translateY(105%); } }
@keyframes subir { from { transform: translateY(18px); } }

/* ---------- estrellas ---------- */
.stars { position: relative; display: inline-block; width: 7rem; aspect-ratio: 5 / 1; color: var(--oro); }
.stars svg { display: block; width: 100%; height: 100%; }
.stars__base { opacity: 0.28; }
.stars__fill { position: absolute; inset: 0 auto 0 0; width: 94%; overflow: hidden; }
.stars__fill svg { width: calc(100% / 0.94); }

/* ---------- paneles de papel sobre verde (Luz de salón) ---------- */
.sheet { background: var(--papel); color: var(--tinta); border-radius: var(--r); }
.sheet h2, .sheet h3 { color: var(--verde-boton); }
.duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gap); padding: var(--gap); align-items: start; }
.duo__sheet { padding: clamp(2.5rem, 6vw, 5.5rem) clamp(1.5rem, 4.5vw, 4.5rem); min-height: calc(100svh - 2 * var(--gap)); display: flex; flex-direction: column; gap: 2rem; }
.duo__photo { position: sticky; top: var(--gap); height: calc(100svh - 2 * var(--gap)); border-radius: var(--r); overflow: clip; background: var(--papel-2); }
.duo__photo img { width: 100%; height: 100%; object-fit: cover; }
.duo__bar { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 1rem; padding: 1rem 1.25rem; background: var(--papel); color: var(--tinta); font-size: var(--t-s); }
.h2 { font-size: var(--t-h); line-height: 1.02; letter-spacing: -0.02em; text-wrap: balance; }
.lead { font-size: var(--t-l); line-height: 1.4; }
.statement { font-size: var(--t-l); line-height: 1.4; max-width: 30ch; }
.carta { display: grid; gap: 0.2rem; max-width: 32rem; }
.carta li { display: flex; justify-content: space-between; gap: 1.5rem; padding: 0.55rem 0; }
.carta li span:last-child { color: var(--gris); font-variant-numeric: tabular-nums; white-space: nowrap; }
.duo__sheet .more { margin-top: auto; padding-top: 1rem; }
@media (max-width: 47.99em) {
  .duo { grid-template-columns: 1fr; }
  .duo__sheet { min-height: 0; }
  .duo__photo { position: relative; top: 0; height: auto; aspect-ratio: 4 / 5; }
}
.ef-ilumina.is-on .ef-palabra { opacity: 0.16; transition: opacity 0.18s linear; }

/* ---------- Inicio · los cuatro arcos ---------- */
.services { padding: clamp(6rem, 12vw, 10rem) var(--g) clamp(5rem, 10vw, 8rem); }
.services__top { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.5rem var(--gap); align-items: end; }
.services__top .h2 { grid-column: 1 / span 7; }
.services__top .lead { grid-column: 9 / -1; color: var(--claro-2); }
.arches { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3rem clamp(1rem, 2.4vw, 2.25rem); margin-top: clamp(3.5rem, 6vw, 5.5rem); }
.arch a { display: block; text-decoration: none; }
.arch__pic { aspect-ratio: 3 / 4; overflow: clip; border-radius: 50% 50% 0 0 / 37.5% 37.5% 0 0; background: var(--verde-hondo); }
.arch__pic img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--ease); }
@media (hover: hover) { .arch a:hover .arch__pic img { transform: scale(1.05); } .arch a:hover .arch__name { text-decoration: underline; } }
.arch__name { margin-top: 1.25rem; font-size: var(--t-l); line-height: 1.2; }
.arch__from { margin-top: 0.35rem; color: var(--claro-2); }
@media (max-width: 63.99em) { .services__top .h2, .services__top .lead { grid-column: 1 / -1; } }
@media (max-width: 47.99em) { .arches { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Inicio · la ventana en arco (efectos-web) ---------- */
.ef-arco { --aw: 30; --ah: 64; --q: 0; position: relative; background: var(--verde); color: var(--claro); }
.ef-arco-escenario { position: relative; height: 100vh; height: 100svh; overflow: clip; }
.ef-arco.is-live { height: calc((var(--hold, 1.5) + 1) * 100svh); }
.ef-arco.is-live .ef-arco-escenario { position: sticky; top: 0; }
.ef-arco-foto { position: absolute; inset: 0; margin: 0; clip-path: inset(calc((100 - var(--ah)) / 2 * (1 - var(--q)) * 1%) calc((100 - var(--aw)) / 2 * (1 - var(--q)) * 1%) round calc(var(--aw) / 2 * (1 - var(--q)) * 1vw) calc(var(--aw) / 2 * (1 - var(--q)) * 1vw) 0 0); }
.ef-arco-foto img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(calc(1.16 - 0.16 * var(--q))); }
.ef-arco.is-live .ef-arco-foto img { will-change: transform; }
.ef-arco-frase { position: absolute; inset: 0; margin: 0; padding: 0 3vw; display: grid; align-items: center; grid-template-columns: 1fr calc(var(--aw) * 1vw + 5vw) 1fr; font-size: var(--t-h); line-height: 1; letter-spacing: -0.02em; pointer-events: none; }
.ef-arco-frase > span { display: block; opacity: calc(1 - var(--q) * 1.8); }
.ef-arco-frase > span:first-child { grid-column: 1; justify-self: end; transform: translateX(calc(var(--q) * -32vw)); }
.ef-arco-frase > span:last-child { grid-column: 3; justify-self: start; transform: translateX(calc(var(--q) * 32vw)); }
.ef-arco.is-abierta .ef-arco-frase > span { visibility: hidden; }
.ef-arco-pie { position: absolute; left: var(--g); right: var(--g); bottom: var(--g); z-index: 2; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem 1.5rem; padding: 1rem 1.25rem; border-radius: 14px; background: var(--verde-hondo); color: var(--claro); font-size: var(--t-s); opacity: var(--q); visibility: hidden; }
.ef-arco.is-abierta .ef-arco-pie, .ef-arco:not(.is-live) .ef-arco-pie { visibility: visible; }
.ef-arco:not(.is-live) .ef-arco-pie { opacity: 1; }
@media (max-aspect-ratio: 1/1) {
  .ef-arco { --aw: 66; --ah: 50; }
  .ef-arco-frase { grid-template-columns: 1fr; grid-template-rows: 1fr calc(var(--ah) * 1svh + 5svh) 1fr; justify-items: center; }
  .ef-arco-frase > span:first-child { grid-column: 1; grid-row: 1; justify-self: center; align-self: end; transform: translateY(calc(var(--q) * -30svh)); }
  .ef-arco-frase > span:last-child { grid-column: 1; grid-row: 3; justify-self: center; align-self: start; transform: translateY(calc(var(--q) * 30svh)); }
}

/* ---------- Inicio · las bodas, en corto ---------- */
.teaser { padding-top: clamp(4rem, 8vw, 7rem); }
.teaser .duo__photo { position: relative; top: 0; height: auto; aspect-ratio: 4 / 5; }
.teaser .duo__sheet { min-height: 0; align-self: stretch; justify-content: center; }
.countdown { display: grid; gap: 1rem; }
.countdown li { display: grid; grid-template-columns: 11rem 1fr; gap: 1rem; }
.countdown strong { font-weight: 500; color: var(--verde-boton); }
.teaser .btn { align-self: flex-start; }
@media (max-width: 63.99em) { .countdown li { grid-template-columns: 1fr; gap: 0; } }

/* ---------- reseñas de Google (ejemplo) ---------- */
.reviews { padding: clamp(6rem, 12vw, 10rem) var(--gap) var(--gap); }
.reviews__card { padding: clamp(2.5rem, 6vw, 5rem) clamp(1.5rem, 5vw, 5rem); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5rem var(--gap); align-items: center; }
.reviews__head { grid-column: 1 / span 5; display: flex; flex-direction: column; gap: 1.5rem; align-items: flex-start; }
.reviews__score { grid-column: 7 / span 2; display: flex; flex-direction: column; gap: 0.5rem; }
.reviews__num { font-size: var(--t-h); line-height: 0.9; font-weight: 400; letter-spacing: -0.02em; color: var(--verde-boton); }
.reviews__count { color: var(--gris); }
.bars { grid-column: 9 / -1; display: grid; gap: 0.6rem; }
.bars li { display: grid; grid-template-columns: 1.25rem 1fr 2.5rem; align-items: center; gap: 0.85rem; font-variant-numeric: tabular-nums; }
.bars__n { color: var(--gris); text-align: center; }
.bars__c { color: var(--gris); text-align: right; }
.bars__track { position: relative; height: 0.625rem; border-radius: 999px; background: var(--papel-2); overflow: hidden; }
.bars__fill { position: absolute; inset: 0; border-radius: 999px; background: var(--oro); transform-origin: 0 50%; transform: scaleX(var(--v, 0)); transition: transform 1100ms var(--ease); }
.bars li:nth-child(1) .bars__fill { --v: 0.849; }
.bars li:nth-child(2) .bars__fill { --v: 0.094; }
.bars li:nth-child(3) .bars__fill { --v: 0.029; }
.bars li:nth-child(4) .bars__fill { --v: 0.007; }
.bars li:nth-child(5) .bars__fill { --v: 0.022; }
@media (prefers-reduced-motion: no-preference) { .js .bars:not(.is-visto) .bars__fill { transform: scaleX(0); } }
.reviews__note { grid-column: 1 / -1; max-width: 62ch; color: var(--gris); }
@media (max-width: 63.99em) {
  .reviews__head { grid-column: 1 / -1; }
  .reviews__score { grid-column: 1 / span 4; }
  .bars { grid-column: 6 / -1; }
}
@media (max-width: 47.99em) {
  .reviews__score, .bars { grid-column: 1 / -1; }
}

/* ---------- páginas interiores: cabecera de página ---------- */
.top { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem var(--gap); padding: clamp(2.5rem, 6vw, 5rem) var(--g) 0; align-items: end; }
.top__title { grid-column: 1 / span 7; font-size: var(--t-x); line-height: 0.95; letter-spacing: -0.025em; text-wrap: balance; }
.top__side { grid-column: 9 / -1; display: flex; flex-direction: column; gap: 1.75rem; align-items: flex-start; padding-bottom: 0.5rem; }
.top__side .lead { color: var(--claro); }
.top__pic { grid-column: 1 / -1; margin-top: clamp(1rem, 3vw, 2.5rem); border-radius: var(--r); overflow: clip; aspect-ratio: 16 / 7; background: var(--verde-hondo); }
.top__pic img { width: 100%; height: 100%; object-fit: cover; }
.top--foto { align-items: stretch; }
.top--foto .top__words { grid-column: 1 / span 7; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 2rem; padding-bottom: 0.5rem; }
.top--foto .top__title { grid-column: auto; }
.top--foto .top__pic { grid-column: 9 / -1; margin-top: 0; aspect-ratio: 4 / 5; }
@media (max-width: 63.99em) {
  .top__title, .top__side { grid-column: 1 / -1; }
  .top--foto .top__words { grid-column: 1 / span 7; }
  .top--foto .top__pic { grid-column: 8 / -1; }
}
@media (max-width: 47.99em) {
  .top__pic { aspect-ratio: 4 / 3; }
  .top--foto .top__words, .top--foto .top__pic { grid-column: 1 / -1; }
  .top--foto .top__pic { aspect-ratio: 4 / 3; }
}

/* ---------- Tratamientos · la carta por grupos ---------- */
.menu-intro { padding: clamp(4rem, 8vw, 6rem) var(--g) 2.5rem; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.5rem var(--gap); align-items: center; }
.menu-intro p { grid-column: 1 / span 6; color: var(--claro-2); }
.jump { grid-column: 8 / -1; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.6rem; }
.jump a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1.15rem; border-radius: 999px; background: var(--verde-hondo); text-decoration: none; transition: background-color 200ms ease; }
@media (hover: hover) { .jump a:hover { background: var(--verde-boton); } }
@media (max-width: 63.99em) { .menu-intro p, .jump { grid-column: 1 / -1; } .jump { justify-content: flex-start; } }
.cats { display: grid; gap: var(--gap); padding: 0 var(--gap) var(--gap); }
.cat { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--gap); align-items: stretch; scroll-margin-top: var(--gap); }
.cat:nth-child(even) { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.cat:nth-child(even) .cat__pic { order: -1; }
.cat__sheet { padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 4vw, 4rem); display: flex; flex-direction: column; gap: 1.5rem; min-height: 34rem; }
.cat__pic { position: relative; border-radius: var(--r); overflow: clip; background: var(--verde-hondo); }
.cat__pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cat__lead { color: var(--gris); max-width: 46ch; }
.menu { width: 100%; border-collapse: collapse; }
.menu tr { transition: background-color 200ms ease; }
.menu th, .menu td { padding: 0.8rem 0.5rem; text-align: left; vertical-align: baseline; font-weight: 400; }
.menu th { padding-left: 0; }
.menu td:last-child { text-align: right; white-space: nowrap; padding-right: 0; font-variant-numeric: tabular-nums; }
.menu td.menu__inc { color: var(--gris); }
.menu td.menu__time { color: var(--gris); white-space: nowrap; }
.menu__add { padding: 0; border: 0; background: none; text-align: left; cursor: pointer; font-weight: 500; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 0.22em; transition: text-decoration-color 200ms ease; }
@media (hover: hover) { .menu__add:hover { text-decoration-color: currentColor; } }
.menu tr.is-added .menu__add::after { content: " · in your request"; font-weight: 400; color: var(--verde-boton); }
.menu__added { min-height: 1.6em; color: var(--verde-boton); font-weight: 500; }
@media (max-width: 63.99em) {
  .cat, .cat:nth-child(even) { grid-template-columns: 1fr; }
  .cat:nth-child(even) .cat__pic { order: 0; }
  .cat__pic { aspect-ratio: 3 / 2; order: -1; }
  .cat:nth-child(even) .cat__pic { order: -1; }
  .cat__sheet { min-height: 0; }
}
@media (max-width: 47.99em) {
  .menu, .menu tbody, .menu tr, .menu th, .menu td { display: block; }
  .menu tr { display: grid; grid-template-columns: 1fr auto; column-gap: 1rem; padding: 0.4rem 0 0.75rem; }
  .menu__add { display: inline-flex; align-items: center; min-height: 2.75rem; }
  .menu td:last-child { align-self: center; }
  .menu th, .menu td { padding: 0; }
  .menu th { grid-column: 1; grid-row: 1; }
  .menu td:last-child { grid-column: 2; grid-row: 1; }
  .menu td.menu__inc { grid-column: 1 / -1; grid-row: 2; }
  .menu td.menu__time { grid-column: 1 / -1; grid-row: 3; }
}

/* ---------- preguntas ---------- */
.faq { padding: clamp(6rem, 12vw, 10rem) var(--g) clamp(4rem, 8vw, 7rem); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3rem var(--gap); }
.faq .h2 { grid-column: 1 / span 4; }
.faq__list { grid-column: 6 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 2.25rem clamp(1.5rem, 3vw, 3rem); }
.faq__list strong { display: block; font-weight: 500; margin-bottom: 0.35rem; }
.faq__list p { color: var(--claro-2); }
.faq__list p strong { color: var(--claro); }
.faq__list .faq__note { grid-column: 1 / -1; }
@media (max-width: 63.99em) { .faq .h2, .faq__list { grid-column: 1 / -1; } }
@media (max-width: 47.99em) { .faq__list { grid-template-columns: 1fr; } }

/* ---------- Bodas · tu día, al revés ---------- */
.day { padding: clamp(5rem, 10vw, 8rem) var(--gap) 0; scroll-margin-top: var(--gap); }
.day__head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem var(--gap); padding: 0 calc(var(--g) - var(--gap)) clamp(3rem, 6vw, 4.5rem); align-items: end; }
.day__head .h2 { grid-column: 1 / span 6; }
.day__head .lead { grid-column: 8 / -1; color: var(--claro-2); }
@media (max-width: 63.99em) { .day__head .h2, .day__head .lead { grid-column: 1 / -1; } }
.planner { padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 4vw, 3.5rem); display: grid; grid-template-columns: auto 1fr; gap: 1.5rem 3rem; align-items: end; }
.planner__events { display: flex; flex-wrap: wrap; gap: 0.6rem; border: 0; margin: 0; padding: 0; min-width: 0; }
.chip { position: relative; cursor: pointer; }
.chip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.chip span { display: inline-flex; align-items: center; min-height: 3rem; padding: 0 1.3rem; border-radius: 999px; background: var(--papel-2); color: var(--tinta); transition: background-color 200ms ease, color 200ms ease; }
.chip input:checked + span { background: var(--verde-boton); color: #fff; }
.chip input:focus-visible + span { outline: 2px solid var(--verde-boton); outline-offset: 3px; }
@media (hover: hover) { .chip:hover input:not(:checked) + span { background: #d3dccf; } }
.planner__fields { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; justify-content: flex-end; }
.planner__field { display: flex; flex-direction: column; gap: 0.35rem; color: var(--gris); }
.planner__field input, .planner__field select { min-height: 3rem; padding: 0 1rem; border: 0; border-radius: 12px; background: var(--papel-2); color: var(--tinta); font-size: var(--t-b); }
.planner[data-event]:not([data-event="wedding"]) [data-only="wedding"] { display: none; }
.planner__nojs { display: none; padding: 2rem; }
html:not(.js) .planner__nojs { display: block; }
html:not(.js) .planner, html:not(.js) .plan { display: none; }
@media (max-width: 63.99em) { .planner { grid-template-columns: 1fr; } .planner__fields { justify-content: flex-start; } }
.steps { display: grid; gap: var(--gap); margin-top: var(--gap); }
.step { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--gap); align-items: stretch; }
.step:nth-child(even) { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.step:nth-child(even) .step__pic { order: 2; }
.step__pic { border-radius: var(--r); overflow: clip; aspect-ratio: 4 / 3; background: var(--verde-hondo); }
.step__pic img { width: 100%; height: 100%; object-fit: cover; }
.step__body { padding: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 4vw, 3.5rem); display: flex; flex-direction: column; justify-content: center; gap: 0.75rem; }
.step__name { font-size: var(--t-h); line-height: 1; letter-spacing: -0.02em; }
.verb__date { font-size: var(--t-l); color: var(--tinta); font-weight: 500; }
.verb__text { color: var(--gris); max-width: 46ch; }
.step.is-skip .step__pic { opacity: 0.45; }
.step.is-skip .step__name { color: var(--gris); }
@media (max-width: 47.99em) { .step, .step:nth-child(even) { grid-template-columns: minmax(0, 1fr); } .step:nth-child(even) .step__pic { order: 0; } }
.plan { margin-top: var(--gap); padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 4vw, 4rem); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.5rem var(--gap); }
.plan__title { grid-column: 1 / span 4; font-size: var(--t-h); line-height: 1; }
.plan__body { grid-column: 6 / -1; display: flex; flex-direction: column; gap: 1.5rem; }
.plan__list { display: grid; gap: 0.25rem; }
.plan__list li { display: grid; grid-template-columns: 10rem 1fr auto; gap: 1rem; padding: 0.55rem 0; }
.plan__list li.is-optional { color: var(--gris); }
.plan__when { font-weight: 500; }
.plan__total { font-size: var(--t-l); line-height: 1.35; font-weight: 500; color: var(--verde-boton); }
.plan__note { color: var(--gris); }
.plan__warn { font-weight: 500; color: var(--tinta); }
.plan__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.btn--papel { background: var(--papel-2); color: var(--tinta); }
@media (hover: hover) { .btn--papel:hover { background: #d3dccf; } }
@media (max-width: 63.99em) { .plan__title, .plan__body { grid-column: 1 / -1; } }
@media (max-width: 47.99em) { .plan__list li { grid-template-columns: 1fr auto; } .plan__list li .plan__when { grid-column: 1 / -1; } }

/* ---------- Bodas · precios del día ---------- */
.prices { padding: var(--gap); }
.prices__card { padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 4vw, 4rem); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem var(--gap); }
.prices__card .h2 { grid-column: 1 / span 4; }
.prices__tables { grid-column: 6 / -1; display: grid; gap: 2.5rem; }
.prices__tables h3 { font-size: var(--t-l); margin-bottom: 0.5rem; }
.prices__note { color: var(--gris); }
@media (max-width: 63.99em) { .prices__card .h2, .prices__tables { grid-column: 1 / -1; } }

/* ---------- la tarjeta de cita ---------- */
.book { padding: clamp(6rem, 12vw, 10rem) var(--gap) var(--gap); scroll-margin-top: 0; }
.coupon { padding: clamp(2.5rem, 6vw, 5rem) clamp(1.5rem, 5vw, 5rem); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5rem var(--gap); }
.coupon__left { grid-column: 1 / span 5; display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; }
.coupon__left > div { display: flex; flex-direction: column; gap: 1.25rem; }
.coupon__ring { color: var(--gris); }
.coupon__form { grid-column: 7 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; align-content: start; }
.field { width: 100%; min-height: 3.25rem; padding: 0.85rem 1.1rem; border: 0; border-radius: 12px; background: var(--papel-2); color: var(--tinta); font-size: var(--t-b); line-height: 1.4; }
.field::placeholder { color: var(--gris); opacity: 1; }
.field[aria-invalid="true"] { outline: 2px solid #9b1c1c; outline-offset: 0; }
textarea.field { grid-column: 1 / -1; min-height: 7.5rem; resize: vertical; }
.coupon__form .field--full { grid-column: 1 / -1; }
.coupon__send { grid-column: 1 / -1; justify-self: start; margin-top: 0.5rem; }
.coupon__note, .coupon__done { grid-column: 1 / -1; color: var(--gris); }
.coupon__error { grid-column: 1 / -1; color: #8f1d1d; font-weight: 500; }
.coupon__error[hidden] { display: none; }
.coupon__done { color: var(--tinta); font-size: var(--t-l); line-height: 1.4; }
.coupon__done[hidden], .coupon__form [hidden] { display: none; }
.hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 63.99em) { .coupon__left, .coupon__form { grid-column: 1 / -1; } }
@media (max-width: 47.99em) { .coupon__form { grid-template-columns: 1fr; } }

/* ---------- pie ---------- */
.foot { margin-top: var(--gap); padding: clamp(4rem, 8vw, 6rem) var(--g) 2.5rem; background: var(--verde-hondo); color: var(--claro); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3rem var(--gap); scroll-margin-top: 0; }
.foot__brand { grid-column: 1 / span 4; display: flex; flex-direction: column; gap: 1rem; }
.foot__mark { font-weight: 500; font-size: var(--t-h); letter-spacing: 0.08em; text-transform: uppercase; line-height: 1; text-decoration: none; }
.foot__brand p { color: var(--claro-2); max-width: 30ch; }
.foot__menu { grid-column: 6 / span 2; display: flex; flex-direction: column; gap: 0; }
.foot__menu a { text-decoration: none; padding: 0.55rem 0; }
@media (hover: hover) { .foot__menu a:hover { text-decoration: underline; } }
.foot__info { grid-column: 9 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 2rem var(--gap); }
.foot__info strong { display: block; font-weight: 500; margin-bottom: 0.35rem; }
.foot__info p { color: var(--claro-2); }
.foot__info a { color: var(--claro); }
.foot__legal { grid-column: 1 / -1; color: var(--claro-2); max-width: 68ch; }
.foot__legal a { color: var(--claro); }
@media (max-width: 63.99em) {
  .foot__brand { grid-column: 1 / -1; }
  .foot__menu { grid-column: 1 / span 4; }
  .foot__info { grid-column: 6 / -1; }
}
@media (max-width: 47.99em) {
  .foot__menu, .foot__info { grid-column: 1 / -1; }
  .foot__info { grid-template-columns: 1fr; }
}

/* ---------- aviso de demo ---------- */
.note { max-width: min(32rem, calc(100vw - 2rem)); padding: 2rem; border: 0; border-radius: var(--r); background: var(--papel); color: var(--tinta); }
.note::backdrop { background: rgba(10, 22, 14, 0.6); }
.note__title { font-size: var(--t-l); font-weight: 500; color: var(--verde-boton); margin-bottom: 0.75rem; }
.note__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.5rem; }

/* ---------- privacidad y 404 ---------- */
.doc { padding: clamp(2.5rem, 6vw, 5rem) var(--gap) var(--gap); }
.doc__sheet { padding: clamp(2.5rem, 6vw, 5rem) clamp(1.5rem, 5vw, 5rem); display: grid; gap: 1.25rem; }
.doc__sheet > * { max-width: 68ch; }
.doc__sheet h1 { font-size: var(--t-h); line-height: 1; color: var(--verde-boton); margin-bottom: 1rem; }
.doc__sheet h2 { font-size: var(--t-l); margin-top: 1.5rem; }
.doc__sheet p { color: var(--tinta); }

/* ---------- entradas al bajar: solo los títulos se funden ---------- */
@media (prefers-reduced-motion: no-preference) {
  .js [data-aparece] { transition: transform 900ms var(--ease) calc(var(--i, 0) * 80ms), opacity 900ms var(--ease) calc(var(--i, 0) * 80ms); }
  .js [data-aparece]:not(.is-visto) { transform: translateY(26px); }
  .js :is(h2, h3)[data-aparece]:not(.is-visto) { opacity: 0; }
  /* las fotos se asientan al aparecer (solo transform) */
  .js [data-aparece] :is(.cat__pic, .step__pic) img, .js .cat__pic[data-aparece] img { transition: transform 1400ms var(--ease); }
  .js [data-aparece]:not(.is-visto) :is(.cat__pic, .step__pic) img, .js .cat__pic[data-aparece]:not(.is-visto) img { transform: scale(1.08); }
  /* cabecera de las páginas interiores al abrir */
  .top__title, .top__side, .top__words > * { animation: subir 900ms var(--ease) both; }
  .top__side, .top__words > :nth-child(2) { animation-delay: 120ms; }
  .top__words > :nth-child(3) { animation-delay: 220ms; }
  .top__pic img { animation: cesped 1600ms var(--ease) both; }
}