/* index-page overrides */

body { font-size:19px; }

h1 { font-size:clamp(52px,6vw,80px); }
h2 { font-size:clamp(36px,4.8vw,58px); }
@media(max-width:720px) { :root { --section:72px; } h1 { font-size:clamp(50px,13vw,64px); } h2 { font-size:clamp(34px,8.5vw,46px); } }

@keyframes fadeUp { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn  { from{opacity:0} to{opacity:1} }
@keyframes blink   { 0%,100%{opacity:1} 50%{opacity:0} }
@keyframes pulse-ring { 0%{transform:scale(1);opacity:.6} 100%{transform:scale(1.6);opacity:0} }
@keyframes clients-scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes ai-star-twinkle { 0%,100%{opacity:1} 50%{opacity:.25} }
@keyframes mod2-glow { 0%,100%{box-shadow:none} 50%{box-shadow:none} }
@keyframes mod4-pulse { 0%,100%{border-color:var(--border-1);box-shadow:none} 50%{border-color:var(--border-2);box-shadow:none} }
@keyframes mod6-shimmer { 0%{transform:translateX(-120%)} 55%,100%{transform:translateX(220%)} }
@keyframes phone-slide-up { from{transform:translateX(-80px) translateY(105%)} to{transform:translateX(-80px) translateY(0)} }
@keyframes phone-mobile-in { from{transform:translateX(-50%) translateY(105%)} to{transform:translateX(-50%) translateY(0)} }

/* ── Hero ── */
#hero { min-height:100vh; display:flex; flex-direction:column; justify-content:center; padding:calc(120px + var(--promo-h)) 0 80px; position:relative; overflow:hidden; }

.hero-split-inner { display:flex; align-items:center; gap:48px; }
.hero-copy { flex:1; min-width:0; }

/* Vertical reel stack */
.hero-reels {
  --reel-w: 320px;
  --reel-h: calc(var(--reel-w) * 16 / 9);
  --peek: 80px;
  --reel-gap: 8px;
  position:relative;
  width:var(--reel-w);
  flex-shrink:0;
  height:calc(var(--reel-h) + 2 * (var(--peek) + var(--reel-gap)));
  overflow:hidden;
  animation:fadeIn 1.3s cubic-bezier(.22,1,.36,1) .55s both;
}
.hero-reels .reel {
  position:absolute; width:100%; height:var(--reel-h); aspect-ratio:unset; left:0; cursor:pointer;
}
.hero-reels .reel:nth-child(1) { top:calc(var(--peek) - var(--reel-h)); }
.hero-reels .reel:nth-child(2) { top:calc(var(--peek) + var(--reel-gap)); }
.hero-reels .reel:nth-child(3) { top:calc(var(--peek) + var(--reel-gap) * 2 + var(--reel-h)); }
/* Dissolve masks follow the reel's current carousel slot (JS-managed), not DOM order.
   Reassigned immediately on click (see navigate() in the hero carousel script) so the
   promoted reel is unmasked/visible from the very start of the slide, not just once it lands. */
.hero-reels .reel.slot-top {
  mask-image:linear-gradient(to bottom, transparent 0, transparent calc(100% - var(--peek)), black 100%);
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, transparent calc(100% - var(--peek)), black 100%);
}
.hero-reels .reel.slot-bottom {
  mask-image:linear-gradient(to bottom, black 0, transparent var(--peek), transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom, black 0, transparent var(--peek), transparent 100%);
}
.hero-reels .reel:not(.is-center) .reel-play { display:none; }
.hero-reels .reel:not(.is-center) .reel-overlay { background:rgba(0,0,0,.65); pointer-events:none; transition:none; }
.hero-reels .reel.is-center .reel-overlay { transition:none; }
/* Poster must re-cover the video instantly on demotion (not the slow default fade-in) —
   YouTube's pause command has real latency, so the poster is what actually hides the still-playing frame. */
.hero-reels .reel:not(.playing) .reel-poster { transition:none; }
.hero-reels .reel:hover { transform:translateY(0); }
.hero-reels .reel.center { transform:scale(1); border-color:var(--border-1); box-shadow:none; }
.orb { position:absolute; border-radius:50%; pointer-events:none; filter:blur(100px); }
.orb-1 { width:500px; height:320px; top:-80px; left:50%; transform:translateX(-50%); background:radial-gradient(ellipse, rgba(255,202,27,.055) 0%, transparent 70%); }
.orb-2 { width:350px; height:350px; top:30%; right:-100px; background:radial-gradient(circle, rgba(80,120,255,.04) 0%, transparent 70%); }
.orb-3 { width:280px; height:280px; top:40%; left:-60px; background:radial-gradient(circle, rgba(80,200,160,.03) 0%, transparent 70%); }

.hero-partners { display:flex; justify-content:flex-start; margin-bottom:44px; animation:fadeUp 1.3s cubic-bezier(.22,1,.36,1) .1s both; }
.partners-bar-desk { max-height:44px; width:auto; }
.hpt-pill { display:inline-flex; align-items:center; gap:0; background:var(--bg-1); border:1px solid var(--border-1); border-radius:100px; height:48px; }
.hpt-item { display:flex; align-items:center; gap:16px; padding:0 32px; height:100%; }
.hpt-item svg { flex-shrink:0; width:100px; height:auto; }
.hpt-text { display:flex; flex-direction:column; gap:0; }
.hpt-badge { font-size:13px; color:var(--text-2); font-weight:400; white-space:nowrap; line-height:1.2; }
.hpt-sep { width:1px; height:24px; background:var(--border-1); flex-shrink:0; }

