/* =============================================================
   TAROT LA EMPERATRIZ — Sistema de diseño
   Construido sobre la carta de colores oficial de la marca
   Easy Code Agency · 2026
   ============================================================= */

:root{
  /* ---- Color. Solo colores de la carta oficial ---- */
  --marfil:#F7F3EC;         /* fondo principal */
  --marfil-2:#F1EBE0;       /* fondo alterno */
  --crema:#E8DFCF;          /* bordes suaves */
  --blanco:#FFFFFF;

  --jade:#1C4F46;           /* VERDE JADE oficial — texto. 8,42:1 sobre marfil */
  --jade-claro:#3F8175;     /* VERDE JADE oficial — secundario */
  --jade-tenue:rgba(28,79,70,.10);

  --oro:#F89E1B;            /* AMARILLO EMPERATRIZ oficial — solo ornamento */
  --oro-claro:#FFC40D;      /* NARANJA PROSPERIDAD oficial — solo ornamento */
  --oro-hondo:#8A6417;      /* dorado legible para texto pequeño */
  --turquesa:#4BDCBE;       /* TURQUESA EMPERATRIZ — solo el sello */

  /* ---- Tipografía. Baskerville es la fuente de la marca ---- */
  --display:'Libre Baskerville',Baskerville,'Times New Roman',serif;
  --texto:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;

  --fs-xs:.78rem; --fs-sm:.9rem; --fs-base:1.05rem; --fs-md:1.3rem;
  --fs-lg:1.65rem; --fs-xl:2.1rem; --fs-2xl:2.7rem; --fs-3xl:3.4rem; --fs-4xl:4.3rem;

  --track-amplio:.34em;     /* el espaciado ancho que usan en sus piezas */
  --track-medio:.16em;

  /* ---- Espaciado base 8 ---- */
  --s-1:.5rem; --s-2:1rem; --s-3:1.5rem; --s-4:2rem; --s-5:2.5rem;
  --s-6:3rem; --s-8:4rem; --s-10:5rem; --s-12:6rem; --s-16:8rem;

  --radio:2px; --radio-lg:4px;
  --ancho:1240px;
  --margen:clamp(1.5rem,5vw,3rem);
  --sombra:0 24px 60px rgba(28,79,70,.10);
  --curva:cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
ul,ol{list-style:none;padding:0}
a{color:inherit;text-decoration:none}

body{
  font-family:var(--texto);
  font-size:var(--fs-base);
  font-weight:300;
  line-height:1.75;
  color:var(--jade);
  background:var(--marfil);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.18;color:var(--jade);text-wrap:balance}
h1{font-size:clamp(var(--fs-2xl),5.2vw,var(--fs-4xl))}
h2{font-size:clamp(var(--fs-xl),3.8vw,var(--fs-3xl))}
p{text-wrap:pretty}

.contenedor{max-width:var(--ancho);margin-inline:auto;padding-inline:var(--margen)}

/* ---------- Ornamentos de marca ---------- */

/* Las tres líneas paralelas doradas que usan en todas sus piezas */
.lineas{display:block;height:9px;width:100%;
  background:
    linear-gradient(var(--oro),var(--oro)) 0 0/100% 1.5px no-repeat,
    linear-gradient(var(--oro-claro),var(--oro-claro)) 0 4px/100% 1.5px no-repeat,
    linear-gradient(var(--oro),var(--oro)) 0 8px/100% 1.5px no-repeat;
}
.lineas--corta{width:78px}

/* Filigrana separadora */
.filigrana{display:flex;align-items:center;justify-content:center;gap:var(--s-2);color:var(--oro)}
.filigrana::before,.filigrana::after{content:"";height:1px;width:clamp(40px,10vw,110px);background:currentColor;opacity:.55}
.filigrana svg{width:26px;height:26px}

.antetitulo{
  display:inline-block;font-family:var(--texto);font-size:var(--fs-xs);font-weight:500;
  letter-spacing:var(--track-amplio);text-transform:uppercase;color:var(--oro-hondo);
}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  font-family:var(--texto);font-size:var(--fs-sm);font-weight:500;
  letter-spacing:var(--track-medio);text-transform:uppercase;
  padding:1.05rem 2.2rem;border:1px solid transparent;border-radius:var(--radio);
  transition:background-color .3s var(--curva),color .3s,border-color .3s,transform .3s;
}
.btn:hover{transform:translateY(-2px)}
.btn--jade{background:var(--jade);color:var(--marfil)}
.btn--jade:hover{background:#164039}
.btn--linea{border-color:var(--jade);color:var(--jade)}
.btn--linea:hover{background:var(--jade);color:var(--marfil)}

/* ---------- Encabezado ---------- */
.barra-aviso{
  background:var(--jade);color:#CFE0DA;text-align:center;
  font-size:var(--fs-xs);letter-spacing:var(--track-medio);text-transform:uppercase;
  padding:.55rem var(--s-2);
}
.barra-aviso b{color:var(--oro-claro);font-weight:400}

.cabecera{position:sticky;top:0;z-index:60;background:rgba(247,243,236,.93);backdrop-filter:blur(12px);border-bottom:1px solid var(--crema)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:96px}
.nav__logo img{height:62px;width:auto}
.nav__lista{display:flex;gap:var(--s-5)}
.nav__lista a{font-size:var(--fs-sm);letter-spacing:var(--track-medio);text-transform:uppercase;color:var(--jade);position:relative;padding-block:.4rem}
.nav__lista a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--oro);transition:width .35s var(--curva)}
.nav__lista a:hover::after,.nav__lista a[aria-current="page"]::after{width:100%}
.nav__acciones{display:flex;align-items:center;gap:var(--s-2)}
.nav__toggle{display:none;flex-direction:column;gap:5px;padding:.4rem}
.nav__toggle span{display:block;width:26px;height:1.5px;background:var(--jade);transition:transform .3s var(--curva),opacity .2s}
.nav__toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav__toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* ---------- Portada ---------- */
.portada{position:relative;padding-block:clamp(var(--s-8),8vw,var(--s-16));overflow:hidden}
.portada::before{ /* halo cálido, como la luz de sus fotos */
  content:"";position:absolute;width:820px;height:820px;border-radius:50%;
  top:-360px;right:-260px;pointer-events:none;
  background:radial-gradient(circle,rgba(248,158,27,.13),transparent 68%);
}
.portada__rejilla{position:relative;display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(var(--s-5),5vw,var(--s-10));align-items:center}

