/*
  ARCHIVO ÚNICO — Virginia Cazarré · Bioexistencia Consciente
  -------------------------------------------------------------
  Incluye HTML, CSS, JavaScript y los SVG de demostración.

  Este archivo funciona solo para la demostración visual:
  - Agenda, horarios y experiencias usan modo DEMO/localStorage.
  - WhatsApp y Google Forms continúan siendo servicios externos.
  - Google Calendar real, moderación real de comentarios y credenciales
    requieren un backend seguro separado. No es posible ejecutar server.js
    ni guardar claves privadas dentro de un HTML abierto en el navegador.
*/
:root {
  --ivory: #f9f6f0;
  --paper: #ffffff;
  --blush: #d4a396;
  --taupe: #c2a675;
  --clay: #b08a7a;
  --terracotta: #d4a396;
  --cacao: #2c2c2c;
  --ink: #343434;
  --muted: #666;
  --line: rgba(166,107,88,.18);
  --header-line: rgba(27,42,74,.10);
  --shadow: 0 20px 45px rgba(27,42,74,.10);
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: Inter, Arial, sans-serif;
  --header-height: 78px;
  --focus: rgba(122,154,134,.35);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 18px); }
body { margin: 0; overflow-x: hidden; color: var(--ink); background: var(--ivory); font-family: var(--sans); font-size: 16px; line-height: 1.6; }
body.menu-open, body.modal-open { overflow: hidden; }
[hidden] { display: none !important; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }

.skip-link { position: fixed; top: -52px; left: 1rem; z-index: 300; padding: .7rem 1rem; color: var(--paper); background: var(--cacao); border-radius: 0 0 .6rem .6rem; transition: top .2s ease; }
.skip-link:focus { top: 0; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.narrow { width: min(850px, calc(100% - 40px)); }
.section { position: relative; padding: 102px 0; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--cacao); font-family: var(--serif); font-weight: 500; line-height: 1.08; }
h1 { max-width: 730px; margin-bottom: 22px; font-size: clamp(3.1rem, 5vw, 5rem); letter-spacing: -.025em; }
h2 { margin-bottom: 20px; font-size: clamp(2.45rem, 4vw, 3.85rem); letter-spacing: -.02em; }
h3 { font-size: 1.65rem; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: var(--clay); font-size: .68rem; font-weight: 700; line-height: 1.2; letter-spacing: .25em; text-transform: uppercase; }
.eyebrow span { display: inline-block; width: 29px; height: 1px; background: var(--clay); opacity: .7; }
.lead { max-width: 650px; color: var(--ink); font-size: 1.1rem; }
.body-copy, .rich-copy { color: var(--ink); }
.body-copy { max-width: 670px; }
.rich-copy { max-width: 760px; }
.rich-copy p { margin-bottom: 1.05rem; }
.credential { color: var(--terracotta); font-size: .82rem; font-weight: 600; letter-spacing: .03em; }
.small-note { color: var(--muted); font-size: .88rem; }
.centered { margin-inline: auto; text-align: center; }
.section-heading { max-width: 770px; margin-bottom: 56px; }
.section-heading .eyebrow { justify-content: center; }
.section-heading > p:last-child { color: var(--muted); }

/* Header */
.site-header { position: fixed; inset: 0 0 auto; z-index: 80; padding: 11px 0; border-bottom: 1px solid transparent; background: rgba(249,246,240,.92); backdrop-filter: blur(14px); transition: padding .25s ease, border-color .25s ease, box-shadow .25s ease, background .25s ease; }
.site-header.is-scrolled { padding: 7px 0; border-color: var(--header-line); background: rgba(249,246,240,.97); box-shadow: 0 8px 30px rgba(27,42,74,.08); }
.header-inner { display: flex; align-items: center; min-height: 56px; gap: 24px; }
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 8px; color: var(--cacao); line-height: 1; text-decoration: none; white-space: nowrap; }
.brand-copy { display: grid; gap: 4px; }
.brand strong { display: block; font-size: .64rem; font-weight: 600; letter-spacing: .21em; }
.brand small { display: block; font-size: .46rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; }
.brand-mark { position: relative; display: grid; width: 54px; height: 54px; place-items: center; color: var(--clay); font-family: var(--serif); font-size: 4.2rem; font-weight: 600; letter-spacing: -.13em; line-height: .76; transform: translateY(1px) translateX(-1px); }
.brand-mark::before { position: absolute; inset: 5px 6px 4px 7px; z-index: -1; border: 1.25px solid currentColor; border-radius: 52% 48% 50% 47%; content: ""; opacity: .92; }
.header-nav-slot { display: flex; flex: 1 1 auto; justify-content: flex-end; min-width: 0; }
.primary-nav { display: flex; align-items: center; justify-content: center; gap: clamp(15px, 1.9vw, 29px); }
.primary-nav a { position: relative; padding: 9px 0; color: rgba(95, 81, 74, .86); font-size: .77rem; text-decoration: none; transition: color .2s ease; }
.primary-nav a::after { position: absolute; right: 0; bottom: 2px; left: 0; height: 1px; background: var(--terracotta); content: ""; transform: scaleX(0); transform-origin: center; transition: transform .2s ease; }
.primary-nav a:hover, .primary-nav a.active { color: var(--clay); }
.primary-nav a:hover::after, .primary-nav a.active::after { transform: scaleX(1); }
.header-cta-slot { display: flex; flex: 0 0 auto; }

