:root{
  --bg:#070b15; --bg-2:#0a1020;
  --panel:rgba(13,20,38,.72); --panel-2:rgba(148,163,184,.05);
  --line:rgba(148,163,184,.17); --line-soft:rgba(148,163,184,.09);
  --ink:#edf1f9; --soft:#9aa7bd; --dim:#7f8ba6;
  --cyan:#38e1d5; --cyan-soft:#8ef0e8; --blue:#4f8ff7; --sky:#5cc8f5;
  --oro:#d9ad63; --oro-suave:#eccf9d;
  --ok:#3fd99a; --rojo:#f87171;
  --grad:linear-gradient(96deg,#5cc8f5 0%,#38e1d5 100%);
  --grad-oro:linear-gradient(96deg,#eccf9d 0%,#d9ad63 100%);
  --glow:0 0 52px -14px rgba(56,225,213,.4);
  --t-card-lg:clamp(21px,2.4vw,25px);
  --t-card:20px;
  --t-cap:17px;
  --font-display:"Fraunces",Georgia,"Times New Roman",serif;
  --font-body:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"IBM Plex Mono","SF Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--font-body);
  font-size:16.5px; line-height:1.7; font-weight:400; -webkit-font-smoothing:antialiased; overflow-x:hidden}
body::before{content:""; position:fixed; inset:0; z-index:-3; pointer-events:none;
  background:radial-gradient(720px 540px at 14% -6%, rgba(56,225,213,.13), transparent 60%),
             radial-gradient(860px 620px at 94% 108%, rgba(79,143,247,.12), transparent 62%),
             radial-gradient(620px 480px at 80% 6%, rgba(56,225,213,.10), transparent 62%),
             radial-gradient(480px 400px at 4% 62%, rgba(217,173,99,.05), transparent 60%)}
body::after{content:""; position:fixed; inset:0; z-index:-2; pointer-events:none; opacity:.55;
  background-image:linear-gradient(to right, rgba(148,163,184,.045) 1px, transparent 1px),
                   linear-gradient(to bottom, rgba(148,163,184,.045) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 82% 56% at 50% 0%, #000 30%, transparent 100%);
          mask-image:radial-gradient(ellipse 82% 56% at 50% 0%, #000 30%, transparent 100%)}
.grain{position:fixed; inset:-50%; z-index:-1; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E")}
::selection{background:rgba(56,225,213,.28); color:#e6fffc}
.sheet{position:relative; max-width:1120px; margin:0 auto; padding:0 26px}
a{color:var(--sky)}
a:focus-visible,button:focus-visible{outline:2px solid var(--cyan); outline-offset:3px; border-radius:4px}

.top{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:26px 0 0}
.wordmark{font-family:var(--font-body); font-size:25px; font-weight:300; letter-spacing:.05em; color:#fff; text-decoration:none}
.wordmark .ai{font-weight:700; color:var(--cyan)}
.wordmark small{display:block; font-family:var(--font-mono); font-size:10.5px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:var(--dim); margin-top:3px}
.top-actions{display:flex; align-items:center; gap:10px}
.lang-sw{font-family:var(--font-mono); font-size:12px; font-weight:600; letter-spacing:.1em; text-decoration:none;
  color:var(--soft); border:1px solid var(--line); border-radius:999px; padding:8px 14px; transition:color .15s, border-color .15s}
.lang-sw:hover{color:var(--oro-suave); border-color:rgba(217,173,99,.55)}
.top-cta{font-family:var(--font-body); font-size:13.5px; font-weight:600; letter-spacing:.01em; text-decoration:none; color:var(--ink);
  background:var(--panel-2); border:1px solid var(--line); border-radius:999px; padding:9px 16px;
  white-space:nowrap; transition:border-color .15s, color .15s}
.top-cta:hover{border-color:rgba(217,173,99,.5); color:var(--oro-suave)}

nav.divs{display:flex; flex-wrap:wrap; gap:2px 24px; margin:24px 0 0; padding:13px 0;
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft)}
nav.divs a{font-family:var(--font-mono); font-size:12.5px; letter-spacing:.05em; text-decoration:none; color:var(--soft); padding:3px 0; border-bottom:2px solid transparent; transition:color .15s}
nav.divs a:hover{color:var(--oro-suave)}
nav.divs a.act{color:var(--oro-suave); border-bottom-color:var(--oro); font-weight:600}

/* ---------- hero con orbe ---------- */
.hero{padding:64px 0 0}
.hero-grid{display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:24px 56px; align-items:center}
@media (max-width:960px){ .hero-grid{grid-template-columns:1fr; gap:30px} .orb-side{justify-self:center; width:min(300px,76vw)} }

.eyebrow{font-family:var(--font-mono); font-size:11.5px; font-weight:600; letter-spacing:.26em; text-transform:uppercase; color:var(--oro)}
h1.big{font-family:var(--font-display); font-weight:500; font-size:clamp(38px,5.6vw,66px); font-variation-settings:"opsz" 144;
  line-height:1.06; letter-spacing:-.022em; margin:18px 0 0; max-width:19ch; text-wrap:balance; color:#fff}
h1.big em, h1.divtitle em{font-style:italic; font-weight:520; color:var(--cyan)}
h1.divtitle{font-family:var(--font-display); font-weight:500; font-size:clamp(33px,4.8vw,54px); font-variation-settings:"opsz" 144;
  line-height:1.08; letter-spacing:-.02em; margin:16px 0 0; max-width:24ch; text-wrap:balance; color:#fff}
.lead{font-size:clamp(16.5px,2.2vw,18.5px); color:var(--soft); max-width:58ch; margin:22px 0 0; font-weight:400}
.lead strong{color:var(--ink); font-weight:700}
.divhead{padding:56px 0 0}
.divnum{font-family:var(--font-mono); font-size:11.5px; font-weight:600; letter-spacing:.26em; text-transform:uppercase; color:var(--oro)}

.hero-ctas{display:flex; flex-wrap:wrap; gap:12px; margin:30px 0 0}
.cta-b{display:inline-flex; align-items:center; gap:9px; text-decoration:none; cursor:pointer;
  font-family:var(--font-body); font-size:15px; font-weight:700; letter-spacing:.01em; border-radius:6px; padding:14px 26px;
  border:1px solid transparent; transition:background .15s, border-color .15s, color .15s}
.cta-b:hover{transform:none}
.cta-b.primario{background:var(--oro); color:#171006; box-shadow:none}
.cta-b.primario:hover{background:var(--oro-suave)}
.cta-b.linea{background:var(--panel-2); color:var(--ink); border-color:var(--line)}
.cta-b.linea:hover{border-color:rgba(217,173,99,.5); color:var(--oro-suave)}
.cta-nota{display:block; margin:12px 0 0; font-family:var(--font-mono); font-size:12px; color:var(--dim); letter-spacing:.02em}

/* el orbe — la IA de la casa, en vivo */
.orb-side{position:relative; text-align:center; width:min(380px,86vw)}
.orb-shell{position:relative; width:100%; aspect-ratio:1; display:grid; place-items:center}
.orb-shell::before{content:""; position:absolute; inset:2%; border-radius:50%;
  background:radial-gradient(circle at 36% 30%, rgba(56,225,213,.30), rgba(79,143,247,.13) 46%, transparent 70%);
  filter:blur(26px)}
.orb-shell::after{content:""; position:absolute; inset:11%; border-radius:50%;
  border:1px solid rgba(56,225,213,.16); pointer-events:none;
  box-shadow:0 0 90px -24px rgba(56,225,213,.40), inset 0 0 70px -34px rgba(56,225,213,.28)}
canvas.orb{width:100%; height:100%; display:block; position:relative; z-index:1}
.orb-tag{position:absolute; top:6%; left:50%; transform:translateX(-50%); z-index:2;
  font-family:var(--font-mono); font-size:10.5px; font-weight:600; letter-spacing:.24em; text-transform:uppercase;
  color:var(--cyan-soft); background:rgba(7,11,21,.72); border:1px solid rgba(56,225,213,.35);
  border-radius:999px; padding:5px 14px; white-space:nowrap; backdrop-filter:blur(6px)}
.orb-tag i{display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--ok); margin-right:8px; vertical-align:1px}
@media (prefers-reduced-motion:no-preference){
  .orb-tag i{animation:vpulse 1.4s ease-in-out infinite}
}
.orb-ctas{margin:2px 0 0; display:flex; flex-direction:column; align-items:center; gap:10px}
.voz-status{color:var(--dim); font-family:var(--font-mono); font-size:12px}
.voz-status .pulse{display:inline-block; width:9px; height:9px; border-radius:50%; background:var(--ok); margin-right:7px; vertical-align:0}
@media (prefers-reduced-motion:no-preference){
  .voz-status .pulse{animation:vpulse 1.2s ease-in-out infinite}
  @keyframes vpulse{50%{opacity:.25}}
}
.voz-btn{font-family:var(--font-body); font-size:15.5px; font-weight:700; letter-spacing:.01em; color:#04201d;
  background:var(--cyan); border:none; border-radius:6px; padding:15px 28px;
  cursor:pointer; transition:background .15s; box-shadow:none}
.voz-btn:hover{transform:none; background:var(--cyan-soft)}
.voz-btn[disabled]{opacity:.6; cursor:wait}
.voz-btn.live{background:#e25555; color:#2b0808}
.voz-log{margin:18px auto 0; max-width:640px; max-height:210px; overflow-y:auto; display:none; text-align:left;
  background:var(--panel); border:1px solid rgba(56,225,213,.22); border-radius:12px; padding:14px 18px;
  font-family:var(--font-mono); font-size:13px; line-height:1.8}
.voz-log.on{display:block}
.voz-log .vu{color:var(--cyan-soft)}
.voz-log .va{color:#cbd5e1}
.voz-log .vu::before{content:"usted › "; color:var(--dim)}
.voz-log .va::before{content:"ia › "; color:var(--ok)}
:lang(en) .voz-log .vu::before{content:"you › "}
:lang(en) .voz-log .va::before{content:"ai › "}
.voz-nota{color:var(--soft); font-size:14px; margin:16px 0 0; font-weight:400}
.voz-nota strong{color:var(--ink)}
.voz-panel{background:var(--panel); border:1px solid rgba(56,225,213,.25); border-radius:12px;
  padding:24px; margin:26px 0 0; max-width:640px; font-family:var(--font-mono); font-size:13.5px}
.voz-row{display:flex; align-items:center; gap:14px; flex-wrap:wrap}

/* puertas de entrada — el visitante navega a lo suyo desde la primera pantalla */
.puertas{display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:36px 0 0}
.puertas .plbl{flex-basis:100%; font-family:var(--font-mono); font-size:10.5px; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--oro); margin-bottom:2px}
.puerta{display:inline-flex; align-items:center; gap:8px; white-space:nowrap; text-decoration:none; font-family:var(--font-body); font-size:14px; font-weight:600; color:var(--ink);
  background:var(--panel-2); border:1px solid var(--line); border-radius:8px; padding:11px 16px;
  transition:border-color .15s, color .15s, background .15s}
.puerta:hover{border-color:rgba(217,173,99,.55); color:var(--oro-suave); background:rgba(217,173,99,.05)}
.puerta i{font-style:normal; color:var(--oro); transition:transform .2s}
.puerta:hover i{transform:translateX(3px)}
.puerta.venta{border-style:dashed}
@media (max-width:560px){ .puerta{font-size:13.5px; padding:12px 14px} }

.expediente{display:flex; flex-wrap:wrap; gap:16px 44px; margin:38px 0 0; padding:22px 0;
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft)}
.dato{position:relative; padding:12px 0 2px; font-family:var(--font-mono); font-size:10.5px; color:var(--dim); letter-spacing:.12em; text-transform:uppercase}
.dato::before{content:""; position:absolute; top:0; left:0; width:28px; height:1px; background:var(--grad-oro)}
.dato b{display:block; font-family:var(--font-display); font-weight:560; font-variation-settings:"opsz" 72;
  font-size:clamp(26px,3vw,34px); line-height:1.15; font-variant-numeric:tabular-nums; letter-spacing:0;
  color:#fff; margin-bottom:4px; text-transform:none}
.dato.dual b{color:var(--oro-suave)}

.clausula{padding:78px 0 0; position:relative}
.clausula::before{content:""; position:absolute; inset:-40px -26px 0; z-index:-1; pointer-events:none;
  background:radial-gradient(560px 320px at 12% 6%, rgba(79,143,247,.06), transparent 65%)}
#papa::before{background:radial-gradient(700px 480px at 26% 44%, rgba(217,173,99,.11), transparent 66%),
  radial-gradient(420px 300px at 78% 18%, rgba(217,173,99,.05), transparent 60%)}
.cnum{display:block; font-family:var(--font-mono); font-size:11.5px; font-weight:600; letter-spacing:.26em; text-transform:uppercase; color:var(--oro); margin-bottom:6px}
.clausula h2{font-family:var(--font-display); font-weight:520; font-size:clamp(28px,3.6vw,40px); font-variation-settings:"opsz" 100;
  letter-spacing:-.014em; line-height:1.12; margin:6px 0 0; text-wrap:balance; color:#fff}
.csub{color:var(--soft); font-size:16px; max-width:64ch; margin:14px 0 0; font-weight:400}
.intro-p{font-family:var(--font-display); font-weight:420; font-variation-settings:"opsz" 40;
  font-size:clamp(19px,2.6vw,24px); line-height:1.5; max-width:56ch; margin:14px 0 0; color:#d7deeb}
.intro-p strong{color:var(--cyan-soft); font-weight:560}
.dominios{display:flex; flex-wrap:wrap; gap:8px 26px; margin:26px 0 0}
.dominios a{font-family:var(--font-mono); font-size:13.5px; color:var(--ink); text-decoration:none; border-bottom:1px solid rgba(217,173,99,.45); padding-bottom:2px; transition:color .15s}
.dominios a:hover{color:var(--oro-suave)}
.dominios .lbl{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--dim); align-self:center}

/* índice de divisiones — cláusulas, no tarjetas */
.divgrid{display:block; margin:30px 0 0; border-top:1px solid var(--line)}
.dcard{position:relative; display:grid; grid-template-columns:88px minmax(0,1fr) auto; column-gap:32px; row-gap:6px;
  align-items:baseline; background:transparent; border:0; border-bottom:1px solid var(--line-soft); border-radius:0;
  padding:30px 6px; text-decoration:none; color:var(--ink); transition:background .2s}
.dcard::before{display:none}
.dcard:hover{background:rgba(217,173,99,.045); transform:none; box-shadow:none}
.dcard .dnum{grid-row:1 / span 2; font-family:var(--font-display); font-style:italic; font-weight:430;
  font-size:clamp(30px,3.4vw,42px); letter-spacing:0; text-transform:none; color:var(--oro); line-height:1}
.dcard h3{grid-column:2; font-family:var(--font-display); font-weight:520; font-size:var(--t-card-lg); margin:0; letter-spacing:0; line-height:1.2; color:#fff}
.dcard p{grid-column:2; margin:0; color:var(--soft); font-size:15px; max-width:62ch; font-weight:400; line-height:1.58}
.dcard .ver{grid-column:3; grid-row:1 / span 2; align-self:center; margin:0; padding:0;
  font-family:var(--font-mono); font-size:12.5px; color:var(--oro); font-weight:500; transition:transform .25s}
.dcard:hover .ver{transform:translateX(8px)}
.dcard.anexo{border-style:solid; border-width:0 0 1px}
.dcard.anexo .dnum{font-family:var(--font-mono); font-style:normal; font-size:12px; letter-spacing:.24em; text-transform:uppercase; align-self:center; color:var(--rojo)}
.dcard.anexo .ver{color:var(--rojo)}
@media (max-width:760px){ .dcard{grid-template-columns:52px 1fr} .dcard .ver{grid-column:2; grid-row:auto} }

/* tarjetas con física de luz (productos, venta) */
.prod-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin:28px 0 0}
.prod{position:relative; display:flex; flex-direction:column; gap:10px; padding:26px 26px 22px;
  border:1px solid transparent; border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0) 42%) padding-box,
    linear-gradient(var(--panel), var(--panel)) padding-box,
    linear-gradient(180deg, rgba(170,184,207,.30), rgba(170,184,207,.06) 52%, rgba(170,184,207,.13)) border-box;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 24px 48px -32px rgba(2,6,17,.85);
  transition:box-shadow .2s}
.prod::before{display:none}
.prod:hover{transform:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 0 0 1px rgba(217,173,99,.35), 0 24px 48px -32px rgba(2,6,17,.85)}
.estado{font-family:var(--font-mono); font-size:10px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; align-self:flex-start; padding:4px 10px; border-radius:999px}
.estado.live{color:var(--ok); background:rgba(63,217,154,.1); border:1px solid rgba(63,217,154,.35)}
.estado.soon{color:var(--soft); background:rgba(148,163,184,.08); border:1px solid var(--line)}
.prod h3{font-family:var(--font-display); font-weight:540; font-size:var(--t-card); margin:0; color:#fff}
.prod p{margin:0; color:var(--soft); font-size:14.5px; line-height:1.58; font-weight:400}
.prod .meta{margin-top:auto; padding-top:12px; font-family:var(--font-mono); font-size:12px; color:var(--soft)}
.prod .meta b{color:var(--oro-suave); font-weight:500}
.prod .meta a{color:var(--oro); font-weight:500}
@media (max-width:760px){ .prod-grid{grid-template-columns:1fr} }
.prod-grid.tres{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){ .prod-grid.tres{grid-template-columns:1fr} }

.cat{margin:30px 0 0; border-top:1px solid var(--line-soft)}
.srv{display:grid; grid-template-columns:230px 1fr; gap:8px 36px; padding:26px 0; border-bottom:1px solid var(--line-soft)}
.srv h3{font-family:var(--font-display); font-weight:520; font-size:var(--t-card); margin:0; line-height:1.3; color:#fff}
.srv .tag{display:block; font-family:var(--font-body); font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--dim); margin-bottom:7px}
.srv p{margin:0; color:var(--soft); font-size:15.5px; max-width:66ch; font-weight:400}
.srv p strong{color:var(--ink); font-weight:700}
.srv .para{font-family:var(--font-mono); font-size:12px; color:var(--dim); margin-top:9px}
@media (max-width:760px){ .srv{grid-template-columns:1fr; gap:6px} }

.obra{display:grid; grid-template-columns:repeat(2,1fr); gap:0 44px; margin:26px 0 0}
.obra-item{padding:17px 0; border-bottom:1px solid var(--line-soft)}
.obra-item .lugar{font-family:var(--font-mono); font-size:10px; font-weight:400; letter-spacing:.14em; text-transform:uppercase; color:var(--dim)}
.obra-item h3{font-family:var(--font-display); font-weight:520; font-size:var(--t-card); margin:5px 0 4px; color:#fff}
.obra-item p{margin:0; color:var(--soft); font-size:14.5px; font-weight:400}
@media (max-width:760px){ .obra{grid-template-columns:1fr} }

/* vitrina de obra — placas numeradas de expediente */
.shots{display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin:28px 0 0; counter-reset:obra}
.shots.dos{grid-template-columns:repeat(2,1fr)}
.shot{counter-increment:obra; margin:0; position:relative; overflow:hidden;
  border:1px solid transparent; border-radius:14px;
  background:linear-gradient(var(--panel), var(--panel)) padding-box,
    linear-gradient(180deg, rgba(170,184,207,.28), rgba(170,184,207,.07)) border-box;
  box-shadow:0 20px 44px -30px rgba(2,6,17,.85);
  transition:box-shadow .25s}
.shot:hover{transform:none;
  box-shadow:0 0 0 1px rgba(217,173,99,.4), 0 20px 44px -30px rgba(2,6,17,.85)}
.shot.solo{max-width:640px}
.shot-bar{display:flex; align-items:center; gap:10px; padding:9px 14px; background:rgba(7,11,21,.8); border-bottom:1px solid var(--line-soft)}
.shot-bar i{display:none}
.shot-bar::before{content:"Obra " counter(obra, decimal-leading-zero); font-family:var(--font-mono); font-size:10.5px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--oro)}
:lang(en) .shot-bar::before{content:"Work " counter(obra, decimal-leading-zero)}
.shot-bar span{margin-left:auto; font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; color:var(--soft)}
.shot .visor{display:block; overflow:hidden; aspect-ratio:960/520}
.shot img{display:block; width:100%; height:auto; border:0; transform:translateY(0); transition:transform 2.6s cubic-bezier(.25,.6,.3,1)}
.shot:hover .visor img{transform:translateY(-13%)}
@media (hover:none){
  .shot .visor img{animation:shotpan 16s ease-in-out infinite alternate; animation-play-state:paused}
  .shot.in .visor img{animation-play-state:running}
}
@media (prefers-reduced-motion:reduce){ .shot .visor img{animation:none} }
@keyframes shotpan{0%,12%{transform:translateY(0)} 88%,100%{transform:translateY(-13%)}}
.shot figcaption{display:flex; justify-content:space-between; align-items:baseline; gap:14px; padding:12px 16px 14px}
.shot figcaption .titulo{font-family:var(--font-display); font-weight:520; font-size:var(--t-cap); color:#fff}
.shot figcaption .lugar{font-family:var(--font-mono); font-size:10px; font-weight:400; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); white-space:nowrap}
a.shot{display:block; text-decoration:none; color:inherit}
@media (max-width:820px){ .shots, .shots.dos{grid-template-columns:1fr} }

/* banda de conversión */
.cta-band{display:flex; align-items:center; justify-content:space-between; gap:18px 28px; flex-wrap:wrap;
  margin:38px 0 0; padding:24px 28px; border:1px solid transparent; border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0) 45%) padding-box,
    linear-gradient(var(--panel), var(--panel)) padding-box,
    linear-gradient(180deg, rgba(217,173,99,.4), rgba(217,173,99,.1)) border-box;
  box-shadow:0 24px 48px -32px rgba(2,6,17,.85)}
.cta-band p{margin:0; color:var(--soft); font-size:15.5px; max-width:58ch}
.cta-band strong{color:var(--ink)}
@media (max-width:640px){ .cta-band{flex-direction:column; align-items:flex-start} }

.venta-note{color:var(--soft); font-size:15.5px; max-width:58ch; margin:14px 0 0; font-weight:400}
.venta{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:26px 0 0}
.vcard{position:relative; overflow:hidden; display:flex; flex-direction:column; gap:6px; padding:24px 22px 20px;
  border:1px solid transparent; border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0) 42%) padding-box,
    linear-gradient(var(--panel), var(--panel)) padding-box,
    linear-gradient(180deg, rgba(170,184,207,.30), rgba(170,184,207,.06) 52%, rgba(170,184,207,.13)) border-box;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 24px 48px -32px rgba(2,6,17,.85);
  transition:box-shadow .2s}
.vcard:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 0 0 1px rgba(248,113,113,.4), 0 24px 48px -32px rgba(2,6,17,.85)}
.vcard h3{font-family:var(--font-display); font-weight:520; font-size:var(--t-card); margin:0; max-width:78%; color:#fff}
.vcard p{margin:0; color:var(--soft); font-size:14px; font-weight:400; line-height:1.58}
.vcard .precio{margin-top:12px; font-family:var(--font-mono); font-size:13px; color:var(--ink); font-variant-numeric:tabular-nums}
.vcard .vfoto{display:block; margin:-24px -22px 14px}
.vcard .vfoto img{display:block; width:100%; height:auto; border-bottom:1px solid var(--line-soft)}
.sello-venta{position:absolute; top:16px; right:-34px; transform:rotate(32deg);
  font-family:var(--font-mono); font-size:11px; font-weight:600; letter-spacing:.22em;
  color:var(--rojo); border-top:2px solid var(--rojo); border-bottom:2px solid var(--rojo);
  padding:3px 40px; opacity:.8; pointer-events:none; user-select:none}
@media (max-width:900px){ .venta{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .venta{grid-template-columns:1fr} }

/* terminal — el técnico trabajando (aquí el chrome es honesto) */
.term{background:#0a101f; color:#cbd5e1; border-radius:12px; border:1px solid rgba(56,225,213,.22);
  box-shadow:0 0 0 1px rgba(6,10,20,.6), 0 24px 70px -28px rgba(56,225,213,.18);
  font-family:var(--font-mono); font-size:13.5px; line-height:1.9; max-width:640px; overflow:hidden}
.term-bar{display:flex; align-items:center; gap:7px; padding:11px 14px; border-bottom:1px solid rgba(148,163,184,.12); background:rgba(10,16,31,.7)}
.term-bar i{width:11px; height:11px; border-radius:50%; background:#2c3a52; display:inline-block}
.term-bar i:nth-child(1){background:#f36c5c}.term-bar i:nth-child(2){background:#e9b04e}.term-bar i:nth-child(3){background:#4ec97a}
.term-bar span{margin-left:auto; font-size:11.5px; color:var(--dim); letter-spacing:.06em}
.term-body{padding:16px 18px 18px; min-height:220px}
.term-body .ln{display:block; white-space:pre-wrap; visibility:hidden}
.term-body .ln.show{visibility:visible}
.prompt{color:var(--cyan-soft)} .ok{color:var(--ok)} .dim{color:var(--dim)}
.caret{display:inline-block; width:8px; height:16px; background:var(--ok); vertical-align:-2px; margin-left:2px}
@media (prefers-reduced-motion:no-preference){
  .caret{animation:blink 1s steps(1) infinite}
  @keyframes blink{50%{opacity:0}}
}

/* chat widget — la IA, en cian */
.aijchat-fab{position:fixed; right:20px; bottom:20px; z-index:9990; display:flex; align-items:center; gap:10px;
  background:#0b1224; color:var(--cyan-soft); border:1px solid rgba(56,225,213,.45); border-radius:8px; padding:13px 19px;
  cursor:pointer; font-family:var(--font-body); font-size:14px; font-weight:700; letter-spacing:.01em;
  box-shadow:0 12px 34px -14px rgba(2,6,17,.85); transition:background .15s, opacity .25s, transform .25s}
.aijchat-fab:hover{transform:none; background:rgba(56,225,213,.1)}
.aijchat-fab.oculto{opacity:0; pointer-events:none; transform:translateY(14px)}
.aijchat-fab .dotvivo{width:9px; height:9px; border-radius:50%; background:#a7ffd9; display:inline-block; box-shadow:0 0 10px rgba(63,217,154,.9)}
@media (prefers-reduced-motion:no-preference){ .aijchat-fab .dotvivo{animation:vpulse 1.4s ease-in-out infinite} }
.aijchat-panel{position:fixed; right:20px; bottom:86px; z-index:9991; width:min(390px, calc(100vw - 32px));
  height:min(560px, calc(100vh - 120px)); background:#0b1224; border:1px solid var(--line); border-radius:14px;
  box-shadow:0 40px 100px -20px rgba(2,6,17,.9); display:none; flex-direction:column; overflow:hidden}
.aijchat-panel.open{display:flex}
.aijchat-head{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px;
  background:rgba(7,11,21,.8); border-bottom:1px solid var(--line-soft); color:#cbd5e1; font-family:var(--font-mono); font-size:13px}
.aijchat-head b{color:var(--ok); font-weight:600}
.aijchat-close{background:none; border:none; color:var(--dim); font-size:18px; cursor:pointer; line-height:1}
.aijchat-msgs{flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px}
.aijchat-m{max-width:86%; padding:11px 14px; border-radius:12px; font-size:14.5px; line-height:1.55; white-space:pre-wrap; word-wrap:break-word}
.aijchat-m.user{align-self:flex-end; background:rgba(56,225,213,.12); color:#d7fffa; border:1px solid rgba(56,225,213,.3)}
.aijchat-m.ai{align-self:flex-start; background:rgba(148,163,184,.08); border:1px solid var(--line-soft); color:var(--ink)}
.aijchat-m.ai a{color:var(--cyan-soft); word-break:break-all}
.aijchat-typing{align-self:flex-start; color:var(--dim); font-family:var(--font-mono); font-size:12px}
.aijchat-sug{display:flex; flex-wrap:wrap; gap:8px; padding:0 16px 10px}
.aijchat-sug button{font-family:var(--font-mono); font-size:11.5px; color:var(--cyan-soft); background:rgba(56,225,213,.08);
  border:1px solid rgba(56,225,213,.3); border-radius:999px; padding:6px 12px; cursor:pointer}
.aijchat-form{display:flex; gap:8px; padding:12px 14px; border-top:1px solid var(--line-soft); background:rgba(7,11,21,.6)}
.aijchat-form input{flex:1; font-family:var(--font-body); font-size:15px; color:var(--ink); background:rgba(148,163,184,.08);
  border:1px solid var(--line); border-radius:8px; padding:11px 13px; outline:none}
.aijchat-form input::placeholder{color:var(--dim)}
.aijchat-form input:focus{border-color:rgba(56,225,213,.5)}
.aijchat-form button{font-family:var(--font-body); font-size:14.5px; font-weight:700; color:#04201d;
  background:var(--cyan); border:none; border-radius:8px; padding:0 18px; cursor:pointer}
@media (max-width:480px){
  .aijchat-panel{right:8px; bottom:78px}
  .aijchat-fab{right:12px; bottom:12px}
}

/* el porqué — la sección personal, en luz cálida */
.porque{display:grid; grid-template-columns:minmax(0,380px) 1fr; gap:24px 52px; align-items:center; margin:22px 0 0}
.porque .marco{margin:0; border-radius:14px; overflow:hidden; border:1px solid rgba(217,173,99,.25);
  background:var(--panel); box-shadow:0 30px 80px -30px rgba(2,6,17,.8)}
.porque .marco img{display:block; width:100%; height:auto}
.porque .marco figcaption{padding:10px 16px; font-family:var(--font-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--oro); text-align:center}
.porque h2{font-family:var(--font-display); font-weight:520; font-size:clamp(28px,3.6vw,40px); font-variation-settings:"opsz" 100;
  letter-spacing:-.014em; line-height:1.12; margin:6px 0 0; text-wrap:balance; color:#fff}
.porque h2 em{font-style:italic; color:var(--oro)}
.porque-p{font-size:clamp(16.5px,2.1vw,18.5px); color:#c3ccdd; max-width:52ch; margin:18px 0 0; font-weight:400}
.porque-p strong{color:var(--oro-suave); font-weight:700}
@media (max-width:820px){ .porque{grid-template-columns:1fr} .porque .marco{max-width:420px; margin:0 auto} }

.cierre{margin:88px 0 0; padding:48px 0 0; border-top:1px solid var(--line); position:relative}
.cierre::before{content:""; position:absolute; inset:-30px -26px 0; z-index:-1; pointer-events:none;
  background:radial-gradient(640px 380px at 16% 28%, rgba(217,173,99,.09), transparent 65%)}
.cierre .conste{font-family:var(--font-display); font-style:italic; font-weight:500; font-variation-settings:"opsz" 144;
  font-size:clamp(36px,5vw,54px); letter-spacing:-.01em; margin:0; color:var(--oro)}
.cierre .plazo{font-size:clamp(16.5px,2.2vw,19px); color:var(--soft); max-width:58ch; margin:18px 0 0; font-weight:400}
.firma{margin:38px 0 0}
.firma .nombre{font-family:var(--font-display); font-size:23px; font-weight:560; color:#fff}
.firma .cargo{color:var(--soft); font-size:14.5px; margin-top:3px; font-weight:400}
.canales{display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 0}
.chip{display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  font-family:var(--font-body); font-size:14.5px; font-weight:600; letter-spacing:.01em; color:var(--ink); background:var(--panel-2);
  border:1px solid var(--line); border-radius:6px; padding:12px 18px; transition:border-color .15s, color .15s, background .15s}
.chip:hover{transform:none; box-shadow:none; border-color:rgba(217,173,99,.5); color:var(--oro-suave)}
.chip .lbl{font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim)}
.chip.principal{background:var(--oro); border-color:transparent; color:#171006; box-shadow:none}
.chip.principal .lbl{color:rgba(23,16,6,.55)}
.chip.principal:hover{background:var(--oro-suave); box-shadow:none; color:#171006}

footer{margin:64px 0 0; padding:22px 0 46px; border-top:1px solid var(--line-soft);
  font-family:var(--font-mono); font-size:12px; color:var(--dim); display:flex; flex-wrap:wrap; gap:6px 26px}
footer a{color:var(--dim); text-decoration:none; border-bottom:1px solid var(--line-soft)}
footer a:hover{color:var(--soft)}

@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0; transform:translateY(14px); transition:opacity .65s cubic-bezier(.2,.7,.2,1), transform .65s cubic-bezier(.2,.7,.2,1)}
  .rv.in{opacity:1; transform:none}
}
@media (max-width:640px){
  nav.divs{flex-wrap:nowrap; overflow-x:auto; gap:0 22px; padding:0;
    scrollbar-width:none;
    -webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);
            mask-image:linear-gradient(90deg,#000 86%,transparent)}
  nav.divs::-webkit-scrollbar{display:none}
  nav.divs a{flex:0 0 auto; white-space:nowrap; padding:14px 0 12px}
  .top-cta{padding:12px 16px}
  .hero{padding:36px 0 0}
  .eyebrow{font-size:10px; letter-spacing:.16em}
  h1.big{margin-top:14px}
  .lead{margin-top:18px}
  .hero-ctas{margin-top:24px}
}
@media (max-width:560px){
  body{font-size:16px}
  h1.big{line-height:1.12; letter-spacing:-.015em}
  h1.divtitle{line-height:1.13}
  .term{font-size:12.5px; line-height:1.85}
  .term-body{min-height:190px}
  .expediente{gap:14px 28px}
}