/* Hallmark · macrostructure: Split Studio (arch hero + bento booking) · tone: soft luxury · anchor hue: Carmelita #8C5E42
 * taste-skill read: premium consumer brand site for women in Tampa, soft editorial language, native CSS + GSAP
 * dials: DESIGN_VARIANCE 7 · MOTION_INTENSITY 5 · VISUAL_DENSITY 3
 * shape lock: interactive = pill · photos and cards = 2rem · inputs = 1rem · colour panels = 2.75rem · arch motif on hero and portrait
 * palette: brand-locked (Manual de Identidad v2.0): Marfil, Beige, Espresso, Rosa, Carmelita
 */

/* ─── Fuentes (SIL Open Font License) ─── */
@font-face { font-family: "Cormorant Garamond"; src: url("../fonts/CormorantGaramond-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("../fonts/CormorantGaramond-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Jost"; src: url("../fonts/Jost-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Jost"; src: url("../fonts/Jost-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Parisienne"; src: url("../fonts/Parisienne-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

/* ─── Tokens ─── */
:root {
  color-scheme: light;
  /* Paleta oficial */
  --marfil: #FAF5EE;
  --beige: #E4D5C3;
  --espresso: #2B1E18;
  --rosa: #EACFC8;
  --carmelita: #8C5E42;
  /* Mezclas de la paleta */
  --marfil-hi: #FDFAF6;       /* Marfil aclarado · campos de formulario */
  --beige-soft: #EFE5DA;      /* Beige al 55 % sobre Marfil */
  --rosa-soft: #F3E3DE;       /* Rosa al 55 % sobre Marfil */
  --espresso-70: #695E58;     /* leyendas sobre fondos claros */
  --espresso-2: #3A2C25;      /* superficie sobre Espresso */
  --muted-dark: #CDBFB1;      /* texto secundario sobre Espresso */
  --ink-06: rgba(43, 30, 24, 0.06);
  --ink-10: rgba(43, 30, 24, 0.10);
  --ink-16: rgba(43, 30, 24, 0.16);
  --paper-06: rgba(250, 245, 238, 0.06);
  --paper-10: rgba(250, 245, 238, 0.10);
  --paper-24: rgba(250, 245, 238, 0.24);
  --glass: rgba(250, 245, 238, 0.78);

  --shadow-soft: 0 1px 2px rgba(43, 30, 24, 0.04), 0 14px 34px -16px rgba(43, 30, 24, 0.16);
  --shadow-float: 0 2px 6px rgba(43, 30, 24, 0.05), 0 36px 70px -32px rgba(43, 30, 24, 0.32);

  --font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-body: "Jost", Arial, Helvetica, sans-serif;
  --font-sign: "Parisienne", "Snell Roundhand", cursive;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-md: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: clamp(1.375rem, 1.15rem + 0.8vw, 1.75rem);
  --text-2xl: clamp(2.25rem, 1.5rem + 2.6vw, 3.5rem);
  --text-display: clamp(2.875rem, 1.9rem + 3.6vw, 5.25rem);

  --r-pill: 999px;
  --r-md: 1rem;
  --r-lg: 1.5rem;
  --r-xl: 2rem;
  --r-2xl: 2.75rem;

  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;
  --space-3xl: clamp(5rem, 3.4rem + 6vw, 9rem);

  --gutter: clamp(16px, 4.5vw, 56px);
  --nav-h: 64px;
  --nav-top: 12px;

  --ease-spring: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 200ms;
  --dur-med: 420ms;
  --dur-slow: 900ms;
}

/* ─── Base ─── */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: calc(var(--nav-h) + var(--nav-top) + 20px); -webkit-text-size-adjust: 100%; }
body {
  margin: 0; overflow-x: clip;
  background: var(--marfil); color: var(--espresso);
  font-family: var(--font-body); font-size: var(--text-md); line-height: 1.65; font-weight: 400;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 500; }
ul, ol { margin: 0; padding: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
figure, blockquote { margin: 0; }
svg { flex: none; }
::selection { background: var(--rosa); color: var(--espresso); }
:focus-visible { outline: 2px solid var(--carmelita); outline-offset: 3px; }

.wrap { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: var(--gutter); }
.skip { position: fixed; left: var(--space-md); top: -100px; z-index: 100; background: var(--espresso); color: var(--marfil); padding: var(--space-sm) var(--space-lg); border-radius: var(--r-pill); text-decoration: none; }
.skip:focus { top: var(--space-md); }
.selectable { user-select: all; -webkit-user-select: all; }
.ic { width: 1.15em; height: 1.15em; }

/* ─── Tipografía ─── */
.h2 { font-family: var(--font-display); font-weight: 500; font-size: var(--text-2xl); line-height: 1.06; letter-spacing: -0.01em; text-wrap: balance; overflow-wrap: anywhere; min-width: 0; }
.h3 { font-family: var(--font-display); font-weight: 500; font-size: var(--text-xl); line-height: 1.15; text-wrap: balance; }
.lede { color: var(--espresso-70); max-width: 52ch; text-wrap: pretty; }
.head { display: grid; gap: var(--space-md); margin-bottom: clamp(2.5rem, 2rem + 2vw, 4rem); justify-items: start; }
.head--center { justify-items: center; text-align: center; }
.head--center .lede { margin-inline: auto; }

.badge {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.45rem 0.95rem; border-radius: var(--r-pill);
  background: var(--rosa-soft); box-shadow: inset 0 0 0 1px var(--ink-06);
  font-weight: 500; font-size: 0.8125rem; letter-spacing: 0.03em; color: var(--espresso); white-space: nowrap;
}
.badge--dark { background: var(--paper-10); box-shadow: inset 0 0 0 1px var(--paper-10); color: var(--marfil); }

/* ─── Botones ─── */
.btn {
  --btn-bg: var(--espresso); --btn-fg: var(--marfil); --btn-ic: var(--paper-10);
  display: inline-flex; align-items: center; justify-content: center; gap: 0.75rem;
  min-height: 52px; padding: 0 1.6rem; border: 0; border-radius: var(--r-pill);
  background: var(--btn-bg); color: var(--btn-fg);
  font-family: var(--font-body); font-weight: 500; font-size: 0.9375rem; letter-spacing: 0.02em;
  text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: scale var(--dur-med) var(--ease-spring), background-color var(--dur-med) var(--ease-spring), box-shadow var(--dur-med) var(--ease-spring);
}
.btn:has(.btn__ic) { padding-right: 0.4rem; }
.btn__ic {
  display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
  background: var(--btn-ic);
  transition: translate var(--dur-med) var(--ease-spring), scale var(--dur-med) var(--ease-spring);
}
.btn__ic svg { width: 18px; height: 18px; }
.btn:hover .btn__ic { translate: 2px -1px; scale: 1.06; }
.btn:active { scale: 0.98; }
.btn--primary { box-shadow: 0 10px 24px -14px rgba(43, 30, 24, 0.6); }
.btn--primary:hover { --btn-bg: #3F2D24; }
.btn--ghost { --btn-bg: transparent; --btn-fg: var(--espresso); box-shadow: inset 0 0 0 1px var(--ink-16); }
.btn--ghost:hover { --btn-bg: var(--ink-06); }
.btn--light { --btn-bg: var(--espresso); --btn-fg: var(--marfil); --btn-ic: var(--paper-10); }
.btn--sm { min-height: 44px; padding: 0 1.2rem; font-size: 0.875rem; }
.btn .ic--lead { width: 20px; height: 20px; margin-right: -0.2rem; }
.btn[disabled] { opacity: 0.38; cursor: not-allowed; box-shadow: none; }
.btn[disabled]:hover .btn__ic { translate: none; scale: none; }

.link {
  display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.35rem 0;
  font-weight: 500; font-size: 0.9375rem; color: var(--espresso); text-decoration: none; white-space: nowrap;
}
.link .ic { transition: transform var(--dur-med) var(--ease-spring); color: var(--carmelita); }
.link:hover { color: var(--carmelita); }
.link:hover .ic { transform: translateX(4px); }

.chip {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.6rem 1.15rem; border-radius: var(--r-pill);
  background: var(--marfil-hi); box-shadow: inset 0 0 0 1px var(--ink-10);
  font-weight: 500; font-size: 0.875rem; letter-spacing: 0.02em; text-decoration: none; white-space: nowrap;
  transition: background-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.chip:hover { background: var(--beige-soft); }

/* ─── Navegación flotante ─── */
.nav {
  position: fixed; z-index: 60; left: 0; right: 0;
  top: calc(env(safe-area-inset-top, 0px) + var(--nav-top));
  display: flex; justify-content: center; padding-inline: 12px; pointer-events: none;
}
.nav__pill {
  pointer-events: auto;
  width: min(1180px, 100%); min-height: var(--nav-h);
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-md);
  padding: 8px 8px 8px 22px; border-radius: var(--r-pill);
  background: var(--glass); -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3);
  box-shadow: inset 0 0 0 1px var(--ink-06), var(--shadow-soft);
  transition: box-shadow var(--dur-med) var(--ease-out);
}
.nav__brand img { width: 112px; height: auto; }
.nav__links { display: none; gap: 2px; }
.nav__links a {
  padding: 0.55rem 0.95rem; border-radius: var(--r-pill);
  font-weight: 500; font-size: 0.875rem; text-decoration: none; white-space: nowrap; color: var(--espresso);
  transition: background-color var(--dur-fast) var(--ease-out);
}
.nav__links a:hover { background: var(--ink-06); }
.nav__links a[aria-current="true"] { background: var(--beige-soft); }
.nav__tools { display: flex; align-items: center; gap: 8px; }

.lang { display: inline-flex; padding: 3px; border-radius: var(--r-pill); background: var(--ink-06); }
.lang__btn {
  display: inline-grid; place-items: center; text-decoration: none;
  min-width: 38px; min-height: 34px; padding: 0 0.6rem; border: 0; border-radius: var(--r-pill); background: transparent; cursor: pointer;
  font-weight: 500; font-size: 0.75rem; letter-spacing: 0.12em; color: var(--espresso-70);
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.lang__btn[aria-pressed="true"], .lang__btn[aria-current="true"] { background: var(--marfil-hi); color: var(--espresso); box-shadow: 0 1px 3px rgba(43, 30, 24, 0.12); }

.burger { position: relative; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--espresso); cursor: pointer; }
.burger span {
  position: absolute; left: 13px; right: 13px; height: 1.5px; border-radius: 2px; background: var(--marfil);
  transition: transform var(--dur-med) var(--ease-spring), top var(--dur-med) var(--ease-spring);
}
.burger span:first-child { top: 18px; }
.burger span:last-child { top: 25px; }
.burger[aria-expanded="true"] span:first-child { top: 21.5px; transform: rotate(45deg); }
.burger[aria-expanded="true"] span:last-child { top: 21.5px; transform: rotate(-45deg); }

.menu {
  position: fixed; inset: 0; z-index: 55;
  display: grid; align-content: center; justify-items: center; gap: var(--space-xl);
  padding: calc(var(--nav-h) + 40px) var(--gutter) 40px;
  background: rgba(250, 245, 238, 0.9); -webkit-backdrop-filter: blur(28px); backdrop-filter: blur(28px);
  opacity: 0; transition: opacity var(--dur-med) var(--ease-out);
}
.menu.is-open { opacity: 1; }
.menu__links { display: grid; justify-items: center; gap: 0.35rem; }
.menu__links a, .menu__cta {
  opacity: 0; transform: translateY(28px);
  transition: opacity 600ms var(--ease-spring), transform 700ms var(--ease-spring);
}
.menu__links a { font-family: var(--font-display); font-size: clamp(2.25rem, 1.8rem + 2vw, 3rem); line-height: 1.2; text-decoration: none; padding: 0.15rem 1rem; border-radius: var(--r-pill); }
.menu__links a:hover { color: var(--carmelita); }
.menu.is-open .menu__links a, .menu.is-open .menu__cta { opacity: 1; transform: none; }
.menu.is-open .menu__links a:nth-child(1) { transition-delay: 60ms; }
.menu.is-open .menu__links a:nth-child(2) { transition-delay: 110ms; }
.menu.is-open .menu__links a:nth-child(3) { transition-delay: 160ms; }
.menu.is-open .menu__links a:nth-child(4) { transition-delay: 210ms; }
.menu.is-open .menu__links a:nth-child(5) { transition-delay: 260ms; }
.menu.is-open .menu__cta { transition-delay: 320ms; }

@media (max-width: 39.99rem) {
  .nav__cta { display: none; }
  .nav__pill { padding-left: 18px; }
  .nav__brand img { width: 100px; }
}
@media (min-width: 72rem) {
  .nav__links { display: flex; }
  .burger { display: none; }
  .menu { display: none !important; }
}

/* ─── Portada ─── */
.hero {
  width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: var(--gutter);
  display: grid; gap: clamp(2.5rem, 5vw, 4rem); align-items: center;
  padding-top: calc(var(--nav-h) + var(--nav-top) + clamp(2rem, 1rem + 4vw, 5rem));
  padding-bottom: clamp(2.5rem, 2rem + 3vw, 4.5rem);
}
.hero__copy { display: grid; gap: var(--space-lg); justify-items: start; min-width: 0; }
.hero__title { font-family: var(--font-display); font-weight: 500; font-size: var(--text-display); line-height: 1.02; letter-spacing: -0.015em; display: grid; min-width: 0; }
.hero__title span { overflow-wrap: anywhere; }
.hero__title em { font-style: italic; font-weight: 400; color: var(--carmelita); line-height: 1.1; padding-bottom: 0.08em; }
.hero__lede { font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); line-height: 1.6; max-width: 34ch; color: var(--espresso-70); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); padding-top: var(--space-xs); }

