:root {
      --navy-950:#06162F;
      --navy-900:#082344;
      --navy-800:#0C315D;
      --navy-700:#113F72;
      --navy-600:#185B9A;
      --aqua-500:#49BFE7;
      --green-500:#37D79D;
      --green-600:#20B982;
      --mint-100:#E8FFF7;
      --sky-100:#E9F7FF;
      --slate-950:#0F172A;
      --slate-800:#1E293B;
      --slate-600:#475569;
      --slate-500:#64748B;
      --slate-300:#CBD5E1;
      --slate-200:#E2E8F0;
      --slate-100:#F1F5F9;
      --white:#FFFFFF;
      --soft:#F8FBFE;
      --radius:22px;
      --radius-sm:14px;
      --shadow: 0 24px 70px rgba(6,22,47,.14);
      --shadow-soft: 0 16px 42px rgba(6,22,47,.10);
      --font-head:'Sora', sans-serif;
      --font-body:'Inter', sans-serif;
    }
    * { box-sizing:border-box; margin:0; padding:0; }
    html { scroll-behavior:smooth; }
    body {
      font-family:var(--font-body);
      color:var(--slate-800);
      background:var(--soft);
      line-height:1.65;
      -webkit-font-smoothing:antialiased;
      overflow-x:hidden;
    }
    a { color:inherit; text-decoration:none; }
    img { max-width:100%; display:block; }
    .container { width:min(1180px, calc(100% - 40px)); margin:0 auto; }
    .pill {
      display:inline-flex; align-items:center; gap:8px;
      border:1px solid rgba(55,215,157,.32);
      background:rgba(55,215,157,.10);
      color:#B9FFE8;
      padding:9px 14px;
      border-radius:999px;
      font-size:.76rem;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .pill.dark { color:var(--green-600); background:rgba(55,215,157,.12); border-color:rgba(55,215,157,.25); }
    .btn {
      display:inline-flex; align-items:center; justify-content:center; gap:10px;
      border:0;
      border-radius:14px;
      padding:14px 22px;
      font-weight:800;
      font-size:.95rem;
      font-family:var(--font-body);
      transition:.22s ease;
      cursor:pointer;
      white-space:nowrap;
    }
    .btn.primary { background:linear-gradient(135deg,var(--green-500),#20C58E); color:#062214; box-shadow:0 14px 32px rgba(55,215,157,.30); }
    .btn.primary:hover { transform:translateY(-2px); box-shadow:0 18px 44px rgba(55,215,157,.42); }
    .btn.ghost { background:rgba(255,255,255,.10); color:white; border:1px solid rgba(255,255,255,.22); }
    .btn.ghost:hover { background:rgba(255,255,255,.16); transform:translateY(-2px); }
    .btn.outline { background:white; color:var(--navy-800); border:1px solid var(--slate-200); box-shadow:0 8px 24px rgba(6,22,47,.08); }
    .btn.outline:hover { transform:translateY(-2px); border-color:rgba(55,215,157,.5); }
    .section { padding:96px 0; position:relative; }
    .section-head { max-width:760px; margin-bottom:42px; }
    .section-head.center { text-align:center; margin-left:auto; margin-right:auto; }
    .eyebrow { color:var(--green-600); font-weight:900; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:12px; }
    h1,h2,h3 { font-family:var(--font-head); color:var(--navy-950); line-height:1.15; letter-spacing:-.035em; }
    h1 { font-size:clamp(2.45rem, 5vw, 4.6rem); font-weight:900; color:white; }
    h2 { font-size:clamp(2rem, 3.4vw, 3.15rem); font-weight:850; }
    h3 { font-size:1.15rem; font-weight:800; }
    .lead { font-size:1.08rem; color:var(--slate-600); line-height:1.78; }
    .dark .lead, .hero .lead { color:rgba(255,255,255,.72); }

    /* NAV */
    .nav {
      position:fixed; inset:0 0 auto 0; z-index:1000;
      padding:16px 0;
      transition:.25s ease;
    }
    .nav.scrolled { background:rgba(6,22,47,.88); backdrop-filter:blur(18px); border-bottom:1px solid rgba(255,255,255,.08); padding:10px 0; }
    .nav-inner { display:flex; align-items:center; justify-content:space-between; gap:22px; }
    .brand { display:flex; align-items:center; gap:12px; color:white; }
    .brand img { width:42px; height:42px; object-fit:contain; border-radius:10px; background:white; padding:3px; }
    .brand-title { font-family:var(--font-head); font-weight:900; font-size:1.15rem; line-height:1; }
    .brand-sub { font-size:.68rem; opacity:.66; margin-top:4px; }
    .nav-links { display:flex; align-items:center; gap:26px; color:rgba(255,255,255,.78); font-size:.88rem; font-weight:700; }
    .nav-links a:hover { color:var(--green-500); }
    .nav-actions { display:flex; gap:10px; }
    .mobile-toggle { display:none; color:white; font-size:1.8rem; cursor:pointer; }
    .mobile-menu { display:none; }

    /* HERO */
    .hero {
      min-height:100vh;
      padding:126px 0 70px;
      display:flex; align-items:center;
      background:
        radial-gradient(circle at 80% 12%, rgba(55,215,157,.24), transparent 28%),
        radial-gradient(circle at 12% 82%, rgba(73,191,231,.18), transparent 32%),
        linear-gradient(135deg, var(--navy-950) 0%, var(--navy-900) 52%, #092C55 100%);
      position:relative;
      overflow:hidden;
    }
    .hero::after {
      content:""; position:absolute; inset:auto -10% -34% -10%; height:440px;
      background:radial-gradient(ellipse at center, rgba(255,255,255,.08), transparent 65%);
      pointer-events:none;
    }
    .hero-grid { display:grid; grid-template-columns:1.02fr .98fr; gap:54px; align-items:center; position:relative; z-index:2; }
    .hero h1 em { color:var(--green-500); font-style:normal; }
    .hero-sub { margin:22px 0 14px; max-width:650px; font-size:1.17rem; color:rgba(255,255,255,.78); }
    .hero-note { color:rgba(255,255,255,.55); font-size:.95rem; max-width:610px; margin-bottom:34px; }
    .hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
    .trust-row { margin-top:32px; display:flex; flex-wrap:wrap; gap:12px; }
    .trust-item { color:rgba(255,255,255,.74); border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.07); padding:10px 13px; border-radius:999px; font-size:.82rem; font-weight:700; }

    .hero-visual { position:relative; min-height:560px; }
    .photo-card {
      position:absolute; inset:0 auto auto 3%;
      width:67%;
      border-radius:30px;
      overflow:hidden;
      box-shadow:var(--shadow);
      border:1px solid rgba(255,255,255,.14);
      background:white;
      transform:rotate(-1.5deg);
    }
    .photo-card img { width:100%; height:560px; object-fit:cover; object-position:center; filter:saturate(1.02) contrast(1.02); }
    .photo-card::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(6,22,47,.40), transparent 42%); }
    .mockup {
      position:absolute; right:0; bottom:0; width:72%;
      background:rgba(255,255,255,.96);
      border:1px solid rgba(255,255,255,.7);
      border-radius:28px;
      padding:18px;
      box-shadow:0 30px 90px rgba(0,0,0,.28);
      backdrop-filter:blur(18px);
      animation:float 5.2s ease-in-out infinite;
    }
    @keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
    .mockup-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
    .mockup-brand { display:flex; align-items:center; gap:8px; font-weight:900; color:var(--navy-900); font-family:var(--font-head); }
    .mockup-brand img { width:28px; height:28px; object-fit:contain; }
    .mockup-chip { font-size:.72rem; font-weight:900; padding:6px 10px; border-radius:999px; color:var(--green-600); background:var(--mint-100); }
    .dash-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
    .dash-card { background:var(--soft); border:1px solid var(--slate-200); border-radius:16px; padding:13px; }
    .dash-label { font-size:.73rem; color:var(--slate-500); font-weight:800; }
    .dash-value { font-size:1.38rem; font-family:var(--font-head); font-weight:900; color:var(--navy-900); margin-top:2px; }
    .bar { height:8px; background:var(--slate-200); border-radius:999px; overflow:hidden; margin-top:10px; }
    .bar span { display:block; height:100%; background:linear-gradient(90deg,var(--green-500),var(--aqua-500)); border-radius:999px; }
    .report-card { margin-top:10px; background:linear-gradient(135deg,var(--navy-900),var(--navy-700)); border-radius:18px; padding:14px; color:white; }
    .report-title { display:flex; justify-content:space-between; align-items:center; font-size:.8rem; font-weight:900; margin-bottom:12px; }
    .chart { height:96px; display:flex; align-items:end; gap:8px; padding-top:10px; }
    .chart i { flex:1; border-radius:8px 8px 2px 2px; background:linear-gradient(to top,var(--green-500),var(--aqua-500)); opacity:.9; }
    .floating-kpi {
      position:absolute; left:0; bottom:54px;
      background:white; color:var(--navy-950);
      border-radius:18px; padding:13px 16px;
      box-shadow:var(--shadow-soft);
      display:flex; align-items:center; gap:12px;
      animation:float2 5.8s ease-in-out infinite;
    }
    @keyframes float2 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)} }
    .kpi-icon { width:38px; height:38px; border-radius:12px; background:var(--mint-100); color:var(--green-600); display:grid; place-items:center; font-weight:900; }
    .kpi-text strong { display:block; font-family:var(--font-head); font-size:.88rem; }
    .kpi-text span { font-size:.75rem; color:var(--slate-500); }

    /* Logo strip */
    .logo-strip { padding:22px 0; background:white; border-bottom:1px solid var(--slate-200); }
    .logo-strip-inner { display:flex; align-items:center; justify-content:center; gap:18px; flex-wrap:wrap; color:var(--slate-500); font-size:.9rem; font-weight:700; }
    .logo-strip img { height:42px; max-width:min(520px, 92vw); width:auto; object-fit:contain; }

    /* Cards */
    .grid-5 { display:grid; grid-template-columns:repeat(5, 1fr); gap:16px; }
    .problem-card,.module-card,.norm-card,.benefit-card,.action-card {
      background:white; border:1px solid var(--slate-200); border-radius:var(--radius); padding:24px; box-shadow:0 1px 0 rgba(6,22,47,.04); transition:.22s ease;
    }
    .problem-card:hover,.module-card:hover,.norm-card:hover,.benefit-card:hover,.action-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-soft); border-color:rgba(55,215,157,.42); }
    .icon { width:46px; height:46px; border-radius:15px; display:grid; place-items:center; background:var(--sky-100); color:var(--navy-700); margin-bottom:14px; }
    .icon.green { background:var(--mint-100); color:var(--green-600); }
    .card-title { margin-bottom:8px; }
    .card-text { color:var(--slate-600); font-size:.9rem; }

    /* Solution */
    .dark { background:linear-gradient(135deg,var(--navy-950),var(--navy-900)); color:white; overflow:hidden; }
    .dark h2,.dark h3 { color:white; }
    .solution-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:42px; align-items:center; }
    .solution-list { display:grid; gap:14px; }
    .solution-item { display:flex; gap:14px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); border-radius:18px; padding:18px; }
    .check { width:30px; height:30px; flex:0 0 30px; border-radius:10px; display:grid; place-items:center; background:rgba(55,215,157,.14); color:var(--green-500); font-weight:900; }
    .solution-item p { color:rgba(255,255,255,.65); font-size:.9rem; }
    .visual-report {
      background:rgba(255,255,255,.92); color:var(--slate-800);
      border-radius:30px; padding:22px;
      box-shadow:0 30px 90px rgba(0,0,0,.22);
      border:1px solid rgba(255,255,255,.45);
    }
    .report-header { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--slate-200); padding-bottom:14px; margin-bottom:18px; }
    .report-header .brand-mini { display:flex; align-items:center; gap:9px; font-family:var(--font-head); font-weight:900; color:var(--navy-900); }
    .brand-mini img { width:30px; }
    .status { font-size:.74rem; font-weight:900; color:var(--green-600); background:var(--mint-100); padding:7px 10px; border-radius:999px; }
    .report-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; margin-bottom:14px; }
    .report-tile { background:var(--soft); border:1px solid var(--slate-200); border-radius:16px; padding:13px; }
    .report-tile span { display:block; font-size:.72rem; color:var(--slate-500); font-weight:800; }
    .report-tile strong { font-family:var(--font-head); font-size:1.3rem; color:var(--navy-900); }
    .report-body { display:grid; grid-template-columns:1.3fr .7fr; gap:14px; }
    .line-chart { height:172px; background:var(--soft); border:1px solid var(--slate-200); border-radius:18px; padding:16px; }
    .line-chart svg { width:100%; height:100%; }
    .alert-list { display:grid; gap:10px; }
    .alert { background:var(--soft); border:1px solid var(--slate-200); border-radius:15px; padding:12px; font-size:.82rem; }
    .alert b { color:var(--navy-900); }

    /* Action */
    .action-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
    .action-image {
      height:190px; border-radius:18px; margin:-8px -8px 18px; overflow:hidden;
      background:linear-gradient(135deg,var(--navy-800),var(--green-600));
      position:relative;
    }
    .action-image img { width:100%; height:100%; object-fit:cover; opacity:.88; }
    .action-image::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(6,22,47,.52), transparent 60%); }
    .action-badge { position:absolute; left:14px; bottom:14px; z-index:2; color:white; background:rgba(6,22,47,.72); padding:7px 10px; border-radius:999px; font-size:.75rem; font-weight:900; }

    /* Modules */
    .modules-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
    .module-card.featured { background:linear-gradient(135deg,var(--navy-900),var(--navy-700)); color:white; border-color:transparent; }
    .module-card.featured h3 { color:white; }
    .module-card.featured .card-text { color:rgba(255,255,255,.68); }
    .tag-mini { display:inline-flex; margin-top:14px; padding:6px 10px; border-radius:999px; background:var(--sky-100); color:var(--navy-700); font-weight:900; font-size:.72rem; }
    .featured .tag-mini { background:rgba(55,215,157,.16); color:#B9FFE8; }

    /* Profiles */
    .profiles { background:var(--white); }
    .profiles-layout { display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px; }
    .profile-card { border-radius:30px; overflow:hidden; background:var(--soft); border:1px solid var(--slate-200); box-shadow:0 1px 0 rgba(6,22,47,.04); }
    .profile-top { height:210px; position:relative; background:linear-gradient(135deg,var(--navy-900),var(--green-600)); overflow:hidden; }
    .profile-top img { width:100%; height:100%; object-fit:cover; opacity:.72; }
    .profile-top::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(6,22,47,.76), transparent 58%); }
    .profile-name { position:absolute; left:22px; bottom:18px; z-index:2; color:white; font-family:var(--font-head); font-size:1.24rem; font-weight:900; }
    .profile-body { padding:24px; }
    .profile-list { display:grid; gap:11px; margin-top:16px; }
    .profile-list li { display:flex; gap:10px; color:var(--slate-600); font-size:.9rem; }
    .profile-list li::before { content:"✓"; color:var(--green-600); font-weight:900; }

    /* Norms */
    .norms-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
    .norm-card { padding:20px; }
    .norm-code { display:inline-flex; font-size:.72rem; font-weight:900; padding:6px 10px; border-radius:999px; color:var(--green-600); background:var(--mint-100); margin-bottom:12px; }
    .note-box { margin-top:28px; border:1px solid rgba(55,215,157,.25); background:var(--mint-100); color:var(--green-700); padding:18px 20px; border-radius:18px; font-weight:700; }
    .note-box a { text-decoration:underline; }

    /* Offline + benefits */
    .offline-benefits { display:grid; grid-template-columns:.95fr 1.05fr; gap:28px; align-items:stretch; }
    .offline-panel { background:linear-gradient(135deg,var(--navy-950),var(--navy-800)); border-radius:30px; padding:28px; color:white; box-shadow:var(--shadow-soft); }
    .sync { margin-top:20px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:18px; padding:18px; }
    .sync-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; font-size:.86rem; color:rgba(255,255,255,.72); font-weight:700; }
    .benefits-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
    .benefit-card strong { display:block; font-family:var(--font-head); color:var(--navy-950); font-size:1.35rem; margin-bottom:5px; }

    /* CTA */
    .cta {
      background:
        radial-gradient(circle at 72% 8%, rgba(55,215,157,.28), transparent 30%),
        linear-gradient(135deg,var(--navy-950),var(--navy-800));
      color:white;
      border-radius:42px;
      padding:68px;
      overflow:hidden;
      position:relative;
      box-shadow:var(--shadow);
    }
    .cta h2 { color:white; max-width:740px; }
    .cta p { color:rgba(255,255,255,.70); max-width:650px; margin:16px 0 28px; }
    .cta-actions { display:flex; flex-wrap:wrap; gap:12px; }

    /* Footer */
    footer { background:var(--navy-950); color:white; padding:54px 0 28px; margin-top:70px; }
    .footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:38px; }
    .footer-brand img { max-width:290px; background:white; border-radius:12px; padding:8px; margin-bottom:15px; }
    .footer-brand p { color:rgba(255,255,255,.58); max-width:420px; }
    .footer-col h4 { color:white; margin-bottom:12px; }
    .footer-col a,.footer-col p { display:block; color:rgba(255,255,255,.62); margin-bottom:8px; font-size:.93rem; }
    .footer-col a:hover { color:var(--green-500); }
    .footer-bottom { margin-top:36px; padding-top:20px; border-top:1px solid rgba(255,255,255,.10); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; color:rgba(255,255,255,.38); font-size:.82rem; }

    /* WA float */
    .wa-float {
      position:fixed; right:22px; bottom:22px; z-index:1100;
      width:58px; height:58px; border-radius:50%;
      display:grid; place-items:center;
      background:#25D366; color:white;
      box-shadow:0 16px 36px rgba(37,211,102,.34);
      transition:.2s ease;
    }
    .wa-float:hover { transform:scale(1.08); }
    .reveal { opacity:0; transform:translateY(22px); transition:.65s ease; }
    .reveal.visible { opacity:1; transform:none; }

    @media (max-width:1020px) {
      .hero-grid,.solution-layout,.offline-benefits { grid-template-columns:1fr; }
      .hero-visual { min-height:520px; }
      .grid-5 { grid-template-columns:repeat(2,1fr); }
      .modules-grid,.norms-grid { grid-template-columns:repeat(2,1fr); }
      .profiles-layout,.action-grid { grid-template-columns:1fr; }
      .nav-links,.nav-actions { display:none; }
      .mobile-toggle { display:block; }
      .mobile-menu.open {
        display:grid; gap:18px; position:fixed; top:72px; left:20px; right:20px; padding:24px;
        background:rgba(6,22,47,.96); backdrop-filter:blur(18px); border:1px solid rgba(255,255,255,.10); border-radius:22px; z-index:999;
      }
      .mobile-menu a { color:white; font-weight:800; }
    }
    @media (max-width:640px) {
      .container { width:min(100% - 28px, 1180px); }
      .section { padding:70px 0; }
      .hero { padding-top:104px; }
      .hero-visual { min-height:450px; }
      .photo-card { width:82%; }
      .photo-card img { height:430px; }
      .mockup { width:88%; }
      .floating-kpi { display:none; }
      .grid-5,.modules-grid,.norms-grid,.benefits-grid,.report-grid,.report-body { grid-template-columns:1fr; }
      .cta { padding:38px 24px; border-radius:28px; }
      .footer-grid { grid-template-columns:1fr; }
      .hero-actions,.cta-actions { flex-direction:column; }
      .btn { width:100%; }
    }

    /* AJUSTE SOLICITADO: calibración fina sin cambiar la versión base */
    h1 { font-size: clamp(2.15rem, 4.15vw, 3.75rem); line-height: 1.08; max-width: 780px; }
    h2 { font-size: clamp(1.85rem, 3vw, 2.85rem); }
    .hero { min-height: auto; padding: 118px 0 78px; }
    .hero-grid { gap: 44px; align-items: center; }
    .hero-sub { font-size: clamp(1rem, 1.1vw, 1.08rem); max-width: 600px; }
    .hero-note { font-size: .92rem; max-width: 600px; }
    .trust-row { margin-top: 24px; gap: 10px; }
    .trust-item { font-size: .78rem; padding: 8px 12px; }
    .hero-visual { min-height: 500px; }
    .photo-card { width: 63%; left: 5%; }
    .photo-card img { height: 500px; object-position: center; }
    .mockup { width: 68%; padding: 16px; border-radius: 24px; }
    .dash-value { font-size: 1.2rem; }
    .report-card { padding: 12px; }
    .chart { height: 78px; }
    .floating-kpi { bottom: 34px; }
    .brand-title { font-size: 1.05rem; }
    .brand-sub { font-size: .64rem; }
    .nav-links { gap: 22px; }
    .btn { padding: 12px 20px; font-size: .9rem; }

    .action-grid { align-items: stretch; }
    .action-card { display: flex; flex-direction: column; }
    .action-image { height: 230px; }
    .action-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
    .action-card .card-text { margin-top: auto; }

    @media (max-width: 1020px) {
      h1 { font-size: clamp(2.05rem, 7vw, 3.2rem); }
      .hero { padding: 105px 0 64px; }
      .hero-visual { min-height: 480px; }
      .photo-card { width: 74%; left: 0; }
      .photo-card img { height: 460px; }
      .mockup { width: 82%; }
    }

    @media (max-width: 640px) {
      h1 { font-size: clamp(2rem, 11vw, 2.6rem); }
      h2 { font-size: clamp(1.55rem, 7vw, 2.05rem); }
      .hero { padding: 96px 0 54px; }
      .hero-actions { flex-direction: column; }
      .trust-row { display: none; }
      .hero-visual { min-height: 410px; margin-top: 10px; }
      .photo-card { width: 82%; left: 0; }
      .photo-card img { height: 390px; }
      .mockup { width: 92%; padding: 12px; border-radius: 20px; }
      .dash-grid { gap: 8px; }
      .dash-label { font-size: .68rem; }
      .dash-value { font-size: 1rem; }
      .report-card { display: none; }
      .floating-kpi { display: none; }
      .action-image { height: 210px; }
    }


    /* INTERFAZ INICIAL V4: hero más limpio, proporcionado y sin sobreposición */
    .hero {
      min-height: auto;
      padding: 112px 0 76px;
    }
    .hero-grid {
      grid-template-columns: minmax(0, .92fr) minmax(430px, .82fr);
      gap: clamp(36px, 5vw, 64px);
      align-items: center;
    }
    .hero h1 {
      font-size: clamp(2.25rem, 4vw, 3.55rem) !important;
      line-height: 1.09 !important;
      max-width: 680px;
      letter-spacing: -0.045em;
    }
    .hero h1 em { color: var(--green-500); }
    .hero-sub {
      font-size: clamp(1rem, 1.08vw, 1.08rem) !important;
      line-height: 1.75;
      max-width: 610px;
      text-align: justify;
      text-justify: inter-word;
      margin: 20px 0 28px;
    }
    .hero-note { display: none; }
    .hero-actions {
      gap: 12px;
      margin-bottom: 22px;
    }
    .hero-highlights {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      max-width: 610px;
    }
    .hero-highlights span {
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.14);
      color: rgba(255,255,255,.82);
      border-radius: 999px;
      padding: 8px 12px;
      font-size: .78rem;
      font-weight: 800;
    }
    .trust-row { display: none !important; }

    .hero-visual {
      min-height: 470px !important;
      display: grid;
      place-items: center;
      position: relative;
    }
    .photo-card {
      position: absolute;
      left: 0;
      top: 30px;
      width: 54% !important;
      max-width: 310px;
      transform: none !important;
      border-radius: 26px;
      z-index: 1;
      opacity: .92;
    }
    .photo-card img {
      height: 410px !important;
      object-fit: cover;
      object-position: center;
    }
    .mockup {
      position: relative !important;
      right: auto !important;
      bottom: auto !important;
      margin-left: auto;
      width: 78% !important;
      max-width: 460px;
      padding: 16px;
      border-radius: 24px;
      z-index: 2;
      animation: none !important;
    }
    .dash-grid {
      gap: 10px;
    }
    .dash-label {
      font-size: .70rem;
      line-height: 1.25;
    }
    .dash-value {
      font-size: 1.12rem !important;
      line-height: 1.1;
    }
    .report-card {
      margin-top: 10px;
      padding: 12px;
    }
    .chart {
      height: 70px !important;
    }
    .floating-kpi {
      left: 22px;
      bottom: 18px !important;
      z-index: 3;
      padding: 11px 14px;
    }
    .kpi-text strong { font-size: .82rem; }
    .kpi-text span { font-size: .72rem; }

    @media (max-width: 1020px) {
      .hero-grid {
        grid-template-columns: 1fr;
        gap: 34px;
      }
      .hero h1, .hero-sub {
        max-width: 760px;
      }
      .hero-visual {
        min-height: 430px !important;
        max-width: 650px;
        width: 100%;
        margin: 0 auto;
      }
      .photo-card {
        width: 48% !important;
        left: 0;
      }
      .photo-card img {
        height: 380px !important;
      }
      .mockup {
        width: 76% !important;
      }
    }

    @media (max-width: 640px) {
      .hero {
        padding: 94px 0 54px;
      }
      .hero h1 {
        font-size: clamp(2rem, 10vw, 2.65rem) !important;
        line-height: 1.08 !important;
      }
      .hero-sub {
        text-align: left;
        font-size: .98rem !important;
        margin-bottom: 22px;
      }
      .hero-actions {
        flex-direction: column;
      }
      .hero-highlights {
        gap: 8px;
      }
      .hero-highlights span {
        font-size: .74rem;
        padding: 7px 10px;
      }
      .hero-visual {
        min-height: 390px !important;
      }
      .photo-card {
        width: 58% !important;
        max-width: 250px;
        left: 0;
        top: 22px;
      }
      .photo-card img {
        height: 330px !important;
      }
      .mockup {
        width: 82% !important;
        margin-left: auto;
        padding: 12px;
        border-radius: 20px;
      }
      .dash-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
      }
      .dash-card {
        padding: 10px;
      }
      .dash-label {
        font-size: .64rem;
      }
      .dash-value {
        font-size: .96rem !important;
      }
      .report-card, .floating-kpi {
        display: none;
      }
    }


    /* FINAL V5: módulos con íconos, comunidad educativa y marco normativo limpio */
    .module-card.module-visual{position:relative;min-height:250px;padding:26px 26px 24px;}
    .module-icon{width:64px;height:64px;border-radius:20px;display:inline-flex;align-items:center;justify-content:center;margin-bottom:18px;box-shadow:0 12px 28px rgba(6,22,47,.08);}
    .module-icon svg{width:34px;height:34px;}
    .module-icon.green{background:#E3FFF4;color:#12A06E;}
    .module-icon.blue{background:#E9F7FF;color:#185B9A;}
    .module-icon.purple{background:#F2E9FF;color:#6D35D4;}
    .module-icon.amber{background:#FFF2D8;color:#E98300;}
    .module-icon.featured-icon{background:rgba(55,215,157,.14);color:#37D79D;border:1px solid rgba(55,215,157,.45);}
    .module-number{display:inline-flex;align-items:center;justify-content:center;min-width:48px;height:34px;padding:0 12px;border-radius:999px;background:#E9F7FF;color:#185B9A;font-weight:900;font-size:.86rem;margin-left:14px;vertical-align:top;}
    .featured-number{background:rgba(55,215,157,.14);color:#37D79D;border:1px solid rgba(55,215,157,.45);}
    .tag-mini.purple{background:#F2E9FF;color:#6D35D4;}
    .tag-mini.amber{background:#FFF2D8;color:#E98300;}
    .module-card.featured .card-text,.module-card.featured h3{color:white;}
    .module-card.featured .tag-mini{background:rgba(55,215,157,.14);color:#B9FFE8;}
    .profile-top img{object-position:center;filter:saturate(.92) contrast(1.04);}
    .note-box{font-size:.96rem;line-height:1.55;}
    @media(max-width:640px){.module-card.module-visual{min-height:auto}.module-icon{width:58px;height:58px}.module-icon svg{width:30px;height:30px}.module-number{min-width:44px;height:32px}}

  
    .brand-text { display:flex; flex-direction:column; line-height:1.1; }
    .brand-title { font-weight:900; font-size:1.1rem; color:white; }
    .brand-sub { font-size:0.65rem; color:rgba(255,255,255,0.65); max-width:220px; line-height:1.2; letter-spacing:0.3px; }
    @media (max-width:640px){ .brand-sub{ display:none; } }
    



/* UX/UI Improvements */
body {
  line-height: 1.8;
}

.section {
  padding: 110px 0;
}

.section-head {
  margin-bottom: 56px;
}

.card-text,
.lead,
.hero-sub,
.profile-list li,
.solution-item p {
  line-height: 1.9;
}

.problem-card,
.module-card,
.norm-card,
.benefit-card,
.action-card,
.profile-card {
  padding: 30px;
}

.grid-5,
.modules-grid,
.norms-grid,
.action-grid,
.benefits-grid,
.profiles-layout {
  gap: 28px;
}

.hero-actions,
.cta-actions {
  gap: 16px;
}

.hero-sub {
  margin-top: 28px;
  margin-bottom: 34px;
}

h1 {
  margin-bottom: 18px;
}

h2 {
  margin-bottom: 18px;
}

h3 {
  margin-bottom: 12px;
}

.btn {
  min-height: 52px;
}

.container {
  width: min(1200px, calc(100% - 56px));
}

@media (max-width: 768px) {
  .section {
    padding: 80px 0;
  }

  .container {
    width: min(100% - 28px, 1200px);
  }

  .problem-card,
  .module-card,
  .norm-card,
  .benefit-card,
  .action-card,
  .profile-card {
    padding: 22px;
  }

  .hero-sub,
  .lead {
    line-height: 1.75;
  }
}


/* HERO SPACING IMPROVEMENTS */
.hero .pill {
  margin-bottom: 28px;
}

.hero h1 {
  margin-top: 10px !important;
  margin-bottom: 34px !important;
  padding-top: 8px;
  padding-bottom: 8px;
  max-width: 760px;
}

.hero-sub {
  margin-top: 0 !important;
  margin-bottom: 40px !important;
}

.hero-actions {
  margin-top: 12px;
  margin-bottom: 34px !important;
}

.hero-highlights {
  margin-top: 8px;
}

.hero-grid {
  align-items: center;
}

@media (max-width: 640px) {
  .hero h1 {
    margin-bottom: 28px !important;
    line-height: 1.12 !important;
  }

  .hero-sub {
    margin-bottom: 30px !important;
  }

  .hero .pill {
    margin-bottom: 22px;
  }
}


/* Login button navigation */
.nav-login-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 12px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.18);
  color: white;
  font-weight: 800;
  font-size: 0.88rem;
  transition: all .22s ease;
}

.nav-login-btn:hover {
  background: rgba(55,215,157,.18);
  border-color: rgba(55,215,157,.45);
  transform: translateY(-1px);
}

.login-icon {
  font-size: 0.95rem;
  line-height: 1;
}

@media (max-width: 1020px) {
  .nav-login-btn {
    width: 100%;
    justify-content: center;
    margin-top: 4px;
  }
}