/* ==========================================================================
   GREENLIFE ARTSOAPS — HOJA DE ESTILOS ÚNICA
   Orden: 01 Tokens · 02 Reset y base · 03 Tipografía · 04 Utilidades
          05 Botones y enlaces · 06 Sistema de imagen · 07 Cabecera
          08 Hero · 09 Manifiesto · 10 Explora · 11 Jabón de luna
          12 Catálogo · 13 Aromaterapia · 14 Servicios · 15 Talleres
          16 Galería y lightbox · 17 Nosotros · 18 FAQ · 19 Contacto
          20 Cierre · 21 Footer · 22 Botón flotante · 23 Privacidad
          24 Responsive · 25 Movimiento reducido
   Enfoque: mobile-first. Puntos de quiebre 768px y 1200px.
   ========================================================================== */

/* --------------------------------------------------------------------------
   01 · TOKENS
   -------------------------------------------------------------------------- */
:root{
  /* Paleta obligatoria */
  --marfil:#F8F5EF;
  --crema:#F0E9DE;
  --blanco:#FFFEFA;
  --verde-bosque:#263F34;
  --salvia:#AAB9A0;
  --musgo:#697B63;
  --terracota:#BB795F;
  --rosa-arcilla:#E8D5CE;
  --laton:#B49A66;
  --texto:#2D312D;
  --texto-2:#666960;
  --borde:#DEDCD2;

  /* Derivados */
  --bosque-hondo:#1C2E26;
  --bosque-suave:rgba(38,63,52,.06);
  --bosque-linea:rgba(38,63,52,.16);
  --claro-linea:rgba(248,245,239,.26);
  --sombra-1:0 1px 2px rgba(45,49,45,.04), 0 8px 24px rgba(45,49,45,.06);
  --sombra-2:0 24px 60px rgba(38,63,52,.14);
  --sombra-fija:0 1px 0 rgba(38,63,52,.08), 0 10px 30px rgba(45,49,45,.07);

  /* Tipografía */
  --serif:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;
  --sans:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;

  --fs-h1:clamp(2.85rem,4.1rem + 4.6vw,6.1rem);
  --fs-h2:clamp(2.05rem,1.6rem + 2.2vw,3.55rem);
  --fs-h3:clamp(1.32rem,1.16rem + .7vw,1.78rem);
  --fs-h4:clamp(1.08rem,1.02rem + .3vw,1.28rem);
  --fs-lead:clamp(1.03rem,.99rem + .22vw,1.2rem);
  --fs-body:1.0125rem;
  --fs-small:.875rem;
  --fs-micro:.6875rem;

  /* Geometría */
  --cont:1320px;
  --gutter:clamp(1.15rem,4vw,4.25rem);
  --secc:clamp(4.25rem,3rem + 6.5vw,9.5rem);
  --r:3px;
  --r-lg:5px;
  --hair:1px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur:.42s;
  --header-alto:66px;
}

/* --------------------------------------------------------------------------
   02 · RESET Y BASE
   -------------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html:focus-within{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--marfil);
  color:var(--texto);
  font-family:var(--sans);
  font-size:var(--fs-body);
  font-weight:400;
  line-height:1.72;
  letter-spacing:.004em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
body.is-locked{overflow:hidden}
h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
img,svg,video,iframe{display:block;max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--verde-bosque);text-decoration:none}
table{border-collapse:collapse;width:100%}
::-moz-selection{background:var(--rosa-arcilla);color:var(--verde-bosque)}
::selection{background:var(--rosa-arcilla);color:var(--verde-bosque)}

/* Grano muy sutil: profundidad de papel, sin degradados */
body::after{
  content:"";position:fixed;inset:0;z-index:3;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23g)' opacity='.035'/%3E%3C/svg%3E");
}

:focus-visible{
  outline:2px solid var(--terracota);
  outline-offset:3px;
  border-radius:1px;
}
.skip-link{
  position:fixed;top:.5rem;left:.5rem;z-index:400;
  transform:translateY(-160%);
  background:var(--verde-bosque);color:var(--blanco);
  padding:.7rem 1.1rem;border-radius:var(--r);
  font-size:var(--fs-small);font-weight:600;
  transition:transform var(--dur) var(--ease);
}
.skip-link:focus-visible{transform:none}
.visually-hidden{
  position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

/* --------------------------------------------------------------------------
   03 · TIPOGRAFÍA
   -------------------------------------------------------------------------- */
.h1,.h2,.h3,.h4,
h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:500;
  line-height:1.03;
  letter-spacing:-.012em;
  color:var(--verde-bosque);
  text-wrap:balance;
}
.h1,h1{font-size:var(--fs-h1);line-height:.98;font-weight:400}
.h2,h2{font-size:var(--fs-h2);line-height:1.05}
.h3,h3{font-size:var(--fs-h3);line-height:1.16;letter-spacing:-.008em}
.h4,h4{font-size:var(--fs-h4);line-height:1.28}
.h1 em,.h2 em,.h3 em{font-style:italic;color:var(--terracota);font-weight:400}
.h1 strong,.h2 strong{font-weight:600}

p{max-width:66ch}
.lead{
  font-size:var(--fs-lead);line-height:1.68;color:var(--texto-2);
  max-width:52ch;
}
.lead--dark{color:rgba(248,245,239,.82)}
.muted{color:var(--texto-2);font-size:var(--fs-small)}
.tiny{font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;color:var(--texto-2)}
.serif-quote{font-family:var(--serif);font-size:clamp(1.3rem,1rem + 1.5vw,2rem);line-height:1.3;font-style:italic;color:var(--verde-bosque)}

/* Etiqueta editorial con numeración */
.eyebrow{
  display:flex;align-items:center;gap:.7rem;
  font-size:var(--fs-micro);font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;
  color:var(--musgo);
  line-height:1.4;
}
.eyebrow::before{
  content:"";inline-size:clamp(18px,3vw,34px);block-size:var(--hair);
  background:currentColor;opacity:.55;flex:0 0 auto;
}
.eyebrow--center{justify-content:center}
.eyebrow--light{color:var(--salvia)}
.eyebrow__num{
  font-family:var(--serif);font-size:.95rem;font-weight:500;
  letter-spacing:.02em;color:var(--laton);text-transform:none;
}

/* Separador fino con detalle discreto */
.rule{
  position:relative;block-size:var(--hair);background:var(--borde);
  margin-block:clamp(2rem,4vw,3.5rem);
}
.rule::after{
  content:"";position:absolute;inset-inline:0;margin-inline:auto;
  inline-size:5px;block-size:5px;background:var(--laton);
  top:-2px;transform:rotate(45deg);opacity:.8;
}
.rule--dark{background:var(--claro-linea)}
.rule--dark::after{background:var(--salvia)}

/* --------------------------------------------------------------------------
   04 · UTILIDADES DE ESTRUCTURA
   -------------------------------------------------------------------------- */
.container{width:100%;max-width:var(--cont);margin-inline:auto;padding-inline:var(--gutter)}
.container--narrow{max-width:960px}
.container--text{max-width:760px}
.section{position:relative;padding-block:var(--secc);z-index:1}
.section--crema{background:var(--crema)}
.section--blanco{background:var(--blanco)}
.section--rosa{background:linear-gradient(180deg,var(--rosa-arcilla) 0%,#EFE0DA 100%)}
.section--bosque{background:var(--verde-bosque);color:var(--marfil)}
.section--bosque h2,.section--bosque h3{color:var(--blanco)}
.section__head{display:grid;gap:1.15rem;margin-bottom:clamp(2.25rem,4vw,3.75rem)}
.section__head--center{text-align:center;justify-items:center}
.section__head--center p{margin-inline:auto}
.stack>*+*{margin-top:1.15rem}
.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.25rem,2.4vw,2.4rem)}

