/* ═══════════════════════════════════════════════════════════════════
   GUAPA! NAIL STUDIO — hoja de estilos compartida
   Sirve a todas las páginas, en inglés y en español.
   Dorado oficial de marca: #C6922D
   ═══════════════════════════════════════════════════════════════════ */

:root{
  --oro:#C6922D;
  --oro-claro:#E0B457;
  --oro-suave:#F0E2C4;
  --crema:#FAF7F2;
  --crema-2:#F4EDE1;
  --tinta:#2A2118;
  --tinta-2:#6B5B47;
  --linea:#E5DACA;
  --blanco:#fff;
  --sombra:0 2px 6px rgba(42,33,24,.04), 0 14px 40px rgba(42,33,24,.07);
  --sombra-alta:0 10px 34px rgba(42,33,24,.13);
  --r-sm:14px;
  --r:22px;
  --r-lg:30px;
  --arco:999px 999px var(--r) var(--r);
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Jost", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--crema); color:var(--tinta); overflow-x:hidden;
  font-family:var(--sans); font-weight:300; font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
a{color:inherit}
.env{width:min(1180px,100% - 40px); margin-inline:auto}
@media (max-width:600px){ .env{width:min(1180px,100% - 30px)} }

h1,h2,h3{font-family:var(--serif); font-weight:400; letter-spacing:-.01em; margin:0}
h1{font-size:clamp(2.5rem,6.2vw,4.35rem); line-height:1.05}
h2{font-size:clamp(1.95rem,4.2vw,3rem); line-height:1.1}
h3{font-size:1.32rem; line-height:1.25}
p{margin:0}
/* el español es más largo de media: un punto menos de cuerpo */
html[lang="es"] h1{font-size:clamp(2.35rem,5.8vw,4.15rem); line-height:1.06}
html[lang="es"] h2{font-size:clamp(1.9rem,4.1vw,2.9rem)}

.ojo{
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; color:var(--oro);
}

/* ---------- botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--sans); font-size:.8rem; font-weight:500;
  letter-spacing:.13em; text-transform:uppercase; text-decoration:none;
  padding:16px 32px; border-radius:999px; border:1px solid transparent;
  transition:.22s ease; cursor:pointer; white-space:nowrap;
}
.btn-oro{background:var(--oro); color:#fff}
.btn-oro:hover{background:#B07F22; transform:translateY(-1px)}
.btn-linea{border-color:var(--tinta); color:var(--tinta); background:transparent}
.btn-linea:hover{background:var(--tinta); color:var(--crema)}
.btn-tinta{background:var(--tinta); color:var(--crema)}
.btn-tinta:hover{background:#3B2E20}
.btn-sm{padding:12px 24px; font-size:.72rem}

/* ---------- nav ---------- */
.nav{
  position:sticky; top:0; z-index:60; background:rgba(250,247,242,.92);
  backdrop-filter:blur(12px); border-bottom:1px solid var(--linea);
}
.nav-in{display:flex; align-items:center; gap:26px; padding:12px 0}
.nav-logo img{width:clamp(108px,12.5vw,146px)}
.nav-links{display:flex; gap:24px; margin-left:auto; align-items:center}
.nav-links a{
  text-decoration:none; font-size:.79rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--tinta-2); transition:color .2s;
}
.nav-links a:hover{color:var(--oro)}
.nav-links a.activo{color:var(--oro)}
.lang{display:flex; gap:6px; align-items:center; font-size:.73rem; letter-spacing:.08em}
.lang a{text-decoration:none; color:var(--tinta-2)}
.lang .on{color:var(--oro); font-weight:500}
.lang span{color:var(--linea)}
@media (max-width:1040px){ .nav-links .oculta-md{display:none} }
@media (max-width:620px){ .nav-links{gap:14px} .nav-links .btn{display:none} }