.hero__art { position: relative; width: 100%; max-width: 480px; justify-self: center; aspect-ratio: 1 / 1.12; }
.hero__halo { position: absolute; right: 0; top: 2%; width: 82%; aspect-ratio: 1; border-radius: 50%; background: var(--rosa); opacity: 0.85; }
.arch {
  position: absolute; right: 6%; top: 0; width: 70%; aspect-ratio: 4 / 5.3;
  padding: 8px; border-radius: var(--r-pill) var(--r-pill) var(--r-xl) var(--r-xl);
  background: rgba(250, 245, 238, 0.55); box-shadow: inset 0 0 0 1px rgba(250, 245, 238, 0.8), var(--shadow-float);
}
.arch__core { position: relative; width: 100%; height: 100%; overflow: hidden; border-radius: var(--r-pill) var(--r-pill) calc(var(--r-xl) - 8px) calc(var(--r-xl) - 8px); background: var(--beige); isolation: isolate; }
.arch__core::after { content: ""; position: absolute; inset: 10px; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(250, 245, 238, 0.75); pointer-events: none; z-index: 2; }
.arch__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; opacity: 0; scale: 1.06; transition: opacity 1400ms var(--ease-out), scale 6000ms linear; }
.arch__img.is-on { opacity: 1; scale: 1; }
.orb {
  position: absolute; left: 0; bottom: 4%; width: 38%; aspect-ratio: 1; border-radius: 50%; overflow: hidden;
  box-shadow: 0 0 0 7px var(--marfil), var(--shadow-float); background: var(--beige);
}
.orb img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }

@media (min-width: 60rem) {
  .hero { grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); min-height: min(100dvh, 920px); }
  .hero__art { max-width: 540px; justify-self: end; }
}


/* ─── Contenedores con doble bisel ─── */
.shell { padding: 8px; border-radius: var(--r-xl); background: var(--beige-soft); box-shadow: inset 0 0 0 1px var(--ink-06); }
.shell__core { position: relative; height: 100%; overflow: hidden; border-radius: calc(var(--r-xl) - 8px); background: var(--beige); }
.photo { position: relative; overflow: hidden; border-radius: var(--r-xl); background: var(--beige); }
.photo img { width: 100%; height: 100%; object-fit: cover; }
.photo::after, .shell__core::after { content: ""; position: absolute; inset: 10px; border-radius: calc(var(--r-xl) - 10px); box-shadow: inset 0 0 0 1px rgba(250, 245, 238, 0.7); pointer-events: none; }

/* ─── Servicios ─── */
.services { padding-bottom: var(--space-3xl); }
.services__body { display: grid; gap: var(--space-xl); }
.services__stage { display: none; }
.services__list { list-style: none; display: grid; gap: var(--space-sm); }
.svc {
  display: grid; gap: var(--space-lg); padding: clamp(1.1rem, 0.8rem + 1.5vw, 2rem);
  border-radius: var(--r-xl); background: var(--beige-soft);
  transition: background-color var(--dur-med) var(--ease-out), box-shadow var(--dur-med) var(--ease-out);
}
.svc__photo { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 28%; border-radius: var(--r-lg); }
.svc__body { display: grid; gap: var(--space-sm); justify-items: start; min-width: 0; }
.svc__name { font-family: var(--font-display); font-weight: 500; font-size: clamp(2rem, 1.6rem + 1.6vw, 3rem); line-height: 1; transition: color var(--dur-med) var(--ease-out); }
.svc__desc { color: var(--espresso-70); }
.svc__quote p { font-family: var(--font-display); font-style: italic; font-size: var(--text-xl); line-height: 1.35; max-width: 32ch; }

@media (min-width: 40rem) and (max-width: 59.99rem) {
  .svc { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-items: center; }
  .svc__photo { aspect-ratio: 4 / 5; }
}
@media (min-width: 60rem) {
  .services__body { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2.5rem, 5vw, 5rem); align-items: start; }
  .services__stage { display: block; position: sticky; top: calc(var(--nav-h) + var(--nav-top) + 2rem); aspect-ratio: 4 / 5; max-height: calc(100dvh - var(--nav-h) - 5rem); }
  .services__stage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.04); transition: opacity 900ms var(--ease-out), transform 1400ms var(--ease-spring); }
  .services__stage img.is-on { opacity: 1; transform: none; }
  .svc__photo { display: none; }
  .svc { background: transparent; padding: clamp(1.75rem, 2.4vw, 2.5rem); }
  .svc.is-active { background: var(--beige-soft); }
  .svc.is-active .svc__name { color: var(--carmelita); }
}

/* ─── Trabajos: filtros + mosaico + visor ─── */
.work { padding-bottom: var(--space-3xl); }
.filters { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-xs); margin: calc(var(--space-lg) * -1) auto var(--space-xl); max-width: 900px; }
.filter {
  min-height: 44px; padding: 0 1.1rem; border: 0; border-radius: var(--r-pill); cursor: pointer; white-space: nowrap;
  background: var(--marfil-hi); box-shadow: inset 0 0 0 1px var(--ink-10); color: var(--espresso);
  font-weight: 500; font-size: 0.875rem;
  transition: background-color 400ms var(--ease-out), color 400ms var(--ease-out), box-shadow 400ms var(--ease-out), translate 600ms var(--ease-spring);
}
.filter:hover { background: var(--beige-soft); translate: 0 -2px; }
.filter[aria-pressed="true"] { background: var(--espresso); color: var(--marfil); box-shadow: 0 10px 22px -14px rgba(43, 30, 24, 0.7); }
.filter__n { margin-left: 0.35rem; opacity: 0.75; font-variant-numeric: tabular-nums; }

.mas { list-style: none; columns: 2; column-gap: 12px; }
.mas__item { break-inside: avoid; margin-bottom: 12px; }
.mas.is-grid { columns: auto; display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); grid-auto-rows: 8px; column-gap: var(--mas-gap, 12px); row-gap: 0; }
.mas.is-grid .mas__item { margin: 0; }
.mas.is-grid .mas__link { height: calc(100% - var(--mas-gap, 12px)); }
.mas.is-grid .mas__link img, .mas.is-grid .mas__link video { height: 100%; }
.mas__item--video .mas__link video { aspect-ratio: 9 / 16; }
.mas__item.is-hidden { display: none; }
.mas__link {
  position: relative; display: block; width: 100%; height: 100%; overflow: hidden; padding: 0; border: 0; cursor: zoom-in;
  border-radius: var(--r-lg); background: var(--beige); isolation: isolate; color: var(--marfil);
  transform: translateZ(0);
}
.mas__link img, .mas__link video { display: block; width: 100%; height: auto; object-fit: cover; transition: scale 1400ms var(--ease-spring), filter 900ms var(--ease-out); }
.mas__link::before {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(115deg, transparent 30%, rgba(250, 245, 238, 0.35) 48%, transparent 66%);
  translate: -120% 0; transition: translate 1100ms var(--ease-spring);
}
.mas__link::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, transparent 55%, rgba(43, 30, 24, 0.55));
  opacity: 0; transition: opacity 600ms var(--ease-out);
}
.mas__cap {
  position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 3;
  font-size: 0.875rem; line-height: 1.35; text-align: left; color: var(--marfil);
  opacity: 0; translate: 0 12px; transition: opacity 500ms var(--ease-out), translate 700ms var(--ease-spring);
}
.mas__video { cursor: pointer; }
.mas__play {
  position: absolute; top: 12px; right: 12px; z-index: 3; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%;
  background: rgba(250, 245, 238, 0.82); color: var(--espresso); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  transition: scale 600ms var(--ease-spring);
}
.mas__play svg { width: 18px; height: 18px; margin-left: 2px; }
.mas__item--video .mas__cap { opacity: 1; translate: none; }
.mas__item--video .mas__link::after { opacity: 1; }
@media (hover: hover) and (pointer: fine) {
  .mas__link:hover img, .mas__link:hover video { scale: 1.06; filter: saturate(1.06) brightness(1.03); }
  .mas__link:hover::before { translate: 120% 0; }
  .mas__link:hover::after { opacity: 1; }
  .mas__link:hover .mas__cap { opacity: 1; translate: none; }
  .mas__link:hover .mas__play { scale: 1.12; }
}
.work__more { margin-top: var(--space-2xl); display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-sm); }
@media (min-width: 40rem) { .mas { columns: 3; column-gap: 16px; } .mas__item { margin-bottom: 16px; } }
@media (min-width: 64rem) { .mas { columns: 4; column-gap: 18px; } .mas__item { margin-bottom: 18px; } .mas__link { border-radius: var(--r-xl); } }

