/* ===================================
   FOTOS PAGE
   It! Wheel - Galeria de Fotos
   =================================== */

body.fotos-page {
    background-color: #EEF7F8 !important;
    min-height: 100vh;
}

/* Gradient covers top through visitantes section */
.fotos-page .blog-gradient-wrapper {
    background: linear-gradient(180deg, #C6EBF6 0%, #EEF7F8 100%) !important;
}

/* Keep gradient on bottom sections */
.fotos-page .section-banner-publicidade,
.fotos-page .section-parceiros {
    background: transparent !important;
}
.fotos-page .section-parceiros .bg2 {
    background-color: #D2EAEF !important;
}

/* =============================================
   INGRESSO BAR — sticky parity with institucional
   ============================================= */
.blog-ingresso-bar.is-stuck,
.blog-ingresso-bar.is-stuck {
    position: fixed;
    right: 0;
    z-index: 201;
    border-radius: 200px 0 0 200px;
    transform-origin: right center;
    transform: scaleX(0.82) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    will-change: transform, opacity;
}

.blog-ingresso-bar.is-stuck.is-stuck-active {
    transform: scaleX(1) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.blog-ingresso-bar.is-banner-hidden {
    transform-origin: right center;
    transform: scaleX(0.82) !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.blog-ingresso-bar.is-stuck-top {
    top: 15px;
    bottom: auto;
}

.blog-ingresso-bar.is-stuck-bottom {
    top: auto;
    bottom: var(--blog-mobile-ingresso-bottom-gap, 16px);
}

.blog-ingresso-bar .sticky-ingresso-label {
    color: #fff;
}



/* Linha invertida do banner — subir na página de fotos */
.fotos-page .blog-banner-linha {
    bottom: -186px;
    margin-right: -50px;
}


/* =============================================
   FOTOS CONTENT SECTION
   ============================================= */
.fotos-section {
    position: relative;
    z-index: 4;
    padding: 120px 0 1px;
}

.fotos-section .wrap {
    max-width: 1280px;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: relative;
}


/* Title */
.fotos-titulo {
    font-family: 'ClashDisplay', sans-serif !important;
    font-weight: 500;
    font-size: 40px;
    line-height: 100%;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #EC6608;
    margin: 0 0 50px;
}
.fotos-titulo  br.home-mobile-break {
    display: none;
}


/* =============================================
   FOTOS GRID — 3 columns
   ============================================= */
.fotos-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    max-width: 1280px;
    margin: 0 auto;
}

.fotos-grid-item {
    flex: 0 0 416px;
    display: flex;
    flex-direction: column;
}

/* Image card */
.fotos-grid-link {
    display: block;
    position: relative;
    width: 100%;
    height: 237px;
    border-radius: 20px;
    overflow: hidden;
}
.fotos-grid-link::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 20px;
    background: linear-gradient(305.41deg, #3D3A3A 0%, rgba(255, 255, 255, 0) 29.57%);
    pointer-events: none;
}
.fotos-grid-link img.fotos-grid-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    mix-blend-mode: multiply;
    border-radius: 20px;
    transition: transform 0.6s cubic-bezier(0.38, 0, 0.02, 1), filter 0.4s ease;
}
.fotos-grid-link:hover img.fotos-grid-img {
    transform: scale(1.05);
    filter: brightness(0.85);
}

/* Zoom icon */
.fotos-grid-zoom {
    position: absolute;
    bottom: 12px;
    right: 12px;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 2;
}
.fotos-grid-zoom img {
    width: 16px;
    height: 16px;
    display: block;
}

/* Photo title */
.fotos-grid-titulo {
    font-family: 'ClashDisplay', sans-serif !important;
    font-weight: 500;
    font-size: 22px;
    line-height: 33px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #EC6608;
    margin: 12px 0 40px;
    margin-left: 25px;
}


/* =============================================
   ASTRONAUTA + LINHA FOTOS
   ============================================= */
.fotos-deco-wrap {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 100vw;
    bottom: -40px;
    z-index: 1;
    pointer-events: none;
    overflow: visible;
}

.fotos-astronauta {
    position: absolute;
    left: calc((100vw - 1280px) / 2 - 350px);
    bottom: 180px;
    width: 395px;
    height: 493px;
    z-index: 3;
    pointer-events: none;
}
.fotos-astronauta img {
    width: 100%;
    height: auto;
    display: block;
    animation: astronaut-bob 3s ease-in-out infinite;
}

.fotos-linha {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    pointer-events: none;
}
.fotos-linha img {
    width: 100vw;
    min-width: 100vw;
    max-width: none;
    height: auto;
    display: block;
}

/* Clip-path reveal animations for decorative lines */
@keyframes fotosClipRevealLeftRight {
    0%   { clip-path: inset(0 100% 0 0); }
    100% { clip-path: inset(0 0% 0 0); }
}

.fotos-deco-wrap .fotos-linha img,
.fotos-visitantes-linha-wrap .fotos-linha img {
    clip-path: inset(0 100% 0 0);
}
.fotos-deco-wrap.is-revealed .fotos-linha img,
.fotos-visitantes-linha-wrap.is-revealed .fotos-linha img {
    animation: fotosClipRevealLeftRight 4s cubic-bezier(0.22, 1, 0.36, 1) 0.3s forwards;
}


/* Empty state */
.fotos-empty {
    text-align: center;
    padding: 60px 0;
    font-family: 'Exo', sans-serif;
    font-size: 18px;
    color: #858585;
}


/* =============================================
   FOTOS DOS VISITANTES — Section
   ============================================= */
.fotos-visitantes-section {
    position: relative;
    padding-bottom: 160px;
    margin-top: -160px;
}

.fotos-visitantes-astronauta {
    position: absolute;
    right: -200px;
    top: -160px;
  
    z-index: 10;
    pointer-events: none;
}
.fotos-visitantes-astronauta img {
    width: 100%;
    height: 100%;
    display: block;
    animation: astronaut-bob 3s ease-in-out infinite;
}

.fotos-visitantes-linha-wrap {
    position: absolute;
    left: 50%;
    bottom: -40px;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 100vw;
    pointer-events: none;
    overflow: visible;
}
.fotos-visitantes-linha-wrap .fotos-linha {
    position: relative;
    top: auto;
    width: 100%;
    height: 100%;
}
.fotos-visitantes-linha-wrap .fotos-linha img {
    width: 100vw;
    min-width: 100vw;
    max-width: none;
    height: auto;
    display: block;
}


/* =============================================
   RESPONSIVE — NOTEBOOK (≤1440px)
   ============================================= */
@media only screen and (max-width: 1440px) {

/* ===================================
   FOTOS PAGE — 1440px BREAKPOINT
   It! Wheel - Galeria de Fotos
   =================================== */

/*
   ESCALA APLICADA: 1440 / 1920 = 0.75
   Todos os valores dimensionais foram multiplicados por esse fator.
   Exceções: border-radius pequenos (≤8px) e valores de 1px mantidos.
*/

body.fotos-page {
    background-color: #EEF7F8 !important;
    min-height: 100vh;
}

/* Gradient covers top through visitantes section */
.fotos-page .blog-gradient-wrapper {
    background: linear-gradient(180deg, #C6EBF6 0%, #EEF7F8 100%) !important;
}

/* Keep gradient on bottom sections */
.fotos-page .section-banner-publicidade,
.fotos-page .section-parceiros {
    background: transparent !important;
}
.fotos-page .section-parceiros .bg2 {
    background-color: #D2EAEF !important;
}



/* Linha invertida do banner — subir na página de fotos
   Original: bottom: -207px → 1920 * 0.75 = -155px
   Original: margin-right: -50px → -38px
*/
.fotos-page .blog-banner-linha {
    bottom: -98px;
    margin-right: 0px;
       width: 318px;
    height: 321px; 
    z-index: -2;
}


/* =============================================
   FOTOS CONTENT SECTION
   ============================================= */
.fotos-section {
    position: relative;
    z-index: 4;
    padding: 90px 0 1px; /* 120px * 0.75 = 90px */
}

.fotos-section .wrap {
    max-width: 910px; /* 1280px * 0.711 = 910px */
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: relative;
}


/* Title
   font-size: 40px * 0.75 = 30px
   margin-bottom: 50px * 0.75 = 38px
*/
.fotos-titulo {
    font-family: 'ClashDisplay', sans-serif !important;
    font-weight: 500;
    font-size: 30px;
    line-height: 100%;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #EC6608;
    margin: 0 0 38px;
}


/* =============================================
   FOTOS GRID — 3 columns
   gap: 16px * 0.711 = 11px
   max-width: 1280px * 0.711 = 910px
   ============================================= */
.fotos-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 11px; /* 16px * 0.711 */
    max-width: 910px; /* 1280px * 0.711 */
    margin: 0 auto;
}

/* flex-basis: 416px * 0.711 = 296px */
.fotos-grid-item {
    flex: 0 0 296px;
    display: flex;
    flex-direction: column;
}

/* Image card
   height: 237px * 0.711 = 169px
   border-radius: 20px * 0.711 = 14px
*/
.fotos-grid-link {
    display: block;
    position: relative;
    width: 100%;
    height: 169px; /* 237px * 0.711 */
    border-radius: 14px; /* 20px * 0.711 */
    overflow: hidden;
}
.fotos-grid-link::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 14px; /* 20px * 0.711 */
    background: linear-gradient(305.41deg, #3D3A3A 0%, rgba(255, 255, 255, 0) 29.57%);
    pointer-events: none;
}
.fotos-grid-link img.fotos-grid-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    mix-blend-mode: multiply;
    border-radius: 14px; /* 20px * 0.711 */
    transition: transform 0.6s cubic-bezier(0.38, 0, 0.02, 1), filter 0.4s ease;
}
.fotos-grid-link:hover img.fotos-grid-img {
    transform: scale(1.05);
    filter: brightness(0.85);
}

/* Zoom icon
   bottom/right: 12px * 0.75 = 9px
   width/height: 16px * 0.75 = 12px
*/
.fotos-grid-zoom {
    position: absolute;
    bottom: 9px; /* 12px * 0.75 */
    right: 9px;  /* 12px * 0.75 */
    width: 12px; /* 16px * 0.75 */
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 2;
}
.fotos-grid-zoom img {
    width: 12px;  /* 16px * 0.75 */
    height: 12px;
    display: block;
}

/* Photo title
   font-size: 22px * 0.75 = 16.5px → arredondado para 17px
   line-height: 33px * 0.75 = 25px
   margin-top: 12px * 0.75 = 9px
   margin-bottom: 40px * 0.75 = 30px
   margin-left: 25px * 0.75 = 19px
*/
.fotos-grid-titulo {
    font-family: 'ClashDisplay', sans-serif !important;
    font-weight: 500;
    font-size: 17px;
    line-height: 25px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #EC6608;
    margin: 9px 0 30px;
    margin-left: 19px;
}


/* =============================================
   ASTRONAUTA + LINHA FOTOS
   ============================================= */
.fotos-deco-wrap {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    bottom: -30px; /* -40px * 0.75 */
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}

/*
   Posição do astronauta:
   left: calc((100vw - 1280px) / 2 - 350px) → calc((100vw - 960px) / 2 - 263px)
   bottom: 180px * 0.75 = 135px
   width: 395px * 0.75 = 296px
   height: 493px * 0.75 = 370px
*/
.fotos-astronauta {
    position: absolute;
    left: calc((100vw - 910px) / 2 - 213px);
    bottom: 135px;
    width: 230px;
    height: 280px;
    z-index: 3;
    pointer-events: none;
}
.fotos-astronauta img {
    width: 100%;
    height: auto;
    display: block;
    animation: astronaut-bob 3s ease-in-out infinite;
}

.fotos-linha {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    pointer-events: none;
}
.fotos-linha img {
    width: 100vw;
    min-width: 100vw;
    max-width: none;
    height: auto;
    display: block;
}

/* Clip-path reveal animations for decorative lines */
@keyframes fotosClipRevealLeftRight {
    0%   { clip-path: inset(0 100% 0 0); }
    100% { clip-path: inset(0 0% 0 0); }
}

.fotos-deco-wrap .fotos-linha img,
.fotos-visitantes-linha-wrap .fotos-linha img {
    clip-path: inset(0 100% 0 0);
}
.fotos-deco-wrap.is-revealed .fotos-linha img,
.fotos-visitantes-linha-wrap.is-revealed .fotos-linha img {
    animation: fotosClipRevealLeftRight 4s cubic-bezier(0.22, 1, 0.36, 1) 0.3s forwards;
}


/* Empty state */
.fotos-empty {
    text-align: center;
    padding: 45px 0; /* 60px * 0.75 */
    font-family: 'Exo', sans-serif;
    font-size: 14px; /* 18px * 0.75 = 13.5px → 14px */
    color: #858585;
}


/* =============================================
   FOTOS DOS VISITANTES — Section
   padding-bottom: 160px * 0.75 = 120px
   margin-top: -160px * 0.75 = -120px
   ============================================= */
.fotos-visitantes-section {
    position: relative;
    padding-bottom: 120px;
    margin-top: -120px;
}

.section-banner-publicidade.is-empty + .fotos-visitantes-section {
    margin-top: 0 !important;
}

/*
   right: -200px * 0.75 = -150px
   top: -160px * 0.75 = -120px
*/
.fotos-visitantes-astronauta {
    position: absolute;
    right: -140px;
    top: -125px;
  
    z-index: 10;
    pointer-events: none;
}
.fotos-visitantes-astronauta img {
     height: 215px;
    width: 173px;
    display: block;
    animation: astronaut-bob 3s ease-in-out infinite;
}

/*
   bottom: -40px * 0.75 = -30px
*/
.fotos-visitantes-linha-wrap {
    position: absolute;
    left: 50%;
    bottom: -30px;
    transform: translateX(-50%);
    width: 100vw;
    pointer-events: none;
    max-width: 100vw;
    overflow: visible;
}
.fotos-visitantes-linha-wrap .fotos-linha {
    position: relative;
    top: auto;
    width: 100%;
    height: 100%;
}
.fotos-visitantes-linha-wrap .fotos-linha img {
    width: 100vw;
    min-width: 100vw;
    max-width: none;
    height: auto;
    display: block;
}
}


