:root{
  --blanco:#FFFFFF; --tinta:#1A1614; --gris:#4A423D;
  --oro:#C9962E; --oro-claro:#D9AE52; --crema:#F6F1E9;
  /* peach pastel del menu (en RGB para poder graduar la transparencia del cristal) */
  --peach-rgb:239,197,190;
  /* peach del boton de llamada a la accion: mas profundo que el del menu */
  --peach-cta:#E4AE9B; --peach-cta-hover:#D9997F;
}
/* Sin reseteo propio: el de Tailwind (preflight) ya pone margin y padding a cero y
   border-box. El suyo iba FUERA de capa y por eso ganaba a todas las utilidades de
   Tailwind (px-4, mt-6...), que viven en @layer: dejaba sin márgenes la reserva, la
   tarifa y cualquier pantalla hecha con clases. El fondo y la letra del body los pone
   el layout. */

/* Masked Text Reveal (GSAP SplitText): ocultar hasta tener el split listo (anti-FOUC) */
.js-ready .txt-reveal{visibility:hidden}
.js-ready .txt-reveal.is-ready{visibility:visible}
.txt-line{overflow:hidden}

/* ---------- barra nav ---------- */
.nav{position:sticky;top:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;
     padding:1.4rem clamp(2rem,4vw,4rem);border-bottom:1px solid rgba(20,20,20,.07);
     background-color:rgba(var(--peach-rgb),.92);
     -webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
     transition:background-color .45s ease, box-shadow .45s ease}
/* estado al hacer scroll: cristal peach esmerilado */
.nav.is-scrolled{background-color:rgba(var(--peach-rgb),.68);box-shadow:0 8px 30px rgba(20,20,20,.04)}
.logo{display:flex;flex-direction:column;line-height:1;text-decoration:none;
      transition:opacity .3s ease}
.logo:hover{opacity:.72}
.logo .lg-name{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.7rem;letter-spacing:.26em;
               text-transform:uppercase;color:var(--tinta);margin-inline-end:-.26em}
.logo .lg-sub{display:flex;justify-content:space-between;align-items:center;
              font-weight:400;font-size:.62rem;text-transform:uppercase;color:var(--oro);margin-top:.5rem}
.logo .lg-sub i{font-style:normal;line-height:1}
.logo .lg-sub .sp{flex:0 0 .4em}
.nav-links{display:flex;align-items:center;gap:clamp(1.1rem, 1.4vw, 1.8rem)}
.nav-links a{color:var(--tinta);text-decoration:none;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:400}
.nav-links a:hover{color:var(--oro)}
.nav-links a.pill{position:relative;border:1px solid transparent;border-radius:9999px;padding:.7rem 1.5rem;
                  background:var(--peach-cta);color:var(--tinta);transition:background .4s cubic-bezier(.16,1,.3,1)}
.nav-links a.pill:hover{background:var(--peach-cta-hover);color:var(--tinta)}
/* destello que recorre la línea (borde) del botón */
.nav-links a.pill::after{content:"";position:absolute;inset:-1px;border-radius:9999px;padding:1px;pointer-events:none;
  background:linear-gradient(100deg,transparent 38%,rgba(255,250,230,.95) 50%,transparent 62%);background-size:250% 100%;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  animation:pill-sheen 3.2s ease-in-out infinite}
@keyframes pill-sheen{0%{background-position:120% 0}55%{background-position:-25% 0}100%{background-position:-25% 0}}
@media(prefers-reduced-motion:reduce){.nav-links a.pill::after{animation:none;opacity:0}}

/* desplegable "The Salon" */
.salon-menu{position:relative}
.salon-menu summary{list-style:none;outline:none;cursor:pointer;display:flex;align-items:center;gap:.35rem}
.salon-menu summary::-webkit-details-marker{display:none}
.salon-btn{color:var(--tinta);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:400;
           transition:color .25s}
.salon-menu:hover .salon-btn,.salon-menu[open] .salon-btn{color:var(--oro)}
.salon-chev{width:10px;height:10px;opacity:.45;transition:transform .25s;flex:0 0 auto}
.salon-menu[open] .salon-chev{transform:rotate(180deg)}
.salon-list{position:absolute;top:calc(100% + .75rem);left:50%;transform:translateX(-50%);z-index:1100;
  list-style:none;margin:0;padding:.4rem;min-width:210px;
  background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border:1px solid rgba(20,20,20,.08);border-radius:12px;box-shadow:0 20px 44px -20px rgba(20,20,20,.22)}
/* puente invisible: evita que el menu se cierre al cruzar el hueco con el raton */
.salon-list::before{content:"";position:absolute;left:0;right:0;top:-.75rem;height:.75rem}
.salon-list li{list-style:none}
.salon-list a{display:block;padding:.62rem .8rem;border-radius:8px;text-decoration:none;
  color:var(--tinta);font-family:'Jost',sans-serif;font-size:.9rem;font-weight:300;letter-spacing:.02em;
  text-transform:none;white-space:nowrap;transition:background .2s,color .2s}
.salon-list a:hover{background:rgba(228,174,155,.22);color:var(--oro)}

/* selector de idioma minimalista */
/* rótulo «Idioma» del panel móvil: texto real y traducido, no un `content:` fijo en CSS */
.lang-label{display:none}
.lang{position:relative}
.lang summary{list-style:none;outline:none}
.lang summary::-webkit-details-marker{display:none}
.lang-btn{display:flex;align-items:center;gap:.35rem;cursor:pointer;padding:.4rem .5rem;border-radius:9999px;transition:background .25s}
.lang-btn:hover{background:rgba(20,20,20,.045)}

/* carrito en el nav */
.nav-cart{position:relative;display:inline-flex;align-items:center;justify-content:center;
          color:var(--tinta);padding:.35rem;border-radius:9999px;text-decoration:none;
          transition:color .25s,background .25s}
.nav-cart:hover{color:var(--oro);background:rgba(20,20,20,.045)}
.nav-cart svg{width:22px;height:22px;display:block}
.nav-cart__badge{position:absolute;top:-3px;inset-inline-end:-4px;min-width:17px;height:17px;padding:0 4px;
                 display:flex;align-items:center;justify-content:center;
                 background:var(--peach-cta);color:var(--tinta);
                 font-family:'Jost',sans-serif;font-size:.6rem;font-weight:600;line-height:1;
                 letter-spacing:0;border-radius:9999px}
.lang-flag{width:20px;height:14px;border-radius:3px;overflow:hidden;display:block;flex:0 0 auto;
  box-shadow:0 0 0 1px rgba(20,20,20,.1)}