/* Animación de entrada */
[data-reveal]{
  opacity:0;transform:translate3d(0,22px,0);
  transition:opacity .82s var(--ease-out),transform .82s var(--ease-out);
  transition-delay:calc(var(--i,0)*80ms);
  will-change:opacity,transform;
}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal="fade"]{transform:none}
[data-reveal="left"]{transform:translate3d(-24px,0,0)}
[data-reveal="right"]{transform:translate3d(24px,0,0)}
[data-reveal="scale"]{transform:scale(.975)}

/* --------------------------------------------------------------------------
   05 · BOTONES Y ENLACES
   -------------------------------------------------------------------------- */
.btn{
  --btn-bg:transparent;--btn-fg:var(--verde-bosque);--btn-bd:var(--bosque-linea);
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.65rem;
  padding:1.02rem 1.65rem;min-height:48px;
  background:var(--btn-bg);color:var(--btn-fg);
  border:var(--hair) solid var(--btn-bd);border-radius:var(--r);
  font-size:var(--fs-micro);font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  line-height:1.1;text-align:center;cursor:pointer;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease),
             border-color var(--dur) var(--ease),transform .3s var(--ease),box-shadow var(--dur) var(--ease);
  overflow:hidden;isolation:isolate;
}
.btn__txt{position:relative;z-index:1}
.btn__ico{position:relative;z-index:1;inline-size:15px;block-size:15px;flex:0 0 auto;transition:transform .35s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--primary{--btn-bg:var(--verde-bosque);--btn-fg:var(--blanco);--btn-bd:var(--verde-bosque)}
.btn--primary:hover{--btn-bg:var(--bosque-hondo);--btn-bd:var(--bosque-hondo);box-shadow:0 14px 30px rgba(38,63,52,.22)}
.btn--ghost:hover{--btn-bg:var(--bosque-suave);--btn-bd:var(--verde-bosque)}
.btn--ghost:hover .btn__ico{transform:translateX(3px)}
.btn--light{--btn-fg:var(--marfil);--btn-bd:var(--claro-linea)}
.btn--light:hover{--btn-bg:var(--marfil);--btn-fg:var(--verde-bosque);--btn-bd:var(--marfil)}
.btn--solid-light{--btn-bg:var(--marfil);--btn-fg:var(--verde-bosque);--btn-bd:var(--marfil)}
.btn--solid-light:hover{--btn-bg:var(--blanco);--btn-bd:var(--blanco);box-shadow:0 14px 30px rgba(0,0,0,.18)}
.btn--terra{--btn-bg:var(--terracota);--btn-fg:var(--blanco);--btn-bd:var(--terracota)}
.btn--terra:hover{background:#A9684F;border-color:#A9684F}
.btn--sm{padding:.78rem 1.15rem;min-height:42px;font-size:.625rem;letter-spacing:.14em}
.btn--wide{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:.85rem}
.btn-row--center{justify-content:center}

/* Enlace de texto con flecha */
.tlink{
  display:inline-flex;align-items:center;gap:.55rem;
  font-size:var(--fs-micro);font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--verde-bosque);padding-block:.4rem;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0% var(--hair);background-repeat:no-repeat;
  background-position:0 100%;
  transition:background-size .45s var(--ease),color .3s var(--ease),gap .3s var(--ease);
}
.tlink:hover{background-size:100% var(--hair);gap:.85rem;color:var(--terracota)}
.tlink__ico{inline-size:14px;block-size:14px;flex:0 0 auto}
.tlink--light{color:var(--marfil)}
.tlink--light:hover{color:var(--salvia)}

/* --------------------------------------------------------------------------
   06 · SISTEMA DE IMAGEN (con contenedor provisional elegante)
   -------------------------------------------------------------------------- */
.media{
  position:relative;display:block;overflow:hidden;
  background:var(--crema);border-radius:var(--r-lg);
  aspect-ratio:4/5;isolation:isolate;
}
.media--45{aspect-ratio:4/5}
.media--34{aspect-ratio:3/4}
.media--43{aspect-ratio:4/3}
.media--11{aspect-ratio:1/1}
.media--1611{aspect-ratio:16/11}
.media--32{aspect-ratio:3/2}
.media--125{aspect-ratio:1.25/1}
.media img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;
  z-index:2;opacity:0;
  transition:opacity .8s var(--ease),transform 1.1s var(--ease-out);
}
.media.is-ok img{opacity:1}
.media.is-missing img{display:none}
.media__ph{
  position:absolute;inset:0;z-index:1;
  display:grid;place-content:center;justify-items:center;gap:.9rem;
  padding:1.5rem;text-align:center;
  background:
    radial-gradient(120% 90% at 15% 10%,rgba(255,254,250,.85),transparent 60%),
    linear-gradient(155deg,var(--crema) 0%,#E7DFD2 55%,var(--rosa-arcilla) 130%);
}
.media__ph::before{
  content:"";position:absolute;inset:clamp(9px,1.6vw,16px);
  border:var(--hair) solid rgba(38,63,52,.14);border-radius:2px;pointer-events:none;
}
.media__mark{
  font-family:var(--serif);font-size:clamp(1.5rem,3.4vw,2.3rem);line-height:1;
  color:var(--musgo);opacity:.5;letter-spacing:.06em;
}
.media__tag{
  font-size:var(--fs-micro);font-weight:700;letter-spacing:.24em;text-transform:uppercase;
  color:var(--verde-bosque);opacity:.72;
}
.media__sub{font-size:.72rem;color:var(--texto-2);letter-spacing:.02em;max-width:24ch;line-height:1.5}
.media--dark .media__ph{
  background:linear-gradient(155deg,#2E4A3D 0%,var(--verde-bosque) 60%,#1E3229 100%);
}
.media--dark .media__ph::before{border-color:rgba(248,245,239,.2)}
.media--dark .media__mark{color:var(--salvia);opacity:.65}
.media--dark .media__tag{color:var(--marfil);opacity:.85}
.media--dark .media__sub{color:rgba(248,245,239,.6)}

/* Marco descentrado (profundidad editorial) */
.frame{position:relative}
.frame::after{
  content:"";position:absolute;inset-block:clamp(14px,2.4vw,28px);inset-inline-start:auto;
  inline-size:100%;block-size:100%;border:var(--hair) solid var(--bosque-linea);
  border-radius:var(--r-lg);z-index:0;pointer-events:none;
  transform:translate(clamp(10px,1.8vw,22px),clamp(10px,1.8vw,22px));
}
.frame--left::after{transform:translate(calc(var(--fx,18px)*-1),clamp(10px,1.8vw,22px))}
.frame--laton::after{border-color:rgba(180,154,102,.45)}
.frame>*{position:relative;z-index:1}

.media__cap{
  display:flex;align-items:center;gap:.55rem;margin-top:.85rem;
  font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--texto-2);
}
.media__cap::before{content:"";inline-size:16px;block-size:var(--hair);background:var(--laton)}

/* Zoom suave al pasar el cursor en soportes clicables */
.media--zoom:hover img,.g-item:hover .media img,.cat:hover .media img,.prod:hover .media img{transform:scale(1.035)}

/* --------------------------------------------------------------------------
   07 · CABECERA
   -------------------------------------------------------------------------- */
.site-header{
  position:fixed;inset-inline:0;top:0;z-index:120;
  background:transparent;
  transition:background .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease);
  border-block-end:var(--hair) solid transparent;
}
.site-header.is-scrolled{
  background:rgba(248,245,239,.94);
  -webkit-backdrop-filter:blur(10px) saturate(1.08);
  backdrop-filter:blur(10px) saturate(1.08);
  border-block-end-color:var(--borde);
  box-shadow:var(--sombra-fija);
}
.header__inner{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  block-size:var(--header-alto);
}
.brand{display:inline-flex;align-items:center;gap:.6rem;flex:0 0 auto}
.brand__mark{
  inline-size:26px;block-size:26px;flex:0 0 auto;color:var(--verde-bosque);
}
.brand__txt{display:grid;line-height:1}
.brand__name{
  font-family:var(--serif);font-size:1.16rem;font-weight:600;letter-spacing:.01em;
  color:var(--verde-bosque);
}
.brand__sub{
  font-size:.53rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;
  color:var(--musgo);margin-top:.22rem;
}
.nav{display:none}
.nav__list{display:flex;align-items:center;gap:clamp(1rem,1.9vw,2.05rem)}
.nav__link{
  position:relative;display:inline-block;padding-block:.45rem;
  font-size:.71rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--texto);transition:color .3s var(--ease);
}
.nav__link::after{
  content:"";position:absolute;inset-inline:0;block-size:var(--hair);
  background:var(--terracota);transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease);
}
.nav__link:hover,.nav__link[aria-current="true"]{color:var(--verde-bosque)}
.nav__link:hover::after,.nav__link[aria-current="true"]::after{transform:scaleX(1)}
.header__cta{display:none}
.header__actions{display:flex;align-items:center;gap:.5rem}

