:root {
    --topmais-purple: #64249d;
    --topmais-purple-dark: #4a167a;
    --topmais-lilac: #f5f0fb;
    --topmais-yellow: #f6cc43;
    --topmais-text: #5b5864;
    --topmais-title: #67308f;
    --topmais-border: #ded8e8
}

* {
    scroll-behavior: smooth
}

body {
    background: #fff;
    color: var(--topmais-text);
    font-family: 'Trebuchet MS', 'Segoe UI', Arial, sans-serif;
    letter-spacing: .02em
}

.text-purple {
    color: var(--topmais-purple) !important
}

.btn-purple {
    background: var(--topmais-purple);
    color: #fff;
    border: 0
}

.btn-purple:hover {
    background: var(--topmais-purple-dark);
    color: #fff
}

.bg-soft {
    background: var(--topmais-lilac)
}

.top-club-header {
    background: #fff;
    border-bottom: 1px solid #eee;
    z-index: 1030
}

.top-header-line {
    height: 72px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center
}

.hamburger-clean {
    border: 0;
    background: transparent;
    color: var(--topmais-purple);
    font-size: 2rem;
    justify-self: start
}

.club-logo {
    width: 56px;
    height: 56px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--topmais-purple), #7b37bd);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    justify-self: center;
    box-shadow: 0 10px 25px rgba(100, 36, 157, .22)
}

.club-logo span {
    color: var(--topmais-yellow);
    font-size: 2.9rem;
    line-height: 1;
    font-weight: 900;
    text-shadow: 0 0 1px #fff
}

.club-login {
    justify-self: end;
    color: var(--topmais-purple);
    font-size: 1.45rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: .55rem
}

.club-login:hover {
    color: var(--topmais-purple-dark)
}

.club-menu {
    list-style: none;
    display: flex;
    justify-content: center;
    gap: 48px;
    margin: 0;
    padding: 24px 0 18px;
    white-space: nowrap;
    overflow-x: auto
}

.club-menu a {
    color: #5d2388;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    font-size: 1rem
}

.club-menu a span {
    font-size: 1.75rem;
    line-height: 1
}

.club-menu a:hover {
    color: var(--topmais-purple-dark)
}