.portada__texto .antetitulo{margin-bottom:var(--s-3)}
.portada h1{margin-bottom:var(--s-4)}
.portada h1 em{font-style:italic;color:var(--jade-claro)}
.portada__entrada{font-size:var(--fs-md);font-weight:300;color:var(--jade-claro);max-width:44ch;margin-bottom:var(--s-5);line-height:1.65}
.portada__acciones{display:flex;gap:var(--s-2);flex-wrap:wrap;margin-bottom:var(--s-6)}

.datos{display:flex;gap:var(--s-5);flex-wrap:wrap;padding-top:var(--s-4);border-top:1px solid var(--crema)}
.datos div{min-width:104px}
.datos dt{font-size:var(--fs-xs);letter-spacing:var(--track-medio);text-transform:uppercase;color:var(--oro-hondo);margin-bottom:.3rem}
.datos dd{margin:0;font-family:var(--display);font-size:var(--fs-md);color:var(--jade)}

/* Imagen con el marco y el sello, como en sus piezas */
.portada__medio{position:relative}
.marco{position:relative;border-radius:var(--radio-lg);overflow:hidden;box-shadow:var(--sombra)}
.marco img{width:100%;height:auto;display:block}
.portada__lineas{position:absolute;left:8%;right:8%;bottom:-5px;z-index:2}
.sello{
  position:absolute;right:-26px;bottom:-30px;z-index:3;
  width:clamp(112px,15vw,150px);height:clamp(112px,15vw,150px);border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#2E7566,#1C4F46 62%,#143A34);
  border:3px solid var(--oro);
  display:grid;place-items:center;padding:16px;
  box-shadow:0 14px 34px rgba(28,79,70,.34);
}
.sello img{width:100%;height:auto}