/* Botón hamburguesa */
.nav-toggle{
  display:inline-grid;place-content:center;gap:5px;
  inline-size:46px;block-size:44px;padding:0;
  background:transparent;border:var(--hair) solid var(--bosque-linea);border-radius:var(--r);
  cursor:pointer;
}
.nav-toggle__bar{
  display:block;inline-size:17px;block-size:var(--hair);background:var(--verde-bosque);
  margin-inline:auto;transition:transform .38s var(--ease),opacity .25s var(--ease);
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Panel móvil */
.nav-backdrop{
  position:fixed;inset:0;z-index:130;background:rgba(28,46,38,.42);
  opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility 0s linear .4s;
}
.nav-backdrop.is-open{opacity:1;visibility:visible;transition:opacity .4s var(--ease),visibility 0s}
.nav-panel{
  position:fixed;top:0;right:0;bottom:0;z-index:140;
  inline-size:min(88vw,380px);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:1.15rem var(--gutter) 1.6rem;
  background:var(--marfil);border-inline-start:var(--hair) solid var(--borde);
  box-shadow:-30px 0 60px rgba(38,63,52,.16);
  transform:translateX(102%);visibility:hidden;
  transition:transform .5s var(--ease-out),visibility 0s linear .5s;
  overflow-y:auto;overscroll-behavior:contain;
}
.nav-panel.is-open{transform:none;visibility:visible;transition:transform .5s var(--ease-out),visibility 0s}
.nav-panel__top{display:flex;align-items:center;justify-content:space-between;block-size:calc(var(--header-alto) - 12px)}
.nav-panel__close{
  inline-size:44px;block-size:44px;display:grid;place-content:center;
  background:transparent;border:var(--hair) solid var(--bosque-linea);border-radius:var(--r);cursor:pointer;
  color:var(--verde-bosque);
}
.nav-panel__list{display:grid;gap:.1rem;margin-block:1.5rem 2rem}
.nav-panel__link{
  display:flex;align-items:baseline;gap:.8rem;
  font-family:var(--serif);font-size:1.72rem;line-height:1.32;color:var(--verde-bosque);
  padding-block:.28rem;border-block-end:var(--hair) solid rgba(38,63,52,.08);
  transition:color .3s var(--ease),padding-inline-start .35s var(--ease);
}
.nav-panel__link:hover{color:var(--terracota);padding-inline-start:.45rem}
.nav-panel__n{font-family:var(--sans);font-size:.58rem;font-weight:700;letter-spacing:.16em;color:var(--laton)}
.nav-panel__foot{display:grid;gap:1.05rem}
.nav-panel__meta{display:grid;gap:.2rem;font-size:.78rem;color:var(--texto-2);line-height:1.55}
.nav-panel__meta strong{display:block;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--musgo);font-weight:700}

/* --------------------------------------------------------------------------
   08 · HERO
   -------------------------------------------------------------------------- */
.hero{
  position:relative;padding-top:calc(var(--header-alto) + clamp(1.6rem,5vw,3rem));
  padding-bottom:clamp(3rem,7vw,6rem);
  background:
    radial-gradient(78% 60% at 88% 6%,rgba(232,213,206,.55),transparent 62%),
    radial-gradient(60% 50% at 4% 96%,rgba(170,185,160,.28),transparent 60%),
    var(--marfil);
  overflow:hidden;
}
.hero__grid{display:grid;gap:clamp(2rem,5vw,3.2rem);align-items:center}
.hero__copy{display:grid;gap:clamp(1.15rem,2.4vw,1.6rem);justify-items:start}
.hero__title{max-width:14ch}
.hero__title br{display:none}
.hero__lead{max-width:44ch}
.hero__aux{
  display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .85rem;
  font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--musgo);
}
.hero__aux span:not(:last-child)::after{content:"";display:inline-block;margin-inline-start:.85rem;inline-size:4px;block-size:4px;border-radius:50%;background:var(--laton);vertical-align:middle}
.hero__media{position:relative}
.hero__badge{
  position:absolute;z-index:3;inset-inline-start:clamp(-8px,-1vw,0px);bottom:clamp(14px,3vw,34px);
  display:grid;gap:.15rem;padding:.85rem 1.15rem;
  background:var(--blanco);border-radius:var(--r);box-shadow:var(--sombra-2);
  max-inline-size:62%;
}
.hero__badge b{font-family:var(--serif);font-size:1.05rem;font-weight:600;color:var(--verde-bosque);line-height:1.2}
.hero__badge i{font-style:normal;font-size:.6rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--musgo)}
.hero__scroll{
  display:none;align-items:center;gap:.6rem;margin-top:clamp(1.5rem,3vw,2.4rem);
  font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--texto-2);
}
.hero__scroll::after{content:"";inline-size:52px;block-size:var(--hair);background:linear-gradient(90deg,var(--musgo),transparent);animation:slide 2.6s var(--ease) infinite}
@keyframes slide{0%,100%{transform:scaleX(.55);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}}

/* --------------------------------------------------------------------------
   09 · MANIFIESTO
   -------------------------------------------------------------------------- */
.manifiesto{background:var(--crema);text-align:center}
.manifiesto__inner{max-width:820px;margin-inline:auto;display:grid;gap:clamp(1.25rem,2.6vw,1.85rem);justify-items:center}
.manifiesto h2{max-width:20ch}
.manifiesto p{max-width:58ch;color:var(--texto-2)}
.manifiesto__close{
  font-family:var(--serif);font-size:clamp(1.28rem,1rem + 1.1vw,1.85rem);
  font-style:italic;color:var(--verde-bosque);line-height:1.35;
}
.manifiesto__mark{inline-size:34px;block-size:34px;color:var(--laton);opacity:.75}

