/* =====================================================
   ===== STRYV4 HOMEPAGE CARD · ADVERTISE HERE        =====
   ===== v1 · Tag: STR                                =====
   ===== file: card-advert_STR.css                    =====
   =====================================================
   Extracted from batch-01.css for the Postcard CPT.
   The .hp-card-advert block was removed from batch-01.css
   so it never loads twice.

   DEPENDENCIES (must also be present on the page):
     - core-canvas.css  (theme Section 8 — the frame)
     - sunburst.css     (the rotating-ray engine; shared module)
   This file only carries the advert-specific layout + the
   oversized height override.

   NOTE: this card is intentionally OVERSIZED (768px tall, not
   the standard 512). The .hp-postcard-canvas.hp-card-advert
   double-class beats the core-canvas height per the homepage
   -cards spec. */


/* CodeNumber B1.AD.1 — Size Override (oversized advert portal) */
.hp-postcard-canvas.hp-card-advert {
    height: 768px;
    max-width: 1536px;
}

/* CodeNumber B1.AD.1a — CPT structural fix.
   In the CPT, the plugin wraps the card's inner HTML in a
   .hp-postcard-content box that core-canvas gives position:relative,
   padding:2.5rem and overflow-y:auto. The sunburst layers are
   position:absolute and must anchor to the FULL card and not be
   clipped, so for this card we strip that box back to a flush,
   non-clipping, non-padded layer. The .advert-layout inside still
   centres its own content. Without this the sunburst convergence
   point shifts off-centre and the 3000px ray layer can trigger a
   scrollbar. */
.hp-postcard-canvas.hp-card-advert .hp-postcard-content {
    position: static;   /* let the layers anchor to the .hp-sunburst canvas */
    padding: 0;
    overflow: visible;
}

/* CodeNumber B1.AD.2 — Content Layout (centred CTA) */
.hp-card-advert .advert-layout {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    gap: 1.5rem;
    position: relative;
    z-index: 10;
}

/* CodeNumber B1.AD.3 — Headline */
.hp-card-advert .advert-headline {
    font-size: 3.5rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.15;
    margin: 0;
    color: inherit;
    transition: all 0.4s ease;
}

/* CodeNumber B1.AD.4 — Subtext */
.hp-card-advert .advert-subtext {
    font-size: 1.3rem;
    line-height: 1.6;
    max-width: 600px;
    margin: 0;
    color: inherit;
    transition: all 0.4s ease;
}

/* CodeNumber B1.AD.5 — Badge / Eyebrow Label */
.hp-card-advert .advert-badge {
    display: inline-block;
    padding: 0.4rem 1.2rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 100px;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: inherit;
    transition: all 0.4s ease;
}

/* CodeNumber B1.AD.6 — Mobile Responsive */
@media (max-width: 768px) {
    .hp-postcard-canvas.hp-card-advert {
        height: 700px;
    }
    .hp-card-advert .advert-headline {
        font-size: 2.2rem;
    }
    .hp-card-advert .advert-subtext {
        font-size: 1.05rem;
        padding: 0 1rem;
    }
}

@media (max-width: 480px) {
    .hp-postcard-canvas.hp-card-advert {
        height: 550px;
    }
    .hp-card-advert .advert-headline {
        font-size: 1.7rem;
    }
}