/* En la web las fuentes vienen de Google Fonts (20 KB en vez de 400 KB).
   El ZIP que descarga el cliente las lleva incrustadas. */
/* ==========================================================================
   GREENNATURE — SPA & BIENESTAR NATURAL
   Leuname Software · leunamesoftware.com
   ========================================================================== */

:root{
  --verde:#3f7d52; --verde-osc:#2c5b3b; --verde-cla:#6ba97d; --verde-suave:#e8f2ea;
  --terra:#c98a53; --terra-osc:#a86b3a; --terra-suave:#f7e9da;
  --crema:#faf7f0; --crema2:#f1ece0; --blanco:#fff;
  --tinta:#233527; --tinta2:#3f5346; --apagado:#7c8a7f; --linea:#e2e6de;
  --ok:#2e8b57; --error:#c0492f;
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --radio:18px; --ancho:1300px;
  --sombra:0 6px 26px rgba(35,53,39,.08);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--crema);color:var(--tinta);font-family:var(--sans);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--terra);outline-offset:3px}

.env{max-width:var(--ancho);margin:0 auto;padding:0 26px}
section{padding:74px 0}

h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.16;letter-spacing:-.01em}
h2{font-size:clamp(26px,3.1vw,36px)}
h3{font-size:19px}

.rotulo{display:inline-flex;align-items:center;gap:8px;padding:6px 15px;border-radius:99px;
  background:var(--verde-suave);color:var(--verde-osc);font-size:12px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;font-family:var(--sans)}
.cab-sec{margin-bottom:36px}
.cab-sec.centro{text-align:center;max-width:640px;margin-left:auto;margin-right:auto}
.cab-sec p{color:var(--apagado);margin-top:12px;font-size:15.5px}

