/* =========================================================
   HERO VISUAL CONTRACT — FINAL
   4 hero pages:
   HOME / PRAIAS / SINGLE PRAIA / SINGLE EVENTO

   Alignment:
   - Home: centered
   - Praias archive: centered
   - Single Praia: centered
   - Single Evento: left aligned (intentional)

   Everything else is unified:
   outer proportion, type scale, weight, line height,
   rhythm, contrast, badge, meta and breadcrumb.
   ========================================================= */

:root{
    --hero-height-desktop:430px;
    --hero-height-mobile:320px;
    --hero-ink-white:#fff;
    --hero-white-88:rgba(255,255,255,.88);
    --hero-white-72:rgba(255,255,255,.72);
    --hero-white-56:rgba(255,255,255,.56);
    --hero-title-size:clamp(42px,4.5vw,58px);
    --hero-title-weight:750;
    --hero-title-line:.98;
    --hero-title-track:-.04em;
    --hero-body-size:15px;
    --hero-body-line:1.42;
    --hero-meta-size:13.5px;
    --hero-meta-line:1.35;
    --hero-gutter:40px;
}

/* -------- Outer proportion: identical -------- */
html body .guia-hero.guia-hero--home,
html body .guia-hero.guia-hero--archive,
html body .guia-hero.guia-hero--single,
html body .guia-hero.guia-hero--event{
    height:var(--hero-height-desktop)!important;
    min-height:var(--hero-height-desktop)!important;
    max-height:var(--hero-height-desktop)!important;
    width:100%!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
}

/* -------- Unified image behavior -------- */
html body .guia-hero.guia-hero--home > .ggp-v25-hero-image,
html body .guia-hero.guia-hero--archive > .guia-praias-hero__media,
html body .guia-hero.guia-hero--single > .sp-hero-bg,
html body .guia-hero.guia-hero--event > .gevento-hero__media{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
}

html body .guia-hero.guia-hero--home > .ggp-v25-hero-image img,
html body .guia-hero.guia-hero--archive > .guia-praias-hero__media img,
html body .guia-hero.guia-hero--single > .sp-hero-bg img,
html body .guia-hero.guia-hero--event > .gevento-hero__media img{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    display:block!important;
}

/* -------- Unified title -------- */
html body .guia-hero :is(
    .ggp-v25-hero-content h1,
    .guia-praias-hero__copy h1,
    .sp-hero-title,
    .gevento-hero__title
){
    font-size:var(--hero-title-size)!important;
    font-weight:var(--hero-title-weight)!important;
    line-height:var(--hero-title-line)!important;
    letter-spacing:var(--hero-title-track)!important;
    color:var(--hero-ink-white)!important;
    margin:0!important;
}

/* -------- Unified secondary text -------- */
html body .guia-hero :is(
    .ggp-v25-hero-content > p,
    .guia-praias-lead
){
    font-size:var(--hero-body-size)!important;
    line-height:var(--hero-body-line)!important;
    font-weight:400!important;
    color:var(--hero-white-88)!important;
    margin:12px auto 0!important;
}

/* -------- HOME -------- */
html body .guia-hero.guia-hero--home{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
}

html body .guia-hero.guia-hero--home .ggp-v25-hero-content{
    width:min(860px,calc(100% - 80px))!important;
    max-width:860px!important;
    margin:0 auto!important;
    padding:0!important;
    text-align:center!important;
}

/* -------- PRAIAS archive -------- */
html body .guia-hero.guia-hero--archive{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
}

html body .guia-hero.guia-hero--archive .guia-praias-hero__content{
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
}

html body .guia-hero.guia-hero--archive .guia-praias-hero__inner{
    width:min(920px,calc(100% - 80px))!important;
    max-width:920px!important;
    margin:0 auto!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    text-align:center!important;
}

html body .guia-hero.guia-hero--archive .guia-praias-hero__copy{
    width:100%!important;
    max-width:780px!important;
    margin:0 auto!important;
    text-align:center!important;
}

html body .guia-hero.guia-hero--archive .guia-praias-lead{
    margin:12px auto 22px!important;
}

html body .guia-hero.guia-hero--archive .guia-praias-hero__tools{
    width:min(760px,100%)!important;
    max-width:760px!important;
    margin:0 auto!important;
    text-align:center!important;
}

/* -------- SINGLE PRAIA -------- */
html body .guia-hero.guia-hero--single{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
}

html body .guia-hero.guia-hero--single .sp-hero-content{
    width:min(920px,calc(100% - 80px))!important;
    max-width:920px!important;
    height:auto!important;
    margin:0 auto!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
}

html body .guia-hero.guia-hero--single .sp-hero-location{
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    margin:10px auto 10px!important;
    color:var(--hero-white-72)!important;
    font-size:var(--hero-meta-size)!important;
    line-height:var(--hero-meta-line)!important;
}

html body .guia-hero.guia-hero--single .sp-hero-meta{
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    gap:14px!important;
    margin:0 auto 16px!important;
    color:var(--hero-white-72)!important;
    font-size:var(--hero-meta-size)!important;
    line-height:var(--hero-meta-line)!important;
}