.lang-flag svg{width:100%;height:100%;display:block}
.lang-chev{width:10px;height:10px;color:var(--tinta);opacity:.45;transition:transform .25s}
.lang[open] .lang-chev{transform:rotate(180deg)}
.lang-menu{position:absolute;top:calc(100% + .55rem);inset-inline-end:0;z-index:1100;list-style:none;margin:0;padding:.35rem;min-width:160px;
  background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border:1px solid rgba(20,20,20,.08);border-radius:12px;box-shadow:0 20px 44px -20px rgba(20,20,20,.22)}
/* puente invisible que conecta el botón con el menú (evita el cierre en el hueco) */
.lang-menu::before{content:"";position:absolute;left:0;right:0;top:-.75rem;height:.75rem}
.lang-menu li{list-style:none}
.lang-menu a{display:flex;align-items:center;gap:.6rem;padding:.5rem .62rem;border-radius:8px;text-decoration:none;
  color:var(--tinta);font-family:'Jost',sans-serif;font-size:.76rem;font-weight:400;letter-spacing:.02em;
  text-transform:none;transition:background .2s,color .2s}
.lang-menu a:hover{background:rgba(201,150,46,.1);color:var(--oro)}
.lang-menu a.is-active{color:var(--oro)}

/* ---------- menú móvil / tablet (hamburguesa) ----------
   Por debajo de 1240px los enlaces no caben en una fila: se recogen en un
   panel que baja bajo la barra. En la barra quedan logo, carrito y botón. */
.nav-movil{display:none}
.nav-burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;
            padding:0 11px;border:0;border-radius:9999px;background:transparent;color:var(--tinta);cursor:pointer;
            transition:background .25s}
.nav-burger:hover{background:rgba(20,20,20,.045)}
.nav-burger span{display:block;height:1.5px;border-radius:2px;background:currentColor;
                 transition:transform .3s cubic-bezier(.16,1,.3,1),opacity .2s}
.nav.is-open .nav-burger span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav.is-open .nav-burger span:nth-child(2){opacity:0}
.nav.is-open .nav-burger span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

@media(max-width:1240px){
  .nav{padding:1rem clamp(1.1rem,4vw,2rem)}
  .nav.is-open{background-color:rgba(var(--peach-rgb),.97)}
  .nav-movil{display:flex;align-items:center;gap:.35rem}

  .nav-links{position:absolute;top:100%;left:0;right:0;z-index:999;
             flex-direction:column;align-items:stretch;gap:0;
             padding:.4rem clamp(1.1rem,4vw,2rem) 1.6rem;
             max-height:calc(100svh - 76px);overflow-y:auto;overscroll-behavior:contain;
             background:var(--blanco);border-bottom:1px solid rgba(20,20,20,.08);
             box-shadow:0 24px 40px -24px rgba(20,20,20,.25);
             visibility:hidden;opacity:0;transform:translateY(-6px);
             transition:opacity .3s ease,transform .3s cubic-bezier(.16,1,.3,1),visibility 0s linear .3s}
  .nav.is-open .nav-links{visibility:visible;opacity:1;transform:none;transition-delay:0s}

  /* cada entrada ocupa una fila, con separador fino */
  .nav-links > a.links,
  .nav-links .salon-btn,
  .nav-links .lang-btn{display:flex;align-items:center;justify-content:space-between;
                       padding:1.05rem 0;font-size:.8rem;border-bottom:1px solid rgba(20,20,20,.07);border-radius:0}
  .nav-links .lang-btn:hover{background:transparent}

  /* "The Salon" e idioma: se despliegan dentro del panel, no flotando */
  .salon-list,.lang-menu{position:static;transform:none;min-width:0;margin:0;padding-block:.3rem .6rem;padding-inline:.9rem 0;
                         background:transparent;border:0;box-shadow:none;
                         -webkit-backdrop-filter:none;backdrop-filter:none}
  .salon-list::before,.lang-menu::before{display:none}
  .salon-list a{font-size:.95rem;padding:.7rem .6rem}
  .lang-menu a{font-size:.9rem;padding:.6rem}
  .lang-label{display:inline;order:-1;font-size:.8rem;letter-spacing:.22em;text-transform:uppercase}
  .lang-btn{gap:.6rem;justify-content:flex-start}
  .lang-btn .lang-flag{margin-inline-start:auto}

  /* el carrito ya está en la barra */
  .nav-links .nav-cart{display:none}
  .nav-links a.pill{margin-top:1.4rem;text-align:center;padding:1rem 1.5rem}
}
@media(max-width:520px){
  .logo .lg-name{font-size:1.4rem}
  .logo .lg-sub{font-size:.54rem;margin-top:.4rem}
}

/* ---------- header principal ---------- */
/* 11/09/2026: las tres secciones de pantalla completa de la portada (esta, la galería .ad
   y .dare) se miden también por el ancho, con min(…, 62.5vw). En una pantalla horizontal no
   cambia nada (1280×800, 1440×900 o 1920×1200 dan lo mismo que antes); en una vertical (monitor
   girado, tablet de pie) el contenido quedaba centrado en un bloque vacío de casi dos
   pantallas. Las excepciones de móvil que van detrás siguen mandando. */
.header{display:grid;grid-template-columns:1fr clamp(400px,44vw,600px);align-items:center;gap:clamp(1.5rem,3vw,3rem);
        min-height:min(calc(100svh - 72px),62.5vw);padding:clamp(1rem,2vw,2rem) clamp(2rem,4vw,4rem)}

/* izquierda: bloque hero centrado */
.hero-block{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}

.welcome{display:flex;align-items:center;justify-content:center;gap:1.2rem;color:var(--oro);
         font-size:.8rem;font-weight:400;letter-spacing:.42em;text-transform:uppercase;margin-bottom:clamp(1.4rem,3vh,2.2rem)}
.welcome .ln{width:clamp(40px,5vw,72px);height:1px;background:var(--oro);opacity:.75}

