    :root {
      --lila-1:#f5e9ff;
      --lila-2:#ead6ff;
      --lila-3:#cbb3ff;
      --morado:#b9a9e3;
      --morado-oscuro:#8d5bc8; /* Color barra superior */
      --texto:#2b2b2b;
      --fondo:#ffffff;
      --card-shadow:0 6px 18px rgba(124,77,255,0.12);
      font-family: "Inter", "Poppins", "Segoe UI", Roboto, sans-serif;
    }

    body {
      margin:0;
      background:linear-gradient(180deg,var(--lila-1),var(--lila-2));
      color:var(--texto);
      line-height:1.6;
      scroll-behavior:smooth;
    }

    /* HEADER */
    header {
      background:var(--morado-oscuro);
      color:white;
      padding:14px 20px;
      box-shadow:0 3px 8px rgba(0,0,0,0.15);
      position:sticky;
      top:0;
      z-index:10;
    }

    .header-inner {
      max-width:1100px;
      margin:0 auto;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      flex-wrap:wrap;
    }

    .logo {
      width:52px;
      height:52px;
      border-radius:12px;
      background:white;
      color:var(--morado-oscuro);
      font-weight:700;
      font-size:20px;
      display:flex;
      align-items:center;
      justify-content:center;
      flex-shrink:0;
    }

    .header-text {
      flex:1;
      min-width:190px;
    }

    h1 {
      margin:0;
      font-size:20px;
      font-weight:600;
    }

    .header-text p {
      margin:2px 0 0;
      font-size:13px;
      opacity:.95;
    }

    .whatsapp-btn {
      background:#25d366;
      color:white;
      padding:9px 16px;
      border-radius:999px;
      font-weight:600;
      text-decoration:none;
      display:inline-flex;
      align-items:center;
      gap:8px;
      transition:background .25s, transform .2s, box-shadow .2s;
      flex-shrink:0;
      font-size:14px;
      box-shadow:0 4px 10px rgba(0,0,0,0.18);
      white-space:nowrap;
    }

    .whatsapp-btn i {
      font-size:18px;
    }

    .whatsapp-btn:hover {
      background:#20b857;
      transform:translateY(-2px);
      box-shadow:0 6px 14px rgba(0,0,0,0.22);
    }

    /* MAIN */
    main {
      max-width:950px;
      margin:30px auto 40px;
      background:var(--fondo);
      border-radius:14px;
      box-shadow:var(--card-shadow);
      padding:26px 26px 30px;
      animation:fadeIn 0.6s ease;
    }

    h2 {
      font-size:18px;
      color:var(--morado);
      margin-top:24px;
      margin-bottom:8px;
      border-left:5px solid var(--morado);
      padding-left:10px;
      transition:0.3s;
    }

    h2:hover {
      color:var(--morado-oscuro);
      transform:translateX(3px);
    }

    p.muted { color:#555; margin:8px 0; }
    ul { margin:8px 0 14px 25px; padding-left:0; }
    ul li { margin-bottom:6px; }

    .badge {
      display:inline-block;
      padding:6px 10px;
      border-radius:999px;
      background:var(--lila-2);
      color:var(--morado);
      font-weight:600;
      font-size:15px;
      margin-bottom:5px;
    }

    .back-btn {
      display:inline-block;
      background:var(--morado);
      color:white;
      padding:10px 20px;
      border-radius:8px;
      text-decoration:none;
      margin-top:20px;
      font-weight:600;
      transition:background 0.3s, transform 0.2s;
      font-size:14px;
    }

    .back-btn:hover {
      background:var(--morado-oscuro);
      transform:translateY(-2px);
    }

    footer {
      margin-top:24px;
      padding-top:16px;
      border-top:1px solid #eee;
      text-align:center;
      font-size:13px;
      color:#666;
    }

    footer small {
      display:block;
      margin-top:4px;
    }

    @keyframes fadeIn {
      from { opacity:0; transform:translateY(10px); }
      to { opacity:1; transform:translateY(0); }
    }

    /* RESPONSIVE */
    @media (max-width:768px) {
      .header-inner {
        flex-direction:column;
        align-items:flex-start;
      }

      h1 {
        font-size:18px;
      }

      .whatsapp-btn {
        margin-top:6px;
      }

      main {
        margin:18px;
        padding:18px 16px 22px;
      }
    }

    @media (max-width:480px) {
      .logo {
        width:44px;
        height:44px;
        font-size:17px;
      }

      h1 {
        font-size:17px;
      }

      .header-text p {
        font-size:12px;
      }

      .whatsapp-btn {
        font-size:13px;
        padding:8px 14px;
      }
    }