h1.hero-h { font-size:clamp(38px,5vw,62px); text-align:left; animation:fadeUp 1.3s cubic-bezier(.22,1,.36,1) .28s both; margin-bottom:24px; }
.shimmer-word { background:linear-gradient(90deg, #F3F3F3 0%, #FFCA1D 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-p { font-size:20px; color:var(--text-2); font-weight:300; max-width:860px; margin:0 0 40px; text-align:left; animation:fadeUp 1.3s cubic-bezier(.22,1,.36,1) .46s both; }
.hero-actions { display:flex; align-items:center; justify-content:flex-start; gap:12px; flex-wrap:wrap; margin-bottom:0; animation:fadeUp 1.3s cubic-bezier(.22,1,.36,1) .64s both; }
@media(max-width:900px) {
  .hero-split-inner { grid-template-columns:1fr; }
  .hero-reels { display:none; }
  .hero-copy { text-align:center; }
  .hero-partners { justify-content:center; }
  h1.hero-h { text-align:center; }
  .hero-p { margin-left:auto; margin-right:auto; text-align:center; }
  .hero-actions { justify-content:center; }
}
@media(max-width:720px) { .hero-actions{margin-bottom:20px} #hero{padding:calc(var(--promo-h) + var(--nav-h) + 48px) 20px 60px} .hero-p{font-size:clamp(18px,4.5vw,20px)} }

/* Partners bar ticker — mobile only */
.partners-ticker-wrap { display:none; }
@keyframes partners-scroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@media(max-width:720px) {
  .hero-partners { display:block !important; width:100%; align-self:stretch; margin-bottom:48px; padding:0; animation:none; }
  .partners-bar-desk { display:none !important; }
  .partners-ticker-wrap { display:block; position:relative; width:100%; height:40px; overflow:hidden; }
  .partners-ticker-inner { position:absolute; top:0; left:0; display:flex; animation:partners-scroll 22s linear infinite; }
  .partners-bar-mob { height:40px; width:auto; display:block; flex-shrink:0; margin-right:64px; }
}

/* Generic landing intro section — reused across topic landing pages (turnos, stock, etc.) */
.landing-intro { padding:var(--section) 0; border-bottom:1px solid var(--border-1); }
.landing-intro-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; }
.landing-intro-head h2 { font-size:clamp(32px,4vw,52px); line-height:1.18; letter-spacing:-.026em; }
.landing-intro-head h2 .accent { color:var(--accent); }
.landing-intro-body { display:flex; flex-direction:column; gap:20px; padding-top:6px; }
.landing-intro-body p { font-size:17px; line-height:1.75; color:var(--text-2); font-weight:300; }
@media(max-width:860px) { .landing-intro-grid { grid-template-columns:1fr; gap:32px; } }

/* Synced channels row — used by gestion-de-stock */
.canales-row { display:flex; align-items:center; justify-content:center; gap:24px; flex-wrap:wrap; }

/* Rubros/verticales grid — used by gestion-de-turnos */
.rubros-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.rubro-card { background:var(--bg-1); border:1px solid var(--border-1); border-radius:var(--r3); padding:28px 24px; display:flex; flex-direction:column; align-items:flex-start; gap:14px; transition:border-color .25s,background .25s,transform .25s; }
.rubro-card:hover { border-color:var(--border-2); background:var(--bg-2); transform:translateY(-3px); }
.rubro-icon { width:44px; height:44px; border-radius:var(--r1); background:var(--accent-muted); border:1px solid var(--accent-border); display:flex; align-items:center; justify-content:center; color:var(--accent); flex-shrink:0; }
.rubro-name { font-size:16px; font-weight:500; color:var(--text-1); letter-spacing:-.01em; }
@media(max-width:900px) { .rubros-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px) { .rubros-grid { grid-template-columns:1fr; } }

/* Clients carousel */
#clients { padding:0 0 56px; position:relative; }
/* ── Mobile: clientes ── */
@media(max-width:720px) {
  #clients { padding-top:80px; }
  .clients-label { font-size:13px; max-width:220px; margin-left:auto; margin-right:auto; }
  .clients-logo { height:64px; max-width:140px; }
}
.clients-label { text-align:center; font-size:17px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); margin-bottom:28px; }
.clients-track-wrap { overflow:hidden; position:relative; max-width:1000px; margin:0 auto; -webkit-mask-image:linear-gradient(to right,transparent 0%,black 22%,black 78%,transparent 100%); mask-image:linear-gradient(to right,transparent 0%,black 22%,black 78%,transparent 100%); }
.clients-track { display:flex; align-items:center; gap:72px; width:max-content; animation:clients-scroll 40s linear infinite; }
.clients-logo { height:88px; width:auto; max-width:190px; object-fit:contain; flex-shrink:0; filter:grayscale(1) brightness(.55); transition:filter .3s; }
.clients-logo:hover { filter:grayscale(0) brightness(1); }

/* Videos */
#videos { padding:0; margin-top:0; position:relative; }
.reel { border-radius:var(--r4); overflow:hidden; border:1px solid var(--border-1); aspect-ratio:9/16; background:var(--bg-1); position:relative; cursor:pointer; transition:border-color .25s,transform .3s; }
.reel:hover { border-color:var(--border-2); transform:translateY(-4px); }
.reel.center { transform:scale(1.03); border-color:var(--accent-border); box-shadow:0 0 40px rgba(255,202,27,.07); }
.reel.center:hover { transform:scale(1.03) translateY(-4px); }
.reel-ph { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; }
.reel-grad { position:absolute; inset:0; background:linear-gradient(160deg,var(--bg-2),var(--bg-1)); }
.reel-grad-alt { position:absolute; inset:0; background:linear-gradient(160deg,var(--bg-1),var(--bg-2)); }
.reel-inner { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:8px; }
.reel-play { width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.06); border:1px solid var(--border-1); display:flex; align-items:center; justify-content:center; transition:background .2s,border-color .2s; }
.reel:hover .reel-play { background:var(--accent-muted); border-color:var(--accent-border); }
.reel-ph-label { font-size:13px; color:var(--text-3); letter-spacing:.05em; }
.reel-meta { position:absolute; bottom:0; left:0; right:0; padding:20px; background:linear-gradient(to top,rgba(0,0,0,.8) 0%,transparent 100%); }
.reel-title { font-size:14px; font-weight:500; color:var(--text-1); margin-bottom:3px; }
.reel-sub { font-size:13px; color:rgba(255,255,255,.4); }
.reel-video { position:absolute; inset:0; width:100%; height:100%; border:none; z-index:0; pointer-events:none; }
.reel-poster { position:absolute; inset:0; z-index:1; background-size:cover; background-position:center top; background-color:var(--bg-1); transition:opacity .3s; }
.reel.playing .reel-poster { opacity:0; pointer-events:none; transition:opacity .25s .05s; }
.reel-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:2; background:rgba(0,0,0,.65); transition:background .3s; }
.reel-overlay:hover { background:rgba(0,0,0,.45); }
.reel.playing .reel-play { opacity:0; pointer-events:none; }
.reel.playing .reel-overlay { background:rgba(0,0,0,.001); }
.reel-meta { z-index:3; }

/* Desktop: 3 reels horizontales, el del centro más grande y elevado (landing pages) */
.reels-wrap { display:flex; align-items:center; justify-content:center; gap:24px; max-width:980px; margin:0 auto; padding:var(--section) 0; }
.reels-wrap .reel { flex:1; min-width:0; max-width:270px; }
.reels-wrap .reel:hover { transform:translateY(-6px); }
.reels-wrap .reel.center { max-width:320px; z-index:2; transform:translateY(-24px) scale(1.03); box-shadow:0 28px 64px rgba(0,0,0,.5), 0 0 40px rgba(255,202,27,.08); }
.reels-wrap .reel.center:hover { transform:translateY(-30px) scale(1.03); }
@media(max-width:720px) { .reels-wrap { display:none; } }

/* Mobile stacking reels — scroll principal */
.reels-stack { display:none; }
@media(max-width:720px) {
  .reels-stack { display:block; }
  #videos { padding-bottom:0; margin-top:0; }
}
.reel-stack-slot { position:sticky; top:var(--nav-h); height:calc(100svh - var(--nav-h)); }
.reel-stack-slot:nth-child(1) { z-index:1; }
.reel-stack-slot:nth-child(2) { z-index:2; }
.reel-stack-slot:nth-child(3) { z-index:3; }
.reel-stack-slot .reel { height:100%; aspect-ratio:unset; box-shadow:0 16px 56px rgba(0,0,0,.55); }
.reel-stack-slot .reel:hover { transform:none; }
/* iframe 110% tall, centered — YouTube fills full width without side bars; overflow clipped by .reel */
.reel-stack-slot .reel-video { top:50%; height:110%; transform:translateY(-50%); }
@keyframes reel-stack-exit {
  from { transform:scale(1); filter:brightness(1); }
  to   { transform:scale(0.88); filter:brightness(0.35); }
}
@supports (animation-timeline: scroll()) {
  .reel-stack-slot:not(:last-child) {
    animation:reel-stack-exit linear both;
    animation-timeline:view();
    animation-range:exit 25% exit 100%;
  }
}

/* ── Mobile: trust título prolijo ── */
@media(max-width:720px) {
  #trust .section-header h2 br { display:none; }
  #trust .section-header h2 { line-height:1.2; }
}