.title{font-family:'Cormorant Garamond',serif;font-weight:600;line-height:.95;letter-spacing:.02em;
       text-transform:uppercase;white-space:nowrap;font-size:clamp(2.4rem,6vw,6.5rem);color:var(--tinta);
       background:linear-gradient(105deg,
         var(--tinta) 0 34%, #C9962E 41%, #F2DA94 46%, #FFFAF0 50%, #F2DA94 54%, #C9962E 59%, var(--tinta) 66% 100%);
       background-size:320% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
       animation:title-shine 6.5s ease-in-out infinite}
@keyframes title-shine{0%{background-position:125% 0}48%{background-position:-25% 0}100%{background-position:-25% 0}}
@media(prefers-reduced-motion:reduce){.title{animation:none;-webkit-text-fill-color:var(--tinta)}}

.salon{display:flex;align-items:center;justify-content:center;gap:1.3rem;margin-top:.5rem;
       font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--oro);
       letter-spacing:.5em;text-transform:uppercase;font-size:clamp(1.4rem, .9rem + 1.4vw, 2.2rem)}
.salon svg{flex:0 0 auto;display:block}

.subtitle{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;color:#3A322C;
          font-size:clamp(1.15rem, 1rem + 0.4vw, 1.4rem);margin-top:clamp(1.4rem,3vh,2.1rem)}

.learn{display:inline-flex;align-items:center;margin-top:clamp(2rem,4.5vh,3rem);
       border:1px solid transparent;border-radius:9999px;padding:1.15rem 2.8rem;text-decoration:none;
       background:var(--peach-cta);color:var(--tinta);font-size:.74rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
       transition:.4s cubic-bezier(.16,1,.3,1)}
.learn:hover{background:var(--peach-cta-hover);color:var(--tinta)}

/* derecha: vídeo SIN contenedor visible — se funde con el fondo */
/* Centrado y bajado 5.1rem: asi el borde superior de las modelas queda a la
   altura del titulo "Anny's Beauty". El margen negativo compensa al positivo,
   de modo que el desplazamiento no altera la altura de la fila. */
.video-wrap{position:relative;width:100%;aspect-ratio:1280/664;
            align-self:center;margin-top:.65rem;margin-bottom:-.65rem}
.video-wrap video{width:100%;height:100%;object-fit:contain;object-position:center center;display:block;
                  transform:scale(1.09);transform-origin:center center;
                  /* banda fina (12px) que solo disimula la linea donde acaba el video */
                  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 12px),transparent 100%);
                  mask-image:linear-gradient(to bottom,#000 calc(100% - 12px),transparent 100%);
                  mix-blend-mode:multiply;filter:brightness(1.08) contrast(1.05)}

@media(max-width:900px){
  .header{grid-template-columns:1fr;min-height:auto;gap:2rem;padding-top:2.5rem;padding-bottom:3rem}
  .title{white-space:normal}
  /* en una sola columna el desplazamiento no aplica: el video va sobre el texto */
  .video-wrap{aspect-ratio:1280/664;order:-1;align-self:auto;margin-top:0;margin-bottom:0}
}

/* ====================== BOTON PEACH REUTILIZABLE ======================
   Mismo aspecto que los botones de la home, para paginas que no cargan
   sus propias hojas.  */
.btn-peach{display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;
           background:var(--peach-cta);color:var(--tinta);text-decoration:none;
           font-family:'Jost',sans-serif;font-size:.74rem;font-weight:500;
           letter-spacing:.18em;text-transform:uppercase;padding:1.05rem 2.2rem;
           transition:.4s cubic-bezier(.16,1,.3,1)}
.btn-peach:hover{background:var(--peach-cta-hover);transform:translateY(-2px)}
/* variante pequena */
.btn-peach--sm{font-size:.66rem;letter-spacing:.16em;padding:.72rem 1.5rem}

/* ====================== CABECERA DE VIDEO (paginas de servicio) ====================== */
.hero-video{background:var(--blanco)}
/* La franja va en el mismo negro que el fondo del video (#0A0A0A), de modo que
   el video se muestra entero y mas pequeno (object-fit:contain, sin estirar ni
   perder nitidez) y el negro sobrante parece parte de la misma toma. */
.hero-video__marco{position:relative;width:100%;aspect-ratio:16/9;max-height:74vh;
                   overflow:hidden;background:#0A0A0A}
.hero-video__marco video{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
                         width:min(100%,1180px);height:auto;max-height:100%;
                         object-fit:contain;display:block}
/* botones superpuestos sobre la parte inferior del video */
.hero-video__acciones{position:absolute;left:0;right:0;bottom:clamp(1.2rem,3.5vh,2.4rem);z-index:3;
                      display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;padding:0 1rem}
@media(max-width:520px){
  .hero-video__acciones{bottom:1rem;gap:.5rem}
  .hero-video__acciones .btn-peach{padding:.62rem 1.1rem;font-size:.6rem}
}

/* ====================== MARQUESINA (cinta infinita) ====================== */
.marquesina{background:rgb(var(--peach-rgb));overflow:hidden;padding:1.05rem 0;
            display:flex;user-select:none}
.mq-track{display:flex;flex:none;animation:mq-scroll 38s linear infinite}
.mq-group{display:flex;align-items:center;flex:none}
.mq-item{color:#000;font-size:.78rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;
         white-space:nowrap;padding:0 clamp(1.2rem,2.2vw,2.4rem)}
.mq-sep{color:var(--oro);font-style:normal;font-size:.5rem;line-height:1}
/* recorre exactamente un grupo (1 de 4 = 25%): al terminar, el siguiente
   queda donde estaba el anterior y el salto es invisible */
@keyframes mq-scroll{from{transform:translateX(0)}to{transform:translateX(-25%)}}
.marquesina:hover .mq-track{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.mq-track{animation:none}}

/* ====================== SEGUNDA PANTALLA — SERVICIOS ====================== */
/* stage de la transición parallax (cortina): galería sticky detrás, dare por encima */
.ad-stage{position:relative}
.ad__inner{width:100%;will-change:transform;transform-origin:center center}
.servicios{background:var(--blanco);padding:clamp(3.5rem,7vw,7rem) 0 0}
.serv-head{max-width:780px;margin:clamp(1.3rem,3vh,2.3rem) auto 0;text-align:center;padding:0 clamp(1.5rem,4vw,3rem)}
.serv-title{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--tinta);
            font-size:clamp(2.4rem, 0.9rem + 4.8vw, 6rem);line-height:1.05;letter-spacing:.005em;
            text-align:center;max-width:1600px;margin:0 auto;padding:0 clamp(1.5rem,3vw,3.5rem)}
/* entrada dinámica al hacer scroll (IntersectionObserver) */
.js .servicios .reveal{opacity:0;transform:translateY(34px);
      transition:opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1)}