/* --------------------------------------------------------------------------
   10 · EXPLORA (tres categorías, composición asimétrica)
   -------------------------------------------------------------------------- */
.explora__grid{display:grid;gap:clamp(1.6rem,3vw,2.4rem)}
.cat{
  position:relative;display:grid;gap:1.35rem;align-content:start;
  padding-bottom:1.35rem;border-block-end:var(--hair) solid var(--borde);
}
.cat__media{--fx:14px}
.cat__body{display:grid;gap:.8rem;justify-items:start;align-content:start}
.cat__title{max-width:18ch}
.cat__text{color:var(--texto-2);font-size:.9688rem;max-width:42ch}
.cat__n{
  font-family:var(--serif);font-size:.95rem;color:var(--laton);letter-spacing:.02em;
}
.cat--lg .cat__title{font-size:clamp(1.6rem,1.3rem + 1.5vw,2.5rem)}
.cat--sm{grid-template-columns:minmax(0,1fr);padding:0;border:0;gap:1.1rem}
.cat--sm .cat__media{aspect-ratio:4/3}
.cat-list{display:grid;gap:clamp(1.6rem,3vw,2.2rem)}

/* --------------------------------------------------------------------------
   11 · JABÓN DE LUNA (sección editorial de producto)
   -------------------------------------------------------------------------- */
.luna{background:var(--blanco)}
.luna__grid{display:grid;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.luna__media{--fx:20px}
.luna__body{display:grid;gap:1.25rem;justify-items:start}
.luna__body h2{max-width:16ch}
.luna__body>p{color:var(--texto-2);max-width:48ch}
.ingr{
  inline-size:100%;padding-block:1.35rem;
  border-block:var(--hair) solid var(--borde);
}
.ingr__t{
  font-size:var(--fs-micro);font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--musgo);margin-bottom:1rem;
}
.ingr__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem 1.25rem}
.ingr__item{
  display:flex;align-items:center;gap:.6rem;
  font-family:var(--serif);font-size:1.12rem;color:var(--verde-bosque);
}
.ingr__item::before{content:"";inline-size:5px;block-size:5px;background:var(--terracota);transform:rotate(45deg);flex:0 0 auto}
.luna__note{font-size:.86rem;color:var(--texto-2);max-width:50ch;line-height:1.65}

/* --------------------------------------------------------------------------
   12 · CATÁLOGO
   -------------------------------------------------------------------------- */
.catalogo__grid{display:grid;gap:clamp(1.5rem,2.6vw,2.3rem)}
.prod{display:grid;gap:1.05rem;align-content:start}
.prod__media{--fx:12px}
.prod__body{display:grid;gap:.6rem;justify-items:start}
.prod__name{font-size:clamp(1.24rem,1.1rem + .6vw,1.6rem)}
.prod__desc{font-size:.9375rem;color:var(--texto-2);max-width:44ch}
.prod__meta{
  display:inline-flex;align-items:center;gap:.45rem;
  font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--musgo);
}
.prod__meta::before{content:"";inline-size:14px;block-size:var(--hair);background:var(--laton)}
.prod__cta{margin-top:.35rem}
.catalogo__more{
  margin-top:clamp(2.25rem,4vw,3.4rem);padding-top:clamp(1.6rem,3vw,2.2rem);
  border-top:var(--hair) solid var(--borde);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.1rem;
}
.catalogo__more p{font-family:var(--serif);font-size:clamp(1.15rem,1rem + .7vw,1.5rem);font-style:italic;color:var(--verde-bosque);max-width:34ch}

/* --------------------------------------------------------------------------
   13 · AROMATERAPIA (fondo verde bosque)
   -------------------------------------------------------------------------- */
.aroma{background:var(--verde-bosque);color:var(--marfil);overflow:hidden;position:relative}
.aroma::before{
  content:"";position:absolute;inset-block-start:-22%;inset-inline-end:-12%;
  inline-size:min(52vw,620px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(170,185,160,.16),transparent 68%);pointer-events:none;
}
.aroma__grid{position:relative;display:grid;gap:clamp(2rem,5vw,4rem);align-items:center;z-index:1}
.aroma__body{display:grid;gap:1.2rem;justify-items:start}
.aroma__body h2{color:var(--blanco);max-width:18ch}
.aroma__body>p{color:rgba(248,245,239,.8);max-width:48ch}
.usos{display:grid;gap:0;inline-size:100%;margin-block:.5rem .35rem}
.uso{
  display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:baseline;
  padding-block:1.05rem;border-block-end:var(--hair) solid var(--claro-linea);
}
.uso:first-child{border-block-start:var(--hair) solid var(--claro-linea)}
.uso__n{font-family:var(--serif);font-size:.95rem;color:var(--salvia)}
.uso__t{display:grid;gap:.25rem}
.uso__t b{font-family:var(--serif);font-size:1.28rem;font-weight:500;color:var(--blanco)}
.uso__t span{font-size:.86rem;color:rgba(248,245,239,.7)}
.aroma__media{--fx:18px}

/* --------------------------------------------------------------------------
   14 · SERVICIOS (lista editorial, no tarjetas idénticas)
   -------------------------------------------------------------------------- */
.servicios__grid{display:grid;gap:clamp(2rem,4vw,3.4rem)}
.servicios__aside{display:grid;gap:1.15rem;align-content:start}
.servicios__aside h2{max-width:16ch}
.servicios__aside>p{color:var(--texto-2);max-width:44ch}
.servicios__pics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:end}
.servicios__pics .media:nth-child(2){aspect-ratio:1/1;margin-bottom:clamp(1rem,3vw,2.4rem)}
.lista-serv{display:grid}
.serv{
  display:grid;grid-template-columns:auto 1fr;gap:.9rem 1.15rem;align-items:start;
  padding-block:clamp(1.35rem,2.6vw,1.9rem);
  border-block-start:var(--hair) solid var(--borde);
  transition:padding-inline-start .4s var(--ease),background .4s var(--ease);
}
.serv:last-child{border-block-end:var(--hair) solid var(--borde)}
.serv:hover{background:linear-gradient(90deg,rgba(240,233,222,.75),transparent)}
.serv__num{
  font-family:var(--serif);font-size:.95rem;color:var(--laton);padding-top:.28rem;
}
.serv__main{display:grid;gap:.5rem;min-width:0}
.serv__title{font-size:clamp(1.28rem,1.1rem + .8vw,1.72rem);transition:transform .4s var(--ease)}
.serv:hover .serv__title{transform:translateX(4px)}
.serv__text{font-size:.9375rem;color:var(--texto-2);max-width:52ch}
.serv__link{margin-top:.15rem}
.aviso{
  display:flex;gap:.7rem;align-items:flex-start;margin-top:clamp(1.5rem,3vw,2.2rem);
  font-size:.8rem;color:var(--texto-2);line-height:1.6;max-width:62ch;
}
.aviso svg{inline-size:15px;block-size:15px;flex:0 0 auto;margin-top:.22rem;color:var(--musgo)}

/* --------------------------------------------------------------------------
   15 · TALLERES
   -------------------------------------------------------------------------- */
