/* RA Chaves, landing DEMO v2 (12/10/2026). Identidad tomada de las piezas gráficas de Ra:
   papel, mayúsculas espaciadas, óxido solo en punto, filetes, precios y botones; montañas a trazo. */
@font-face{font-family:"Marcellus";src:url("fonts/marcellus.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Quicksand";src:url("fonts/quicksand-var.woff2") format("woff2");font-weight:300 700;font-display:swap}

:root{
  --papel:#EFE7DA;
  --papel-claro:#F5EFE5;
  --carbon:#2E2B28;
  --oxido:#8B452E;
  --oxido-hondo:#6E3422;
  --filete:#A86A4E;
  --linea:#DCCBB7;
  --borde:#C9A88E;
  --trazo:#B08F74;
  --gris:#5C544B;
  --gris-suave:#6E6559;
  --hueco:#E3D7C6;
  --display:"Marcellus",Georgia,serif;
  --texto:"Quicksand",system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--papel);color:var(--carbon);font-family:var(--texto);font-weight:300;font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:var(--oxido)}
a:hover{color:var(--oxido-hondo)}
:focus-visible{outline:2px solid var(--oxido);outline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:400;text-transform:uppercase;margin:0}
p{margin:0}

.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.centro{text-align:center}

/* Barra */
.barra{border-bottom:1px solid var(--linea)}
.barra .wrap{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px}
.marca{font-family:var(--display);letter-spacing:.32em;font-size:15px;color:var(--carbon);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.demo{background:var(--carbon);color:#EFE7DA;text-align:center;font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:6px 12px}
.link{font-family:var(--display);letter-spacing:.2em;text-transform:uppercase;font-size:14px;text-decoration:none;border-bottom:1px solid var(--borde);padding:14px 0 6px;display:inline-block}

/* Filete con punto */
.filete{display:flex;align-items:center;justify-content:center;gap:12px;margin:22px auto}
.filete::before,.filete::after{content:"";height:1px;width:90px;background:var(--filete)}
.filete span{width:9px;height:9px;border-radius:50%;background:var(--oxido)}
.filete--ancho::before,.filete--ancho::after{width:min(260px,28vw)}
.filete--ancho span{width:12px;height:12px}
.filete--ancho{margin:34px auto}
.filete--oscuro::before,.filete--oscuro::after{background:#C08A6E}
.filete--oscuro span{background:#C0704E}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 32px;border:1px solid var(--oxido);border-radius:999px;color:var(--oxido);text-decoration:none;font-family:var(--display);font-size:14px;letter-spacing:.2em;text-transform:uppercase;text-align:center;background:rgba(255,250,242,.35);transition:background-color .2s,color .2s}
.btn:hover{background:var(--oxido);color:#F7F1E6}
.btn--lleno{background:var(--oxido);color:#F7F1E6}
.btn--lleno:hover{background:var(--oxido-hondo);color:#F7F1E6}
.acciones{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}

/* Hero */
.hero{text-align:center;padding:64px 24px 0;overflow:hidden}
.hero .montanas{margin-left:-24px;margin-right:-24px;width:calc(100% + 48px)}
.hero-logo{width:420px;max-width:88%;height:auto;margin:0 auto}
.hero h1{margin:32px auto 0;max-width:900px;font-size:clamp(36px,6.4vw,84px);line-height:1.08;letter-spacing:.08em}
.hero .bajada{max-width:620px;margin:0 auto;font-size:clamp(18px,2vw,22px);line-height:1.75}
.hero .acciones{margin-top:38px}
.montanas{display:block;width:100%;height:auto;margin-top:48px;pointer-events:none;user-select:none}

/* Puertas */
.puertas{border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);background:var(--papel-claro)}
.puertas ul{list-style:none;margin:0 auto;padding:0;max-width:1180px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.puertas li{padding:40px 28px;text-align:center}
.puertas li+li{border-left:1px solid #CDB9A3}
.puertas h2{font-size:22px;letter-spacing:.24em}
.puertas p{margin-top:10px;color:var(--gris);line-height:1.6}

/* Secciones */
.seccion{padding-top:110px;padding-bottom:110px}
.titulo{font-size:clamp(30px,4.2vw,52px);letter-spacing:.14em}
.titulo--chico{font-size:clamp(26px,3.2vw,40px)}
.intro{max-width:560px;margin:0 auto;font-size:19px}
.fila{display:flex;flex-wrap:wrap;gap:64px;align-items:center}
.fila>*{flex:1 1 380px;min-width:0}
.fila--inversa{flex-direction:row-reverse}
.foto{overflow:hidden;border-radius:4px;background:var(--hueco) center/cover no-repeat}
.foto img{width:100%;height:100%;object-fit:cover}
.r45{aspect-ratio:4/5}
.r43{aspect-ratio:4/3}
.r11{aspect-ratio:1/1}

/* Producto */
.producto{margin-top:88px}
.producto+.producto{margin-top:110px}
.producto h3{font-size:34px;letter-spacing:.12em}
.producto .poesia{margin:14px 0 26px;font-size:19px}
.ficha{margin:0;display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:28px;line-height:1.5}
.ficha dt,.ficha dd{margin:0;padding:12px 0;border-top:1px solid var(--linea)}
.ficha dt:nth-last-of-type(1),.ficha dd:last-child{border-bottom:1px solid var(--linea)}
.ficha dt{font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:var(--gris-suave);padding-top:15px}
.compra{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;gap:20px 28px}
.precio{font-family:var(--display);font-size:30px;color:var(--oxido)}

/* Detalles */
.detalles{margin-top:110px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
figure{margin:0}
figcaption{margin-top:14px;text-align:center;font-family:var(--display);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--gris)}

/* Valores */
.valores{max-width:860px;margin:0 auto;padding:40px 24px 20px;text-align:center}
.tabla-caja{border:1px solid var(--borde);border-radius:14px;overflow:hidden;background:#F6F0E6}
.tabla-caja table{width:100%;border-collapse:collapse;text-align:left}
.tabla-caja th{padding:20px 28px;font-family:var(--display);font-weight:400;font-size:16px;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid var(--linea)}
.tabla-caja td{padding:15px 28px;font-weight:400;border-bottom:1px solid var(--linea)}
.tabla-caja tr:last-child td{border-bottom:0}
.tabla-caja .num{text-align:right;font-family:var(--display);font-size:19px;white-space:nowrap}
.tabla-caja .destacada td{color:var(--oxido)}
.tabla-caja .destacada td:first-child{font-family:var(--display);letter-spacing:.1em;text-transform:uppercase}
.nota{margin-top:20px;font-size:14px;color:var(--gris-suave)}

/* Pasos */
.pasos{position:relative;list-style:none;margin:64px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;text-align:center}
.pasos::before{content:"";position:absolute;left:12.5%;right:12.5%;top:6px;height:1px;background:var(--borde)}
.pasos li{position:relative}
.pasos li::before{content:"";display:block;width:13px;height:13px;border-radius:50%;background:var(--oxido);margin:0 auto 22px}
.pasos .romano{font-family:var(--display);font-size:15px;letter-spacing:.2em;color:var(--oxido)}
.pasos p{margin:10px auto 0;max-width:220px;line-height:1.65}
.recorrido{margin-top:72px;gap:24px}

/* Gongs */
.banda{background:var(--papel-claro);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.circulo{border-radius:50%;max-width:460px;margin:0 auto}

/* Taller */
.taller-foto{max-width:400px;margin:0 auto;aspect-ratio:3/4}
.taller h3{font-size:22px;letter-spacing:.1em;text-transform:none}

/* Templo */
.templo{background:var(--carbon);color:#EFE7DA}
.templo .foto{position:relative;background-color:#3A3632}
.etiqueta-ia{position:absolute;left:12px;bottom:12px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;background:rgba(46,43,40,.85);color:#EFE7DA;padding:6px 10px;border-radius:3px}
.servicios{margin:32px auto 0;max-width:430px;text-align:left;line-height:1.55}
.servicios li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid #514A43}
.servicios li:last-child{border-bottom:1px solid #514A43}
.servicios ul{list-style:none;margin:0;padding:0}
.servicios span:last-child{font-family:var(--display);white-space:nowrap}
.btn--claro{border-color:#D9A487;color:#F1E3D6;background:transparent}
.btn--claro:hover{background:#D9A487;color:var(--carbon)}
.aviso{margin-top:22px;font-size:14px;color:#B9AE9F}

/* Ra */
.retrato{width:260px;height:260px;border-radius:50%;margin:0 auto}
.retrato img{object-position:center 30%}

/* Consulta */
.consulta{border:1px solid var(--borde);border-radius:14px;padding:56px 32px;text-align:center;background:#F6F0E6;max-width:712px;margin:0 auto}

/* Preguntas */
.preguntas{max-width:712px;margin:0 auto}
details{border-top:1px solid var(--linea);padding:6px 0}
details:last-of-type{border-bottom:1px solid var(--linea)}
summary{cursor:pointer;list-style:none;font-family:var(--display);font-size:19px;letter-spacing:.04em;padding:14px 32px 14px 0;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:4px;top:12px;color:var(--oxido);font-size:22px}
details[open] summary::after{content:"\2212"}
details p{padding:0 0 18px}

/* Pie */
.pie{text-align:center;padding-top:44px;border-top:1px solid var(--linea);overflow:hidden}
.pie .nombre{font-family:var(--display);font-size:26px;letter-spacing:.3em}
.pie .sub{margin-top:8px;font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--gris)}
.pie .enlaces{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:center;align-items:center}
.pie .lugar{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--gris)}
.pie .montanas{margin-top:12px}
.pie .legal{padding:0 24px 22px;font-size:14px;color:var(--gris-suave)}

/* WhatsApp flotante */
.flotante{position:fixed;right:16px;bottom:16px;z-index:10;min-height:48px;padding:0 22px;box-shadow:0 6px 20px rgba(46,43,40,.18)}

@media (max-width:900px){
  .detalles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  body{font-size:16px}
  .seccion{padding-top:80px;padding-bottom:80px}
  .puertas ul{grid-template-columns:minmax(0,1fr)}
  .puertas li+li{border-left:0;border-top:1px solid #CDB9A3}
  .puertas li{padding:28px 24px}
  .pasos{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}
  .pasos::before{display:none}
  .fila{gap:36px}
  .fila--inversa{flex-direction:row}
  .producto h3{font-size:28px}
  .tabla-caja th,.tabla-caja td{padding-left:10px;padding-right:10px}
  .tabla-caja td:first-child{width:46%}
  .tabla-caja th{font-size:13px;letter-spacing:.1em}
  .tabla-caja td{font-size:15px}
  .tabla-caja .num{font-size:16px}
  .consulta{padding:44px 20px}
  .hero .montanas,.pie .montanas{width:150%;max-width:none;margin-left:-25%;margin-right:0}
  .formacion-fotos{grid-template-columns:repeat(3,minmax(0,1fr))}
  .btn{padding:0 22px;letter-spacing:.14em}

}

/* Taller: formación y encuentros */
.formacion{margin-top:72px;display:flex;flex-wrap:wrap;gap:56px;align-items:center}
.formacion-texto{flex:1 1 420px;min-width:0}
.formacion-texto h3{margin-bottom:14px}
.formacion-fotos{flex:1 1 420px;min-width:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.formacion-fotos .foto{aspect-ratio:9/16}
.etapas{counter-reset:etapa;list-style:none;margin:24px 0;padding:0}
.etapas li{counter-increment:etapa;display:flex;gap:18px;padding:11px 0;border-top:1px solid var(--linea)}
.etapas li:last-child{border-bottom:1px solid var(--linea)}
.etapas li::before{content:counter(etapa);font-family:var(--display);color:var(--oxido);min-width:16px}
.lleva{font-family:var(--display);font-size:20px;letter-spacing:.05em}
.encuentros{margin:88px auto 0;max-width:640px;text-align:center;padding:44px 8px;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.encuentros p{margin:12px auto 26px;max-width:480px}

.galeria-taller{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:56px}
.galeria-taller figure{margin:0}
@media (min-width:900px){.galeria-taller{grid-template-columns:repeat(4,minmax(0,1fr))}}