/* PhotoSwipe (visor) · personalización de marca */
.pswp { --pswp-bg: #1d1410; --pswp-placeholder-bg: #3A2C25; --pswp-root-z-index: 100; --pswp-icon-color: #FAF5EE; --pswp-icon-color-secondary: #2B1E18; --pswp-icon-stroke-color: #2B1E18; }
.pswp__custom-caption {
  position: absolute; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); translate: -50% 0; max-width: min(640px, calc(100% - 32px));
  padding: 0.7rem 1.2rem; border-radius: var(--r-pill); text-align: center;
  background: rgba(250, 245, 238, 0.9); color: var(--espresso); font-family: var(--font-body); font-size: 0.9375rem;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.pswp__custom-caption:empty { display: none; }
.pswp__video-wrap { position: absolute; inset: 0; display: grid; place-items: center; padding: 56px 12px 80px; }
.pswp__video-wrap video { max-width: 100%; max-height: 100%; border-radius: var(--r-lg); background: #000; }

/* ─── Sobre mí: título con retrato y bento ─── */
.about { padding-bottom: var(--space-3xl); }
.about__title {
  font-family: var(--font-display); font-weight: 500; font-size: clamp(2.5rem, 1.6rem + 3.6vw, 5rem); line-height: 1.08; letter-spacing: -0.015em;
  max-width: 22ch; margin-bottom: clamp(2.5rem, 2rem + 2vw, 4rem); text-wrap: balance;
}
.inline-pic {
  display: inline-block; vertical-align: middle; width: 1.9em; height: 0.95em; margin: -0.12em 0.08em 0; border-radius: var(--r-pill); overflow: hidden;
  box-shadow: 0 0 0 3px var(--rosa); background: var(--beige);
}
.inline-pic img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; }

.bento { display: grid; gap: var(--space-sm); grid-template-columns: minmax(0, 1fr); }
.card { position: relative; border-radius: var(--r-xl); padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); overflow: hidden; }
.card--video { padding: 0; min-height: 440px; background: var(--espresso); }
.card__video { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; cursor: pointer; background: none; }
.card__video video { width: 100%; height: 100%; object-fit: cover; transition: scale 1400ms var(--ease-spring); }
.card__video::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(43, 30, 24, 0.55)); pointer-events: none; }
.card__play {
  position: absolute; left: 50%; top: 50%; translate: -50% -50%; z-index: 2; display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%;
  background: rgba(250, 245, 238, 0.85); color: var(--espresso); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: 0 0 0 10px rgba(250, 245, 238, 0.18);
  transition: scale 700ms var(--ease-spring), box-shadow 700ms var(--ease-out);
}
.card__play svg { width: 30px; height: 30px; margin-left: 4px; }
.card__tag { position: absolute; left: 20px; bottom: 20px; z-index: 2; padding: 0.45rem 1rem; border-radius: var(--r-pill); background: var(--marfil); color: var(--espresso); font-weight: 500; font-size: 0.875rem; }
.card--video:hover .card__play { scale: 1.1; box-shadow: 0 0 0 18px rgba(250, 245, 238, 0.14); }
.card--video:hover video { scale: 1.04; }
.card--bio { background: var(--beige); display: grid; gap: var(--space-md); align-content: center; }
.card__lead { font-family: var(--font-display); font-size: var(--text-xl); line-height: 1.35; }
.card--stat { background: var(--espresso); color: var(--marfil); display: grid; align-content: space-between; gap: var(--space-lg); }
.card--stat p:last-child { color: var(--muted-dark); }
.stat { display: flex; align-items: baseline; gap: 0.5rem; }
.stat__n { font-family: var(--font-display); font-size: clamp(5rem, 3.5rem + 5vw, 8rem); line-height: 0.85; font-variant-numeric: lining-nums; }
.stat__u { font-family: var(--font-display); font-style: italic; font-size: var(--text-xl); color: var(--rosa); }
.card--lang { background: var(--rosa); display: grid; align-content: space-between; gap: var(--space-lg); }
.lang-big { display: flex; align-items: baseline; gap: 0.6rem; font-family: var(--font-display); font-size: clamp(3.5rem, 2.5rem + 3vw, 5.5rem); line-height: 0.9; }
.lang-big__amp { font-style: italic; font-size: 0.6em; color: var(--carmelita); }
@media (min-width: 48rem) {
  .bento { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .card--video { grid-row: span 2; min-height: 560px; }
  .card--bio { grid-column: 2; }
}
@media (min-width: 64rem) {
  .bento { grid-template-columns: minmax(0, 5fr) minmax(0, 3.5fr) minmax(0, 3.5fr); grid-template-areas: "video bio bio" "video stat lang"; }
  .card--video { grid-row: auto; grid-area: video; min-height: 620px; }
  .card--bio { grid-column: auto; grid-area: bio; }
  .card--stat { grid-area: stat; }
  .card--lang { grid-area: lang; }
}
.values { list-style: none; display: grid; gap: var(--space-sm); margin-top: var(--space-sm); }
.value {
  display: grid; grid-template-columns: 52px minmax(0, 1fr); column-gap: var(--space-md); row-gap: 0.15rem; align-items: start;
  padding: 1.35rem 1.5rem; border-radius: var(--r-xl); background: var(--marfil-hi); box-shadow: inset 0 0 0 1px var(--ink-06);
  transition: translate 700ms var(--ease-spring), box-shadow 600ms var(--ease-out);
}
.value__ic { grid-row: span 2; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--rosa-soft); color: var(--carmelita); transition: rotate 700ms var(--ease-spring), background-color 400ms var(--ease-out), color 400ms var(--ease-out); }
.value__ic svg { width: 24px; height: 24px; }
.value__t { font-family: var(--font-display); font-weight: 500; font-size: var(--text-lg); line-height: 1.2; }
.value p { color: var(--espresso-70); font-size: var(--text-sm); }
@media (hover: hover) and (pointer: fine) {
  .value:hover { translate: 0 -4px; box-shadow: inset 0 0 0 1px var(--ink-06), var(--shadow-soft); }
  .value:hover .value__ic { rotate: -12deg; background: var(--espresso); color: var(--marfil); }
}
@media (min-width: 56rem) { .values { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.sign { font-family: var(--font-sign); font-size: clamp(2.5rem, 2rem + 1.5vw, 3.25rem); line-height: 1; color: var(--espresso); }

/* ─── Proceso: tarjetas apiladas ─── */
.process { padding-bottom: var(--space-3xl); }
.stack { list-style: none; display: grid; gap: var(--space-lg); }
.stack__card {
  position: sticky; top: calc(var(--nav-h) + var(--nav-top) + 16px);
  display: grid; gap: var(--space-lg); align-items: center;
  padding: clamp(1.25rem, 0.8rem + 2.5vw, 3rem); border-radius: var(--r-2xl);
  box-shadow: 0 -18px 40px -30px rgba(43, 30, 24, 0.35);
  transform-origin: 50% 0;
}
.stack__card--1 { background: var(--beige); }
.stack__card--2 { background: var(--rosa); top: calc(var(--nav-h) + var(--nav-top) + 30px); }
.stack__card--3 { background: var(--espresso); color: var(--marfil); top: calc(var(--nav-h) + var(--nav-top) + 44px); }
.stack__card--4 { background: var(--beige-soft); top: calc(var(--nav-h) + var(--nav-top) + 58px); }
.stack__card--3 p { color: var(--muted-dark); }
.stack__card--3 .link { color: var(--marfil); }
.stack__text { display: grid; gap: var(--space-sm); justify-items: start; align-content: center; }
.stack__n { font-family: var(--font-display); font-style: italic; font-size: clamp(3rem, 2rem + 3vw, 5rem); line-height: 0.9; color: var(--carmelita); }
.stack__card--3 .stack__n { color: var(--rosa); }
.stack__t { font-family: var(--font-display); font-weight: 500; font-size: clamp(2rem, 1.5rem + 2vw, 3.25rem); line-height: 1.05; }
.stack__text p { max-width: 42ch; }
.stack__visual { min-width: 0; }
.stack__visual .photo { aspect-ratio: 4 / 4.2; border-radius: var(--r-xl); }
@media (min-width: 56rem) {
  .stack__card { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(2rem, 5vw, 5rem); min-height: min(76dvh, 640px); }
  .stack__visual .photo { aspect-ratio: auto; height: min(60dvh, 520px); }
}

/* Chat animado */
.chat { display: grid; gap: 0.75rem; align-content: center; padding: clamp(1rem, 0.5rem + 2vw, 1.75rem); border-radius: var(--r-xl); background: var(--marfil); box-shadow: var(--shadow-soft); max-width: 460px; justify-self: center; width: 100%; }
.chat__head { display: flex; align-items: center; gap: 0.75rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--beige); }
.chat__head strong { display: block; font-weight: 500; font-size: 0.9375rem; }
.chat__head small { display: block; font-size: 0.75rem; color: var(--espresso-70); }
.chat__avatar { width: 38px; height: 38px; border-radius: 50%; overflow: hidden; flex: none; }
.bubble { max-width: 84%; padding: 0.7rem 1rem; border-radius: 1.25rem; font-size: 0.9375rem; line-height: 1.45; }
.bubble--in { justify-self: start; background: var(--beige-soft); border-bottom-left-radius: 0.4rem; }
.bubble--out { justify-self: end; background: var(--rosa); border-bottom-right-radius: 0.4rem; }
.bubble--typing { justify-self: end; display: inline-flex; gap: 5px; padding: 0.85rem 1rem; background: var(--rosa); border-bottom-right-radius: 0.4rem; }
.bubble--typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--espresso); opacity: 0.35; animation: typing 1.2s infinite var(--ease-out); }
.bubble--typing span:nth-child(2) { animation-delay: 0.15s; }
.bubble--typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes typing { 0%, 60%, 100% { translate: 0 0; opacity: 0.35; } 30% { translate: 0 -4px; opacity: 0.9; } }
.chat.is-done .bubble--typing { display: none; }

/* Diagnóstico con etiquetas */
.diag { position: relative; }
.diag__tags { list-style: none; position: absolute; inset: 0; pointer-events: none; }
.diag__tags li {
  position: absolute; padding: 0.5rem 0.95rem; border-radius: var(--r-pill); white-space: nowrap;
  background: rgba(250, 245, 238, 0.9); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  font-weight: 500; font-size: 0.8125rem; box-shadow: var(--shadow-soft);
}
.diag__tags li:nth-child(1) { left: -2%; top: 14%; }
.diag__tags li:nth-child(2) { right: -2%; top: 32%; }
.diag__tags li:nth-child(3) { left: 4%; bottom: 26%; }
.diag__tags li:nth-child(4) { right: 6%; bottom: 8%; }
@media (max-width: 39.99rem) { .diag__tags li:nth-child(1) { left: 8px; } .diag__tags li:nth-child(2) { right: 8px; } }

/* Checklist de cuidado */
.care { padding: clamp(1.25rem, 0.8rem + 2vw, 2.25rem); border-radius: var(--r-xl); background: var(--marfil); box-shadow: var(--shadow-soft); display: grid; gap: var(--space-md); }
.care__t { font-family: var(--font-display); font-size: var(--text-xl); }
.checks { list-style: none; display: grid; gap: var(--space-xs); }
.checks li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 0.75rem; align-items: center; padding: 0.8rem 1rem; border-radius: var(--r-lg); background: var(--beige-soft); }
.checks__ic { width: 28px; height: 28px; color: var(--carmelita); }

