
/* ============================================================
   Dos superficies y nada más: crema e ink.
   Mínimos: texto 14px, control táctil 48px.
   ============================================================ */
:root{
  --bg:#ffffff; --ink:#000000; --white:#ffffff;
  --muted:#5b5b5b; --line:rgba(0,0,0,.15); --linew:rgba(255,255,255,.18);
  --wa:#1fa855; --tint:#828282; --bar:74px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);
     font-family:"Open Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased;
     padding-bottom:var(--bar)}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
:focus-visible{outline:2px solid var(--tint);outline-offset:3px;border-radius:6px}
.wrap{width:min(100%,1240px);margin:0 auto;padding:0 20px}
@media(min-width:720px){.wrap{padding:0 40px}}
.serif{font-family:"Open Sans",Arial,sans-serif;font-stretch:75%;font-weight:700;letter-spacing:-.005em}

/* ---------- barra superior ---------- */
.top{position:fixed;inset:0 0 auto 0;z-index:60;isolation:isolate;display:flex;align-items:center;
     justify-content:space-between;padding:14px 20px;transition:color .3s}
.top::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
     background:linear-gradient(to bottom,var(--bg) 46%,rgba(255,255,255,0))}
.top.oscuro{color:var(--white)}
.top.oscuro::before{background:linear-gradient(to bottom,var(--ink) 46%,rgba(0,0,0,0))}
.marca{font-size:21px;letter-spacing:-.05em;line-height:1}
.marca b{font-weight:500}.marca i{font-style:normal;opacity:.55}
.enlaces-top{display:none}
@media(min-width:1100px){
  .top{padding:18px 40px}
  .enlaces-top{display:flex;gap:26px}
  .enlaces-top a{display:inline-flex;align-items:center;min-height:48px;font-size:15px;opacity:.75}
  .enlaces-top a:hover{opacity:1}
}
.burger{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);
        background:rgba(255,255,255,.7);backdrop-filter:blur(12px);
        display:grid;place-items:center;gap:5px;padding:15px 13px}
.top.oscuro .burger{border-color:var(--linew);background:rgba(0,0,0,.5)}
.burger span{display:block;width:100%;height:1px;background:currentColor}

/* ---------- menú ---------- */
.sheet{position:fixed;inset:0;z-index:70;background:var(--ink);color:var(--white);
       display:flex;flex-direction:column;justify-content:center;padding:0 24px;
       opacity:0;visibility:hidden;transition:opacity .28s,visibility .28s}
.sheet.abierto{opacity:1;visibility:visible}
.sheet a{font-size:clamp(34px,10vw,54px);line-height:1.18;padding:5px 0}
.sheet a em{display:block;font-style:normal;font-family:"Open Sans",sans-serif;font-size:15px;
       letter-spacing:.04em;opacity:.5;margin-top:-2px}
.sheet .cerrar{position:absolute;top:14px;right:20px;width:48px;height:48px;
       border:1px solid var(--linew);border-radius:50%;font-size:22px}
.sheet small{display:block;margin-top:30px;font-size:14.5px;opacity:.55;line-height:1.6}

/* ---------- hero ---------- */
.hero{min-height:calc(100svh - var(--bar));display:flex;flex-direction:column;
      justify-content:center;gap:14px;padding:86px 20px 18px;text-align:center}
.eyebrow{margin:0 0 12px;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.hero h1{margin:0;font-size:clamp(46px,13vw,92px);line-height:.92}
.hero h1 em{font-style:italic}
.lede{margin:14px auto 0;max-width:32ch;font-size:16px;line-height:1.5;color:var(--muted)}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;
     border-radius:100px;font-size:16px;font-weight:500}
.btn-p{background:var(--ink);color:var(--bg)}
.btn-s{border:1px solid var(--line)}
.sede-linea{margin:14px 0 0;font-size:14px;color:var(--muted)}