.servicios.in-view .reveal{opacity:1;transform:none}
/* título: animación dinámica letra a letra */
.serv-title .word{display:inline-block}
.js .serv-title .char{display:inline-block;opacity:0;transform:translateY(.6em) rotate(3deg);
      transition:opacity .55s ease, transform .7s cubic-bezier(.34,1.56,.5,1)}
.servicios.in-view .serv-title .char{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .serv-title .char{opacity:1;transform:none;transition:none}}
/* títulos de tarjetas (h3): misma animación letra a letra */
.serv-card h3 .word{display:inline-block}
.js .serv-card h3 .char{display:inline-block;opacity:0;transform:translateY(.6em) rotate(3deg);
      transition:opacity .55s ease, transform .7s cubic-bezier(.34,1.56,.5,1)}
.servicios.in-view .serv-card h3 .char{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .serv-card h3 .char{opacity:1;transform:none;transition:none}}
.servicios .serv-sub{transition-delay:.12s}
.servicios .serv-divider{transition-delay:.22s}
.servicios .serv-card:nth-child(1){transition-delay:.30s}
.servicios .serv-card:nth-child(2){transition-delay:.40s}
.servicios .serv-card:nth-child(3){transition-delay:.50s}
.servicios .serv-card:nth-child(4){transition-delay:.60s}
@media(prefers-reduced-motion:reduce){.js .servicios .reveal{opacity:1;transform:none;transition:none}}
.serv-sub{color:var(--gris);font-size:clamp(1.4rem, 1rem + 1.2vw, 2.1rem);font-weight:400;line-height:1.4;margin-top:1.1rem}
.serv-divider{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:clamp(1.8rem,4vh,2.6rem)}
.serv-divider span{width:clamp(40px,6vw,90px);height:1px;background:var(--oro);opacity:.8}
.serv-divider i{color:var(--oro);font-style:normal;font-size:.75rem}

.serv-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(2.5rem,5vw,4rem)}
.serv-card{display:flex;flex-direction:column}
.serv-img{position:relative;aspect-ratio:3/4;overflow:hidden}
.serv-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.serv-card:hover .serv-img img{transform:scale(1.05)}
.serv-img::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,17,13,.62) 0%,rgba(20,17,13,0) 42%)}
.serv-img .discover{position:absolute;left:0;bottom:1.5rem;width:100%;text-align:center;z-index:2;
                    color:#fff;font-size:.76rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase}
.serv-card h3{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--tinta);
              font-size:clamp(1.4rem, 1.1rem + .9vw, 1.95rem);text-align:center;margin-top:1.8rem;padding:0 1rem}
.serv-card .dia{color:var(--oro);font-size:.65rem;text-align:center;margin:.7rem 0}
.serv-card p{color:var(--gris);font-weight:300;line-height:1.7;text-align:center;font-size:1rem;
             padding:0 clamp(1rem,1.6vw,1.9rem) clamp(3rem,5vw,4.5rem)}

@media(max-width:1000px){.serv-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.serv-grid{grid-template-columns:1fr}}

/* ===== reveal generalizado (todas las secciones) ===== */
.js [data-reveal] .reveal{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1)}
[data-reveal].in-view .reveal{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js [data-reveal] .reveal{opacity:1;transform:none;transition:none}}

/* ===== WHY CHOOSE US ===== */
.pq-why{background:var(--crema);padding:clamp(4rem, 8vw, 7rem) 0}
.pq-why__inner{max-width:1240px;margin:0 auto;padding:0 clamp(1.5rem, 4vw, 4rem)}

/* Header */
.pq-why__head{text-align:center;margin-bottom:clamp(2.6rem, 4.5vw, 4rem)}
.pq-why__eyebrow{display:flex;align-items:center;justify-content:center;gap:1.1rem;
  font-family:'Jost',sans-serif;font-weight:500;font-size:.78rem;letter-spacing:.3em;
  text-transform:uppercase;color:var(--oro);margin:0 0 1.1rem}
.pq-why__eyebrow-ln{width:clamp(34px, 5vw, 66px);height:1px;background:var(--oro);opacity:.7}
.pq-why__title{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--tinta);
  line-height:1.1;letter-spacing:.01em;margin:0;
  font-size:clamp(2.1rem, 1.2rem + 2.6vw, 3.6rem)}
.pq-why__divider{display:flex;align-items:center;justify-content:center;gap:.95rem;margin-top:1.4rem}
.pq-why__divider-ln{width:clamp(38px, 6vw, 86px);height:1px;background:var(--oro);opacity:.8}
.pq-why__divider-mark{color:var(--oro);font-style:normal;font-size:.72rem;line-height:1}

/* Grid */
.pq-why__grid{display:grid;grid-template-columns:repeat(3, 1fr);
  gap:clamp(1.4rem, 2.4vw, 2.2rem)}

/* Card */
.pq-why__card{background:var(--blanco);border:1px solid rgba(201,150,46,.14);
  border-radius:20px;padding:clamp(2.2rem, 3vw, 3rem) clamp(1.7rem, 2.4vw, 2.4rem);
  text-align:center;
  box-shadow:0 1px 2px rgba(26,22,20,.03), 0 18px 40px -28px rgba(26,22,20,.18);
  transition:transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s cubic-bezier(.16,1,.3,1), border-color .5s cubic-bezier(.16,1,.3,1)}
.pq-why__card:hover{transform:translateY(-6px);
  border-color:rgba(201,150,46,.32);
  box-shadow:0 1px 2px rgba(26,22,20,.04), 0 30px 56px -30px rgba(26,22,20,.26)}

/* Icon */
.pq-why__icon{display:inline-flex;align-items:center;justify-content:center;
  width:clamp(64px, 7vw, 76px);height:clamp(64px, 7vw, 76px);
  border-radius:9999px;color:var(--oro);
  background:radial-gradient(circle at 50% 42%, rgba(217,174,82,.16), rgba(201,150,46,.05));
  border:1px solid rgba(201,150,46,.2);
  margin-bottom:1.6rem;
  transition:background .5s cubic-bezier(.16,1,.3,1), border-color .5s cubic-bezier(.16,1,.3,1)}
.pq-why__icon svg{width:clamp(28px, 3vw, 33px);height:clamp(28px, 3vw, 33px);display:block}
.pq-why__card:hover .pq-why__icon{
  background:radial-gradient(circle at 50% 42%, rgba(217,174,82,.26), rgba(201,150,46,.1));
  border-color:rgba(201,150,46,.4)}

/* Card text */
.pq-why__card-title{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--tinta);
  font-size:1.6rem;line-height:1.2;letter-spacing:.005em;margin:0 0 .85rem}