/* ---------- migas ---------- */
.migas{padding:22px 0 0; font-size:.78rem; color:var(--tinta-2)}
.migas ol{list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0}
.migas li::after{content:"›"; margin-left:8px; color:var(--linea)}
.migas li:last-child::after{content:""}
.migas a{color:var(--tinta-2); text-decoration:none; border-bottom:1px solid var(--linea)}
.migas a:hover{color:var(--oro)}
.migas [aria-current]{color:var(--tinta)}

/* ---------- cabecera de página interior ---------- */
.cabecera{padding:clamp(34px,5vw,62px) 0 clamp(30px,4vw,52px)}
.cabecera .ojo{display:block; margin-bottom:14px}
.cabecera p{margin-top:20px; color:var(--tinta-2); font-size:1.07rem; max-width:56ch}
.cabecera .btns{display:flex; flex-wrap:wrap; gap:12px; margin-top:30px}

/* ---------- hero (portada) ---------- */
.hero{padding:clamp(34px,5vw,64px) 0 clamp(34px,5vw,62px)}
.hero-grid{display:grid; grid-template-columns:1.04fr .96fr; gap:clamp(28px,5vw,68px); align-items:center}
.hero h1 em{font-style:italic; color:var(--oro)}
.hero-sub{margin-top:22px; font-size:1.09rem; color:var(--tinta-2); max-width:46ch}
.hero-acc{
  display:inline-flex; align-items:center; gap:11px; margin-bottom:22px;
  padding:8px 18px 8px 10px; border:1px solid var(--linea);
  border-radius:999px; background:var(--blanco);
}
.estrellas{color:var(--oro); letter-spacing:2px; font-size:.9rem}
.hero-acc b{font-weight:500; font-size:.83rem}
.hero-acc span{font-size:.83rem; color:var(--tinta-2)}
.hero-btns{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px}
.hero-nota{margin-top:20px; font-size:.85rem; color:var(--tinta-2)}
.hero-foto{position:relative; padding-bottom:26px}
.arco{border-radius:var(--arco); overflow:hidden; background:var(--crema-2)}
.hero-foto .arco{position:relative; z-index:1; box-shadow:var(--sombra)}
.hero-foto .arco img{width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 42%}
.hero-foto::before{
  content:""; position:absolute; z-index:0; left:-16px; top:26px; right:22px; bottom:0;
  border:1px solid var(--oro); opacity:.4; border-radius:var(--arco); pointer-events:none;
}
.flota{
  position:absolute; z-index:3; left:-14px; bottom:0;
  display:flex; align-items:center; gap:12px;
  background:var(--blanco); border:1px solid var(--linea); border-radius:999px;
  padding:9px 20px 9px 10px; box-shadow:var(--sombra-alta);
}
.flota img{width:46px; height:46px; border-radius:50%; object-fit:cover; flex:0 0 auto}
.flota b{display:block; font-family:var(--serif); font-size:1.16rem; font-weight:500; line-height:1.15}
.flota span{display:block; font-size:.72rem; letter-spacing:.09em; text-transform:uppercase; color:var(--tinta-2)}
@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr; gap:34px}
  .hero-foto{order:-1; padding-bottom:22px}
  .hero-foto::before{display:none}
  .hero-foto .arco img{aspect-ratio:1/1}
  .flota{left:50%; transform:translateX(-50%)}
}

/* ---------- tira de confianza ---------- */
.tira{padding:0 0 clamp(46px,6vw,74px)}
.tira-in{display:grid; grid-template-columns:repeat(4,1fr); background:var(--tinta); border-radius:var(--r-lg); overflow:hidden}
.tira-i{padding:26px 18px; text-align:center; border-right:1px solid rgba(255,255,255,.09)}
.tira-i:last-child{border-right:0}
.tira-i b{display:block; font-family:var(--serif); font-size:1.85rem; color:var(--oro-claro); font-weight:500; line-height:1.1}
.tira-i span{display:block; margin-top:4px; font-size:.71rem; letter-spacing:.1em; text-transform:uppercase; color:#B9AA95}
@media (max-width:720px){
  .tira-in{grid-template-columns:repeat(2,1fr)}
  .tira-i:nth-child(2){border-right:0}
  .tira-i:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.09)}
}