/* Trust */
#trust { padding:var(--section) 0; }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border-1); border:1px solid var(--border-1); border-radius:var(--r4); overflow:hidden; }
@media(max-width:900px) { .trust-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:720px) { .trust-grid{grid-template-columns:1fr} }
.trust-cell { background:var(--bg-0); padding:48px 40px; position:relative; overflow:hidden; transition:background .25s, box-shadow .25s; }
.trust-cell:hover { background:var(--bg-1); box-shadow:inset 0 0 32px rgba(255,202,27,.04); }
.trust-cell::before { content:''; position:absolute; left:0; top:20%; bottom:20%; width:1px; background:var(--accent); opacity:0; transition:opacity .25s; }
.trust-cell:hover::before { opacity:1; }
.trust-cell.hi { background:var(--bg-1); }
.trust-cell.hi::before { opacity:1; }
.tc-icon { width:56px; height:56px; border-radius:var(--r1); background:var(--bg-2); border:1px solid var(--border-1); display:flex; align-items:center; justify-content:center; color:var(--accent); margin-bottom:24px; transition:border-color .2s,color .2s,box-shadow .2s; }
.trust-cell:hover .tc-icon { border-color:var(--border-2); }
.trust-cell.hi .tc-icon { border-color:var(--border-2); box-shadow:0 2px 12px rgba(0,0,0,.3); }
.tc-icon--wa { border-color:rgba(37,211,102,.35); box-shadow:0 0 18px rgba(37,211,102,.18),0 0 6px rgba(37,211,102,.10); }
.tc-num { font-size:13px; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); margin-bottom:20px; }
.tc-h { font-size:20px; font-weight:500; letter-spacing:-.02em; color:var(--text-1); margin-bottom:14px; line-height:1.25; }
.tc-p { font-size:16px; color:var(--text-2); line-height:1.7; font-weight:300; }
.ping-wrap { display:inline-flex; align-items:center; gap:8px; margin-bottom:4px; }
.ping { position:relative; width:8px; height:8px; }
.ping-core { position:absolute; inset:0; border-radius:50%; background:#25d366; }
.ping-ring { position:absolute; inset:-4px; border-radius:50%; border:1px solid rgba(37,211,102,.5); animation:pulse-ring 1.8s ease-out infinite; }

/* Módulos stack */
#modulos { padding:var(--section) 0; }
.stack { display:flex; flex-direction:column; }
.mod-card { position:sticky; background:var(--bg-1); border:1px solid var(--border-1); border-radius:var(--r4); margin-bottom:20px; overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,.25); transition:border-color .25s, box-shadow .25s; }
/* opacity:1 anula el fade-up y animation:none evita que .in dispare el keyframe (que mueve
   transform, y cualquier transform rompe position:sticky) — pero conserva .r para que el
   observer siga agregando .in, de eso dependen los brillos/pulsos de mod2/mod4/mod6 más abajo. */
.mod-card.r { opacity:1; }
.mod-card.r.in { animation:none; }
.mod-card:hover { border-color:var(--border-2); box-shadow:0 4px 20px rgba(0,0,0,.4); }
.mod-card:nth-child(1){top:96px;z-index:10} .mod-card:nth-child(2){top:112px;z-index:20} .mod-card:nth-child(3){top:128px;z-index:30} .mod-card:nth-child(4){top:144px;z-index:40} .mod-card:nth-child(5){top:160px;z-index:50} .mod-card:nth-child(6){top:176px;z-index:60}
.mod-inner { display:grid; grid-template-columns:1fr 1fr; min-height:340px; }
@media(max-width:720px) { .mod-inner{grid-template-columns:1fr} }
.mod-left { padding:48px; display:flex; flex-direction:column; justify-content:center; gap:16px; }
@media(max-width:720px) { .mod-left{padding:32px 24px} }
.mod-n { font-size:13px; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); }
.mod-h { font-size:clamp(26px,3vw,32px); font-weight:500; letter-spacing:-.025em; color:var(--text-1); line-height:1.1; }
.mod-p { font-size:17px; color:var(--text-2); line-height:1.65; font-weight:300; max-width:340px; }
.mod-list { display:flex; flex-direction:column; gap:8px; }
.mod-feat { display:flex; align-items:center; gap:8px; font-size:16px; color:var(--text-2); }
.mod-dot { width:4px; height:4px; border-radius:50%; background:var(--accent); flex-shrink:0; opacity:.7; }
.mod-right { position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; border-left:1px solid var(--border-1); padding:20px; }
@media(max-width:720px) { .mod-right{display:none} }
.mod-visual { position:relative; width:100%; height:100%; background:url('../../img/Background2.jpg') center/cover no-repeat; border-radius:12px; border:1px solid rgba(255,255,255,.1); overflow:hidden; }
.mod-orb { display:none; }
.mod-ui { position:absolute; inset:24px; display:flex; flex-direction:column; justify-content:center; align-items:center; }
.mui-stack { display:flex; flex-direction:column; width:100%; max-width:520px; }
.mui-kpi { background:rgba(17,17,19,.65); border:1px solid var(--border-1); border-radius:var(--r2); padding:16px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.mui-kpi-label { font-size:12px; color:var(--text-3); margin-bottom:6px; }
.mui-kpi-val { font-size:28px; font-weight:600; letter-spacing:-.04em; color:var(--text-1); line-height:1; margin-bottom:4px; }
.mui-kpi-sub { font-size:12px; color:var(--text-3); }
.mui-split { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.mui-bar-track { height:3px; background:var(--bg-2); border-radius:2px; margin-top:6px; overflow:hidden; }
.mui-bar-fill { height:100%; border-radius:2px; background:var(--border-2); transition:width .4s; }
.mui-bar-fill.low { background:var(--accent); }
.mui-summary { padding:14px 16px 12px; border-bottom:1px solid var(--border-1); margin-bottom:8px; }
.mui-row { display:flex; align-items:center; gap:16px; background:rgba(17,17,19,.65); border:1px solid var(--border-1); border-radius:var(--r2); padding:16px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); transition:border-color .2s; }
.mod-card:hover .mui-row { border-color:var(--border-2); }
.mui-ico { width:40px; height:40px; border-radius:8px; background:rgba(22,22,24,.7); border:1px solid var(--border-1); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--text-3); font-size:13px; font-weight:700; line-height:1; }
.mui-ico.acc { background:linear-gradient(135deg,rgba(255,202,27,.1),rgba(252,216,21,.1)); border-color:rgba(252,216,21,.35); color:var(--accent); }
.mui-body { flex:1; min-width:0; }
.mui-label { font-size:12px; color:var(--text-3); margin-bottom:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mui-text { font-size:14px; color:var(--text-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mui-chip { font-size:11px; font-weight:600; letter-spacing:.04em; padding:3px 10px; border-radius:100px; flex-shrink:0; white-space:nowrap; }
.mui-chip.ok  { background:var(--accent-muted); border:1px solid var(--accent-border); color:var(--accent); }
.mui-chip.dim { background:rgba(22,22,24,.7); border:1px solid var(--border-1); color:var(--text-3); }
.mui-chip.warn{ background:var(--warn-muted); border:1px solid var(--warn-border); color:var(--warn); }
.mui-conn { height:24px; position:relative; display:flex; align-items:center; }
.mui-conn::before { content:''; position:absolute; left:34px; top:0; bottom:0; width:1px; background:repeating-linear-gradient(to bottom,var(--border-2) 0,var(--border-2) 3px,transparent 3px,transparent 7px); }
.mui-conn-note { font-size:11px; color:var(--text-3); margin-left:54px; position:relative; z-index:1; }
.mui-kpi { position:relative; }
.mod-card:nth-child(1) .mui-kpi { overflow:hidden; }
.mod-card:nth-child(1) .mui-kpi::after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.06) 50%,transparent 80%); transform:translateX(-120%); }
.mod-card:nth-child(1).in .mui-kpi::after { animation:none; }
.mod-card:nth-child(2).in .mui-row[style*="accent-border"] { animation:mod2-glow 2.2s ease-in-out .8s infinite; }
.mod-card:nth-child(4).in .mui-stack > .mui-kpi { animation:mod4-pulse 2.8s ease-in-out .6s infinite; }
.mod-card:nth-child(6) .mui-kpi { overflow:hidden; }
.mod-card:nth-child(6) .mui-kpi::after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.06) 50%,transparent 80%); transform:translateX(-120%); }
.mod-card:nth-child(6).in .mui-kpi::after { animation:mod6-shimmer 3.8s ease-in-out 1s infinite; }