html body .guia-hero.guia-hero--single .sp-hero-actions{
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    gap:8px!important;
    margin:0 auto!important;
}

/* -------- SINGLE EVENTO — LEFT ALIGNED BY DESIGN -------- */
html body .guia-hero.guia-hero--event{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:left!important;
}

html body .guia-hero.guia-hero--event .gevento-hero__container{
    width:min(1200px,calc(100% - 80px))!important;
    max-width:1200px!important;
    height:auto!important;
    margin:0 auto!important;
    padding:0!important;
    display:block!important;
    text-align:left!important;
}

html body .guia-hero.guia-hero--event .gevento-hero__content{
    width:min(760px,62%)!important;
    max-width:760px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    text-align:left!important;
}

html body .guia-hero.guia-hero--event .gevento-hero__badge{
    margin:0 0 14px!important;
    text-align:left!important;
}

html body .guia-hero.guia-hero--event .gevento-hero__badge-item{
    display:inline-flex!important;
    min-height:30px!important;
    padding:0 12px!important;
    align-items:center!important;
    border:1px solid rgba(255,255,255,.30)!important;
    border-radius:999px!important;
    background:rgba(15,23,42,.42)!important;
    color:#fff!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:600!important;
    letter-spacing:.02em!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
}

html body .guia-hero.guia-hero--event .gevento-hero__title{
    max-width:720px!important;
    margin:0 0 14px!important;
    text-align:left!important;
}

html body .guia-hero.guia-hero--event .gevento-hero__meta{
    display:flex!important;
    justify-content:flex-start!important;
    align-items:center!important;
    gap:14px!important;
    flex-wrap:wrap!important;
    margin:0!important;
    color:var(--hero-white-72)!important;
    font-size:var(--hero-meta-size)!important;
    line-height:var(--hero-meta-line)!important;
}

html body .guia-hero.guia-hero--event .gevento-hero__meta-item{
    display:inline-flex!important;
    align-items:center!important;
    gap:7px!important;
    color:var(--hero-white-72)!important;
    font-size:inherit!important;
    line-height:inherit!important;
}

html body .guia-hero.guia-hero--event .gevento-hero__meta-icon{
    color:var(--hero-white-72)!important;
    opacity:.95!important;
}

/* -------- Breadcrumb contract -------- */
html body .guia-hero-breadcrumb,
html body .sp-breadcrumb{
    width:100%!important;
    min-height:40px!important;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
    border:0!important;
    box-sizing:border-box!important;
    font-size:12px!important;
    line-height:1.4!important;
    color:#7b8794!important;
}

html body .guia-hero-breadcrumb .gevento-breadcrumb__inner,
html body .sp-breadcrumb .sp-wrap{
    width:min(1200px,calc(100% - 80px))!important;
    max-width:1200px!important;
    min-height:40px!important;
    margin:0 auto!important;
    display:flex!important;
    align-items:center!important;
    gap:0!important;
    box-sizing:border-box!important;
}

html body .guia-hero-breadcrumb a,
html body .sp-breadcrumb a{
    color:#7b8794!important;
    font-size:12px!important;
    font-weight:400!important;
    text-decoration:none!important;
}

html body .guia-hero-breadcrumb span[aria-current="page"],
html body .sp-breadcrumb li[aria-current="page"]{
    color:#405064!important;
    font-weight:500!important;
}

html body .guia-hero-breadcrumb span[aria-hidden="true"],
html body .sp-breadcrumb li+li::before{
    color:#c6ced8!important;
    margin:0 9px!important;
}

/* -------- Mobile -------- */
@media(max-width:780px){
    :root{
        --hero-height-desktop:320px;
        --hero-title-size:clamp(34px,9vw,46px);
        --hero-gutter:24px;
    }

    html body .guia-hero :is(
        .ggp-v25-hero-content,
        .guia-praias-hero__inner,
        .sp-hero-content,
        .gevento-hero__container
    ){
        width:calc(100% - 48px)!important;
        max-width:none!important;
    }

    html body .guia-hero.guia-hero--event .gevento-hero__content{
        width:100%!important;
        max-width:720px!important;
    }

    html body .guia-hero.guia-hero--event .gevento-hero__meta{
        gap:10px!important;
    }

    html body .guia-hero-breadcrumb .gevento-breadcrumb__inner,
    html body .sp-breadcrumb .sp-wrap{
        width:calc(100% - 48px)!important;
    }
}

@media(max-width:520px){
    html body .guia-hero :is(
        .ggp-v25-hero-content,
        .guia-praias-hero__inner,
        .sp-hero-content,
        .gevento-hero__container
    ){
        width:calc(100% - 32px)!important;
    }

    html body .guia-hero.guia-hero--event .gevento-hero__content{
        width:100%!important;
    }

    html body .guia-hero-breadcrumb .gevento-breadcrumb__inner,
    html body .sp-breadcrumb .sp-wrap{
        width:calc(100% - 32px)!important;
    }
}