/* =========================================================
   AURORA · TEMAS CLAROS · el dueño eligió «Día» el 28-09 (es el tono por omisión del sitio)
   html[data-claro] + data-tema="amanecer" | "dia". Sin atributo = «Noche» (el tema oscuro de aurora.css).
   · Amanecer: página clara; la noche queda en la portada, en «Lo que comparten» y en el pie.
   · Día: todo claro; lo único oscuro es la imagen del logo en la portada.
   Los colores de producto pasan a su versión profunda (rgb_tx) para que se lean sobre claro.
   ========================================================= */
html[data-claro]{
  color-scheme:light;
  --noche:#F3F6FB; --noche-2:#FFFFFF; --noche-3:#EAF0FA; --noche-4:#DCE6F5;
  --vidrio:#FFFFFF; --vidrio-2:#FFFFFF; --vidrio-3:#F7F9FD;
  --borde:rgba(14,22,51,.10); --borde-2:rgba(14,22,51,.17);
  --tx:#0E1633; --tx-2:#44547A; --tx-3:#5B6B90;
  --cian:#087488; --celeste:#2B6CB0; --tinta:#FFFFFF;   /* cian 5:1 sobre el fondo Día (antetítulos de 13 px) */
  --error:#B83227; --ok:#0E9F6E;
  --texto-aurora:linear-gradient(100deg,#0B8F7F 0%,#1877CC 42%,#4B55DD 72%,#7440D0 100%);
  --sombra-c:0 14px 34px -16px rgba(14,22,51,.20);
}
/* Bandas de noche: fichas de color oscuro reescritas dentro de la banda */
html[data-claro] .portada,
html[data-tema="amanecer"] #incluido,
html[data-tema="amanecer"] .pie{
  color-scheme:dark;
  --noche:#030A1F; --vidrio:rgba(10,27,69,.58);
  --borde:rgba(151,219,240,.14); --borde-2:rgba(151,219,240,.28);
  --tx:#EEF5FF; --tx-2:#BCCDE9; --tx-3:#98ACCF;
  --cian:#2FD8F0; --celeste:#97DBF0; --tinta:#FFFFFF;
  color:var(--tx);
}

/* ---------- Cielo de fondo: aurora en tonos de amanecer ---------- */
html[data-claro] .cielo{background:radial-gradient(1200px 620px at 82% -12%,rgba(75,85,221,.10),transparent 62%),radial-gradient(900px 600px at -8% 28%,rgba(11,143,127,.09),transparent 60%),#F3F6FB}
html[data-claro] .cielo::before{opacity:0}
html[data-claro] .luz{opacity:.13}
html[data-claro].con-hoja .luz.l4{opacity:.16}

/* ---------- Barra, menú y botones ---------- */
html[data-claro] .barra{background:rgba(255,255,255,.84);border-bottom-color:rgba(14,22,51,.08)}
html[data-claro] .nav a:hover{background:rgba(14,22,51,.05)}
html[data-claro] .menu-movil{background:rgba(255,255,255,.97)}
html[data-claro] .menu-movil a:active{background:rgba(14,22,51,.05)}
html[data-claro] .btn-aurora{color:#041126}
html[data-claro] .btn-vidrio{background:#FFFFFF;border-color:var(--borde-2);backdrop-filter:none;box-shadow:0 6px 16px -10px rgba(14,22,51,.25)}
html[data-claro] .btn-vidrio:hover{background:#F3F6FB;border-color:rgba(14,22,51,.26)}
html[data-claro] .btn-producto{box-shadow:0 12px 30px -14px rgba(var(--c-rgb),.65)}
html[data-claro] .texto-aurora{background:var(--texto-aurora);-webkit-background-clip:text;background-clip:text}

/* ---------- Portada: la aurora queda de noche y amanece hacia la página ---------- */
html[data-claro] .portada{background:#030A1F}
html[data-claro] .portada{padding-bottom:8px}
html[data-claro] .portada::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--aurora)}
html[data-claro] .portada .btn-vidrio{background:rgba(151,219,240,.08);color:var(--tx);border-color:var(--borde-2);box-shadow:none}
html[data-claro] .portada .btn-vidrio:hover{background:rgba(151,219,240,.16)}

/* ---------- Tarjetas y superficies ---------- */
html[data-claro] .plataforma{background:linear-gradient(160deg,rgba(var(--c-rgb),.10) 0%,rgba(var(--c-rgb),0) 50%),#FFFFFF;box-shadow:var(--sombra-c)}
html[data-claro] .plataforma::after{opacity:.35}
html[data-claro] .plataforma:hover{border-color:rgba(var(--c-rgb),.45);box-shadow:0 26px 54px -26px rgba(var(--c-rgb),.5)}
html[data-claro] .motor{background:#FFFFFF}
html[data-claro] .motor:hover{background:#F7F9FD;border-color:var(--borde-2)}
html[data-claro] .motor .icono{background:rgba(14,22,51,.05)}
html[data-claro] .motor[aria-pressed="true"]{border-color:rgba(10,128,152,.5);background:linear-gradient(120deg,rgba(10,128,152,.10),rgba(75,85,221,.06)),#FFFFFF}
html[data-claro] .motor[aria-pressed="true"] .icono{background:var(--aurora);color:#041126}
html[data-claro] .constelacion .orbita{stroke:rgba(14,22,51,.16)}
html[data-claro] .constelacion .rayo{stroke:rgba(14,22,51,.12)}
html[data-claro] .opcion{background:#FFFFFF;box-shadow:0 8px 20px -14px rgba(14,22,51,.25)}
html[data-claro] .opcion .ms{background:rgba(14,22,51,.05)}
html[data-claro] .opcion[aria-pressed="true"]{background:linear-gradient(120deg,rgba(var(--c-rgb),.12),rgba(var(--c-rgb),.03)),#FFFFFF}
html[data-claro] .resultado{background:linear-gradient(120deg,rgba(var(--c-rgb),.12),rgba(var(--c-rgb),.02) 60%),#FFFFFF;box-shadow:var(--sombra-c)}
html[data-claro] .caso{background:linear-gradient(135deg,rgba(var(--c-rgb),.10),transparent 55%),#FFFFFF;box-shadow:var(--sombra-c)}
html[data-claro] .principio{background:#FFFFFF}
html[data-claro] .banda{background:radial-gradient(620px 320px at 92% 0%,rgba(116,64,208,.16),transparent 70%),radial-gradient(720px 340px at 0% 100%,rgba(11,143,127,.16),transparent 70%),#FFFFFF;box-shadow:var(--sombra-c)}
html[data-claro] .nosotros-img{box-shadow:0 30px 70px -34px rgba(24,119,204,.55)}
html[data-claro] .pc::after{background:linear-gradient(180deg,#C9D3E6,#AEBBD3)}
html[data-claro] .pc{background:linear-gradient(180deg,#27365E,#162449)}

/* ---------- Bandas de noche en Amanecer: «Lo que comparten» y el pie ---------- */
html[data-tema="amanecer"] #incluido{background:radial-gradient(900px 420px at 80% 0%,rgba(92,123,255,.22),transparent 65%),radial-gradient(800px 420px at 0% 100%,rgba(46,230,168,.14),transparent 65%),#030A1F}
html[data-tema="amanecer"] #incluido .texto-aurora{background:var(--aurora);-webkit-background-clip:text;background-clip:text}
html[data-tema="amanecer"] #incluido .motor{background:rgba(10,27,69,.38)}
html[data-tema="amanecer"] #incluido .motor:hover{background:rgba(16,37,90,.5)}
html[data-tema="amanecer"] #incluido .motor .icono{background:rgba(151,219,240,.1)}
html[data-tema="amanecer"] #incluido .motor[aria-pressed="true"]{border-color:rgba(47,216,240,.6);background:linear-gradient(120deg,rgba(47,216,240,.14),rgba(92,123,255,.1)),rgba(10,27,69,.6)}
html[data-tema="amanecer"] #incluido .constelacion .orbita{stroke:rgba(151,219,240,.16)}
html[data-tema="amanecer"] #incluido .constelacion .rayo{stroke:rgba(151,219,240,.18)}
html[data-tema="amanecer"] .pie{background:#030A1F;border-top:0;margin-top:clamp(48px,7vw,96px)}
html[data-tema="dia"] .pie{background:#EAF0FA}

/* ---------- Pantallas completas (producto y contratar) ---------- */
html[data-claro] .hoja-cielo{background:radial-gradient(900px 520px at 82% -12%,rgba(var(--c-rgb),.13),transparent 65%),radial-gradient(700px 500px at -10% 40%,rgba(var(--c-rgb),.06),transparent 60%)}
html[data-claro] .hoja-barra{background:rgba(255,255,255,.86)}
html[data-claro] .volver:hover{background:rgba(14,22,51,.05)}
html[data-claro] .funcion{background:#FFFFFF}
html[data-claro] .funcion .ms{background:rgba(var(--c-rgb),.12)}
html[data-claro] .chip{background:#FFFFFF}
html[data-claro] .plan{background:#FFFFFF;box-shadow:var(--sombra-c)}
html[data-claro] .plan.recomendado{background:linear-gradient(160deg,rgba(var(--c-rgb),.10),transparent 60%),#FFFFFF}
html[data-claro] .cotizar-caja{background:linear-gradient(120deg,rgba(var(--c-rgb),.10),transparent 60%),#FFFFFF}
html[data-claro] .p-nav a{background:#FFFFFF}
html[data-claro] .p-logo.claro img{box-shadow:0 8px 22px -14px rgba(14,22,51,.35)}
html[data-claro] .arte-producto{background:radial-gradient(closest-side,rgba(var(--c-rgb),.18),transparent 78%),linear-gradient(160deg,rgba(var(--c-rgb),.10),#FFFFFF);border-color:rgba(var(--c-rgb),.35);box-shadow:0 40px 80px -46px rgba(var(--c-rgb),.7)}
html[data-claro] .panel{box-shadow:var(--sombra-c)}
html[data-claro] .pasos li::before{background:rgba(14,22,51,.10)}
html[data-claro] .pasos li.hecho::before{background:rgb(var(--c-rgb))}
html[data-claro] .pasos li.actual::before{background:linear-gradient(90deg,rgb(var(--c-rgb)),rgba(var(--c-rgb),.35))}
html[data-claro] .elige{background:#FFFFFF}
html[data-claro] .elige[aria-checked="true"]{background:linear-gradient(120deg,rgba(var(--c-rgb),.12),rgba(var(--c-rgb),.03)),#FFFFFF}
html[data-claro] .campo input,html[data-claro] .campo textarea{background:#FFFFFF;border-color:rgba(14,22,51,.18)}
html[data-claro] .campo input::placeholder,html[data-claro] .campo textarea::placeholder{color:#8190AE}
html[data-claro] .campo input:focus,html[data-claro] .campo textarea:focus{border-color:var(--cian);box-shadow:0 0 0 4px rgba(10,128,152,.16)}
html[data-claro] .opc{background:#FFFFFF}
html[data-claro] .opc[aria-checked="true"]{background:rgba(var(--c-rgb),.12)}
html[data-claro] .comprobante{background:#F7F9FD}
html[data-claro] .aviso-paso{background:#FDECEA;border-color:#F0B5AC;color:#8E2A1E}
html[data-claro] .aviso-paso .ms{color:var(--error)}


/* Estados elegidos: las reglas claras de arriba no deben apagarlos */
html[data-claro] .opcion[aria-pressed="true"] .ms{background:rgb(var(--c-rgb));color:#FFFFFF}
html[data-claro] .campo.mal input,html[data-claro] .campo.mal textarea{border-color:var(--error)}
html[data-tema="amanecer"] #incluido .motor[aria-pressed="true"] .icono{background:var(--aurora);color:#041126}

/* ---------- 28-09 · piezas nuevas en claro: Nosotros, Cómo partimos, Confianza, Contacto, primer paso, solicitud ---------- */
html[data-claro] .principio,html[data-claro] .paso-p,html[data-claro] .confianza-item,html[data-claro] .ficha-empresa,html[data-claro] .correo-caja,
html[data-claro] .primer-paso{box-shadow:var(--sombra-c)}
html[data-claro] .principio-icono,html[data-claro] .correo-icono{box-shadow:0 10px 22px -12px rgba(24,119,204,.55)}
html[data-claro] .paso-n{background:var(--texto-aurora);-webkit-background-clip:text;background-clip:text}
html[data-claro] .paso-icono{background:rgba(14,22,51,.05)}
html[data-claro] .confianza-icono{background:rgba(14,159,110,.10)}
html[data-claro] .primer-paso{background:linear-gradient(120deg,rgba(var(--c-rgb),.10),transparent 60%),#FFFFFF}
html[data-claro] .ficha-solicitud{background:#F7F9FD}
html[data-claro] .copia-respaldo{background:#FFFFFF;border-color:rgba(14,22,51,.18)}
html[data-claro] .funciona-con{background:rgba(var(--c-rgb),.06)}

/* ==========================================================================================================================
   06-10-2026 · TONO SOBRIO (pedido del dueño: «colores más sólidos, menos difuminados, menos estilo IA, la tónica del logo nuevo»)
   Paleta del logo: azul noche #01124E · azul eléctrico #0066FB · azul hondo #0045E9 · cian #00EDF8.
   Sin degradados, luces que se mueven, vidrio ni brillos. Va al final para ganarle a lo anterior; el color de cada plataforma
   (--c-rgb) sigue, pero plano: un filete arriba de su tarjeta.
   ========================================================================================================================== */
html[data-claro]{
  --marca-noche:#01124E; --marca-azul:#0066FB; --marca-azul-hondo:#0045E9; --marca-cian:#00EDF8;
  --aurora:var(--marca-azul);   /* el degradado de 4 colores pasa a ser UN color: todo lo que lo usaba queda sólido */
  --sombra-sobria:0 1px 2px rgba(1,18,78,.06),0 10px 26px -20px rgba(1,18,78,.40);
  --borde-sobrio:#E1E6F0;
}
/* Fondo plano: sin luces que se mueven, estrellas ni manchas de color */
html[data-claro] .cielo{background:#F4F6FA}
html[data-claro] .cielo::before,html[data-claro] .luz{display:none}
html[data-claro] .hoja-cielo{background:none}
/* Barras sólidas, sin vidrio */
html[data-claro] .barra{background:#FFFFFF;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid var(--borde-sobrio)}
html[data-claro] .hoja-barra{background:#FFFFFF;backdrop-filter:none;-webkit-backdrop-filter:none}
/* Botones sólidos */
html[data-claro] .btn-aurora{background:var(--marca-azul);color:#FFFFFF;box-shadow:none}
html[data-claro] .btn-aurora:hover{background:var(--marca-azul-hondo);box-shadow:none;transform:none}
html[data-claro] .btn-vidrio{background:#FFFFFF;border:1px solid #CBD4E5;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-claro] .btn-vidrio:hover{border-color:var(--marca-azul)}
html[data-claro] .portada .btn-vidrio{background:transparent;color:#FFFFFF;border:1px solid rgba(255,255,255,.6);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-claro] .portada .btn-vidrio:hover{background:rgba(255,255,255,.10)}
/* La palabra destacada de los títulos y los números de «Cómo partimos»: azul sólido, sin texto en degradado */
html[data-claro] .texto-aurora,html[data-claro] .paso-n{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--marca-azul)}
/* Íconos de las piezas: el cuadrado del logo (azul noche) con el símbolo en cian */
html[data-claro] .principio-icono,html[data-claro] .correo-icono,
html[data-claro] .motor[aria-pressed="true"] .icono,html[data-claro] .paso-icono,html[data-claro] .confianza-icono{background:var(--marca-noche);color:var(--marca-cian);box-shadow:none}
/* Tarjetas: blancas, borde fino, sombra neutra; el color de su plataforma en un filete arriba */
html[data-claro] .plataforma{background:#FFFFFF;border:1px solid var(--borde-sobrio);border-top:4px solid rgb(var(--c-rgb));box-shadow:var(--sombra-sobria)}
html[data-claro] .plataforma::after{display:none}
html[data-claro] .plataforma:hover{border-color:var(--borde-sobrio);border-top-color:rgb(var(--c-rgb));box-shadow:0 2px 4px rgba(1,18,78,.06),0 18px 34px -22px rgba(1,18,78,.45)}
html[data-claro] .caso{background:#FFFFFF;border-top:4px solid rgb(var(--c-rgb));box-shadow:var(--sombra-sobria)}
html[data-claro] .primer-paso{background:#FFFFFF;border:1px solid rgba(var(--c-rgb),.35)}
html[data-claro] .arte-producto{background:rgba(var(--c-rgb),.08);box-shadow:none}
html[data-claro] .banda{background:#FFFFFF;border:1px solid var(--borde-sobrio);box-shadow:var(--sombra-sobria)}
html[data-claro] .principio,html[data-claro] .paso-p,html[data-claro] .confianza-item,html[data-claro] .ficha-empresa,html[data-claro] .correo-caja,
html[data-claro] .nosotros-img{box-shadow:var(--sombra-sobria)}
/* Sin halos */
html[data-claro] .nucleo{box-shadow:0 0 0 1px rgba(1,18,78,.12),0 12px 28px -14px rgba(1,18,78,.45)}
html[data-claro] .estado::before{box-shadow:none}
html[data-claro] .portada::after{background:var(--marca-azul)}
/* Logo de Aurora sobre fondo claro (06-10-2026, estándar del dueño): la «A» sola, sin placa */
html[data-claro] .nucleo{background:#FFFFFF}
html[data-claro] .nucleo img{object-fit:contain;padding:18%}
html[data-claro] .funciona-con .iso,html[data-claro] .ficha-marca img{border-radius:0;box-shadow:none}

/* ===================== FACHADA «PANORAMA CLARO» (04-11-2026, elegida por el dueño) =====================
   Portada partida (mensaje a la izquierda, la aurora enmarcada a la derecha), fondo claro plano y tarjetas de plataforma con una franja
   sólida de su color. Mismos contenidos; solo cambia la presentación. Propuestas en docs/propuestas/2026-11-04-fachada/. */
html[data-claro] body, html[data-claro] .cielo { background: #F4F6FA !important; }
html[data-claro] .luz { display: none !important; }
html[data-claro] .portada { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1.05fr); align-items: center;
  max-width: 1280px; margin: 0 auto; padding: 56px clamp(16px,4vw,40px) 40px !important; gap: 48px; background: transparent !important; }
html[data-claro] .portada-img { order: 2; border-radius: 28px !important; aspect-ratio: 4/3 !important; max-height: none !important; }
html[data-claro] .portada-img img { object-position: 50% 30% !important; }
html[data-claro] .portada-img::after, html[data-claro] .portada-img::before { display: none !important; }
html[data-claro] .portada-texto { order: 1; margin: 0 !important; padding: 0 !important; width: auto !important; max-width: none !important; }
html[data-claro] .portada h1 { color: #01124E !important; font-size: clamp(40px,5vw,68px) !important; }
html[data-claro] .portada .bajada { color: #3A4A70 !important; }
html[data-claro] .portada .btn-vidrio { color: #01124E !important; border: 1.5px solid #01124E !important; background: #fff !important; }
html[data-claro] .sellos * { color: #3A4A70 !important; }
html[data-claro] .seccion { padding-block: clamp(72px,8vw,112px) !important; }
html[data-claro] .cabeza-seccion h2 { font-size: clamp(36px,4.4vw,56px) !important; }
html[data-claro] .grilla-plataformas { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 22px !important; }
html[data-claro] .plataforma { padding: 0 0 18px !important; overflow: hidden; border-radius: 22px !important; border: 1px solid #DDE3EE !important;
  box-shadow: 0 1px 2px rgba(1,18,78,.06) !important; background: #fff !important; }
html[data-claro] .plataforma::before, html[data-claro] .plataforma::after { display: none !important; }
html[data-claro] .plataforma-top { background: rgb(var(--c-rgb)); padding: 22px; margin-bottom: 4px; }
html[data-claro] .plataforma-top .rubro { color: #fff !important; }
html[data-claro] .plataforma-top .emblema, html[data-claro] .plataforma-top img { width: 56px !important; height: 56px !important; background: #fff; border-radius: 14px; }
html[data-claro] .plataforma > div:not(.plataforma-top), html[data-claro] .plataforma .destacados, html[data-claro] .plataforma-pie { padding-inline: 22px; }
html[data-claro] .plataforma h3 { font-size: 30px !important; color: #01124E !important; }
html[data-claro] .btn-producto, html[data-claro] .btn-aurora { background: #0066FB !important; color: #fff !important; box-shadow: none !important; }
html[data-claro] .caso { border-radius: 26px !important; box-shadow: none !important; border: 1px solid #DDE3EE !important; }

@media (max-width: 760px) {
  html[data-claro] .portada { grid-template-columns: 1fr !important; padding-top: 20px !important; gap: 24px; }
  html[data-claro] .portada-img { order: 1; aspect-ratio: 16/10 !important; border-radius: 20px !important; }
  html[data-claro] .portada-texto { order: 2; }
  html[data-claro] .grilla-plataformas { grid-template-columns: 1fr !important; }
}

/* «Ver muestra»: las pantallas de un trabajo sin sitio en línea, en grande encima de la página */
.muestra-velo{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px 16px;background:rgba(1,18,78,.78)}
.muestra-caja{position:relative;width:min(1100px,100%);max-height:100%;overflow:auto;background:#fff;border-radius:22px;padding:22px}
.muestra-caja h3{color:#01124E;margin:0 0 14px;font-size:22px}
.muestra-cerrar{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:12px;border:1px solid #DDE3EE;background:#fff;color:#01124E;display:grid;place-items:center;cursor:pointer}
.muestra-pantallas{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:18px;align-items:start}
.muestra-pantallas img{width:100%;height:auto;border-radius:14px;border:1px solid #DDE3EE}
@media (max-width:760px){.muestra-pantallas{grid-template-columns:1fr}.muestra-pantallas .m-cel{max-width:300px;justify-self:center}}