/* mod-card 1: animated invoice feed */
.mod1-feed-wrap { overflow:hidden; width:100%; height:176px; flex-shrink:0; -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 22%,black 78%,transparent 100%); mask-image:linear-gradient(to bottom,transparent 0%,black 22%,black 78%,transparent 100%); }
.mod1-feed { display:flex; flex-direction:column; will-change:transform; }
@keyframes mod1-numflash { 0%,100%{color:var(--text-1)} 35%{color:var(--text-2)} }
.mod1-num-flash { animation:mod1-numflash .4s ease-out !important; }

/* mod-card 2: IA invoice processing */
.mod2-step-wrap { overflow:hidden; max-height:0; opacity:0; transform:translateY(8px); transition:max-height .5s cubic-bezier(0.22,1,0.36,1), opacity .4s cubic-bezier(0.22,1,0.36,1), transform .4s cubic-bezier(0.22,1,0.36,1); }
.mod2-step-wrap.mod2-show { max-height:106px; opacity:1; transform:translateY(0); }
@keyframes mod2-ia-blink  { 0%,100%{opacity:.45} 50%{opacity:1} }
@keyframes mod2-row2-glow { 0%,100%{border-color:var(--border-1)} 50%{border-color:var(--border-2);box-shadow:none} }
@keyframes mod2-field-in  { from{opacity:0;transform:translateX(-8px)} to{opacity:1;transform:none} }
.mod2-ia-pulse   { animation:mod2-ia-blink .85s ease-in-out infinite; }
.mod2-row2-scan  { animation:mod2-row2-glow 1.1s ease-in-out infinite; }
.mod2-field-show { animation:mod2-field-in .42s cubic-bezier(0.22,1,0.36,1) forwards; }