.site-hero-banner {
    min-height: 310px;
    background: linear-gradient(90deg, rgba(255, 255, 255, .95), rgba(255, 255, 255, .5)), radial-gradient(circle at 85% 40%, rgba(100, 36, 157, .18), transparent 38%), linear-gradient(135deg, #f7f7f7, #e8eef7);
    display: flex;
    align-items: center;
    overflow: hidden
}

.site-hero-banner.with-img {
    background-size: cover;
    background-position: center
}

.hero-inner {
    padding: 48px 0
}

.hero-eyebrow {
    font-weight: 700;
    color: #888;
    font-size: 1.2rem
}

.hero-title {
    font-size: clamp(2.1rem, 4.3vw, 4.4rem);
    line-height: 1.05;
    color: var(--topmais-title);
    font-weight: 800;
    max-width: 850px
}

.hero-lead {
    font-size: 1.15rem;
    max-width: 720px
}

.hero-banner-card {
    border-radius: 26px;
    background: rgba(255, 255, 255, .85);
    padding: 30px;
    box-shadow: 0 25px 80px rgba(72, 26, 110, .12)
}

.section-heading {
    text-align: center;
    margin-bottom: 24px
}

.section-heading h2 {
    color: var(--topmais-title);
    font-size: clamp(2rem, 3.2vw, 3.2rem);
    font-weight: 700;
    margin: 0
}

.section-heading p {
    font-size: 1.1rem;
    color: #5f5a66;
    margin: .2rem 0 0
}

.mosaic-grid {
    display: grid;
    grid-template-columns: 1fr 1.45fr 1.7fr;
    gap: 24px
}

.mosaic-card {
    min-height: 230px;
    border-radius: 3px;
    overflow: hidden;
    background: #eee;
    position: relative;
    box-shadow: 0 12px 25px rgba(0, 0, 0, .05)
}

.mosaic-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.mosaic-card.color {
    background: var(--topmais-yellow);
    padding: 32px;
    color: #6b236f;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.mosaic-card.purple {
    background: var(--topmais-purple);
    color: #fff
}

.mosaic-card h3 {
    font-size: 1.55rem;
    font-weight: 700
}

.mosaic-card.large {
    grid-column: span 2
}

.logo-strip {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 8px 0 18px
}

.logo-pill {
    min-width: 146px;
    height: 82px;
    border: 1px solid var(--topmais-border);
    border-radius: 14px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px
}

.logo-pill img {
    max-width: 100%;
    max-height: 54px;
    object-fit: contain
}

.logo-fallback {
    font-weight: 800;
    color: var(--topmais-purple);
    font-size: 1.25rem
}

.carousel-arrows {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: -18px;
    margin-bottom: 8px
}

.round-arrow {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 0;
    background: #dedede;
    color: #777;
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.public-product-row {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    padding: 8px 0 20px
}

.public-product-card {
    min-width: 244px;
    max-width: 244px;
    border: 1px solid var(--topmais-border);
    border-radius: 15px;
    background: #fff;
    padding: 24px;
    text-align: center;
    min-height: 230px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    transition: .2s
}

.public-product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 35px rgba(97, 36, 151, .11)
}

.public-product-card img {
    width: 92px;
    height: 72px;
    object-fit: contain;
    margin-bottom: 14px
}

.product-fallback {
    width: 92px;
    height: 72px;
    background: #f4eefb;
    color: var(--topmais-purple);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.7rem;
    margin-bottom: 14px
}

.public-product-card h3 {
    font-size: 1.05rem;
    color: #666;
    line-height: 1.2;
    margin-bottom: 8px
}

.public-product-card .price-line {
    color: #666;
    font-size: 1.05rem
}

.public-product-card .points-line {
    font-size: 1.05rem;
    color: #666;
    margin-top: 4px
}

.public-product-card .tag-line {
    font-size: .82rem;
    color: #fff;
    background: var(--topmais-purple);
    border-radius: 20px;
    padding: 4px 10px;
    margin-bottom: 8px
}

.catalog-title {
    text-align: center;
    padding: 36px 0 20px
}

.catalog-title h1 {
    color: var(--topmais-title);
    font-size: 2.8rem
}

.catalog-title p {
    font-size: 1.05rem
}

.catalog-shell {
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 26px;
    border-top: 1px solid #ddd;
    padding-top: 18px
}

.catalog-sidebar a {
    display: block;
    color: #666;
    text-decoration: none;
    margin: 3px 0;
    font-size: 1.05rem
}

.catalog-sidebar a.active,
.catalog-sidebar a:hover {
    color: var(--topmais-purple);
    font-weight: 700
}

.search-line {
    display: grid;
    grid-template-columns: 1fr 78px;
    gap: 24px;
    align-items: center;
    margin-bottom: 32px
}

.search-input {
    height: 60px;
    border: 1px solid #ddd;
    border-radius: 32px;
    padding: 0 24px;
    font-size: 1.05rem;
    outline: 0
}

.search-button {
    width: 78px;
    height: 78px;
    border: 0;
    border-radius: 50%;
    background: var(--topmais-purple);
    color: #fff;
    font-size: 2.3rem
}

.catalog-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px
}

.catalog-card {
    border: 1px solid var(--topmais-border);
    border-radius: 14px;
    background: #fff;
    text-align: center;
    padding: 28px 18px;
    min-height: 278px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between
}

.catalog-card img {
    width: 106px;
    height: 70px;
    object-fit: contain;
    margin-bottom: 14px
}

.catalog-card h3 {
    font-size: 1.08rem;
    color: #6a6670;
    margin-bottom: 12px
}

.catalog-card p {
    line-height: 1.2;
    color: #666;
    margin-bottom: 14px
}

.catalog-card .use-btn {
    border: 0;
    background: transparent;
    color: var(--topmais-purple);
    font-weight: 700;
    text-decoration: underline
}

.catalog-empty {
    background: #fafafa;
    border: 1px dashed #ddd;
    border-radius: 18px;
    padding: 32px;
    text-align: center
}

.benefit-modal {
    border: 0;
    border-radius: 8px;
    overflow: hidden
}

.benefit-modal .modal-title {
    color: var(--topmais-purple);
    font-size: 1.45rem
}

.modal-logo-wrap img {
    width: 148px;
    height: 148px;
    object-fit: contain
}

.modal-fallback-logo {
    width: 148px;
    height: 148px;
    border-radius: 8px;
    background: #f3edf8;
    color: var(--topmais-purple);
    font-size: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto
}

