/* GENERADO desde diseno/final/home/index.html. No editar. */
:root{--night-950:#070B16;--night-900:#0B1124;--night-850:#10182F;--night-800:#16203C;--line-dark:#2A3760;--on-dark:#EEF1F8;--on-dark-2:#AEB8D0;
--paper:#fff;--mist:#F4F5FA;--line:#DDE1EC;--ink:#0B1124;--ink-2:#434D66;--violet-600:#6D28D9;--violet-500:#7C3AED;--violet-300:#BBA6FF;--violet-100:#EFE9FF;
--mint-400:#34D399;--mint-600:#059669;--amber-400:#FBBF24;--amber-300:#FCD34D;
--f-display:"Bricolage Grotesque","Geist",system-ui,sans-serif;--f-body:"Geist",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--f-mono:"Geist Mono",ui-monospace,Menlo,monospace;
--gutter:clamp(20px,5vw,100px);--section:clamp(64px,4rem + 4vw,128px);--r-md:14px;--r-lg:22px;--r-xl:30px;--r-pill:999px;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}body{margin:0;font:400 1.0625rem/1.6 var(--f-body);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
a{color:inherit}img{max-width:100%;display:block}p{margin:0}
h1,h2{font-family:var(--f-display);font-weight:750;letter-spacing:-.025em;line-height:1.05;margin:0}
:focus-visible{outline:3px solid var(--violet-600);outline-offset:3px;border-radius:6px}
.dark{background:var(--night-950);color:var(--on-dark)}.dark :focus-visible,.footer :focus-visible,.promo :focus-visible{outline-color:var(--violet-300)}
.wrap{width:min(100% - 2*var(--gutter),1180px);margin-inline:auto}
.promo{background:var(--night-950);color:var(--on-dark-2);border-bottom:1px solid var(--line-dark);font-size:.9375rem}
.promo .wrap{display:flex;align-items:center;justify-content:center;gap:16px;min-height:44px;padding-block:8px;text-align:center}
.promo strong{color:#fff}.promo code{font:600 .875rem var(--f-mono);color:var(--ink);background:var(--amber-400);padding:2px 8px;border-radius:5px}
.promo a{color:var(--mint-400);font-weight:600;text-underline-offset:4px;white-space:nowrap;display:inline-flex;align-items:center;min-height:44px}
header{background:rgba(7,11,22,.92);border-bottom:1px solid rgba(42,55,96,.7);color:var(--on-dark)}
header .wrap{display:flex;align-items:center;gap:16px;height:76px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-height:44px}
.mark{display:inline-grid;grid-template-columns:repeat(3,8px);gap:3px}.mark i{width:8px;height:8px;border-radius:2px;background:var(--violet-500)}.mark i:nth-child(7){background:var(--mint-400)}
.brand b{font:700 1.25rem/1 var(--f-display);letter-spacing:-.01em}
.pendiente{display:inline-flex;align-items:center;font:500 .75rem/1.4 var(--f-mono);color:var(--amber-300);background:rgba(251,191,36,.08);border:1.5px dashed rgba(251,191,36,.55);border-radius:6px;padding:3px 8px}
header nav{margin-left:auto;display:flex;gap:4px}header nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:var(--r-pill);color:var(--on-dark-2);text-decoration:none;font-size:.9375rem}header nav a:hover{color:var(--on-dark);background:rgba(255,255,255,.06)}
.tag{display:inline-flex;align-items:center;gap:10px;font:500 .8125rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--violet-600)}.tag::before{content:"";width:8px;height:8px;border-radius:2px;background:currentColor}
.dark .tag{color:var(--violet-300)}
.hero{position:relative;overflow:hidden;background:radial-gradient(900px 520px at 78% 20%, rgba(124,58,237,.22), transparent 62%),radial-gradient(700px 420px at 10% 110%, rgba(16,185,129,.10), transparent 60%),var(--night-950)}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(170,184,220,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(170,184,220,.06) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 60% 40%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at 60% 40%,#000 30%,transparent 75%)}
.hero .wrap{position:relative;display:grid;gap:24px;padding-block:120px 112px;max-width:1180px}
.hero h1{font-size:clamp(2.375rem,1.6rem + 3.4vw,4.5rem);font-weight:800;letter-spacing:-.035em;max-width:900px}.hero h1 em{font-style:normal;color:var(--mint-400)}
.hero p{font-size:clamp(1.125rem,1.05rem + .35vw,1.3125rem);color:var(--on-dark-2);max-width:680px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 26px;border-radius:var(--r-pill);background:var(--mint-400);color:var(--ink);font:600 1.0625rem/1 var(--f-body);text-decoration:none;box-shadow:inset 0 0 0 1px var(--mint-600),0 8px 24px rgba(16,185,129,.28);transition:transform .18s var(--ease),background-color .18s}
.btn:hover{background:#4ADEA8;transform:translateY(-1px)}.btn svg{width:18px;height:18px}
.hero .btn{justify-self:start;margin-top:12px}
section{padding-block:var(--section)}
.product{background:var(--mist)}
.card{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:56px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-xl);padding:48px;box-shadow:0 2px 6px rgba(11,17,36,.08),0 18px 48px rgba(11,17,36,.12)}
.card .txt{display:grid;gap:20px}.card h2{font-size:clamp(1.875rem,1.4rem + 1.8vw,2.75rem)}.card .txt>p{color:var(--ink-2);font-size:1.125rem}
.card .btn{justify-self:start}
.micro{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.9375rem;color:var(--ink-2)}.micro span{display:inline-flex;align-items:center;gap:8px}.micro span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--mint-600)}
.shot{margin:0;border-radius:var(--r-md);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 30px 80px rgba(11,17,36,.18);transform:rotate(1.5deg)}
.shot .bar{display:flex;align-items:center;gap:8px;height:34px;padding:0 14px;background:#E9ECF4;font:500 .75rem/1 var(--f-mono);color:#434D66;white-space:nowrap;overflow:hidden}.shot .bar i{flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:#C7CCDA}.shot .bar b{margin-left:6px;font-weight:500}
.shot img{width:100%;height:auto}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.box{display:grid;gap:16px;align-content:start;border:1px solid var(--line);border-radius:var(--r-xl);padding:40px}
.box h2{font-size:clamp(1.75rem,1.4rem + 1.2vw,2.375rem)}.box p{color:var(--ink-2);font-size:1.125rem}
.avatar{position:relative;overflow:hidden;width:88px;height:88px;border-radius:50%;background:linear-gradient(150deg,#233056,#0B1124);border:2px solid var(--violet-500);display:grid;place-items:center;color:#fff;font:800 1.75rem var(--f-display)}
.avatar::after{content:"";position:absolute;left:50%;bottom:-24px;width:70px;height:46px;transform:translateX(-50%);border-radius:35px 35px 0 0;background:rgba(187,166,255,.14)}
.avatar span{position:relative;z-index:1;margin-top:-10px}
.contact{background:var(--night-900);color:var(--on-dark);border-color:var(--line-dark)}.contact p{color:var(--on-dark-2)}
.mail{color:var(--violet-600);font-weight:600;text-underline-offset:4px;display:inline-flex;align-items:center;min-height:44px}.contact .mail{color:var(--mint-400)}
.footer{background:var(--night-950);color:var(--on-dark-2);border-top:1px solid var(--line-dark);font-size:.875rem}
.footer .wrap{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding-block:48px}.footer .l,.footer .r{display:grid;gap:12px;align-content:start}
.footer .brand{color:var(--on-dark)}.footer .mail{color:var(--violet-300)}.legal{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:1023.98px){.card{grid-template-columns:1fr;gap:36px}.shot{transform:none}}
@media (max-width:767.98px){
  .promo{font-size:.875rem}.promo .wrap{flex-direction:column;gap:0;padding-block:8px 2px;line-height:1.45}
  header .wrap{height:auto;min-height:64px;flex-wrap:wrap;padding-block:6px;gap:4px 12px}
  header nav{margin-left:0;width:100%;justify-content:space-between;border-top:1px solid var(--line-dark)}
  header nav a{padding:0 6px;font-size:.875rem}
  .hero .wrap{padding-block:56px 64px}.hero .btn{width:100%}
  .card{padding:22px;border-radius:var(--r-lg)}.card .btn{width:100%}
  .duo,.footer .wrap{grid-template-columns:1fr}.box{padding:26px 22px;border-radius:var(--r-lg)}
  .footer .wrap{gap:24px;padding-block:36px}
}

/* ── Parches de QA (construir_desde_diseno.py) ── */
/* M3: <picture> no altera la maqueta */
picture{display:contents}
/* N5: la barra de la tarjeta corta con puntos suspensivos a 320–360 px */
.shot .bar b{min-width:0;overflow:hidden;text-overflow:ellipsis}
/* N7: objetivo táctil del logo ≥ 44 px */
.brand{min-height:44px}

/* ── Estilos que el diseño tenía en atributos style="" (movidos aquí para la CSP) ── */
.u-0235d4{color:var(--violet-300)!important}
.u-03c4bb{justify-content:center!important}
.u-068a8d{grid-column:1/-1!important}
.u-0e8de2{background:var(--ink)!important}
.u-1e421a{display:grid!important;gap:10px!important;margin-top:18px!important}
.u-2517a5{margin-top:22px!important}
.u-318719{transform:scale(1.6)!important;margin-bottom:14px!important}
.u-789157{color:var(--ink)!important}
.u-896eec{display:grid!important;gap:24px!important}
.u-99409a{list-style:none!important;margin:0!important;padding:0!important}
.u-b67125{font-size:1.0625rem!important}
.u-b87ca3{display:flex!important;align-items:center!important;gap:10px!important}
.u-bb6a43{position:absolute!important}
.u-d4693f{font-size:.8125rem!important;padding:4px 0!important}
.u-d865aa{list-style:none!important;margin:10px 0 0!important;padding:0!important}
.u-f457b5{display:grid!important}