/* sync store grid (CO card 02) */
.sg-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; width:100%; max-width:520px; }
.sg-cell { background:rgba(17,17,19,.65); border:1px solid var(--border-1); border-radius:var(--r2); padding:14px 14px 12px; display:flex; flex-direction:column; gap:5px; transition:border-color .35s,box-shadow .35s; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.sg-cell.sg-syncing { border-color:rgba(255,202,27,.45); box-shadow:0 0 14px rgba(255,202,27,.07); }
.sg-logo-box { align-self:flex-end; width:34px; height:34px; border:1px solid var(--border-1); border-radius:7px; background:rgba(255,255,255,.05); display:flex; align-items:center; justify-content:center; padding:6px; flex-shrink:0; }
.sg-logo { max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; display:block; }
.sg-count-wrap { display:flex; align-items:baseline; gap:4px; margin-top:2px; }
.sg-count { font-size:28px; font-weight:600; letter-spacing:-.04em; color:var(--text-1); line-height:1; }
.sg-unit { font-size:13px; color:var(--text-3); }
.sg-status { font-size:11px; color:var(--text-3); }
.sg-status.sg-active { color:var(--text-3); }
.sg-status.sg-sync-txt { color:var(--text-3); }
@keyframes sg-count-flash { 0%,100%{color:var(--text-1)} 40%{color:var(--text-2)} }
.sg-count.sg-flash { animation:sg-count-flash .5s ease-out; }

/* mod-card 4: treasury */
.mod4-cheque-wrap { position:relative; overflow:hidden; flex-shrink:0; min-height:80px; }
.mod4-cheque-row { position:absolute; left:0; right:0; top:0; }
.mui-kpi.mod4-mini-kpi { padding:12px 16px; }
.mod4-mini-label { font-size:11px; color:var(--text-3); margin-bottom:5px; font-weight:500; letter-spacing:.03em; }
.mod4-mini-label.mod4-acc { color:var(--accent); }
.mod4-mini-val { font-size:22px; font-weight:600; letter-spacing:-.04em; color:var(--text-1); line-height:1; }

/* mod-card 3: inventory animation */
#inv-bar-1,#inv-bar-3 { transition:width 1.3s cubic-bezier(0.22,1,0.36,1); }

/* mod-card 6: tax animation */
#mod6Bar1 { transition:width 1.3s cubic-bezier(0.22,1,0.36,1); }
#mod6Bar2 { transition:width 1.2s cubic-bezier(0.22,1,0.36,1); }
#mod6Bar3 { transition:width 0.9s cubic-bezier(0.22,1,0.36,1); }
#inv-bar-2 { transition:width .8s cubic-bezier(0.22,1,0.36,1); }
@keyframes mod3-alert-pulse { 0%,100%{opacity:1} 50%{opacity:.1} }
.mod3-alert-pulse { animation:mod3-alert-pulse .38s ease-in-out 3; }

/* Stacking cards — monochromatic graphics */
.mod-dot { background:var(--accent); opacity:.7; }
.mod-card .mui-chip.ok  { background:rgba(22,22,24,.7); border-color:var(--border-1); color:var(--text-3); }
.mod-card .mui-chip.warn{ background:rgba(22,22,24,.7); border-color:var(--border-1); color:var(--text-3); }
.mod-card .mui-ico.acc  { background:rgba(22,22,24,.7); border-color:var(--border-1); color:var(--text-3); }
.mod-card .mui-bar-fill.low { background:var(--border-2); }
.mod-card .sg-cell.sg-syncing { border-color:var(--border-2); box-shadow:none; }
.mod-card .mod-right [style*="var(--accent)"] { color:var(--text-2) !important; }

/* Stacking cards — glassmorphism sobre background2 */
.mod-visual { --text-1:rgba(255,255,255,.95); --text-2:rgba(255,255,255,.82); --text-3:rgba(255,255,255,.65); }
.mod-visual .mui-kpi { background:rgba(8,8,9,.9); border-color:rgba(255,255,255,.12); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.mod-visual .mui-row { background:rgba(8,8,9,.9); border-color:rgba(255,255,255,.12); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.mod-visual .sg-cell { background:rgba(8,8,9,.9); border-color:rgba(255,255,255,.12); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.mod-visual .mui-ico { background:rgba(8,8,9,.82); border-color:rgba(255,255,255,.11); color:rgba(255,255,255,.7); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.mod-card .mod-visual .mui-ico.acc { background:rgba(8,8,9,.82); border-color:rgba(255,255,255,.11); color:rgba(255,255,255,.7); }
.mod-visual .mui-chip { background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.11); color:rgba(255,255,255,.65); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.mod-visual .sg-logo-box { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.11); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
/* Textos dentro del glass */
.mod-visual .mui-kpi-label,.mod-visual .mui-kpi-sub,.mod-visual .mui-label { color:rgba(255,255,255,.68); }
.mod-visual .mui-kpi-val,.mod-visual .mui-text { color:rgba(255,255,255,.95); }
.mod-visual .mui-summary { border-bottom-color:rgba(255,255,255,.1); }
.mod-visual .mui-bar-track { background:rgba(255,255,255,.1); }
.mod-visual .mui-bar-fill { background:rgba(255,255,255,.25); }
.mod-visual .sg-count { color:rgba(255,255,255,.95); }
.mod-visual .sg-unit,.mod-visual .sg-status { color:rgba(255,255,255,.62); }
.mod-visual .mui-chip { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.14); color:rgba(255,255,255,.78); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
/* Conector flotante — píldora glass */
.mod-visual .mui-conn::before { background:repeating-linear-gradient(to bottom,rgba(255,255,255,.2) 0,rgba(255,255,255,.2) 3px,transparent 3px,transparent 7px); }
.mod-visual .mui-conn-note { background:none; border:none; padding:0; backdrop-filter:none; -webkit-backdrop-filter:none; }
.mod-card .mod-visual .mui-conn-note { color:rgba(10,10,11,.9) !important; }
.mod-visual .mod1-feed-wrap { -webkit-mask-image:none; mask-image:none; }
.mod-visual .mui-row { padding:13px 16px; }

/* Innovación bento */
#innovacion { padding:var(--section) 0; }
.bento { display:grid; grid-template-columns:repeat(12,1fr); gap:16px; }
@media(max-width:900px) { .bento{grid-template-columns:1fr} }
.b-card { background:var(--bg-1); border:1px solid var(--border-1); border-radius:var(--r4); padding:28px 28px; position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-start; min-height:340px; box-shadow:0 2px 12px rgba(0,0,0,.25); transition:border-color .25s,background .25s,transform .25s,box-shadow .25s; }
.b-card:hover { border-color:rgba(255,255,255,.13); background:var(--bg-2); transform:translateY(-2px); box-shadow:0 8px 28px rgba(0,0,0,.4); }
.b-card:nth-child(1){grid-column:span 7} .b-card:nth-child(2){grid-column:span 5} .b-card:nth-child(3){grid-column:span 5} .b-card:nth-child(4){grid-column:span 7}
@media(max-width:900px) { .b-card,.b-card:nth-child(n){grid-column:span 1;min-height:304px;padding:24px} }
.b-glow { position:absolute; top:-40px; left:-40px; width:160px; height:160px; border-radius:50%; filter:blur(60px); opacity:0; transition:opacity .5s; }
.b-card:hover .b-glow { opacity:.28; }
.b-card:nth-child(1) .b-glow,.b-card:nth-child(2) .b-glow,.b-card:nth-child(3) .b-glow,.b-card:nth-child(4) .b-glow { background:linear-gradient(135deg,#FFCA1B,#FCD815); }
.b-icon { width:40px; height:40px; border-radius:var(--r1); border:1px solid rgba(252,216,21,.35); display:flex; align-items:center; justify-content:center; flex-shrink:0; background:linear-gradient(135deg,rgba(255,202,27,.14),rgba(252,216,21,.14)); color:var(--accent); box-shadow:0 0 18px rgba(252,216,21,.12); }
.b-h { font-size:clamp(20px,2vw,26px); font-weight:500; letter-spacing:-.025em; line-height:1.1; }
.b-p { font-size:17px; color:var(--text-2); line-height:1.65; font-weight:300; }
.b-visual { width:100%; min-height:160px; flex:1; margin-bottom:24px; border:1px solid rgba(255,255,255,.07); border-radius:12px; overflow:hidden; position:relative; background:rgba(255,255,255,.025); }
.b-header { display:flex; align-items:center; gap:16px; margin-bottom:8px; }
/* Carga IA doc mock */
.ia-doc-mock { position:absolute; top:16px; left:16px; right:16px; display:flex; flex-direction:column; gap:8px; transition:transform .38s cubic-bezier(.4,0,.2,1); }
.b-card-doc .b-visual::after { content:''; position:absolute; bottom:0; left:0; right:0; height:64px; background:linear-gradient(to bottom,transparent,#060609); pointer-events:none; z-index:2; transition:opacity .38s cubic-bezier(.4,0,.2,1); }
.b-card-doc .b-visual:hover::after { opacity:0; }
.b-visual:hover .ia-doc-mock { transform:translateY(-82px); }
.ia-dm-hd { display:flex; align-items:center; gap:8px; margin-bottom:2px; }
.ia-dm-pill { font-size:10px; font-weight:700; letter-spacing:.07em; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.5); padding:2px 7px; border-radius:4px; }
.ia-dm-fname { font-size:12px; color:rgba(255,255,255,.3); }
.ia-dm-row { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:12.5px; padding:9px 10px; border-radius:6px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06); }
.ia-dm-k { color:rgba(255,255,255,.35); }
.ia-dm-v { color:rgba(255,255,255,.65); text-align:right; }
.ia-dm-row.ia-dm-active { background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.12); }
.ia-dm-row.ia-dm-active .ia-dm-v { color:rgba(255,255,255,.75); }
.ia-dm-scanner { position:absolute; inset:0; pointer-events:none; overflow:hidden; opacity:0; z-index:1; border-radius:8px; }
.ia-dm-scan-beam { position:absolute; left:0; right:0; height:44px; top:-44px; background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.04) 40%,rgba(255,255,255,.08) 50%,rgba(255,255,255,.04) 60%,transparent 100%); }
.ia-dm-scan-beam::after { content:''; position:absolute; left:0; right:0; top:50%; height:1px; background:linear-gradient(to right,transparent 0%,rgba(255,255,255,.45) 15%,rgba(255,255,255,.45) 85%,transparent 100%); }
.b-visual:hover .ia-dm-scanner { animation:ia-scanner-fade 2.8s ease forwards; }
.b-visual:hover .ia-dm-scan-beam { animation:ia-scan-beam-move 2.8s ease forwards; }
@keyframes ia-scanner-fade { 0%,5%{opacity:0} 12%{opacity:1} 65%{opacity:1} 80%{opacity:0} 100%{opacity:0} }
@keyframes ia-scan-beam-move { 0%,5%{top:-44px} 70%{top:calc(100% + 10px)} 100%{top:calc(100% + 10px)} }
.ia-dm-status { position:relative; height:28px; margin-top:2px; }
.ia-dm-scan-txt,.ia-dm-done-txt { position:absolute; left:0; top:50%; transform:translateY(-50%); font-size:12.5px; white-space:nowrap; opacity:0; }
.ia-dm-scan-txt { color:rgba(255,255,255,.5); }
.ia-dm-done-txt { color:rgba(255,255,255,.65); }
.b-visual:hover .ia-dm-scan-txt { animation:ia-scan-anim 2.8s ease forwards; }
.b-visual:hover .ia-dm-done-txt { animation:ia-done-anim 2.8s ease forwards; }
@keyframes ia-scan-anim { 0%{opacity:0} 8%{opacity:1} 68%{opacity:1} 82%{opacity:0} 100%{opacity:0} }
@keyframes ia-done-anim { 0%{opacity:0} 75%{opacity:0} 92%{opacity:1} 100%{opacity:1} }
/* Excel mock (CO) */
.xls-mock { position:absolute; top:18px; left:18px; border:1px solid rgba(255,255,255,.07); border-radius:8px; overflow:hidden; font-size:12px; }
.xls-row { display:flex; }
.xls-row > span { padding:6px 11px; border-right:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06); color:rgba(255,255,255,.5); }
.xls-row > span:first-child { min-width:110px; }

/* Excel full-card mock (CO) */
.xls-full { position:absolute; top:0; left:0; right:0; bottom:-86px; display:flex; flex-direction:column; font-size:12px; transition:transform .45s cubic-bezier(.4,0,.2,1); }
.b-visual:hover .xls-full { transform:translateY(-86px); }
.xls-sheet { flex:1; overflow:hidden; }
.xls-full .xls-row { width:100%; }
.xls-full .xls-row > span:first-child { flex:1; min-width:0; }
.xls-full .xls-row > span:nth-child(2) { width:96px; flex-shrink:0; text-align:right; }
.xls-full .xls-row > span:nth-child(3) { width:52px; flex-shrink:0; text-align:center; }
.xls-scanner { position:absolute; top:0; left:0; right:0; bottom:86px; pointer-events:none; overflow:hidden; opacity:0; z-index:3; }
.xls-scanner-beam { position:absolute; left:0; right:0; height:44px; top:-44px; background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.04) 40%,rgba(255,255,255,.08) 50%,rgba(255,255,255,.04) 60%,transparent 100%); }
.xls-scanner-beam::after { content:''; position:absolute; left:0; right:0; top:50%; height:1px; background:linear-gradient(to right,transparent 0%,rgba(255,255,255,.45) 15%,rgba(255,255,255,.45) 85%,transparent 100%); }
.b-visual:hover .xls-scanner { animation:ia-scanner-fade 2.8s ease forwards; }
.b-visual:hover .xls-scanner-beam { animation:ia-scan-beam-move 2.8s ease forwards; }
.xls-emit { height:86px; padding-top:16px; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:1px; background:rgba(255,255,255,.025); border-top:1px solid rgba(255,255,255,.07); opacity:0; }
.b-visual:hover .xls-emit { animation:ia-done-anim 2.8s ease forwards; }
.b-icon-excel { background:linear-gradient(135deg,rgba(255,202,27,.14),rgba(252,216,21,.14)) !important; border-color:rgba(252,216,21,.35) !important; box-shadow:0 0 18px rgba(252,216,21,.12) !important; }
.xls-emit-check { font-size:18px; color:var(--text-2); line-height:1; }
.xls-emit-label { font-size:13px; font-weight:600; color:var(--text-1); letter-spacing:-.01em; }
.xls-emit-sub { font-size:11px; color:var(--text-3); }
.xls-row > span:nth-child(2) { min-width:80px; }
.xls-row > span:last-child { border-right:none; min-width:60px; text-align:center; }
.xls-header > span { background:rgba(255,255,255,.04); color:rgba(255,255,255,.3); font-size:11px; letter-spacing:.04em; }
.xls-active > span { background:rgba(255,255,255,.05); color:rgba(255,255,255,.6); border-color:rgba(255,255,255,.1); }
.xls-ok { color:var(--text-2) !important; }
.b-card-ai { transition:box-shadow .35s,border-color .35s,background .35s,transform .25s; }
.b-card-ai .b-p { margin-bottom:24px; }
.b-card-ai .b-icon { background:linear-gradient(135deg,rgba(255,202,27,.14),rgba(252,216,21,.16)); border-color:rgba(252,216,21,.4); box-shadow:0 0 22px rgba(252,216,21,.2),inset 0 0 0 1px rgba(252,216,21,.08); }
.ai-stars { position:absolute; inset:0; border-radius:inherit; pointer-events:none; overflow:hidden; background-image:radial-gradient(1.3px 1.3px at 12% 22%,rgba(255,255,255,.3) 0%,transparent 100%),radial-gradient(1px 1px at 75% 14%,rgba(255,255,255,.25) 0%,transparent 100%),radial-gradient(1.4px 1.4px at 38% 72%,rgba(255,255,255,.2) 0%,transparent 100%),radial-gradient(1px 1px at 90% 52%,rgba(255,255,255,.28) 0%,transparent 100%),radial-gradient(1.2px 1.2px at 52% 30%,rgba(255,255,255,.18) 0%,transparent 100%),radial-gradient(1px 1px at 25% 85%,rgba(255,255,255,.25) 0%,transparent 100%),radial-gradient(1.3px 1.3px at 94% 78%,rgba(255,255,255,.2) 0%,transparent 100%),radial-gradient(1px 1px at 60% 92%,rgba(255,255,255,.18) 0%,transparent 100%),radial-gradient(1.1px 1.1px at 6% 58%,rgba(255,255,255,.26) 0%,transparent 100%),radial-gradient(1px 1px at 44% 10%,rgba(255,255,255,.2) 0%,transparent 100%),radial-gradient(1.2px 1.2px at 80% 40%,rgba(255,255,255,.22) 0%,transparent 100%),radial-gradient(1px 1px at 20% 48%,rgba(255,255,255,.16) 0%,transparent 100%),radial-gradient(1.3px 1.3px at 67% 62%,rgba(255,255,255,.2) 0%,transparent 100%),radial-gradient(1px 1px at 33% 38%,rgba(255,255,255,.18) 0%,transparent 100%),radial-gradient(1.1px 1.1px at 85% 88%,rgba(255,255,255,.24) 0%,transparent 100%); }
.ai-stars::after { content:''; position:absolute; inset:0; background-image:radial-gradient(1.3px 1.3px at 42% 25%,rgba(255,202,27,.65) 0%,transparent 100%),radial-gradient(1px 1px at 88% 62%,rgba(255,202,27,.55) 0%,transparent 100%),radial-gradient(1.2px 1.2px at 10% 78%,rgba(255,202,27,.58) 0%,transparent 100%),radial-gradient(1px 1px at 70% 12%,rgba(255,202,27,.48) 0%,transparent 100%),radial-gradient(1.2px 1.2px at 55% 88%,rgba(255,202,27,.42) 0%,transparent 100%); animation:ai-star-twinkle 3.8s ease-in-out infinite; }
.ai-preview { position:absolute; top:14px; right:-12px; left:24%; display:flex; flex-direction:column; gap:8px; opacity:.65; -webkit-mask-image:linear-gradient(to bottom,black 40%,transparent 88%); mask-image:linear-gradient(to bottom,black 40%,transparent 88%); }
@media(max-width:900px) { .ai-preview{display:none} }
.bubble { font-size:13px; line-height:1.55; padding:9px 14px; max-width:100%; }
.bubble-ai { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.07); color:rgba(255,255,255,.45); border-radius:4px 12px 12px 12px; align-self:flex-start; }
.bubble-user { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.09); color:rgba(255,255,255,.45); border-radius:12px 4px 12px 12px; align-self:flex-end; }
.cursor { display:inline-block; width:1px; height:.9em; background:rgba(255,255,255,.55); margin-left:1px; animation:blink .8s step-end infinite; vertical-align:middle; }
/* AI Chat mock visual */
.ai-chat-mock { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-start; padding:16px 16px 12px; gap:8px; transition:transform .38s cubic-bezier(.4,0,.2,1); }
.b-card-ai .b-visual { flex:1; background:url('../../img/Background2.jpg') center/cover no-repeat; }
.b-card-ai .b-visual:hover .ai-chat-mock { transform:translateY(-92px); }
.ai-chat-msg { display:flex; align-items:flex-end; gap:8px; }
.ai-chat-user { justify-content:flex-end; }
.ai-audio-msg { display:flex; align-items:center; gap:10px; background:rgba(8,8,9,.9); border:1px solid rgba(255,255,255,.11); border-radius:16px 4px 16px 16px; padding:10px 14px; min-width:220px; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.ai-audio-play { width:34px; height:34px; background:rgba(255,255,255,.14); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:rgba(255,255,255,.88); font-size:10px; padding-left:3px; }
.ai-audio-wave { display:flex; align-items:center; gap:3px; height:38px; flex:1; }
.ai-audio-wave span { display:inline-block; width:4px; border-radius:2px; background:rgba(255,255,255,.45); flex-shrink:0; }
.ai-audio-dur { font-size:12px; color:rgba(255,255,255,.45); white-space:nowrap; flex-shrink:0; }
.ai-bot-ava { width:32px; height:32px; border-radius:9px; background:rgba(8,8,9,.92); border:1px solid rgba(255,255,255,.11); display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; color:rgba(255,255,255,.65); flex-shrink:0; letter-spacing:.02em; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.ai-bot-bubble { background:rgba(8,8,9,.9); border:1px solid rgba(255,255,255,.1); border-radius:4px 16px 16px 16px; padding:10px 14px; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.ai-bot-label { font-size:11px; font-weight:600; color:rgba(255,255,255,.38); display:block; margin-bottom:4px; letter-spacing:.03em; text-transform:uppercase; }
.ai-bot-text { font-size:15px; color:rgba(255,255,255,.88); display:flex; align-items:center; gap:6px; }
.ai-bot-check { color:rgba(255,255,255,.55); }
.ai-doc-bubble { background:rgba(8,8,9,.9); border:1px solid rgba(255,255,255,.1); border-radius:4px 16px 16px 16px; padding:10px 12px 14px; min-width:260px; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); -webkit-mask-image:linear-gradient(to bottom,black 50%,transparent 92%); mask-image:linear-gradient(to bottom,black 50%,transparent 92%); }
.ai-doc-preview { display:flex; align-items:center; gap:8px; padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.08); margin-bottom:10px; }
.ai-doc-bubble::after { content:''; display:block; height:66px; background: linear-gradient(to right,rgba(255,255,255,.12) 88%,transparent 88%) no-repeat 0 0/100% 7px, linear-gradient(to right,rgba(255,255,255,.12) 63%,transparent 63%) no-repeat 0 17px/100% 7px, linear-gradient(to right,rgba(255,255,255,.12) 80%,transparent 80%) no-repeat 0 34px/100% 7px, linear-gradient(to right,rgba(255,255,255,.12) 46%,transparent 46%) no-repeat 0 51px/100% 7px; }
.ai-doc-icon { width:34px; height:42px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:700; color:rgba(255,255,255,.6); letter-spacing:.05em; flex-shrink:0; }
.ai-doc-info { display:flex; flex-direction:column; gap:3px; }
.ai-doc-name { font-size:12px; color:rgba(255,255,255,.75); }
.ai-doc-size { font-size:11px; color:rgba(255,255,255,.4); }
.int-orbit { position:absolute; inset:0; pointer-events:none; }
@media(max-width:900px) { .int-orbit{display:none} }
.int-orbit-img { position:absolute; top:22px; right:-55px; width:290px; height:auto; filter:invert(1); mix-blend-mode:screen; opacity:.9; -webkit-mask-image:linear-gradient(to bottom,black 44%,rgba(0,0,0,.18) 68%,transparent 85%); mask-image:linear-gradient(to bottom,black 44%,rgba(0,0,0,.18) 68%,transparent 85%); }
/* Integrations marquee */
.int-marquee-wrap { display:flex; flex-direction:column; justify-content:center; gap:10px; height:100%; padding:0; transform:perspective(600px) rotateX(20deg) rotateZ(-9deg) scale(1.4); transform-origin:center center; }
.int-marquee-row { overflow:hidden; }
.int-marquee-track { display:flex; gap:10px; width:max-content; }
.int-scroll-l { animation:int-ml 22s linear infinite; }
.int-scroll-r { animation:int-mr 22s linear infinite; }
@keyframes int-ml { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes int-mr { from{transform:translateX(-50%)} to{transform:translateX(0)} }
.int-logo-box { width:72px; height:72px; background:rgba(255,255,255,.05); border-radius:18px; border:none; box-shadow:0 2px 8px rgba(0,0,0,.45); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.int-logo-box img { height:34px; width:auto; max-width:52px; opacity:.55; }
.arca-badges { position:absolute; top:16px; right:16px; display:flex; flex-direction:column; gap:8px; opacity:.78; -webkit-mask-image:linear-gradient(to bottom,black 52%,transparent 94%); mask-image:linear-gradient(to bottom,black 52%,transparent 94%); }
@media(max-width:900px) { .arca-badges{display:none} }
.arca-badge { font-size:13px; color:rgba(255,255,255,.45); background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07); border-radius:8px; padding:7px 12px; display:inline-flex; align-items:center; gap:8px; white-space:nowrap; align-self:flex-start; }
.arca-badge:nth-child(even) { align-self:flex-end; }
.arca-check { color:rgba(255,255,255,.35); display:flex; align-items:center; flex-shrink:0; }
/* Sync visual (ARCA card) */
.sync-visual { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:20px 24px; }
.sync-node { width:80px; height:80px; border-radius:16px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; flex-shrink:0; }
.sync-tf { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12); }
.sync-arca-node { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); padding:8px; }
.sync-arca-img { width:50px; height:auto; opacity:.9; }
.sync-label { font-size:10px; color:rgba(255,255,255,.3); letter-spacing:.04em; }
.sync-wire { flex:1; height:2px; position:relative; margin:0 16px; overflow:hidden; }
.sync-beam { position:absolute; inset:0; border-radius:2px; background:linear-gradient(to right,transparent 0%,rgba(255,255,255,.2) 30%,rgba(255,255,255,.2) 70%,transparent 100%); }
.sync-pkt { position:absolute; top:50%; height:2px; border-radius:1px; width:90px; background:linear-gradient(to right,transparent 0%,rgba(255,255,255,.95) 25%,rgba(255,255,255,.95) 75%,transparent 100%); box-shadow:0 0 6px rgba(255,255,255,.5); left:-90px; transform:translateY(-50%); animation:sync-pkt-move 3.2s linear infinite, sync-pkt-fade 3.2s ease-in-out infinite; }
@keyframes sync-pkt-move { 0%{left:-90px} 88%{left:100%} 100%{left:100%} }
@keyframes sync-pkt-fade { 0%,4%{opacity:.08} 48%{opacity:1} 84%,100%{opacity:.08} }
@media(max-width:900px){
  .sync-visual { padding:20px 16px; }
  .sync-node { width:64px; height:64px; border-radius:14px; }
  .sync-arca-img { width:40px; }
  .sync-pkt { width:64px; }
  @keyframes sync-pkt-move { 0%{left:-64px} 88%{left:100%} 100%{left:100%} }
}