/* Modal de video */
.vmodal { padding: 0; border: 0; background: transparent; max-width: min(92vw, 520px); width: 100%; overflow: visible; }
.vmodal::backdrop { background: rgba(29, 20, 16, 0.86); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vmodal__box { position: relative; }
.vmodal__video { display: block; width: 100%; max-height: 82dvh; border-radius: var(--r-xl); background: #000; }
.vmodal__close { position: absolute; top: -56px; right: 0; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--marfil); cursor: pointer; }
.vmodal__close span { position: absolute; left: 13px; right: 13px; top: 21px; height: 1.5px; background: var(--espresso); rotate: 45deg; }
.vmodal__close span + span { rotate: -45deg; }
.vmodal[open] .vmodal__box { animation: pop 600ms var(--ease-spring); }
@keyframes pop { from { scale: 0.9; opacity: 0; } to { scale: 1; opacity: 1; } }

/* ─── Reserva ─── */
.book { padding-bottom: var(--space-3xl); }
.island {
  padding: clamp(1.25rem, 0.5rem + 3.5vw, 4.5rem); border-radius: var(--r-2xl);
  background: var(--espresso); color: var(--marfil); box-shadow: var(--shadow-float);
}
.island .lede { color: var(--muted-dark); }
.island :focus-visible { outline-color: var(--rosa); }
.book__place { margin-top: var(--space-xl); font-size: var(--text-sm); color: var(--muted-dark); text-align: center; text-wrap: balance; }

.channels { list-style: none; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-sm); margin-bottom: var(--space-2xl); }
.channel { padding: 6px; border-radius: var(--r-xl); background: var(--paper-06); box-shadow: inset 0 0 0 1px var(--paper-06); }
.channel__core {
  height: 100%; display: grid; align-content: start; justify-items: start; gap: 0.35rem;
  padding: clamp(1.25rem, 1rem + 1vw, 1.75rem); border-radius: calc(var(--r-xl) - 6px);
  background: var(--espresso-2); box-shadow: inset 0 1px 0 var(--paper-06);
}
.channel__ic { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--paper-10); margin-bottom: var(--space-sm); }
.channel__ic svg { width: 22px; height: 22px; }
.channel__k { font-weight: 500; font-size: var(--text-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-dark); }
.channel__v { font-family: var(--font-display); font-size: var(--text-xl); line-height: 1.2; overflow-wrap: break-word; margin-bottom: var(--space-sm); }
.channel__row { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.channel--main .channel__core { background: var(--rosa); color: var(--espresso); align-content: space-between; }
.channel--main .channel__ic { background: rgba(43, 30, 24, 0.08); }
.channel--main .channel__k { color: var(--espresso); }
.channel--main .channel__v { font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem); }
.channel--main .btn { margin-top: var(--space-sm); }
.pill-link {
  display: inline-flex; align-items: center; gap: 0.45rem; min-height: 40px; padding: 0 1rem; border: 0; border-radius: var(--r-pill);
  background: transparent; box-shadow: inset 0 0 0 1px var(--paper-24); color: var(--marfil); cursor: pointer;
  font-weight: 500; font-size: 0.875rem; text-decoration: none; white-space: nowrap;
  transition: background-color var(--dur-fast) var(--ease-out);
}
.pill-link:hover { background: var(--paper-10); }
.pill-link .ic { width: 16px; height: 16px; }
@media (min-width: 40rem) {
  .channels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .channel--main { grid-column: 1 / -1; }
}
@media (min-width: 64rem) {
  .channels { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto; }
  .channel--main { grid-column: 1; grid-row: 1 / span 2; }
  .channels li:nth-child(4) { grid-column: 2 / span 2; }
}

.tabs { display: inline-flex; gap: 4px; padding: 5px; border-radius: var(--r-pill); background: var(--paper-06); box-shadow: inset 0 0 0 1px var(--paper-06); margin-bottom: var(--space-lg); max-width: 100%; }
.tabs__tab {
  display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0 1.15rem; border: 0; border-radius: var(--r-pill);
  background: transparent; color: var(--muted-dark); cursor: pointer; white-space: nowrap;
  font-weight: 500; font-size: 0.9375rem;
  transition: background-color var(--dur-med) var(--ease-spring), color var(--dur-med) var(--ease-spring);
}
.tabs__tab .ic { width: 18px; height: 18px; }
.tabs__tab:hover { color: var(--marfil); }
.tabs__tab[aria-selected="true"] { background: var(--marfil); color: var(--espresso); }
@media (max-width: 24.99rem) { .tabs__tab { padding: 0 0.85rem; font-size: 0.875rem; } }

.panel {
  background: var(--marfil); color: var(--espresso); border-radius: calc(var(--r-2xl) - 0.75rem);
  padding: clamp(1.1rem, 0.5rem + 3vw, 3rem); box-shadow: 0 0 0 8px var(--paper-06);
}
.panel :focus-visible { outline-color: var(--carmelita); }
.panel iframe { width: 100%; min-height: 720px; border: 0; display: block; border-radius: var(--r-lg); background: var(--marfil); }
.demo { display: grid; gap: var(--space-lg); }
.demo__tag { justify-self: start; padding: 0.4rem 0.9rem; border-radius: var(--r-pill); background: var(--rosa-soft); font-weight: 500; font-size: var(--text-xs); letter-spacing: 0.04em; color: var(--espresso); }

/* Calendario de prueba */
.cal { display: grid; gap: var(--space-xl); }
.cal__nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-md); }
.cal__title { font-family: var(--font-display); font-size: var(--text-xl); }
.cal__arrow { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--beige-soft); cursor: pointer; transition: background-color var(--dur-fast) var(--ease-out); }
.cal__arrow svg { width: 18px; height: 18px; }
.cal__arrow:hover:not([disabled]) { background: var(--beige); }
.cal__arrow[disabled] { opacity: 0.35; cursor: not-allowed; }
.cal__dow, .cal__days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.cal__dow span { text-align: center; font-weight: 500; font-size: 0.6875rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--espresso-70); padding-block: var(--space-xs); }
.cal__day {
  aspect-ratio: 1; min-height: 38px; width: 100%; max-width: 52px; justify-self: center; border: 0; border-radius: 50%; background: transparent; cursor: pointer;
  font-variant-numeric: tabular-nums; font-size: var(--text-md); position: relative;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), transform var(--dur-med) var(--ease-spring);
}
.cal__day.is-open { background: var(--beige-soft); }
.cal__day.is-open:hover { background: var(--beige); transform: scale(1.06); }
.cal__day[disabled] { color: var(--espresso-70); opacity: 0.4; cursor: default; }
.cal__day.is-today::after { content: ""; position: absolute; left: 50%; bottom: 5px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: var(--carmelita); }
.cal__day[aria-pressed="true"] { background: var(--espresso); color: var(--marfil); }
.cal__side { display: grid; gap: var(--space-md); align-content: start; min-width: 0; }
.cal__day-label { font-family: var(--font-display); font-size: var(--text-lg); min-height: 1.6em; }
.slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: var(--space-xs); }
.slot {
  min-height: 44px; border: 0; border-radius: var(--r-pill); background: var(--marfil-hi); box-shadow: inset 0 0 0 1px var(--ink-16); cursor: pointer;
  font-variant-numeric: tabular-nums; font-size: var(--text-sm);
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.slot:hover { background: var(--rosa-soft); }
.slot[aria-selected="true"] { background: var(--espresso); color: var(--marfil); box-shadow: none; }
.slots__empty { grid-column: 1 / -1; font-size: var(--text-sm); color: var(--espresso-70); }
.cal__confirm { justify-self: start; margin-top: var(--space-xs); }
@media (min-width: 52rem) { .cal { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 4.5rem); } }

.done { display: grid; gap: var(--space-sm); justify-items: start; padding: var(--space-lg); border-radius: var(--r-lg); background: var(--rosa-soft); }
.done__t { display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--font-display); font-size: var(--text-xl); }
.done__t .ic { width: 22px; height: 22px; padding: 3px; border-radius: 50%; background: var(--espresso); color: var(--marfil); }
.done__d { color: var(--espresso-70); max-width: 44ch; }

/* Formulario de prueba */
.field { display: grid; gap: var(--space-xs); min-width: 0; border: 0; padding: 0; margin: 0; }
.field__k { font-weight: 500; font-size: var(--text-sm); color: var(--espresso); }
.input {
  width: 100%; min-height: 52px; padding: 0.8rem 1.1rem; border: 1px solid #A7826C; border-radius: var(--r-md);
  background: var(--marfil-hi); color: var(--espresso); font-size: var(--text-md);
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
select.input { appearance: none; -webkit-appearance: none; padding-right: 2.75rem; background-image: linear-gradient(45deg, transparent 50%, var(--espresso) 50%), linear-gradient(135deg, var(--espresso) 50%, transparent 50%); background-position: calc(100% - 22px) 52%, calc(100% - 17px) 52%; background-size: 5px 5px; background-repeat: no-repeat; }
textarea.input { resize: vertical; min-height: 132px; line-height: 1.5; }
.input:hover { border-color: var(--espresso); }
.input:focus-visible { outline: 0; border-color: var(--espresso); box-shadow: 0 0 0 4px var(--rosa); }
.input::placeholder { color: var(--espresso-70); opacity: 1; }
.field__err { display: none; font-size: var(--text-sm); color: var(--carmelita); }
.is-invalid .input { border-color: var(--carmelita); box-shadow: 0 0 0 3px var(--rosa-soft); }
.is-invalid .field__err, .consent-err.is-shown { display: block; }
.field--radio { display: flex; flex-wrap: wrap; gap: var(--space-xs); align-items: center; }
.field--radio legend { width: 100%; margin-bottom: var(--space-xs); }
.radio { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0 1rem; border-radius: var(--r-pill); box-shadow: inset 0 0 0 1px var(--ink-16); cursor: pointer; background: var(--marfil-hi); }
.radio:has(input:checked) { background: var(--beige-soft); box-shadow: inset 0 0 0 1px var(--espresso); }
.check { display: inline-flex; align-items: flex-start; gap: var(--space-sm); cursor: pointer; font-size: var(--text-md); }
input[type="radio"], input[type="checkbox"] { accent-color: var(--espresso); width: 18px; height: 18px; margin: 0; flex: none; }
.check input { margin-top: 0.3rem; }
.form { display: grid; gap: var(--space-lg); }
.form__foot { display: flex; }
@media (min-width: 44rem) {
  .form { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg) var(--space-xl); }
  .field--wide { grid-column: 1 / -1; }
}

/* ─── Pie ─── */
.foot { padding-block: var(--space-xl) var(--space-2xl); }
.foot__inner { display: grid; justify-items: center; text-align: center; gap: var(--space-md); }
.foot__motto { font-family: var(--font-display); font-size: var(--text-2xl); line-height: 1.1; text-wrap: balance; }
.sign--foot { margin-bottom: var(--space-xl); }
.foot__logo { width: 190px; }
.foot__services { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.25rem 1.25rem; font-size: var(--text-sm); color: var(--espresso-70); }
.foot__links { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-xs); margin-top: var(--space-sm); }
.foot__legal { margin-top: var(--space-lg); font-size: var(--text-xs); letter-spacing: 0.04em; color: var(--espresso-70); }

/* ─── Barra flotante de reserva (móvil) ─── */
.dock { display: none; }
@media (max-width: 39.99rem) {
  .dock {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px;
    position: fixed; z-index: 40; left: 12px; right: 12px; bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
    padding: 6px; border-radius: var(--r-pill);
    background: var(--glass); -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3);
    box-shadow: inset 0 0 0 1px var(--ink-06), var(--shadow-float);
    transition: transform var(--dur-med) var(--ease-spring), opacity var(--dur-med) var(--ease-out);
  }
  .dock .btn { min-height: 50px; }
  .dock__wa { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; background: var(--rosa); color: var(--espresso); }
  .dock__wa svg { width: 24px; height: 24px; }
  .dock.is-hidden { transform: translateY(140%); opacity: 0; }
  body { padding-bottom: 88px; }
}

/* ─── Movimiento reducido ─── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; transition-delay: 0ms !important; }
}

.svc__price { display: inline-flex; padding: 0.35rem 0.85rem; border-radius: var(--r-pill); background: var(--marfil-hi); box-shadow: inset 0 0 0 1px var(--ink-10); font-weight: 500; font-size: var(--text-sm); }


/* ════════ Movimiento e interacción ════════ */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }

/* Indicador deslizante del menú */
.nav__links { position: relative; }
.nav__glide {
  position: absolute; top: 0; left: 0; height: 100%; width: 0; border-radius: var(--r-pill);
  background: var(--beige-soft); opacity: 0; pointer-events: none; z-index: 0;
  transition: transform 520ms var(--ease-spring), width 520ms var(--ease-spring), opacity 300ms var(--ease-out);
}
.nav__links a { position: relative; z-index: 1; background: transparent !important; transition: color var(--dur-fast) var(--ease-out); }
.nav__links a[aria-current="true"] { color: var(--carmelita); }

/* Insignia giratoria */
.spin {
  position: absolute; left: 4%; top: 6%; z-index: 3; width: clamp(104px, 22%, 132px); aspect-ratio: 1;
  display: grid; place-items: center; border-radius: 50%; text-decoration: none; color: var(--espresso);
  background: var(--glass); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: inset 0 0 0 1px var(--ink-06), var(--shadow-soft);
  transition: scale 700ms var(--ease-spring);
}
.spin__ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: spin 22s linear infinite; }
.spin__ring text { font-family: var(--font-body); font-weight: 500; font-size: 13.5px; letter-spacing: 0.2em; text-transform: uppercase; fill: var(--espresso); }
.spin__core {
  display: grid; place-items: center; width: 44%; aspect-ratio: 1; border-radius: 50%;
  background: var(--espresso); color: var(--marfil);
  transition: background-color 400ms var(--ease-out);
}
.spin__core svg { width: 42%; height: 42%; transition: transform 700ms var(--ease-spring); }
.spin:hover { scale: 1.06; }
.spin:hover .spin__core { background: var(--carmelita); }
.spin:hover .spin__core svg { transform: rotate(45deg); }
.spin:hover .spin__ring { animation-duration: 7s; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Marquesina de servicios */
.marquee { overflow: hidden; padding-block: clamp(1.5rem, 1rem + 2vw, 3rem) var(--space-3xl); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee__track { display: flex; width: max-content; will-change: transform; }
.marquee__group { display: flex; align-items: center; gap: clamp(1.25rem, 3vw, 2.75rem); padding-right: clamp(1.25rem, 3vw, 2.75rem); }
.marquee__item {
  font-family: var(--font-display); font-weight: 500; font-size: clamp(2.75rem, 1.6rem + 5vw, 6rem); line-height: 1.1;
  color: var(--espresso); text-decoration: none; white-space: nowrap; padding-bottom: 0.1em;
  transition: color 500ms var(--ease-out), opacity 500ms var(--ease-out);
}
.marquee__item--it { font-style: italic; font-weight: 400; color: var(--carmelita); }
.marquee:hover .marquee__item { opacity: 0.35; }
.marquee .marquee__item:hover { opacity: 1; color: var(--espresso); }
.marquee__spark { width: clamp(1.5rem, 1rem + 1.5vw, 2.5rem); height: clamp(1.5rem, 1rem + 1.5vw, 2.5rem); color: var(--carmelita); opacity: 0.55; animation: spin 9s linear infinite; }

/* Fotos: brillo, marco que respira y zoom suave */
.photo, .shell__core { transform-style: preserve-3d; }
.photo::before, .shell__core::before {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(115deg, transparent 30%, rgba(250, 245, 238, 0.38) 48%, transparent 66%);
  transform: translateX(-120%); transition: transform 1100ms var(--ease-spring);
}
.photo::after, .shell__core::after { transition: inset 700ms var(--ease-spring), box-shadow 700ms var(--ease-out); z-index: 3; }
.photo img { transition: scale 1400ms var(--ease-spring), filter 900ms var(--ease-out); }
[data-tilt] { transition: box-shadow 700ms var(--ease-out); will-change: transform; }
@media (hover: hover) and (pointer: fine) {
  .photo:hover::before, .services__stage:hover .shell__core::before { transform: translateX(120%); }
  .photo:hover::after, .services__stage:hover .shell__core::after { inset: 18px; box-shadow: inset 0 0 0 1px rgba(250, 245, 238, 0.95); }
  .photo:hover img { scale: 1.07; filter: saturate(1.06) brightness(1.03); }
  .arch:hover .arch__img.is-on { scale: 1.04; transition: opacity 1400ms var(--ease-out), scale 1400ms var(--ease-spring); }
}

/* Tarjetas que se elevan */
.channel, .svc, .chip, .pill-link, .demo__tag, .slot {
  transition: translate 700ms var(--ease-spring), background-color 400ms var(--ease-out), box-shadow 600ms var(--ease-out), color 300ms var(--ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .channel:hover { translate: 0 -6px; }
  .channel:hover .channel__ic { transform: rotate(-10deg) scale(1.08); background: var(--carmelita); color: var(--marfil); }
  .channel--main:hover .channel__ic { background: var(--espresso); }
  .svc:hover { background: var(--beige-soft); }
  .svc:hover .svc__name { transform: translateX(6px); }
  .slot:hover { translate: 0 -2px; }
  .pill-link:hover { translate: 0 -2px; }
  .foot__logo:hover { transform: scale(1.04); }
}
.channel__ic, .svc__name, .foot__logo { transition: transform 700ms var(--ease-spring), background-color 400ms var(--ease-out), color 400ms var(--ease-out); }

/* Imagen del servicio: barrido de abajo arriba */
@media (min-width: 60rem) {
  .services__stage img { opacity: 0; clip-path: inset(100% 0 0 0); transform: scale(1.08); z-index: 0; transition: none; }
  .services__stage img.is-prev { opacity: 1; clip-path: inset(0 0 0 0); transform: none; z-index: 1; }
  .services__stage img.is-on { opacity: 1; clip-path: inset(0 0 0 0); transform: none; z-index: 2; transition: clip-path 1100ms var(--ease-spring), transform 1500ms var(--ease-spring); }
}

/* Títulos divididos en líneas */
.split-line { padding-bottom: 0.08em; margin-bottom: -0.08em; }

@media (prefers-reduced-motion: reduce) {
  .spin__ring, .marquee__spark { animation: none; }
  .marquee__track { transform: none !important; }
}

/* ─── PhotoSwipe 5.4.4 (MIT) ─── */
/*! PhotoSwipe main CSS by Dmytro Semenov | photoswipe.com */

.pswp {
  --pswp-bg: #000;
  --pswp-placeholder-bg: #222;
  

  --pswp-root-z-index: 100000;
  
  --pswp-preloader-color: rgba(79, 79, 79, 0.4);
  --pswp-preloader-color-secondary: rgba(255, 255, 255, 0.9);
  
  /* defined via js:
  --pswp-transition-duration: 333ms; */
  
  --pswp-icon-color: #fff;
  --pswp-icon-color-secondary: #4f4f4f;
  --pswp-icon-stroke-color: #4f4f4f;
  --pswp-icon-stroke-width: 2px;

  --pswp-error-text-color: var(--pswp-icon-color);
}


/*
	Styles for basic PhotoSwipe (pswp) functionality (sliding area, open/close transitions)
*/

.pswp {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: var(--pswp-root-z-index);
	display: none;
	touch-action: none;
	outline: 0;
	opacity: 0.003;
	contain: layout style size;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* Prevents focus outline on the root element,
  (it may be focused initially) */
.pswp:focus {
  outline: 0;
}

.pswp * {
  box-sizing: border-box;
}

.pswp img {
  max-width: none;
}

.pswp--open {
	display: block;
}

.pswp,
.pswp__bg {
	transform: translateZ(0);
	will-change: opacity;
}

.pswp__bg {
  opacity: 0.005;
	background: var(--pswp-bg);
}

.pswp,
.pswp__scroll-wrap {
	overflow: hidden;
}

.pswp__scroll-wrap,
.pswp__bg,
.pswp__container,
.pswp__item,
.pswp__content,
.pswp__img,
.pswp__zoom-wrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.pswp__img,
.pswp__zoom-wrap {
	width: auto;
	height: auto;
}

.pswp--click-to-zoom.pswp--zoom-allowed .pswp__img {
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
	cursor: zoom-in;
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img {
	cursor: move;
	cursor: -webkit-grab;
	cursor: -moz-grab;
	cursor: grab;
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: grabbing;
}

/* :active to override grabbing cursor */
.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img,
.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img:active,
.pswp__img {
	cursor: -webkit-zoom-out;
	cursor: -moz-zoom-out;
	cursor: zoom-out;
}


/* Prevent selection and tap highlights */
.pswp__container,
.pswp__img,
.pswp__button,
.pswp__counter {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.pswp__item {
	/* z-index for fade transition */
	z-index: 1;
	overflow: hidden;
}

.pswp__hidden {
	display: none !important;
}

/* Allow to click through pswp__content element, but not its children */
.pswp__content {
  pointer-events: none;
}
.pswp__content > * {
  pointer-events: auto;
}


/*

  PhotoSwipe UI

*/

/*
	Error message appears when image is not loaded
	(JS option errorMsg controls markup)
*/
.pswp__error-msg-container {
  display: grid;
}
.pswp__error-msg {
	margin: auto;
	font-size: 1em;
	line-height: 1;
	color: var(--pswp-error-text-color);
}

/*
class pswp__hide-on-close is applied to elements that
should hide (for example fade out) when PhotoSwipe is closed
and show (for example fade in) when PhotoSwipe is opened
 */
.pswp .pswp__hide-on-close {
	opacity: 0.005;
	will-change: opacity;
	transition: opacity var(--pswp-transition-duration) cubic-bezier(0.4, 0, 0.22, 1);
	z-index: 10; /* always overlap slide content */
	pointer-events: none; /* hidden elements should not be clickable */
}

/* class pswp--ui-visible is added when opening or closing transition starts */
.pswp--ui-visible .pswp__hide-on-close {
	opacity: 1;
	pointer-events: auto;
}

/* <button> styles, including css reset */
.pswp__button {
	position: relative;
	display: block;
	width: 50px;
	height: 60px;
	padding: 0;
	margin: 0;
	overflow: hidden;
	cursor: pointer;
	background: none;
	border: 0;
	box-shadow: none;
	opacity: 0.85;
	-webkit-appearance: none;
	-webkit-touch-callout: none;
}

.pswp__button:hover,
.pswp__button:active,
.pswp__button:focus {
  transition: none;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
  opacity: 1;
}

.pswp__button:disabled {
  opacity: 0.3;
  cursor: auto;
}

.pswp__icn {
  fill: var(--pswp-icon-color);
  color: var(--pswp-icon-color-secondary);
}

.pswp__icn {
  position: absolute;
  top: 14px;
  left: 9px;
  width: 32px;
  height: 32px;
  overflow: hidden;
  pointer-events: none;
}

.pswp__icn-shadow {
  stroke: var(--pswp-icon-stroke-color);
  stroke-width: var(--pswp-icon-stroke-width);
  fill: none;
}

.pswp__icn:focus {
	outline: 0;
}

/*
	div element that matches size of large image,
	large image loads on top of it,
	used when msrc is not provided
*/
div.pswp__img--placeholder,
.pswp__img--with-bg {
	background: var(--pswp-placeholder-bg);
}

.pswp__top-bar {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 60px;
	display: flex;
  flex-direction: row;
  justify-content: flex-end;
	z-index: 10;

	/* allow events to pass through top bar itself */
	pointer-events: none !important;
}
.pswp__top-bar > * {
  pointer-events: auto;
  /* this makes transition significantly more smooth,
     even though inner elements are not animated */
  will-change: opacity;
}


/*

  Close button

*/
.pswp__button--close {
  margin-right: 6px;
}


/*

  Arrow buttons

*/
.pswp__button--arrow {
  position: absolute;
  top: 0;
  width: 75px;
  height: 100px;
  top: 50%;
  margin-top: -50px;
}

.pswp__button--arrow:disabled {
  display: none;
  cursor: default;
}

.pswp__button--arrow .pswp__icn {
  top: 50%;
  margin-top: -30px;
  width: 60px;
  height: 60px;
  background: none;
  border-radius: 0;
}

.pswp--one-slide .pswp__button--arrow {
  display: none;
}

/* hide arrows on touch screens */
.pswp--touch .pswp__button--arrow {
  visibility: hidden;
}

/* show arrows only after mouse was used */
.pswp--has_mouse .pswp__button--arrow {
  visibility: visible;
}

.pswp__button--arrow--prev {
  right: auto;
  left: 0px;
}

.pswp__button--arrow--next {
  right: 0px;
}
.pswp__button--arrow--next .pswp__icn {
  left: auto;
  right: 14px;
  /* flip horizontally */
  transform: scale(-1, 1);
}

/*

  Zoom button

*/
.pswp__button--zoom {
  display: none;
}

.pswp--zoom-allowed .pswp__button--zoom {
  display: block;
}

/* "+" => "-" */
.pswp--zoomed-in .pswp__zoom-icn-bar-v {
  display: none;
}


/*

  Loading indicator

*/
.pswp__preloader {
  position: relative;
  overflow: hidden;
  width: 50px;
  height: 60px;
  margin-right: auto;
}

.pswp__preloader .pswp__icn {
  opacity: 0;
  transition: opacity 0.2s linear;
  animation: pswp-clockwise 600ms linear infinite;
}

.pswp__preloader--active .pswp__icn {
  opacity: 0.85;
}

@keyframes pswp-clockwise {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/*

  "1 of 10" counter

*/
.pswp__counter {
  height: 30px;
  margin-top: 15px;
  margin-inline-start: 20px;
  font-size: 14px;
  line-height: 30px;
  color: var(--pswp-icon-color);
  text-shadow: 1px 1px 3px var(--pswp-icon-color-secondary);
  opacity: 0.85;
}

.pswp--one-slide .pswp__counter {
  display: none;
}

/* Personalización del visor (después del CSS base de PhotoSwipe) */
.pswp { --pswp-bg: #1d1410; --pswp-placeholder-bg: #3A2C25; --pswp-root-z-index: 100; --pswp-icon-color: #FAF5EE; --pswp-icon-color-secondary: #2B1E18; --pswp-icon-stroke-color: #2B1E18; --pswp-bg-opacity: 0.96; }
.stack__video video { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ════════ Sitio multipágina: navegación, cabeceras y bloques de las páginas interiores ════════ */
.nav__links a[aria-current="page"] { color: var(--carmelita); }
.menu__links a[aria-current="page"] { color: var(--carmelita); }
.menu.is-open .menu__links a:nth-child(6) { transition-delay: 310ms; }
.menu.is-open .menu__cta { transition-delay: 370ms; }
.link--soft { color: var(--espresso-70); }
.svc__links { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 1.5rem; }
.section-more { display: flex; justify-content: center; margin-top: var(--space-xl); }
body[data-no-dock] .dock { display: none; }
@media (max-width: 39.99rem) { body[data-no-dock] { padding-bottom: 0; } }

/* Cabecera de página */
.phead {
  display: grid; gap: clamp(2.5rem, 5vw, 4rem); align-items: center;
  padding-top: calc(var(--nav-h) + var(--nav-top) + clamp(2rem, 1rem + 4vw, 4.5rem));
  padding-bottom: clamp(3.5rem, 2rem + 5vw, 7rem);
}
.phead__copy { display: grid; gap: var(--space-lg); justify-items: start; min-width: 0; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; font-size: var(--text-sm); color: var(--espresso-70); }
.crumbs a { text-decoration: none; padding: 0.2rem 0; transition: color var(--dur-fast) var(--ease-out); }
.crumbs a:hover { color: var(--carmelita); }
.crumbs [aria-current] { color: var(--espresso); font-weight: 500; }
.phead__title {
  font-family: var(--font-display); font-weight: 500; font-size: var(--text-display); line-height: 1.02; letter-spacing: -0.015em;
  max-width: 15ch; text-wrap: balance; overflow-wrap: anywhere; min-width: 0;
}
.phead__accent { color: var(--carmelita); }
.phead__lede { font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); line-height: 1.6; color: var(--espresso-70); max-width: 46ch; text-wrap: pretty; }
@media (min-width: 60rem) { .phead { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); } }
.phead--book { padding-bottom: var(--space-2xl); }
@media (min-width: 60rem) { .phead--book { grid-template-columns: minmax(0, 1fr); } .phead--book .phead__title { max-width: none; } }

/* Índice de servicios */
.sindex { min-width: 0; }
.sindex ol { list-style: none; display: grid; gap: 0.5rem; }
.sindex__a {
  display: flex; align-items: center; gap: 0.9rem; padding: 6px 1.4rem 6px 6px; border-radius: var(--r-pill);
  background: var(--beige-soft); color: var(--espresso); text-decoration: none; white-space: nowrap;
  transition: translate 700ms var(--ease-spring), background-color 400ms var(--ease-out), color 400ms var(--ease-out);
}
.sindex__img { width: 52px; height: 52px; border-radius: 50%; overflow: hidden; flex: none; background: var(--beige); }
.sindex__img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; transition: scale 900ms var(--ease-spring); }
.sindex__n { font-family: var(--font-display); font-size: var(--text-xl); line-height: 1.1; }
.sindex__a:hover { background: var(--espresso); color: var(--marfil); translate: 6px 0; }
.sindex__a:hover .sindex__img img { scale: 1.15; }
@media (max-width: 59.99rem) {
  .sindex { margin-inline: calc(var(--gutter) * -1); }
  .sindex ol { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; padding: 4px var(--gutter) 10px; scroll-snap-type: x proximity; scrollbar-width: none; }
  .sindex ol::-webkit-scrollbar { display: none; }
  .sindex li { scroll-snap-align: start; }
  .sindex__n { font-size: var(--text-lg); }
  .sindex__img { width: 44px; height: 44px; }
}

/* Capítulos de servicio */
.chapter {
  position: relative; display: grid; gap: var(--space-xl);
  padding-block: clamp(3rem, 2rem + 4vw, 6rem);
  scroll-margin-top: calc(var(--nav-h) + var(--nav-top));
}
.chapter::before { content: ""; position: absolute; top: 0; left: var(--gutter); right: var(--gutter); height: 1px; background: var(--ink-10); }
.chapter__media { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-sm); min-width: 0; }
.chapter__main { grid-column: 1 / span 4; grid-row: 1 / span 2; aspect-ratio: 4 / 5; }
.chapter__thumb { aspect-ratio: 4 / 5; border-radius: var(--r-lg); }
.chapter__thumb::after { border-radius: calc(var(--r-lg) - 8px); inset: 8px; }
.chapter__thumb--1 { grid-column: 5 / span 2; grid-row: 1; align-self: end; }
.chapter__thumb--2 { grid-column: 5 / span 2; grid-row: 2; align-self: start; }
.chapter__video {
  position: absolute; left: 14px; bottom: 14px; z-index: 4; width: 26%; aspect-ratio: 9 / 16; padding: 0; border: 0; cursor: pointer;
  border-radius: var(--r-lg); overflow: hidden; background: var(--espresso);
  box-shadow: 0 0 0 5px var(--marfil), var(--shadow-float);
  transition: scale 700ms var(--ease-spring);
}
.chapter__video video { width: 100%; height: 100%; object-fit: cover; }
.chapter__play { position: absolute; left: 50%; top: 50%; translate: -50% -50%; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(250, 245, 238, 0.85); color: var(--espresso); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: scale 600ms var(--ease-spring); }
.chapter__play svg { width: 16px; height: 16px; margin-left: 2px; }
.chapter__video:hover { scale: 1.05; }
.chapter__video:hover .chapter__play { scale: 1.12; }
.chapter__body { display: grid; gap: var(--space-md); justify-items: start; align-content: center; min-width: 0; }
.chapter__n { font-family: var(--font-display); font-style: italic; font-size: clamp(2.5rem, 2rem + 2vw, 3.75rem); line-height: 0.9; color: var(--carmelita); }
.chapter__t { font-family: var(--font-display); font-weight: 500; font-size: var(--text-2xl); line-height: 1.02; letter-spacing: -0.01em; }
.chapter__lede { color: var(--espresso-70); max-width: 54ch; text-wrap: pretty; }
.chapter__quote p { font-family: var(--font-display); font-style: italic; font-size: var(--text-xl); line-height: 1.35; max-width: 34ch; padding-left: 1rem; border-left: 2px solid var(--rosa); }
.chapter__cols { display: grid; gap: var(--space-lg); width: 100%; margin-top: var(--space-xs); }
.chapter__k { font-family: var(--font-body); font-weight: 500; font-size: var(--text-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--carmelita); margin-bottom: 0.7rem; }
.ticks { list-style: none; display: grid; gap: 0.55rem; }
.ticks li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 0.65rem; align-items: start; font-size: var(--text-sm); line-height: 1.5; }
.ticks__ic { width: 22px; height: 22px; padding: 5px; border-radius: 50%; background: var(--rosa-soft); color: var(--carmelita); }
.chapter__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm) var(--space-lg); margin-top: var(--space-sm); }
@media (min-width: 40rem) { .chapter__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 60rem) {
  .chapter { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(3rem, 6vw, 6rem); align-items: center; }
  .chapter--flip .chapter__media { order: 2; }
}

/* Consulta de diagnóstico */
.consult { padding-block: var(--space-xl) var(--space-3xl); }
.consult__in { display: grid; gap: var(--space-lg); align-items: center; justify-items: start; padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); border-radius: var(--r-2xl); background: var(--rosa); }
.consult__ic { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--marfil); color: var(--carmelita); }
.consult__ic svg { width: 28px; height: 28px; }
.consult__txt { display: grid; gap: 0.5rem; max-width: 60ch; }
@media (min-width: 52rem) { .consult__in { grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-xl); } }