/* =============================================
   RESPONSIVE — TABLET (≤1024px)
   Escala: 1024/1440 ≈ 0.711 (do notebook)
   ============================================= */
@media only screen and (max-width: 1024px) {

  /* ===================================
   FOTOS PAGE — 1024px BREAKPOINT
   Escala base: 1920 → 1024 (fator ≈ 0.533)
   =================================== */

@media (max-width: 1024px) {

    body.fotos-page {
        background-color: #EEF7F8 !important;
        min-height: 100vh;
    }

    /* Gradient covers top through visitantes section */
    .fotos-page .blog-gradient-wrapper {
        background: linear-gradient(180deg, #C6EBF6 0%, #EEF7F8 100%) !important;
    }

    /* Keep gradient on bottom sections */
    .fotos-page .section-banner-publicidade,
    .fotos-page .section-parceiros {
        background: transparent !important;
        margin-top: -30px !important;
    }
    .fotos-page .section-parceiros .bg2 {
        background-color: #D2EAEF !important;
    }

    /* Linha invertida do banner */
    .fotos-page .blog-banner-linha {
        bottom: -130px;      /* -207px × 0.533 */
        margin-right: -27px; /* -50px × 0.533 */
        width: 220px;
    }


    /* =============================================
       FOTOS CONTENT SECTION
       ============================================= */
    .fotos-section {
        position: relative;
        z-index: 4;
        padding: 64px 0 1px; /* 120px × 0.533 */
    }

    .fotos-section .wrap {
        max-width: 712px; /* 1280px × 0.533 */
        padding-left: 0 !important;
        padding-right: 0 !important;
        position: relative;
    }

    /* Title */
    .fotos-titulo {
        font-family: 'ClashDisplay', sans-serif !important;
        font-weight: 500;
        font-size: 21px;   /* 40px × 0.533 */
        line-height: 100%;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: #EC6608;
        margin: 0 0 27px;  /* 50px × 0.533 */
    }


    /* =============================================
       FOTOS GRID — 3 columns
       ============================================= */
    .fotos-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 9px;          /* 16px × 0.533 */
        max-width: 700px;  /* 1280px × 0.533 */
        margin: 0 auto;
        
    }

    .fotos-grid-item {
        flex: 0 0 222px;   /* 416px × 0.533 */
        display: flex;
        flex-direction: column;
          margin-right: 9px !important;
    }

    /* Image card */
    .fotos-grid-link {
        display: block;
        position: relative;
        width: 100%;
        height: 126px;     /* 237px × 0.533 */
        border-radius: 11px; /* 20px × 0.533 */
        overflow: hidden;
    }
    .fotos-grid-link::after {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: 11px;
        background: linear-gradient(305.41deg, #3D3A3A 0%, rgba(255, 255, 255, 0) 29.57%);
        pointer-events: none;
    }
    .fotos-grid-link img.fotos-grid-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        mix-blend-mode: multiply;
        border-radius: 11px;
        transition: transform 0.6s cubic-bezier(0.38, 0, 0.02, 1), filter 0.4s ease;
    }
    .fotos-grid-link:hover img.fotos-grid-img {
        transform: scale(1.05);
        filter: brightness(0.85);
    }

    /* Zoom icon */
    .fotos-grid-zoom {
        position: absolute;
        bottom: 6px;  /* 12px × 0.533 */
        right: 6px;
        width: 9px;   /* 16px × 0.533 */
        height: 9px;
        display: flex;
        align-items: center;
        justify-content: center;
        pointer-events: none;
        z-index: 2;
    }
    .fotos-grid-zoom img {
        width: 9px;
        height: 9px;
        display: block;
    }

    /* Photo title */
    .fotos-grid-titulo {
        font-family: 'ClashDisplay', sans-serif !important;
        font-weight: 500;
        font-size: 12px;   /* 22px × 0.533 */
        line-height: 18px; /* 33px × 0.533 */
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: #EC6608;
        margin: 6px 0 21px; /* 12px 0 40px × 0.533 */
        margin-left: 13px;  /* 25px × 0.533 */
    }


    /* =============================================
       ASTRONAUTA + LINHA FOTOS
       ============================================= */
    .fotos-deco-wrap {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        width: 100vw;
        bottom: -21px; /* -40px × 0.533 */
        z-index: 1;
        pointer-events: none;
        overflow: hidden;
    }

    .fotos-astronauta {
        position: absolute;
        left: calc((100vw - 682px) / 2 - 187px); /* proporções internas × 0.533 */
        bottom: 96px;   /* 180px × 0.533 */
        width: 211px;   /* 395px × 0.533 */
        height: 263px;  /* 493px × 0.533 */
        z-index: 3;
        pointer-events: none;
    }
    .fotos-astronauta img {
        width: 100%;
        height: auto;
        display: block;
        animation: astronaut-bob 3s ease-in-out infinite;
    }

    .fotos-linha {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 2;
        pointer-events: none;
    }
    .fotos-linha img {
        width: 100vw;
        min-width: 100vw;
        max-width: none;
        height: auto;
        display: block;
    }

    /* Clip-path reveal animations */
    @keyframes fotosClipRevealLeftRight {
        0%   { clip-path: inset(0 100% 0 0); }
        100% { clip-path: inset(0 0% 0 0); }
    }

    .fotos-deco-wrap .fotos-linha img,
    .fotos-visitantes-linha-wrap .fotos-linha img {
        clip-path: inset(0 100% 0 0);
    }
    .fotos-deco-wrap.is-revealed .fotos-linha img,
    .fotos-visitantes-linha-wrap.is-revealed .fotos-linha img {
        animation: fotosClipRevealLeftRight 4s cubic-bezier(0.22, 1, 0.36, 1) 0.3s forwards;
    }

    /* Empty state */
    .fotos-empty {
        text-align: center;
        padding: 32px 0;   /* 60px × 0.533 */
        font-family: 'Exo', sans-serif;
        font-size: 10px;   /* 18px × 0.533 */
        color: #858585;
    }


    /* =============================================
       FOTOS DOS VISITANTES — Section
       ============================================= */
    .fotos-visitantes-section {
        position: relative;
        padding-bottom: 85px;  /* 160px × 0.533 */
        margin-top: -85px;     /* -160px × 0.533 */
    }

    .fotos-visitantes-astronauta {
        position: absolute;
        right: -107px;   /* -200px × 0.533 */
        top: -85px;      /* -160px × 0.533 */
        z-index: 10;
        pointer-events: none;
    }
    .fotos-visitantes-astronauta img {
        width: 142px;
        height: auto;
        display: block;
        animation: astronaut-bob 3s ease-in-out infinite;
    }

    .fotos-visitantes-linha-wrap {
        position: absolute;
        left: 50%;
        bottom: -21px;   /* -40px × 0.533 */
        transform: translateX(-50%);
        width: 100vw;
        pointer-events: none;
        max-width: 100vw;
        overflow: visible;
    }
    .fotos-visitantes-linha-wrap .fotos-linha {
        position: relative;
        top: auto;
        width: 100%;
        height: 100%;
    }
    .fotos-visitantes-linha-wrap .fotos-linha img {
        width: 100vw;
        min-width: 100vw;
        max-width: none;
        height: auto;
        display: block;
    }

} /* end @media (max-width: 1024px) */
}


