/* JcuestaProyects.AI · sitio web
   Misma paleta del portafolio: azul noche #0F172A y cian #22D3EE. */
:root{
  --ink:#0F172A; --ink-2:#334155; --ink-3:#64748B; --ink-4:#94A3B8;
  --rule:#E2E8F0; --soft:#F8FAFC; --white:#fff;
  --cian:#22D3EE; --cian-claro:#67E8F9; --cian-osc:#0E7490; --cian-bg:#ECFEFF;
  --rojo:#B91C1C; --verde:#047857;
  --radio:16px; --ancho:1160px;
  --sombra:0 1px 2px rgba(15,23,42,.05), 0 8px 24px rgba(15,23,42,.06);
}
*{ box-sizing:border-box; margin:0; padding:0 }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100% }
body{ font-family:Inter, system-ui, -apple-system, "Segoe UI", sans-serif; color:var(--ink); background:var(--white); line-height:1.6; font-size:17px }
img{ max-width:100%; display:block }
a{ color:inherit }
.ic{ width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round }
.contenedor{ width:100%; max-width:var(--ancho); margin:0 auto; padding:0 20px }
.mono{ font-family:"JetBrains Mono", ui-monospace, monospace; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700 }
.saltar{ position:absolute; left:-999px; top:8px; background:var(--cian); color:var(--ink); padding:8px 14px; border-radius:8px; z-index:100 }
.saltar:focus{ left:8px }