.talleres{background:var(--crema);overflow:hidden}
.talleres__grid{display:grid;gap:clamp(2rem,4vw,3.6rem);align-items:center}
.talleres__panel{
  display:grid;gap:1.2rem;justify-items:start;
  background:var(--blanco);border:var(--hair) solid var(--borde);border-radius:var(--r-lg);
  padding:clamp(1.6rem,3.4vw,2.9rem);box-shadow:var(--sombra-1);
}
.talleres__panel h2{max-width:17ch}
.talleres__panel>p{color:var(--texto-2);max-width:46ch}
.talleres__final{
  font-family:var(--serif);font-size:clamp(1.12rem,1rem + .6vw,1.42rem);font-style:italic;
  color:var(--verde-bosque);line-height:1.4;max-width:34ch;
}
.taller-pics{display:grid;gap:clamp(1.1rem,2.4vw,1.8rem)}
.taller{position:relative;display:grid;gap:1rem}
.taller__img{--fx:12px}
.taller__badge{
  position:absolute;z-index:3;inset-block-start:clamp(10px,1.6vw,18px);inset-inline-start:clamp(10px,1.6vw,18px);
  padding:.45rem .8rem;background:rgba(255,254,250,.94);border-radius:2px;
  font-size:.58rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--verde-bosque);
}
.taller__body{display:grid;gap:.45rem;padding-inline:.25rem}
.taller__title{font-size:clamp(1.2rem,1.05rem + .7vw,1.55rem)}
.taller__text{font-size:.9375rem;color:var(--texto-2);max-width:46ch}
.taller:nth-child(even) .taller__body{padding-inline-start:clamp(0px,2vw,2rem)}

/* --------------------------------------------------------------------------
   16 · GALERÍA + LIGHTBOX
   -------------------------------------------------------------------------- */
.filtros{
  display:flex;flex-wrap:wrap;gap:.5rem;
  margin-block:clamp(1.5rem,3vw,2.4rem) clamp(1.35rem,2.6vw,2rem);
}
.filtro{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.6rem 1rem;min-height:42px;
  background:transparent;border:var(--hair) solid var(--borde);border-radius:999px;
  font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--texto-2);
  cursor:pointer;transition:all .35s var(--ease);
}
.filtro:hover{border-color:var(--verde-bosque);color:var(--verde-bosque)}
.filtro[aria-pressed="true"]{background:var(--verde-bosque);border-color:var(--verde-bosque);color:var(--blanco)}
.filtro__n{font-size:.58rem;opacity:.7;font-variant-numeric:tabular-nums}
.galeria__grid{display:grid;gap:clamp(.85rem,1.8vw,1.4rem);grid-template-columns:repeat(2,minmax(0,1fr))}
.g-item{
  position:relative;display:block;padding:0;border:0;background:transparent;cursor:pointer;
  text-align:start;border-radius:var(--r-lg);
  transition:opacity .38s var(--ease),transform .38s var(--ease),filter .38s var(--ease);
}
.g-item.is-out{opacity:0;transform:scale(.97)}
.g-item[hidden]{display:none}
.g-item .media{inline-size:100%}
.g-item__cap{
  display:grid;gap:.2rem;padding-top:.7rem;
}
.g-item__t{font-family:var(--serif);font-size:1.06rem;color:var(--verde-bosque);line-height:1.25}
.g-item__c{font-size:.6rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--musgo)}
.g-item__ov{
  position:absolute;inset:0;z-index:4;display:grid;align-content:end;gap:.3rem;
  padding:clamp(.85rem,2vw,1.35rem);
  background:linear-gradient(to top,rgba(28,46,38,.72),rgba(28,46,38,.12) 46%,transparent);
  opacity:0;transition:opacity .45s var(--ease);border-radius:var(--r-lg);
}
.g-item:hover .g-item__ov,.g-item:focus-visible .g-item__ov{opacity:1}
.g-item__ov b{font-family:var(--serif);font-weight:500;font-size:1.12rem;color:var(--blanco)}
.g-item__ov span{font-size:.66rem;letter-spacing:.1em;color:rgba(248,245,239,.82)}
.play{
  position:absolute;inset:0;z-index:5;display:grid;place-content:center;
}
.play__btn{
  inline-size:62px;block-size:62px;border-radius:50%;display:grid;place-content:center;
  background:rgba(255,254,250,.92);color:var(--verde-bosque);
  box-shadow:0 12px 30px rgba(0,0,0,.22);transition:transform .35s var(--ease),background .35s var(--ease);
}
.g-item:hover .play__btn{transform:scale(1.07);background:var(--blanco)}
.galeria__empty{
  padding:2.5rem 1rem;text-align:center;color:var(--texto-2);font-size:.9rem;
  border:var(--hair) dashed var(--borde);border-radius:var(--r-lg);
}

/* Lightbox */
.lb{position:fixed;inset:0;z-index:300;display:grid;opacity:0;visibility:hidden;transition:opacity .38s var(--ease),visibility 0s linear .38s}
.lb.is-open{opacity:1;visibility:visible;transition:opacity .38s var(--ease),visibility 0s}
.lb__backdrop{position:absolute;inset:0;background:rgba(20,32,27,.94);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);cursor:zoom-out}
.lb__stage{
  position:relative;z-index:1;display:grid;gap:.9rem;align-content:center;justify-items:center;
  padding:clamp(3.2rem,8vh,5rem) clamp(1rem,6vw,5.5rem);
  block-size:100%;overflow-y:auto;overscroll-behavior:contain;text-align:center;
}
.lb__media{
  position:relative;inline-size:100%;max-inline-size:min(1080px,92vw);
  background:var(--crema);border-radius:var(--r-lg);overflow:hidden;
  min-block-size:180px;
}
.lb__media img{inline-size:100%;block-size:auto;max-block-size:74vh;object-fit:contain;background:var(--crema)}
.lb__media iframe{inline-size:100%;aspect-ratio:16/9;border:0;display:block;background:#000}
.lb__media .media__ph{position:relative;aspect-ratio:4/3;inset:auto}
.lb__caption{font-family:var(--serif);font-size:clamp(1.1rem,1rem + .6vw,1.5rem);color:var(--blanco);max-width:52ch;line-height:1.35}
.lb__caption b{font-weight:600;display:block}
.lb__caption span{display:block;font-family:var(--sans);font-size:.82rem;color:rgba(248,245,239,.68);margin-top:.3rem;letter-spacing:.01em}
.lb__counter{font-size:.62rem;font-weight:700;letter-spacing:.2em;color:var(--salvia);font-variant-numeric:tabular-nums}
.lb__btn{
  position:absolute;z-index:2;display:grid;place-content:center;
  inline-size:48px;block-size:48px;border-radius:50%;
  background:rgba(248,245,239,.1);border:var(--hair) solid rgba(248,245,239,.3);
  color:var(--marfil);cursor:pointer;
  transition:background .3s var(--ease),transform .3s var(--ease),border-color .3s var(--ease);
}
.lb__btn:hover{background:rgba(248,245,239,.22);border-color:var(--marfil)}
.lb__btn svg{inline-size:17px;block-size:17px}
.lb__btn--close{inset-block-start:clamp(.7rem,2vh,1.4rem);inset-inline-end:clamp(.7rem,2vw,1.4rem)}
.lb__btn--prev{inset-block-start:50%;inset-inline-start:clamp(.4rem,1.6vw,1.2rem);transform:translateY(-50%)}
.lb__btn--next{inset-block-start:50%;inset-inline-end:clamp(.4rem,1.6vw,1.2rem);transform:translateY(-50%)}
.lb__btn--prev:hover{transform:translateY(-50%) translateX(-2px)}
.lb__btn--next:hover{transform:translateY(-50%) translateX(2px)}
.lb[hidden]{display:none}

/* --------------------------------------------------------------------------
   17 · NOSOTROS
   -------------------------------------------------------------------------- */
.nosotros{background:var(--blanco)}
.nosotros__grid{display:grid;gap:clamp(2rem,4.5vw,4rem);align-items:center}
.nosotros__body{display:grid;gap:1.25rem;justify-items:start}
.nosotros__body h2{max-width:15ch}
.nosotros__body p{color:var(--texto-2);max-width:50ch}
.nosotros__close{
  font-family:var(--serif);font-size:clamp(1.2rem,1.05rem + .8vw,1.62rem);font-style:italic;
  color:var(--verde-bosque);line-height:1.4;max-width:32ch;
  padding-inline-start:1.15rem;border-inline-start:2px solid var(--laton);
}
.nosotros__sign{display:grid;gap:.35rem;padding-top:.5rem}
.nosotros__sign b{font-family:var(--serif);font-size:1.3rem;font-weight:600;color:var(--verde-bosque)}
.nosotros__sign span{font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--musgo)}
.nosotros__media{--fx:20px}
.pendiente{
  display:flex;gap:.6rem;align-items:flex-start;
  margin-top:.25rem;padding:.85rem 1rem;
  background:var(--crema);border-radius:var(--r);
  font-size:.78rem;color:var(--texto-2);line-height:1.55;max-width:46ch;
}
.pendiente svg{inline-size:14px;block-size:14px;flex:0 0 auto;margin-top:.2rem;color:var(--musgo)}

