
    :root {
        --home-ink: #12303a;
        --home-ink-2: #1c4653;
        --home-sun: #ffb627;
        --home-mist: #eef3f4;
        --home-line: #d9e2e5;
    }
    .home-hero { background: #0078a0 ; color: #fff; border-radius: 1.5rem; overflow: hidden; }
    .home-hero h1 { font-size: clamp(2rem, 5vw, 3.6rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.05; }
    .home-hero .lead { color: #c5d6db; max-width: 34ch; }
    .btn-sun { background: var(--home-sun); color: var(--home-ink); font-weight: 700; border: 0; }
    .btn-sun:hover, .btn-sun:focus-visible { background: #ffc552; color: var(--home-ink); }
    .btn-ghost { border: 1px solid rgba(255,255,255,.4); color: #fff; }
    .btn-ghost:hover { background: rgba(255,255,255,.1); color: #fff; }

    /* Mosaico de produtos no hero */
    .hero-mosaic { display: grid; grid-template-columns: 1.2fr 1fr; grid-template-rows: 1fr 1fr; gap: .75rem; height: 100%; min-height: 320px; }
    .hero-mosaic a { position: relative; display: block; border-radius: 1rem; overflow: hidden; background: var(--home-ink-2); }
    .hero-mosaic a:first-child { grid-row: span 2; }
    .hero-mosaic img { width: 100%; height: 100%; object-fit: cover; }
    .hero-mosaic span { position: absolute; left: .6rem; bottom: .6rem; background: #fff; color: var(--home-ink);
        font-size: .8rem; font-weight: 600; padding: .2rem .6rem; border-radius: 99px; }

    /* Benefícios */
    .perk { display: flex; gap: .75rem; align-items: center; }
    .perk i { width: 2.5rem; height: 2.5rem; flex: none; display: grid; place-items: center; border-radius: 50%;
        background: var(--home-mist); color: var(--home-ink); }

    /* Categorias */
    .cat-tile { display: block; position: relative; aspect-ratio: 4 / 3; border-radius: 1rem; overflow: hidden;
        background: var(--home-mist); color: var(--home-ink); text-decoration: none; border: 1px solid var(--home-line); }
    .cat-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
    .cat-tile:hover img { transform: scale(1.04); }
    .cat-tile .cat-name { position: absolute; left: 0; right: 0; bottom: 0; padding: .75rem 1rem; font-weight: 700;
        background: linear-gradient(transparent, rgba(18,48,58,.85)); color: #fff; }
    .cat-tile .cat-fallback { display: grid; place-items: center; height: 100%; font-weight: 700; padding: 1rem; text-align: center; }

    /* Cabeçalho de secção */
    .sec-head { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.25rem; }
    .sec-head h2 { font-weight: 800; letter-spacing: -.01em; margin: 0; }

    /* Banner de promoções */
    .promo-band { background: var(--home-sun); border-radius: 1.5rem; color: var(--home-ink); }

    /* Newsletter */
    .news-box { background: var(--home-mist); border-radius: 1.5rem; }

    @media (prefers-reduced-motion: reduce) { .cat-tile img { transition: none; } }