/* Preguntas frecuentes */
.faq { display: grid; gap: var(--space-xl); padding-bottom: var(--space-3xl); }
.faq__head { display: grid; gap: var(--space-md); justify-items: start; align-content: start; }
.faq__list { display: grid; gap: var(--space-sm); }
.faq__item { border-radius: var(--r-xl); background: var(--beige-soft); transition: background-color 500ms var(--ease-out), box-shadow 500ms var(--ease-out); }
.faq__item[open] { background: var(--marfil-hi); box-shadow: inset 0 0 0 1px var(--ink-10), var(--shadow-soft); }
.faq__q { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); padding: 1.1rem 1.1rem 1.1rem 1.5rem; cursor: pointer; list-style: none; font-family: var(--font-display); font-size: var(--text-lg); line-height: 1.25; border-radius: var(--r-xl); }
.faq__q::-webkit-details-marker { display: none; }
.faq__ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--marfil); flex: none; transition: rotate 600ms var(--ease-spring), background-color 400ms var(--ease-out), color 400ms var(--ease-out); }
.faq__ic svg { width: 16px; height: 16px; }
.faq__q:hover .faq__ic { background: var(--rosa); }
.faq__item[open] .faq__ic { rotate: 45deg; background: var(--espresso); color: var(--marfil); }
.faq__a { padding: 0 1.5rem 1.4rem; color: var(--espresso-70); max-width: 62ch; }
.faq__item[open] .faq__a { animation: faqIn 600ms var(--ease-spring); }
@keyframes faqIn { from { opacity: 0; translate: 0 -8px; } to { opacity: 1; translate: 0 0; } }
@media (min-width: 60rem) {
  .faq { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(3rem, 6vw, 6rem); }
  .faq__head { position: sticky; top: calc(var(--nav-h) + var(--nav-top) + 2rem); align-self: start; }
}