/* Buttons / focus */
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 24px; border: 1px solid transparent; border-radius: 999px; font-size: .84rem; font-weight: 700; letter-spacing: -.01em; text-align: center; text-decoration: none; transition: transform .2s ease, background .2s ease, color .2s ease, box-shadow .2s ease, border-color .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: #fff; background: var(--terracotta); box-shadow: 0 12px 27px -16px var(--cacao); }
.btn-primary:hover { background: var(--cacao); }
.btn-dark { color: #fff; background: var(--cacao); box-shadow: 0 12px 27px -16px var(--cacao); }
.btn-dark:hover { background: var(--terracotta); }
.btn-outline { color: var(--terracotta); border-color: rgba(152, 74, 32, .54); background: transparent; }
.btn-outline:hover { color: #fff; background: var(--terracotta); }
.btn-small { min-height: 40px; padding: 9px 19px; font-size: .73rem; }
.btn-compact { min-height: 39px; padding: 8px 15px; font-size: .73rem; }
.btn:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, button:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.menu-toggle { display: none; }

/* mobile navigation */
.mobile-menu-overlay { position: fixed; inset: 0; z-index: 160; display: grid; justify-items: end; background: rgba(57, 35, 23, .32); opacity: 0; pointer-events: none; transition: opacity .28s ease; }
.mobile-menu-overlay.is-open { opacity: 1; pointer-events: auto; }
.mobile-menu { display: flex; width: min(100%, 455px); min-height: 100dvh; flex-direction: column; padding: 21px 27px 28px; background: var(--ivory); box-shadow: -22px 0 45px rgba(69, 38, 22, .18); transform: translateX(100%); transition: transform .32s cubic-bezier(.22, .72, .2, 1); }
.mobile-menu-overlay.is-open .mobile-menu { transform: translateX(0); }
.mobile-menu-top { display: flex; align-items: center; justify-content: space-between; padding-bottom: 22px; border-bottom: 1px solid var(--line); color: var(--clay); font-size: .68rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.menu-close { display: grid; width: 44px; height: 44px; margin: -7px -7px -7px 0; place-items: center; border: 0; border-radius: 50%; color: var(--cacao); background: rgba(238, 221, 209, .72); font-size: 2.1rem; font-weight: 300; line-height: 1; }
.mobile-menu-content { display: flex; flex: 1; flex-direction: column; padding-top: 20px; }
.mobile-menu-content .primary-nav { display: grid; align-items: stretch; gap: 0; }
.mobile-menu-content .primary-nav a { padding: 16px 0; border-bottom: 1px solid var(--line); color: var(--cacao); font-family: var(--serif); font-size: clamp(1.9rem, 8vw, 2.35rem); line-height: 1.05; }
.mobile-menu-content .primary-nav a::after { display: none; }
.mobile-menu-content .header-cta { width: 100%; min-height: 53px; margin-top: 28px; font-size: .92rem; }
.mobile-menu-note { margin: 28px 0 0; color: var(--muted); font-size: .74rem; text-align: center; }

/* Hero */
.hero { position: relative; min-height: 750px; isolation: isolate; overflow: hidden; padding: 151px 0 88px; }
.hero-glow { position: absolute; z-index: -1; border-radius: 50%; filter: blur(48px); opacity: .58; pointer-events: none; }
.hero-glow-right { top: -90px; right: -120px; width: 540px; height: 360px; background: rgba(238, 221, 209, .85); }
.hero-glow-left { bottom: -170px; left: -160px; width: 450px; height: 290px; background: rgba(201, 170, 149, .32); }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 72px; }
.hero-copy { padding-top: 11px; }
.button-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 29px; }
.trust-list { display: flex; flex-wrap: wrap; gap: 10px 24px; padding: 0; margin: 30px 0 0; color: var(--muted); font-size: .75rem; list-style: none; }
.trust-list li { display: inline-flex; align-items: center; gap: 7px; }
.trust-list span { display: grid; width: 15px; height: 15px; place-items: center; border: 1px solid var(--clay); border-radius: 50%; color: var(--clay); font-size: .6rem; font-weight: 700; }
.hero-photo-wrap { position: relative; width: min(100%, 550px); margin-inline: auto; }
.photo-halo { position: absolute; z-index: -1; inset: -32px; border-radius: 42% 58% 58% 42% / 48% 44% 56% 52%; background: linear-gradient(145deg, rgba(238, 221, 209, .95), rgba(201, 170, 149, .28)); filter: blur(20px); }
.organic-photo { overflow: hidden; margin: 0; border: 1px solid rgba(201, 170, 149, .65); box-shadow: 0 29px 57px -33px var(--cacao); }
.hero-photo { border-radius: 40% 60% 58% 42% / 45% 45% 55% 55%; }
.hero-photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center; background: var(--blush); }