.orbit{position:relative;width:min(74vw,330px);aspect-ratio:1;margin:0 auto;container-type:size}
.halo{position:absolute;border:1px solid var(--line);border-radius:50%;inset:11%}
.halo.dentro{inset:31%;border-color:rgba(0,0,0,.08)}
.spin{position:absolute;inset:0;animation:giro 120s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}
@keyframes contragiro{to{transform:rotate(-360deg)}}
.node{position:absolute;left:50%;top:50%;width:25%;aspect-ratio:1;
      transform:translate(-50%,-50%) rotate(var(--a)) translateY(-39cqmin) rotate(calc(-1*var(--a)))}
.node .cara{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;position:relative;
      animation:contragiro 120s linear infinite;background:#d7d7d7;
      box-shadow:0 0 0 1px rgba(0,0,0,.14);transition:box-shadow .35s,scale .35s}
.node:hover .cara,.node:focus-visible .cara{scale:1.06}
.node[aria-pressed="true"] .cara{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--tint),0 14px 30px rgba(0,0,0,.18)}
.node .cara img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 22%)}
.node .cara::after{content:"";position:absolute;inset:0;
      background:linear-gradient(to top,rgba(0,0,0,.62) 0%,rgba(0,0,0,.1) 52%,rgba(255,255,255,.06) 100%)}
.node .mark{position:absolute;z-index:2;left:50%;translate:-50% 0;bottom:13%;max-height:20%;
      max-width:62%;width:auto;object-fit:contain;filter:brightness(0) invert(1)}
.node .tag{position:absolute;left:50%;translate:-50% 0;top:calc(100% + 8px);white-space:nowrap;
      font-weight:400;font-size:14.5px;color:var(--ink);animation:contragiro 120s linear infinite;
      transform-origin:center -50%}
.n1{--a:0deg}.n2{--a:72deg}.n3{--a:144deg}.n4{--a:216deg}.n5{--a:288deg}
.nucleo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:36%;aspect-ratio:1;
      border-radius:50%;background:var(--ink);color:var(--white);display:grid;place-items:center;
      text-align:center;box-shadow:0 16px 40px rgba(0,0,0,.14)}
.nucleo p{margin:0;font-size:clamp(20px,6.4cqmin,30px);line-height:.94}
.nucleo p i{font-style:normal;display:block;opacity:.68}
.orbit.quieto .spin,.orbit.quieto .cara,.orbit.quieto .tag{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){
  .spin,.cara,.tag{animation:none!important}
  *{transition:none!important;scroll-behavior:auto}
}
@media(min-width:1100px){
  .hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px;
        text-align:left;padding:130px 40px 70px;width:min(100%,1240px);margin:0 auto}
  .lede{margin:18px 0 0;max-width:34ch;font-size:16.5px}
  .eyebrow{letter-spacing:.2em}
  .hero-cta{justify-content:flex-start}
  .orbit{width:min(54vh,500px);margin:0 auto}
}

/* ---------- bandas ---------- */
.bandas-sec{background:var(--ink);color:var(--white)}
.bandas-intro{margin:0;padding:64px 20px 26px;display:flex;flex-wrap:wrap;gap:12px;align-items:baseline;
  font-size:15.5px;color:rgba(255,255,255,.55)}
.bandas-intro b{font-weight:400;font-size:clamp(26px,6vw,38px);color:var(--white)}
.bandas{list-style:none;margin:0;padding:0}
.banda{position:relative;isolation:isolate;min-height:340px;display:flex;align-items:flex-end;
  border-top:1px solid var(--linew);overflow:hidden;scroll-margin-top:76px}
.banda img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
.banda::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to top,rgba(0,0,0,.96) 0%,rgba(0,0,0,.88) 46%,rgba(0,0,0,.4) 100%)}
.banda-txt{padding:30px 20px 34px;max-width:560px}
.banda .num{display:block;font-size:14px;letter-spacing:.22em;color:rgba(255,255,255,.45);margin-bottom:10px}
.banda h3{margin:0 0 12px;font-size:clamp(36px,10vw,52px);line-height:.92}
.banda h3 em{display:block;font-style:normal;font-family:"Open Sans",sans-serif;font-size:15px;
  letter-spacing:.4em;opacity:.55;margin-top:7px}
