:root{
          --sh1:#4dc2ad;
          --sh2:#63cad7;
          --sh3:#eafcf9;
          --sh4:#f7ffff;

          --text:#102327;
          --muted:#567176;

          --white:#ffffff;
          --border:rgba(16,35,39,.10);
          --cardBorder:rgba(16,35,39,.08);

          --ready1:#1e2a78;
          --ready2:#1fb5a9;

          --r14:14px;
          --r18:18px;
          --r22:22px;
          --r26:26px;
          --r30:30px;

          --shadow1:0 20px 60px rgba(16,35,39,.10);
          --shadow2:0 28px 80px rgba(16,35,39,.12);
        }

        *{box-sizing:border-box}
        html,body{height:100%}
        html,body{overflow-x:hidden}

        body{
          margin:0;
          color:var(--text);
          font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,sans-serif;
          -webkit-font-smoothing:antialiased;
          -moz-osx-font-smoothing:grayscale;
          background:
            radial-gradient(1200px 700px at 15% 10%, rgba(255,255,255,.88), transparent 52%),
            radial-gradient(900px 600px at 85% 20%, rgba(99,202,215,.12), transparent 54%),
            linear-gradient(180deg, #f8fffe 0%, #effcf9 42%, #f8ffff 100%);
        }

        a{color:inherit;text-decoration:none}
        .container{max-width:1200px;margin:0 auto;padding:0 22px}

        .btn{
          display:inline-flex;
          align-items:center;
          justify-content:center;
          gap:10px;
          padding:13px 20px;
          border-radius:var(--r14);
          border:1px solid transparent;
          cursor:pointer;
          font-weight:800;
          letter-spacing:.01em;
          transition:transform .12s ease, opacity .12s ease, background .12s ease, border-color .12s ease;
          min-height:48px;
          white-space:nowrap;
        }
        .btn:hover{transform:translateY(-1px)}
        .btn:active{transform:translateY(0)}

        .btn-primary{
          color:#ffffff;
          background:linear-gradient(135deg,var(--sh1),var(--sh2));
          box-shadow:0 16px 40px rgba(77,194,173,.20);
        }
        .btn-primary:hover{opacity:.96}

        .btn-secondary{
          color:var(--text);
          background:#ffffff;
          border-color:var(--border);
          box-shadow:var(--shadow1);
        }

        .btn-ready-primary{
          color:#0b1220;
          background:#ffffff;
          border:1px solid rgba(255,255,255,.55);
          box-shadow:0 16px 40px rgba(0,0,0,.14);
        }

        .btn-ready-secondary{
          color:#ffffff;
          background:rgba(255,255,255,.12);
          border:1px solid rgba(255,255,255,.20);
        }

        header{
          position:sticky;
          top:0;
          z-index:20;
          border-bottom:1px solid rgba(16,35,39,.08);
          background:rgba(255,255,255,.84);
          backdrop-filter:blur(14px);
        }

        .header{
          min-height:76px;
          display:flex;
          align-items:center;
          justify-content:space-between;
          gap:16px;
        }

        .brand{
          display:flex;
          align-items:center;
          gap:12px;
        }

        .brand-badge{
          width:52px;
          height:52px;
          border-radius:14px;
          background:#ffffff;
          border:1px solid rgba(16,35,39,.08);
          box-shadow:var(--shadow1);
          display:flex;
          align-items:center;
          justify-content:center;
          overflow:hidden;
          padding:6px;
        }

        .brand-badge img{
          width:100%;
          height:100%;
          object-fit:contain;
          display:block;
        }

        .brand-copy{
          display:flex;
          flex-direction:column;
          gap:2px;
        }

        .brand-title{
          font-family:Poppins,Inter,system-ui;
          font-weight:900;
          font-size:20px;
          line-height:1;
          color:var(--text);
        }

        .brand-sub{
          font-size:12px;
          color:var(--muted);
          font-weight:700;
          line-height:1.2;
        }

        nav{
          display:flex;
          gap:18px;
          align-items:center;
          flex-wrap:wrap;
        }

        nav a{
          color:var(--muted);
          font-weight:700;
          font-size:14px;
          padding:8px 10px;
          border-radius:12px;
          transition:background .12s ease,color .12s ease;
        }

        nav a:hover{
          background:rgba(77,194,173,.10);
          color:var(--text);
        }

        section{padding:84px 0}

        .hero{
          padding:46px 0 38px;
        }

        .hero-shell{
          border-radius:30px;
          overflow:hidden;
          border:1px solid rgba(16,35,39,.08);
          background:
            radial-gradient(900px 360px at 85% 12%, rgba(255,255,255,.18), transparent 58%),
            linear-gradient(135deg, var(--sh1), var(--sh2));
          box-shadow:var(--shadow2);
        }

        .hero-top{
          padding:34px 30px 14px;
          display:flex;
          justify-content:center;
        }

        .hero-logo-box{
          background:#ffffff;
          border:1px solid rgba(16,35,39,.08);
          border-radius:24px;
          padding:16px 24px;
          box-shadow:0 18px 50px rgba(16,35,39,.10);
          display:inline-flex;
          align-items:center;
          justify-content:center;
          max-width:min(860px,100%);
        }

        .hero-logo-box img{
          width:min(720px,100%);
          height:auto;
          display:block;
          object-fit:contain;
        }

        .hero-body{
          padding:0 30px 34px;
          display:grid;
          grid-template-columns:1.08fr .92fr;
          gap:28px;
          align-items:center;
        }

        .eyebrow{
          display:inline-flex;
          align-items:center;
          gap:10px;
          width:max-content;
          padding:8px 12px;
          border-radius:999px;
          background:rgba(255,255,255,.18);
          border:1px solid rgba(255,255,255,.24);
          color:#ffffff;
          font-size:12px;
          font-weight:800;
          letter-spacing:.08em;
          text-transform:uppercase;
        }

        h1{
          margin:16px 0 14px;
          font-family:Poppins,Inter,system-ui;
          font-weight:900;
          font-size:54px;
          line-height:1.02;
          letter-spacing:-.03em;
          color:#ffffff;
          text-shadow:0 12px 40px rgba(0,0,0,.12);
        }

        .hero p{
          margin:0;
          color:rgba(255,255,255,.95);
          font-size:18px;
          line-height:1.72;
          max-width:680px;
        }

        .hero-actions{
          margin-top:24px;
          display:flex;
          gap:12px;
          flex-wrap:wrap;
        }

        .hero-side{
          display:grid;
          gap:14px;
        }

                .hero-card{
          border-radius:24px;
          padding:22px;
          background:#ffffff;
          border:1px solid rgba(16,35,39,.10);
          box-shadow:0 16px 44px rgba(0,0,0,.10);
          color:#6d6e71;
        }

        .hero-card h3{
          margin:0 0 10px;
          font-family:Poppins,Inter,system-ui;
          font-size:24px;
          line-height:1.12;
          font-weight:900;
          color:#6d6e71;
        }

        .hero-card p{
          margin:0;
          font-size:15px;
          line-height:1.68;
          color:#6d6e71;
        }

        .hero-links{
          display:grid;
          gap:12px;
        }

        .hero-link{
          display:flex;
          align-items:center;
          gap:14px;
          padding:14px 16px;
          border-radius:18px;
          background:#ffffff;
          border:1px solid rgba(16,35,39,.10);
          box-shadow:0 12px 30px rgba(0,0,0,.08);
        }

        .hero-link img{
          width:30px;
          height:30px;
          object-fit:contain;
          display:block;
          flex:0 0 auto;
        }

        .hero-link span{
          color:#6d6e71;
          font-size:15px;
          font-weight:800;
          line-height:1.45;
        }

                .light{
          background:linear-gradient(180deg, rgba(255,255,255,.99), rgba(248,250,252,.99));
          color:var(--text);
          box-shadow:0 22px 80px rgba(15,23,42,.08);
        }

        .canal-gradient{
          background:
            radial-gradient(900px 360px at 85% 12%, rgba(255,255,255,.18), transparent 58%),
            linear-gradient(135deg, var(--sh1), var(--sh2));
          color:#ffffff;
          box-shadow:0 22px 80px rgba(15,23,42,.08);
        }

        .canal-gradient .section-head h2{
          color:#ffffff;
        }

        .canal-gradient .section-head p{
          color:rgba(255,255,255,.92);
        }

        .canal-gradient .about-box{
          background:#ffffff;
          border-radius:24px;
          padding:26px;
          border:1px solid var(--cardBorder);
          box-shadow:0 18px 50px rgba(15,23,42,.08);
        }

        .canal-gradient .about-box h3{
          color:var(--text);
        }

        .canal-gradient .about-box p{
          color:var(--muted);
        }

        .section-head{
          max-width:880px;
          margin-bottom:24px;
        }

        .section-head h2{
          margin:0 0 12px;
          font-family:Poppins,Inter,system-ui;
          font-weight:900;
          font-size:40px;
          line-height:1.08;
          letter-spacing:-.02em;
          color:var(--text);
        }

        .section-head p{
          margin:0;
          color:var(--muted);
          font-size:17px;
          line-height:1.74;
        }

            .consultoria-grid{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:22px;
      margin-top:26px;
    }

    .consultoria-card{
      background:#ffffff;
      border-radius:24px;
      padding:24px;
      border:1px solid var(--cardBorder);
      box-shadow:0 18px 50px rgba(15,23,42,.08);
    }

    .consultoria-card h3{
      margin:0 0 12px;
      font-family:Poppins,Inter,system-ui;
      font-size:24px;
      line-height:1.12;
      font-weight:800;
      color:var(--text);
    }

    .consultoria-card p{
      margin:0;
      color:var(--muted);
      line-height:1.72;
      font-size:15px;
    }

    .consultoria-card p + p{
      margin-top:12px;
    }

        .about-grid{
          display:grid;
          grid-template-columns:1fr 1fr;
          gap:22px;
        }

        .about-box{
          background:#ffffff;
          border-radius:24px;
          padding:26px;
          border:1px solid var(--cardBorder);
          box-shadow:0 18px 50px rgba(15,23,42,.08);
        }

        .about-box h3{
          margin:0 0 12px;
          font-family:Poppins,Inter,system-ui;
          font-size:28px;
          line-height:1.12;
          font-weight:900;
          color:var(--text);
        }

        .about-box p{
          margin:0 0 12px;
          color:var(--muted);
          line-height:1.75;
          font-size:15px;
        }

        .links-list{
          margin-top:10px;
          display:grid;
          gap:12px;
        }

        .link-row{
          display:flex;
          align-items:center;
          gap:14px;
          padding:15px 16px;
          border-radius:18px;
          background:linear-gradient(180deg,#fff,#f8fafc);
          border:1px solid rgba(0,0,0,.08);
        }

        .link-row img{
          width:28px;
          height:28px;
          object-fit:contain;
          display:block;
          flex:0 0 auto;
        }

        .link-row div{
          display:flex;
          flex-direction:column;
          gap:3px;
        }

        .link-row strong{
          font-size:15px;
          font-weight:800;
          color:var(--text);
        }

        .link-row a,
        .link-row span{
          font-size:14px;
          line-height:1.5;
          color:var(--muted);
          word-break:break-word;
        }

        .featured{
          display:grid;
          grid-template-columns:1.04fr .96fr;
          gap:22px;
          align-items:stretch;
        }

        .video-panel,
        .summary-panel{
          background:#ffffff;
          border-radius:24px;
          border:1px solid var(--cardBorder);
          box-shadow:0 24px 60px rgba(15,23,42,.10);
          overflow:hidden;
        }

        .video-content,
        .summary-content{
          padding:24px;
        }

        .video-content h3,
        .summary-content h3{
          margin:0 0 10px;
          font-family:Poppins,Inter,system-ui;
          font-size:28px;
          line-height:1.12;
          font-weight:900;
          color:var(--text);
        }

        .video-content p,
        .summary-content p{
          margin:0 0 12px;
          color:var(--muted);
          line-height:1.75;
          font-size:15px;
        }

        .thumb{
  width:100%;
  display:block;
  aspect-ratio:16/9;
  height:auto;
  border:0;
  border-top:1px solid rgba(0,0,0,.06);
  border-bottom:1px solid rgba(0,0,0,.06);
}

        .video-actions{
          margin-top:16px;
          display:flex;
          gap:12px;
          flex-wrap:wrap;
        }

                .summary-list{
          display:grid;
          gap:12px;
          margin-top:14px;
        }

        .video-item{
          display:flex;
          align-items:center;
          gap:16px;
          padding:14px;
          border-radius:18px;
          background:linear-gradient(180deg,#fff,#f8fafc);
          border:1px solid rgba(0,0,0,.08);
          text-decoration:none;
          transition:transform .12s ease, box-shadow .12s ease;
        }

        .video-item:hover{
          transform:translateY(-2px);
          box-shadow:0 10px 30px rgba(0,0,0,.10);
        }

        .video-item img{
          width:120px;
          height:70px;
          object-fit:cover;
          border-radius:10px;
          display:block;
          flex:0 0 auto;
        }

        .video-info{
          display:flex;
          align-items:center;
        }

        .video-info strong{
          display:block;
          font-size:16px;
          font-weight:800;
          color:var(--text);
          line-height:1.4;
        }

        .bridge{
          border-radius:0;
          overflow:hidden;
          border:1px solid rgba(255,255,255,.16);
          box-shadow:0 28px 70px rgba(15,23,42,.16);
          background:
            radial-gradient(900px 260px at 15% 20%, rgba(255,255,255,.14), transparent 60%),
            radial-gradient(900px 260px at 85% 70%, rgba(255,255,255,.10), transparent 62%),
            linear-gradient(135deg, var(--ready1), var(--ready2));
          color:#ffffff;
        }

        .bridge-inner{
          display:grid;
          grid-template-columns:1.08fr .92fr;
          gap:24px;
          align-items:center;
          padding:36px 30px;
        }

        .bridge h2{
          margin:0 0 12px;
          font-family:Poppins,Inter,system-ui;
          font-size:40px;
          line-height:1.08;
          font-weight:900;
          letter-spacing:-.02em;
        }

        .bridge p{
          margin:0;
          color:rgba(255,255,255,.92);
          font-size:17px;
          line-height:1.74;
        }

        .bridge-actions{
          margin-top:20px;
          display:flex;
          gap:12px;
          flex-wrap:wrap;
        }

        .bridge-side{
          display:grid;
          gap:14px;
        }

        .bridge-point{
          background:rgba(255,255,255,.12);
          border:1px solid rgba(255,255,255,.18);
          border-radius:20px;
          padding:16px 18px;
        }

        .bridge-point strong{
          display:flex;
          align-items:center;
          gap:12px;
          margin-bottom:6px;
          font-size:16px;
          font-weight:800;
        }

        .bridge-point strong img{
          width:34px;
          height:34px;
          object-fit:contain;
          display:block;
          flex:0 0 auto;
          background:#ffffff;
          border-radius:10px;
          padding:4px;
        }

        .bridge-point span{
          display:block;
          color:rgba(255,255,255,.90);
          font-size:14px;
          line-height:1.65;
        }

        footer{
          padding:42px 0 32px;
        }

        .footer{
          margin-top:8px;
          padding-top:22px;
          border-top:1px solid rgba(16,35,39,.10);
          display:flex;
          justify-content:space-between;
          align-items:center;
          gap:16px;
          flex-wrap:wrap;
          color:#5a7378;
          font-size:13px;
          font-weight:700;
        }

        .footer-links{
          display:flex;
          align-items:center;
          gap:12px;
          flex-wrap:wrap;
        }

        /* ===== LIBRERÍA DOCUMENTOS ===== */

.library-shell{
  background:#ffffff;
  border-radius:24px;
  border:1px solid var(--cardBorder);
  box-shadow:0 18px 50px rgba(15,23,42,.08);
  overflow:hidden;
}

.library-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:16px 20px;
  border-bottom:1px solid #e5e7eb;
  font-weight:800;
  gap:16px;
}

.library-top-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

.library-top-download{
  background:#ffffff;
  color:#1f2937;
  border:1px solid #d1d5db;
  padding:9px 16px;
  border-radius:10px;
  cursor:pointer;
  font-weight:700;
}

.library-top-download:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.library-note{
  font-size:12px;
  color:var(--muted);
}

.library-table{
  width:100%;
}

.library-row{
  display:grid;
  grid-template-columns: 52px 1fr 120px;
  padding:14px 20px;
  align-items:center;
  border-bottom:1px solid #f1f5f9;
}

/* Alineación de iconos y checkboxes en la segunda columna */
.library-file-content {
  display: flex;
  align-items: center;
  gap: 10px; /* Espacio entre checkbox y texto */
}

.library-check-cell {
  display: flex;
  align-items: center;
  justify-content: center; /* Centra la flecha en la primera columna */
  padding-left: 0;
}

.library-row.header{
  background:#f8fafc;
  font-weight:800;
}

.library-check-cell{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding-left:20px;
}

.library-folder-row{
  cursor:pointer;
  user-select:none;
}

.library-folder-name{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:700;
}

.library-folder-arrow{
  display:inline-block;
  width:16px;
}

.library-file-link{
  color:#0f3b66;
  text-decoration:none;
}

.library-file-link:hover{
  text-decoration:underline;
}

.library-file-hidden{
  display:none;
}

        @media(max-width:1100px){
          .hero-body,
          .about-grid,
          .featured,
          .bridge-inner{
            grid-template-columns:1fr;
          }

          .grid-3{
            grid-template-columns:1fr 1fr;
          }
        }

        @media(max-width:860px){
          nav{display:none}
          h1{font-size:42px}
        }

        @media(max-width:640px){
          .container{
            padding:0 16px;
          }

          .header{
            min-height:auto;
            padding:12px 0 14px;
            flex-wrap:wrap;
            align-items:center;
          }

          .brand{
            gap:10px;
          }

          .brand-badge{
            width:44px;
            height:44px;
            padding:5px;
          }

          .brand-title{
            font-size:17px;
          }

          .brand-sub{
            font-size:11px;
          }

          .grid-3{
            grid-template-columns:1fr;
          }

          section{
            padding:56px 0;
          }

          .hero{
            padding:24px 0 20px;
          }

          .hero-shell{
            border-radius:22px;
          }

          .hero-top{
            padding:18px 16px 10px;
          }

          .hero-logo-box{
            padding:10px 12px;
            border-radius:18px;
          }

          .hero-body{
            padding:0 16px 20px;
            gap:18px;
            grid-template-columns:1fr;
          }

          .eyebrow{
            width:100%;
            justify-content:center;
            text-align:center;
            line-height:1.4;
            padding:10px 12px;
          }

          h1{
            font-size:32px;
            line-height:1.06;
            margin:14px 0 12px;
          }

          .hero p{
            font-size:16px;
            line-height:1.65;
          }

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

          .section-head h2,
          .bridge h2{
            font-size:28px;
            line-height:1.12;
          }

          .section-head p,
          .bridge p{
            font-size:15px;
            line-height:1.65;
          }

          .hero-actions,
          .video-actions,
          .bridge-actions{
            gap:10px;
          }

          .hero-actions .btn,
          .video-actions .btn,
          .bridge-actions .btn{
            width:100%;
          }

          .hero-card,
          .about-box,
          .consultoria-card,
          .video-content,
          .summary-content,
          .bridge-point{
            padding:18px;
          }

          .hero-card h3,
          .video-content h3,
          .summary-content h3,
          .consultoria-card h3{
            font-size:22px;
          }

          .about-box h3{
            font-size:24px;
          }

          .about-box p,
          .hero-card p,
          .video-content p,
          .summary-content p,
          .consultoria-card p{
            font-size:14px;
            line-height:1.65;
          }

          .about-grid,
          .featured,
          .bridge-inner,
          .consultoria-grid{
            grid-template-columns:1fr;
            gap:16px;
          }

          .bridge-inner{
            padding:22px 16px;
          }

          .hero-link{
            padding:12px 14px;
            gap:12px;
          }

          .hero-link span{
            font-size:14px;
            line-height:1.4;
          }

          .link-row{
            padding:12px 14px;
            align-items:flex-start;
          }

          .link-row strong{
            font-size:14px;
          }

          .link-row a,
          .link-row span{
            font-size:13px;
            line-height:1.45;
          }

          .video-item{
            gap:12px;
            padding:12px;
            align-items:flex-start;
          }

          .video-item img{
            width:96px;
            height:60px;
          }

          .video-info strong{
            font-size:14px;
            line-height:1.35;
          }

          .library-shell{
            border-radius:18px;
          }

          .library-header{
            padding:14px 14px;
            align-items:flex-start;
            flex-direction:column;
          }

          .library-top-actions{
            width:100%;
            justify-content:space-between;
          }

          .library-top-download{
            padding:10px 14px;
          }

          .library-table{
            overflow-x:auto;
          }

          .library-row{
            grid-template-columns:40px minmax(220px,1fr) 80px;
            padding:12px 14px;
            font-size:13px;
          }

          .library-check-cell{
            padding-left:0;
          }

          .library-file-content{
            min-width:0;
            gap:8px;
          }

          .library-file-link{
            word-break:break-word;
            overflow-wrap:anywhere;
            line-height:1.4;
          }

          .footer{
            justify-content:center;
            text-align:center;
            gap:10px;
          }

          .footer-links{
            justify-content:center;
          }
        }