/* --------------------------------------------------------------------------
   18 · FAQ
   -------------------------------------------------------------------------- */
.faq__grid{display:grid;gap:clamp(1.75rem,4vw,3.5rem);align-items:start}
.faq__intro{display:grid;gap:1rem;align-content:start}
.faq__intro h2{max-width:14ch}
.faq__intro p{color:var(--texto-2);max-width:38ch}
.faq__list{border-block-start:var(--hair) solid var(--borde)}
.faq__item{border-block-end:var(--hair) solid var(--borde)}
.faq__q{
  inline-size:100%;display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:center;
  padding:clamp(1.15rem,2.4vw,1.6rem) 0;padding-inline-end:.25rem;
  background:transparent;border:0;cursor:pointer;text-align:start;
  font-family:var(--serif);font-size:clamp(1.12rem,1rem + .6vw,1.42rem);
  line-height:1.3;color:var(--verde-bosque);
  transition:color .3s var(--ease),padding-inline-start .35s var(--ease);
}
.faq__q:hover{color:var(--terracota)}
.faq__item.is-open .faq__q{color:var(--verde-bosque)}
.faq__icon{
  position:relative;inline-size:22px;block-size:22px;flex:0 0 auto;
  border:var(--hair) solid var(--bosque-linea);border-radius:50%;
  transition:background .35s var(--ease),border-color .35s var(--ease),transform .45s var(--ease);
}
.faq__icon::before,.faq__icon::after{
  content:"";position:absolute;inset-block-start:50%;inset-inline-start:50%;
  background:var(--verde-bosque);transform:translate(-50%,-50%);
  transition:background .35s var(--ease),opacity .3s var(--ease);
}
.faq__icon::before{inline-size:9px;block-size:1px}
.faq__icon::after{inline-size:1px;block-size:9px}
.faq__item.is-open .faq__icon{background:var(--verde-bosque);border-color:var(--verde-bosque);transform:rotate(180deg)}
.faq__item.is-open .faq__icon::before,.faq__item.is-open .faq__icon::after{background:var(--blanco)}
.faq__item.is-open .faq__icon::after{opacity:0}
.faq__panel{
  display:grid;grid-template-rows:0fr;visibility:hidden;
  transition:grid-template-rows .5s var(--ease),visibility 0s linear .5s;
}
.faq__item.is-open .faq__panel{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .5s var(--ease),visibility 0s}
.faq__panel>div{overflow:hidden}
.faq__answer{
  padding-block-end:clamp(1.2rem,2.4vw,1.7rem);
  font-size:.9375rem;color:var(--texto-2);max-width:62ch;line-height:1.72;
}

/* --------------------------------------------------------------------------
   19 · CONTACTO
   -------------------------------------------------------------------------- */
.contacto{background:var(--crema)}
.contacto__head{display:grid;gap:1.1rem;justify-items:center;text-align:center;margin-bottom:clamp(2rem,4vw,3.4rem)}
.contacto__head h2{max-width:18ch}
.contacto__head p{color:var(--texto-2);max-width:52ch;margin-inline:auto}
.contacto__grid{display:grid;gap:clamp(1.35rem,2.6vw,2rem);align-items:stretch}
.info{
  background:var(--verde-bosque);color:var(--marfil);border-radius:var(--r-lg);
  padding:clamp(1.6rem,3.2vw,2.6rem);display:grid;gap:1.35rem;align-content:start;
}
.info__t{font-family:var(--serif);font-size:1.5rem;color:var(--blanco);line-height:1.2}
.info__row{display:grid;gap:.3rem;padding-block:1.05rem;border-block-end:var(--hair) solid var(--claro-linea)}
.info__row:first-of-type{border-block-start:var(--hair) solid var(--claro-linea)}
.info__l{font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--salvia)}
.info__v{font-size:1rem;color:var(--marfil);line-height:1.55}
.info__v a{color:var(--blanco);border-block-end:var(--hair) solid rgba(248,245,239,.35);transition:border-color .3s var(--ease)}
.info__v a:hover{border-color:var(--blanco)}
.info__v--big{font-family:var(--serif);font-size:clamp(1.35rem,1.1rem + 1.2vw,1.95rem);letter-spacing:.01em}
.info__v--big a{border:0}
.info__hint{font-size:.78rem;color:rgba(248,245,239,.66);line-height:1.55}
.info__links{display:grid;gap:.55rem}
.info__envios{
  display:flex;gap:.7rem;align-items:flex-start;padding:1rem 1.1rem;
  background:rgba(248,245,239,.07);border-radius:var(--r);
  font-size:.82rem;color:rgba(248,245,239,.82);line-height:1.6;
}
.info__envios svg{inline-size:15px;block-size:15px;flex:0 0 auto;margin-top:.22rem;color:var(--salvia)}