/* ---------------- Botones ---------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 26px;border:2px solid transparent;border-radius:99px;
  font-family:var(--sans);font-size:14.5px;font-weight:700;
  cursor:pointer;transition:.2s;white-space:nowrap}
.btn svg{flex-shrink:0}
.btn-verde{background:var(--verde);color:#fff;box-shadow:0 8px 22px rgba(63,125,82,.28)}
.btn-verde:hover{background:var(--verde-osc);transform:translateY(-2px)}
.btn-terra{background:var(--terra);color:#fff;box-shadow:0 8px 22px rgba(201,138,83,.3)}
.btn-terra:hover{background:var(--terra-osc);transform:translateY(-2px)}
.btn-linea{border-color:var(--verde);color:var(--verde);background:transparent}
.btn-linea:hover{background:var(--verde);color:#fff}
.btn-blanco{background:#fff;color:var(--verde-osc);border-color:var(--linea)}
.btn-blanco:hover{border-color:var(--verde)}
.btn-peq{padding:10px 20px;font-size:13.5px}

/* ---------------- Barra superior ---------------- */
.barra-top{background:var(--verde-osc);color:#dcebe0;font-size:12.5px}
.barra-top .env{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-top:9px;padding-bottom:9px;flex-wrap:wrap}
.barra-top .izq{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.barra-top span,.barra-top a{display:inline-flex;align-items:center;gap:7px}
.barra-top a:hover{color:#fff}
.barra-top svg{color:var(--terra);flex-shrink:0}

/* ---------------- Cabecera ---------------- */
.cab{position:sticky;top:0;z-index:80;background:rgba(250,247,240,.96);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--linea)}
.cab .env{display:flex;align-items:center;gap:22px;padding-top:14px;padding-bottom:14px}
.marca{display:flex;align-items:center;gap:12px;flex-shrink:0}
.marca-txt strong{display:block;font-family:var(--serif);font-size:23px;font-weight:700;line-height:1}
.marca-txt span{display:block;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--verde);margin-top:3px;font-family:var(--sans)}
.menu{display:flex;gap:28px;margin:0 auto}
.menu a{font-size:14.5px;font-weight:500;color:var(--tinta2);padding:5px 0;
  border-bottom:2px solid transparent;transition:.2s}
.menu a:hover,.menu a.act{color:var(--verde);border-color:var(--terra)}
.abrir-menu{display:none;background:none;border:1px solid var(--linea);border-radius:12px;
  width:44px;height:44px;color:var(--tinta);cursor:pointer;align-items:center;justify-content:center}
.menu-movil{display:none;border-top:1px solid var(--linea);background:#fff}
.menu-movil.ver{display:block}
.menu-movil a{display:block;padding:13px 26px;border-bottom:1px solid var(--linea);font-size:15px}

/* ---------------- Portada ---------------- */
.portada{position:relative;overflow:hidden;padding:0;
  background:linear-gradient(160deg,var(--verde-suave) 0%,var(--crema) 62%)}
.portada .env{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:center;
  padding-top:58px;padding-bottom:58px}
.portada h1{font-size:clamp(33px,4.4vw,52px);margin-bottom:18px}
.portada h1 em{font-style:italic;color:var(--verde)}
.portada p{font-size:17px;color:var(--tinta2);max-width:450px;margin-bottom:28px;font-family:var(--sans)}
.portada-botones{display:flex;gap:13px;flex-wrap:wrap}
.portada-sellos{display:flex;gap:26px;margin-top:30px;flex-wrap:wrap}
.sello{display:flex;align-items:center;gap:10px}
.sello svg{color:var(--verde);flex-shrink:0}
.sello strong{display:block;font-size:15px;line-height:1.2;font-family:var(--sans)}
.sello span{font-size:12.5px;color:var(--apagado)}
.portada-arte{position:relative;max-width:470px;margin-left:auto}
.portada-arte svg{width:100%;height:auto}

/* ---------------- Servicios ---------------- */
.servicios{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.servicio{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);
  padding:28px 24px;transition:.24s;position:relative;overflow:hidden}
.servicio:hover{transform:translateY(-6px);box-shadow:0 18px 38px rgba(35,53,39,.12);
  border-color:var(--verde-cla)}
.servicio-ic{width:56px;height:56px;border-radius:16px;background:var(--verde-suave);
  color:var(--verde);display:flex;align-items:center;justify-content:center;margin-bottom:16px;
  transition:.24s}
.servicio:hover .servicio-ic{background:var(--terra-suave);color:var(--terra-osc)}
.servicio h3{margin-bottom:8px}
.servicio p{font-size:14px;color:var(--apagado);line-height:1.6;font-family:var(--sans)}
.servicio .precio{margin-top:12px;font-family:var(--serif);font-weight:700;color:var(--verde)}

/* ---------------- Franja filosofía ---------------- */
.franja-fil{background:linear-gradient(120deg,var(--verde-osc),var(--verde));color:#fff;padding:0;
  position:relative;overflow:hidden}
.franja-fil .env{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;
  padding-top:64px;padding-bottom:64px;position:relative;z-index:2}
.franja-fil h2{font-size:clamp(24px,3vw,34px);margin-bottom:14px}
.franja-fil p{color:#d7ebde;font-family:var(--sans);font-size:15.5px;line-height:1.7}
.estadisticas{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.estadistica{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);
  border-radius:14px;padding:20px}
.estadistica strong{display:block;font-family:var(--serif);font-size:32px}
.estadistica span{font-size:12.5px;color:#cfe6d7;font-family:var(--sans)}

/* ---------------- Planes ---------------- */
.planes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:start}
.plan{background:#fff;border:2px solid var(--linea);border-radius:var(--radio);padding:30px 26px;
  transition:.24s;position:relative}
.plan:hover{border-color:var(--verde-cla)}
.plan.destacado{border-color:var(--terra);box-shadow:0 16px 40px rgba(201,138,83,.18)}
.plan-eti{position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--terra);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;padding:5px 16px;border-radius:99px;white-space:nowrap;font-family:var(--sans)}
.plan h3{font-size:20px;margin-bottom:6px}
.plan-para{font-size:13.5px;color:var(--apagado);margin-bottom:18px;font-family:var(--sans)}
.plan-precio{font-family:var(--serif);font-size:40px;font-weight:700;color:var(--verde);line-height:1}
.plan-precio small{font-family:var(--sans);font-size:14px;font-weight:400;color:var(--apagado)}
.plan ul{list-style:none;margin:20px 0 24px}
.plan li{display:flex;gap:10px;font-size:14px;margin-bottom:11px;color:var(--tinta2);font-family:var(--sans)}
.plan li svg{color:var(--verde);flex-shrink:0;margin-top:3px}
.plan .btn{width:100%}

/* ---------------- Equipo ---------------- */
.equipo{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.ficha{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);
  padding:26px 20px;text-align:center;transition:.22s}
.ficha:hover{box-shadow:var(--sombra);border-color:var(--verde-cla)}
.ficha-foto{width:96px;height:96px;margin:0 auto 16px;border-radius:50%;overflow:hidden;
  background:var(--verde-suave);display:flex;align-items:center;justify-content:center;
  color:var(--verde);font-family:var(--serif);font-size:26px;font-weight:700}
.ficha h3{font-size:16.5px;margin-bottom:3px}
.ficha .cargo{font-size:13px;color:var(--terra-osc);font-weight:600;margin-bottom:9px;font-family:var(--sans)}
.ficha p{font-size:13px;color:var(--apagado);line-height:1.55;font-family:var(--sans)}

/* ---------------- Reserva ---------------- */
.reserva{background:var(--verde-suave)}
.reserva-rejilla{display:grid;grid-template-columns:1fr 1.1fr;gap:44px;align-items:start}
.reserva-lista{list-style:none;margin-top:22px}
.reserva-lista li{display:flex;gap:13px;margin-bottom:16px;font-family:var(--sans)}
.reserva-lista svg{color:var(--verde);flex-shrink:0;margin-top:3px}
.reserva-lista strong{display:block;font-size:15px}
.reserva-lista span{font-size:13.5px;color:var(--apagado)}
.formulario{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);
  padding:32px 28px;box-shadow:var(--sombra)}
.campo{margin-bottom:15px}
.campo label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;font-family:var(--sans)}
.campo input,.campo select,.campo textarea{width:100%;padding:12px 14px;border:1px solid var(--linea);
  border-radius:12px;background:var(--crema);color:var(--tinta);font-family:var(--sans);
  font-size:14.5px;transition:.18s}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--verde);
  background:#fff;box-shadow:0 0 0 3px rgba(63,125,82,.13)}
