/* Parcela Eventos Lo Cañas — hoja de estilos principal (copia de la maqueta).
   Unico cambio respecto de la maqueta: se quito el @import de Google Fonts,
   que ahora se encola desde inc/enqueue.php con preconnect. */

:root{
  --crema:#F7F1E8;
  --crema-2:#EFE4D5;
  --papel:#FFFFFF;
  --tinta:#3A2A1E;
  --tinta-suave:#6B5747;
  --muted:#8A7361;
  --siena:#A0522D;
  --siena-osc:#7F3F21;
  --oliva:#7E8B5A;
  --dorado:#C9A227;
  --linea:rgba(58,42,30,.14);
  --sombra:0 1px 2px rgba(58,42,30,.05), 0 12px 32px -12px rgba(58,42,30,.22);
  --sombra-alta:0 2px 4px rgba(58,42,30,.06), 0 26px 60px -18px rgba(58,42,30,.34);
  --radio:14px;
  --display:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --texto:'Karla', 'Helvetica Neue', Arial, sans-serif;
  --max:1240px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--crema); color:var(--tinta);
  font-family:var(--texto); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased; text-wrap:pretty;
}
img{display:block; max-width:100%; height:auto}
a{color:var(--siena); text-decoration:none; transition:color .18s ease}
a:hover{color:var(--siena-osc)}
h1,h2,h3,h4{font-family:var(--display); font-weight:600; line-height:1.12; margin:0; letter-spacing:-.01em}
p{margin:0}
ul{margin:0; padding:0; list-style:none}
:focus-visible{outline:2px solid var(--siena); outline-offset:3px}