.form-card{
  background:var(--blanco);border:var(--hair) solid var(--borde);border-radius:var(--r-lg);
  padding:clamp(1.5rem,3.2vw,2.6rem);box-shadow:var(--sombra-1);
  display:grid;gap:1.15rem;align-content:start;
}
.form-card__t{font-family:var(--serif);font-size:1.5rem;color:var(--verde-bosque);line-height:1.2}
.form{display:grid;gap:1.05rem}
.field{display:grid;gap:.42rem}
.field__label{
  font-size:.63rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--musgo);
}
.field__label .req{color:var(--terracota);margin-inline-start:.2rem}
.field__input,.field__select,.field__area{
  inline-size:100%;padding:.92rem 1rem;min-height:50px;
  background:var(--marfil);color:var(--texto);
  border:var(--hair) solid var(--borde);border-radius:var(--r);
  font-size:.95rem;font-family:var(--sans);line-height:1.5;
  transition:border-color .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease);
  appearance:none;-webkit-appearance:none;
}
.field__area{min-height:132px;resize:vertical}
.field__select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23263F34' stroke-width='1.4'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;background-size:11px;padding-inline-end:2.6rem;
}
.field__input::placeholder,.field__area::placeholder{color:#9A9C93}
.field__input:focus,.field__select:focus,.field__area:focus{
  outline:none;border-color:var(--verde-bosque);background:var(--blanco);
  box-shadow:0 0 0 3px rgba(38,63,52,.09);
}
.field.is-invalid .field__input,.field.is-invalid .field__select,.field.is-invalid .field__area{
  border-color:#A8503C;background:#FDF7F5;
}
.field__error{
  font-size:.75rem;color:#96402E;line-height:1.45;min-height:0;
  display:none;
}
.field.is-invalid .field__error{display:block}
.field__help{font-size:.75rem;color:var(--texto-2);line-height:1.5}
.checkbox{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:start;cursor:pointer}
.checkbox input{
  inline-size:19px;block-size:19px;margin:.18rem 0 0;flex:0 0 auto;
  appearance:none;-webkit-appearance:none;cursor:pointer;
  background:var(--marfil);border:var(--hair) solid var(--borde);border-radius:2px;
  display:grid;place-content:center;transition:all .25s var(--ease);
}
.checkbox input::after{
  content:"";inline-size:9px;block-size:5px;border-inline-start:2px solid var(--blanco);
  border-block-end:2px solid var(--blanco);transform:rotate(-45deg) scale(0);transform-origin:center;
  transition:transform .25s var(--ease);
}
.checkbox input:checked{background:var(--verde-bosque);border-color:var(--verde-bosque)}
.checkbox input:checked::after{transform:rotate(-45deg) scale(1)}
.checkbox input:focus-visible{outline:2px solid var(--terracota);outline-offset:2px}
.checkbox span span{font-size:.81rem;color:var(--texto-2);line-height:1.6}
.checkbox a{color:var(--verde-bosque);border-block-end:var(--hair) solid var(--bosque-linea)}
.checkbox a:hover{border-color:var(--terracota);color:var(--terracota)}
.form__actions{display:grid;gap:.85rem;margin-top:.35rem}
.form__status{
  display:none;gap:.7rem;align-items:flex-start;
  padding:.95rem 1.05rem;border-radius:var(--r);
  background:rgba(170,185,160,.2);border:var(--hair) solid rgba(105,123,99,.35);
  font-size:.83rem;line-height:1.6;color:#3A4A3E;
}
.form__status.is-on{display:flex}
.form__status.is-error{background:rgba(187,121,95,.12);border-color:rgba(187,121,95,.4);color:#7E3F2C}
.form__status svg{inline-size:15px;block-size:15px;flex:0 0 auto;margin-top:.2rem}
.form__status a{font-weight:700;text-decoration:underline}
.form__legal{font-size:.74rem;color:var(--texto-2);line-height:1.6}
.form__legal a{color:var(--verde-bosque);border-block-end:var(--hair) solid var(--bosque-linea)}

/* Mapa */
.mapa{margin-top:clamp(1.6rem,3vw,2.4rem);display:grid;gap:1rem}
.mapa__frame{
  position:relative;background:var(--crema);border:var(--hair) solid var(--borde);
  border-radius:var(--r-lg);overflow:hidden;aspect-ratio:16/10;
}
@media (min-width:768px){.mapa__frame{aspect-ratio:21/8}}
.mapa__frame iframe{inline-size:100%;block-size:100%;border:0;filter:saturate(.9) contrast(.98)}
.mapa__ph{
  position:absolute;inset:0;z-index:2;display:grid;place-content:center;justify-items:center;gap:.8rem;
  padding:1.5rem;text-align:center;background:linear-gradient(150deg,var(--crema),#E6DED1);
}
.mapa__ph p{font-size:.85rem;color:var(--texto-2);max-width:34ch}
.mapa__ph.is-loaded{opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility 0s .5s}
.mapa__bar{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:space-between}
.mapa__dir{display:grid;gap:.2rem}
.mapa__dir b{font-family:var(--serif);font-size:1.15rem;color:var(--verde-bosque);font-weight:600}
.mapa__dir span{font-size:.82rem;color:var(--texto-2)}

/* --------------------------------------------------------------------------
   20 · CIERRE
   -------------------------------------------------------------------------- */
.cierre{
  position:relative;overflow:hidden;
  background:linear-gradient(160deg,#2B463A 0%,var(--verde-bosque) 45%,#1F3429 100%);
  color:var(--marfil);text-align:center;
}
.cierre::before{
  content:"";position:absolute;inset-block-start:-30%;inset-inline-start:50%;transform:translateX(-50%);
  inline-size:min(120vw,900px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(232,213,206,.14),transparent 65%);pointer-events:none;
}
.cierre__inner{position:relative;z-index:1;display:grid;gap:1.4rem;justify-items:center}
.cierre h2{color:var(--blanco);font-size:clamp(2.2rem,1.6rem + 3.4vw,4.4rem);max-width:16ch;margin-inline:auto}
.cierre p{color:rgba(248,245,239,.82);max-width:48ch;margin-inline:auto}

/* --------------------------------------------------------------------------
   21 · FOOTER
   -------------------------------------------------------------------------- */
.site-footer{background:var(--bosque-hondo);color:rgba(248,245,239,.78);padding-block:clamp(3rem,6vw,5rem) 1.6rem}
.footer__grid{display:grid;gap:clamp(2rem,4vw,3rem)}
.footer__brand{display:grid;gap:1rem;max-width:38ch}
.footer__brand .brand__name,.footer__brand .brand__mark{color:var(--blanco)}
.footer__brand .brand__sub{color:var(--salvia)}
.footer__brand p{font-size:.88rem;line-height:1.7;color:rgba(248,245,239,.7)}
.footer__col{display:grid;gap:.85rem;align-content:start}
.footer__t{font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--salvia)}
.footer__list{display:grid;gap:.55rem}
.footer__list a,.footer__list span{font-size:.88rem;color:rgba(248,245,239,.78);transition:color .3s var(--ease)}
.footer__list a:hover{color:var(--blanco)}
.footer__bottom{
  margin-top:clamp(2.25rem,4vw,3.4rem);padding-top:1.35rem;
  border-block-start:var(--hair) solid rgba(248,245,239,.14);
  display:grid;gap:.75rem;font-size:.75rem;color:rgba(248,245,239,.55);
}
.footer__legal{display:flex;flex-wrap:wrap;gap:.5rem .9rem;align-items:center}
.footer__legal a{color:rgba(248,245,239,.7);border-block-end:var(--hair) solid rgba(248,245,239,.25)}
.footer__legal a:hover{color:var(--blanco)}

/* --------------------------------------------------------------------------
   22 · BOTÓN FLOTANTE WHATSAPP
   -------------------------------------------------------------------------- */
.wa-fab{
  position:fixed;z-index:150;
  inset-block-end:calc(1.1rem + env(safe-area-inset-bottom,0px));
  inset-inline-end:1.1rem;
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.78rem 1rem .78rem .85rem;min-inline-size:56px;min-block-size:56px;
  background:var(--verde-bosque);color:var(--blanco);
  border:0;border-radius:999px;box-shadow:0 12px 34px rgba(28,46,38,.32);
  cursor:pointer;text-decoration:none;
  transform:translateY(140%) scale(.9);opacity:0;
  transition:transform .6s var(--ease-out),opacity .45s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease);
}
.wa-fab.is-on{transform:none;opacity:1}
.wa-fab.is-off{transform:translateY(140%);opacity:0;pointer-events:none}
.wa-fab:hover{background:#1F3429;box-shadow:0 16px 40px rgba(28,46,38,.4)}
.wa-fab__ico{inline-size:24px;block-size:24px;flex:0 0 auto}
.wa-fab__label{
  display:none;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;
}
.wa-fab__pulse{
  position:absolute;inset:0;border-radius:999px;border:var(--hair) solid rgba(38,63,52,.5);
  animation:pulse 3.4s var(--ease) infinite;pointer-events:none;
}
@keyframes pulse{0%{transform:scale(1);opacity:.55}70%{transform:scale(1.22);opacity:0}100%{transform:scale(1.22);opacity:0}}

/* --------------------------------------------------------------------------
   23 · PRIVACIDAD
   -------------------------------------------------------------------------- */
.page-head{
  padding-top:calc(var(--header-alto) + clamp(2.5rem,6vw,4.5rem));
  padding-bottom:clamp(2rem,4vw,3.2rem);
  background:linear-gradient(180deg,var(--crema),var(--marfil));
  border-block-end:var(--hair) solid var(--borde);
}
.page-head h1{font-size:clamp(2.2rem,1.6rem + 2.6vw,3.9rem);max-width:20ch}
.page-head p{margin-top:1rem;color:var(--texto-2);max-width:56ch}
.prose{padding-block:clamp(2.5rem,5vw,4.5rem)}
.prose__inner{display:grid;gap:clamp(1.75rem,3vw,2.6rem);max-width:74ch}
.prose__block{display:grid;gap:.85rem}
.prose__block h2{font-size:clamp(1.45rem,1.2rem + 1vw,2.05rem);scroll-margin-top:90px}
.prose__block h3{font-size:1.12rem;color:var(--verde-bosque)}
.prose__block p,.prose__block li{font-size:.95rem;color:var(--texto-2);line-height:1.78}
.prose__block ul{display:grid;gap:.5rem;padding-inline-start:0}
.prose__block li{display:grid;grid-template-columns:auto 1fr;gap:.65rem}
.prose__block li::before{content:"";inline-size:5px;block-size:5px;background:var(--laton);transform:rotate(45deg);margin-top:.62rem}
.prose__block strong{color:var(--texto);font-weight:700}
.todo{
  display:grid;gap:.5rem;padding:1.1rem 1.25rem;
  background:rgba(232,213,206,.5);border-inline-start:3px solid var(--terracota);border-radius:var(--r);
}
.todo b{font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#8E4E39}
.todo p,.todo li{font-size:.88rem;color:#5E4640}
.index-list{display:grid;gap:.5rem;padding:1.35rem;background:var(--blanco);border:var(--hair) solid var(--borde);border-radius:var(--r-lg)}
.index-list__t{font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--musgo)}
.index-list a{font-size:.88rem;color:var(--verde-bosque);display:flex;gap:.55rem;align-items:baseline}
.index-list a span{font-family:var(--serif);font-size:.85rem;color:var(--laton)}
.back-home{display:inline-flex;align-items:center;gap:.55rem;margin-top:.5rem}

/* --------------------------------------------------------------------------
   24 · RESPONSIVE
   -------------------------------------------------------------------------- */
@media (min-width:520px){
  .galeria__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form__actions{grid-template-columns:1fr auto;align-items:center}
  .form__actions .btn{justify-self:end}
}

@media (min-width:768px){
  :root{--header-alto:78px}
  .hero__title{max-width:16ch}
  .hero__scroll{display:flex}
  .servicios__pics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer__bottom{grid-auto-flow:column;justify-content:space-between;align-items:center}
  .lb__stage{padding-block:clamp(3.5rem,9vh,5.5rem)}
  .faq__grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
  .contacto__grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
  .taller-pics{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .taller:nth-child(even){margin-top:clamp(1.5rem,4vw,3.5rem)}
  .galeria__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .g-item--ancho{grid-column:span 2}
  .g-item--alto .media{aspect-ratio:3/4}
  .wa-fab__label{display:inline}
  .page-head h1{max-width:24ch}
}

@media (min-width:1020px){
  .nav-toggle{display:none}
  .nav{display:block}
  .nav-panel,.nav-backdrop{display:none}
  .header__cta{display:inline-flex}
  .header__inner{block-size:var(--header-alto)}
}

@media (min-width:1200px){
  .hero__grid{grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(3rem,5vw,5.5rem)}
  .hero__title br{display:inline}
  .hero__title{max-width:none}
  .hero__media{padding-block:clamp(1rem,3vw,2.5rem)}
  .explora__grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.75rem,2.8vw,3.2rem);align-items:start}
  .cat--lg{grid-column:span 7;border:0;padding:0;gap:1.6rem}
  .cat--lg .media{aspect-ratio:4/3}
  .cat-list{grid-column:span 5;gap:clamp(1.75rem,2.6vw,2.6rem)}
  .cat--sm{grid-template-columns:minmax(0,1fr);border-block-end:var(--hair) solid var(--borde);padding-block-end:1.6rem}
  .cat--sm:last-child{border:0;padding-block-end:0}
  .luna__grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
  .catalogo__grid{grid-template-columns:repeat(12,minmax(0,1fr))}
  .prod--a{grid-column:span 7}
  .prod--b{grid-column:span 5}
  .prod--c{grid-column:span 5}
  .prod--d{grid-column:span 7}
  .prod--a .media{aspect-ratio:16/11}
  .prod--d .media{aspect-ratio:16/11}
  .prod--b .media,.prod--c .media{aspect-ratio:4/5}
  .aroma__grid{grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr)}
  .servicios__grid{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(2.5rem,4.5vw,5rem)}
  .servicios__aside{position:sticky;top:calc(var(--header-alto) + 2rem)}
  .talleres__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
  .nosotros__grid{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}
  .footer__grid{grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr))}
  .galeria__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,1.6vw,1.6rem)}
  .prose__inner{grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:clamp(2rem,4vw,4rem);max-width:none}
  .prose__inner>.prose__blocks{display:grid;gap:clamp(1.75rem,3vw,2.6rem)}
}

/* Anchos críticos: evitar desbordes */
@media (max-width:360px){
  :root{--gutter:1.05rem;--fs-h1:2.55rem}
  .btn{padding:.95rem 1.15rem;letter-spacing:.11em}
  .ingr__list{grid-template-columns:1fr}
  .hero__badge{position:relative;inset:auto;margin-top:1rem;max-inline-size:100%}
}

/* --------------------------------------------------------------------------
   25 · MOVIMIENTO REDUCIDO
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
  [data-reveal]{opacity:1!important;transform:none!important}
  .wa-fab{transform:none;opacity:1}
  .media img{transition:none}
  .hero__scroll::after{animation:none}
  .wa-fab__pulse{display:none}
}

/* Impresión básica */
@media print{
  .site-header,.wa-fab,.nav-panel,.nav-backdrop,.lb,.filtros{display:none!important}
  body{background:#fff;color:#000}
  .section{padding-block:1.5rem}
  a::after{content:" (" attr(href) ")";font-size:.8em}
}