.benefit-modal .btn-secondary {
    background: #6c757d;
    border: 0;
    font-size: 1.25rem
}

.internal-clean-hero {
    padding: 48px 0;
    text-align: center
}

.internal-clean-hero h1 {
    color: var(--topmais-title);
    font-size: clamp(2.2rem, 4vw, 4.2rem);
    font-weight: 700
}

.internal-clean-hero p {
    font-size: 1.1rem
}

.content-card,
.info-step {
    border: 0;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(67, 16, 122, .09);
    padding: 28px
}

.info-step strong {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--topmais-yellow);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    color: #3b2452
}

.info-step h3,
.content-card h2 {
    color: var(--topmais-title);
    font-weight: 800
}

.reward-project-badge {
    font-size: .75rem;
    background: #f1e6fb;
    color: var(--topmais-purple);
    border-radius: 20px;
    padding: 4px 9px;
    margin-bottom: 8px
}

.club-footer {
    margin-top: 50px;
    background: var(--topmais-purple);
    color: #fff;
    padding: 28px 0
}

.footer-inline {
    text-align: center;
    margin-bottom: 18px
}

.footer-inline a {
    color: #fff;
    text-decoration: none;
    margin: 0 6px
}

.footer-inline a:hover {
    color: var(--topmais-yellow)
}

.footer-copy {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.footer-mark {
    color: var(--topmais-yellow);
    font-size: 2.3rem;
    font-weight: 900
}

.back-top {
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--topmais-purple);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border: 1px solid #2b123e;
    z-index: 1020
}

.back-top:hover {
    color: #fff;
    background: var(--topmais-purple-dark)
}

@media(max-width:991px) {
    .club-menu {
        gap: 16px;
        justify-content: flex-start;
        padding: 14px 0 18px
    }

    .club-menu a {
        min-width: 110px
    }

    .mosaic-grid {
        grid-template-columns: 1fr
    }

    .mosaic-card.large {
        grid-column: span 1
    }

    .catalog-shell {
        grid-template-columns: 1fr
    }

    .catalog-sidebar {
        display: flex;
        overflow-x: auto;
        gap: 14px
    }

    .catalog-sidebar a {
        white-space: nowrap
    }

    .catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .search-line {
        grid-template-columns: 1fr 64px
    }

    .search-button {
        width: 64px;
        height: 64px;
        font-size: 1.8rem
    }
}

@media(max-width:575px) {
    .top-header-line {
        height: 62px
    }

    .club-logo {
        width: 48px;
        height: 48px
    }

    .club-login {
        font-size: 1.05rem
    }

    .catalog-grid {
        grid-template-columns: 1fr
    }

    .footer-copy {
        display: block;
        text-align: center
    }

    .site-hero-banner {
        min-height: 260px
    }

    .hero-title {
        font-size: 2.1rem
    }
}

.coupon-info-page {
    background: #fff
}