/* =============================================
   RESPONSIVE — MOBILE (≤768px)
   ============================================= */
/* =============================================
   BASE — mobile-only elements hidden on desktop
   ============================================= */
.fotos-deco-mobile         { display: none; }
.fotos-ver-mais-wrap       { display: none; }
/* Mobile picker — hidden by default (shown via media query) */
.inst-ingresso-mobile-picker { display: none; }

.inst-ingresso-select-wrap {
    position: relative;
}
.inst-ingresso-select-btn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    width: 284px;
    height: 46px;
    border-radius: 64px;
    background: linear-gradient(180deg, #F29120 0%, #EC6608 100%);
    border: none;
    outline: none;
    cursor: pointer;
    color: #fff;
    font-family: 'ClashDisplay', sans-serif !important;
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0 20px;
}
.inst-ingresso-select-icon,
.inst-ingresso-dropdown-icon {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.inst-ingresso-select-btn[data-inst-current-key="individual"] .inst-ingresso-select-icon,
.inst-ingresso-dropdown-item[data-key="individual"] .inst-ingresso-dropdown-icon {
    background-image: url('../img/home/individual.png');
}

.inst-ingresso-select-btn[data-inst-current-key="cabine"] .inst-ingresso-select-icon,
.inst-ingresso-dropdown-item[data-key="cabine"] .inst-ingresso-dropdown-icon {
    background-image: url('../img/home/cabine.webp');
}

.inst-ingresso-select-btn[data-inst-current-key="especial"] .inst-ingresso-select-icon,
.inst-ingresso-dropdown-item[data-key="especial"] .inst-ingresso-dropdown-icon {
    background-image: url('../img/home/especial.png');
}

.inst-ingresso-select-label {
    flex: 1;
    min-width: 0;
    text-align: left;
}

.inst-ingresso-select-arrow {
    width: 8px;
    height: 8px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: translateY(-3px) rotate(45deg);
    transition: transform 0.2s ease;
    flex-shrink: 0;
    margin-left: auto;
}
.inst-ingresso-select-wrap.is-open .inst-ingresso-select-arrow {
    transform: translateY(2px) rotate(-135deg);
}
.inst-ingresso-dropdown-list {
    position: absolute;
    bottom: calc(100% + 10px);
    right: 0;
    width: 284px;
    max-height: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
    list-style: none;
    background: linear-gradient(180deg, #EEF7F8 0%, #9FE4F1 100%);
    border-radius: 24px;
    border: none;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.15);
    opacity: 0;
    pointer-events: none;
    transition: max-height 0.25s ease, opacity 0.2s ease, padding 0.25s ease;
    z-index: 310;
}
.inst-ingresso-select-wrap.is-open .inst-ingresso-dropdown-list {
    max-height: 220px;
    opacity: 1;
    pointer-events: auto;
    padding: 16px 14px;
}
.inst-ingresso-dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 50px;
    padding: 0 18px;
    margin-bottom: 8px;
    border-radius: 64px;
    color: #EC6608;
    font-family: 'ClashDisplay', sans-serif !important;
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s ease;
}
.inst-ingresso-dropdown-icon {
    filter: brightness(0) saturate(100%) invert(49%) sepia(94%) saturate(1910%) hue-rotate(357deg) brightness(96%) contrast(92%);
}
.inst-ingresso-dropdown-text {
    text-align: left;
}
.inst-ingresso-dropdown-item:last-child { margin-bottom: 0; }
.inst-ingresso-dropdown-item.is-active,
.inst-ingresso-dropdown-item:hover { background: rgba(236, 102, 8, 0.12); border-radius: 64px; }