.pq-why__card-text{font-family:'Jost',sans-serif;font-weight:300;color:var(--gris);
  font-size:.98rem;line-height:1.7;margin:0;max-width:30ch;margin-left:auto;margin-right:auto}

/* Responsive */
@media(max-width:900px){
  .pq-why__grid{grid-template-columns:1fr;max-width:430px;margin:0 auto;
    gap:clamp(1.3rem, 4vw, 1.8rem)}
}

/* ====================== GALERÍA ANTES / DESPUÉS ====================== */
.ad{background:#0c0a09;padding:clamp(4rem,8vw,7rem) 0;overflow:hidden;
  position:sticky;top:0;z-index:1;min-height:min(100vh,62.5vw);
  display:flex;flex-direction:column;justify-content:center}
@media(max-width:760px){.ad{position:static;min-height:0;display:block}}
.ad__head{text-align:center;max-width:1000px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem)}
.ad__title{font-family:'Cormorant Garamond',serif;font-weight:600;color:#fff;
  font-size:clamp(2.2rem,1.2rem + 3vw,4rem);line-height:1.12;margin:0}
/* título: entrada animada letra a letra */
.ad__title .word{display:inline-block}
.js .ad__title .char{display:inline-block;opacity:0;transform:translateY(.6em) rotate(3deg);
  transition:opacity .55s ease, transform .7s cubic-bezier(.34,1.56,.5,1)}
.ad.in-view .ad__title .char{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .ad__title .char{opacity:1;transform:none;transition:none}}
.ad__divider{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:clamp(1.4rem,3vh,2rem)}
.ad__divider span{width:clamp(40px,6vw,90px);height:1px;background:var(--oro);opacity:.85}
.ad__divider i{color:var(--oro);font-style:normal;font-size:.7rem}

/* carrusel = cinta infinita en movimiento continuo */
.ad__carousel{position:relative;margin-top:clamp(2.5rem,5vw,4rem);overflow:hidden}
.ad__track{display:flex;gap:0;width:max-content;will-change:transform;
  animation:ad-marquee 90s linear infinite}
.ad__carousel:hover .ad__track{animation-play-state:paused}
@keyframes ad-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ad__slide{position:relative;flex:0 0 auto;height:clamp(300px,42vw,600px);aspect-ratio:1431/1005;
  overflow:hidden;margin:0;background:#000}
.ad__slide picture{display:block;width:100%;height:100%}
.ad__slide img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.1s cubic-bezier(.16,1,.3,1);user-select:none;-webkit-user-drag:none}
.ad__slide:hover img{transform:scale(1.06)}
.ad__tags{position:absolute;inset:auto 0 0 0;display:flex;justify-content:space-between;
  padding:.9rem 1rem;pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,0))}
.ad__tag{font-family:'Jost',sans-serif;font-weight:500;font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;
  color:#fff;background:rgba(0,0,0,.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  border:1px solid rgba(255,255,255,.35);border-radius:9999px;padding:.34rem .85rem}
@media(prefers-reduced-motion:reduce){
  .ad__carousel{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
  .ad__track{animation:none}
}

/* ====================== DARE TO CHANGE ====================== */
.dare{background:var(--blanco);padding:clamp(4rem, 8vw, 7rem) 0;
  position:relative;z-index:2;min-height:min(100vh,62.5vw);
  display:flex;flex-direction:column;justify-content:center}
@media(max-width:760px){.dare{min-height:0;display:block}}
.dare-inner{max-width:1240px;margin:0 auto;padding:0 clamp(1.5rem, 4vw, 4rem);
  display:grid;grid-template-columns:1fr 1.05fr;align-items:center;
  gap:clamp(2.5rem, 5vw, 5.5rem)}

/* ---- IZQUIERDA: imagen + badge ---- */
.dare-media{position:relative}
.dare-frame{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:4/5}
.dare-img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .8s cubic-bezier(.16,1,.3,1)}
.dare-frame:hover .dare-img{transform:scale(1.04)}

.dare-badge{position:absolute;inset-inline-end:clamp(-0.4rem, -0.2rem + 1vw, 1.4rem);bottom:clamp(1.2rem, 2.4vw, 2.2rem);
  display:flex;flex-direction:column;align-items:center;text-align:center;
  background:var(--tinta);color:#fff;border-radius:18px;
  padding:clamp(1.1rem, 2.2vw, 1.6rem) clamp(1.3rem, 2.6vw, 1.9rem);
  box-shadow:0 24px 50px -18px rgba(26,22,20,.45);
  border:1px solid rgba(201,150,46,.35)}
.dare-badge-num{font-family:'Cormorant Garamond',serif;font-weight:600;line-height:1;
  color:var(--oro-claro);font-size:clamp(2.6rem, 1.8rem + 2.4vw, 3.8rem);letter-spacing:.01em}
.dare-badge-line{width:34px;height:1px;background:var(--oro);opacity:.7;margin:.55rem 0 .5rem}
.dare-badge-label{font-family:'Jost',sans-serif;font-weight:400;font-size:.62rem;
  letter-spacing:.3em;text-transform:uppercase;color:#E8DFD2}

/* ---- DERECHA: texto ---- */
.dare-content{max-width:560px}
.dare-eyebrow{display:flex;align-items:center;gap:1rem;
  color:var(--oro);font-family:'Jost',sans-serif;font-weight:400;
  font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;margin-bottom:1.4rem}
.dare-ln{flex:0 0 auto;width:clamp(28px, 4vw, 52px);height:1px;background:var(--oro);opacity:.75}
.dare-ln:last-child{flex:1 1 auto}

.dare-title{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--tinta);
  font-size:clamp(2.1rem, 1.2rem + 2.6vw, 3.6rem);line-height:1.1;letter-spacing:.005em;
  margin-bottom:clamp(1.4rem, 3vw, 2.1rem)}

.dare-text{font-family:'Jost',sans-serif;color:var(--gris);font-weight:300;
  line-height:1.7;font-size:1.02rem;margin-bottom:1.2rem}

.dare-quote{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;
  color:var(--tinta);font-size:clamp(1.5rem, 1.1rem + 1.1vw, 2.05rem);line-height:1.3;
  margin:clamp(1.4rem, 3vw, 2rem) 0 clamp(1.9rem, 4vw, 2.6rem)}

.dare-btn{display:inline-block;background:var(--peach-cta);color:var(--tinta);text-decoration:none;
  border:1px solid transparent;border-radius:9999px;
  font-family:'Jost',sans-serif;font-size:.74rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;padding:1.05rem 2.4rem;
  transition:.4s cubic-bezier(.16,1,.3,1)}
.dare-btn:hover{background:var(--peach-cta-hover);
  box-shadow:0 16px 34px -14px rgba(217,153,127,.6);transform:translateY(-2px)}

/* ---- responsive: apila, imagen arriba ---- */
@media(max-width:900px){
  .dare-inner{grid-template-columns:1fr;gap:2.5rem}
  .dare-media{order:-1}
  .dare-content{max-width:none}
  .dare-frame{aspect-ratio:4/5;max-width:520px;margin:0 auto}
  .dare-badge{inset-inline-end:clamp(1rem, 4vw, 2.5rem)}
  .dare-eyebrow{justify-content:flex-start}
  .dare-ln:last-child{flex:0 0 auto}
}

/* ===== FEATURED PRODUCTS ===== */
.fp{background:var(--crema);padding:clamp(4rem,8vw,7rem) 0}
.fp__inner{max-width:1240px;margin:0 auto;padding:0 clamp(1.5rem,4vw,4rem)}
.fp__head{text-align:center;margin-bottom:clamp(2.4rem,4vw,3.5rem)}
.fp__eyebrow{display:flex;align-items:center;justify-content:center;gap:1.1rem;font-family:'Jost',sans-serif;font-weight:500;font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;color:var(--oro);margin:0 0 1.1rem}
.fp__ln{width:clamp(34px,5vw,66px);height:1px;background:var(--oro);opacity:.7}
.fp__title{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--tinta);font-size:clamp(2.1rem, 1.2rem + 2.6vw, 3.6rem);line-height:1.1;margin:0}
.fp__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.2rem,2vw,1.8rem)}
.fp__card{display:block;text-decoration:none;background:var(--blanco);border-radius:18px;overflow:hidden;border:1px solid rgba(201,150,46,.12);transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s cubic-bezier(.16,1,.3,1)}
.fp__card:hover{transform:translateY(-6px);box-shadow:0 30px 56px -30px rgba(26,22,20,.26)}
.fp__img{aspect-ratio:1/1;overflow:hidden;background:var(--crema)}
.fp__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.fp__card:hover .fp__img img{transform:scale(1.05)}
.fp__name{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--tinta);font-size:1.15rem;line-height:1.25;margin:1rem 1rem .3rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fp__price{color:var(--oro);font-weight:500;font-size:1rem;margin:0 1rem 1.3rem}
.fp__cta{text-align:center;margin-top:clamp(2.5rem,4vw,3.5rem)}
.fp__btn{display:inline-flex;align-items:center;border-radius:9999px;background:var(--peach-cta);color:var(--tinta);font-family:'Jost',sans-serif;font-weight:500;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;padding:1.05rem 2.6rem;text-decoration:none;transition:.4s cubic-bezier(.16,1,.3,1)}
.fp__btn:hover{background:var(--peach-cta-hover)}
@media(max-width:900px){.fp__grid{grid-template-columns:repeat(2,1fr)}}