/* ---------- Accesibilidad y movimiento ---------- */
:where(a,button,summary,input,[tabindex]):focus-visible{outline:2px solid var(--jade-claro);outline-offset:3px}
.saltar{position:absolute;left:-9999px;top:0;z-index:99;background:var(--jade);color:var(--marfil);padding:var(--s-2) var(--s-3)}
.saltar:focus{left:var(--s-2);top:var(--s-2)}
.aparece{opacity:0;transform:translateY(24px);transition:opacity .8s var(--curva),transform .8s var(--curva)}
.aparece.visible{opacity:1;transform:none}
.aparece[data-retraso="1"]{transition-delay:.12s}
.aparece[data-retraso="2"]{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .aparece{opacity:1;transform:none}
}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .portada__rejilla{grid-template-columns:1fr;gap:var(--s-6)}
  .portada__medio{max-width:520px;margin-inline:auto;width:100%}
  .sello{right:-14px;bottom:-18px}
}
@media (max-width:720px){
  .nav{min-height:78px}
  .nav__logo img{height:48px}
  .nav__lista{
    position:absolute;inset-inline:0;top:100%;flex-direction:column;gap:0;
    background:var(--marfil);border-bottom:1px solid var(--crema);box-shadow:var(--sombra);
    max-height:0;overflow:hidden;transition:max-height .4s var(--curva);
  }
  .nav__lista[data-abierto="true"]{max-height:420px}
  .nav__lista li{width:100%;text-align:center;border-top:1px solid var(--crema)}
  .nav__lista a{display:block;padding:var(--s-2)}
  .nav__toggle{display:flex}
  .nav__acciones .btn--linea{display:none}
  .portada__acciones .btn{width:100%}
  .datos{gap:var(--s-3)}
}


/* =============================================================
   SECCIÓN 2 — Franja de confianza
   ============================================================= */
.franja{background:var(--marfil-2);border-block:1px solid var(--crema)}
.franja ul{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-4);padding-block:var(--s-4)}
.franja li{display:flex;align-items:flex-start;gap:.75rem;font-size:var(--fs-sm);line-height:1.5;color:var(--jade)}
.franja svg{flex:0 0 auto;width:20px;height:20px;color:var(--oro);margin-top:2px}

/* =============================================================
   SECCIÓN 3 — Servicios
   ============================================================= */
.seccion{padding-block:clamp(var(--s-8),8vw,var(--s-16))}
.seccion--tenue{background:var(--marfil-2)}

.encabezado{max-width:60ch;margin-bottom:clamp(var(--s-5),5vw,var(--s-8))}
.encabezado--centro{margin-inline:auto;text-align:center}
.encabezado .antetitulo{margin-bottom:var(--s-2)}
.encabezado h2{margin-bottom:var(--s-3)}
.encabezado p{color:var(--jade-claro);font-size:var(--fs-md);line-height:1.65}
.encabezado--centro .filigrana{margin-bottom:var(--s-3)}

.servicios{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(var(--s-4),3vw,var(--s-6))}
.servicio{
  background:var(--blanco);border:1px solid var(--crema);border-radius:var(--radio-lg);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .4s var(--curva),box-shadow .4s var(--curva);
}
.servicio:hover{transform:translateY(-6px);box-shadow:var(--sombra)}
.servicio__foto{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--marfil-2)}
.servicio__foto img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--curva)}
.servicio:hover .servicio__foto img{transform:scale(1.04)}
.servicio__lineas{position:absolute;left:0;right:0;bottom:0;z-index:2}
.servicio__cuerpo{padding:var(--s-4) var(--s-4) var(--s-5);display:flex;flex-direction:column;flex:1}
.servicio__num{font-size:var(--fs-xs);letter-spacing:var(--track-amplio);text-transform:uppercase;color:var(--oro-hondo);margin-bottom:var(--s-2)}
.servicio h3{font-family:var(--display);font-size:var(--fs-lg);color:var(--jade);margin-bottom:var(--s-2);line-height:1.25}
.servicio p{color:var(--jade-claro);font-size:var(--fs-sm);line-height:1.7;margin-bottom:var(--s-3)}
.servicio__precio{
  margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;align-self:flex-start;
  font-size:var(--fs-xs);letter-spacing:var(--track-medio);text-transform:uppercase;
  color:var(--jade);background:var(--marfil-2);border:1px solid var(--crema);
  padding:.5rem 1rem;border-radius:var(--radio);
}
.servicios__pie{margin-top:var(--s-6);text-align:center}
.servicios__pie p{color:var(--jade-claro);margin-bottom:var(--s-3)}