/* Planes section */
#planes { padding:var(--section) 0; }
.pref-logo { display:block; margin-bottom:24px; }
.plan-note { text-align:center; margin-top:28px; font-size:13px; color:var(--text-3); }
.pref-h { font-size:26px; font-weight:500; letter-spacing:-.025em; margin-bottom:10px; }
.pref-h em { color:var(--accent); font-style:normal; }
.pref-list { display:flex; flex-direction:column; gap:8px; }
.pref-item { font-size:16px; color:var(--text-2); display:flex; align-items:center; gap:8px; }
.pref-item::before { content:'—'; color:var(--accent); font-size:13px; flex-shrink:0; }
.plans-grid { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--border-1); border-radius:var(--r4); overflow:hidden; }
@media(max-width:900px) { .plans-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:480px) { .plans-grid{grid-template-columns:1fr} }
.plan { background:var(--bg-1); border-right:1px solid var(--border-1); padding:32px 24px; display:flex; flex-direction:column; gap:18px; position:relative; transition:background .2s; }
.plan:last-child { border-right:none; }
.plan:hover { background:var(--bg-2); }
.plan.hot { background:radial-gradient(ellipse 120% 60% at 50% 110%,rgba(255,202,27,.13) 0%,transparent 70%),var(--bg-2); border-right-color:rgba(255,202,27,.28); }