@media only screen and (max-width: 768px) {

    body.fotos-page {
        --home-mobile-fs-18: clamp(13px, 3.3333vw, 18px);
        --home-mobile-side-gap: clamp(23.111px, 5.9259vw, 32px);
        --home-mobile-content-width: min(476px, calc(100vw - (var(--home-mobile-side-gap) * 2)));
        --home-mobile-footer-width: clamp(277.667px, 88.1481vw, 476px);
        --home-mobile-footer-map-btn-width: clamp(109.083px, 34.6296vw, 187px);
        --home-mobile-footer-map-btn-height: clamp(28px, 8.8889vw, 48px);
        --home-mobile-partner-slot-width: clamp(104.333px, 26.7407vw, 144.406px);
        --home-mobile-partner-logo-width: clamp(57.778px, 14.8148vw, 80px);
        --home-mobile-partner-logo-height: clamp(47.667px, 12.2222vw, 66px);
        --home-mobile-lines-width: clamp(144.444px, 37.037vw, 200px);
        --home-mobile-lines-height: clamp(145.574px, 37.3055vw, 201.4499px);
        --blog-mobile-ingresso-bar-width: min(508px, 94.0741vw);
        --blog-mobile-ingresso-bar-height: clamp(57.056px, 14.6294vw, 79px);
        --blog-mobile-ingresso-select-width: min(284px, 52.5926vw);
        --blog-mobile-ingresso-select-height: clamp(33.351px, 8.5516vw, 46.179px);
        --blog-mobile-ingresso-bottom-gap: clamp(12px, 3.0769vw, 16px);
    }

    /* =============================================
       BANNER
       ============================================= */
    .fotos-banner {
        min-height: 710px;
    }
    .fotos-banner .blog-banner-img {
        height: 710px;
        width: 100%;
        object-fit: cover;
        object-position: center top;
    }
    .fotos-banner-linha-desktop {
        display: block;
    }

    /* =============================================
       NUVENS — mesma posição de conheca-itapema
       ============================================= */
    .blog-nuvens .nuvem1 {
        top: 620px;
        left: 50px;
        right: auto;
        width: 320px;
    }
    .blog-nuvens .nuvem2 {
        top: 650px;
        right: 30px;
        left: auto;
        width: 240px;
    }
    .blog-nuvens .nuvem3 {
        top: 550px;
        left: -180px;
        right: auto;
        width: 320px;
    }

    /* =============================================
       FOTOS SECTION
       ============================================= */
    .fotos-section {
        padding: 150px 0 100px;
    }

    .fotos-section .wrap {
        width: 100%;
        max-width: 540px;
        margin: 0 auto;
        padding-left: var(--home-mobile-side-gap) !important;
        padding-right: var(--home-mobile-side-gap) !important;
        box-sizing: border-box;
    }

    .fotos-titulo {
        font-size: 26px;
        width: 100%;
        max-width: var(--home-mobile-content-width);
        margin: 0 auto 24px;
        padding: 0;
        margin-left: 35px;
    }

    .fotos-titulo br.home-mobile-break {
        display: block;
    }

    /* =============================================
       GRID — coluna única, tamanho responsivo
       formula home: 390→343.778px, 430→379.037px
       ============================================= */
    .fotos-grid {
        flex-direction: column;
        gap: 24px;
        width: 100%;
        max-width: var(--home-mobile-content-width);
        padding: 0;
        margin: 0 auto;
    }

    .fotos-grid-item {
        max-width: var(--home-mobile-content-width);
        width: var(--home-mobile-content-width);
    }

    .fotos-grid-item--hidden-mobile {
        display: none;
    }

    .fotos-grid-link {
        width: 100%;
        height: auto;
        aspect-ratio: 416 / 237;
    }

    .fotos-grid-zoom {
        bottom: clamp(12px, 3.3333vw, 16px);
        right: clamp(12px, 3.3333vw, 16px);
        width: clamp(20px, 5.5556vw, 24px);
        height: clamp(20px, 5.5556vw, 24px);
    }

    .fotos-grid-zoom img {
        width: 100%;
        height: 100%;
    }

    .fotos-grid-titulo {
        font-size: 21px;
        margin-left: 0;
        padding-left: 18px;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: 25px;
    }

    /* =============================================
       VER MAIS — botão mobile
       ============================================= */
    .fotos-ver-mais-wrap {
        display: flex;
        justify-content: center;
        width: 100%;
        max-width: var(--home-mobile-content-width);
        margin: 0 auto;
        padding: 32px 0 40px;
    }

    .fotos-ver-mais-btn {
        font-family: 'ClashDisplay', sans-serif;
        font-weight: 500;
        font-size: 14px;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: #fff;
        background: linear-gradient(180deg, #279BB1 0%, #005284 100%);
        border: none;
        border-radius: 64px;
        padding: 14px 40px;
        cursor: pointer;
        transition: opacity 0.2s ease;
    }
    .fotos-ver-mais-btn:hover { opacity: 0.85; }
    .fotos-ver-mais-btn.is-hidden { display: none; }

    /* =============================================
       DECO DESKTOP — oculto no mobile
       ============================================= */
    .fotos-deco-wrap         { display: none; }
    .fotos-linha-desktop     { display: none; }
    .fotos-visitantes-astronauta-desktop { display: none; }
    .fotos-visitantes-linha-wrap { display: none; }

    /* =============================================
       DECO MOBILE — linha + astronauta
       ============================================= */
    .fotos-deco-mobile {
        display: block;
        position: relative;
        left: 50%;
        width: 100vw;
        max-width: 100vw;
        margin-left: 0;
        margin-top: 40px;
        transform: translateX(-50%);
    }

    .fotos-linha-mobile {
        display: block;
        width: 100vw;
        max-width: none;
        height: auto;
        
    }

    .fotos-astronauta-mobile {
        position: absolute;
        width: 178px;
        height: auto;
        bottom: -100px;
        left: 72px;
        pointer-events: none;
        z-index: 3;
    }
    .fotos-astronauta-mobile img {
        width: 178px;
        height: auto;
        display: block;
        animation: astronaut-bob 3s ease-in-out infinite;
    }

    /* =============================================
       VISITANTES — sem padding top extra
       ============================================= */
    .fotos-visitantes-section {
        margin-top: -150px;
        padding-bottom: 0;
    }

    .fotos-deco-mobile-visitantes {
        margin-bottom: 40px;
    }
    .fotos-deco-mobile-visitantes .fotos-astronauta-mobile {
        display: none; /* só a linha na seção visitantes */
    }

    /* =============================================
       BANNER LINES (3 linhas) — adaptar pra 200x201
       ============================================= */
    .fotos-page .blog-banner-linha {
        bottom: 15px;
        right: 25px;
        width: var(--home-mobile-lines-width);
        height: var(--home-mobile-lines-height);
        z-index: -2;
    }

    body.fotos-page .section-parceiros {
        padding: 22px 0 32px !important;
        margin-top: -15px !important;
        overflow: visible;
    }

    body.fotos-page .section-parceiros .wrap.wide {
        width: 100%;
        max-width: 540px;
        margin: 0 auto;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: visible;
        box-sizing: border-box;
    }

    body.fotos-page .section-parceiros h2 {
        margin-top: 10px !important;
        width: 100%;
        max-width: var(--home-mobile-content-width);
        margin-left: auto;
        margin-right: auto;
        padding-left: var(--home-mobile-side-gap);
        padding-right: var(--home-mobile-side-gap);
        box-sizing: border-box;
    }

    body.fotos-page .section-parceiros .bg2 {
        width: 100%;
        height: 132px;
        left: 0;
        right: 0;
        top: 120px;
        transform: none;
        margin: 0;
    }

    body.fotos-page .parceiros-title-outside {
        margin-top: 0 !important;
        margin-bottom: 12px !important;
    }

    body.fotos-page .section-parceiros .slide-parceiros {
        width: calc(100% - var(--home-mobile-side-gap));
        max-width: none;
        margin: 0 0 0 var(--home-mobile-side-gap) !important;
        overflow: visible;
    }

    body.fotos-page .section-parceiros .slide-parceiros .owl-stage-outer {
        overflow: hidden;
    }

    body.fotos-page .section-parceiros .slide-parceiros .owl-stage {
        display: flex !important;
        align-items: center !important;
    }

    body.fotos-page .section-parceiros .slide-parceiros .owl-item {
        width: var(--home-mobile-partner-slot-width) !important;
        min-width: var(--home-mobile-partner-slot-width);
        min-height: 132px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    body.fotos-page .section-parceiros .slide-parceiros .item-parceiro {
        width: var(--home-mobile-partner-slot-width);
        min-width: var(--home-mobile-partner-slot-width);
        min-height: var(--home-mobile-partner-logo-height);
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
    }

    body.fotos-page .section-parceiros .slide-parceiros .item-parceiro img {
        width: var(--home-mobile-partner-logo-width) !important;
        height: var(--home-mobile-partner-logo-height) !important;
        max-width: var(--home-mobile-partner-logo-width) !important;
        max-height: var(--home-mobile-partner-logo-height) !important;
        margin-top: 100px !important;
        object-fit: contain;
        object-position: center;
    }

    body.fotos-page .section-parceiros .slide-parceiros .item-parceiro a {
        width: 100%;
        height: var(--home-mobile-partner-logo-height);
        display: flex;
        align-items: center;
        justify-content: center;
    }
      body:not(.is-home) .section-parceiros {
      
        padding-bottom: 101px !important; /* 170px × 0.533 */
    }
    /* =============================================
       INGRESSO BAR — pill bottom (igual institucional)
       ============================================= */
    .blog-ingresso-anchor {
        margin-top: -240px;
        overflow: visible;
    }
    .blog-ingresso-anchor.has-placeholder {
        min-height: var(--blog-mobile-ingresso-bar-height);
    }
    .blog-ingresso-bar {
        width: var(--blog-mobile-ingresso-bar-width);
        max-width: var(--blog-mobile-ingresso-bar-width);
        height: var(--blog-mobile-ingresso-bar-height);
        border-top-left-radius: 200px;
        border-bottom-left-radius: 200px;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        padding: 0;
        gap: 0;
        margin-left: auto;
        justify-content: space-between;
        align-items: center;
    }

    .blog-ingresso-bar.is-stuck-bottom {
        bottom: var(--blog-mobile-ingresso-bottom-gap);
    }

    .blog-ingresso-bar .sticky-ingresso-label,
    .blog-ingresso-bar .sticky-ingresso-btn {
        display: none !important;
    }

    .inst-ingresso-mobile-picker {
        display: flex;
        align-items: center;
        width: 100%;
        gap: clamp(8px, 1.8519vw, 10px);
        padding: 0 clamp(10px, 2.5926vw, 14px) 0 clamp(19px, 4.8148vw, 26px);
    }

    .inst-ingresso-mobile-label {
        color: #fff;
        font-family: 'ClashDisplay', sans-serif !important;
        font-weight: 500;
        font-size: clamp(12px, 3.3333vw, 18px);
        line-height: 1.2;
        text-transform: uppercase;
        letter-spacing: 0.07em;
        white-space: nowrap;
        flex-shrink: 0;
        margin-left: clamp(10px, 2.5926vw, 14px);
    }

    .blog-ingresso-bar .inst-ingresso-select-wrap {
        margin-left: auto;
        flex-shrink: 0;
    }

    .blog-ingresso-bar .inst-ingresso-select-btn {
        width: var(--blog-mobile-ingresso-select-width);
        height: var(--blog-mobile-ingresso-select-height);
        font-size: clamp(11px, 2.5926vw, 14px);
        padding: 0 clamp(12px, 3.3333vw, 18px);
        gap: clamp(8px, 2.2222vw, 12px);
    }

    .blog-ingresso-bar .inst-ingresso-dropdown-list {
        width: var(--blog-mobile-ingresso-select-width);
    }

    .inst-ingresso-dropdown-item {
        min-height: clamp(40px, 9.2593vw, 50px);
        font-size: clamp(11px, 2.5926vw, 14px);
        color: #858585;
    }

    .inst-ingresso-select-icon,
    .inst-ingresso-dropdown-icon {
        width: clamp(17px, 4.6296vw, 20px);
        height: clamp(17px, 4.6296vw, 20px);
        flex-basis: clamp(17px, 4.6296vw, 20px);
    }

    .inst-ingresso-dropdown-icon {
        filter: brightness(0) saturate(100%) invert(52%);
    }

}

    /* =====================================================================
       RESPONSIVIDADE FLUIDA · 1280 → 1920 — página Fotos
       Interpola entre o snapshot de notebook (@media max-width: 1440px)
       e o desktop default para eliminar os saltos nas larguras intermediárias.
       ===================================================================== */
    @media only screen and (min-width: 1281px) and (max-width: 1920px) {
        .fotos-page .blog-banner-linha {
            bottom: clamp(-186px, calc(-98px - (100vw - 1280px) * 0.1375), -98px);
            margin-right: clamp(-50px, calc(0px - (100vw - 1280px) * 0.078125), 0px);
            width: clamp(318px, calc(318px + (100vw - 1280px) * 0.19375), 442px);
            height: clamp(321px, calc(321px + (100vw - 1280px) * 0.165625), 427px);
        }

        .fotos-section {
            padding-top: clamp(90px, calc(90px + (100vw - 1280px) * 0.046875), 120px);
        }

        .fotos-section .wrap,
        .fotos-grid {
            max-width: clamp(910px, calc(910px + (100vw - 1280px) * 0.578125), 1280px);
        }

        .fotos-titulo {
            font-size: clamp(30px, calc(30px + (100vw - 1280px) * 0.015625), 40px);
            margin-bottom: clamp(38px, calc(38px + (100vw - 1280px) * 0.01875), 50px);
        }

        .fotos-grid {
            gap: clamp(11px, calc(11px + (100vw - 1280px) * 0.0078125), 16px);
        }

        .fotos-grid-item {
            flex: 0 0 clamp(296px, calc(296px + (100vw - 1280px) * 0.1875), 416px);
        }

        .fotos-grid-link {
            height: clamp(169px, calc(169px + (100vw - 1280px) * 0.10625), 237px);
        }

        .fotos-grid-link,
        .fotos-grid-link::after,
        .fotos-grid-link img.fotos-grid-img {
            border-radius: clamp(14px, calc(14px + (100vw - 1280px) * 0.009375), 20px);
        }

        .fotos-grid-zoom {
            bottom: clamp(9px, calc(9px + (100vw - 1280px) * 0.0046875), 12px);
            right: clamp(9px, calc(9px + (100vw - 1280px) * 0.0046875), 12px);
            width: clamp(12px, calc(12px + (100vw - 1280px) * 0.00625), 16px);
            height: clamp(12px, calc(12px + (100vw - 1280px) * 0.00625), 16px);
        }

        .fotos-grid-zoom img {
            width: clamp(12px, calc(12px + (100vw - 1280px) * 0.00625), 16px);
            height: clamp(12px, calc(12px + (100vw - 1280px) * 0.00625), 16px);
        }

        .fotos-grid-titulo {
            font-size: clamp(17px, calc(17px + (100vw - 1280px) * 0.0078125), 22px);
            line-height: clamp(25px, calc(25px + (100vw - 1280px) * 0.0125), 33px);
            margin: clamp(9px, calc(9px + (100vw - 1280px) * 0.0046875), 12px) 0 clamp(30px, calc(30px + (100vw - 1280px) * 0.015625), 40px);
            margin-left: clamp(19px, calc(19px + (100vw - 1280px) * 0.009375), 25px);
        }

        .fotos-deco-wrap {
            bottom: clamp(-40px, calc(-30px - (100vw - 1280px) * 0.015625), -30px);
        }

        .fotos-astronauta {
            left: clamp(-30px, calc(-28px - (100vw - 1280px) * 0.003125), -28px);
            bottom: clamp(135px, calc(135px + (100vw - 1280px) * 0.0703125), 180px);
            width: clamp(230px, calc(230px + (100vw - 1280px) * 0.2578125), 395px);
            height: clamp(280px, calc(280px + (100vw - 1280px) * 0.3328125), 493px);
        }

        .fotos-visitantes-section {
            padding-bottom: clamp(120px, calc(120px + (100vw - 1280px) * 0.0625), 160px);
            margin-top: clamp(-160px, calc(-120px - (100vw - 1280px) * 0.0625), -120px);
        }

        .fotos-visitantes-astronauta {
            right: clamp(-200px, calc(-140px - (100vw - 1280px) * 0.09375), -140px);
            top: clamp(-160px, calc(-125px - (100vw - 1280px) * 0.0546875), -125px);
        }

        .fotos-visitantes-astronauta img {
            width: clamp(173px, calc(173px + (100vw - 1280px) * 0.15625), 273px);
            height: clamp(215px, calc(215px + (100vw - 1280px) * 0.18125), 331px);
        }

        .fotos-visitantes-linha-wrap {
            bottom: clamp(-40px, calc(-30px - (100vw - 1280px) * 0.015625), -30px);
        }
    }