@media (max-width:820px){
  .franja ul{grid-template-columns:repeat(2,1fr);gap:var(--s-3)}
  .servicios{grid-template-columns:1fr}
}
@media (max-width:520px){
  .franja ul{grid-template-columns:1fr}
}

/* ===== SECCIONES 4 a 8 (añadidas) ===== */
.seccion--alt{background:var(--marfil-2)}

/* 4 · Cómo es una lectura */
.pasos{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(var(--s-4),4vw,var(--s-8));counter-reset:p}
.paso{position:relative;text-align:center}
.paso__foto{position:relative;border-radius:var(--radio-lg);overflow:hidden;box-shadow:var(--sombra);margin-bottom:var(--s-4);aspect-ratio:4/5}
.paso__foto img{width:100%;height:100%;object-fit:cover;display:block}
.paso__num{display:inline-block;font-family:var(--display);font-size:var(--fs-sm);letter-spacing:var(--track-amplio);color:var(--oro-hondo);margin-bottom:var(--s-2)}
.paso h3{font-family:var(--display);font-size:var(--fs-lg);color:var(--jade);margin-bottom:var(--s-2);line-height:1.25}
.paso p{color:var(--jade-claro);font-weight:300;max-width:34ch;margin-inline:auto;line-height:1.7}

/* 5 · Sobre La Emperatriz */
.sobre{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(var(--s-5),5vw,var(--s-10));align-items:center}
.sobre__texto h2{font-family:var(--display);font-size:var(--fs-2xl);color:var(--jade);line-height:1.18;margin-bottom:var(--s-4)}
.sobre__texto p{color:var(--jade-claro);font-weight:300;line-height:1.8;margin-bottom:var(--s-3);max-width:52ch}
.sobre .datos{margin-top:var(--s-5)}

/* 6 · La Emperatriz dice */
.frases{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(var(--s-3),3vw,var(--s-5))}
.frase{margin:0;background:var(--blanco);border:1px solid var(--crema);border-radius:var(--radio-lg);
  padding:clamp(var(--s-4),4vw,var(--s-6));text-align:center;display:flex;flex-direction:column;
  align-items:center;justify-content:center;min-height:260px;position:relative}
.frase::before{content:"";display:block;width:34px;height:1px;background:var(--oro);margin-bottom:var(--s-3);opacity:.8}
.frase p{font-family:var(--display);font-size:var(--fs-md);font-style:italic;color:var(--jade);line-height:1.6;margin:0}
.frase footer{margin-top:var(--s-3);font-size:var(--fs-xs);letter-spacing:var(--track-medio);
  text-transform:uppercase;color:var(--oro-hondo)}

/* 7 · Galería vertical */
.galeria{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-2)}
.galeria figure{margin:0;border-radius:var(--radio-lg);overflow:hidden;aspect-ratio:9/13;box-shadow:0 10px 30px rgba(28,79,70,.07)}
.galeria img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s var(--curva)}
.galeria figure:hover img{transform:scale(1.04)}

/* 8 · Cierre */
.cierre{padding-block:clamp(var(--s-8),8vw,var(--s-16));background:var(--jade);color:var(--marfil)}
.cierre__caja{text-align:center;max-width:62ch;margin-inline:auto}
.cierre .filigrana{color:var(--oro-claro);margin-bottom:var(--s-3)}
.cierre .antetitulo{color:var(--oro-claro)}
.cierre h2{font-family:var(--display);font-size:var(--fs-2xl);line-height:1.2;margin-bottom:var(--s-3);color:var(--marfil)}
.cierre p{font-weight:300;line-height:1.75;margin-bottom:var(--s-5);opacity:.92}
.cierre .portada__acciones{justify-content:center;margin-bottom:0}
.cierre .btn--jade{background:var(--marfil);color:var(--jade)}
.cierre .btn--jade:hover{background:var(--blanco)}
.cierre .btn--linea{border-color:rgba(247,243,236,.55);color:var(--marfil)}
.cierre .btn--linea:hover{background:var(--marfil);color:var(--jade)}

