header {
        background: linear-gradient(to right, #000080, #001a4d);
        color: #fff;
        padding: 100px 20px 60px;
        text-align: center;
        position: relative;
        overflow: hidden;
    }
    header h1 {
        font-size: 3rem;
        margin-bottom: 20px;
        display: inline-block;
    }
    header h1 .s-dorada { color: #ffcc00; }
    header p {
        font-size: 1.2rem;
        max-width: 700px;
        margin: 0 auto 30px;
    }
    header .cta {
        background: #ffcc00;
        color: #000080;
        padding: 15px 30px;
        border-radius: 50px;
        font-weight: bold;
        text-decoration: none;
        transition: 0.3s;
    }
    header .cta:hover { background: #e6b800; }

    /* --- Nubes decorativas --- */
    .cloud {
        position: absolute;
        border-radius: 50%;
        opacity: 0.4;
    }
    .cloud.blue { width: 120px; height: 60px; background: #00cccc; top: 50px; left: -60px; }
    .cloud.dark { width: 100px; height: 50px; background: #000080; top: 100px; right: -50px; }

    /* --- Sección DIMWS en acción --- */
    section.cases {
        padding: 80px 20px;
        text-align: center;
    }
    section.cases h2 { font-size: 2rem; margin-bottom: 40px; }
    .case-cards {
        display: flex;
        justify-content: center;
        gap: 20px;
        flex-wrap: wrap;
    }
    .case-card {
        background: #fff;
        padding: 30px;
        border-radius: 15px;
        width: 280px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        transition: transform 0.3s;
    }
    .case-card:hover { transform: translateY(-5px); }
    .case-card h3 { margin-bottom: 15px; color: #000080; }
    .case-card p { color: #333; font-size: 0.95rem; }

    /* --- Sección Planes --- */
    section.plans { padding: 80px 20px; text-align: center; background: #e6f7ff; }
    section.plans h2 { font-size: 2rem; margin-bottom: 40px; }
    .plan-cards {
        display: flex;
        justify-content: center;
        gap: 20px;
        flex-wrap: wrap;
    }
    .plan-card {
        background: #fff;
        border-radius: 15px;
        padding: 30px;
        width: 260px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        transition: transform 0.3s;
    }
    .plan-card.pro { border: 2px solid #ffcc00; }
    .plan-card h3 { margin-bottom: 15px; }
    .plan-card .price { font-size: 1.5rem; margin-bottom: 15px; color: #000080; }
    .plan-card ul { text-align: left; margin-bottom: 20px; }
    .plan-card ul li { margin-bottom: 8px; }
    .plan-card a.cta { display: inline-block; background: #000080; color: #ffcc00; padding: 10px 20px; border-radius: 30px; text-decoration: none; font-weight: bold; }
    .plan-card a.cta:hover { background: #001a4d; }

    /* --- Soporte / Help --- */
    section.support { padding: 80px 20px; text-align: center; }
    section.support h2 { font-size: 2rem; margin-bottom: 40px; }
    .support-cards { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; }
    .support-card {
        background: #fff; padding: 25px; border-radius: 15px; width: 220px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }
    .support-card h3 { margin-bottom: 10px; color: #000080; }
    .support-card p { font-size: 0.9rem; color: #333; }

    /* --- Footer --- */
    footer { background: #000080; color: #fff; text-align: center; padding: 40px 20px; }
    footer a { color: #ffcc00; text-decoration: none; margin: 0 10px; }