/* ---------- secciones ---------- */
section{padding:clamp(56px,8vw,104px) 0}
section.compacta{padding:clamp(40px,5vw,68px) 0}
.cab{max-width:62ch; margin-bottom:clamp(30px,4vw,48px)}
.cab .ojo{display:block; margin-bottom:14px}
.cab p{margin-top:16px; color:var(--tinta-2); font-size:1.04rem}
.cab-c{margin-inline:auto; text-align:center}

/* ---------- galería ---------- */
.galeria{background:var(--blanco); border-block:1px solid var(--linea)}
.gal-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.gal-i{position:relative; overflow:hidden; background:var(--crema-2); border-radius:var(--r)}
.gal-i img{width:100%; aspect-ratio:3/4; object-fit:cover; transition:transform .55s ease}
.gal-i:hover img{transform:scale(1.05)}
.gal-i figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:30px 16px 14px;
  background:linear-gradient(to top, rgba(42,33,24,.74), transparent);
  color:#fff; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase;
}
/* El arco es la única forma que se mezcla con el rectángulo sin romper la
   retícula: su base es recta, así que el rótulo se lee igual de bien. */
.f-arco{border-radius:var(--arco)}
.g-alta{grid-row:span 2}
.g-alta img{aspect-ratio:3/8}
@media (max-width:900px){ .gal-grid{grid-template-columns:repeat(3,1fr)} .g-alta{grid-row:span 1} .g-alta img{aspect-ratio:3/4} }
@media (max-width:560px){ .gal-grid{grid-template-columns:repeat(2,1fr); gap:11px} }

/* ---------- precios ---------- */
.precios-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(18px,2.6vw,28px)}
.tarjeta{
  display:grid; grid-template-columns:150px 1fr;
  background:var(--blanco); border:1px solid var(--linea);
  border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sombra);
}
.tarjeta-foto{position:relative; overflow:hidden; background:var(--crema-2)}
.tarjeta-foto img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0}
/* La columna de foto mide 150 px: de una foto apaisada solo se ve una franja
   estrecha. Estas dos tienen las uñas a la derecha del encuadre, asi que sin
   corregir el recorte se ve el dorso de la mano y no el trabajo. */