/* ===== REVIEWS ===== */
.rv-section{position:relative;background:var(--tinta);overflow:hidden;
  padding:clamp(3.5rem, 6vw, 5.5rem) 0}
.rv-section::before,.rv-section::after{content:"";position:absolute;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(201,150,46,.45) 22%,rgba(201,150,46,.45) 78%,transparent);pointer-events:none}
.rv-section::before{top:0}
.rv-section::after{bottom:0}

.rv-inner{position:relative;z-index:1;max-width:1240px;margin:0 auto;
  padding:0 clamp(1.5rem, 4vw, 4rem);text-align:center;
  display:flex;flex-direction:column;align-items:center}

/* halo dorado muy sutil tras el contenido */
.rv-glow{position:absolute;top:50%;left:50%;width:min(640px,82vw);aspect-ratio:1/1;
  transform:translate(-50%,-50%);pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(201,150,46,.16) 0%,rgba(201,150,46,.05) 38%,transparent 66%)}

/* eyebrow con filetes dorados (como el "Welcome to" del header) */
.rv-eyebrow{display:flex;align-items:center;justify-content:center;gap:1.1rem;
  font-family:'Jost',sans-serif;font-weight:400;color:var(--oro);
  font-size:.78rem;letter-spacing:.3em;text-transform:uppercase}
.rv-eyebrow .rv-ln{width:clamp(34px,5vw,64px);height:1px;background:var(--oro);opacity:.7}

/* estrellas */
.rv-stars{display:flex;align-items:center;justify-content:center;gap:clamp(.4rem,1vw,.7rem);
  margin-top:clamp(1.4rem,3vh,2rem)}
.rv-star{display:block;filter:drop-shadow(0 2px 10px rgba(201,150,46,.45))}

/* título */
.rv-title{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--crema);
  font-size:clamp(2.1rem, 1.2rem + 2.6vw, 3.6rem);line-height:1.1;letter-spacing:.01em;
  margin-top:clamp(1rem,2.4vh,1.6rem)}

/* texto */
.rv-text{font-family:'Jost',sans-serif;font-weight:300;line-height:1.7;
  color:rgba(246,241,233,.74);font-size:clamp(1rem, .92rem + .35vw, 1.18rem);
  margin-top:.9rem;max-width:34ch}
.rv-text .rv-count{font-weight:500;color:var(--oro-claro);white-space:nowrap}

/* sello Google */
.rv-google{display:inline-flex;align-items:center;gap:.6rem;
  margin-top:clamp(1.6rem,3.4vh,2.4rem);
  font-family:'Jost',sans-serif;font-weight:400;font-size:.7rem;
  letter-spacing:.24em;text-transform:uppercase;color:rgba(246,241,233,.5)}
.rv-google .rv-g{display:block;flex:0 0 auto}

@media(max-width:900px){
  .rv-text{max-width:30ch}
  .rv-star{width:30px;height:30px}
}

/* ===== WHERE TO FIND US ===== */
.loc{background:var(--blanco);padding:clamp(4rem, 8vw, 7rem) 0}
.loc-inner{max-width:1240px;margin:0 auto;padding:0 clamp(1.5rem, 4vw, 4rem);
  display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(2.6rem, 6vw, 6rem);align-items:center}

/* ---------- eyebrow ---------- */
.loc-eyebrow{display:flex;align-items:center;gap:1rem;
  font-family:'Jost',sans-serif;font-size:.78rem;font-weight:500;letter-spacing:.3em;
  text-transform:uppercase;color:var(--oro)}