/* General cards / symptoms */
.cards-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.info-card { min-height: 244px; padding: 31px; border: 1px solid var(--line); border-radius: 25px; background: rgba(255, 253, 248, .72); box-shadow: var(--shadow); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.info-card:hover { border-color: rgba(182, 107, 69, .55); box-shadow: 0 25px 54px -32px rgba(96, 53, 31, .57); transform: translateY(-6px); }
.icon-badge { display: grid; width: 56px; height: 56px; place-items: center; border-radius: 18px; background: rgba(212, 163, 150, 0.82); color: var(--clay); }
.icon-badge svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.info-card h3 { margin: 19px 0 9px; font-size: 1.55rem; }
.info-card p { margin: 0; color: var(--muted); font-size: .93rem; }
.closing-phrase { max-width: 750px; margin: 45px auto 0; color: var(--cacao); font-family: var(--serif); font-size: 1.5rem; font-style: italic; line-height: 1.35; text-align: center; }
.tinted-section { background: rgba(238, 221, 209, .35); }
.quote-card { padding: 25px 29px; margin: 39px 0 34px; border-left: 2px solid var(--terracotta); border-radius: 0 20px 20px 0; color: var(--cacao); background: rgba(255, 253, 248, .86); box-shadow: var(--shadow); }
.quote-card p { margin: 0; }
/* ===== ACORDEÓN HORIZONTAL ===== */
.accordion-horizontal {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
  justify-content: center;
}

.accordion-item {
  flex: 1 1 200px; /* Cada botón ocupa al menos 200px */
  min-width: 160px;
  max-width: 250px;
}

.accordion-btn {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 30px;
  background: var(--ivory);
  color: var(--cacao);
  font-family: var(--serif);
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  text-align: center;
  box-shadow: var(--shadow);
}

.accordion-btn:hover {
  background: var(--terracotta);
  color: #fff;
  border-color: var(--terracotta);
  transform: translateY(-2px);
}

.accordion-btn.active {
  background: var(--terracotta);
  color: #fff;
  border-color: var(--terracotta);
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.4s ease, padding 0.3s ease;
  opacity: 0;
  padding: 0 8px;
  background: var(--paper);
  border-radius: 12px;
  margin-top: 8px;
  border: 1px solid transparent;
}

.accordion-content.open {
  max-height: 400px; /* Ajusta según el contenido */
  opacity: 1;
  padding: 16px 20px;
  border-color: var(--line);
  box-shadow: var(--shadow);
}

.accordion-content p {
  margin: 0;
  color: var(--ink);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* Responsive */
@media (max-width: 620px) {
  .accordion-item {
    flex: 1 1 100%;
    max-width: 100%;
  }
  .accordion-content.open {
    max-height: 600px;
  }
}

/* New service cards from the supplied visual target */
.service-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.service-fact-card { min-height: 236px; display: grid; place-items: center; align-content: start; gap: 13px; padding: 27px 22px 22px; border: 1px solid rgba(182, 107, 69, .24); border-radius: 31px; color: var(--terracotta); background: rgba(255, 253, 248, .84); box-shadow: 0 18px 33px -31px rgba(96, 53, 31, .48); text-align: center; transition: transform .2s ease, box-shadow .2s ease; }
.service-fact-card:hover { transform: translateY(-5px); box-shadow: 0 26px 39px -31px rgba(96, 53, 31, .55); }
.fact-icon { display: grid; width: 33px; height: 33px; place-items: center; color: var(--clay); }
.fact-icon svg { width: 29px; height: 29px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.service-fact-card strong { display: block; color: var(--terracotta); font-family: var(--serif); font-size: 1.58rem; font-weight: 500; line-height: 1.06; }
.service-fact-card span { max-width: 170px; color: var(--ink); font-size: .92rem; line-height: 1.3; }

/* Timeline / about */
.timeline { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; padding: 0; margin: 0; list-style: none; }
.timeline li { position: relative; min-height: 255px; padding: 0 20px 0 0; }
.timeline li::before { position: absolute; top: 44px; right: 0; left: 0; height: 1px; background: var(--line); content: ""; }
.timeline li span { position: relative; z-index: 1; display: grid; width: 89px; height: 89px; place-items: center; border: 1px solid var(--taupe); border-radius: 50%; color: var(--terracotta); background: var(--ivory); font-family: var(--serif); font-size: 1.58rem; }
.timeline li strong { display: block; padding-right: 4px; margin: 23px 0 9px; color: var(--cacao); font-family: var(--serif); font-size: 1.42rem; font-weight: 500; line-height: 1.2; }
.timeline li p { padding-right: 5px; color: var(--muted); font-size: .82rem; line-height: 1.5; }
.split-grid { display: grid; grid-template-columns: 1.12fr .88fr; align-items: center; gap: 76px; }
.about-section { background: linear-gradient(90deg, var(--ivory), rgba(238, 221, 209, .28)); }
.about-decoration { display: grid; min-height: 390px; align-content: center; justify-items: center; padding: 55px; border-radius: 45% 55% 46% 54% / 45% 43% 57% 55%; color: var(--paper); background: linear-gradient(145deg, var(--clay), var(--cacao)); box-shadow: 0 30px 55px -35px var(--cacao); text-align: center; }
.about-decoration p { max-width: 270px; margin: 0 0 18px; font-family: var(--serif); font-size: 2.15rem; line-height: 1.12; }
.about-decoration span { font-size: .62rem; letter-spacing: .25em; opacity: .78; text-transform: uppercase; }

/* Certification block inspired by the supplied card */
.certification-proof { max-width: 680px; margin-top: 35px; padding: 30px 40px; border: 1.5px solid var(--terracotta); border-right-color: transparent; border-radius: 33px 38px 38px 33px; background: rgba(255, 253, 248, .94); box-shadow: 0 20px 32px -30px rgba(96, 53, 31, .35); }
.certification-proof p { margin: 0; color: var(--terracotta); font-size: 1.22rem; line-height: 1.48; }
.certification-button { margin-top: 46px; min-width: min(100%, 410px); }
.text-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 15px; color: var(--terracotta); font-size: .85rem; font-weight: 700; text-decoration: none; }
.text-link span { transition: transform .2s ease; }
.text-link:hover span { transform: translateX(5px); }

/* results / CTA */
.results-section { background: rgba(238, 221, 209, .24); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 21px; }
.result-card { padding: 35px 28px 30px; border: 1px solid var(--line); border-radius: 23px; background: var(--paper); box-shadow: var(--shadow); }
.result-card span { display: block; color: var(--clay); font-family: var(--serif); font-size: 2.45rem; line-height: 1; }
.result-card h3 { margin: 13px 0 8px; }
.result-card p { margin: 0; color: var(--muted); font-size: .9rem; }
.first-step { padding: 98px 0; }
.centered-block { max-width: 700px; text-align: center; }
.centered-block .eyebrow { justify-content: center; }
.centered-block > p { color: var(--muted); }
.centered-buttons { justify-content: center; }
.session-line { color: var(--terracotta) !important; font-size: .86rem; font-weight: 600; }

/* Orientation / scheduler */
.orientation-section { color: rgba(255, 255, 255, .84); background: var(--cacao); }
.orientation-section h2, .orientation-section .eyebrow { color: var(--paper); }
.orientation-section .eyebrow span { background: var(--blush); }
.orientation-section .body-copy, .orientation-section .small-note { color: rgba(255, 255, 255, .75); }
.orientation-section .btn-primary { color: var(--terracotta); background: var(--paper); }
.orientation-section .btn-primary:hover { color: var(--paper); background: var(--terracotta); }
.check-list { padding: 0; margin: 27px 0 17px; list-style: none; }
.check-list li { display: flex; gap: 10px; margin: 10px 0; }
.check-list li::before { color: var(--blush); content: "✓"; font-weight: 700; }
.callout-graphic { position: relative; display: grid; min-height: 360px; place-content: center; justify-items: center; border-radius: 50%; text-align: center; }
.callout-ring { position: absolute; inset: 18px; border: 1px solid rgba(238, 221, 209, .43); border-radius: 50%; }
.callout-graphic::before { position: absolute; inset: 62px; border: 1px solid rgba(238, 221, 209, .28); border-radius: 50%; content: ""; }
.callout-graphic span { color: var(--paper); font-family: var(--serif); font-size: 7rem; line-height: .9; }
.callout-graphic small { max-width: 155px; margin-top: 10px; color: var(--blush); font-size: .61rem; letter-spacing: .18em; text-transform: uppercase; }

/* resources / testimonials */
.resources-section { background: rgba(255, 253, 248, .56); }
.books-layout { grid-template-columns: .9fr 1.1fr; }
.books-image { overflow: hidden; margin: 0; border-radius: 33px; box-shadow: var(--shadow); }
.books-image img { width: 100%; height: 100%; min-height: 365px; object-fit: cover; background: var(--blush); }
.subheading { margin: -7px 0 16px; color: var(--clay); font-size: 1.5rem; }
.testimonials-section { background: rgba(238, 221, 209, .35); }
.testimonial-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: -23px 0 26px; }
.testimonial-toolbar > p { margin: 0; color: var(--muted); font-size: .79rem; }
.testimonial-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.testimonial-actions > span { min-width: 38px; color: var(--muted); font-size: .77rem; text-align: center; }
.icon-nav { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--terracotta); background: var(--paper); font-size: 1.05rem; transition: transform .2s ease, background .2s ease, color .2s ease; }
.icon-nav:hover:not(:disabled) { color: #fff; background: var(--terracotta); transform: translateY(-2px); }
.icon-nav:disabled { opacity: .42; cursor: not-allowed; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 21px; }
.testimonial { position: relative; display: flex; min-height: 214px; flex-direction: column; padding: 31px 27px 24px; margin: 0; border-radius: 23px; background: rgba(255, 253, 248, .9); box-shadow: var(--shadow); }
.testimonial-quote { display: block; height: 34px; color: var(--blush); font-family: var(--serif); font-size: 4.9rem; line-height: .7; }
.testimonial-text { margin: 14px 0 auto; color: var(--ink); font-family: var(--serif); font-size: 1.17rem; line-height: 1.36; }
.testimonial-author { margin: 20px 0 0; padding-top: 13px; border-top: 1px solid var(--line); color: var(--blush); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.testimonial-empty { grid-column: 1 / -1; padding: 30px; border: 1px dashed var(--line); border-radius: 21px; color: var(--muted); text-align: center; }

/* embedded Google Form */
.booking-section { background: var(--paper); }
.booking-layout { display: grid; grid-template-columns: .85fr 1.15fr; align-items: start; gap: 65px; }
.booking-copy { position: sticky; top: 105px; }
.booking-panel { padding: 20px; border: 1px solid var(--line); border-radius: 25px; background: var(--ivory); box-shadow: var(--shadow); }
.google-form-topline { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 3px 7px 14px; color: var(--cacao); font-family: var(--serif); font-size: 1.5rem; }
.google-form-topline small { color: var(--terracotta); font-family: var(--sans); font-size: .63rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.google-form-frame-wrap { position: relative; min-height: 760px; overflow: hidden; border-radius: 16px; background: #fff; }
.google-form-frame-wrap iframe { display: block; width: 100%; min-height: 780px; border: 0; background: #fff; }
.iframe-fallback { position: absolute; inset: 0; display: grid; place-content: center; gap: 15px; padding: 30px; color: var(--muted); background: #fffdf8; text-align: center; }
.iframe-fallback strong { color: var(--cacao); font-family: var(--serif); font-size: 1.8rem; }

/* final CTA background placeholder / image */
.final-cta { position: relative; isolation: isolate; overflow: hidden; padding: 115px 0; background-image: url('./assets/fondo-ult.png'); background-position: center; background-size: cover; }
.final-cta-overlay { position: absolute; z-index: -1; inset: 0; background: linear-gradient(145deg, rgba(249, 246, 240, .91), rgba(238, 221, 209, .82)); }
.final-cta h2 { font-size: clamp(2.55rem, 4.5vw, 4.25rem); }

/* footer */
.site-footer { padding: 61px 0 25px; border-top: 1px solid var(--line); background: rgba(238, 221, 209, .35); }
.footer-brand { margin-bottom: 46px; }
.footer-grid { display: grid; grid-template-columns: 1fr .8fr; gap: 80px; }
.footer-grid > p { max-width: 430px; color: var(--muted); font-size: .85rem; }
.footer-grid h3 { margin-bottom: 12px; }
.contact-list { display: grid; gap: 9px; padding: 0; margin: 0; list-style: none; }
.contact-list a { color: var(--ink); font-size: .84rem; text-decoration: none; }
.contact-list a:hover { color: var(--terracotta); }
.legal-row { display: grid; grid-template-columns: 1.35fr .65fr; gap: 24px; padding-top: 20px; margin-top: 60px; border-top: 1px solid var(--line); color: var(--muted); font-size: .68rem; line-height: 1.55; }
.legal-row p:last-child { text-align: right; }
.separator { margin: 0 5px; }
.floating-whatsapp { position: fixed; right: 22px; bottom: 22px; z-index: 70; display: inline-flex; align-items: center; gap: 8px; padding: 10px 15px; border-radius: 999px; color: #fff; background: #22b960; box-shadow: 0 13px 30px -14px rgba(0, 0, 0, .6); font-size: .78rem; font-weight: 700; text-decoration: none; transition: transform .2s ease; }
.floating-whatsapp:hover { transform: translateY(-3px); }
.floating-whatsapp svg { width: 22px; height: 22px; flex: 0 0 auto; }
.toast { position: fixed; bottom: 24px; left: 50%; z-index: 220; max-width: min(460px, calc(100% - 36px)); padding: 12px 16px; border-radius: 12px; color: #fff; background: var(--cacao); box-shadow: 0 17px 32px -17px var(--cacao); font-size: .82rem; text-align: center; opacity: 0; pointer-events: none; transform: translate(-50%, 25px); transition: opacity .25s ease, transform .25s ease; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

/* modal agenda / testimonial */
.modal-backdrop { position: fixed; z-index: 190; inset: 0; display: grid; overflow-y: auto; place-items: center; padding: 22px; background: rgba(57, 35, 23, .55); opacity: 0; transition: opacity .22s ease; }
.modal-backdrop.is-open { opacity: 1; }
.scheduler-modal, .mini-modal { position: relative; width: min(950px, 100%); max-height: min(900px, calc(100dvh - 32px)); overflow: auto; padding: clamp(23px, 4vw, 42px); border: 1px solid rgba(255,255,255,.4); border-radius: 29px; background: var(--paper); box-shadow: 0 25px 60px rgba(51, 29, 18, .28); transform: translateY(16px) scale(.985); transition: transform .22s ease; }
.modal-backdrop.is-open .scheduler-modal, .modal-backdrop.is-open .mini-modal { transform: translateY(0) scale(1); }
.mini-modal { width: min(560px, 100%); }
.modal-close { position: absolute; top: 14px; right: 15px; display: grid; width: 42px; height: 42px; place-items: center; border: 0; border-radius: 50%; color: var(--cacao); background: rgba(238, 221, 209, .8); font-size: 2rem; font-weight: 300; line-height: 1; }
.scheduler-heading { max-width: 720px; padding-right: 40px; }
.scheduler-heading h2, .mini-modal h2 { margin-top: 11px; font-size: clamp(2rem, 4vw, 3rem); }
.scheduler-heading p:last-child, .mini-modal > p:not(.eyebrow) { color: var(--muted); }
.scheduler-body { display: grid; grid-template-columns: .85fr 1.15fr; gap: 29px; padding: 26px 0 24px; margin-top: 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.scheduler-label { margin-bottom: 12px; color: var(--terracotta); font-size: .73rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.day-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.day-option, .time-option { border: 1px solid var(--line); border-radius: 13px; color: var(--ink); background: #fffdf8; transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease; }
.day-option { min-height: 73px; padding: 11px; text-align: left; }
.day-option:hover, .time-option:hover { border-color: var(--terracotta); transform: translateY(-2px); }
.day-option strong { display: block; color: var(--cacao); font-size: .92rem; }
.day-option small { display: block; color: var(--muted); font-size: .75rem; }
.day-option.is-selected, .time-option.is-selected { border-color: var(--terracotta); color: #fff; background: var(--terracotta); box-shadow: 0 9px 18px -13px var(--cacao); }
.day-option.is-selected strong, .day-option.is-selected small { color: #fff; }
.time-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.time-option { min-height: 45px; padding: 8px; font-size: .82rem; font-weight: 700; }
.time-picker-empty { margin: 0; color: var(--muted); font-size: .86rem; }
.scheduler-form { display: grid; gap: 14px; padding-top: 24px; }
.scheduler-fields { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.scheduler-form label, .testimonial-form label { display: grid; gap: 6px; color: var(--cacao); font-size: .76rem; font-weight: 700; }
.scheduler-form input, .scheduler-form textarea, .testimonial-form input, .testimonial-form textarea { width: 100%; padding: 12px 13px; border: 1px solid rgba(142, 101, 75, .3); border-radius: 12px; outline: none; color: var(--ink); background: #fffdfa; font-size: .89rem; font-weight: 400; resize: vertical; transition: border-color .2s ease, box-shadow .2s ease; }
.scheduler-form input:focus, .scheduler-form textarea:focus, .testimonial-form input:focus, .testimonial-form textarea:focus { border-color: var(--terracotta); box-shadow: 0 0 0 4px rgba(182, 107, 69, .12); }
.scheduler-message { max-width: 100%; }
.consent { display: flex !important; align-items: flex-start; gap: 9px; color: var(--muted) !important; font-size: .73rem !important; font-weight: 400 !important; }
.consent input { width: auto !important; margin-top: 3px; accent-color: var(--terracotta); }
.scheduler-submit-row { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; }
.scheduler-submit-row .btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.form-feedback { min-height: 20px; margin: 0; color: var(--terracotta); font-size: .79rem; font-weight: 600; }
.testimonial-form { display: grid; gap: 15px; margin-top: 20px; }

/* motion */
.reveal { opacity: 0; transform: translateY(23px); transition: opacity .65s ease, transform .65s ease; transition-delay: var(--delay, 0ms); }
.reveal.visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1090px) {
  .primary-nav { gap: 14px; }
  .primary-nav a { font-size: .7rem; }
  .header-cta { padding-inline: 16px; }
  .hero-grid, .split-grid { gap: 48px; }
  .timeline li { padding-right: 15px; }
  .timeline li strong { font-size: 1.25rem; }
}

@media (max-width: 850px) {
  :root { --header-height: 70px; }
  .section { padding: 78px 0; }
  .site-header { padding: 7px 0; border-color: var(--header-line); background: rgba(249, 246, 240, .98); }
  .site-header.is-scrolled { padding: 7px 0; }
  .header-inner { min-height: 54px; }
  .header-nav-slot, .header-cta-slot { display: none; }
  .menu-toggle { display: grid; width: 44px; height: 44px; margin-left: auto; place-content: center; gap: 5px; border: 0; border-radius: 50%; color: var(--cacao); background: rgba(238, 221, 209, .62); }
  .menu-toggle span { display: block; width: 19px; height: 1.5px; border-radius: 2px; background: currentColor; }
  .hero { min-height: auto; padding: 121px 0 70px; }
  .hero-grid { grid-template-columns: 1fr; gap: 42px; }
  .hero-photo-wrap { width: min(100%, 350px); }
  .service-facts { grid-template-columns: repeat(2, 1fr); }
  .timeline { grid-template-columns: 1fr; gap: 24px; }
  .timeline li { min-height: 0; padding: 0 0 0 92px; }
  .timeline li::before { top: 0; right: auto; bottom: -24px; left: 44px; width: 1px; height: auto; }
  .timeline li:last-child::before { display: none; }
  .timeline li span { position: absolute; top: 0; left: 0; width: 89px; height: 89px; }
  .timeline li strong { padding-top: 6px; margin-top: 0; }
  .timeline li p { margin-bottom: 0; }
  .booking-layout { grid-template-columns: 1fr; gap: 35px; }
  .booking-copy { position: static; }
  .books-layout { grid-template-columns: 1fr; }
  .books-image { max-height: 360px; }
  .orientation-layout { grid-template-columns: 1fr .6fr; }
  .callout-graphic { min-height: 270px; }
  .callout-ring { inset: 0; }
  .callout-graphic::before { inset: 36px; }
  .scheduler-fields { grid-template-columns: 1fr 1fr; }
  .scheduler-fields label:last-child { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .container, .narrow { width: min(100% - 30px, 1180px); }
  .section { padding: 66px 0; }
  h1 { font-size: clamp(2.7rem, 11vw, 3.8rem); }
  h2 { font-size: clamp(2.25rem, 10vw, 3.2rem); }
  .brand-mark { width: 43px; height: 43px; font-size: 3.45rem; }
  .brand-mark::before { inset: 4px 5px 3px 5px; }
  .brand strong { font-size: .55rem; }
  .brand small { font-size: .4rem; }
  .mobile-menu { width: 100%; padding: 18px 24px 26px; }
  .hero { padding-top: 107px; padding-bottom: 62px; }
  .hero-copy .eyebrow { font-size: .62rem; }
  .lead { font-size: 1.02rem; }
  .button-row { display: grid; }
  .button-row .btn { width: 100%; }
  .trust-list { display: grid; gap: 9px; }
  .hero-photo-wrap { width: min(100%, 290px); }
  .cards-grid, .results-grid { grid-template-columns: 1fr; }
  .service-facts { grid-template-columns: 1fr 1fr; gap: 12px; }
  .service-fact-card { min-height: 215px; padding: 24px 13px 18px; border-radius: 26px; }
  .service-fact-card strong { font-size: 1.42rem; }
  .service-fact-card span { font-size: .82rem; }
  .split-grid, .orientation-layout { grid-template-columns: 1fr; gap: 35px; }
  .about-decoration { min-height: 285px; padding: 38px; }
  .about-decoration p { font-size: 1.8rem; }
  .certification-proof { padding: 24px 24px 24px 31px; border-radius: 28px 30px 30px 28px; }
  .certification-proof p { font-size: 1.04rem; }
  .certification-button { width: 100%; margin-top: 28px; }
  .callout-graphic { width: 100%; max-width: 280px; min-height: 245px; margin-inline: auto; }
  .callout-graphic span { font-size: 5.8rem; }
  .testimonial-toolbar { align-items: flex-start; flex-direction: column; margin-top: -13px; }
  .testimonial-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .testimonials-grid { grid-template-columns: 1fr; }
  .testimonial { min-height: 0; }
  .google-form-frame-wrap { min-height: 680px; }
  .google-form-frame-wrap iframe { min-height: 700px; }
  .booking-panel { padding: 15px; }
  .footer-grid, .legal-row { grid-template-columns: 1fr; gap: 27px; }
  .legal-row { margin-top: 39px; }
  .legal-row p:last-child { text-align: left; }
  .floating-whatsapp { right: 14px; bottom: 14px; width: 49px; height: 49px; padding: 0; justify-content: center; border-radius: 50%; }
  .floating-whatsapp span { display: none; }
  .modal-backdrop { place-items: end center; padding: 0; }
  .scheduler-modal, .mini-modal { width: 100%; max-height: calc(100dvh - 8px); padding: 25px 18px 24px; border-radius: 25px 25px 0 0; }
  .scheduler-body { grid-template-columns: 1fr; gap: 22px; }
  .day-picker { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .day-option { min-height: 66px; padding: 8px; }
  .day-option strong { font-size: .8rem; }
  .day-option small { font-size: .68rem; }
  .time-picker { grid-template-columns: repeat(3, 1fr); }
  .scheduler-fields { grid-template-columns: 1fr; }
  .scheduler-fields label:last-child { grid-column: auto; }
  .scheduler-submit-row .btn { width: 100%; }
}

@media (max-width: 390px) {
  .service-facts { grid-template-columns: 1fr; }
  .day-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* GALERÍA */

.gallery-page-hero {
  min-height: 620px;
  display: grid;
  align-items: center;
  padding-top: 150px;
  background:
    radial-gradient(circle at 82% 18%, rgba(238, 221, 209, .86), transparent 30%),
    radial-gradient(circle at 8% 88%, rgba(201, 170, 149, .28), transparent 28%),
    var(--ivory);
}

.gallery-page-hero h1 {
  margin-inline: auto;
}

.gallery-page-hero .lead {
  margin-inline: auto;
}

.gallery-preview-section {
  background: rgba(238, 221, 209, .28);
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 21px;
}

.gallery-card {
  overflow: hidden;
  min-height: 315px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: var(--paper);
  box-shadow: var(--shadow);
}

.gallery-card img {
  width: 100%;
  height: 100%;
  min-height: 315px;
  object-fit: cover;
  background: var(--blush);
}

@media (max-width: 850px) {
  .gallery-page-hero {
    min-height: auto;
    padding-top: 125px;
  }

  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 620px) {
  .gallery-grid {
    grid-template-columns: 1fr;
  }

  .gallery-card,
  .gallery-card img {
    min-height: 260px;
  }
}
/* POLÍTICA DE PRIVACIDAD */

.privacy-page {
  padding-top: 150px;
  background:
    radial-gradient(circle at 82% 18%, rgba(238, 221, 209, .72), transparent 30%),
    radial-gradient(circle at 8% 88%, rgba(201, 170, 149, .22), transparent 28%),
    var(--ivory);
}

.privacy-content {
  margin-top: 35px;
  padding: clamp(24px, 4vw, 44px);
  border: 1px solid var(--line);
  border-radius: 28px;
  background: rgba(255, 253, 248, .86);
  box-shadow: var(--shadow);
}

.privacy-content h2 {
  margin-top: 34px;
  margin-bottom: 10px;
  font-size: clamp(1.55rem, 3vw, 2.1rem);
}

.privacy-content h2:first-child {
  margin-top: 0;
}

.privacy-content p {
  color: var(--ink);
}
/* ADMIN */

.admin-page {
  min-height: 100dvh;
  background:
    radial-gradient(circle at 82% 18%, rgba(238, 221, 209, .72), transparent 30%),
    radial-gradient(circle at 8% 88%, rgba(201, 170, 149, .22), transparent 28%),
    var(--ivory);
}

.admin-shell {
  width: min(1180px, calc(100% - 30px));
  margin-inline: auto;
  padding: 34px 0;
}

.admin-card,
.admin-box,
.admin-item,
.admin-empty,
.admin-system-box {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(255, 253, 248, .9);
  box-shadow: var(--shadow);
}

.admin-login-card {
  width: min(520px, 100%);
  margin: 8dvh auto 0;
  padding: clamp(24px, 5vw, 42px);
}

.admin-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
  color: var(--terracotta);
}

.admin-brand strong {
  display: block;
  color: var(--cacao);
  font-family: var(--serif);
  font-size: 1.45rem;
  line-height: 1;
}

.admin-brand small {
  display: block;
  margin-top: 6px;
  color: var(--clay);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.admin-form {
  display: grid;
  gap: 14px;
  margin-top: 26px;
}

.admin-form label,
.admin-gallery-form label {
  display: grid;
  gap: 7px;
  color: var(--cacao);
  font-size: .78rem;
  font-weight: 800;
}

.admin-form input,
.admin-gallery-form input,
.admin-upload-form input {
  width: 100%;
  padding: 12px 13px;
  border: 1px solid rgba(142, 101, 75, .3);
  border-radius: 12px;
  color: var(--ink);
  background: #fffdfa;
}

.admin-dashboard {
  display: grid;
  gap: 24px;
}

.admin-topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: rgba(255, 253, 248, .9);
  box-shadow: var(--shadow);
}

.admin-topbar h1 {
  margin-bottom: 8px;
  font-size: clamp(2.4rem, 5vw, 4rem);
}

.admin-topbar p {
  margin-bottom: 0;
}

.admin-topbar-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 9px;
}

.admin-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-tab {
  min-height: 42px;
  padding: 9px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--terracotta);
  background: rgba(255, 253, 248, .88);
  font-size: .82rem;
  font-weight: 800;
}

.admin-tab.is-active {
  color: #fff;
  border-color: var(--terracotta);
  background: var(--terracotta);
}

.admin-panel {
  display: none;
}

.admin-panel.is-active {
  display: grid;
  gap: 18px;
}

.admin-section-heading {
  max-width: 760px;
}

.admin-section-heading h2 {
  margin-bottom: 8px;
  font-size: clamp(2rem, 4vw, 3rem);
}

.admin-section-heading p {
  color: var(--muted);
}

.admin-subsection {
  margin-top: 26px;
}

.admin-list {
  display: grid;
  gap: 15px;
}

.admin-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  padding: 22px;
}

.admin-item h3 {
  margin: 10px 0 8px;
  font-size: 1.7rem;
}

.admin-item p {
  margin-bottom: 7px;
  color: var(--ink);
  font-size: .88rem;
}

.admin-item-actions {
  display: flex;
  min-width: 190px;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}

.admin-badge {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  color: var(--terracotta);
  background: rgba(238, 221, 209, .7);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.admin-badge-approved,
.admin-badge-published {
  color: #fff;
  background: #3f7d56;
}

.admin-badge-rejected,
.admin-badge-hidden {
  color: #fff;
  background: #7d3f3f;
}

.admin-badge-pending {
  color: var(--cacao);
  background: #f1d79e;
}

.admin-empty {
  padding: 24px;
  color: var(--muted);
  text-align: center;
}

.admin-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.admin-box {
  padding: 20px;
}

.admin-box h3 {
  margin-bottom: 7px;
  font-size: 1.55rem;
}

.admin-box p {
  color: var(--muted);
  font-size: .86rem;
}

.admin-upload-form {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.admin-gallery-form {
  display: grid;
  gap: 13px;
  max-width: 680px;
}

.admin-current-images {
  display: grid;
  gap: 18px;
}

.admin-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.admin-image-preview {
  overflow: hidden;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255, 253, 248, .86);
}

.admin-image-preview img,
.admin-image-empty {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 15px;
  object-fit: cover;
  background: var(--blush);
}

.admin-image-empty {
  display: grid;
  place-items: center;
  color: var(--muted);
}

.admin-image-preview strong {
  display: block;
  margin-top: 10px;
  color: var(--cacao);
}

.admin-image-preview small {
  display: block;
  overflow: hidden;
  margin: 4px 0 10px;
  color: var(--muted);
  font-size: .68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-system-box {
  overflow: auto;
  padding: 20px;
  color: var(--cacao);
  font-size: .82rem;
}

@media (max-width: 850px) {
  .admin-topbar,
  .admin-item {
    grid-template-columns: 1fr;
  }

  .admin-topbar {
    display: grid;
  }

  .admin-topbar-actions {
    justify-content: flex-start;
  }

  .admin-grid,
  .admin-preview-grid {
    grid-template-columns: 1fr;
  }

  .admin-item-actions {
    width: 100%;
    min-width: 0;
  }
}

/* ==========================================================================
   GALERÍA Y LIGHTBOX PROFESIONAL (ESTILO CANVA & SEGURIDAD)
   ========================================================================== */

/* Protección de Copia/Descarga de Contenido */
.protected-content img {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none; /* Evita arrastrar o guardar directo */
}

.image-protection-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: transparent;
}

/* Grid de Tarjetas (Canva Style) */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 2rem;
  margin: 2rem 0;
}

.gallery-card {
  background-color: #ffffff;
  border-radius: 16px;
  border: 1px solid rgba(109, 73, 51, 0.1);
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
  cursor: pointer;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
}

.gallery-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 32px rgba(75, 47, 33, 0.12);
}

.gallery-image-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  background-color: #f7f4ee;
  overflow: hidden;
}

.gallery-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.gallery-card:hover .gallery-image-wrapper img {
  transform: scale(1.03);
}

.gallery-card-info {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex-grow: 1;
  background: #ffffff;
}

.card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.card-date {
  font-size: 0.75rem;
  font-family: 'Inter', sans-serif;
  color: #a3542d;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.gallery-card-info h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: #2c2925;
  margin: 0;
  line-height: 1.25;
}

.gallery-card-info p {
  font-family: 'Inter', sans-serif;
  font-size: 0.875rem;
  color: #666056;
  margin: 0;
  line-height: 1.5;
}

.gallery-closing {
  text-align: center;
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(109, 73, 51, 0.1);
}

/* Lightbox Mejorado */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.5rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.lightbox.open {
  opacity: 1;
  visibility: visible;
}

.lightbox-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(20, 18, 15, 0.88);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.lightbox-container {
  position: relative;
  z-index: 10;
  max-width: 900px;
  width: 100%;
  max-height: 90vh;
  background-color: #1a1815;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

.lightbox-image-wrapper {
  position: relative;
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #0f0e0c;
  min-height: 300px;
  max-height: 60vh;
  padding: 1.5rem;
}

.lightbox-image-wrapper img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 4px;
}

/* Botones de Navegación */
.lightbox-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: rgba(255, 255, 255, 0.15);
  border: none;
  color: #fff;
  font-size: 1.75rem;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
}

.lightbox-close:hover {
  background: rgba(255, 255, 255, 0.3);
}

.lightbox-nav {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #ffffff;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 30;
  transition: background 0.2s ease, transform 0.2s ease;
}

.lightbox-nav:hover {
  background: rgba(255, 255, 255, 0.35);
  transform: translateY(-50%) scale(1.05);
}

.lightbox-prev { left: 1.25rem; }
.lightbox-next { right: 1.25rem; }

/* Footer del Lightbox */
.lightbox-footer {
  padding: 1.25rem 1.75rem;
  background-color: #1a1815;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  color: #fcf8f0;
}

.lightbox-header-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.5rem;
}

.lightbox-footer h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.5rem;
  margin: 0;
  color: #fcf8f0;
}

.lightbox-date-badge {
  font-size: 0.75rem;
  font-family: 'Inter', sans-serif;
  color: #d4a373;
  background: rgba(212, 163, 115, 0.15);
  padding: 4px 10px;
  border-radius: 20px;
}

.lightbox-footer p {
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: #c4beb4;
  margin: 0 0 1rem 0;
  line-height: 1.4;
}

.lightbox-meta {
  display: flex;
  justify-content: flex-end;
  font-size: 0.8rem;
  color: #8c857b;
}

@media (max-width: 640px) {
  .lightbox-nav {
    width: 40px;
    height: 40px;
  }
  .lightbox-prev { left: 0.5rem; }
  .lightbox-next { right: 0.5rem; }
}

/* ==========================================================================
   FEED DE GALERÍA ESTILO INSTAGRAM / POST & LIGHTBOX CON ZOOM
   ========================================================================== */

/* Protección de Copia / Arrastre */
.protected-content img {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
}

.image-protection-overlay {
  position: absolute;
  inset: 0;
  z-index: 5;
  background: transparent;
  cursor: pointer;
}

/* Grid Principal de Posts */
.gallery-feed-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 2rem;
  margin: 2rem 0;
}

/* Tarjeta tipo Post */
.post-card {
  background: #ffffff;
  border-radius: 16px;
  border: 1px solid rgba(109, 73, 51, 0.12);
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(0,0,0,0.04);
  cursor: pointer;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
}

.post-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 32px rgba(75, 47, 33, 0.12);
}

/* Header del Post */
.post-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: #ffffff;
  border-bottom: 1px solid rgba(109, 73, 51, 0.06);
}

.post-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--brand, #a3542d);
  color: #ffffff;
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  font-size: 0.95rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.post-avatar.small {
  width: 32px;
  height: 32px;
  font-size: 0.8rem;
}

.post-author-info {
  display: flex;
  flex-direction: column;
}

.post-author-info strong {
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: #2c2925;
}

.post-author-info small {
  font-size: 0.75rem;
  color: #8c857b;
}

/* Imagen del Post */
.post-image-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  background: #f7f4ee;
  overflow: hidden;
}

.post-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.post-card:hover .post-image-wrapper img {
  transform: scale(1.03);
}

.zoom-badge {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: rgba(26, 24, 21, 0.75);
  backdrop-filter: blur(4px);
  color: #ffffff;
  font-size: 0.75rem;
  font-family: 'Inter', sans-serif;
  padding: 5px 10px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 5px;
  z-index: 6;
  opacity: 0.85;
  transition: opacity 0.2s ease;
}

.post-card:hover .zoom-badge {
  opacity: 1;
  background: var(--brand, #a3542d);
}

/* Cuerpo del Post */
.post-body {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.post-body h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.3rem;
  font-weight: 600;
  color: #2c2925;
  margin: 0;
}

.post-body p {
  font-family: 'Inter', sans-serif;
  font-size: 0.875rem;
  color: #666056;
  margin: 0;
  line-height: 1.45;
}

/* Visualizador Lightbox */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.lightbox.open {
  opacity: 1;
  visibility: visible;
}

.lightbox-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(18, 16, 14, 0.92);
  backdrop-filter: blur(10px);
}

.lightbox-container {
  position: relative;
  z-index: 10;
  max-width: 920px;
  width: 100%;
  max-height: 92vh;
  background-color: #1a1815;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
}

/* Stage de Imagen y Zoom */
.lightbox-image-stage {
  position: relative;
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #0d0c0a;
  min-height: 320px;
  max-height: 65vh;
  overflow: hidden;
  cursor: zoom-in;
}

.lightbox-image-stage.is-zoomed {
  cursor: zoom-out;
  overflow: auto;
}

.lightbox-image-stage img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.lightbox-image-stage.is-zoomed img {
  max-width: none;
  max-height: none;
  transform: scale(1.6);
}

.lightbox-zoom-toggle {
  position: absolute;
  top: 1rem;
  left: 1rem;
  background: rgba(255, 255, 255, 0.15);
  border: none;
  color: #fff;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Botones de Control */
.lightbox-btn {
  position: absolute;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #ffffff;
  border-radius: 50%;
  cursor: pointer;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease, transform 0.2s ease;
}

.lightbox-btn:hover {
  background: rgba(255, 255, 255, 0.3);
}

.lightbox-close {
  top: 1rem;
  right: 1rem;
  width: 40px;
  height: 40px;
  font-size: 1.75rem;
}

.lightbox-nav {
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
}

.lightbox-nav:hover {
  transform: translateY(-50%) scale(1.08);
}

.lightbox-prev { left: 1rem; }
.lightbox-next { right: 1rem; }

/* Pie informativo del Visor */
.lightbox-footer {
  padding: 1.25rem 1.5rem;
  background-color: #1a1815;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  color: #fcf8f0;
}

.lightbox-header-info {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}

.lightbox-header-info h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  margin: 0;
  color: #fcf8f0;
}

.lightbox-date {
  font-size: 0.75rem;
  color: #a3542d;
}

.lightbox-counter {
  margin-left: auto;
  font-size: 0.8rem;
  color: #8c857b;
  background: rgba(255, 255, 255, 0.08);
  padding: 3px 10px;
  border-radius: 12px;
}

.lightbox-footer p {
  font-family: 'Inter', sans-serif;
  font-size: 0.875rem;
  color: #c4beb4;
  margin: 0;
  line-height: 1.45;
}

/* Responsivo en Celulares */
@media (max-width: 640px) {
  .lightbox-nav {
    width: 38px;
    height: 38px;
  }
  .lightbox-prev { left: 0.5rem; }
  .lightbox-next { right: 0.5rem; }
  .gallery-feed-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== ADMIN MEJORADO ===== */
.admin-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}

.stat-card {
  background: rgba(255, 253, 248, 0.9);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 20px;
  text-align: center;
  box-shadow: var(--shadow);
}

.stat-number {
  display: block;
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--terracotta);
  font-family: var(--serif);
}

.stat-label {
  font-size: 0.8rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.admin-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 12px 0 16px;
  align-items: center;
}

.admin-filters label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
  color: var(--cacao);
}

.admin-filters select {
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fffdf8;
  font-size: 0.82rem;
}

.image-preview {
  margin-top: 6px;
  min-height: 40px;
}

.image-preview img {
  border-radius: 8px;
  border: 1px solid var(--line);
}

.admin-toast {
  position: fixed;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%) translateY(100px);
  z-index: 9999;
  background: var(--cacao);
  color: #fff;
  padding: 12px 24px;
  border-radius: 40px;
  font-size: 0.9rem;
  box-shadow: 0 8px 24px rgba(0,0,0,0.2);
  opacity: 0;
  transition: all 0.3s ease;
  max-width: 90%;
  text-align: center;
}

.admin-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.admin-toast.success { background: #3f7d56; }
.admin-toast.error { background: #b33c3c; }
.admin-toast.info { background: var(--cacao); }

.confirm-modal {
  background: #fffdf8;
  border-radius: 24px;
  padding: 32px;
  max-width: 420px;
  width: 100%;
  box-shadow: 0 25px 60px rgba(0,0,0,0.3);
  text-align: center;
}

.confirm-modal h3 {
  margin-top: 0;
  font-family: var(--serif);
  color: var(--cacao);
}

.confirm-modal p {
  color: var(--muted);
  margin-bottom: 24px;
}

.confirm-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
}

.confirm-actions .btn {
  min-width: 100px;
}

.admin-texts-container {
  background: rgba(255, 253, 248, 0.8);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 20px;
}

@media (max-width: 850px) {
  .admin-stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .admin-filters {
    flex-direction: column;
    align-items: stretch;
  }
}
/* ============================================================
   ESTILOS EXCLUSIVOS PARA GALERIA.HTML
   ============================================================ */

/* Centrar mejor el texto introductorio */
.gallery-intro {
  text-align: center;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* Paleta de colores para la galería (tonos tierra y cálidos) */
.gallery-preview-section {
  background: linear-gradient(135deg, #faf3ed 0%, #f5e8de 100%);
}

.gallery-preview-section .section-heading h2 {
  color: #5a3e33; /* marrón cálido */
}

.gallery-preview-section .section-heading .eyebrow {
  color: #b37b5e; /* terracota suave */
}

.gallery-preview-section .section-heading .eyebrow span {
  background: #b37b5e;
}

.gallery-preview-section .lead {
  color: #6b5347; /* marrón medio */
}

/* Tarjetas (post-card) con tonos más cálidos */
.gallery-preview-section .post-card {
  background: #fcf8f2; /* crema claro */
  border-color: rgba(179, 123, 94, 0.2);
  box-shadow: 0 6px 20px rgba(90, 62, 51, 0.08);
}

.gallery-preview-section .post-card:hover {
  box-shadow: 0 12px 30px rgba(90, 62, 51, 0.15);
  border-color: rgba(179, 123, 94, 0.4);
}

.gallery-preview-section .post-header {
  background: #fcf8f2;
  border-bottom-color: rgba(179, 123, 94, 0.1);
}

.gallery-preview-section .post-avatar {
  background: #b37b5e; /* terracota */
}

.gallery-preview-section .post-author-info strong {
  color: #5a3e33;
}

.gallery-preview-section .post-author-info small {
  color: #8a7266;
}

.gallery-preview-section .post-body h3 {
  color: #5a3e33;
}

.gallery-preview-section .post-body p {
  color: #7a6256;
}

/* Zoom badge más cálido */
.gallery-preview-section .zoom-badge {
  background: rgba(90, 62, 51, 0.8);
  color: #fcf8f2;
}

.gallery-preview-section .post-card:hover .zoom-badge {
  background: #b37b5e;
}

/* Frase de cierre */
.gallery-preview-section .closing-phrase {
  color: #5a3e33;
  border-top-color: rgba(179, 123, 94, 0.2);
  padding-top: 2rem;
}

/* Botón "Volver al inicio" con la nueva paleta */
.gallery-preview-section .btn-primary {
  background: #b37b5e;
  color: #fff;
}

.gallery-preview-section .btn-primary:hover {
  background: #5a3e33;
}

/* Ajustes para el mensaje vacío (cuando no hay imágenes) */
.gallery-preview-section .testimonial-empty {
  color: #6b5347;
  border-color: rgba(179, 123, 94, 0.3);
  background: rgba(252, 248, 242, 0.7);
}

/* Responsive: mantener coherencia en móviles */
@media (max-width: 620px) {
  .gallery-intro {
    max-width: 100%;
    padding: 0 1rem;
  }
}

/* ===== EDITOR DE TEXTOS ===== */

/* Quill CSS desde CDN */
@import url('https://cdn.quilljs.com/1.3.6/quill.snow.css');

.text-module {
  transition: border-color 0.2s ease;
}

.text-module:hover {
  border-color: var(--terracotta);
}

.text-module .ql-toolbar {
  border-radius: 8px 8px 0 0;
  background: #f9f6f0;
}

.text-module .ql-container {
  border-radius: 0 0 8px 8px;
  min-height: 120px;
  font-size: 0.95rem;
}

.text-module .ql-editor {
  min-height: 120px;
  font-size: 0.95rem;
}

.admin-text-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 16px;
}

/* Vista previa */
.preview-modal {
  background: #fffdf8;
  border-radius: 24px;
  padding: 32px;
  max-width: 800px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 25px 60px rgba(0,0,0,0.3);
}

.preview-modal h3 {
  font-family: var(--serif);
  color: var(--cacao);
  margin: 0;
}

.preview-modal .modal-close {
  background: none;
  border: none;
  font-size: 2rem;
  cursor: pointer;
  color: var(--cacao);
}

#previewContent {
  padding: 20px;
  background: var(--ivory);
  border-radius: 16px;
  min-height: 200px;
  color: var(--ink);
  line-height: 1.6;
}

#previewContent h1, #previewContent h2, #previewContent h3 {
  color: var(--cacao);
  font-family: var(--serif);
}

#previewContent p {
  margin-bottom: 1rem;
}