.tarjeta-foto img[src$="nude-gel-mano.jpg"]{object-position:80% 62%}
.tarjeta-foto img[src$="lila-suave.jpg"]{object-position:76% 46%}
.tarjeta-cuerpo{padding:clamp(22px,2.6vw,30px)}
.tarjeta h3{margin-bottom:3px}
.tarjeta .nota{font-size:.84rem; color:var(--tinta-2); margin-bottom:16px}
.lista{list-style:none; margin:0; padding:0}
.lista li{display:flex; align-items:baseline; gap:10px; padding:10px 0; border-bottom:1px dashed var(--linea)}
.lista li:last-child{border-bottom:0; padding-bottom:0}
.lista .nom{flex:0 0 auto}
.lista .pun{flex:1 1 auto; border-bottom:1px dotted var(--linea); min-width:10px; transform:translateY(-4px)}
.lista .pre{font-family:var(--serif); font-size:1.26rem; color:var(--oro); font-weight:500; white-space:nowrap}
.lista .pre small{
  font-family:var(--sans); font-size:.63rem; font-weight:400; letter-spacing:.11em;
  text-transform:uppercase; color:var(--tinta-2); margin-right:5px; vertical-align:1px;
}
.lista .desc{display:block; font-size:.83rem; color:var(--tinta-2); margin-top:3px}
.lista li.con-desc{align-items:flex-start}
.lista li.con-desc .pun{display:none}
.lista li.con-desc .nom{flex:1 1 auto}
.destacado{border-color:var(--oro-suave)}
.destacado .tarjeta-cuerpo{background:linear-gradient(180deg,#fff,#FDFAF3)}
@media (max-width:980px){ .precios-grid{grid-template-columns:1fr} }
@media (max-width:520px){
  .tarjeta{grid-template-columns:1fr}
  .tarjeta-foto{height:150px}
  .tarjeta-foto img{position:relative}
}
.precios-pie{
  margin-top:26px; padding:22px 26px; background:var(--crema-2);
  border:1px solid var(--linea); border-radius:var(--r); font-size:.92rem; color:var(--tinta-2);
}
.precios-pie b{color:var(--tinta); font-weight:500}

/* ---------- bloques de texto de apoyo ---------- */
.cajas{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.caja{
  background:var(--blanco); border:1px solid var(--linea);
  border-radius:var(--r); padding:28px 26px;
}
.caja h3{margin-bottom:10px}
.caja p{color:var(--tinta-2); font-size:.97rem}
.caja .num{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%; background:var(--oro-suave);
  font-family:var(--serif); font-size:1.05rem; color:var(--tinta); margin-bottom:14px;
}
.cajas.dos{grid-template-columns:repeat(2,1fr)}
@media (max-width:880px){ .cajas, .cajas.dos{grid-template-columns:1fr} }
.remate{
  margin-top:32px; font-family:var(--serif); font-size:clamp(1.3rem,2.2vw,1.72rem);
  line-height:1.4; color:var(--tinta); max-width:56ch;
}
.remate em{font-style:italic; color:var(--oro)}

/* ---------- "manten tu set": linea de tiempo del relleno ---------- */
.ritmo{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,38px); margin-top:44px}
.ritmo-i{position:relative; padding-top:30px}
.ritmo-i::before{
  content:""; position:absolute; left:0; right:calc(-1 * clamp(20px,3vw,38px)); top:5px;
  height:1px; background:var(--linea);
}
.ritmo-i:last-child::before{right:0}
.ritmo-i::after{
  content:""; position:absolute; left:0; top:0; width:11px; height:11px;
  border-radius:50%; background:var(--oro); border:2px solid var(--crema);
}
.ritmo-i .sem{
  display:block; font-family:var(--sans); font-size:.72rem; font-weight:500;
  letter-spacing:.15em; text-transform:uppercase; color:var(--oro); margin-bottom:10px;
}
.ritmo-i h3{margin-bottom:9px}
.ritmo-i p{color:var(--tinta-2); font-size:.96rem}
.ritmo-i.aviso::after{background:var(--tinta)}
.ritmo-i.aviso .sem{color:var(--tinta-2)}
@media (max-width:820px){
  .ritmo{grid-template-columns:1fr; gap:0}
  .ritmo-i{padding:0 0 30px 28px}
  .ritmo-i::before{left:5px; right:auto; top:6px; bottom:0; width:1px; height:auto}
  .ritmo-i:last-child::before{bottom:auto; height:0}
  .ritmo-i::after{top:2px}
}

.cuenta{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:40px}
.cuenta-i{
  border:1px solid var(--linea); border-radius:var(--r);
  padding:26px 28px; background:var(--blanco);
}
.cuenta-i.bien{border-color:var(--oro-suave); background:linear-gradient(180deg,#fff,#FDFAF3)}
.cuenta-i .et{
  display:block; font-size:.72rem; font-weight:500; letter-spacing:.14em;
  text-transform:uppercase; color:var(--tinta-2); margin-bottom:12px;
}
.cuenta-i .cifra{
  display:block; font-family:var(--serif); font-size:2.4rem; font-weight:500;
  line-height:1; color:var(--oro); margin-bottom:12px;
}
.cuenta-i:not(.bien) .cifra{color:var(--tinta-2)}
.cuenta-i p{font-size:.94rem; color:var(--tinta-2)}
.cuenta-pie{
  margin-top:20px; padding:20px 26px; background:var(--tinta); color:#D9CEBE;
  border-radius:var(--r); font-size:.95rem;
}
.cuenta-pie b{color:var(--oro-claro); font-weight:500}
@media (max-width:640px){ .cuenta{grid-template-columns:1fr} }

/* ---------- historia personal (página Sobre mí) ---------- */
.historia{max-width:68ch; margin-inline:auto}
.historia p{
  font-size:clamp(1.06rem,1.4vw,1.2rem); line-height:1.75; color:var(--tinta);
}
.historia p + p{margin-top:24px}
.historia p:first-child::first-letter{
  float:left; font-family:var(--serif); font-size:4.2rem; line-height:.82;
  color:var(--oro); padding:6px 12px 0 0;
}
.nota-lateral{
  margin:26px 0 26px 0; padding:20px 0 20px 24px;
  border-left:2px solid var(--oro-suave);
}
.nota-lateral p{
  font-family:var(--serif); font-style:italic;
  font-size:clamp(1.08rem,1.5vw,1.24rem); line-height:1.5; color:var(--tinta-2);
}
.nota-lateral footer{
  margin-top:10px; font-family:var(--sans); font-style:normal;
  font-size:.78rem; letter-spacing:.09em; text-transform:uppercase; color:var(--oro);
}
.cita-grande{
  margin:44px 0 0; padding:34px 0 0; border-top:1px solid var(--linea);
  font-family:var(--serif); font-size:clamp(1.45rem,2.6vw,2rem); line-height:1.36;
  color:var(--tinta);
}
.cita-grande em{font-style:italic; color:var(--oro)}
.historia .firma{
  margin-top:34px; font-family:var(--serif); font-style:italic;
  font-size:1.28rem; color:var(--tinta-2); line-height:1.5;
}
@media (max-width:600px){
  .historia p:first-child::first-letter{font-size:3.4rem; padding-right:9px}
}

/* ---------- sobre mí ---------- */
.sobre{background:var(--tinta); color:var(--crema); overflow:hidden}
.sobre .ojo{color:var(--oro-claro)}
.sobre-grid{display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(34px,5vw,70px); align-items:center}
.sobre h2{color:var(--crema)}
.sobre p{color:#D9CEBE; margin-top:18px}
.sobre .cita-et{margin-top:30px; font-size:.83rem; letter-spacing:.02em; color:#B9AA95}
.sobre .cita{
  font-family:var(--serif); font-style:italic; font-size:1.35rem;
  color:var(--oro-claro); line-height:1.45; margin-top:12px;
  padding-left:22px; border-left:1px solid rgba(224,180,87,.4);
}
.collage{position:relative; padding:0 0 64px 0}
.collage-a{border-radius:var(--r-lg); overflow:hidden; transform:rotate(-2.4deg); box-shadow:0 18px 44px rgba(0,0,0,.34); width:88%}
.collage-a img{width:100%; aspect-ratio:3/4; object-fit:cover}
.collage-b{
  position:absolute; right:0; bottom:0; width:52%;
  border-radius:var(--r); overflow:hidden; transform:rotate(3.4deg);
  border:5px solid var(--tinta); box-shadow:0 16px 38px rgba(0,0,0,.4);
}
.collage-b img{width:100%; aspect-ratio:4/3; object-fit:cover}
.sobre-datos{display:flex; flex-wrap:wrap; gap:9px; margin-top:30px}
.pill{
  font-size:.74rem; letter-spacing:.09em; text-transform:uppercase;
  padding:8px 16px; border:1px solid rgba(224,180,87,.35);
  border-radius:999px; color:var(--oro-claro);
}
@media (max-width:820px){
  .sobre-grid{grid-template-columns:1fr}
  .collage{padding-bottom:52px}
  .collage-a{transform:rotate(-1.6deg)}
  .collage-b{transform:rotate(2.4deg)}
}

/* ---------- banda con foto a sangre ---------- */
.banda{padding:0}
.banda-in{display:grid; grid-template-columns:.94fr 1.06fr; align-items:center; background:var(--crema-2); border-block:1px solid var(--linea)}
.banda-foto{position:relative; min-height:400px}
.banda-foto img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:center 45%;
  border-radius:0 var(--r-lg) var(--r-lg) 0;
}
.banda-txt{padding:clamp(40px,5vw,76px) clamp(24px,4vw,64px)}
.banda-txt p{margin-top:16px; color:var(--tinta-2); max-width:44ch}
.banda-txt .btn{margin-top:28px}
@media (max-width:820px){
  .banda-in{grid-template-columns:1fr}
  .banda-foto{min-height:280px; order:-1}
  .banda-foto img{border-radius:0}
}

/* ---------- reseña destacada ---------- */
.res-destacada{
  background:var(--blanco); border:1px solid var(--oro-suave); border-radius:var(--r-lg);
  padding:clamp(28px,3.6vw,48px); margin-bottom:20px; box-shadow:var(--sombra);
  display:grid; grid-template-columns:.72fr 1.28fr; gap:clamp(24px,3.4vw,48px);
  text-align:left;
}
.res-destacada .ojo{display:block; margin-bottom:12px}
.res-destacada .lead{font-size:.98rem; color:var(--tinta-2)}
.res-destacada .autor{margin-top:24px; display:flex; align-items:center; gap:12px}
.res-destacada .autor i{
  width:46px; height:46px; border-radius:50%; background:var(--oro-suave);
  display:flex; align-items:center; justify-content:center; flex:0 0 auto;
  font-style:normal; font-size:.8rem; font-weight:500; color:var(--tinta);
}
.res-destacada .autor b{display:block; font-weight:500; font-size:.97rem}
.res-destacada .autor span{display:block; font-size:.8rem; color:var(--tinta-2)}
.res-destacada blockquote{
  margin:0; font-family:var(--serif); font-size:clamp(1.12rem,1.65vw,1.4rem);
  line-height:1.5; color:var(--tinta);
}
.res-destacada blockquote p + p{margin-top:16px}
@media (max-width:860px){ .res-destacada{grid-template-columns:1fr; gap:22px} }

/* ---------- reseñas ---------- */
.res-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.res{background:var(--blanco); border:1px solid var(--linea); border-radius:var(--r); padding:28px 26px; display:flex; flex-direction:column; gap:12px}
.res .estrellas{font-size:.82rem}
.res p{font-size:.98rem; line-height:1.6}
.res footer{margin-top:auto; padding-top:8px; font-size:.82rem; color:var(--tinta-2); letter-spacing:.05em}
.res footer b{color:var(--tinta); font-weight:500}
.avatares{display:flex; justify-content:center; align-items:center; margin-top:34px}
.avatares i{
  width:44px; height:44px; border-radius:50%; margin-left:-12px;
  border:2px solid var(--crema); background:var(--oro-suave); color:var(--tinta);
  display:flex; align-items:center; justify-content:center;
  font-style:normal; font-size:.78rem; font-weight:500;
}
.avatares i:first-child{margin-left:0}
.avatares .mas{background:var(--tinta); color:var(--oro-claro)}
@media (max-width:900px){ .res-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){ .res-grid{grid-template-columns:1fr} }

/* ---------- visita ---------- */
.visita{background:var(--crema-2); border-block:1px solid var(--linea)}
.visita-grid{display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(26px,4vw,52px); align-items:start}
.datos{list-style:none; margin:24px 0 0; padding:0}
.datos li{display:flex; gap:14px; padding:15px 0; border-bottom:1px solid var(--linea)}
.datos li:last-child{border-bottom:0}
.datos .et{flex:0 0 104px; font-size:.73rem; letter-spacing:.13em; text-transform:uppercase; color:var(--oro); padding-top:3px}
.datos a{color:var(--tinta); text-decoration:none; border-bottom:1px solid var(--oro-suave)}
.datos a:hover{border-color:var(--oro)}
.mapa{border:1px solid var(--linea); border-radius:var(--r-lg); overflow:hidden; background:var(--blanco); min-height:360px}
.mapa iframe{width:100%; height:100%; min-height:360px; border:0; display:block}
@media (max-width:820px){ .visita-grid{grid-template-columns:1fr} }

/* ---------- faq ---------- */
.faq-lista{max-width:80ch; margin-inline:auto}
details{border:1px solid var(--linea); border-radius:var(--r); background:var(--blanco); padding:20px 26px; margin-bottom:12px}
details[open]{border-color:var(--oro-suave)}
details summary{
  cursor:pointer; list-style:none; font-family:var(--serif); font-size:1.28rem;
  display:flex; justify-content:space-between; align-items:center; gap:20px;
}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+"; color:var(--oro); font-size:1.45rem; font-family:var(--sans); font-weight:300; flex:0 0 auto}
details[open] summary::after{content:"−"}
details p{margin-top:14px; color:var(--tinta-2); max-width:72ch}
details p + p{margin-top:12px}

/* ---------- cierre ---------- */
.cierre{background:var(--tinta); color:var(--crema)}
.cierre h2{color:var(--crema)}
.cierre .ojo{color:var(--oro-claro)}
.cierre-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,60px)}
.cierre p{color:#D9CEBE; margin-top:16px}
.vias{list-style:none; padding:0; margin:30px 0 0}
.vias li{padding:16px 0; border-bottom:1px solid rgba(255,255,255,.12)}
.vias a{color:var(--crema); text-decoration:none; display:flex; justify-content:space-between; gap:16px; align-items:center}
.vias a:hover strong{color:var(--oro-claro)}
.vias strong{font-family:var(--serif); font-size:1.4rem; font-weight:400; transition:color .2s}
.vias span{font-size:.73rem; letter-spacing:.13em; text-transform:uppercase; color:var(--oro-claro)}
form{display:grid; gap:14px}
label{font-size:.73rem; letter-spacing:.13em; text-transform:uppercase; color:var(--oro-claro); display:block; margin-bottom:7px}
input,select,textarea{
  width:100%; padding:14px 18px; background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.18); border-radius:var(--r-sm); color:#fff;
  font-family:var(--sans); font-size:.98rem; font-weight:300;
}
input:focus,select:focus,textarea:focus{outline:none; border-color:var(--oro-claro)}
select option{background:var(--tinta); color:#fff}
textarea{min-height:96px; resize:vertical}
.form-nota{font-size:.8rem; color:#A99B87; margin-top:4px}
@media (max-width:820px){ .cierre-grid{grid-template-columns:1fr} }

/* ---------- pie ---------- */
.pie{background:#211A13; color:#A99B87; padding:54px 0 110px; font-size:.88rem}
.pie-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:36px; margin-bottom:36px}
.pie img{width:148px; margin-bottom:16px}
.pie h4{font-family:var(--sans); font-size:.73rem; letter-spacing:.15em; text-transform:uppercase; color:var(--oro-claro); margin:0 0 14px}
.pie ul{list-style:none; padding:0; margin:0}
.pie li{margin-bottom:9px}
.pie a{color:#A99B87; text-decoration:none}
.pie a:hover{color:var(--oro-claro)}
.pie-bajo{border-top:1px solid rgba(255,255,255,.1); padding-top:22px; display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; font-size:.8rem}
@media (max-width:760px){ .pie-grid{grid-template-columns:1fr 1fr} }

/* ---------- barra móvil ---------- */
.movil{position:fixed; left:12px; right:12px; bottom:12px; z-index:80; display:none; gap:8px}
.movil a{
  flex:1; text-align:center; padding:15px 8px; text-decoration:none; border-radius:999px;
  font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; font-weight:500;
  box-shadow:var(--sombra-alta);
}
.movil .m1{background:var(--oro); color:#fff}
.movil .m2{background:var(--blanco); color:var(--tinta); border:1px solid var(--linea)}
@media (max-width:760px){ .movil{display:flex} }

@media (prefers-reduced-motion:reduce){ *{transition:none !important; scroll-behavior:auto} }