/* Franja de cierre */
.band { padding-bottom: var(--space-3xl); }
.band__in {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; justify-items: center; text-align: center; gap: var(--space-md);
  padding: clamp(2.5rem, 1.5rem + 4vw, 5rem) clamp(1.25rem, 1rem + 3vw, 4rem); border-radius: var(--r-2xl); background: var(--beige);
}
.band__in::before { content: ""; position: absolute; z-index: -1; right: -18%; top: -45%; width: min(70%, 620px); aspect-ratio: 1; border-radius: 50%; background: var(--rosa); opacity: 0.55; }
.band--dark .band__in { background: var(--espresso); color: var(--marfil); }
.band--dark .band__in::before { opacity: 0.1; }
.band__seal img { width: 72px; height: 72px; }
.band__t { max-width: 20ch; }
.band__d { max-width: 48ch; color: var(--espresso-70); }
.band--dark .band__d { color: var(--muted-dark); }
.band__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-sm); margin-top: var(--space-sm); }
.band--dark .btn--primary, .band--dark .btn--light { --btn-bg: var(--marfil); --btn-fg: var(--espresso); --btn-ic: var(--ink-06); }
.band--dark .btn--primary:hover, .band--dark .btn--light:hover { --btn-bg: var(--rosa); }
.band--dark :focus-visible { outline-color: var(--rosa); }
.btn--onDark { --btn-fg: var(--marfil); box-shadow: inset 0 0 0 1px var(--paper-24); --btn-ic: var(--paper-10); }
.btn--onDark:hover { --btn-bg: var(--paper-10); }

/* Trabajos: datos, abanico y reels */
.facts { list-style: none; display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.facts li { display: grid; gap: 0.2rem; padding: 0.9rem 1.4rem; border-radius: var(--r-xl); background: var(--beige-soft); min-width: 6.5rem; }
.facts__n { font-family: var(--font-display); font-size: clamp(2.25rem, 1.8rem + 1.5vw, 3rem); line-height: 1; font-variant-numeric: lining-nums tabular-nums; }
.facts__k { font-size: var(--text-sm); color: var(--espresso-70); }
.fan { position: relative; width: 100%; max-width: 560px; justify-self: center; aspect-ratio: 1 / 0.95; }
.fan__p { position: absolute; width: 46%; aspect-ratio: 4 / 5; box-shadow: 0 0 0 6px var(--marfil), var(--shadow-float); transition: rotate 900ms var(--ease-spring), translate 900ms var(--ease-spring); }
.fan__p--1 { left: 2%; top: 16%; rotate: -8deg; }
.fan__p--2 { left: 27%; top: 0; z-index: 2; }
.fan__p--3 { right: 2%; top: 18%; rotate: 8deg; }
@media (hover: hover) and (pointer: fine) {
  .fan:hover .fan__p--1 { rotate: -13deg; translate: -18px 6px; }
  .fan:hover .fan__p--2 { translate: 0 -10px; }
  .fan:hover .fan__p--3 { rotate: 13deg; translate: 18px 6px; }
}
.reels { padding-bottom: var(--space-3xl); }
.reels__head { display: grid; gap: var(--space-md); margin-bottom: var(--space-xl); }
.reels__track {
  list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: min(60vw, 240px); gap: var(--space-sm);
  overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--space-sm); scrollbar-width: thin; scrollbar-color: var(--beige) transparent;
}
.reel { scroll-snap-align: start; min-width: 0; }
.reel__btn {
  position: relative; isolation: isolate; display: block; width: 100%; aspect-ratio: 9 / 16; padding: 0; border: 0; cursor: pointer;
  border-radius: var(--r-xl); overflow: hidden; background: var(--espresso); color: var(--marfil);
  transition: translate 700ms var(--ease-spring);
}
.reel__btn video { width: 100%; height: 100%; object-fit: cover; transition: scale 1400ms var(--ease-spring); }
.reel__btn::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(43, 30, 24, 0.7)); pointer-events: none; }
.reel__play { position: absolute; top: 12px; right: 12px; z-index: 2; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(250, 245, 238, 0.85); color: var(--espresso); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: scale 600ms var(--ease-spring); }
.reel__play svg { width: 18px; height: 18px; margin-left: 2px; }
.reel__cap { position: absolute; left: 14px; right: 14px; bottom: 14px; z-index: 2; text-align: left; font-size: var(--text-sm); line-height: 1.35; }
@media (hover: hover) and (pointer: fine) {
  .reel__btn:hover { translate: 0 -6px; }
  .reel__btn:hover video { scale: 1.06; }
  .reel__btn:hover .reel__play { scale: 1.12; }
}
@media (min-width: 60rem) { .reels__head { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; } }
@media (min-width: 64rem) { .reels__track { grid-auto-flow: row; grid-template-columns: repeat(6, minmax(0, 1fr)); overflow: visible; padding-bottom: 0; } }

/* Sobre mí */
.portrait { position: relative; width: 100%; max-width: 470px; justify-self: center; aspect-ratio: 1 / 1.12; }
.portrait__halo { position: absolute; left: 2%; top: 4%; width: 80%; aspect-ratio: 1; border-radius: 50%; background: var(--rosa); opacity: 0.85; }
.arch--static { right: 3%; width: 72%; }
.orb--about { left: 0; bottom: 3%; width: 36%; }
.sign--hero { color: var(--carmelita); margin-top: -0.25rem; }
.story { display: grid; gap: var(--space-xl); padding-bottom: var(--space-3xl); }
.story__side { display: grid; gap: var(--space-xl); align-content: start; }
.story__photo { aspect-ratio: 4 / 5; max-width: 460px; }
.story__text { display: grid; gap: var(--space-md); align-content: start; max-width: 62ch; }
.story__text > p { color: var(--espresso-70); }
.story__text > .story__lead { font-family: var(--font-display); font-size: var(--text-xl); line-height: 1.35; color: var(--espresso); }
.pull { margin-top: var(--space-lg); padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); border-radius: var(--r-2xl); background: var(--rosa); display: grid; gap: var(--space-sm); }
.pull__ic { width: 36px; height: 36px; color: var(--carmelita); }
.pull p { font-family: var(--font-display); font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); line-height: 1.2; color: var(--espresso); text-wrap: balance; }
@media (min-width: 60rem) {
  .story { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(3rem, 6vw, 6rem); }
  .story__side { position: sticky; top: calc(var(--nav-h) + var(--nav-top) + 2rem); align-self: start; }
}
.duo { display: grid; gap: var(--space-sm); padding-bottom: var(--space-3xl); }
.duo .card--video { grid-area: auto; grid-row: auto; grid-column: auto; min-height: 480px; }
.numbers { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-sm); }
.numbers__i { display: grid; align-content: space-between; gap: var(--space-lg); padding: clamp(1.25rem, 1rem + 1.5vw, 2rem); border-radius: var(--r-xl); background: var(--marfil-hi); box-shadow: inset 0 0 0 1px var(--ink-06); min-height: 190px; transition: translate 700ms var(--ease-spring); }
.numbers__i--dark { background: var(--espresso); color: var(--marfil); box-shadow: none; }
.numbers__i--rosa { background: var(--rosa); box-shadow: none; }
.numbers__i--beige { background: var(--beige); box-shadow: none; }
.numbers__n { font-family: var(--font-display); font-size: clamp(3.5rem, 2.5rem + 3vw, 5.5rem); line-height: 0.85; font-variant-numeric: lining-nums; }
.numbers__k { font-size: var(--text-sm); line-height: 1.4; }
.numbers__i--dark .numbers__k { color: var(--muted-dark); }
@media (hover: hover) and (pointer: fine) { .numbers__i:hover { translate: 0 -5px; } }
@media (min-width: 56rem) { .duo { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } .duo .card--video { min-height: 100%; } }
.ways { padding-bottom: var(--space-3xl); }
.ways__list { list-style: none; display: grid; gap: var(--space-sm); }
.way {
  position: relative; overflow: hidden; display: grid; gap: 0.5rem; align-content: start;
  padding: clamp(1.5rem, 1rem + 1.5vw, 2rem); border-radius: var(--r-xl); background: var(--beige-soft);
  transition: translate 700ms var(--ease-spring), background-color 500ms var(--ease-out);
}
.way__n { position: absolute; right: 1.25rem; top: 0.75rem; font-family: var(--font-display); font-style: italic; font-size: 3.25rem; line-height: 1; color: var(--carmelita); opacity: 0.4; }
.way__ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--marfil); color: var(--carmelita); margin-bottom: var(--space-sm); transition: rotate 700ms var(--ease-spring), background-color 400ms var(--ease-out), color 400ms var(--ease-out); }
.way__ic svg { width: 24px; height: 24px; }
.way__t { font-family: var(--font-display); font-weight: 500; font-size: var(--text-xl); line-height: 1.15; }
.way p { color: var(--espresso-70); font-size: var(--text-sm); }
@media (hover: hover) and (pointer: fine) {
  .way:hover { translate: 0 -6px; background: var(--rosa-soft); }
  .way:hover .way__ic { rotate: -10deg; background: var(--espresso); color: var(--marfil); }
}
@media (min-width: 40rem) { .ways__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .ways__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.igrid { padding-bottom: var(--space-3xl); }
.igrid__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: var(--space-md); margin-bottom: var(--space-xl); }
.igrid__list { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xs); }
.igrid__a { display: block; border-radius: var(--r-lg); }
.igrid__p { aspect-ratio: 4 / 5; border-radius: var(--r-lg); }
.igrid__p::after { border-radius: calc(var(--r-lg) - 8px); inset: 8px; }
@media (min-width: 60rem) { .igrid__list { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-sm); } }