@media(max-width:900px) { .plan{border-right:none;border-bottom:1px solid var(--border-1)} .plan:last-child{border-bottom:none} }
.plan-top-badge { position:absolute; top:0; left:50%; transform:translateX(-50%); font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:#000; background:var(--accent); padding:3px 12px; border-radius:0 0 8px 8px; white-space:nowrap; }
.plan-name { font-size:19px; font-weight:500; color:var(--text-1); letter-spacing:-.02em; }
.plan-sub { font-size:15px; color:var(--text-3); margin-top:2px; }
.plan-amt { font-size:30px; transition:all .25s; }
.plan-feats { display:flex; flex-direction:column; gap:8px; flex:1; }
.plan-feat { font-size:16px; color:var(--text-2); display:flex; align-items:center; gap:8px; }
.plan-desc { font-size:15px; color:var(--text-2); line-height:1.7; font-weight:300; }
.plan-cta { width:100%; justify-content:center; margin-top:12px; }
.disc-pill { display:inline-flex; align-items:center; font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; padding:2px 8px; border-radius:100px; background:var(--accent-muted); border:1px solid var(--accent-border); color:var(--accent); margin-bottom:4px; }
.plan-switch-row { display:flex; align-items:center; gap:8px; }
.psw-label { font-size:12px; color:var(--text-3); cursor:pointer; user-select:none; transition:color .2s; }
.psw-label.on { color:var(--text-2); }
.psw-tag { font-size:11px; color:var(--accent); background:var(--accent-muted); border:1px solid var(--accent-border); padding:1px 6px; border-radius:100px; opacity:0; transition:opacity .2s; pointer-events:none; }
.psw-tag.show { opacity:1; }

/* Funcionalidades grid */
#funcionalidades { padding:var(--section) 0; }
.func-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border-1); border:1px solid var(--border-1); border-radius:var(--r4); overflow:hidden; }
@media(max-width:900px) { .func-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:480px) { .func-grid{grid-template-columns:1fr} }
.func-cell { background:var(--bg-0); padding:24px; transition:background .2s; display:flex; flex-direction:column; gap:8px; cursor:default; }
.func-cell:hover { background:var(--bg-1); }
.func-icon { display:flex; align-items:center; color:var(--accent); flex-shrink:0; }
.func-name { font-size:18px; font-weight:500; color:var(--text-1); letter-spacing:-.01em; }
.func-desc { font-size:16px; color:var(--text-3); line-height:1.55; }
.func-cell.acc { background:var(--bg-1); }
.func-cell.acc .func-name { color:var(--accent); }

