:root{
    --arena:#F4F1EA; --arena-2:#E6E2D8;
    --tinta:#1B2A30; --noche:#0B1E23;
    --cuerpo:#3E4C52; --gris:#55636A;
    --turquesa:#1FA9B6;        /* solo sobre oscuro */
    --turquesa-t:#146A74;      /* texto sobre claro */
    --linea:rgba(27,42,48,.15);
  }
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
  body{
    margin:0; background:var(--arena); color:var(--tinta);
    font-family:Sora,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    font-weight:300; font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased;
  }
  strong{font-weight:500}
  h1,h2,h3{font-family:"Cormorant Garamond",Georgia,serif; font-weight:500; letter-spacing:-.008em; margin:0}

  /* ---------- Portada partida ---------- */
  .portada{display:flex; min-height:100vh}
  .panel{
    flex:0 0 44%; position:relative; overflow:hidden; background:var(--noche);
  }
  .panel img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:58% 45%}
  .panel .velo{position:absolute; left:0; right:0; bottom:0; height:52%;
    background:linear-gradient(180deg, transparent, rgba(11,30,35,.9))}
  .panel .marca{position:absolute; left:0; right:0; bottom:0; padding:clamp(1.6rem,3vw,2.4rem)}
  .logo{font-family:"Cormorant Garamond",Georgia,serif; font-weight:500; font-size:clamp(1.6rem,2.6vw,2rem); color:var(--arena); letter-spacing:.02em}
  .logo i{font-style:italic; color:var(--turquesa)}

  .argumento{
    flex:1; display:flex; flex-direction:column; justify-content:center;
    gap:clamp(1.3rem,2.4vw,1.9rem); padding:clamp(2.4rem,5vw,4rem) clamp(1.6rem,4.5vw,4rem);
  }
  .cejilla{font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--turquesa-t); font-weight:500}
  h1{font-size:clamp(2rem,4.2vw,3.3rem); line-height:1.09}
  .parrafo{font-size:clamp(1rem,1.5vw,1.09rem); line-height:1.66; color:var(--cuerpo); margin:0; max-width:46ch}

  .acciones{display:flex; flex-wrap:wrap; gap:1rem 1.2rem; align-items:center}
  .boton{
    display:inline-block; background:var(--tinta); color:var(--arena);
    padding:.95rem 1.9rem; font-size:.97rem; font-weight:500; text-decoration:none;
    border:1px solid var(--tinta); transition:background .18s, color .18s;
  }
  .boton:hover{background:var(--noche); border-color:var(--noche)}
  .boton.secundario{background:transparent; color:var(--tinta); border-color:var(--tinta)}
  .boton.secundario:hover{background:var(--arena-2); border-color:var(--tinta)}
  .boton:focus-visible{outline:3px solid var(--turquesa-t); outline-offset:3px}
  .apunte{font-size:.86rem; color:var(--gris); line-height:1.5}

  .cifras{display:flex; flex-wrap:wrap; gap:clamp(1.5rem,3.5vw,2.8rem); border-top:1px solid var(--linea); padding-top:clamp(1.2rem,2.4vw,1.6rem)}
  .cifra b{display:block; font-family:"Cormorant Garamond",Georgia,serif; font-weight:500; font-size:clamp(1.7rem,3vw,2.2rem); line-height:1; color:var(--turquesa-t)}
  .cifra span{display:block; font-size:.78rem; color:var(--gris); margin-top:.25rem}

  /* ---------- Servicios ---------- */
  .servicios{background:var(--noche); color:var(--arena); padding:clamp(2.8rem,6vw,4.5rem) clamp(1.6rem,5vw,4rem)}
  .servicios .interior{max-width:1100px; margin:0 auto; display:grid; gap:clamp(1.6rem,3vw,2.4rem); grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
  .servicios h2{font-size:.72rem; font-weight:500; font-family:Sora,sans-serif; letter-spacing:.2em; text-transform:uppercase; color:var(--turquesa); margin-bottom:.5rem}
  .servicios p{margin:0; font-size:.96rem; color:#C3C8C9; line-height:1.62}

  /* ---------- Formulario ---------- */
  .diagnostico{padding:clamp(2.8rem,6vw,4.5rem) clamp(1.6rem,5vw,4rem); background:var(--arena-2)}
  .diagnostico .interior{max-width:620px; margin:0 auto}
  .diagnostico h2{font-size:clamp(1.7rem,3.2vw,2.4rem); line-height:1.15; margin-bottom:.7rem}
  .diagnostico > .interior > p{color:var(--cuerpo); margin:0 0 1.9rem; font-size:1rem}
  form{display:grid; gap:1.05rem}
  label{display:block; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gris); margin-bottom:.35rem; font-weight:500}
  input,select{
    width:100%; padding:.8rem .9rem; font-family:inherit; font-size:1rem; font-weight:300;
    color:var(--tinta); background:#FAF9F5; border:1px solid var(--linea); border-radius:0;
  }
  input:focus,select:focus{outline:2px solid var(--turquesa-t); outline-offset:1px; border-color:transparent}
  .legal{font-size:.78rem; color:var(--gris); line-height:1.55; margin:.2rem 0 0}
  .legal a{color:var(--turquesa-t)}

  /* ---------- Pie ---------- */
  footer{padding:clamp(1.8rem,4vw,2.6rem) clamp(1.6rem,5vw,4rem); border-top:1px solid var(--linea)}
  footer .interior{max-width:1100px; margin:0 auto; display:flex; flex-wrap:wrap; gap:.8rem 2rem; justify-content:space-between; align-items:baseline}
  footer a{color:var(--tinta); text-decoration:none; border-bottom:1px solid var(--turquesa-t); padding-bottom:1px}
  footer a:hover{color:var(--turquesa-t)}
  .pequena{font-size:.8rem; color:var(--gris); line-height:1.6; margin:0}

  @media (max-width:820px){
    .portada{flex-direction:column; min-height:0}
    .panel{flex:none; height:46vh; min-height:280px}
    .argumento{padding-top:2.4rem; padding-bottom:2.8rem}
  }

/* ---------- Cabecera común ---------- */
.cabecera{
  position:sticky; top:0; z-index:50; background:rgba(244,241,234,.94);
  backdrop-filter:saturate(150%) blur(8px); border-bottom:1px solid var(--linea);
}
.cabecera .interior{
  max-width:1180px; margin:0 auto; padding:.75rem clamp(1.2rem,4vw,2.4rem);
  display:flex; flex-wrap:wrap; gap:.6rem 1.4rem; align-items:center; justify-content:space-between;
}
.cabecera .logo{font-family:"Cormorant Garamond",Georgia,serif; font-weight:500; font-size:1.42rem; color:var(--tinta); text-decoration:none; letter-spacing:.02em; white-space:nowrap}
.cabecera .logo i{font-style:italic; color:var(--turquesa-t)}
.menu{display:flex; flex-wrap:wrap; gap:.2rem 1.15rem; align-items:center}
.menu a{font-size:.85rem; color:var(--cuerpo); text-decoration:none; padding:.2rem 0; border-bottom:1px solid transparent}
.menu a:hover{color:var(--tinta)}
.menu a[aria-current="page"]{color:var(--tinta); border-bottom-color:var(--turquesa-t)}
.menu a.destacado{color:var(--turquesa-t); font-weight:500}
.idiomas{display:flex; flex-wrap:wrap; gap:.1rem .15rem; align-items:center; margin-left:.4rem; padding-left:.9rem; border-left:1px solid var(--linea)}
.idiomas a{font-size:.68rem; letter-spacing:.11em; text-transform:uppercase; text-decoration:none; color:var(--gris); padding:.24rem .38rem; line-height:1}
.idiomas a:hover{color:var(--tinta)}
.idiomas a[aria-current="true"]{color:var(--tinta); font-weight:500}
.menu a:focus-visible,.idiomas a:focus-visible,.cabecera .logo:focus-visible{outline:2px solid var(--turquesa-t); outline-offset:3px}

/* ---------- Bloques del home ---------- */
.bloque{padding:clamp(2.6rem,6vw,4.4rem) clamp(1.4rem,5vw,4rem)}
.bloque .interior{max-width:1100px; margin:0 auto}
.bloque h2{font-size:clamp(1.6rem,3.2vw,2.3rem); line-height:1.16; margin-bottom:.8rem}
.bloque > .interior > p.guia{color:var(--cuerpo); max-width:58ch; margin:0 0 2.2rem; font-size:1.03rem}

.razones{display:grid; gap:clamp(1.5rem,3vw,2.4rem); grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.razones h3{font-family:Sora,sans-serif; font-size:.74rem; font-weight:500; letter-spacing:.19em; text-transform:uppercase; color:var(--turquesa-t); margin-bottom:.5rem}
.razones p{margin:0; font-size:.96rem; color:var(--cuerpo); line-height:1.62}

.foso{background:var(--noche); color:var(--arena)}
.foso h2{color:var(--arena)}
.foso p{color:#C3C8C9; max-width:60ch; font-size:clamp(1.02rem,1.7vw,1.16rem); margin:0}
.foso strong{color:var(--turquesa); font-weight:500}

.tarjetas{display:grid; gap:clamp(1.2rem,2.4vw,1.8rem); grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.tarjeta{display:flex; flex-direction:column; gap:.7rem; background:#FAF9F5; border:1px solid var(--linea); padding:clamp(1.3rem,2.4vw,1.8rem); text-decoration:none; color:inherit; transition:border-color .18s}
.tarjeta:hover{border-color:var(--turquesa-t)}
.tarjeta:focus-visible{outline:2px solid var(--turquesa-t); outline-offset:2px}
.tarjeta h3{font-size:clamp(1.25rem,2.2vw,1.5rem); line-height:1.2}
.tarjeta p{margin:0; font-size:.94rem; color:var(--cuerpo); line-height:1.6; flex:1}
.tarjeta .mas{font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; color:var(--turquesa-t); font-weight:500}

/* ---------- Página de servicio ---------- */
.serv-portada{display:flex; min-height:60vh}
.serv-portada .panel{flex:0 0 34%}
.serv-portada .argumento{gap:clamp(1rem,2vw,1.5rem)}
.incluye{list-style:none; padding:0; margin:0; display:grid; gap:.75rem}
.incluye li{position:relative; padding-left:1.5rem; font-size:.99rem; color:var(--cuerpo); line-height:1.6}
.incluye li::before{content:""; position:absolute; left:0; top:.62em; width:.6rem; height:1px; background:var(--turquesa-t)}
.cierre{border-left:2px solid var(--turquesa-t); padding-left:1.1rem; color:var(--cuerpo); font-size:.97rem; margin:0; max-width:58ch}

@media (max-width:820px){
  .serv-portada{flex-direction:column; min-height:0}
  .serv-portada .panel{flex:none; height:34vh; min-height:200px}
  .cabecera .interior{gap:.5rem 1rem}
  .menu{font-size:.8rem; gap:.2rem .85rem}
}

/* ---------- Migas de pan ---------- */
.migas{background:var(--arena-2); border-bottom:1px solid var(--linea); font-size:.82rem}
.migas .interior{max-width:1180px; margin:0 auto; padding:.6rem clamp(1.2rem,4vw,2.4rem); display:flex; flex-wrap:wrap; gap:.4rem; align-items:center}
.migas a{color:var(--gris); text-decoration:none}
.migas a:hover{color:var(--tinta)}
.migas span{color:#55636A}
.migas a:focus-visible{outline:2px solid var(--turquesa-t); outline-offset:2px}

/* ---------- Etiquetas de estado ---------- */
.etiqueta{
  align-self:flex-start; font-size:.64rem; letter-spacing:.16em; text-transform:uppercase;
  font-weight:500; color:#0B4C53; background:#CFE9EC; padding:.28rem .6rem; line-height:1;
}
.etiqueta.prox{color:#4A565B; background:#E0DCD2}
.tarjeta.tenue{background:transparent; border-style:dashed}
.tarjeta.tenue h3{color:var(--cuerpo)}
.tarjeta.destacada{border-color:var(--turquesa-t); border-width:1px}

/* ---------- Desplegable de sectores (sin JavaScript) ---------- */
.desplegable{position:relative}
.desplegable summary{
  list-style:none; cursor:pointer; font-size:.85rem; color:var(--cuerpo);
  padding:.2rem 0; border-bottom:1px solid transparent; display:inline-flex; align-items:center; gap:.35rem;
}
.desplegable summary::-webkit-details-marker{display:none}
.desplegable summary::after{content:"▾"; font-size:.7em; opacity:.55; transition:transform .15s}
.desplegable[open] summary::after{transform:rotate(180deg)}
.desplegable summary:hover{color:var(--tinta)}
.desplegable summary[aria-current="page"]{color:var(--tinta); border-bottom-color:var(--turquesa-t)}
.desplegable summary:focus-visible{outline:2px solid var(--turquesa-t); outline-offset:3px}

.panel-desp{
  position:absolute; top:calc(100% + .7rem); left:-.9rem; z-index:60; min-width:19rem;
  background:#FAF9F5; border:1px solid var(--linea); box-shadow:0 10px 34px rgba(11,30,35,.13);
  padding:.5rem; display:grid; gap:.1rem;
}
.panel-desp a,.panel-desp .no{
  display:flex; align-items:center; justify-content:space-between; gap:.9rem;
  padding:.6rem .75rem; text-decoration:none; color:var(--tinta); font-size:.9rem;
}
.panel-desp a:hover{background:var(--arena)}
.panel-desp .no{color:var(--gris)}
.panel-desp .no strong{font-weight:400}
.panel-desp strong{font-weight:500}
.panel-desp .et{
  font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; font-weight:500;
  color:#0B4C53; background:#CFE9EC; padding:.24rem .45rem; line-height:1; white-space:nowrap;
}
.panel-desp .et.prox{color:#4A565B; background:#E0DCD2}
.panel-desp .todos{
  margin-top:.25rem; border-top:1px solid var(--linea); color:var(--turquesa-t);
  font-weight:500; font-size:.82rem; justify-content:flex-start;
}
.panel-desp a:focus-visible{outline:2px solid var(--turquesa-t); outline-offset:-2px}

/* ---------- Llamada final (sustituye al formulario repetido) ---------- */
.cierre-cta{background:var(--arena-2)}
.cierre-cta .interior{max-width:640px}
.cierre-cta .guia{margin-bottom:1.6rem}

@media (max-width:820px){
  .desplegable{width:100%}
  .panel-desp{position:static; min-width:0; box-shadow:none; margin-top:.5rem; background:var(--arena-2)}
}

/* ---------- Hermes (chat) ---------- */
.pl{position:fixed; right:clamp(.8rem,2.5vw,1.6rem); bottom:clamp(.8rem,2.5vw,1.6rem); z-index:80; font-family:Sora,system-ui,sans-serif}
.pl-abrir{display:inline-flex; align-items:center; gap:.55rem; background:var(--noche); color:var(--arena); border:1px solid rgba(244,241,234,.14);
  padding:.65rem 1.15rem; font:inherit; font-size:.86rem; font-weight:500; cursor:pointer; box-shadow:0 10px 30px rgba(11,30,35,.22); transition:transform .18s}
.pl-abrir-copy{display:flex; flex-direction:column; align-items:flex-start; gap:.08rem}
.pl-abrir-copy small{font:inherit; font-size:.68rem; font-weight:300; color:var(--turquesa)}
.pl-abrir:hover{transform:translateY(-1px)}
.pl-abrir:focus-visible{outline:2px solid var(--turquesa); outline-offset:3px}
.pl-punto{width:.55rem; height:.55rem; border-radius:50%; background:var(--turquesa); box-shadow:0 0 0 0 rgba(31,169,182,.6); animation:pl-lat 2.4s ease-out infinite}
@keyframes pl-lat{0%{box-shadow:0 0 0 0 rgba(31,169,182,.55)} 70%{box-shadow:0 0 0 .55rem rgba(31,169,182,0)} 100%{box-shadow:0 0 0 0 rgba(31,169,182,0)}}
.pl-panel{position:absolute; right:0; bottom:calc(100% + .7rem); width:min(23rem, calc(100vw - 1.6rem)); height:min(34rem, calc(100vh - 6rem));
  display:flex; flex-direction:column; background:#FAF9F5; border:1px solid var(--linea); box-shadow:0 22px 60px rgba(11,30,35,.24);
  animation:pl-sube .22s ease-out}
.pl-panel[hidden]{display:none!important}
@keyframes pl-sube{from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none}}
.pl-cab{display:flex; justify-content:space-between; align-items:center; padding:.9rem 1rem; background:var(--noche); color:var(--arena)}
.pl-cab strong{display:block; font-family:"Cormorant Garamond",Georgia,serif; font-weight:500; font-size:1.25rem; line-height:1}
.pl-cab span{font-size:.72rem; color:var(--turquesa)}
.pl-cerrar{background:none; border:0; color:var(--arena); font-size:1.4rem; line-height:1; cursor:pointer; padding:.2rem .4rem}
.pl-cerrar:focus-visible{outline:2px solid var(--turquesa)}
.pl-log{flex:1; overflow-y:auto; padding:1rem; display:flex; flex-direction:column; gap:.6rem}
.pl-msg{max-width:88%; padding:.6rem .8rem; font-size:.9rem; line-height:1.5; white-space:pre-wrap; word-wrap:break-word}
.pl-bot{align-self:flex-start; background:var(--arena-2); color:var(--tinta)}
.pl-yo{align-self:flex-end; background:var(--tinta); color:var(--arena)}
.pl-form{display:flex; border-top:1px solid var(--linea)}
.pl-in{flex:1; border:0; padding:.85rem .9rem; font:inherit; font-size:.92rem; font-weight:300; background:transparent; color:var(--tinta)}
.pl-in:focus{outline:2px solid var(--turquesa-t); outline-offset:-2px}
.pl-env{border:0; background:var(--turquesa-t); color:#fff; padding:0 1rem; font:inherit; font-size:.85rem; font-weight:500; cursor:pointer}
.pl-env:disabled{opacity:.5; cursor:wait}
.pl-aviso{margin:0; padding:.45rem .9rem .6rem; font-size:.68rem; color:var(--gris); border-top:1px solid var(--linea)}
@media (prefers-reduced-motion:reduce){.pl-punto{animation:none} .pl-panel{animation:none}}