/* [ESTUDIOS-APP 25-09] Motor visual de las apps de estudios (contador y abogados). Cada app pone su paleta
   en :root (--pri, --pri2, --acento, --fondo...) desde su index.html. Mismo espíritu que la app de la
   hamburguesería: portada fuerte, accesos rápidos, secciones en vistas (sin scroll interminable) y barra
   inferior en el celular. */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--texto);font:15px/1.55 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--titulos);color:var(--tinta);margin:0;line-height:1.15;letter-spacing:-.01em}
p{margin:0}
a{color:inherit}
button{font:inherit;color:inherit}
svg.ic{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.oculto{display:none!important}

/* ---------- encabezado ---------- */
.ea-cab{position:sticky;top:0;z-index:40;background:var(--cabfondo);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:3px solid var(--pri)}
.ea-cab-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:10px 16px;min-height:62px}
.ea-hamb{width:42px;height:42px;border-radius:12px;border:0;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.08);display:grid;place-items:center;cursor:pointer;color:var(--tinta)}
.ea-marca{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.ea-marca img{width:34px;height:34px;border-radius:50%}
.ea-marca b{max-width:300px;font-family:var(--titulos);font-size:18px;color:var(--tinta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ea-nav{display:none;margin:0 auto;gap:4px}
.ea-nav a{white-space:nowrap;padding:9px 12px;border-radius:10px;text-decoration:none;font-weight:600;font-size:14px;color:var(--suave)}
.ea-nav a.activo,.ea-nav a:hover{background:var(--tinte);color:var(--pri)}
.btn.ea-cta{display:none;margin-left:auto}
@media(min-width:1000px){.ea-nav{display:flex}.btn.ea-cta{display:inline-flex}}

/* ---------- botones ---------- */
.btn{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;transition:transform .12s,filter .2s}
.btn:active{transform:scale(.97)}
.btn-pri{background:var(--pri);color:#fff}
.btn-pri:hover{filter:brightness(1.12)}
.btn-ac{background:var(--acento);color:var(--sobreacento)}
.btn-bor{background:#fff;border-color:var(--borde);color:var(--tinta)}
.btn-wa{background:#1faa53;color:#fff}
.btn-chico{min-height:36px;padding:0 14px;font-size:13px;border-radius:10px}
.btn-ancho{width:100%}
.ver-todo{background:var(--tinte);color:var(--pri);border:0;border-radius:99px;padding:5px 12px;font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap}

/* ---------- vistas ---------- */
.ea-main{max-width:1180px;margin:0 auto;padding:16px 16px 110px}
.vista{display:none;animation:entra .22s ease}
.vista.activa{display:block}
@keyframes entra{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.vista-cab{display:flex;align-items:center;gap:12px;margin:4px 0 16px}
.vista-cab button{width:40px;height:40px;border-radius:12px;border:1px solid var(--borde);background:#fff;display:grid;place-items:center;cursor:pointer;flex:none}
.vista-cab h2{font-size:clamp(22px,5vw,30px)}
.vista-cab p{color:var(--suave);font-size:14px}
.bajada{color:var(--suave);font-size:14px;margin:-8px 0 14px}

/* ---------- portada ---------- */
.hero{position:relative;border-radius:26px;overflow:hidden;background:var(--herofondo);color:#fff;min-height:420px;display:flex;align-items:flex-end;box-shadow:0 18px 40px rgba(0,0,0,.18)}
.hero-dibujo{position:absolute;inset:0;pointer-events:none}
.hero-dibujo svg{position:absolute;right:-40px;top:-20px;width:62%;max-width:520px;height:auto;opacity:.5}
.hero-in{padding-top:120px!important}
.hero-in{position:relative;padding:26px 22px;width:100%;background:linear-gradient(180deg,rgba(0,0,0,0) 0,rgba(0,0,0,.35) 100%)}
.hero-logo{width:64px;height:64px;border-radius:50%;border:3px solid var(--acento);box-shadow:0 6px 18px rgba(0,0,0,.3);margin-bottom:12px}
.hero h1{color:#fff;font-size:clamp(30px,8vw,52px);text-shadow:0 2px 14px rgba(0,0,0,.3)}
.hero-lema{font-size:16px;opacity:.93;margin:8px 0 14px;max-width:560px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--acento);color:var(--sobreacento);border-radius:99px;padding:5px 12px;font-size:13px;font-weight:700}
.chip svg.ic{width:15px;height:15px}
.chip .punto{width:8px;height:8px;border-radius:50%;background:currentColor}
.hero-bot{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
@media(min-width:760px){.hero{min-height:440px}.hero-in{padding:34px 36px!important}.hero-in>*{max-width:62%}.hero-dibujo svg{width:44%;right:30px;top:30px;opacity:.95}}

/* ---------- accesos rápidos ---------- */
.accesos{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:16px 0}
.acceso{background:#fff;border:1.5px solid var(--borde);border-radius:16px;padding:12px 4px 10px;display:flex;flex-direction:column;align-items:center;gap:7px;font-weight:700;font-size:12px;text-align:center;cursor:pointer;color:var(--tinta);text-decoration:none;line-height:1.2}
.acceso .circ{width:40px;height:40px;border-radius:50%;background:var(--tinte);color:var(--pri);display:grid;place-items:center}
.acceso.pri{background:var(--pri);border-color:var(--pri);color:#fff}
.acceso.pri .circ{background:rgba(255,255,255,.18);color:#fff}
@media(min-width:760px){.accesos{gap:14px}.acceso{flex-direction:row;justify-content:center;font-size:15px;padding:12px}}

.tira{display:flex;align-items:center;gap:12px;background:var(--tinte);border-radius:14px;padding:12px 14px;font-size:14px;color:var(--tinta);margin-bottom:10px}
.tira .ic{color:var(--pri)}
.tira b{color:var(--pri)}
.tira .ver-todo{margin-left:auto;background:#fff}

/* ---------- secciones del inicio ---------- */
.sec{margin:28px 0 8px}
.sec-cab{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.sec-cab .circ{width:34px;height:34px;border-radius:50%;background:var(--acento);color:var(--sobreacento);display:grid;place-items:center;flex:none}
.sec-cab .circ svg.ic{width:18px;height:18px}
.sec-cab h2{font-size:clamp(21px,5vw,27px)}
.sec-cab .ver-todo{margin-left:auto}
.carrusel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 12px;margin:0 -16px;padding-left:16px;padding-right:16px;scrollbar-width:none}
.carrusel::-webkit-scrollbar{display:none}
.carrusel>*{scroll-snap-align:start;flex:0 0 76%}
@media(min-width:760px){.carrusel{margin:0;padding-left:2px;padding-right:2px}.carrusel>*{flex:0 0 calc(33.33% - 8px)}}

.tarjeta{background:#fff;border:1px solid var(--borde);border-radius:18px;padding:16px;box-shadow:0 4px 16px rgba(0,0,0,.04)}
.serv{display:flex;flex-direction:column;gap:8px}
.serv-ico{width:48px;height:48px;border-radius:14px;background:var(--herofondo);color:#fff;display:grid;place-items:center}
.serv h3{font-size:18px}
.serv p{color:var(--suave);font-size:14px;flex:1}
.serv-pie{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:4px}
.precio-consulta{font-weight:800;color:var(--pri);font-size:15px}
.grilla{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:700px){.grilla{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.grilla.tres{grid-template-columns:1fr 1fr 1fr}}
.serv ul{margin:0;padding-left:18px;color:var(--suave);font-size:13px}

/* filas (vencimientos, pagos) */
.filas{display:flex;flex-direction:column;gap:8px}
.fila{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--borde);border-radius:14px;padding:11px 13px}
.fila-dia{width:48px;min-width:48px;height:52px;border-radius:12px;background:var(--tinte);color:var(--pri);display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800;line-height:1}
.fila-dia b{font-size:20px}
.fila-dia small{font-size:10px;text-transform:uppercase;margin-top:3px}
.fila-dia.conf{background:#fff4d6;color:#8a6100}
.fila-txt{flex:1;min-width:0}
.fila-txt b{display:block;font-size:14.5px;color:var(--tinta)}
.fila-txt span{font-size:13px;color:var(--suave)}
.est{font-size:12px;font-weight:800;border-radius:99px;padding:3px 10px;white-space:nowrap}
.e-venc{background:#fde2e2;color:#a61b1b}.e-pend{background:#fff1d0;color:#8a5a00}.e-pag{background:#dcf5e5;color:#17693a}.e-pres{background:#e0ecff;color:#1d4ea8}.e-conf{background:#eee;color:#555}

/* filtro por terminación */
.pildoras{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.pildora{border:1.5px solid var(--borde);background:#fff;border-radius:99px;padding:7px 13px;font-weight:700;font-size:13px;cursor:pointer}
.pildora.activa{background:var(--pri);border-color:var(--pri);color:#fff}

/* avisos de ejemplo */
.aviso-demo{display:flex;gap:10px;align-items:flex-start;background:#fff8e6;border:1px solid #f1dfa8;color:#6b5412;border-radius:12px;padding:10px 12px;font-size:13px;margin-bottom:14px}
.aviso-demo svg.ic{width:18px;height:18px;margin-top:1px}

/* opiniones */
.opinion{display:flex;flex-direction:column;gap:10px}
.estrellas{color:var(--acento);letter-spacing:2px;font-size:15px}
.opinion p{font-size:14.5px;color:var(--tinta)}
.opinion-pie{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--suave)}
.opinion-pie b{color:var(--tinta);display:block}
.av{width:44px;height:44px;border-radius:50%;flex:none;overflow:hidden}
.av svg{width:100%;height:100%;display:block}
.marca-ej{display:inline-block;background:var(--tinte);color:var(--pri);font-size:11px;font-weight:800;border-radius:99px;padding:2px 8px;text-transform:uppercase;letter-spacing:.04em}

/* equipo */
.miembro{display:flex;gap:14px;align-items:center}
.miembro .av{width:72px;height:72px}
.miembro h3{font-size:17px}
.miembro span{color:var(--pri);font-weight:700;font-size:13px}
.miembro p{color:var(--suave);font-size:13.5px;margin-top:3px}
.equipo-fila{display:flex;align-items:center;gap:-8px}
.equipo-fila .av{width:52px;height:52px;border:3px solid #fff;margin-right:-10px;box-shadow:0 2px 8px rgba(0,0,0,.1)}

/* pasos */
.pasos{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:760px){.pasos{grid-template-columns:repeat(4,1fr)}}
.paso{position:relative}
.paso .num{width:38px;height:38px;border-radius:50%;background:var(--pri);color:#fff;display:grid;place-items:center;font-weight:800;margin-bottom:8px;font-family:var(--titulos);font-size:18px}
.paso h3{font-size:17px;margin-bottom:4px}
.paso p{color:var(--suave);font-size:14px}

/* destacado (teaser) */
.destacado{display:flex;gap:16px;align-items:center;background:var(--herofondo);color:#fff;border-radius:20px;padding:20px;overflow:hidden;position:relative}
.destacado h3{color:#fff;font-size:20px;margin-bottom:6px}
.destacado p{opacity:.9;font-size:14px;margin-bottom:12px}
.destacado .gran-ico{width:70px;height:70px;border-radius:20px;background:rgba(255,255,255,.14);display:grid;place-items:center;flex:none}
.destacado .gran-ico svg.ic{width:36px;height:36px;color:var(--acento)}
.dos-col{display:grid;gap:12px}
@media(min-width:760px){.dos-col{grid-template-columns:1fr 1fr}}

/* preguntas (acordeón) */
.faq details{background:#fff;border:1px solid var(--borde);border-radius:14px;margin-bottom:8px;overflow:hidden}
.faq summary{list-style:none;cursor:pointer;padding:14px 16px;font-weight:700;display:flex;align-items:center;gap:10px;color:var(--tinta)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";margin-left:auto;font-size:22px;color:var(--pri);line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 16px 14px;color:var(--suave);font-size:14.5px}

/* dónde estamos */
.lista-info{background:#fff;border:1px solid var(--borde);border-radius:18px;overflow:hidden}
.lista-info a,.lista-info div.li{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--borde);text-decoration:none}
.lista-info>*:last-child{border-bottom:0}
.lista-info .circ{width:38px;height:38px;border-radius:50%;background:var(--tinte);color:var(--pri);display:grid;place-items:center;flex:none}
.lista-info b{display:block;color:var(--tinta);font-size:15px}
.lista-info span{color:var(--suave);font-size:13px}
.lista-info em{margin-left:auto;font-style:normal;color:var(--pri);font-weight:700;font-size:13px}
.mapa{border-radius:18px;overflow:hidden;border:1px solid var(--borde);background:#e9ecef;position:relative;height:220px}
.mapa>svg{width:100%;height:100%;display:block}
.mapa .pin{position:absolute;left:50%;top:46%;transform:translate(-50%,-100%);color:var(--pri)}
.mapa .pin svg.ic{width:44px;height:44px;fill:var(--acento);stroke:var(--pri)}
.mapa .btn{position:absolute;right:12px;bottom:12px}
.horas{width:100%;border-collapse:collapse;font-size:14px}
.horas td{padding:7px 4px;border-bottom:1px solid var(--borde)}
.horas td:last-child{text-align:right;font-weight:700;color:var(--tinta)}
.horas tr.hoy td{color:var(--pri);font-weight:800}
.redes{display:flex;gap:10px;justify-content:center;margin:22px 0 10px}
.redes a{width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--borde);display:grid;place-items:center;color:var(--pri)}
.pie{text-align:center;color:var(--suave);font-size:12.5px}
.pie .demo{background:var(--tinte);border-radius:12px;padding:8px 12px;margin:8px auto 0;max-width:560px}

/* formularios */
.campo{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.campo label,.etq{font-weight:700;font-size:14px;color:var(--tinta)}
.campo input,.campo select,.campo textarea{width:100%;min-height:46px;border:1.5px solid var(--borde);background:#f7f8fa;border-radius:12px;padding:10px 12px;font:inherit;color:var(--texto)}
.campo textarea{min-height:80px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--pri);background:#fff}
.opciones{display:flex;flex-wrap:wrap;gap:8px}
.op{border:1.5px solid var(--borde);background:#fff;border-radius:12px;padding:10px 14px;font-weight:700;font-size:14px;cursor:pointer;text-align:left}
.op small{display:block;font-weight:500;color:var(--suave);font-size:12px}
.op.activa{border-color:var(--pri);background:var(--tinte);color:var(--pri)}
.op:disabled{opacity:.4;cursor:not-allowed}
.dias{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
.dias::-webkit-scrollbar{display:none}
.dia{flex:0 0 64px;border:1.5px solid var(--borde);background:#fff;border-radius:14px;padding:8px 4px;text-align:center;cursor:pointer;font-weight:700}
.dia small{display:block;font-size:11px;color:var(--suave);text-transform:uppercase}
.dia b{font-size:20px;display:block}
.dia.activa{background:var(--pri);border-color:var(--pri);color:#fff}
.dia.activa small{color:rgba(255,255,255,.8)}
.resumen{background:var(--tinte);border-radius:14px;padding:12px 14px;font-size:14px;color:var(--tinta);margin-bottom:12px;white-space:pre-line}
.form-col{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
.form-col>*{min-width:0}
@media(min-width:900px){.form-col{grid-template-columns:1.3fr 1fr;align-items:start}.form-col>.tarjeta:last-child{position:sticky;top:84px}}

/* mi cuenta */
.cuenta-cab{display:flex;align-items:center;gap:14px;background:var(--herofondo);color:#fff;border-radius:20px;padding:18px}
.cuenta-cab h3{color:#fff;font-size:20px}
.cuenta-cab span{opacity:.85;font-size:13px}
.cuenta-cab .btn{margin-left:auto}
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.kpi{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:14px}
.kpi small{color:var(--suave);font-size:12.5px;font-weight:600}
.kpi b{display:block;font-size:22px;color:var(--tinta);font-family:var(--titulos)}
.kpi.alerta b{color:#a61b1b}
.pestanas{display:flex;gap:6px;overflow-x:auto;margin:6px 0 12px;scrollbar-width:none}
.pestanas::-webkit-scrollbar{display:none}
.pestana{border:0;background:#fff;border:1.5px solid var(--borde);border-radius:99px;padding:8px 14px;font-weight:700;font-size:13.5px;cursor:pointer;white-space:nowrap}
.pestana.activa{background:var(--pri);border-color:var(--pri);color:#fff}
.panel-p{display:none}.panel-p.activa{display:block}
.fila .btn-chico{flex:none}

/* simulador */
.resultado-sim{background:var(--herofondo);color:#fff;border-radius:18px;padding:18px;text-align:center}
.resultado-sim .letra{font-family:var(--titulos);font-size:64px;line-height:1;color:var(--acento)}
.resultado-sim p{opacity:.9;font-size:14px}
.barra-sim{height:10px;border-radius:99px;background:rgba(255,255,255,.2);overflow:hidden;margin:12px 0 6px}
.barra-sim i{display:block;height:100%;background:var(--acento);border-radius:99px;transition:width .3s}

/* barra inferior del celular */
.ea-barra{position:fixed;left:0;right:0;bottom:0;z-index:45;background:#fff;border-top:1px solid var(--borde);display:grid;grid-template-columns:repeat(5,1fr);padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(0,0,0,.06)}
.ea-barra button{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11.5px;font-weight:700;color:var(--suave);cursor:pointer;padding:4px 0}
.ea-barra button.activo{color:var(--pri)}
.ea-barra button.centro .circ{width:52px;height:52px;border-radius:50%;background:var(--pri);color:#fff;display:grid;place-items:center;margin-top:-26px;box-shadow:0 6px 16px rgba(0,0,0,.25);border:4px solid #fff}
@media(min-width:1000px){.ea-barra{display:none}.ea-main{padding-bottom:40px}}

.ea-wa{position:fixed;right:16px;bottom:90px;z-index:44;width:56px;height:56px;border-radius:50%;background:#1faa53;color:#fff;display:grid;place-items:center;box-shadow:0 8px 22px rgba(0,0,0,.25);border:0;cursor:pointer}
.ea-wa svg.ic{width:28px;height:28px}
@media(min-width:1000px){.ea-wa{bottom:24px;right:24px}}

/* menú lateral */
.ea-velo{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:60;opacity:0;pointer-events:none;transition:opacity .2s}
.ea-velo.abierto{opacity:1;pointer-events:auto}
.ea-menu{position:fixed;top:0;bottom:0;left:0;width:min(320px,86vw);background:#fff;z-index:61;transform:translateX(-102%);transition:transform .22s;display:flex;flex-direction:column;overflow-y:auto}
.ea-menu.abierto{transform:none}
.ea-menu-cab{background:var(--herofondo);color:#fff;padding:22px 18px;display:flex;gap:12px;align-items:center}
.ea-menu-cab img{width:50px;height:50px;border-radius:50%;border:2px solid var(--acento)}
.ea-menu-cab b{font-family:var(--titulos);font-size:18px;display:block}
.ea-menu-cab span{font-size:12.5px;opacity:.85}
.ea-menu nav{padding:8px}
.ea-menu nav button{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;padding:13px 12px;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer;text-align:left}
.ea-menu nav button:hover,.ea-menu nav button.activo{background:var(--tinte);color:var(--pri)}
.ea-menu nav button .ic{color:var(--pri)}
.ea-menu .instalar{margin:8px 16px 20px}

/* aviso flotante */
.toast{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--tinta);color:#fff;padding:16px 22px;border-radius:16px;font-weight:700;z-index:80;display:none;box-shadow:0 12px 30px rgba(0,0,0,.3);max-width:86vw;text-align:center}

/* [ESTUDIOS-APP-2] celular: portada más compacta para que los accesos rápidos queden arriba de la barra, y el botón
   flotante de WhatsApp no se muestra en Inicio (ahí ya están «Consultá por WhatsApp» y el acceso WhatsApp). */
@media(max-width:759px){
  .hero{min-height:0}
  .hero-in{padding:84px 18px 20px!important}
  .hero-logo{width:50px;height:50px;margin-bottom:8px}
  .hero h1{font-size:30px}
  .hero-lema{font-size:14.5px;margin:6px 0 10px}
  .chip{font-size:12px;padding:4px 10px}
  .hero-bot{margin-top:12px;gap:8px}
  .hero-bot .btn{min-height:42px;padding:0 14px;font-size:14px;flex:1}
  .accesos{margin:12px 0}
}
@media(max-width:999px){ body.en-inicio .ea-wa{display:none} }

/* [TALLER-6 25-09] mapa real, fotos del equipo */
.mapa.real iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.mapa-ej{position:absolute;right:12px;top:12px;background:rgba(255,255,255,.94);color:var(--tinta);font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.15);z-index:1}
.mapa .btn{z-index:1}
.mapa.real .btn{bottom:28px}
.donde{display:grid;gap:12px}
.donde .mapa{height:200px}
@media(min-width:760px){.donde{grid-template-columns:1.2fr 1fr;align-items:stretch}.donde .mapa{height:auto;min-height:220px}}
.av img{width:100%;height:100%;object-fit:cover;display:block}
.miembro.con-foto .av{width:96px;height:96px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
