/*
 * Landing pública de AUTRISK AI (index.html).
 * Adaptada del modelo visual «autrisk_landing_modelo_retoque.html»: mismos
 * estilos, con imágenes locales, logos reales y sin formulario de acceso
 * propio (los botones «Entrar» llevan al login real tras la transición).
 */
:root{
  --navy:#06111f; --navy2:#0b1d34; --blue:#1769ff; --cyan:#21d9ff; --cyan2:#56e6ff;
  --green:#20c982; --text:#0f172a; --muted:#5b6b82; --soft:#f6f9fd; --white:#fff;
  --shadow:0 20px 55px rgba(15,23,42,.16);
  --glow:0 0 48px rgba(33,217,255,.26);
  --max:1180px;
  --besting:#0c0f1e; /* fondo del logo principal de BESTING */
  --pad:clamp(18px,4vw,54px);
  --dock:52px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--navy)}
body{margin:0;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--soft);overflow-x:hidden}
a{text-decoration:none;color:inherit}
button{font:inherit;cursor:pointer}
img{max-width:100%;display:block}
:focus-visible{outline:3px solid var(--cyan2);outline-offset:3px}

.page{position:relative;min-height:100vh;overflow:hidden}
.landing{position:relative;z-index:2;transform-origin:50% 34%;transition:transform .85s cubic-bezier(.2,.85,.2,1),filter .85s,opacity .85s}
body.login-mode .landing{transform:scale(.62) translateY(-22px);filter:blur(12px) brightness(.48);opacity:.12;pointer-events:none}
.warp{position:fixed;inset:0;z-index:30;pointer-events:none;opacity:0;transition:opacity .75s;
  background:radial-gradient(circle at 50% 42%,rgba(33,217,255,.62) 0 4%,rgba(23,105,255,.20) 7%,transparent 24%),
             radial-gradient(circle at 50% 42%,transparent 0 20%,rgba(6,17,31,.92) 72%)}
body.login-mode .warp{opacity:1}

/* ---------- LOGO AUTRISK ----------
   El mismo archivo que usa /pages/login.html. El lienzo tiene mucho margen
   transparente y letras oscuras: se encuadra la parte dibujada (902×227 px a
   partir de 168,291) y se presenta sobre fondo blanco, como el de BESTING. */