.loc-ln{width:clamp(34px, 5vw, 60px);height:1px;background:var(--oro);opacity:.7}

/* ---------- title ---------- */
.loc-title{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--tinta);
  font-size:clamp(2.1rem, 1.2rem + 2.6vw, 3.6rem);line-height:1.1;
  margin:1.1rem 0 clamp(1.8rem, 4vw, 2.6rem)}

/* ---------- list ---------- */
.loc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;
  gap:clamp(1.5rem, 3vw, 2.1rem)}
.loc-item{display:flex;align-items:flex-start;gap:1.15rem}

.loc-icon{flex:0 0 auto;display:grid;place-items:center;width:48px;height:48px;border-radius:9999px;
  color:var(--oro);background:var(--crema);
  border:1px solid color-mix(in srgb, var(--oro) 26%, transparent);
  box-shadow:0 6px 18px -10px color-mix(in srgb, var(--oro) 55%, transparent);
  transition:transform .5s cubic-bezier(.16,1,.3,1), background .5s cubic-bezier(.16,1,.3,1)}
.loc-item:hover .loc-icon{transform:translateY(-2px);background:#FBF6EE}

.loc-body{padding-top:.15rem}
.loc-strong{font-family:'Jost',sans-serif;font-weight:600;color:var(--tinta);
  font-size:1.02rem;letter-spacing:.01em;line-height:1.35}
.loc-sub{font-family:'Jost',sans-serif;font-weight:300;color:var(--gris);
  line-height:1.7;margin-top:.3rem;font-size:.95rem}

/* opening hours rows */
.loc-hours{display:flex;align-items:baseline;gap:.65rem;margin-top:.42rem;
  font-family:'Jost',sans-serif;font-weight:300;color:var(--gris);
  font-size:.95rem;line-height:1.5}
.loc-hours span:first-child{flex:0 0 auto}
.loc-hours span:last-child{flex:0 0 auto;font-weight:400;color:var(--tinta);
  font-variant-numeric:tabular-nums}
.loc-dots{flex:1 1 auto;height:0;align-self:center;
  border-bottom:1px dotted color-mix(in srgb, var(--gris) 38%, transparent)}
.loc-hours--closed span:last-child{color:var(--oro);font-weight:400}

/* phone link */
.loc-phone{display:inline-block;margin-top:.42rem;
  font-family:'Jost',sans-serif;font-weight:500;color:var(--oro);
  font-size:1.05rem;letter-spacing:.04em;text-decoration:none;
  background-image:linear-gradient(var(--oro),var(--oro));
  background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;
  transition:background-size .4s cubic-bezier(.16,1,.3,1), color .4s ease}
.loc-phone:hover{color:var(--oro-claro);background-size:100% 1px}

/* ---------- cta ---------- */
.loc-cta{margin-top:clamp(2rem, 4vw, 2.8rem)}
.loc-btn{display:inline-block;background:var(--peach-cta);color:var(--tinta);text-decoration:none;
  font-family:'Jost',sans-serif;font-size:.74rem;font-weight:500;letter-spacing:.18em;
  text-transform:uppercase;padding:1.05rem 2.4rem;border-radius:9999px;
  border:1px solid transparent;
  box-shadow:0 14px 30px -16px color-mix(in srgb, var(--peach-cta) 80%, transparent);
  transition:.4s cubic-bezier(.16,1,.3,1)}
.loc-btn:hover{background:var(--peach-cta-hover);
  transform:translateY(-2px);box-shadow:0 18px 36px -16px color-mix(in srgb, var(--peach-cta) 85%, transparent)}

/* ---------- media ---------- */
.loc-media{position:relative}
.loc-frame{position:relative;border-radius:24px;overflow:hidden;
  box-shadow:0 30px 60px -34px rgba(26,22,20,.45), 0 6px 18px -12px rgba(26,22,20,.18)}
.loc-frame::after{content:"";position:absolute;inset:0;border-radius:24px;
  border:1px solid color-mix(in srgb, var(--oro) 22%, transparent);pointer-events:none}
.loc-frame img{display:block;width:100%;height:100%;aspect-ratio:4 / 5;object-fit:cover;
  transition:transform .9s cubic-bezier(.16,1,.3,1)}
.loc-frame:hover img{transform:scale(1.04)}

.loc-diamond{position:absolute;top:-14px;inset-inline-start:-14px;color:var(--oro);font-size:.85rem;line-height:1;
  display:grid;place-items:center;width:40px;height:40px;border-radius:9999px;
  background:var(--blanco);
  border:1px solid color-mix(in srgb, var(--oro) 30%, transparent);
  box-shadow:0 10px 24px -14px color-mix(in srgb, var(--oro) 70%, transparent)}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .loc-inner{grid-template-columns:1fr;gap:clamp(2.4rem, 8vw, 3.4rem)}
  .loc-media{order:-1}
  .loc-frame img{aspect-ratio:16 / 11}
  .loc-eyebrow{justify-content:flex-start}
}

/* ===== FOOTER ===== */
.ft {
  background: var(--tinta);
  color: var(--crema);
  padding: clamp(4rem, 8vw, 7rem) 0 clamp(2rem, 4vw, 3rem);
  overflow: hidden;
  position: relative;
}

.ft__inner {
  max-width: 1240px;
  margin: 0 auto;
  padding-inline: clamp(1.5rem, 4vw, 4rem);
}

/* ---- Top row ---- */
.ft__top {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1.1fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: start;
}

.ft__col--brand { max-width: 30ch; }

.ft__brand {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.ft__brand-name {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  font-size: clamp(2.6rem, 1.6rem + 2.4vw, 3.6rem);
  color: var(--blanco);
  letter-spacing: .01em;
}

.ft__brand-sub {
  margin-top: .45rem;
  font-family: 'Jost', sans-serif;
  font-weight: 400;
  font-size: .74rem;
  letter-spacing: .42em;
  text-transform: uppercase;
  color: var(--oro);
}

.ft__brand-line {
  margin: 1.5rem 0 0;
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.7;
  color: rgba(246, 241, 233, .68);
  max-width: 26ch;
}

.ft__diamond {
  margin-top: 1.6rem;
  color: var(--oro);
  font-size: .7rem;
  opacity: .85;
}

/* ---- Column headings ---- */
.ft__heading {
  margin: 0 0 1.5rem;
  font-family: 'Jost', sans-serif;
  font-weight: 500;
  font-size: .78rem;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--oro);
}