/* Cuidado */
.care-hero { position: relative; display: grid; width: 100%; max-width: 520px; justify-self: center; }
.care-hero__photo { width: 80%; justify-self: end; aspect-ratio: 4 / 5; }
.care-hero__card { position: relative; z-index: 4; width: min(88%, 380px); margin-top: -34%; }
.care-hero__card .checks li { padding: 0.65rem 0.85rem; font-size: var(--text-sm); }
.prep { padding-bottom: var(--space-3xl); }
.prep__list { list-style: none; display: grid; gap: var(--space-sm); }
.prep__i {
  display: grid; gap: 0.5rem; align-content: start; padding: clamp(1.5rem, 1rem + 1.5vw, 2rem); border-radius: var(--r-xl);
  background: var(--marfil-hi); box-shadow: inset 0 0 0 1px var(--ink-06);
  transition: translate 700ms var(--ease-spring), box-shadow 600ms var(--ease-out);
}
.prep__ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--rosa-soft); color: var(--carmelita); margin-bottom: var(--space-sm); transition: rotate 700ms var(--ease-spring), background-color 400ms var(--ease-out), color 400ms var(--ease-out); }
.prep__ic svg { width: 26px; height: 26px; }
.prep__t { font-family: var(--font-display); font-weight: 500; font-size: var(--text-xl); line-height: 1.15; }
.prep__i p { color: var(--espresso-70); font-size: var(--text-sm); }
@media (hover: hover) and (pointer: fine) {
  .prep__i:hover { translate: 0 -6px; box-shadow: inset 0 0 0 1px var(--ink-06), var(--shadow-soft); }
  .prep__i:hover .prep__ic { rotate: -10deg; background: var(--espresso); color: var(--marfil); }
}
@media (min-width: 40rem) { .prep__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .prep__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.guide { padding-bottom: var(--space-3xl); }
.guide__in { padding: clamp(1.25rem, 0.5rem + 3.5vw, 4rem); border-radius: var(--r-2xl); background: var(--espresso); color: var(--marfil); box-shadow: var(--shadow-float); }
.guide__in :focus-visible { outline-color: var(--rosa); }
.guide .tabs { display: flex; width: max-content; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.guide .tabs::-webkit-scrollbar { display: none; }
.guide__panel { display: grid; gap: var(--space-lg); background: var(--marfil); color: var(--espresso); border-radius: calc(var(--r-2xl) - 0.75rem); padding: clamp(1rem, 0.5rem + 2vw, 2rem); box-shadow: 0 0 0 8px var(--paper-06); }
.guide__panel:not([hidden]) { animation: pop 600ms var(--ease-spring); }
.guide__panel :focus-visible { outline-color: var(--carmelita); }
.guide__photo { aspect-ratio: 4 / 3; }
.guide__body { display: grid; gap: var(--space-md); align-content: center; }
.guide__t { font-family: var(--font-display); font-weight: 500; font-size: var(--text-2xl); line-height: 1.05; }
@media (min-width: 52rem) { .guide__panel { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; } .guide__photo { aspect-ratio: 4 / 5; } }
.rhythm { padding-bottom: var(--space-3xl); }
.rhythm__list { list-style: none; position: relative; display: grid; gap: var(--space-xl); }
.rhythm__list::before { content: ""; position: absolute; left: 11px; top: 0.6rem; bottom: 0.6rem; width: 2px; background: linear-gradient(var(--rosa), var(--beige)); }
.rhythm__i { position: relative; display: grid; gap: 0.35rem; padding-left: 3rem; }
.rhythm__dot { position: absolute; left: 0; top: 0.3rem; width: 24px; height: 24px; border-radius: 50%; background: var(--rosa); box-shadow: 0 0 0 6px var(--marfil); }
.rhythm__i:last-child .rhythm__dot { background: var(--espresso); }
.rhythm__k { font-family: var(--font-display); font-size: var(--text-2xl); line-height: 1; }
.rhythm__d { color: var(--espresso-70); font-size: var(--text-sm); max-width: 28ch; }
@media (min-width: 56rem) {
  .rhythm__list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .rhythm__list::before { left: 0; right: 0; top: 11px; bottom: auto; width: auto; height: 2px; background: linear-gradient(90deg, var(--rosa), var(--beige)); }
  .rhythm__i { padding-left: 0; padding-top: 3.25rem; }
  .rhythm__dot { top: 0; }
}

/* Reservas */
.pills { list-style: none; display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.pills li { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.55rem 1rem; border-radius: var(--r-pill); background: var(--beige-soft); font-weight: 500; font-size: var(--text-sm); white-space: nowrap; }
.pills .ic { color: var(--carmelita); }
.steps { padding-bottom: var(--space-3xl); }
.steps__list { list-style: none; display: grid; gap: var(--space-sm); }
.step { position: relative; display: grid; gap: 0.5rem; align-content: start; padding: clamp(1.5rem, 1rem + 1.5vw, 2.25rem); border-radius: var(--r-xl); background: var(--beige-soft); transition: translate 700ms var(--ease-spring); }
.step__n { position: absolute; top: 1.1rem; right: 1.25rem; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--espresso); color: var(--marfil); font-weight: 500; font-size: var(--text-sm); }
.step__ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--marfil); color: var(--carmelita); margin-bottom: var(--space-sm); }
.step__ic svg { width: 24px; height: 24px; }
.step__t { font-family: var(--font-display); font-weight: 500; font-size: var(--text-xl); line-height: 1.15; }
.step p { color: var(--espresso-70); font-size: var(--text-sm); }
@media (hover: hover) and (pointer: fine) { .step:hover { translate: 0 -6px; } }
@media (min-width: 56rem) { .steps__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pols { padding-bottom: var(--space-3xl); }
.pols__in { display: grid; gap: var(--space-xl); padding: clamp(1.5rem, 1rem + 3vw, 4rem); border-radius: var(--r-2xl); background: var(--rosa); }
.pols__list { list-style: none; display: grid; gap: var(--space-lg); }
.pol { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: var(--space-md); align-items: start; }
.pol__ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--marfil); color: var(--carmelita); }
.pol__ic svg { width: 22px; height: 22px; }
.pol__t { font-family: var(--font-display); font-weight: 500; font-size: var(--text-xl); line-height: 1.15; margin-bottom: 0.25rem; }
.pol p { font-size: var(--text-sm); }
@media (min-width: 48rem) { .pols__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .pols__in { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); align-items: start; } }

/* Inicio: accesos a la página de reservas */
.book-cta { display: grid; gap: var(--space-sm); }
.book-cta__card {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-md); align-items: center;
  padding: clamp(1rem, 0.8rem + 1vw, 1.5rem); border-radius: var(--r-xl); background: var(--marfil); color: var(--espresso); text-decoration: none;
  transition: translate 700ms var(--ease-spring), background-color 400ms var(--ease-out);
}
.book-cta__ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--rosa); }
.book-cta__ic .ic { width: 24px; height: 24px; }
.book-cta__txt { display: grid; gap: 0.15rem; min-width: 0; }
.book-cta__t { font-family: var(--font-display); font-size: var(--text-xl); line-height: 1.1; }
.book-cta__d { font-size: var(--text-sm); color: var(--espresso-70); }
.book-cta__go { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--espresso); color: var(--marfil); transition: rotate 700ms var(--ease-spring), background-color 400ms var(--ease-out); }
.book-cta__go svg { width: 18px; height: 18px; }
.book-cta__card:hover { translate: 0 -4px; background: var(--rosa-soft); }
.book-cta__card:hover .book-cta__go { rotate: 45deg; background: var(--carmelita); }
.island .book-cta__card:focus-visible { outline-color: var(--rosa); }
@media (min-width: 48rem) { .book-cta { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Pie con mapa del sitio */
.foot { padding-block: var(--space-2xl) var(--space-xl); }
.foot__inner { justify-items: stretch; text-align: left; gap: var(--space-2xl); }
.foot__top { display: grid; justify-items: center; text-align: center; gap: var(--space-sm); }
.sign--foot { margin-bottom: 0; }
.foot__grid { display: grid; gap: var(--space-xl); padding-top: var(--space-2xl); border-top: 1px solid var(--ink-10); }
.foot__brand { display: grid; gap: var(--space-md); justify-items: start; align-content: start; }
.foot__about { font-size: var(--text-sm); color: var(--espresso-70); max-width: 34ch; }
.foot__links { justify-content: flex-start; margin-top: 0; }
.foot__k { font-weight: 500; font-size: var(--text-xs); letter-spacing: 0.16em; text-transform: uppercase; color: #835639; /* carmelita un punto más oscura: contraste AA en texto de 12 px sobre beige */ margin-bottom: 0.9rem; }
.foot__col ul { list-style: none; display: grid; gap: 0.5rem; font-size: var(--text-sm); }
.foot__col a { color: var(--espresso); text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
.foot__col a:hover { color: var(--carmelita); }
.foot__ct { display: inline-flex; align-items: center; gap: 0.5rem; }
.foot__ct .ic { width: 1rem; height: 1rem; flex: none; color: var(--carmelita); }
.channel__v a { color: inherit; text-decoration: none; background-image: linear-gradient(currentColor, currentColor); background-size: 0 1px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.channel__v a:hover, .channel__v a:focus-visible { background-size: 100% 1px; }
.foot__legal { margin-top: 0; text-align: center; }
@media (min-width: 40rem) { .foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .foot__grid { grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); } }

/* Pantallas muy estrechas: botones y pestañas en una sola línea también en inglés */
@media (max-width: 24.99rem) {
  .channel--main .btn { gap: 0.5rem; padding-left: 1.1rem; font-size: 0.8125rem; letter-spacing: 0.01em; }
  .channel--main .btn .btn__ic { width: 36px; height: 36px; }
  .booking .tabs__tab { padding: 0 0.75rem; font-size: 0.8125rem; gap: 0.4rem; }
}
@media (max-width: 21.5rem) { .booking .tabs__tab .ic { display: none; } }

/* Pie en móviles: bloque de marca centrado, redes en iconos, páginas y servicios en dos columnas y contacto en tarjeta */
@media (max-width: 39.99rem) {
  .foot { padding-block: var(--space-xl) var(--space-lg); }
  .foot__inner { gap: var(--space-xl); }
  .foot__motto { font-size: clamp(1.875rem, 1.5rem + 2vw, 2.25rem); }
  .sign--foot { font-size: 2.25rem; }
  .foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xl) var(--space-md); padding-top: var(--space-xl); }
  .foot__brand { grid-column: 1 / -1; justify-items: center; text-align: center; gap: var(--space-sm); }
  .foot__logo { width: 150px; }
  .foot__about { max-width: 30ch; }
  .foot__links { justify-content: center; gap: var(--space-sm); margin-top: var(--space-xs); }
  .foot__links .chip { width: 48px; height: 48px; padding: 0; justify-content: center; border-radius: 50%; }
  .foot__links .chip .ic { width: 20px; height: 20px; }
  .chip__t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .foot__col ul { gap: 0.15rem; }
  .foot__col a { display: block; padding-block: 0.4rem; }
  .foot__col .foot__ct { display: inline-flex; }
  .foot__k { margin-bottom: 0.4rem; }
  .foot__col--contact { grid-column: 1 / -1; display: grid; justify-items: center; text-align: center; padding: var(--space-lg); border-radius: var(--r-xl); background: var(--beige-soft); }
  .foot__col--contact ul { gap: 0.35rem; }
  .foot__legal { font-size: 0.6875rem; }
}

/* Pie en tabletas: marca en una fila y tres columnas debajo */
@media (min-width: 40rem) and (max-width: 63.99rem) {
  .foot__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xl) var(--space-lg); }
  .foot__brand { grid-column: 1 / -1; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: var(--space-xl); }
  .foot__logo { width: 160px; }
  .foot__links .chip { width: 48px; height: 48px; padding: 0; justify-content: center; border-radius: 50%; }
  .foot__links .chip .ic { width: 20px; height: 20px; }
  .chip__t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .foot__links { flex-wrap: nowrap; }
}

/* Páginas legales */
.legal { display: grid; gap: var(--space-xl); max-width: 860px; padding-bottom: var(--space-3xl); }
.legal__sec { display: grid; gap: var(--space-sm); padding-top: var(--space-xl); border-top: 1px solid var(--ink-10); }
.legal__h { font-family: var(--font-display); font-weight: 500; font-size: var(--text-xl); line-height: 1.2; }
.legal__sec p { color: var(--espresso-70); max-width: 68ch; text-wrap: pretty; }
.legal__a { color: var(--espresso); font-weight: 500; white-space: nowrap; text-decoration: underline; text-decoration-color: var(--carmelita); text-underline-offset: 0.2em; transition: color var(--dur-fast) var(--ease-out); }
.legal__a:hover { color: var(--carmelita); }
.legal__more { padding-top: var(--space-lg); }

/* Enlaces legales en el formulario y en el pie */
.consent-legal { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin-top: -0.5rem; font-size: var(--text-sm); }
.consent-legal a { color: var(--carmelita); text-underline-offset: 3px; }
.foot__legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.35rem 1.25rem; }
.foot__legal-links { display: inline-flex; gap: 1rem; }
.foot__legal-links a { color: var(--espresso-70); text-underline-offset: 3px; }
.foot__legal-links a:hover { color: var(--carmelita); }

/* Indicación sobre el calendario y el formulario de solicitud */
.demo__tag { border-radius: var(--r-md); padding: 0.6rem 1rem; line-height: 1.45; font-size: var(--text-sm); letter-spacing: 0; max-width: 62ch; }