.banda .claim{margin:0 0 8px;font-size:19px;line-height:1.3}
.banda .svc{margin:0 0 20px;font-size:15.5px;line-height:1.5;color:rgba(255,255,255,.7)}
.banda-cta{display:flex;flex-wrap:wrap;gap:10px}
.banda-cta button{min-height:48px;padding:0 22px;border-radius:100px;background:var(--white);
  color:var(--ink);font-size:15px;font-weight:500}
.banda-cta a{display:inline-flex;align-items:center;min-height:48px;padding:0 20px;border-radius:100px;
  border:1px solid var(--linew);font-size:15px}
.banda-cta .pronto{display:inline-flex;align-items:center;min-height:48px;font-size:14.5px;
  color:rgba(255,255,255,.45)}
@media(min-width:720px){
  .bandas-intro{padding:88px 40px 30px}
  .banda{min-height:400px}
  .banda-txt{padding:44px 40px 48px}
  .banda::after{background:linear-gradient(100deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.82) 40%,rgba(0,0,0,.08) 84%)}
}

/* ---------- servicios ---------- */
.servicios{padding:14vh 0 12vh}
.servicios h2{margin:0;font-size:clamp(38px,10vw,62px);line-height:.96}
.sub{margin:14px 0 28px;color:var(--muted);font-size:16px;line-height:1.55;max-width:46ch}
.chips{display:flex;gap:9px;overflow-x:auto;padding-bottom:8px;margin-bottom:8px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;min-height:48px;padding:0 20px;border-radius:100px;border:1px solid var(--line);
  font-size:15px;display:inline-flex;align-items:center}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.grid{border-top:1px solid var(--line)}
.fila{display:flex;width:100%;align-items:flex-start;justify-content:space-between;gap:18px;
  min-height:66px;padding:15px 0;border-bottom:1px solid var(--line);text-align:left}
.fila-t b{display:block;font-weight:400;font-size:17px}
.fila-t em{display:block;font-style:normal;font-size:14.5px;color:var(--muted);margin-top:2px}
.fila-p{flex:0 0 auto;text-align:right;font-size:14.5px;color:var(--muted)}
.fila-p i{display:block;font-style:normal;opacity:.75}
.fila:hover .fila-t b{text-decoration:underline;text-underline-offset:4px}
@media(min-width:720px){.grid{columns:2;column-gap:60px}.fila{break-inside:avoid}}

/* ---------- agenda ---------- */
.agenda{background:var(--ink);color:var(--bg);padding:14vh 0}
.agenda h2{margin:0;font-size:clamp(38px,10vw,62px);line-height:.96}
.agenda .sub{color:rgba(255,255,255,.62)}
.flujo{max-width:660px}
.prog{display:flex;align-items:center;gap:14px;margin-bottom:28px}
.prog span{flex:1;height:2px;background:rgba(255,255,255,.2);position:relative;overflow:hidden}
.prog span::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--p,25%);background:var(--bg);transition:width .3s}
.prog em{font-style:normal;font-size:14px;color:rgba(255,255,255,.65);white-space:nowrap}
.q{margin:0 0 14px;font-size:18.5px}
.q.sec{margin-top:28px}
.q i{font-style:normal;font-size:14px;opacity:.55}
.opts{display:flex;flex-wrap:wrap;gap:9px}
.opts button{min-height:54px;padding:0 20px;border-radius:100px;border:1px solid rgba(255,255,255,.3);
  font-size:15.5px;display:inline-flex;flex-direction:column;justify-content:center;align-items:flex-start}
.opts button em{font-style:normal;font-size:14px;opacity:.65;margin-top:2px}
.opts button[aria-pressed="true"]{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.libre{display:flex;gap:10px;margin-top:16px}
.libre input,#nombre{min-width:0;flex:1;min-height:52px;padding:0 20px;font-size:16px;border-radius:100px;
  border:1px solid rgba(255,255,255,.3);background:transparent;color:var(--bg);outline:none}