.coupon-banner-placeholder {
    min-height: 260px;
    border-radius: 2px;
    background: radial-gradient(circle at 70% 40%, rgba(255, 255, 255, .22), transparent 30%), linear-gradient(135deg, #3e116d, #6824a0 55%, #94c84a);
    display: flex;
    align-items: center;
    padding: 34px;
    color: #fff;
    box-shadow: 0 20px 60px rgba(61, 20, 97, .16)
}

.coupon-banner-placeholder span {
    display: block;
    font-size: 2.8rem;
    font-weight: 900;
    line-height: .9
}

.coupon-banner-placeholder strong {
    display: block;
    font-size: 2.2rem;
    color: #c8ff67
}

.coupon-banner-placeholder p {
    font-size: 1.05rem;
    max-width: 320px;
    margin: 14px 0 0
}

.site-hero-banner .hero-banner-card {
    max-width: 780px
}

.content-card p {
    font-size: 1.05rem;
    line-height: 1.6
}

/* v4 - páginas institucionais no padrão Meu Topmais */
.program-hero {
    background: linear-gradient(90deg, #fff 0%, #fff 58%, #f6f3fb 58%, #f6f3fb 100%);
    padding: 58px 0 64px;
    overflow: hidden
}

.program-hero .back-link {
    display: inline-flex;
    color: #777;
    text-decoration: none;
    font-size: 2rem;
    margin-bottom: 20px
}

.program-hero-img {
    width: 100%;
    max-height: 330px;
    object-fit: cover;
    border-radius: 0 0 0 110px;
    box-shadow: 0 20px 50px rgba(65, 31, 96, .12)
}

.program-hero-placeholder {
    height: 330px;
    border-radius: 0 0 0 110px;
    background: linear-gradient(135deg, #ede5f8, #fff);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 6rem;
    color: #6c2daf;
    box-shadow: 0 20px 50px rgba(65, 31, 96, .10)
}

.page-content {
    font-size: 1rem;
    line-height: 1.75
}

.page-big-title {
    color: #6c2daf;
    font-weight: 500;
    letter-spacing: .02em
}

.faq-page .page-big-title,
.how-page .page-big-title,
.terms-page .page-big-title {
    font-size: clamp(2rem, 4vw, 3rem)
}

.faq-block {
    min-height: 420px
}

.faq-circle,
.how-illustration,
.val-circle {
    width: min(100%, 430px);
    aspect-ratio: 1/1;
    border-radius: 50%;
    margin: auto;
    background: #f5f2f8;
    box-shadow: 0 5px 14px rgba(0, 0, 0, .08);
    position: relative;
    overflow: hidden
}

.faq-circle:before,
.how-illustration:before,
.val-circle:before {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 7rem
}


.faq-1 {
    background-image: url("../img/faq1.png");
}
.faq-2 {
    background-image: url("../img/faq2.png");
}
.faq-3 {
    background-image: url("../img/faq3.png");
}
.faq-4 {
    background-image: url("../img/faq4.png");
}


.clean-accordion .accordion-item,
.terms-grid .accordion-item {
    border: 0;
    border-bottom: 1px solid #ded8e8;
    border-radius: 0;
    background: transparent
}

.clean-accordion .accordion-button,
.terms-grid .accordion-button {
    font-size: 1.35rem;
    color: #6c2daf;
    background: transparent;
    box-shadow: none;
    padding: 18px 16px;
    font-weight: 600;
    letter-spacing: .02em
}

.clean-accordion .accordion-button:not(.collapsed),
.terms-grid .accordion-button:not(.collapsed) {
    color: #6c2daf;
    background: transparent
}

.clean-accordion .accordion-body,
.terms-grid .accordion-body {
    color: #67707a;
    line-height: 1.75;
    padding: 0 16px 22px
}

.how-steps h2,
.validation-section h3,
.reminder-section h3 {
    font-size: 1.45rem;
    color: #6c2daf;
    margin-top: 22px
}

.how-steps p,
.validation-section p,
.reminder-section p {
    color: #68717d;
    line-height: 1.7
}


.how-illustration,
.val-circle {
    width: 220px;
    height: 220px;
    border-radius: 50%;
    margin: 0 auto 24px auto;
    background-color: #f5f2f8;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    box-shadow: 0 8px 22px rgba(0,0,0,.08);
    overflow: hidden;
}
@media (max-width: 768px) {
    .how-illustration,
    .val-circle {
        width: 180px;
        height: 180px;
        margin-bottom: 18px;
    }
}
.how-1{
    background-image: url("../img/funciona1.png");
}
.how-2{
    background-image: url("../img/funciona2.png");
}
.how-3{
    background-image: url("../img/funciona3.png");
}


.reminder-section h2 {
    text-transform: uppercase;
    font-size: clamp(1.8rem, 3vw, 2.55rem)
}

.validation-section {
    background: #fff
}

.val-1 {
 background-image: url("../img/funciona4.png");
 position: 100%;
 background-repeat: no-repeat;
}
.val-2 {
 background-image: url("../img/funciona5.png");
}
.val-3 {
 background-image: url("../img/funciona6.png");
}


.contact-form {
    max-width: 760px
}

.contact-form .form-control {
    border-radius: 28px;
    border: 1px solid #d7d0df;
    padding: 18px 28px;
    font-size: 1.05rem
}

.contact-form textarea.form-control {
    border-radius: 28px
}

.terms-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 32px
}

.terms-grid .accordion-item {
    break-inside: avoid
}

.terms-grid .accordion-button {
    font-size: 1rem;
    text-transform: uppercase;
    color: #777;
    justify-content: center;
    text-align: center
}

.coupon-banner-placeholder {
    min-height: 280px;
    border-radius: 28px;
    background: linear-gradient(135deg, #401470, #7e34c1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    box-shadow: 0 20px 50px rgba(65, 31, 96, .16);
    text-align: center
}

.coupon-banner-placeholder span {
    display: block;
    font-size: 2.3rem;
    font-weight: 700
}

.coupon-banner-placeholder strong {
    display: block;
    font-size: 2.7rem;
    color: #c7e85a
}

.coupon-banner-placeholder p {
    margin: .5rem 0 0;
    color: #fff
}

@media(max-width:991px) {
    .program-hero {
        background: #fff;
        padding: 36px 0
    }

    .program-hero-img,
    .program-hero-placeholder {
        border-radius: 28px;
        max-height: 260px
    }

    .terms-grid {
        display: block
    }

    .clean-accordion .accordion-button {
        font-size: 1.08rem
    }

    .faq-circle,
    .how-illustration,
    .val-circle {
        max-width: 290px
    }

    .faq-circle:before,
    .how-illustration:before,
    .val-circle:before {
        font-size: 4.5rem
    }
}



/* front */
.hotel-top-banner {
    width: 100%;
    min-height: 300px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}

.hotel-top-banner-overlay {
    position: absolute;
    inset: 0;
    background: rgba(40, 20, 70, 0.12);
}

.hotel-content-section {
    background: #fff;
    padding: 28px 0 70px;
}

.hotel-back-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #777;
    text-decoration: none;
    font-size: 2.7rem;
    line-height: 1;
    margin-bottom: 24px;
    transition: 0.2s ease;
}

.hotel-back-link:hover {
    color: #6f2da8;
    transform: translateX(-4px);
}

.hotel-intro {
    max-width: 1100px;
    margin: 0 auto 48px;
}

.hotel-intro h1 {
    color: #6f2da8;
    font-size: clamp(2rem, 4vw, 3.1rem);
    line-height: 1.12;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 24px;
}

.hotel-intro p {
    color: #555;
    font-size: 1.08rem;
    line-height: 1.6;
    max-width: 760px;
    margin: 0 auto 24px;
}

.hotel-main-btn {
    background: #6f2da8;
    color: #fff;
    border-radius: 999px;
    padding: 11px 34px;
    font-weight: 700;
    border: none;
    box-shadow: 0 12px 28px rgba(111, 45, 168, 0.18);
}

.hotel-main-btn:hover {
    background: #562083;
    color: #fff;
}

.hotel-how-it-works {
    padding-top: 12px;
    text-align: center;
}

.hotel-how-it-works h2,
.hotel-regulation h2 {
    color: #6f2da8;
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 600;
    margin-bottom: 64px;
    letter-spacing: 0.5px;
}

.hotel-step {
    max-width: 360px;
    margin: 0 auto;
    text-align: center;
}

.hotel-step-icon {
    font-size: 3rem;
    line-height: 1;
    margin-bottom: 18px;
    filter: grayscale(1);
    opacity: 0.8;
}

.hotel-step h3 {
    color: #6f2da8;
    font-size: 1.18rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.hotel-step p {
    color: #555;
    font-size: 1rem;
    line-height: 1.65;
    margin: 0;
}

.hotel-regulation {
    max-width: 1120px;
    margin: 54px auto 0;
    text-align: center;
}

.hotel-regulation h2 {
    margin-bottom: 16px;
}

.hotel-regulation-text {
    color: #555;
    font-size: 1rem;
    line-height: 1.75;
}

.hotel-regulation-text p {
    margin-bottom: 10px;
}

@media (max-width: 768px) {
    .hotel-top-banner {
        min-height: 210px;
    }

    .hotel-content-section {
        padding-top: 20px;
    }

    .hotel-back-link {
        font-size: 2.2rem;
        margin-bottom: 18px;
    }

    .hotel-intro {
        margin-bottom: 36px;
    }

    .hotel-intro h1 {
        font-size: 2rem;
        text-align: left;
    }

    .hotel-intro p {
        text-align: left;
    }

    .hotel-main-btn {
        width: 100%;
        text-align: center;
    }

    .hotel-how-it-works h2,
    .hotel-regulation h2 {
        margin-bottom: 32px;
    }

    .hotel-step {
        margin-bottom: 30px;
    }

    .hotel-regulation {
        margin-top: 24px;
        text-align: left;
    }
}


.club-logo {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: transparent;
    box-shadow: none;
    text-decoration: none;
}

.club-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
/* Páginas Hotéis/Cupons com banner superior */
.hotel-top-banner.banner-empty {
    min-height: 300px;
    background: linear-gradient(135deg, #2f1255 0%, #6f2da8 55%, #f2e9fb 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.banner-empty-content {
    position: relative;
    z-index: 2;
    color: #fff;
    text-align: center;
    padding: 32px;
}

.banner-empty-content span,
.banner-empty-content strong {
    display: block;
    line-height: 1;
}

.banner-empty-content span {
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 700;
    letter-spacing: .04em;
}

.banner-empty-content strong {
    margin-top: 10px;
    font-size: clamp(1.2rem, 3vw, 2rem);
    color: #ffd940;
}

.coupon-top-banner .hotel-top-banner-overlay {
    background: rgba(40, 20, 70, 0.10);
}

@media (max-width: 768px) {
    .hotel-top-banner.banner-empty {
        min-height: 210px;
    }
}

/* Página Cadastre e Ganhe no mesmo padrão de banner superior */
.cadastre-top-banner .hotel-top-banner-overlay {
    background: rgba(40, 20, 70, 0.10);
}

.cadastre-content-section {
    padding-bottom: 48px;
}

.cadastre-how-it-works {
    margin-top: 8px;
}

.cadastre-partners-section {
    background: #fff;
    padding-top: 18px !important;
}

.cadastre-regulation {
    margin-top: 10px;
}


.home-banner-only {
    width: 100%;
    background: #fff;
    overflow: hidden;
}

.home-banner-img {
    display: block;
    width: 100%;
    height: auto;
}

.home-banner-only .carousel-control-prev,
.home-banner-only .carousel-control-next {
    width: 7%;
}

.home-banner-only .carousel-control-prev-icon,
.home-banner-only .carousel-control-next-icon {
    width: 2.4rem;
    height: 2.4rem;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .35));
}

/* Home - grade de vantagens no padrão visual Topmais */
.topmais-benefits-section {
    background: #fff;
    padding-top: 42px !important;
}

.topmais-benefits-section .container {
    max-width: 1140px;
}

.topmais-benefits-title {
    max-width: 980px;
    color: var(--topmais-purple);
    font-size: clamp(2rem, 3.1vw, 3rem);
    line-height: 1.14;
    font-weight: 600;
    letter-spacing: .4px;
    margin: 0 0 26px;
}

.topmais-benefits-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: 300px;
    gap: 22px;
}

.benefit-card {
    display: block;
    position: relative;
    overflow: hidden;
    min-height: 260px;
    border-radius: 10px;
    text-decoration: none;
    color: var(--topmais-purple);
    background: #eee;
    box-shadow: 0 10px 24px rgba(34, 22, 55, .06);
    transition: transform .2s ease, box-shadow .2s ease;
}

.benefit-card:hover {
    color: var(--topmais-purple);
    transform: translateY(-3px);
    box-shadow: 0 18px 34px rgba(34, 22, 55, .10);
}

.benefit-photo,
.benefit-image {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.benefit-sorteios {
    grid-column: span 3;
    display: grid;
    grid-template-rows: 58% 42%;
}

.benefit-experiencias-text {
    grid-column: span 4;
}

.benefit-experiencias-image {
    grid-column: span 5;
}

.benefit-economize,
.benefit-online-image,
.benefit-ganhe-pontos,
.benefit-troque-pontos {
    grid-column: span 3;
}

.benefit-sorteios .benefit-photo,
.benefit-split .benefit-photo {
    min-height: 100%;
}

.benefit-split {
    display: grid;
    grid-template-rows: 50% 50%;
}

.benefit-content {
    padding: 26px 30px;
}

.benefit-yellow {
    background: var(--topmais-yellow);
}

.benefit-light,
.benefit-soft {
    background: #f1f1f1;
}

.benefit-soft {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 38px 48px;
}

.benefit-purple {
    background: var(--topmais-purple);
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 40px 44px;
}

.benefit-purple:hover {
    color: #fff;
}

.benefit-card h3 {
    font-size: clamp(1.18rem, 1.65vw, 1.65rem);
    line-height: 1.16;
    font-weight: 600;
    margin: 0 0 10px;
    letter-spacing: .4px;
}

.benefit-card p {
    font-size: .98rem;
    line-height: 1.45;
    margin: 0;
}

.benefit-economize h3 {
    max-width: 250px;
}

.benefit-economize p {
    max-width: 260px;
}

@media(max-width: 991px) {
    .topmais-benefits-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 280px;
    }

    .benefit-sorteios,
    .benefit-experiencias-text,
    .benefit-experiencias-image,
    .benefit-economize,
    .benefit-online-image,
    .benefit-ganhe-pontos,
    .benefit-troque-pontos {
        grid-column: span 1;
    }

    .benefit-experiencias-image,
    .benefit-economize {
        grid-column: span 2;
    }
}

@media(max-width: 640px) {
    .topmais-benefits-section {
        padding-top: 32px !important;
    }

    .topmais-benefits-title {
        font-size: 2rem;
        margin-bottom: 22px;
    }

    .topmais-benefits-grid {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
        gap: 16px;
    }

    .benefit-card,
    .benefit-experiencias-image,
    .benefit-shopping-image {
        min-height: 235px;
    }

    .benefit-sorteios,
    .benefit-experiencias-text,
    .benefit-experiencias-image,
    .benefit-economize,
    .benefit-online-image,
    .benefit-ganhe-pontos,
    .benefit-troque-pontos {
        grid-column: span 1;
    }

    .benefit-content,
    .benefit-soft,
    .benefit-purple {
        padding: 26px;
    }
}

.club-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.topmais-cookie-box {
    position: fixed;
    left: 24px;
    right: 24px;
    bottom: 18px;
    z-index: 1080;
    background: rgba(255,255,255,.98);
    border: 1px solid rgba(100,36,157,.18);
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(27, 18, 45, .16);
    padding: 16px 18px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}
.topmais-cookie-box strong { color: var(--topmais-purple); display:block; margin-bottom: 4px; }
.topmais-cookie-box p { margin: 0; font-size: .92rem; line-height: 1.45; color: #5f5a66; }
.topmais-cookie-actions { display: flex; gap: 10px; white-space: nowrap; }
@media(max-width: 768px) {
    .topmais-cookie-box { left: 12px; right: 12px; flex-direction: column; align-items: stretch; }
    .topmais-cookie-actions { justify-content: flex-end; }
}
.home-banner-link { display:block; text-decoration:none; }
.promo-ended-badge { position:absolute; top:14px; right:14px; background:#6f2da8; color:#fff; border-radius:999px; padding:6px 12px; font-weight:700; font-size:.78rem; }
.promo-card { position:relative; }
.promo-card.is-expired img { filter: grayscale(.4); opacity:.78; }

/* Ajuste 20260713b: menu lateral funcional no desktop e cliente logado no topo */
.club-logo img{width:100%;height:100%;object-fit:contain;display:block}.site-account-dropdown{justify-self:end;max-width:100%}.club-login.account-button{border:0;background:transparent;box-shadow:none;padding:0;font-weight:800;max-width:360px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.club-login.account-button::after{display:none}.account-menu{border-radius:14px;border:1px solid #eee;padding:.45rem 0;min-width:240px}.account-menu .dropdown-header{font-size:.95rem;color:#5b5864;border-bottom:1px solid #eee;padding:.75rem 1rem;font-weight:800}.account-menu .dropdown-item{font-size:.98rem;padding:.55rem 1rem;color:#42394e}.account-menu .dropdown-item:hover{background:#f5eefb;color:var(--topmais-purple)}.topmais-menu-drawer{border:0;border-radius:0 24px 24px 0;box-shadow:18px 0 60px rgba(48,20,77,.18)}.topmais-menu-drawer .offcanvas-title{color:var(--topmais-purple);font-weight:900}.drawer-section-title{font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;color:#91879c;font-weight:900;margin-bottom:10px}.drawer-user-name{background:#f7f1fc;border:1px solid #eadffc;border-radius:14px;padding:12px 14px;color:var(--topmais-purple);font-weight:900;margin-bottom:10px}.drawer-menu-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}.drawer-menu-list a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:14px;text-decoration:none;color:#4d3c5e;font-weight:750}.drawer-menu-list a span{font-size:1.35rem;line-height:1}.drawer-menu-list a:hover{background:#f5eefb;color:var(--topmais-purple)}.drawer-account-list a{font-weight:800}.hamburger-clean{cursor:pointer}.hamburger-clean:hover{color:var(--topmais-purple-dark);transform:translateX(2px)}
@media(max-width:575px){.club-login.account-button,.club-login{font-size:1rem;max-width:160px}.top-header-line{height:64px}.club-logo{width:48px;height:48px}}