/* Pie */
.pie{background:var(--marfil-2);border-top:1px solid var(--crema);padding-block:var(--s-8) var(--s-4)}
.pie__rejilla{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--s-6);align-items:start}
.pie__logo img{height:58px;width:auto;margin-bottom:var(--s-3)}
.pie__lema{font-family:var(--display);font-style:italic;color:var(--jade-claro);max-width:34ch;line-height:1.6}
.pie h4{font-size:var(--fs-xs);letter-spacing:var(--track-amplio);text-transform:uppercase;color:var(--oro-hondo);margin-bottom:var(--s-3)}
.pie ul{list-style:none;display:grid;gap:.6rem}
.pie a{color:var(--jade);font-weight:300}
.pie a:hover{color:var(--jade-claro)}
.pie__legal{margin-top:var(--s-6);padding-top:var(--s-3);border-top:1px solid var(--crema);
  font-size:var(--fs-xs);letter-spacing:var(--track-medio);text-transform:uppercase;color:var(--jade-claro);
  display:flex;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap}

@media (max-width:980px){
  .pasos{grid-template-columns:1fr;max-width:460px;margin-inline:auto}
  .sobre{grid-template-columns:1fr}
  .frases{grid-template-columns:1fr}
  .galeria{grid-template-columns:repeat(2,1fr)}
  .pie__rejilla{grid-template-columns:1fr;gap:var(--s-5)}
}

/* 7 · Muro de videos */
.muro{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-3)}
.muro__item{position:relative;margin:0;border-radius:var(--radio-lg);overflow:hidden;
  aspect-ratio:9/16;background:var(--crema);box-shadow:0 14px 40px rgba(28,79,70,.10);cursor:pointer}
.muro__item video{width:100%;height:100%;object-fit:cover;display:block}
.muro__play{position:absolute;inset:0;display:grid;place-items:center;transition:opacity .4s var(--curva)}
.muro__play::before{content:"";width:58px;height:58px;border-radius:50%;
  background:rgba(247,243,236,.88);box-shadow:0 8px 24px rgba(28,79,70,.22)}
.muro__play::after{content:"";position:absolute;width:0;height:0;
  border-left:15px solid var(--jade);border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px}
.muro__item.reproduciendo .muro__play{opacity:0}
@media (max-width:980px){ .muro{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .muro{grid-template-columns:1fr;max-width:340px;margin-inline:auto} }

/* El muro, cuando va arriba: menos aire para que se vea casi al entrar */
.seccion--muro{padding-top:clamp(var(--s-4),3vw,var(--s-6))}
.seccion--muro .encabezado{margin-bottom:var(--s-4)}

/* Carrusel de la portada */
.carrusel{position:relative;aspect-ratio:9/13;background:var(--crema);overflow:hidden}
.carrusel__v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .9s var(--curva)}
.carrusel__v.activa{opacity:1}
.carrusel__puntos{display:flex;gap:.5rem;justify-content:center;margin-top:var(--s-3)}
.carrusel__punto{width:28px;height:2px;background:var(--crema);border-radius:2px;
  transition:background .4s var(--curva),transform .4s var(--curva)}
.carrusel__punto.activo{background:var(--oro);transform:scaleY(2)}
.carrusel__punto:hover{background:var(--jade-claro)}
@media (max-width:980px){ .carrusel{aspect-ratio:9/14} }

/* === AJUSTE: el carrusel respeta la proporcion nativa 9:16 de los videos === */
.portada__medio .marco{display:flex;justify-content:center;background:transparent;box-shadow:none;border-radius:0;overflow:visible}
.carrusel{
  aspect-ratio:9/16;          /* igual que el video: no recorta nada */
  height:min(74vh,720px);
  width:auto;
  margin-inline:auto;
  border-radius:var(--radio-lg);
  box-shadow:var(--sombra);
  background:var(--marfil-2);
}
.carrusel__v{object-fit:contain;background:var(--marfil-2)}
.portada__lineas{display:none}
.carrusel__puntos{margin-top:var(--s-3)}