/* ---- Explore list ---- */
.ft__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .95rem;
}

.ft__link {
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  font-size: .82rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(246, 241, 233, .72);
  text-decoration: none;
  position: relative;
  display: inline-block;
  transition: color .4s cubic-bezier(.16, 1, .3, 1);
}

.ft__link::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  bottom: -.28rem;
  width: 0;
  height: 1px;
  background: var(--oro);
  transition: width .4s cubic-bezier(.16, 1, .3, 1);
}

.ft__link:hover { color: var(--oro-claro); }
.ft__link:hover::after { width: 100%; }

/* ---- Contact ---- */
.ft__contact {
  font-style: normal;
  display: flex;
  flex-direction: column;
  gap: .85rem;
}

.ft__contact-line {
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  font-size: .92rem;
  line-height: 1.6;
  color: rgba(246, 241, 233, .72);
  max-width: 18ch;
}

.ft__link--phone {
  font-size: .92rem;
  letter-spacing: .08em;
  text-transform: none;
  color: rgba(246, 241, 233, .82);
}

.ft__social {
  display: flex;
  gap: .85rem;
  margin-top: 1.8rem;
}

.ft__social-link {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(201, 150, 46, .35);
  border-radius: 9999px;
  color: var(--oro);
  transition: background .4s cubic-bezier(.16, 1, .3, 1),
              color .4s cubic-bezier(.16, 1, .3, 1),
              border-color .4s cubic-bezier(.16, 1, .3, 1),
              transform .4s cubic-bezier(.16, 1, .3, 1);
}

.ft__social-link:hover {
  background: var(--oro);
  border-color: var(--oro);
  color: var(--blanco);
  transform: translateY(-3px);
}

/* ---- Gold rules ---- */
.ft__rule {
  height: 1px;
  margin: clamp(3rem, 6vw, 5rem) 0 clamp(2.2rem, 4vw, 3.5rem);
  background: linear-gradient(90deg,
    rgba(201, 150, 46, 0) 0%,
    rgba(201, 150, 46, .35) 18%,
    rgba(201, 150, 46, .35) 82%,
    rgba(201, 150, 46, 0) 100%);
}

.ft__rule--thin {
  margin: clamp(2.2rem, 4vw, 3.5rem) 0 clamp(1.6rem, 3vw, 2.4rem);
  background: linear-gradient(90deg,
    rgba(201, 150, 46, 0) 0%,
    rgba(201, 150, 46, .2) 50%,
    rgba(201, 150, 46, 0) 100%);
}

/* ---- Monumental wordmark ---- */
.ft__monument {
  text-align: center;
  line-height: .92;
}

.ft__monument-text {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  font-style: italic;
  font-size: clamp(2.2rem, 6vw, 6.4rem); /* que quepa: con 9vw «SALON» se cortaba */
  letter-spacing: .005em;
  text-transform: uppercase;
  color: rgba(246, 241, 233, .07);
  -webkit-text-stroke: 1px rgba(246, 241, 233, .16);
  white-space: nowrap;
  user-select: none;
}

/* ---- Bottom bar ---- */
.ft__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.ft__copy,
.ft__credits {
  margin: 0;
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  font-size: .76rem;
  letter-spacing: .08em;
  color: rgba(246, 241, 233, .5);
}

.ft__credits {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

.ft__sep {
  color: var(--oro);
  font-size: .5rem;
  opacity: .8;
}

/* ---- Responsive ---- */
@media (max-width: 900px) {
  .ft__top {
    grid-template-columns: 1fr;
    gap: 2.75rem;
  }
  .ft__col--brand { max-width: none; }
  .ft__monument-text { white-space: normal; }
  .ft__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: .65rem;
  }
}

/* ====================== ÁRABE (dir=rtl) ======================
   Las dos cintas infinitas (marquesina y antes/después) van siempre de
   izquierda a derecha: su animación desplaza en negativo y, volteada, dejaría
   un hueco. La foto de antes/después está compuesta con el «antes» a la
   izquierda, así que las etiquetas tampoco deben voltearse. El texto de cada
   elemento sigue saliendo en su sentido: `direction` solo ordena las cajas. */
.marquesina,.ad__carousel{direction:ltr}

/* ====================== AÑADIDOS AL INTEGRARLO EN LA WEB (11/09/2026) ====================== */

/* Banderas circulares de <x-bandera-idioma> dentro del selector */
.lang-flag--circulo{width:20px;height:20px;border-radius:9999px;box-shadow:none}
.lang-flag--circulo svg{width:100%;height:100%}

/* «Reservar» siempre a la vista en la barra del móvil */
.pill-movil{display:inline-flex;align-items:center;border-radius:9999px;padding:.55rem 1.05rem;
  background:var(--peach-cta);color:var(--tinta);text-decoration:none;white-space:nowrap;
  font-family:'Jost',sans-serif;font-size:.64rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  transition:background .4s cubic-bezier(.16,1,.3,1)}
.pill-movil:hover{background:var(--peach-cta-hover)}

/* Pie: la línea suave del contacto, los enlaces legales y la identidad fiscal */
.ft__contact-line--suave{font-size:.84rem;color:rgba(246,241,233,.55);max-width:26ch}
.ft__legal{display:flex;flex-wrap:wrap;justify-content:center;gap:.55rem 1.4rem;
  margin:0 0 clamp(1.6rem,3vw,2.2rem)}
.ft__legal a,.ft__legal button{font-family:'Jost',sans-serif;font-weight:300;font-size:.72rem;letter-spacing:.08em;
  color:rgba(246,241,233,.55);background:none;border:0;padding:0;cursor:pointer;text-decoration:none;
  transition:color .3s ease}
.ft__legal a:hover,.ft__legal button:hover{color:var(--oro-claro)}
.ft__fiscal{margin:1.1rem 0 0;font-family:'Jost',sans-serif;font-weight:300;font-size:.68rem;
  letter-spacing:.04em;line-height:1.6;color:rgba(246,241,233,.38)}

/* Las tarjetas de métodos ahora son enlaces: sin subrayado ni azul */
a.serv-card{text-decoration:none;color:inherit}
/* La cifra de reseñas viene del fichero de idioma dentro de un <span>: en oro, como en su maqueta */
.rv-text span{color:var(--oro-claro);font-weight:500;white-space:nowrap}
/* La marca va siempre de izquierda a derecha: «BEAUTY SALON» son letras sueltas en
   una fila flex y en árabe la fila se invertía («NOLAS YTUAEB») */
.logo{direction:ltr}