/* App móvil */
#app-mobile { padding:var(--section) 0; }
.app-card { display:grid; grid-template-columns:1fr 300px; background:var(--bg-1); border:1px solid var(--border-1); border-radius:24px; overflow:visible; position:relative; align-items:center; }
.app-card::after { content:''; position:absolute; inset:0; border-radius:24px; pointer-events:none; background:radial-gradient(circle 280px at top right,rgba(255,202,27,.28) 0%,rgba(252,216,21,.2) 50%,transparent 75%); opacity:0; transition:opacity .5s; }
.app-card:hover::after { opacity:1; }
.app-card-text { padding:28px 48px 28px 64px; position:relative; z-index:2; border-radius:24px 0 0 24px; overflow:hidden; }
.app-h { font-size:clamp(28px,3.2vw,42px); font-weight:500; letter-spacing:-.025em; line-height:1.1; margin-bottom:16px; }
.app-h strong { color:var(--accent); font-weight:inherit; }
.app-sub { font-size:16px; color:var(--text-2); font-weight:300; line-height:1.65; margin-bottom:36px; max-width:400px; }
.app-badges-wrap { position:relative; display:inline-block; }
.app-download-badges { height:70px; width:auto; display:block; }
.app-badge-link { position:absolute; top:0; bottom:0; width:48%; border-radius:16px; transition:background .22s; }
.app-badge-link--left { left:0; }
.app-badge-link--right { right:0; }
.app-badge-link:hover { background:rgba(255,255,255,.07); }
.app-phone-col { align-self:stretch; display:flex; align-items:flex-end; justify-content:center; position:relative; z-index:3; overflow:visible; }
.app-phone-frame { position:relative; width:400px; flex-shrink:0; transform:translateX(-80px); filter:drop-shadow(-16px 8px 40px rgba(0,0,0,.65)); }
.app-phone-frame > img { width:100%; display:block; }
.app-phone-frame.phone-anim-in { animation:phone-slide-up .8s cubic-bezier(.22,1,.36,1) both; }
.app-status-bar { position:absolute; top:13%; left:21%; right:9%; display:flex; align-items:center; pointer-events:none; z-index:5; padding:0 4px; }
.app-status-time { font-size:11px; font-weight:700; color:rgba(255,255,255,.92); font-family:-apple-system,BlinkMacSystemFont,sans-serif; letter-spacing:-.01em; line-height:1; text-shadow:0 1px 6px rgba(0,0,0,.7); }
@media(max-width:900px) { .app-card{grid-template-columns:1fr;overflow:hidden} .app-card-text{padding:48px 28px 28px;border-radius:24px 24px 0 0} .app-sub{max-width:none} .app-phone-col{height:220px;overflow:hidden;justify-content:center} .app-phone-frame{width:160px;transform:translateY(0)} }

/* CTA */
#cta { padding:var(--section) 0; text-align:center; position:relative; }
.cta-orb { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:400px; height:200px; pointer-events:none; background:radial-gradient(ellipse,rgba(255,202,27,.03) 0%,transparent 70%); filter:blur(40px); }
.cta-inner { position:relative; z-index:2; max-width:560px; margin:0 auto; }
.cta-h { font-size:clamp(30px,5vw,52px); font-weight:500; letter-spacing:-.03em; line-height:1.06; margin-bottom:20px; }
.cta-h em { color:var(--accent); font-style:normal; }
.cta-p { font-size:19px; color:var(--text-2); font-weight:300; max-width:420px; margin:0 auto 36px; line-height:1.7; }
.cta-actions { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:20px; }
.cta-actions .btn { font-size:14px; }
.cta-actions .btn-filled { padding:12px 32px; }
.cta-actions .btn-outline { padding:12px 32px; }
.cta-fine { font-size:13px; color:var(--text-3); }

/* ── Mobile: app section ── */
@media(max-width:720px) {
  .app-card-text { padding:32px 24px 8px; }
  .app-h { font-size:clamp(34px,8.5vw,46px); }
  .app-badges-wrap { display:block; margin:0 auto; max-width:max-content; }
  .app-download-badges { height:48px; }

  .app-phone-col { position:relative; height:380px; display:block; }
  .app-phone-frame { position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:340px; }
  .app-phone-frame.phone-anim-in { animation:phone-mobile-in .8s cubic-bezier(.22,1,.36,1) both; }
}
@media(max-width:360px) { .app-download-badges { height:40px; } }

/* ── Mobile: CTA ── */
@media(max-width:720px) {
  #cta .cta-h { font-size:clamp(34px,8.5vw,46px) !important; line-height:1.08; letter-spacing:-.022em; }
  .cta-p { font-size:17px; }
  .cta-actions .btn { font-size:15px; }
}