/* ── Encabezado ── */
.cabecera{ position:sticky; top:0; z-index:50; background:rgba(15,23,42,.94); backdrop-filter:blur(10px); border-bottom:1px solid #1E293B }
.cabecera .contenedor{ display:flex; align-items:center; justify-content:space-between; height:68px; gap:16px }
.marca{ display:flex; align-items:center; gap:10px; text-decoration:none; color:#fff; font-weight:800; letter-spacing:-.01em; font-size:1.05rem }
.marca img{ width:34px; height:34px; border-radius:9px }
.nav{ display:flex; align-items:center; gap:4px }
.nav a{ color:#CBD5E1; text-decoration:none; font-size:.93rem; font-weight:600; padding:8px 12px; border-radius:8px }
.nav a:hover, .nav a[aria-current="page"]{ color:#fff; background:#1E293B }
.nav a.boton{ margin-left:8px }
.menu-btn{ display:none; background:none; border:1px solid #334155; color:#fff; border-radius:10px; width:44px; height:44px; cursor:pointer }
.menu-btn svg{ width:22px; height:22px; margin:auto }

/* ── Botones ── */
.boton{ display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--cian); color:var(--ink) !important; font-weight:800; text-decoration:none; padding:13px 22px; border-radius:12px; border:0; font-size:1rem; cursor:pointer; transition:transform .15s, background .15s; font-family:inherit }
.boton:hover{ background:var(--cian-claro); transform:translateY(-1px) }
.boton.sec{ background:transparent; color:#fff !important; border:1.5px solid #475569 }
.boton.sec:hover{ border-color:var(--cian); background:rgba(34,211,238,.08) }
.boton.oscuro{ background:var(--ink); color:#fff !important }
.boton.oscuro:hover{ background:#1E293B }
.boton .ic{ width:18px; height:18px }
.nav a.boton{ padding:9px 16px; font-size:.9rem }

/* ── Héroe ── */
.heroe{ background:radial-gradient(1200px 500px at 85% -10%, rgba(34,211,238,.16), transparent 60%), var(--ink); color:#fff; padding:88px 0 96px; overflow:hidden }
.heroe .mono{ color:var(--ink-4) }
.heroe h1{ font-size:clamp(2.3rem, 5.4vw, 4rem); line-height:1.04; letter-spacing:-.035em; font-weight:850; margin:18px 0 22px; max-width:17ch }
.heroe h1 em{ font-style:normal; color:var(--cian-claro); display:block }
.heroe .lead{ font-size:clamp(1.05rem, 1.6vw, 1.22rem); color:#CBD5E1; max-width:60ch }
.heroe .lead strong{ color:#fff }
.heroe .acciones{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px }
.raya{ width:64px; height:4px; background:var(--cian); border-radius:4px }

.caminos{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:56px }
.camino{ display:block; text-decoration:none; border:1px solid #334155; border-radius:var(--radio); padding:24px; background:rgba(30,41,59,.5); transition:border-color .15s, transform .15s }
.camino:hover{ border-color:var(--cian); transform:translateY(-2px) }
.camino .mono{ color:var(--cian-claro) }
.camino h2{ font-size:1.3rem; margin:8px 0 6px; letter-spacing:-.02em }
.camino p{ color:#94A3B8; font-size:.97rem }
.camino .ir{ display:inline-flex; align-items:center; gap:6px; margin-top:14px; color:#fff; font-weight:700; font-size:.95rem }
.camino .ir .ic{ width:18px; height:18px }

/* ── Secciones ── */
.seccion{ padding:88px 0 }
.seccion.suave{ background:var(--soft) }
.seccion.oscura{ background:var(--ink); color:#fff }
.titulo{ margin-bottom:40px; max-width:760px }
.titulo .mono{ color:var(--cian-osc) }
.seccion.oscura .titulo .mono{ color:var(--cian-claro) }
.titulo h2{ font-size:clamp(1.8rem, 3.4vw, 2.6rem); line-height:1.1; letter-spacing:-.03em; font-weight:850; margin:10px 0 12px }
.titulo h2 em{ font-style:normal; color:var(--cian-osc) }
.seccion.oscura .titulo h2 em{ color:var(--cian-claro) }
.titulo p{ color:var(--ink-2); font-size:1.08rem }
.seccion.oscura .titulo p{ color:#CBD5E1 }

/* Tarjetas de líneas */
.lineas{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.linea-card{ display:flex; flex-direction:column; text-decoration:none; background:#fff; border:1px solid var(--rule); border-radius:var(--radio); padding:26px; box-shadow:var(--sombra); transition:transform .15s, border-color .15s }
.linea-card:hover{ transform:translateY(-3px); border-color:var(--cian) }
.icw{ width:52px; height:52px; border-radius:14px; background:var(--ink); color:var(--cian-claro); padding:12px; flex:none }
.linea-card .num{ margin-top:18px; color:var(--ink-3) }
.linea-card h3{ font-size:1.22rem; letter-spacing:-.02em; margin:4px 0 8px; line-height:1.25 }
.linea-card p{ color:var(--ink-2); font-size:.97rem; flex:1 }
.linea-card .pie{ display:flex; justify-content:space-between; align-items:flex-end; margin-top:20px; padding-top:16px; border-top:1px solid var(--rule) }
.desde{ font-size:.8rem; color:var(--ink-3) }
.desde b{ display:block; font-size:1.25rem; color:var(--ink); font-weight:850; letter-spacing:-.01em }
.linea-card .ver{ display:inline-flex; align-items:center; gap:4px; font-weight:700; color:var(--cian-osc); font-size:.93rem }
.linea-card .ver .ic{ width:16px; height:16px }

/* Pasos */
.pasos{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; counter-reset:paso }
.paso{ border:1px solid var(--rule); border-radius:var(--radio); padding:24px; background:#fff }
.paso .n{ width:40px; height:40px; border-radius:50%; background:var(--ink); color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; margin-bottom:14px }
.paso h3{ font-size:1.08rem; margin-bottom:6px }
.paso p{ color:var(--ink-2); font-size:.95rem }

/* Diferenciales */
.difs{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px }
.dif{ display:flex; gap:16px; padding:24px; border-radius:var(--radio); border:1px solid #1E293B; background:#111C33 }
.dif .icw{ background:#1E293B }
.dif h3{ font-size:1.1rem; margin-bottom:4px }
.dif p{ color:#94A3B8; font-size:.97rem }

/* Productos */
.productos{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.producto{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--rule); border-radius:var(--radio); padding:28px; box-shadow:var(--sombra) }
.producto .logo{ width:76px; height:76px; border-radius:18px; box-shadow:0 6px 18px rgba(15,23,42,.18) }
.producto .tipo{ margin-top:20px; color:var(--cian-osc) }
.producto h3{ font-size:1.4rem; letter-spacing:-.02em; margin:4px 0 8px }
.producto p{ color:var(--ink-2); font-size:.98rem }
.producto ul{ list-style:none; margin:14px 0 22px; flex:1 }
.producto li{ position:relative; padding-left:26px; margin:7px 0; color:var(--ink-2); font-size:.95rem }
.producto li::before{ content:""; position:absolute; left:2px; top:.5em; width:12px; height:7px; border-left:2.5px solid var(--cian-osc); border-bottom:2.5px solid var(--cian-osc); transform:rotate(-45deg) }
.producto .boton{ align-self:flex-start }
.producto .ver-app{ margin-top:12px; font-weight:600; font-size:.95rem; color:var(--cian-osc); text-decoration:none }
.producto .ver-app:hover{ text-decoration:underline }
.sello{ margin-top:10px; font-size:.82rem; color:var(--ink-3) }

/* Testimonios (se muestran solo si hay alguno en js/testimonios.js) */
.testimonios{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.testimonio{ background:#fff; border:1px solid var(--rule); border-radius:var(--radio); padding:28px; display:flex; flex-direction:column; gap:18px }
.testimonio blockquote{ font-size:1.03rem; color:var(--ink); line-height:1.6 }
.testimonio blockquote::before{ content:"“"; display:block; font-size:3rem; line-height:.6; color:var(--cian); font-weight:900; margin-bottom:10px }
.testimonio .quien{ display:flex; align-items:center; gap:12px; margin-top:auto; padding-top:16px; border-top:1px solid var(--rule) }
.testimonio .avatar{ width:46px; height:46px; border-radius:50%; background:var(--ink); color:var(--cian-claro); display:flex; align-items:center; justify-content:center; font-weight:800; flex:none; overflow:hidden }
.testimonio .avatar img{ width:100%; height:100%; object-fit:cover }
.testimonio .quien b{ display:block; font-size:.97rem }
.testimonio .quien span{ font-size:.86rem; color:var(--ink-3) }
.testimonio .linea-tag{ align-self:flex-start; background:var(--cian-bg); color:var(--cian-osc); font-size:.78rem; font-weight:700; padding:4px 10px; border-radius:99px }

/* Banda de llamado */
.banda{ background:var(--ink); color:#fff; border-radius:24px; padding:48px; display:grid; grid-template-columns:1.4fr 1fr; gap:32px; align-items:center; background-image:radial-gradient(600px 300px at 100% 0, rgba(34,211,238,.18), transparent 70%) }
.banda h2{ font-size:clamp(1.6rem, 3vw, 2.2rem); letter-spacing:-.03em; line-height:1.12 }
.banda p{ color:#CBD5E1; margin-top:10px }
.banda .acciones{ display:flex; flex-direction:column; gap:12px }
.banda .acciones .boton{ width:100% }

/* Página de línea */
.miga{ color:var(--ink-4); font-size:.9rem; margin-bottom:14px }
.miga a{ color:#CBD5E1; text-decoration:none } .miga a:hover{ color:#fff }
.heroe.linea .top{ display:flex; gap:20px; align-items:center }
.heroe.linea .icw{ width:72px; height:72px; padding:16px; border-radius:18px; background:#1E293B }
.heroe.linea h1{ margin:6px 0 0; max-width:none; font-size:clamp(2rem, 4.4vw, 3.2rem) }
.heroe.linea .desde{ color:#94A3B8; margin-top:26px; font-size:.95rem }
.heroe.linea .desde b{ color:#fff; font-size:1.8rem; display:inline; margin-left:6px }
.detalle{ display:grid; grid-template-columns:1fr 1fr; gap:24px }
.bloque{ border:1px solid var(--rule); border-radius:var(--radio); padding:30px; background:#fff }
.bloque h2{ font-size:.78rem; font-family:"JetBrains Mono", monospace; letter-spacing:.16em; text-transform:uppercase; color:var(--cian-osc); margin:0 0 10px }
.bloque h2 + p{ margin-bottom:26px }
.bloque p{ color:var(--ink-2) }
.lista{ list-style:none }
.lista li{ position:relative; padding-left:30px; margin:12px 0; color:var(--ink-2) }
.lista li::before{ content:""; position:absolute; left:4px; top:.45em; width:13px; height:7px; border-left:2.5px solid var(--cian-osc); border-bottom:2.5px solid var(--cian-osc); transform:rotate(-45deg) }
.ejemplo{ margin-top:24px; background:var(--cian-bg); border:1px solid #A5F3FC; border-radius:var(--radio); padding:24px 28px; color:var(--ink-2) }
.ejemplo b{ color:var(--ink) }
.otras{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px }
.otra{ display:flex; flex-direction:column; gap:10px; text-decoration:none; border:1px solid var(--rule); border-radius:14px; padding:16px; font-weight:700; font-size:.93rem; line-height:1.3; background:#fff }
.otra:hover{ border-color:var(--cian) }
.otra .icw{ width:40px; height:40px; padding:9px; border-radius:11px }

/* Nosotros */
.perfil{ display:grid; grid-template-columns:320px 1fr; gap:48px; align-items:start }
.foto{ aspect-ratio:4/5; border-radius:24px; background:var(--ink); display:flex; align-items:center; justify-content:center; background-image:radial-gradient(300px 240px at 80% 0, rgba(34,211,238,.25), transparent 70%) }
.foto img{ width:46%; border-radius:22%; }
.perfil h2{ font-size:clamp(1.7rem, 3vw, 2.3rem); letter-spacing:-.03em; line-height:1.15 }
.perfil .cargo{ color:var(--cian-osc); font-weight:700; margin:8px 0 18px; font-size:1.08rem }
.perfil p{ color:var(--ink-2); margin-bottom:14px }
.chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:20px }
.chips span{ border:1px solid var(--rule); background:var(--soft); border-radius:99px; padding:6px 14px; font-size:.88rem; font-weight:600; color:var(--ink-2) }

/* Contacto */
.contacto{ display:grid; grid-template-columns:1fr 1.2fr; gap:40px; align-items:start }
.canales{ display:flex; flex-direction:column; gap:14px }
.canal{ display:flex; gap:16px; align-items:center; text-decoration:none; border:1px solid var(--rule); border-radius:var(--radio); padding:20px; background:#fff }
.canal:hover{ border-color:var(--cian) }
.canal b{ display:block; font-size:1.05rem }
.canal span{ color:var(--ink-3); font-size:.92rem }
.formulario{ border:1px solid var(--rule); border-radius:24px; padding:32px; background:#fff; box-shadow:var(--sombra) }
.formulario h2{ font-size:1.4rem; letter-spacing:-.02em; margin-bottom:6px }
.formulario > p{ color:var(--ink-3); margin-bottom:22px; font-size:.95rem }
.campo{ margin-bottom:16px }
.campo label{ display:block; font-weight:700; font-size:.92rem; margin-bottom:6px }
.campo input, .campo select, .campo textarea{ width:100%; font:inherit; font-size:1rem; border:1.5px solid var(--rule); border-radius:10px; padding:12px 14px; background:#fff; color:var(--ink) }
.campo input:focus, .campo select:focus, .campo textarea:focus{ outline:none; border-color:var(--cian-osc); box-shadow:0 0 0 3px rgba(34,211,238,.25) }
.campo textarea{ min-height:120px; resize:vertical }
.dos{ display:grid; grid-template-columns:1fr 1fr; gap:14px }
.autoriza{ display:flex; gap:10px; align-items:flex-start; font-size:.88rem; color:var(--ink-2); margin:6px 0 20px }
.autoriza input{ margin-top:4px; width:18px; height:18px; flex:none; accent-color:var(--cian-osc) }
.oculto{ display:none }

/* Texto legal */
.legal{ max-width:820px }
.legal h2{ font-size:1.3rem; margin:34px 0 10px; letter-spacing:-.01em }
.legal p, .legal li{ color:var(--ink-2); margin-bottom:10px }
.legal ul{ padding-left:22px }

/* Descargas */
.descargas{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px }
.descargas a{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; border:1px solid var(--rule); border-radius:12px; padding:12px 18px; font-weight:700; background:#fff; font-size:.95rem }
.descargas a:hover{ border-color:var(--cian) }
.descargas .ic{ width:20px; height:20px; color:var(--cian-osc) }
.nota{ font-size:.86rem; color:var(--ink-3); margin-top:22px; max-width:900px }

/* ── Pie ── */
.pie-sitio{ background:#0B1222; color:#94A3B8; padding:56px 0 28px; font-size:.93rem }
.pie-sitio .cols{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px }
.pie-sitio h3{ color:#fff; font-size:.95rem; margin-bottom:12px }
.pie-sitio ul{ list-style:none }
.pie-sitio li{ margin:7px 0 }
.pie-sitio a{ text-decoration:none } .pie-sitio a:hover{ color:#fff }
.pie-sitio .marca{ margin-bottom:12px }
.pie-sitio .legal-pie{ border-top:1px solid #1E293B; margin-top:40px; padding-top:22px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-size:.84rem }

/* Botón flotante de WhatsApp */
.wa-flotante{ position:fixed; right:18px; bottom:18px; z-index:60; width:60px; height:60px; border-radius:50%; background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px rgba(0,0,0,.25); transition:transform .15s }
.wa-flotante:hover{ transform:scale(1.07) }
.wa-flotante svg{ width:32px; height:32px }

/* ── Celular y tableta ── */
@media (max-width:980px){
  .lineas, .productos, .testimonios{ grid-template-columns:1fr 1fr }
  .pasos{ grid-template-columns:1fr 1fr }
  .otras{ grid-template-columns:repeat(3,1fr) }
  .banda{ grid-template-columns:1fr; padding:36px }
  .pie-sitio .cols{ grid-template-columns:1fr 1fr }
  .contacto, .perfil{ grid-template-columns:1fr }
  .perfil .foto{ max-width:260px }
}
@media (max-width:860px){
  .menu-btn{ display:flex }
  .nav{ display:none; position:absolute; top:68px; left:0; right:0; flex-direction:column; align-items:stretch; background:var(--ink); padding:12px 16px 20px; border-bottom:1px solid #1E293B }
  .nav.abierto{ display:flex }
  .nav a{ padding:13px 12px; font-size:1rem }
  .nav a.boton{ margin:8px 0 0 }
}
@media (max-width:640px){
  body{ font-size:16px }
  .contenedor{ padding:0 16px }
  .heroe{ padding:56px 0 64px }
  .seccion{ padding:64px 0 }
  .caminos, .lineas, .productos, .testimonios, .pasos, .difs, .detalle, .dos{ grid-template-columns:1fr }
  .otras{ grid-template-columns:1fr 1fr }
  .banda{ padding:28px 22px; border-radius:18px }
  .heroe .acciones .boton{ width:100% }
  .pie-sitio .cols{ grid-template-columns:1fr }
  .formulario{ padding:22px }
  .wa-flotante{ width:52px; height:52px; right:14px; bottom:14px }
  .bloque{ padding:22px }
  .heroe.linea .top{ align-items:flex-start }
  .heroe.linea .icw{ width:56px; height:56px; padding:12px }
}
@media (prefers-reduced-motion:reduce){ *{ transition:none !important; scroll-behavior:auto !important } }
.foto.con-foto{ background:none; overflow:hidden } .foto.con-foto img{ width:100%; height:100%; object-fit:cover; border-radius:0 }
/* Ajustes para pantallas muy angostas (360 px) */
.marca{ min-height:44px }
.canal > div:last-child, .contacto > *{ min-width:0 }
.canal b{ overflow-wrap:anywhere }

/* ── Página de Proyectista AI (proyectista.html) ── */
.pa-heroe-grid{ display:grid; grid-template-columns:1.05fr 1fr; gap:48px; align-items:center }
.pa-heroe h1{ font-size:clamp(2.1rem, 4.4vw, 3.3rem); max-width:20ch }
.pa-chips{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin-top:28px }
.pa-chips li{ border:1px solid #334155; background:rgba(30,41,59,.6); color:#CBD5E1; border-radius:99px; padding:6px 13px; font-size:.84rem; font-weight:600 }
.pa-marco{ border-radius:18px; overflow:hidden; border:1px solid #334155; box-shadow:0 30px 80px rgba(0,0,0,.45), 0 0 0 6px rgba(34,211,238,.06); transform:perspective(1400px) rotateY(-6deg); transition:transform .4s }
.pa-marco:hover{ transform:none }
.pa-marco img{ width:100%; height:auto }
.pa-tres{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.pa-caja{ background:#fff; border:1px solid var(--rule); border-radius:var(--radio); padding:26px; box-shadow:var(--sombra) }
.pa-caja h3{ font-size:1.15rem; margin:16px 0 6px; letter-spacing:-.01em }
.pa-caja p{ color:var(--ink-2); font-size:.96rem }
.pa-video{ width:100%; max-width:960px; display:block; margin:0 auto; border-radius:18px; border:1px solid #334155; background:#0B1222; aspect-ratio:16/9; box-shadow:0 30px 80px rgba(0,0,0,.4) }
.pa-funciones{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.pa-func{ border:1px solid var(--rule); border-radius:var(--radio); padding:24px; background:#fff; transition:border-color .15s, transform .15s }
.pa-func:hover{ border-color:var(--cian); transform:translateY(-2px) }
.pa-func h3{ font-size:1.08rem; margin:14px 0 6px; letter-spacing:-.01em }
.pa-func p{ color:var(--ink-2); font-size:.95rem }
.pa-galeria{ display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:start }
.pa-captura{ border:1px solid var(--rule); border-radius:var(--radio); overflow:hidden; background:#fff; box-shadow:var(--sombra) }
.pa-captura img{ width:100%; height:auto; border-bottom:1px solid var(--rule) }
.pa-captura figcaption{ padding:14px 18px; color:var(--ink-2); font-size:.93rem }
.pa-quien{ grid-template-columns:repeat(3,1fr); margin-top:0 }
.pa-quien .camino:hover{ transform:none; border-color:#334155 }
.pa-planes{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:stretch }
.pa-plan{ position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--rule); border-radius:20px; padding:28px; box-shadow:var(--sombra) }
.pa-plan.destacado{ border:2px solid var(--cian); box-shadow:0 20px 50px rgba(14,116,144,.18) }
.pa-cinta{ position:absolute; top:-12px; left:24px; background:var(--cian); color:var(--ink); padding:4px 10px; border-radius:99px; font-size:.68rem }
.pa-plan h3{ font-size:1.25rem; letter-spacing:-.02em }
.pa-para{ color:var(--ink-3); font-size:.92rem; margin-top:4px }
.pa-precio{ margin:18px 0 6px; padding-bottom:16px; border-bottom:1px solid var(--rule) }
.pa-precio b{ display:block; font-size:2rem; font-weight:850; letter-spacing:-.03em; line-height:1.1 }
.pa-precio span{ color:var(--ink-3); font-size:.9rem }
.pa-plan .lista{ flex:1; margin-bottom:22px }
.pa-plan .lista li{ font-size:.95rem; margin:10px 0 }
.pa-plan .boton{ width:100% }
.pa-faq-caja{ max-width:860px }
.pa-faq{ border:1px solid var(--rule); border-radius:14px; background:#fff; margin-bottom:12px }
.pa-faq summary{ cursor:pointer; list-style:none; padding:18px 52px 18px 22px; font-weight:700; position:relative }
.pa-faq summary::-webkit-details-marker{ display:none }
.pa-faq summary::after{ content:"+"; position:absolute; right:22px; top:50%; transform:translateY(-50%); font-size:1.4rem; color:var(--cian-osc); font-weight:500 }
.pa-faq[open] summary::after{ content:"−" }
.pa-faq p{ padding:0 22px 20px; color:var(--ink-2) }
@media (max-width:980px){
  .pa-heroe-grid{ grid-template-columns:1fr; gap:40px }
  .pa-marco{ transform:none }
  .pa-tres, .pa-funciones, .pa-planes, .pa-quien{ grid-template-columns:1fr 1fr }
}
@media (max-width:640px){
  .pa-tres, .pa-funciones, .pa-planes, .pa-quien{ grid-template-columns:1fr }
  .pa-galeria{ grid-template-columns:1fr }
  .pa-plan{ padding:24px }
}
/* Entregables de la formulación */
.pa-ent-cab{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:34px 0 14px; padding-bottom:10px; border-bottom:1px solid var(--rule) }
.titulo + .pa-ent-cab{ margin-top:0 }
.pa-ent-cab h3{ font-size:1.15rem; letter-spacing:-.01em }
.pa-ent-cab span{ font-size:.85rem; font-weight:700; color:var(--cian-osc); white-space:nowrap }
.pa-docs{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px }
.pa-doc{ display:flex; flex-direction:column; border:1px solid var(--rule); border-radius:14px; padding:18px; background:#fff }
.pa-doc h4{ font-size:1rem; margin:10px 0 4px; letter-spacing:-.01em }
.pa-doc p{ color:var(--ink-2); font-size:.9rem; flex:1 }
.pa-fmt{ align-self:flex-start; font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:3px 9px; border-radius:6px }
.pa-fmt.word{ background:#DBEAFE; color:#1E40AF }
.pa-fmt.excel{ background:#D1FAE5; color:#065F46 }
.pa-docs.cinco{ grid-template-columns:repeat(5,1fr) }
.pa-docs.cinco .pa-doc{ padding:16px }
.pa-cuando{ margin-top:12px; font-size:.8rem; color:var(--cian-osc); font-weight:600 }
.pa-ent-dos{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:34px }
.pa-ent-caja{ border:1px solid var(--rule); border-radius:var(--radio); padding:24px; background:var(--soft) }
.pa-ent-caja .pa-ent-cab{ margin:0 0 10px }
.pa-ent-caja > p{ color:var(--ink-2); font-size:.95rem }
.pa-pdf{ list-style:none; margin:14px 0 }
.pa-pdf li{ display:flex; gap:10px; align-items:center; padding:7px 0; border-bottom:1px dashed var(--rule); font-size:.93rem; color:var(--ink-2) }
.pa-pdf li::before{ content:"PDF"; font-size:.65rem; font-weight:800; background:#FEE2E2; color:#991B1B; padding:2px 6px; border-radius:5px }
.pa-mini{ font-size:.88rem; color:var(--ink-3) }
.pa-certs{ list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:6px 14px; margin:14px 0 }
.pa-certs li{ display:flex; gap:8px; align-items:baseline; font-size:.9rem; color:var(--ink-2) }
.pa-certs b{ font-family:"JetBrains Mono", monospace; font-size:.72rem; color:var(--cian-osc); min-width:2.2em }
.pa-extra{ border-top:1px solid var(--rule); padding-top:6px }
.pa-extra li{ margin:8px 0; font-size:.92rem }
@media (max-width:980px){ .pa-docs, .pa-docs.cinco{ grid-template-columns:1fr 1fr } .pa-ent-dos{ grid-template-columns:1fr } }
@media (max-width:640px){ .pa-docs, .pa-docs.cinco, .pa-certs{ grid-template-columns:1fr } .pa-ent-cab{ flex-wrap:wrap } }
/* Formulario de Proyectista (prospectos al CRM y luego WhatsApp) */
.pa-dialogo{ margin:auto; border:0; border-radius:20px; padding:0; width:min(640px, calc(100% - 24px)); max-height:calc(100vh - 24px); overflow:auto; box-shadow:0 30px 80px rgba(15,23,42,.35); color:var(--ink) }
.pa-dialogo::backdrop{ background:rgba(15,23,42,.6); backdrop-filter:blur(3px) }
.pa-form, .pa-f-listo{ position:relative; padding:30px 28px 26px }
.pa-dialogo h2{ font-size:1.45rem; letter-spacing:-.02em; line-height:1.2; padding-right:36px }
.pa-f-sub, .pa-f-listo p{ color:var(--ink-2); margin:6px 0 18px; font-size:.96rem }
.pa-cerrar{ position:absolute; top:14px; right:14px; width:38px; height:38px; border-radius:50%; border:1px solid var(--rule); background:#fff; font-size:1.4rem; line-height:1; cursor:pointer; color:var(--ink-2) }
.pa-f-rejilla{ display:grid; grid-template-columns:1fr 1fr; gap:12px 14px }
.pa-f-rejilla .ancho{ grid-column:1 / -1 }
.pa-f-rejilla label{ display:flex; flex-direction:column; gap:5px; font-weight:700; font-size:.88rem }
.pa-f-rejilla input, .pa-f-rejilla select, .pa-f-rejilla textarea{ font:inherit; font-weight:400; font-size:1rem; border:1.5px solid var(--rule); border-radius:10px; padding:10px 12px; background:#fff; color:var(--ink); width:100% }
.pa-f-rejilla input:focus, .pa-f-rejilla select:focus, .pa-f-rejilla textarea:focus{ outline:none; border-color:var(--cian-osc); box-shadow:0 0 0 3px rgba(34,211,238,.25) }
.pa-f-rejilla label.pa-autoriza{ flex-direction:row; align-items:flex-start; gap:10px; font-weight:400; font-size:.85rem; color:var(--ink-2) }
.pa-autoriza input{ width:18px; height:18px; flex:none; margin-top:3px; accent-color:var(--cian-osc) }
.pa-trampa{ position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden }
.pa-f-error{ color:var(--rojo); font-weight:600; font-size:.92rem; min-height:1.2em; margin:12px 0 4px }
.pa-form .boton, .pa-f-listo .boton{ width:100% }
@media (max-width:640px){ .pa-f-rejilla{ grid-template-columns:1fr } .pa-form, .pa-f-listo{ padding:24px 18px 20px } }

/* ═════════════ Angy (angy.html) ═════════════ */
.an-heroe{ justify-self:center; width:min(300px, 80%); border-radius:34px; overflow:hidden; border:8px solid #1E293B; box-shadow:0 30px 80px rgba(0,0,0,.45), 0 0 0 6px rgba(225,36,116,.12) }
.an-heroe img{ width:100%; height:auto; display:block }
.an-galeria{ display:grid; grid-template-columns:repeat(4, 1fr); gap:22px; align-items:start }
.an-cel{ margin:0; text-align:center }
.an-cel img{ width:100%; height:auto; border-radius:22px; border:6px solid #1E293B; box-shadow:var(--sombra) }
.an-cel figcaption{ margin-top:10px; color:var(--ink-2); font-size:.9rem }
.mt-2{ margin-top:32px }
@media (max-width:860px){ .an-galeria{ grid-template-columns:repeat(2, 1fr) } }