.contenedor{width:100%; max-width:var(--max); margin:0 auto; padding:0 24px}
.seccion{padding:88px 0}
.seccion--clara{background:var(--papel)}
.seccion--calida{background:linear-gradient(180deg,#EFE4D5 0%,#F7F1E8 100%)}
.solo-lectores{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

/* ---------- Etiquetas y títulos ---------- */
.kicker{
  font-family:var(--texto); font-size:12px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--siena); margin-bottom:14px;
}
.titulo{font-size:clamp(30px,4vw,46px)}
.titulo--hero{font-size:clamp(38px,5.6vw,66px); color:#fff}
.bajada{font-size:18px; color:var(--tinta-suave); max-width:62ch; margin-top:18px}
.regla{width:56px; height:2px; background:var(--dorado); border:0; margin:22px 0 0}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:52px; padding:0 26px; border:0; border-radius:999px; cursor:pointer;
  font-family:var(--texto); font-size:16px; font-weight:600; letter-spacing:.01em;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease;
}
.btn--primario{background:var(--siena); color:#fff; box-shadow:0 10px 24px -12px rgba(160,82,45,.9)}
.btn--primario:hover{background:var(--siena-osc); color:#fff; transform:translateY(-1px)}
.btn--fantasma{background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.6)}
.btn--fantasma:hover{background:rgba(255,255,255,.14); color:#fff}
.btn--linea{background:transparent; color:var(--siena); border:1.5px solid var(--siena)}
.btn--linea:hover{background:var(--siena); color:#fff}
.btn--bloque{width:100%}

/* ---------- Cabecera ---------- */
.cabecera{
  position:sticky; top:0; z-index:60;
  background:rgba(247,241,232,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--linea);
}
.cabecera__fila{display:flex; align-items:center; gap:28px; min-height:76px}
.cabecera__logo img{height: 70px;width:auto}
.nav{margin-left:auto; display:flex; align-items:center; gap:26px}
.nav a{color:var(--tinta); font-size:15px; font-weight:500}
.nav a:hover{color:var(--siena)}
.cabecera__tel{font-weight:600; color:var(--tinta); white-space:nowrap}

/* ---------- Hero ---------- */
.hero{position:relative; color:#fff; overflow:hidden; background:#2A1D14}
.hero__fondo{position:absolute; inset:0}
.hero__fondo img{width:100%; height:100%; object-fit:cover; opacity:.62}
.hero__velo{
  position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(42,29,20,.9) 0%, rgba(42,29,20,.62) 46%, rgba(42,29,20,.42) 100%);
}
.hero__grid{
  position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:56px;
  align-items:start; padding-block:76px 96px;
}
.hero__texto{max-width:640px}
.hero__bajada{font-size:19px; color:rgba(255,255,255,.86); margin-top:22px; max-width:52ch}
.hero__acciones{display:flex; flex-wrap:wrap; gap:14px; margin-top:34px}
.hero__datos{display:flex; flex-wrap:wrap; gap:14px 34px; margin-top:42px; padding-top:26px; border-top:1px solid rgba(255,255,255,.22)}
.hero__dato{display:flex; flex-direction:column}
.hero__dato b{font-family:var(--display); font-size:30px; font-weight:600; line-height:1}
.hero__dato span{font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.72); margin-top:6px}

/* ---------- Formulario ---------- */
.tarjeta-form{
  background:var(--papel); color:var(--tinta); border-radius:18px;
  padding:30px; box-shadow:var(--sombra-alta); border:1px solid rgba(255,255,255,.6);
}
.tarjeta-form h2{font-size:27px}
.tarjeta-form__nota{font-size:14px; color:var(--muted); margin-top:8px}
.campo{display:block; margin-top:16px}
.campo span{display:block; font-size:13px; font-weight:600; letter-spacing:.04em; color:var(--tinta-suave); margin-bottom:6px}
.campo input,.campo select,.campo textarea{
  width:100%; min-height:48px; padding:12px 14px; font-family:var(--texto); font-size:16px;
  color:var(--tinta); background:#FCF9F5; border:1px solid var(--linea); border-radius:10px;
  transition:border-color .16s ease, box-shadow .16s ease;
}
.campo textarea{min-height:96px; resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none; border-color:var(--siena); box-shadow:0 0 0 3px rgba(160,82,45,.14);
}
.campo--doble{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.campo--doble > label{margin-top:0}
.form__legal{font-size:12.5px; color:var(--muted); margin-top:14px; line-height:1.5}

/* ---------- Grillas ---------- */
.grid{display:grid; gap:26px}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
.grid--historia{grid-template-columns:1fr 1fr; gap:56px; align-items:center}

.tarjeta{
  background:var(--papel); border:1px solid var(--linea); border-radius:var(--radio);
  padding:28px; box-shadow:var(--sombra); transition:transform .18s ease, box-shadow .18s ease;
}
.tarjeta:hover{transform:translateY(-3px); box-shadow:var(--sombra-alta)}
.tarjeta h3{font-size:23px; margin-bottom:10px}
.tarjeta p{color:var(--tinta-suave); font-size:15.5px}
.tarjeta__icono{
  width:44px; height:44px; border-radius:12px; background:var(--crema-2);
  display:grid; place-items:center; margin-bottom:16px; color:var(--siena);
}
.dato-grande{font-family:var(--display); font-size:44px; font-weight:600; color:var(--siena); line-height:1}

/* ---------- Bloques por tipo de evento ---------- */
.bloque-evento{
  display:grid; grid-template-columns:1fr 1.25fr; gap:48px; align-items:center;
  padding:52px 0; border-top:1px solid var(--linea);
}
.bloque-evento:first-of-type{border-top:0}
.bloque-evento--invertido .bloque-evento__fotos{order:-1}
.bloque-evento__fotos{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.bloque-evento__fotos figure{margin:0; overflow:hidden; border-radius:12px; box-shadow:var(--sombra)}
.bloque-evento__fotos figure:first-child{grid-column:1 / -1}
.bloque-evento__fotos img{width:100%; height:100%; object-fit:cover; aspect-ratio:16/9; transition:transform .5s ease}
.bloque-evento__fotos figure:hover img{transform:scale(1.04)}
.lista-marcas{margin-top:20px; display:flex; flex-direction:column; gap:9px}
.lista-marcas li{position:relative; padding-left:24px; color:var(--tinta-suave); font-size:15.5px}
.lista-marcas li::before{
  content:''; position:absolute; left:0; top:9px; width:9px; height:9px;
  border-radius:50%; background:var(--oliva);
}

/* ---------- Espacios ---------- */
.espacio{border-radius:var(--radio); overflow:hidden; background:var(--papel); border:1px solid var(--linea); box-shadow:var(--sombra)}
.espacio img{width:100%; aspect-ratio:4/3; object-fit:cover}
.espacio__cuerpo{padding:22px 24px 26px}
.espacio__cuerpo h3{font-size:22px; margin-bottom:8px}
.espacio__cuerpo p{font-size:15.5px; color:var(--tinta-suave)}

/* ---------- Testimonios ---------- */
.cita{background:var(--papel); border:1px solid var(--linea); border-radius:var(--radio); padding:30px; box-shadow:var(--sombra)}
.cita blockquote{margin:0; font-family:var(--display); font-size:21px; line-height:1.42}
.cita figcaption{margin-top:16px; font-size:14px; color:var(--muted); letter-spacing:.02em}

/* ---------- FAQ ---------- */
.faq{max-width:840px; margin:0 auto}
.faq details{background:var(--papel); border:1px solid var(--linea); border-radius:12px; padding:18px 22px; margin-top:12px}
.faq summary{
  cursor:pointer; font-family:var(--display); font-size:21px; font-weight:600;
  list-style:none; display:flex; justify-content:space-between; gap:16px; align-items:center;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+'; color:var(--siena); font-family:var(--texto); font-size:24px; line-height:1}
.faq details[open] summary::after{content:'–'}
.faq p{margin-top:12px; color:var(--tinta-suave); font-size:15.5px}

/* ---------- Normas ---------- */
.normas{background:#2E2118; color:#F1E7DA}
.normas .titulo{color:#fff}
.normas .bajada{color:rgba(241,231,218,.78)}
.norma{border:1px solid rgba(241,231,218,.18); border-radius:12px; padding:24px; background:rgba(255,255,255,.03)}
.norma h3{font-size:20px; color:#fff; margin-bottom:8px}
.norma p{font-size:15px; color:rgba(241,231,218,.76)}

/* ---------- Mapa ---------- */
.mapa{border:0; width:100%; height:420px; border-radius:var(--radio); box-shadow:var(--sombra)}

/* ---------- Pie ---------- */
.pie{background:#241A12; color:#D9CBBC; padding:64px 0 28px}
.pie a{color:#E8C79A}
.pie a:hover{color:#fff}
.pie__grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:38px}
.pie h3{font-family:var(--texto); font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:#A08D7B; margin-bottom:14px}
.pie li{margin-bottom:9px; font-size:15px}
.pie__legal{
  margin-top:48px; padding-top:20px; border-top:1px solid rgba(217,203,188,.18);
  display:flex; flex-wrap:wrap; gap:8px 22px; font-size:13.5px; color:#A08D7B;
}

/* ---------- Flotantes ---------- */
.flotante-wsp{
  position:fixed; right:20px; bottom:20px; z-index:80;
  width:60px; height:60px; border-radius:50%; background:#25D366; color:#fff;
  display:grid; place-items:center; box-shadow:0 12px 30px -8px rgba(0,0,0,.45);
  transition:transform .18s ease;
}
.flotante-wsp:hover{transform:scale(1.06); color:#fff}
.flotante-cotiza{display:none}

.modal{
  position:fixed; inset:0; z-index:90; display:none;
  padding:20px; overflow-y:auto; background:rgba(36,26,18,.62); backdrop-filter:blur(3px);
}
.modal[data-abierto="true"]{display:block}
.modal__panel{max-width:520px; margin:40px auto}
.modal__cerrar{
  position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:50%;
  border:1px solid var(--linea); background:#fff; color:var(--tinta); font-size:20px; cursor:pointer;
}
.modal__caja{position:relative}
body[data-modal="abierto"]{overflow:hidden}

/* ---------- Documentos legales ---------- */
.doc{max-width:820px; margin:0 auto; padding:64px 24px 88px}
.doc h1{font-size:clamp(32px,4.4vw,46px)}
.doc h2{font-size:25px; margin-top:38px}
.doc p,.doc li{color:var(--tinta-suave); font-size:16.5px; margin-top:14px}
.doc ul{list-style:disc; padding-left:22px}
.doc li{margin-top:8px}
.doc__meta{font-size:14px; color:var(--muted); margin-top:12px}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .hero__grid{grid-template-columns:1fr; gap:40px}
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .pie__grid{grid-template-columns:1fr 1fr; gap:32px}
}
@media (max-width:900px){
  .grid--3{grid-template-columns:1fr}
  .grid--historia{grid-template-columns:1fr; gap:32px}
  .bloque-evento,.bloque-evento--invertido .bloque-evento__fotos{grid-template-columns:1fr; order:0}
  .bloque-evento{gap:28px; padding:40px 0}
  .nav{display:none}
}
@media (max-width:760px){
  body{font-size:16.5px}
  .seccion{padding:60px 0}
  .grid--2{grid-template-columns:1fr}
  .hero__grid{padding-block:52px 64px}
  /* El formulario del hero no se muestra en mobile: se abre desde el botón flotante */
  .hero__form{display:none}
  .flotante-cotiza{
    display:inline-flex; position:fixed; left:16px; right:96px; bottom:20px; z-index:80;
    min-height:56px; border-radius:999px; background:var(--siena); color:#fff;
    align-items:center; justify-content:center; gap:10px;
    font-family:var(--texto); font-size:16.5px; font-weight:600; border:0;
    box-shadow:0 14px 34px -10px rgba(0,0,0,.5);
  }
  .flotante-cotiza:hover{color:#fff}
  .pie__grid{grid-template-columns:1fr}
  .mapa{height:320px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important}
  html{scroll-behavior:auto}
}