.autrisk-logo{display:inline-flex;align-items:center;flex:0 0 auto;background:#fff;border-radius:12px;padding:6px 12px;box-shadow:0 8px 18px rgba(0,0,0,.18)}
.autrisk-logo span{display:block;height:30px;aspect-ratio:902/227;
  background:none}

/* ---------- CABECERA ---------- */
.topbar{position:fixed;top:0;left:0;right:0;z-index:20;padding:18px var(--pad);display:flex;justify-content:center;pointer-events:none;transition:opacity .4s}
body.login-mode .topbar{opacity:0}
.topbar>div{width:min(var(--max),100%);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px 10px 16px;
  border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(6,17,31,.66);box-shadow:0 15px 45px rgba(0,0,0,.22);backdrop-filter:blur(18px);pointer-events:auto}
.brand{display:flex;align-items:center;gap:12px;color:#fff}
.nav{display:flex;align-items:center;gap:6px}
.nav a.link{color:rgba(255,255,255,.82);padding:10px 12px;border-radius:999px;font-weight:650;white-space:nowrap}
.nav a.link:hover{background:rgba(255,255,255,.08);color:#fff}
.nav .enter{border:0;background:linear-gradient(135deg,var(--blue),#0b5bf4);color:#fff;box-shadow:0 12px 28px rgba(23,105,255,.32);padding:10px 17px;border-radius:999px;font-weight:750}

/* Sello "Un producto de BESTING" */
.by-besting{display:inline-flex;align-items:center;gap:9px;color:rgba(255,255,255,.66);font-size:.76rem;font-weight:750;white-space:nowrap;margin:0 6px}
.by-besting img{height:32px;width:auto;max-width:124px;object-fit:contain;background:#fff;border-radius:9px;padding:4px 9px;box-shadow:0 8px 18px rgba(0,0,0,.18)}

/* ---------- BOTONES FIJOS A LA IZQUIERDA ---------- */
.dock{position:fixed;left:14px;top:50%;transform:translateY(-50%);z-index:25;display:flex;flex-direction:column;align-items:flex-start;gap:10px;transition:opacity .4s}
body.login-mode .dock{opacity:0;pointer-events:none}
.dock-btn{height:var(--dock);min-width:var(--dock);display:inline-flex;align-items:center;border-radius:999px;padding:0;color:#fff;font-weight:850;
  border:1px solid transparent;transition:transform .16s,box-shadow .16s}
.dock-btn:hover{transform:translateX(3px)}
.dock-btn.demo{background:linear-gradient(135deg,var(--blue),#0a58ee);box-shadow:0 14px 32px rgba(23,105,255,.42)}
.dock-btn.login{background:rgba(6,17,31,.88);border-color:rgba(86,230,255,.45);box-shadow:0 14px 32px rgba(6,17,31,.30);backdrop-filter:blur(14px)}
.dock-btn .di{width:var(--dock);height:var(--dock);flex:0 0 var(--dock);display:grid;place-items:center}
.dock-btn .di svg{width:22px;height:22px}
.dock-btn .dl{max-width:0;overflow:hidden;white-space:nowrap;transition:max-width .3s ease,padding .3s ease}
.dock-btn .dl-short{display:none}
.dock-btn:hover .dl,.dock-btn:focus-visible .dl{max-width:220px;padding-right:20px}
@media(min-width:1660px){.dock-btn .dl{max-width:220px;padding-right:20px}}

/* Hueco lateral para que el dock no pise el contenido en pantallas medias */
@media(min-width:701px) and (max-width:1419px){
  .hero,.block,.product,.cta,.footer{padding-left:88px!important}
}

/* ---------- VÍDEO DE FONDO (común) ---------- */
.video-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;background-color:var(--navy)}
.video-bg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.1) contrast(1.06)}
.video-bg iframe{position:absolute;top:50%;left:50%;width:max(100vw,177.78vh);height:max(56.25vw,100vh);min-width:100%;min-height:100%;
  transform:translate(-50%,-50%) scale(1.08);border:0;pointer-events:none;filter:saturate(1.1) contrast(1.06)}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100vh;display:grid;place-items:center;padding:135px var(--pad) 150px;color:#fff;isolation:isolate;overflow:hidden}
.hero .video-bg{z-index:-4;background-image:none;background-size:cover;background-position:center}
.hero::before{content:"";position:absolute;inset:0;z-index:-3;
  background:linear-gradient(90deg,rgba(6,17,31,.90) 0%,rgba(6,17,31,.62) 50%,rgba(6,17,31,.82) 100%),
             radial-gradient(circle at 50% 55%,rgba(33,217,255,.20),transparent 40%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:170px;z-index:-2;background:linear-gradient(180deg,transparent,#fff 92%)}
.hero-grid{width:min(var(--max),100%);display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:clamp(32px,5vw,72px);align-items:center}
.eyebrow{display:inline-flex;gap:10px;align-items:center;margin-bottom:22px;padding:9px 13px;border-radius:999px;background:rgba(255,255,255,.09);border:1px solid rgba(86,230,255,.35);backdrop-filter:blur(15px);font-weight:700}
.dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 22px var(--cyan);flex:0 0 auto}
h1{margin:0;font-size:clamp(2.55rem,5.15vw,5.65rem);line-height:1.05;letter-spacing:-.045em;font-weight:950;max-width:820px}
.grad{color:transparent;background:linear-gradient(90deg,#fff,#b4efff 45%,var(--cyan));-webkit-background-clip:text;background-clip:text}
.lead{max-width:720px;margin:26px 0 0;color:rgba(255,255,255,.85);font-size:clamp(1.08rem,1.45vw,1.36rem);line-height:1.58}
.promise{margin:24px 0 0;max-width:650px;color:#fff;font-size:1.12rem;font-weight:850;line-height:1.5}

.mock{border:1px solid rgba(255,255,255,.18);background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.08)),rgba(6,17,31,.52);border-radius:32px;padding:20px;box-shadow:0 30px 80px rgba(0,0,0,.36),var(--glow);backdrop-filter:blur(20px)}
.window{border-radius:22px;overflow:hidden;background:#f7fbff;color:var(--text);box-shadow:inset 0 0 0 1px rgba(15,23,42,.08)}
.window-top{height:48px;display:flex;align-items:center;gap:7px;padding:0 14px;background:rgba(15,23,42,.05);border-bottom:1px solid rgba(15,23,42,.08)}
.wdot{width:10px;height:10px;border-radius:50%;background:#ff6262}
.wdot:nth-child(2){background:#ffbf3c}
.wdot:nth-child(3){background:var(--green)}
.wlabel{margin-left:8px;font-weight:800;color:#64748b;font-size:.78rem}
.mock-content{display:grid;gap:14px;padding:18px}
.alert{display:flex;gap:12px;align-items:flex-start;border-radius:18px;padding:14px;background:linear-gradient(135deg,#eaf2ff,#f7fbff);border:1px solid #d8e6fb}
.ico{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;flex:0 0 auto;color:var(--blue);background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.10);font-weight:900}
.alert h3{margin:0 0 4px;font-size:1rem}
.alert p{margin:0;color:#64748b;font-size:.84rem;line-height:1.4}
.pills{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.pill{padding:12px;border-radius:16px;background:#fff;border:1px solid #e4edf7;min-height:80px}
.pill strong{display:block;color:var(--blue);font-size:.82rem;margin-bottom:5px}
.pill span{display:block;color:#64748b;font-size:.78rem;line-height:1.35}
.ai{display:flex;gap:10px;align-items:center;padding:13px;border-radius:18px;color:#fff;background:linear-gradient(135deg,var(--navy),#123f85)}
.ai .ico{background:rgba(255,255,255,.12);color:var(--cyan2);box-shadow:none}
.ai span{color:rgba(255,255,255,.74);font-size:.78rem}

/* ---------- SECCIONES ---------- */
section.block{padding:clamp(70px,10vw,115px) var(--pad);background:var(--soft)}
.white{background:#fff!important}
.dark{background:radial-gradient(circle at 18% 0%,rgba(33,217,255,.18),transparent 28%),radial-gradient(circle at 86% 40%,rgba(23,105,255,.18),transparent 30%),linear-gradient(180deg,#06111f,#0b1d34)!important;color:#fff}
.inner{width:min(var(--max),100%);margin:auto}
.head{max-width:830px;margin-bottom:34px}
.kicker{color:var(--blue);font-size:.78rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}
.dark .kicker{color:var(--cyan2)}
h2{margin:0;font-size:clamp(2rem,4vw,3.7rem);line-height:1.04;letter-spacing:-.045em}
.head p{margin:18px 0 0;color:#596a80;font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.7}
.dark .head p{color:rgba(255,255,255,.74)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:#fff;border-radius:22px;padding:22px;border:1px solid rgba(15,23,42,.08);box-shadow:0 8px 22px rgba(15,23,42,.08)}
/* Número o icono a la misma altura que el título, centrado en su recuadro */
.card-head{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.card-head h3{margin:0;line-height:1.25}
.card .n{width:46px;height:46px;flex:0 0 46px;display:flex;align-items:center;justify-content:center;border-radius:14px;
  background:linear-gradient(145deg,#eef5ff,#e3eeff);border:1px solid #d6e5fb;color:var(--blue);
  font-weight:900;font-size:.95rem;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.card .n.icon svg{width:22px;height:22px;display:block}
.card h3{font-size:1.12rem}
.card p{margin:0;color:var(--muted);line-height:1.6}

.values{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.value{min-height:300px;padding:34px;border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.16);box-shadow:0 25px 70px rgba(0,0,0,.24)}
.value h3{margin:0 0 15px;font-size:clamp(1.9rem,3vw,3rem)}
.value p{margin:0;color:rgba(255,255,255,.75);line-height:1.75;font-size:1.06rem}
.value strong{color:#fff}
.visual{margin-top:20px;border-radius:28px;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 80px rgba(0,0,0,.28);background:#071527}
.visual img{width:100%;aspect-ratio:16/7;object-fit:cover}

.process{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.step{padding:20px;border-radius:20px;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 8px 22px rgba(15,23,42,.08)}
.num{width:38px;height:38px;flex:0 0 38px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;font-weight:900;line-height:1;font-variant-numeric:tabular-nums;box-shadow:0 6px 14px rgba(23,105,255,.25)}
.step .card-head{gap:12px;margin-bottom:10px}
.step h3{font-size:1.08rem}
.step p{margin:0;color:var(--muted);line-height:1.52;font-size:.94rem}

/* ---------- 5 PORQUÉS + PDCA (OSCURO) ---------- */
.root{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:20px}
.flow,.pdca{border-radius:28px;padding:24px;border:1px solid rgba(255,255,255,.16);box-shadow:0 30px 90px rgba(0,0,0,.25);backdrop-filter:blur(18px)}
.flow{background:rgba(255,255,255,.07)}
/* Cada círculo, centrado en altura con su recuadro y unido al siguiente por una línea */
.row{position:relative;display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:center;margin-bottom:12px}
.row:last-child{margin-bottom:0}
.row:not(:last-child)::after,.row:not(:first-child)::before{content:"";position:absolute;left:22px;width:2px;background:rgba(86,230,255,.30)}
.row:not(:last-child)::after{top:50%;bottom:-12px}  /* hasta la fila siguiente, cruzando el hueco */
.row:not(:first-child)::before{top:0;height:50%}    /* desde arriba hasta su círculo */
.bubble{position:relative;z-index:1;width:42px;height:42px;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1;color:#fff;background:var(--blue);font-weight:900;box-shadow:0 0 0 4px rgba(23,105,255,.18)}
.box{border-radius:16px;padding:15px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14)}
.box strong{display:block;color:var(--cyan2);margin-bottom:6px}
.box p{margin:0;color:rgba(255,255,255,.82);line-height:1.5}
.valid .bubble{background:var(--green);box-shadow:0 0 0 4px rgba(32,201,130,.2)}
.valid .box{background:rgba(32,201,130,.14);border-color:rgba(32,201,130,.42)}
.valid .box strong{color:#6ff0bb}
.pdca{background:linear-gradient(145deg,rgba(18,63,133,.42),rgba(32,201,130,.13));border-color:rgba(86,230,255,.22)}
.pdca h3{margin:0 0 16px;font-size:1.45rem}
.pdca p{color:rgba(255,255,255,.75);line-height:1.65;margin:0 0 18px}
.pdca-list{display:grid;gap:10px}
.pdca-list div{padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.10);color:rgba(255,255,255,.84)}
.pdca-list strong{color:#fff}

.benefit{min-height:145px;padding:20px;border-radius:20px;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 8px 22px rgba(15,23,42,.08)}
.benefit strong{display:flex;gap:9px;align-items:center;margin-bottom:8px}
.benefit strong::before{content:"✓";width:22px;height:22px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-size:.75rem}
.benefit p{margin:0;color:var(--muted);line-height:1.55}

/* ---------- BANDA "UN PRODUCTO DE BESTING" ---------- */
.product{padding:clamp(46px,6vw,72px) var(--pad);background:var(--soft)}
.product .inner{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(22px,4vw,48px);align-items:center;padding:clamp(22px,3vw,34px);background:var(--besting);color:#fff;border-radius:28px;border:1px solid rgba(255,255,255,.10);box-shadow:0 24px 60px rgba(12,15,30,.34)}
.product img{height:clamp(64px,8vw,104px);width:auto;max-width:300px;object-fit:contain}
.product .kicker{color:var(--cyan2)}
.product h3{margin:0 0 8px;font-size:clamp(1.3rem,2vw,1.75rem);letter-spacing:-.02em;color:#fff}
.product p{margin:0;color:rgba(255,255,255,.72);line-height:1.6}
.product a.more{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 20px;border-radius:999px;border:1px solid rgba(255,255,255,.28);color:#fff;font-weight:800;white-space:nowrap}
.product a.more:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.5)}

/* ---------- CTA FINAL CON VÍDEO DE FONDO ---------- */
.cta{position:relative;isolation:isolate;overflow:hidden;min-height:min(86vh,720px);display:grid;place-items:center;padding:clamp(80px,10vw,120px) var(--pad);color:#fff;text-align:center;
  background:linear-gradient(135deg,#06111f,#0b1d34)}
.cta .video-bg{z-index:-3}
.cta::before{content:"";position:absolute;inset:0;z-index:-2;
  background:linear-gradient(180deg,rgba(6,17,31,.82) 0%,rgba(6,17,31,.48) 45%,rgba(6,17,31,.86) 100%),
             radial-gradient(circle at 50% 30%,rgba(33,217,255,.20),transparent 40%)}
.cta-card{width:min(820px,100%);margin:auto;padding:clamp(26px,5vw,54px);border-radius:34px;background:rgba(6,17,31,.55);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(14px);box-shadow:0 30px 90px rgba(0,0,0,.34)}
.cta p{margin:20px auto 0;max-width:680px;color:rgba(255,255,255,.80);line-height:1.7;font-size:1.12rem}
.cta p.closing{font-weight:850;color:#fff;margin-top:26px}
.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:13px;margin-top:30px}
.btn{min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:0 22px;border:1px solid transparent;font-weight:850;transition:transform .16s,box-shadow .16s}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:linear-gradient(135deg,var(--blue),#0a58ee);color:#fff;box-shadow:0 16px 34px rgba(23,105,255,.34)}
.btn.light{background:#fff;color:var(--blue);box-shadow:0 12px 28px rgba(15,23,42,.12)}

/* ---------- PIE ---------- */
.footer{padding:30px var(--pad);background:#040d19;color:rgba(255,255,255,.68)}
.footer .inner{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.logos{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.footer .autrisk-logo span{height:36px}
.footer .by-besting{margin:0;font-size:.82rem}
.footer .by-besting img{height:40px;max-width:150px}
.links{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:.92rem}
.links a{font-weight:700}
.links a:hover{color:#fff}

/* ---------- CAPA DE TRANSICIÓN AL LOGIN ----------
   Sin formulario: solo acompaña la transición mientras se abre el login real. */
.login-layer{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:22px;opacity:0;pointer-events:none;visibility:hidden;transition:opacity .65s ease .18s,visibility 0s linear .85s}
body.login-mode .login-layer{opacity:1;visibility:visible;transition:opacity .65s ease .18s,visibility 0s}
.login-card{width:min(430px,100%);border-radius:28px;padding:30px;color:#fff;text-align:center;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.06)),rgba(6,17,31,.84);border:1px solid rgba(255,255,255,.18);box-shadow:0 30px 90px rgba(0,0,0,.48),var(--glow);backdrop-filter:blur(24px);transform:translateY(22px) scale(.96);transition:transform .65s cubic-bezier(.2,.85,.2,1) .25s}
body.login-mode .login-card{transform:none}
.login-card .autrisk-logo{margin:0 auto 24px}
.login-card .autrisk-logo span{height:44px}
.login-card h2{font-size:1.8rem;margin:0;letter-spacing:-.02em}
.login-card .by-besting{display:flex;justify-content:center;margin:20px 0 0}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1100px){.nav a.link{display:none}}
@media(max-width:980px){
  .hero-grid,.values,.root{grid-template-columns:1fr}
  .grid3,.process{grid-template-columns:repeat(2,1fr)}
  .mock{max-width:650px}
  .product .inner{grid-template-columns:1fr;justify-items:start}
}
@media(max-width:700px){
  .topbar{padding:12px}
  .topbar>div{padding:8px 10px}
  .topbar .autrisk-logo{padding:5px 9px}
  .topbar .autrisk-logo span{height:24px}
  .topbar .by-besting span,.nav .enter{display:none}
  .topbar .by-besting{margin:0}
  .hero{padding:116px var(--pad) 120px}
  h1{font-size:clamp(2.25rem,13vw,3.7rem)}
  .grid3,.process,.pills{grid-template-columns:1fr}
  .visual img{aspect-ratio:4/3}
  .actions{flex-direction:column}
  .btn{width:100%}
  .footer{padding-bottom:104px}
  .footer .inner{align-items:flex-start;flex-direction:column}
  body.login-mode .landing{transform:scale(.74) translateY(-8px)}
  /* En móvil el dock pasa a barra inferior fija */
  .dock{left:0;right:0;top:auto;bottom:0;transform:none;flex-direction:row;align-items:stretch;gap:10px;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(6,17,31,.92);border-top:1px solid rgba(255,255,255,.14);backdrop-filter:blur(16px)}
  .dock-btn{flex:1;justify-content:center;height:48px}
  .dock-btn:hover{transform:none}
  .dock-btn .di{width:34px;height:48px;flex-basis:34px}
  .dock-btn .dl{max-width:none;padding-right:12px;font-size:.92rem}
  .dock-btn .dl-long{display:none}
  .dock-btn .dl-short{display:inline}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  body.login-mode .landing{transform:none;filter:blur(4px) brightness(.55)}
}
/* ==========================================================================
   TEMA MARCA · solo blanco y los colores de marca #180A4C, #270D6F y #0D0F1E (negro de BESTING); #3FEFA7 solo en los botones de entrar y #F90657 solo en los de solicitar demo.
   Misma estructura y mismos textos que la web actual.
   ========================================================================== */
:root{
  color-scheme:light;
  --navy:#180A4C; --navy2:#270D6F; --blue:#270D6F; --cyan:#FFFFFF; --cyan2:#FFFFFF;
  --green:#270D6F; --text:#180A4C; --muted:rgba(24,10,76,.76); --soft:#FFFFFF; --white:#FFFFFF;
  --linea:rgba(24,10,76,.16);
  --shadow:0 20px 55px rgba(24,10,76,.14);
  --glow:0 0 0 transparent;
}
html{background:#FFFFFF}
:focus-visible{outline-color:#270D6F}
.warp{background:radial-gradient(circle at 50% 42%,transparent 0 20%,rgba(24,10,76,.94) 72%)}

/* Logo nuevo, sin recuadro blanco */
.autrisk-logo{background:none;box-shadow:none;padding:0;border-radius:0}
.autrisk-logo span{height:40px;aspect-ratio:2118/472;background:url("../assets/landing/autrisk-logo.png") no-repeat center/contain}
.footer .autrisk-logo span{height:44px}
.login-card .autrisk-logo span{height:58px}

/* Cabecera */
.topbar>div{background:rgba(255,255,255,.94);border-color:#FFFFFF;box-shadow:0 15px 45px rgba(24,10,76,.20)}
.brand,.nav a.link{color:#180A4C}
.nav a.link:hover{background:#180A4C;color:#FFFFFF}
.nav .enter{background:#3FEFA7;color:#180A4C;box-shadow:none}
.by-besting{color:var(--muted)}
.by-besting img{box-shadow:0 0 0 1px var(--linea)}

/* Botones laterales */
.dock-btn.demo{background:#F90657;color:#000000;box-shadow:0 12px 26px rgba(24,10,76,.32)}
.dock-btn.login{background:#3FEFA7;color:#180A4C;border-color:#3FEFA7;box-shadow:0 12px 26px rgba(24,10,76,.28)}

/* Inicio */
.video-bg{background-color:#180A4C}
.hero::before{background:linear-gradient(90deg,rgba(24,10,76,.92) 0%,rgba(24,10,76,.68) 52%,rgba(24,10,76,.80) 100%)}
.hero::after{background:linear-gradient(180deg,transparent,#FFFFFF 92%)}
.eyebrow{background:rgba(24,10,76,.55);border-color:rgba(255,255,255,.55)}
.dot{background:#FFFFFF;box-shadow:none}
.grad{color:#FFFFFF;background:none;-webkit-background-clip:border-box;background-clip:border-box}

/* Vista simulada */
.mock{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.30);box-shadow:0 30px 80px rgba(0,0,0,.34)}
.window{background:#FFFFFF;box-shadow:none}
.window-top{background:#180A4C;border-bottom:0}
.wdot,.wdot:nth-child(2),.wdot:nth-child(3){background:#FFFFFF}
.wlabel{color:#FFFFFF}
.alert{background:#FFFFFF;border-color:var(--linea)}
.ico{background:#270D6F;color:#FFFFFF;box-shadow:none}
.alert p,.pill span{color:var(--muted)}
.pill{border-color:var(--linea)}
.pill strong{color:#270D6F}
.ai{background:#180A4C}
.ai .ico{background:#270D6F;color:#FFFFFF}

/* Secciones claras */
.white{background:#FFFFFF!important}
.head p{color:var(--muted)}
.kicker{color:#270D6F}
.card,.step,.benefit{border-color:var(--linea);box-shadow:none}
.card .n{background:#270D6F;border-color:#270D6F;color:#FFFFFF}
.num{background:#270D6F;box-shadow:none}
.benefit strong::before{background:#270D6F}

/* Secciones oscuras en el morado principal */
.dark{color:#FFFFFF;background:#180A4C!important}
.dark .kicker{color:#FFFFFF}
.dark .head p{color:rgba(255,255,255,.84)}
.value{background:#270D6F;border-color:rgba(255,255,255,.14);box-shadow:none}
.value p{color:rgba(255,255,255,.86)}
.value strong{color:#FFFFFF}
.visual{border-color:rgba(255,255,255,.18);background:#FFFFFF;box-shadow:none}
.visual img{aspect-ratio:auto}
.flow,.pdca{background:#270D6F;border-color:rgba(255,255,255,.14);box-shadow:none;backdrop-filter:none}
.row:not(:last-child)::after,.row:not(:first-child)::before{background:rgba(255,255,255,.34)}
.bubble,.valid .bubble{background:#FFFFFF;color:#180A4C;box-shadow:none}
.box,.valid .box{background:#180A4C;border-color:rgba(255,255,255,.14)}
.box strong,.valid .box strong{color:#FFFFFF}
.box p,.pdca p{color:rgba(255,255,255,.86)}
.pdca-list div{background:#180A4C;color:rgba(255,255,255,.88)}
.pdca-list strong{color:#FFFFFF}

/* Banda BESTING: negro oficial de BESTING, igual al fondo de su logo */
.product{background:#FFFFFF}
.product .inner{background:#0D0F1E;box-shadow:none}
.product .kicker{color:#FFFFFF}

/* Cierre con vídeo */
.cta{background:#180A4C}
.cta::before{background:linear-gradient(180deg,rgba(24,10,76,.86) 0%,rgba(24,10,76,.62) 45%,rgba(24,10,76,.90) 100%)}
.cta-card{background:rgba(24,10,76,.74);box-shadow:none}
.btn.primary{background:#3FEFA7;color:#180A4C;border-color:#3FEFA7;box-shadow:none}
.btn.light{background:#F90657;color:#000000;box-shadow:none}

/* Pie y acceso */
.footer{background:#FFFFFF;color:var(--muted);border-top:1px solid var(--linea)}
.footer .by-besting{color:var(--muted)}
.links a:hover{color:#270D6F}
.login-card{color:#180A4C;background:#FFFFFF;border-color:#FFFFFF;box-shadow:0 30px 90px rgba(0,0,0,.40)}
.login-card .by-besting{color:var(--muted)}

@media(max-width:700px){
  .topbar .autrisk-logo{padding:0}
  .topbar .autrisk-logo span{height:30px}
  .dock{background:#180A4C}
}

/* Fondos de respaldo mientras carga el vídeo, o cuando no se carga (móvil o
   «reducir movimiento»): fotogramas del propio vídeo. */
.hero .video-bg{background-image:url("../assets/landing/fondo-inicio.jpg")}
.cta .video-bg{background-image:url("../assets/landing/fondo-cierre.jpg");background-size:cover;background-position:center}