/* el menu no se parte en dos lineas */
.nav__lista a{white-space:nowrap}
.nav__lista{flex-wrap:nowrap}

@media (max-width:980px){
  .carrusel{height:min(68vh,560px)}
}

/* === Encabezado: que nada se parta ni desborde === */
.btn{white-space:nowrap}
.nav{flex-wrap:nowrap}
.nav__lista{flex-wrap:nowrap;gap:clamp(.9rem,2vw,var(--s-5))}
.nav__acciones{flex:0 0 auto}
.btn--nav{padding:.78rem 1.5rem;font-size:var(--fs-xs);letter-spacing:var(--track-medio)}
.nav__acciones .btn--linea{padding:.78rem 1.3rem;font-size:var(--fs-xs);letter-spacing:var(--track-medio)}
@media (max-width:1150px){ .nav__lista a{font-size:var(--fs-xs)} }

/* === RADIOS: suavizado coherente con la identidad (sello circular + filigranas) === */
:root{
  --radio:8px;      /* botones y elementos pequenos */
  --radio-lg:16px;  /* fotos, video, tarjetas */
}
.btn{border-radius:var(--radio)}
.marco,.carrusel,.paso__foto,.muro__item,.galeria figure,.frase{border-radius:var(--radio-lg)}
.servicio__foto{border-radius:var(--radio-lg);overflow:hidden}
.carrusel__punto{border-radius:999px}

/* === PORTADA: que entre completa en la primera pantalla === */
.portada{padding-block:clamp(1.5rem,3vw,2.75rem) clamp(2.5rem,5vw,4.5rem)}
.carrusel{height:min(64vh,600px)}
.portada h1{margin-bottom:var(--s-3)}
.portada__entrada{margin-bottom:var(--s-4)}
.portada__acciones{margin-bottom:var(--s-4)}
.datos{padding-top:var(--s-3)}

/* sombras mas abiertas y tenues, acordes a la luz de sus fotos */
:root{--sombra:0 30px 70px rgba(28,79,70,.085)}

@media (max-width:980px){ .carrusel{height:min(58vh,480px)} }


/* === Numero de telefono visible (en computador el enlace tel: casi no sirve) === */
.tel-nota{margin-top:calc(var(--s-3) * -1);margin-bottom:var(--s-4);font-size:var(--fs-sm);color:var(--jade-claro);letter-spacing:.01em}
.tel-nota a{color:var(--jade);font-weight:600;text-decoration:none;border-bottom:1px solid rgba(248,158,27,.55);padding-bottom:1px}
.tel-nota a:hover{border-bottom-color:var(--oro)}
.cierre .tel-nota{margin-top:var(--s-3);margin-bottom:0;text-align:center}

/* ============ RESENAS (pendiente de contenido real) ============ */
.aviso-pendiente{max-width:62ch;margin:0 auto var(--s-6);padding:var(--s-3) var(--s-4);
  border:1px dashed var(--oro);border-radius:var(--radio-lg);background:rgba(248,158,27,.07);
  color:var(--oro-hondo);font-size:var(--fs-sm);line-height:1.6;text-align:center}
.aviso-pendiente strong{color:var(--oro-hondo)}

.resena-resumen{display:flex;flex-direction:column;align-items:center;gap:var(--s-1);margin-bottom:var(--s-6)}
.resena-resumen__estrellas{color:var(--oro);font-size:1.5rem;letter-spacing:.18em}
.resena-resumen__dato{color:var(--jade-claro);font-size:var(--fs-sm)}
.resena-resumen__dato strong{color:var(--jade);font-size:1.25rem;font-family:var(--display)}