@media (max-width: 850px) {
  .text-module .ql-toolbar {
    flex-wrap: wrap;
  }
  .text-module .ql-toolbar button {
    padding: 4px 6px;
  }
}

/* ===== CARRUSEL HORIZONTAL (Modalidad y Dinámica) ===== */
.carousel-container {
  position: relative;
  margin-top: 2rem;
  padding: 0 50px; /* espacio para las flechas */
  max-width: 850px;
  margin-left: auto;
  margin-right: auto;
}

.carousel-track-wrapper {
  overflow: hidden;
  border-radius: 24px;
  background: transparent;  /* ← fondo transparente */
  box-shadow: none;         /* ← sin sombra */
  border: none;             /* ← sin borde */
}

.carousel-track {
  display: flex;
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

.carousel-slide {
  flex: 0 0 100%;
  padding: 2.5rem 2rem;
  text-align: center;
  min-height: 200px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.slide-title {
  font-family: var(--serif);
  font-size: 2rem;
  color: var(--cacao);
  margin-bottom: 0.75rem;
  font-weight: 600;
}

.slide-text {
  font-size: 1.1rem;
  color: var(--ink);
  max-width: 650px;
  line-height: 1.6;
  margin: 0 auto;
}

/* Flechas */
.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 253, 248, 0.9);
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  font-size: 2rem;
  font-weight: 300;
  color: var(--terracotta);
  cursor: pointer;
  z-index: 5;
  transition: background 0.2s ease, transform 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 0;
}

.carousel-btn:hover {
  background: var(--terracotta);
  color: #fff;
  transform: translateY(-50%) scale(1.05);
}

.carousel-prev {
  left: 0;
}
.carousel-next {
  right: 0;
}

/* Puntos indicadores */
.carousel-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 1.5rem;
}

.carousel-dots button {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: none;
  background: var(--line);
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
  padding: 0;
}

.carousel-dots button.active {
  background: var(--terracotta);
  transform: scale(1.2);
}

/* Responsive */
@media (max-width: 620px) {
  .carousel-container {
    padding: 0 30px;
  }
  .carousel-slide {
    padding: 1.8rem 1.2rem;
  }
  .slide-title {
    font-size: 1.6rem;
  }
  .slide-text {
    font-size: 1rem;
  }
  .carousel-btn {
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
  }
}
/* Ocultar logo inicialmente para evitar parpadeo */
#siteLogo {
  opacity: 0;
  transition: opacity 0.3s ease;
}

#siteLogo.loaded {
  opacity: 1;
}