.campo textarea{resize:vertical;min-height:76px}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}
.aviso-form{margin-top:14px;padding:13px 16px;border-radius:12px;font-size:13.5px;display:none;font-family:var(--sans)}
.aviso-form.ok{display:block;background:rgba(46,139,87,.1);border:1px solid rgba(46,139,87,.35);color:var(--ok)}
.aviso-form.mal{display:block;background:rgba(192,73,47,.09);border:1px solid rgba(192,73,47,.3);color:var(--error)}

/* ---------------- Opiniones ---------------- */
.opiniones{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.opinion{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:26px}
.estrellas{color:var(--terra);font-size:14px;letter-spacing:2px;margin-bottom:12px}
.opinion p{font-size:14.5px;color:var(--tinta2);margin-bottom:18px;font-family:var(--sans)}
.opinion-quien{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid var(--linea)}
.opinion-ini{width:42px;height:42px;border-radius:50%;background:var(--verde-suave);color:var(--verde);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0;font-family:var(--sans)}
.opinion-quien strong{display:block;font-size:14px;font-family:var(--sans)}
.opinion-quien span{font-size:12.5px;color:var(--apagado)}

/* ---------------- Preguntas ---------------- */
.faq-lista{max-width:820px;margin:0 auto}
.faq{background:#fff;border:1px solid var(--linea);border-radius:14px;margin-bottom:11px;overflow:hidden}
.faq summary{cursor:pointer;padding:18px 22px;font-weight:600;font-size:15px;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:var(--sans)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;color:var(--verde);flex-shrink:0;line-height:1}
.faq[open] summary::after{content:"−"}
.faq[open] summary{color:var(--verde)}
.faq p{padding:0 22px 20px;font-size:14.5px;color:var(--apagado);font-family:var(--sans)}

/* ---------------- Contacto y pie ---------------- */
.cont-rejilla{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.cont-dato{display:flex;gap:14px;margin-bottom:20px}
.cont-dato svg{color:var(--verde);flex-shrink:0;margin-top:3px}
.cont-dato strong{display:block;font-size:14.5px;margin-bottom:2px;font-family:var(--sans)}
.cont-dato span{font-size:13.5px;color:var(--apagado)}
.horario{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:24px}
.horario h3{margin-bottom:14px}
.horario-fila{display:flex;justify-content:space-between;padding:9px 0;
  border-bottom:1px solid var(--linea);font-size:14px;font-family:var(--sans)}
.horario-fila:last-child{border-bottom:none}
.horario-fila span{color:var(--apagado)}

.pie{background:var(--tinta);color:#d3ddd3;padding:50px 0 0}
.pie-rejilla{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px;padding-bottom:36px}
.pie .marca-txt strong{color:#fff}
.pie .marca-txt span{color:var(--terra)}
.pie h4{font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--terra);margin-bottom:14px;font-family:var(--sans)}
.pie p,.pie a{font-size:13.5px;color:rgba(211,221,211,.8);font-family:var(--sans)}
.pie a{display:block;margin-bottom:8px;transition:.2s}
.pie a:hover{color:#fff}
.pie-abajo{border-top:1px solid rgba(255,255,255,.12);padding:17px 0;font-size:12.5px;
  color:rgba(211,221,211,.55);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-family:var(--sans)}
.aviso-demo{background:var(--terra-suave);color:#7a4a1e;text-align:center;padding:9px 20px;
  font-size:12.5px;font-weight:600;font-family:var(--sans)}

.wa{position:fixed;right:22px;bottom:22px;z-index:70;width:54px;height:54px;border-radius:50%;
  background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 22px rgba(37,211,102,.4);transition:.2s}
.wa:hover{transform:scale(1.08)}

/* ---------------- Pantallas pequeñas ---------------- */
@media(max-width:1100px){
  .servicios{grid-template-columns:repeat(2,1fr)}
  .equipo{grid-template-columns:repeat(2,1fr)}
  .planes{grid-template-columns:1fr;max-width:520px;margin:0 auto}
  .opiniones{grid-template-columns:1fr}
  .franja-fil .env{grid-template-columns:1fr}
}
@media(max-width:900px){
  .menu{display:none}
  .cab .btn{display:none}
  .abrir-menu{display:flex}
  .menu-movil .btn{display:flex;margin:14px 26px 18px}
  .portada .env{grid-template-columns:1fr;gap:30px;padding-top:38px}
  .portada-arte{max-width:420px;margin:0 auto}
  .reserva-rejilla,.cont-rejilla{grid-template-columns:1fr;gap:30px}
  .pie-rejilla{grid-template-columns:1fr 1fr}
  .barra-top .izq span:nth-child(n+3){display:none}
  .estadisticas{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  section{padding:52px 0}
  .env{padding:0 18px}
  .servicios{grid-template-columns:1fr}
  .equipo{grid-template-columns:1fr}
  .dos{grid-template-columns:1fr}
  .pie-rejilla{grid-template-columns:1fr;gap:24px}
  .portada-botones .btn{flex:1}
  .portada-sellos{gap:18px}
}
html,body{overflow-x:hidden;max-width:100%}