#nombre{display:block;width:100%;max-width:340px;margin-top:4px}
.libre input::placeholder,#nombre::placeholder{color:rgba(255,255,255,.42)}
.libre button{min-height:52px;padding:0 24px;border-radius:100px;background:var(--bg);color:var(--ink);
  font-size:15.5px;font-weight:500}
.pista{margin:14px 0 0;font-size:14.5px;color:rgba(255,255,255,.62);line-height:1.5}
.resumen{margin:0 0 18px;padding:18px;border:1px solid rgba(255,255,255,.25);border-radius:14px;
  font:400 15px/1.6 "Open Sans",system-ui,sans-serif;white-space:pre-wrap;color:rgba(255,255,255,.88)}
.aviso{margin:0 0 18px;padding:15px 17px;border-radius:12px;background:rgba(255,255,255,.09);
  font-size:15px;line-height:1.5;color:rgba(255,255,255,.85)}
.aviso b{display:block;color:var(--bg);margin-bottom:3px}
.enviar{display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:0 30px;border-radius:100px;
  background:var(--wa);color:#ffffff;font-size:16.5px;font-weight:500}
.enviar svg{width:20px;height:20px;fill:currentColor}
.llamar{display:inline-flex;align-items:center;min-height:52px;margin-top:16px;padding:0 26px;
  border:1px solid rgba(255,255,255,.35);border-radius:100px;font-size:15.5px}
.nav-flujo{display:flex;gap:20px;margin-top:26px}
.nav-flujo button{min-height:48px;font-size:15px;color:rgba(255,255,255,.65);
  border-bottom:1px solid rgba(255,255,255,.3)}
.privacidad{margin:22px 0 0;font-size:14px;line-height:1.55;color:rgba(255,255,255,.5);max-width:52ch}
@media(min-width:1100px){
  .agenda .wrap{display:grid;grid-template-columns:.75fr 1.25fr;gap:60px;align-items:start}
}

/* ---------- cierre ---------- */
.cierre{background:var(--bg);color:var(--ink);text-align:center;padding:15vh 0;border-top:1px solid var(--line)}
.cierre .kicker{margin:0 0 14px;font-size:14px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.cierre h2{margin:0 0 14px;font-size:clamp(44px,12vw,80px);line-height:.95}
.cierre .sub{margin:0 auto 28px;max-width:36ch;text-align:center}
.cierre .sede{margin:24px 0 0;font-size:14.5px;color:var(--muted)}

/* ---------- barra inferior ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:55;background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);border-top:1px solid var(--line);
  padding:12px 20px calc(12px + env(safe-area-inset-bottom));
  display:flex;align-items:center;justify-content:space-between;gap:14px}
.dock p{margin:0;font-size:14px;color:var(--muted);line-height:1.25}
.dock p b{display:block;font-weight:500;font-size:15px;color:var(--ink)}
.dock a{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 24px;border-radius:100px;
  background:var(--ink);color:var(--bg);font-size:15px;font-weight:500;white-space:nowrap;transition:background .25s}
.dock a.wa{background:var(--wa);color:#ffffff}
.pie{padding:44px 20px 34px;font-size:14.5px;line-height:1.75;color:var(--muted);border-top:1px solid var(--line)}
.pie a{border-bottom:1px solid var(--line)}
.pie b{color:var(--ink);font-weight:500}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

.skip-link{position:absolute;top:-100px;z-index:200;background:#ffffff;color:#000000;padding:12px}.skip-link:focus{top:0}

.service-search summary{cursor:pointer;padding:16px 0;font-size:18px}.banda{min-height:280px}@media(min-width:720px){.banda{min-height:340px}}

/* servicios agrupados — 2026-10-23 */
.fila-g{margin:22px 0 2px;font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);break-after:avoid}
.fila-g:first-child{margin-top:6px}
.opts-g{flex-basis:100%;margin:14px 0 0;font-size:12px;letter-spacing:.09em;text-transform:uppercase;opacity:.7}
.opts-g:first-child{margin-top:0}