.resenas{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.resena{display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5);
  background:#fff;border-radius:var(--radio-lg);box-shadow:var(--sombra)}
.resena__estrellas{color:var(--oro);letter-spacing:.14em}
.resena blockquote p{color:var(--jade);line-height:1.7;font-size:var(--fs-md)}
.resena footer{display:flex;flex-direction:column;gap:2px;margin-top:auto;
  padding-top:var(--s-3);border-top:1px solid rgba(28,79,70,.1)}
.resena__nombre{color:var(--jade);font-weight:600;font-size:var(--fs-sm)}
.resena__fuente{color:var(--jade-claro);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}
.resena--vacia{opacity:.55;border:1px dashed rgba(28,79,70,.25);box-shadow:none;background:transparent}
.resena--vacia blockquote p{font-style:italic}

.resenas__pie{margin-top:var(--s-6);text-align:center}

/* ============ REDES ============ */
.redes{padding-block:clamp(2.5rem,6vw,4.5rem)}
.redes__caja{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s-2)}
.redes__caja p{color:var(--jade-claro);max-width:48ch}
.redes__enlaces{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s-3);margin-top:var(--s-4)}
.red{display:inline-flex;align-items:center;gap:.55rem;padding:.7rem 1.25rem;
  border:1px solid rgba(28,79,70,.22);border-radius:999px;color:var(--jade);
  text-decoration:none;font-size:var(--fs-sm);letter-spacing:.04em;
  transition:border-color .25s,background .25s,transform .25s}
.red svg{width:20px;height:20px}
.red:hover{border-color:var(--oro);background:rgba(248,158,27,.07);transform:translateY(-2px)}
.redes__nota{margin-top:var(--s-3);color:var(--oro-hondo);font-size:var(--fs-sm);letter-spacing:.06em}

/* enlaces que todavia no tienen destino: atenuados, sin etiqueta encima.
   El recordatorio vive en el atributo data-pendiente del HTML, no en pantalla. */
[data-pendiente]{opacity:.45}

/* === CORRECCION: el numero del cierre iba en jade sobre fondo jade (invisible) === */
.cierre .tel-nota{color:rgba(247,243,236,.8)}
.cierre .tel-nota a{color:var(--marfil);border-bottom-color:var(--oro)}
.cierre .tel-nota a:hover{border-bottom-color:var(--marfil)}

/* === Redes en el pie === */
.pie__redes{display:flex;gap:.6rem;margin-top:var(--s-4)}
.pie__redes a{display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border:1px solid rgba(28,79,70,.2);border-radius:999px;
  color:var(--jade);transition:border-color .25s,background .25s,transform .25s}
.pie__redes svg{width:19px;height:19px}
.pie__redes a:hover{border-color:var(--oro);background:rgba(248,158,27,.08);transform:translateY(-2px)}

/* === Dos numeros, cada uno con su pais === */
.tel-paises{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-4);align-items:baseline}
.tel-paises span{display:inline-flex;align-items:baseline;gap:.45rem}
.tel-paises em{font-style:normal;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--oro-hondo)}
.cierre .tel-paises{justify-content:center}
.cierre .tel-paises em{color:var(--oro-claro)}
.tel-pie{margin-top:.35rem}
.pie li small{display:block;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--oro-hondo);margin-top:1px}

/* === Lectura Express === */
.express{display:grid;grid-template-columns:auto 1fr auto;gap:var(--s-5);align-items:center;
  margin-top:var(--s-6);padding:clamp(1.5rem,3vw,2.25rem);
  background:linear-gradient(180deg,rgba(248,158,27,.07),rgba(248,158,27,.03));
  border:1px solid rgba(248,158,27,.35);border-radius:var(--radio-lg)}
.express__marca{color:var(--oro);font-size:1.6rem;line-height:1}
.express__cuerpo h3{font-family:var(--display);font-size:var(--fs-xl);color:var(--jade);margin:.15rem 0 .5rem}
.express__cuerpo p{color:var(--jade-claro);line-height:1.65;max-width:52ch}
.express__letra{margin-top:.6rem;font-size:var(--fs-sm);font-style:italic;opacity:.85}
.express__precio{display:flex;flex-direction:column;align-items:center;gap:.2rem;text-align:center}
.express__cifra{font-family:var(--display);font-size:clamp(2.4rem,5vw,3.1rem);color:var(--oro-hondo);line-height:1}
.express__unidad{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--jade-claro);margin-bottom:.8rem}
.express__precio .btn{white-space:nowrap}
.express__precio .btn em{font-style:normal}
@media (max-width:880px){
  .express{grid-template-columns:1fr;text-align:center;justify-items:center}
  .express__cuerpo p{max-width:none}
}