@font-face {
    font-family: 'LocalizaDinDisplay';
    src: url('../fonts/localizadindisplay-light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LocalizaDinDisplay';
    src: url('../fonts/localizadindisplay-reg.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LocalizaDinDisplay';
    src: url('../fonts/localizadindisplay-bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --norte-navy: #003A5C;
    --norte-navy-dark: #002840;
    --norte-navy-light: #004A75;
    --norte-gold: #D58C04;
    --norte-gold-light: #E8A820;
    --norte-gold-dark: #B87600;
    --norte-gray: #252526;
    --green-primary: var(--norte-navy);
    --green-dark: var(--norte-navy);
    --green-darker: var(--norte-navy-dark);
    --green-accent: var(--norte-gold);
    --green-hover: var(--norte-navy-light);
    --green-light: var(--norte-gold-light);
    --orange: var(--norte-gold);
    --text-dark: var(--norte-gray);
    --bg-gray: #F2F2F2;
    --white: #FFFFFF;
    --border: #E0E0E0;
    --footer-gray: var(--norte-navy);
}

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 62.5%;
    scroll-behavior: smooth;
}

.sr-only {
    position: absolute;
    width: 0.1rem;
    height: 0.1rem;
    padding: 0;
    margin: -0.1rem;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

body {
    font-family: 'LocalizaDinDisplay', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 1.6rem;
    color: var(--text-dark);
    background: var(--white);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

a {
    text-decoration: none;
    color: inherit;
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 2.4rem;
}

/* ===== SITE HEADER ===== */
.site-header {
    position: relative;
    z-index: 2000;
}

/* ===== TOP BAR ===== */
.top-bar {
    display: none;
    background: var(--white);
}

@media (min-width: 1200px) {
    .top-bar {
        display: block;
    }
}

.top-bar__inner {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

.top-bar__tabs {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 59.1rem;
}

.top-bar__tab {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.8rem 1.6rem;
    flex: 1;
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.6rem;
    text-decoration: none;
    transition: opacity 0.2s;
}

.top-bar__tab:hover {
    opacity: 0.92;
}

.top-bar__tab--aluguel {
    background: var(--norte-navy);
    color: var(--white);
    border-radius: 0.5rem 0 0 0;
}

.top-bar__tab--frotas {
    background: var(--norte-gold);
    color: var(--norte-navy);
}

.top-bar__tab--seminovos {
    background: var(--white);
    color: var(--norte-navy);
    border-radius: 0 0.5rem 0 0;
    border: 0.1rem solid var(--border);
    border-bottom: none;
}

/* ===== NAVBAR ===== */
.navbar {
    background: var(--green-primary);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 5.6rem;
    z-index: 2000;
    display: grid;
    grid-template-columns: 1fr auto 6.5rem;
    grid-column-gap: 1.2rem;
    align-items: center;
}

@media (min-width: 1200px) {
    .navbar {
        position: relative;
        height: 8.5rem;
        grid-template-columns: minmax(11.5rem, 22rem) 1fr minmax(12rem, 20rem);
        box-shadow: 0 1.5rem 3rem -0.5rem rgba(0, 0, 0, 0.25);
    }

    body {
        padding-top: 0;
    }
}

@media (max-width: 1199px) {
    body {
        padding-top: 5.6rem;
    }
}

.navbar__logo {
    grid-column: 1 / 2;
    grid-row: 1;
    padding-left: 1.5rem;
    display: flex;
    align-items: center;
    min-width: 0;
}

@media (min-width: 1200px) {
    .navbar__logo {
        padding-left: 3.4rem;
    }
}

.navbar__logo a {
    display: flex;
    align-items: center;
    line-height: 0;
}

.navbar__logo img,
.logo--navbar {
    height: 2.4rem;
    width: auto;
    max-width: 14rem;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25));
}

@media (min-width: 1200px) {
    .navbar__logo img,
    .logo--navbar {
        height: 3.2rem;
        max-width: 18rem;
    }
}

.navbar__menu {
    display: none;
    grid-column: 2 / 3;
    grid-row: 1;
}

@media (min-width: 1200px) {
    .navbar__menu {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 2.2rem;
    }
}

.navbar__menu a {
    color: var(--white);
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
    padding: 0.5rem;
    text-decoration: none;
    line-height: 1.5rem;
    transition: color 0.2s;
}

.navbar__menu a:hover {
    color: var(--norte-gold);
}

/* Mobile: Minhas Reservas no centro-direita */
.navbar__actions--mobile {
    display: flex;
    grid-column: 2 / 3;
    grid-row: 1;
    justify-self: end;
    padding-right: 0.4rem;
}

@media (min-width: 1200px) {
    .navbar__actions--mobile {
        display: none;
    }
}

.navbar__mobile-reservations {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--white);
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
}

.navbar__mobile-reservations .material-icons {
    font-size: 2rem;
}

@media (max-width: 410px) {
    .navbar__mobile-reservations {
        font-size: 0;
        gap: 0;
    }

    .navbar__mobile-reservations .material-icons {
        font-size: 2.2rem;
    }
}

/* Desktop: ações à direita */
.navbar__actions--desktop {
    display: none;
    grid-column: 3 / 4;
    grid-row: 1;
    justify-self: start;
    padding-right: 3.4rem;
}

@media (min-width: 1200px) {
    .navbar__actions--desktop {
        display: grid;
        grid-template-rows: 2.4rem 2.4rem;
        row-gap: 0.8rem;
    }
}

.navbar__action {
    display: grid;
    grid-template-columns: 3rem 1fr;
    gap: 1.2rem;
    align-items: center;
}

.navbar__action a {
    color: var(--white);
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    transition: color 0.2s;
}

.navbar__action a:hover {
    color: var(--norte-gold);
}

.navbar__action-icon {
    width: 2.2rem;
    height: 2.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
}

.navbar__action-icon .material-icons {
    font-size: 2.2rem;
}

.navbar__register {
    position: relative;
    overflow: hidden;
    padding-bottom: 0.6rem;
    grid-template-columns: 3rem auto auto 1fr;
    gap: 0;
}

.navbar__register .navbar__action-icon {
    grid-column: 1;
}

.navbar__divider {
    color: var(--white);
    font-size: 1.2rem;
    padding: 0 0.4rem;
}

.navbar__register::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0.2rem;
    background: linear-gradient(to right, var(--norte-navy), var(--norte-gold));
    animation: borderMove 2s linear infinite;
}

@keyframes borderMove {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

.navbar__hamburger {
    grid-column: 3 / 4;
    grid-row: 1;
    justify-self: center;
    background: none;
    border: none;
    color: var(--white);
    cursor: pointer;
    padding: 0.8rem;
    font-size: 2.4rem;
    line-height: 1;
}

@media (min-width: 1200px) {
    .navbar__hamburger {
        display: none;
    }
}

/* Mobile menu overlay */
.mobile-menu {
    display: none;
    position: fixed;
    top: 5.6rem;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--norte-navy-dark);
    z-index: 1999;
    overflow-y: auto;
    padding: 0;
}

.mobile-menu.open {
    display: block;
}

.mobile-menu a {
    display: block;
    color: var(--white);
    font-size: 1.4rem;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    padding: 1.8rem 2.4rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.mobile-menu a:hover {
    color: var(--norte-gold);
    background: rgba(255, 255, 255, 0.04);
}

.mobile-menu__auth {
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin-top: 1rem;
}

.mobile-menu__auth a {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

/* Logo variants (footer / app) */
.logo {
    display: block;
    object-fit: contain;
}

.logo--footer {
    height: 4.8rem;
    width: auto;
    max-width: 20rem;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25));
}

.logo--app {
    height: 5.6rem;
    width: auto;
    max-width: 24rem;
    margin-bottom: 2rem;
}

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

@media (min-width: 1200px) {
    .footer-app__brand {
        text-align: left;
    }
}

/* ===== SEARCH BAR (header integrado) ===== */
.search-bar {
    background: var(--green-primary);
    padding: 1.6rem 2.4rem 2rem;
}

@media (min-width: 1200px) {
    .search-bar {
        padding: 2rem 3.4rem 2.4rem;
    }
}

.search-bar__inner {
    max-width: 1140px;
    margin: 0 auto;
}

.search-form--header .search-form__label {
    color: var(--white);
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 0.6rem;
}

.search-form--header .search-form__input,
.search-form--header .search-form__select {
    height: 5.4rem;
    border: none;
    border-radius: 0.4rem;
    background: var(--white);
    color: var(--text-dark);
}

.search-form--header .search-form__input-wrap .material-icon {
    color: var(--norte-navy);
}

.search-form__row {
    margin-bottom: 1.2rem;
}

.search-form__row--dates {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.2rem;
}

@media (min-width: 768px) {
    .search-form__row--dates {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (min-width: 1200px) {
    .search-form--header {
        display: grid;
        grid-template-columns: 2fr repeat(4, 1fr);
        gap: 1.2rem;
        align-items: end;
    }

    .search-form__row--location {
        grid-column: 1;
        grid-row: 1;
        margin-bottom: 0;
    }

    .search-form__row--dates {
        display: contents;
    }

    .search-form__row--dropoff {
        grid-column: 1 / span 2;
        grid-row: 2;
        margin-bottom: 0;
    }

    .search-form__row--action {
        grid-column: 3 / -1;
        grid-row: 2;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        gap: 1.6rem;
        margin-bottom: 0;
    }

    .search-form__row--action .btn-search {
        width: auto;
        min-width: 18rem;
        flex-shrink: 0;
    }
}

.search-form--header .search-form__checkbox {
    color: var(--norte-gold);
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0;
}

.search-form--header .btn-search {
    height: 5.4rem;
    margin-top: 0;
}

/* ===== HERO BANNER ===== */
.hero-banner {
    background: var(--bg-gray);
}

.hero-banner__carousel {
    position: relative;
    overflow: hidden;
}

.hero-banner__track {
    display: flex;
    transition: transform 0.5s ease;
}

.hero-banner__slide {
    min-width: 100%;
}

.hero-banner__slide img {
    width: 100%;
    height: 38rem;
    object-fit: cover;
    display: block;
}

@media (min-width: 1200px) {
    .hero-banner__slide img {
        height: 44rem;
    }
}

.hero-banner__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 4.8rem;
    height: 4.8rem;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.92);
    color: var(--green-primary);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0.2rem 1.2rem rgba(0, 0, 0, 0.15);
    transition: background 0.2s;
    z-index: 2;
}

.hero-banner__arrow:hover {
    background: var(--white);
}

.hero-banner__arrow--prev { left: 1.6rem; }
.hero-banner__arrow--next { right: 1.6rem; }

.hero-banner__arrow .material-icons {
    font-size: 3.2rem;
}

.hero-banner__dots {
    position: absolute;
    bottom: 1.6rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.8rem;
    z-index: 2;
}

.hero-banner__dot {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
}

.hero-banner__dot.active {
    background: var(--white);
    transform: scale(1.15);
}

.hero-banner__promo {
    text-align: center;
    padding: 1.6rem;
    background: var(--white);
}

.hero-banner__promo a {
    color: var(--green-primary);
    font-size: 1.4rem;
    font-weight: 700;
    text-decoration: underline;
}

/* Search form base (legacy sections) */
.search-form__field {
    margin-bottom: 0;
}

.search-form__input-wrap {
    position: relative;
}

.search-form__input-wrap .material-icon {
    position: absolute;
    left: 1.6rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 2rem;
}

.search-form__input-wrap .search-form__input {
    padding-left: 4.8rem;
    width: 100%;
}

.search-form__input,
.search-form__select {
    width: 100%;
    font-family: inherit;
    font-size: 1.4rem;
    outline: none;
}

.search-form__checkbox {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.search-form__checkbox input {
    width: 1.6rem;
    height: 1.6rem;
    accent-color: var(--norte-gold);
}

.btn-search {
    width: 100%;
    background: var(--norte-gold);
    color: var(--norte-navy);
    border: none;
    border-radius: 0.4rem;
    font-family: inherit;
    font-size: 1.4rem;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.btn-search:hover {
    background: var(--norte-gold-light);
    color: var(--norte-navy);
}

/* ===== BANNERS ===== */
.banners {
    padding: 4rem 0;
}

.banners__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.6rem;
}

@media (min-width: 768px) {
    .banners__grid {
        grid-template-columns: 1fr 1fr;
    }
}

.banners__item {
    border-radius: 0.8rem;
    overflow: hidden;
    transition: transform 0.2s, box-shadow 0.2s;
}

.banners__item:hover {
    transform: translateY(-2px);
    box-shadow: 0 0.8rem 2.4rem rgba(0, 0, 0, 0.15);
}

.banners__item img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.banners__carousel {
    position: relative;
    overflow: hidden;
    border-radius: 0.8rem;
}

.banners__carousel-track {
    display: flex;
    transition: transform 0.5s ease;
}

.banners__carousel-slide {
    min-width: 100%;
}

.banners__carousel-slide img {
    width: 100%;
    height: 30rem;
    object-fit: cover;
}

@media (min-width: 768px) {
    .banners__carousel-slide img {
        height: 38rem;
    }
}

.banners__carousel-dots {
    display: flex;
    justify-content: center;
    gap: 0.8rem;
    margin-top: 1.6rem;
}

.banners__dot {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: #ccc;
    border: none;
    cursor: pointer;
    transition: background 0.2s;
}

.banners__dot.active {
    background: var(--green-primary);
}

/* ===== SECTION COMMON ===== */
.section {
    padding: 4.8rem 0;
}

.section__title {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--text-dark);
    margin-bottom: 1.6rem;
}

.section__subtitle {
    font-size: 1.6rem;
    color: #666;
    margin-bottom: 3.2rem;
}

.section__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.6rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.section__link {
    color: var(--green-primary);
    font-size: 1.4rem;
    font-weight: 700;
    transition: color 0.2s;
}

.section__link:hover {
    color: var(--green-hover);
    text-decoration: underline;
}

/* ===== MOBILITY SOLUTIONS ===== */
.solutions {
    background: var(--white);
}

.solutions__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.6rem;
}

@media (min-width: 576px) {
    .solutions__grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 992px) {
    .solutions__grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

.solution-card {
    border: 0.1rem solid var(--border);
    border-radius: 0.8rem;
    padding: 2.4rem;
    transition: box-shadow 0.2s, border-color 0.2s;
    cursor: pointer;
}

.solution-card:hover {
    box-shadow: 0 0.4rem 1.6rem rgba(0, 0, 0, 0.1);
    border-color: var(--norte-navy);
}

.solution-card__icon {
    width: 4.8rem;
    height: 4.8rem;
    margin-bottom: 1.6rem;
    color: var(--norte-navy);
}

.solution-card__title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--norte-navy);
    margin-bottom: 0.8rem;
    transition: color 0.2s;
}

.solution-card:hover .solution-card__title {
    color: var(--norte-gold);
}

.solution-card__desc {
    font-size: 1.4rem;
    color: var(--norte-gray);
    line-height: 1.4;
}

/* ===== HIGHLIGHTS ===== */
.highlights {
    background: var(--bg-gray);
}

.highlights__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.4rem;
}

@media (min-width: 768px) {
    .highlights__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.highlight-card {
    background: var(--white);
    border-radius: 0.8rem;
    padding: 2.4rem;
    display: flex;
    gap: 1.6rem;
    align-items: flex-start;
    transition: box-shadow 0.2s;
}

.highlight-card:hover {
    box-shadow: 0 0.4rem 1.6rem rgba(0, 0, 0, 0.08);
}

.highlight-card__icon {
    flex-shrink: 0;
    width: 6.4rem;
    height: 6.4rem;
}

.highlight-card__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.highlight-card__title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--norte-navy);
    margin-bottom: 0.8rem;
}

.highlight-card__desc {
    font-size: 1.4rem;
    color: var(--norte-gray);
    margin-bottom: 1.2rem;
    line-height: 1.4;
}

.highlight-card__link {
    color: var(--norte-gold);
    font-size: 1.4rem;
    font-weight: 700;
    transition: color 0.2s;
}

.highlight-card__link:hover {
    color: var(--norte-gold-dark);
    text-decoration: underline;
}

/* ===== FLEET ===== */
.fleet {
    background: var(--white);
}

.fleet__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.4rem;
}

@media (min-width: 576px) {
    .fleet__grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 992px) {
    .fleet__grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

.fleet-card {
    border: 0.1rem solid var(--border);
    border-radius: 0.8rem;
    overflow: hidden;
    transition: box-shadow 0.2s;
    cursor: pointer;
}

.fleet-card:hover {
    box-shadow: 0 0.4rem 1.6rem rgba(0, 0, 0, 0.12);
}

.fleet-card__image {
    height: 16rem;
    background: var(--bg-gray);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.6rem;
}

.fleet-card__image svg {
    width: 80%;
    height: auto;
    opacity: 0.6;
    transition: opacity 0.2s;
}

.fleet-card:hover .fleet-card__image svg {
    opacity: 1;
}

.fleet-card__body {
    padding: 1.6rem;
}

.fleet-card__group {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--green-primary);
    text-transform: uppercase;
    margin-bottom: 0.4rem;
}

.fleet-card__name {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--text-dark);
    margin-bottom: 0.4rem;
}

.fleet-card__models {
    font-size: 1.3rem;
    color: #888;
    margin-bottom: 1.2rem;
}

.fleet-card__price {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--green-primary);
}

/* ===== DESTINATIONS ===== */
.destinations {
    background: var(--bg-gray);
}

.destinations__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.6rem;
}

@media (min-width: 576px) {
    .destinations__grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 992px) {
    .destinations__grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

.dest-card {
    position: relative;
    border-radius: 0.8rem;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.dest-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 0.8rem 2.4rem rgba(0, 0, 0, 0.2);
}

.dest-card__image {
    height: 20rem;
    overflow: hidden;
}

.dest-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.dest-card:hover .dest-card__image img {
    transform: scale(1.05);
}

.dest-card__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.75));
    padding: 3.2rem 1.6rem 1.6rem;
}

.dest-card__title {
    color: var(--white);
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.3;
}

.destinations__cta {
    text-align: center;
    margin-top: 3.2rem;
}

.destinations__cta a {
    color: var(--green-primary);
    font-size: 1.4rem;
    font-weight: 700;
    transition: color 0.2s;
}

.destinations__cta a:hover {
    color: var(--green-hover);
    text-decoration: underline;
}

/* ===== FOOTER APP ===== */
.footer-app {
    background: var(--footer-gray);
    padding: 4.8rem 0;
}

@media (min-width: 1200px) {
    .footer-app {
        background: var(--bg-gray);
        padding-top: 6.4rem;
    }
}

.footer-app__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3.2rem;
    align-items: center;
}

@media (min-width: 992px) {
    .footer-app__inner {
        grid-template-columns: 1fr 1fr;
    }
}

.footer-app__title {
    color: var(--green-primary);
    font-size: 2rem;
    line-height: 2.4rem;
    font-weight: 700;
}

@media (max-width: 1199px) {
    .footer-app__title {
        color: var(--white);
    }
}

.footer-app__text {
    color: var(--text-dark);
    font-size: 1.6rem;
    line-height: 2rem;
    margin-top: 3.2rem;
    max-width: 44rem;
}

@media (max-width: 1199px) {
    .footer-app__text {
        color: rgba(255, 255, 255, 0.8);
    }
}

.footer-app__stores {
    display: flex;
    gap: 1.2rem;
    margin: 3.2rem 0 4rem;
    flex-wrap: wrap;
}

.footer-app__store {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    background: #333;
    color: var(--white);
    padding: 0.8rem 1.6rem;
    border-radius: 0.4rem;
    font-size: 1.2rem;
    transition: background 0.2s;
}

@media (min-width: 1200px) {
    .footer-app__store {
        background: var(--text-dark);
    }
}

.footer-app__store:hover {
    background: var(--green-primary);
}

.footer-app__social-title {
    color: var(--text-dark);
    font-size: 1.6rem;
    text-transform: uppercase;
    margin-bottom: 1.2rem;
}

@media (max-width: 1199px) {
    .footer-app__social-title {
        color: var(--white);
    }
}

.footer-app__social {
    display: flex;
    gap: 2.4rem;
    margin-bottom: 4.8rem;
}

@media (min-width: 1200px) {
    .footer-app__social {
        margin-bottom: 0;
    }
}

.footer-app__social a {
    color: var(--text-dark);
    font-size: 2.4rem;
    transition: color 0.2s;
}

@media (max-width: 1199px) {
    .footer-app__social a {
        color: rgba(255, 255, 255, 0.7);
    }
}

.footer-app__social a:hover {
    color: var(--green-accent);
}

.footer-app__phone {
    display: flex;
    justify-content: center;
}

.footer-app__phone img {
    max-height: 40rem;
    width: auto;
}

/* ===== FOOTER INSTITUTIONAL ===== */
.footer-inst {
    background: var(--norte-navy);
    color: var(--white);
    padding: 3rem 0;
}

@media (min-width: 1200px) {
    .footer-inst {
        padding: 2.5rem 0;
    }
}

.footer-inst__grid {
    display: grid;
    gap: 2.4rem;
    grid-template-areas:
        "links-opt"
        "links-col"
        "links-inst"
        "copyright";
}

@media (min-width: 1200px) {
    .footer-inst__grid {
        grid-template-columns: 4fr 1fr;
        column-gap: 6rem;
        row-gap: 1.5rem;
        grid-template-areas:
            "logo outros"
            "links-opt outros"
            "links-col outros"
            "informacoes outros"
            "links-inst outros"
            "copyright outros";
    }
}

.footer-inst__logo {
    grid-area: logo;
    display: none;
}

@media (min-width: 1200px) {
    .footer-inst__logo {
        display: block;
    }

    .footer-inst__logo img,
    .footer-inst__logo .logo--footer {
        height: 4.8rem;
        max-width: 20rem;
        filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25));
    }
}

.footer-inst__links-opt {
    grid-area: links-opt;
}

.footer-inst__links-col {
    grid-area: links-col;
}

.footer-inst__informacoes {
    grid-area: informacoes;
}

.footer-inst__links-inst {
    grid-area: links-inst;
}

.footer-inst__copyright {
    grid-area: copyright;
}

.footer-inst__outros {
    grid-area: outros;
}

.footer-links-inline {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0;
    list-style: none;
    padding: 0;
    max-width: 600px;
    margin: 0 auto;
}

@media (min-width: 1200px) {
    .footer-links-inline {
        justify-content: flex-start;
        margin: 0;
    }
}

.footer-links-inline li::after {
    content: '|';
    padding: 0 0.8rem;
    color: var(--norte-gold);
}

.footer-links-inline li:last-child::after {
    content: none;
}

.footer-links-inline a {
    color: var(--white);
    font-size: 1.4rem;
    transition: color 0.2s;
}

.footer-links-inline a:hover {
    color: var(--norte-gold);
}

.footer-tabs {
    margin: 1rem 0;
}

.footer-tabs__header {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    border-bottom: 0.1rem solid var(--norte-gold);
    padding-bottom: 0.8rem;
    margin-bottom: 0;
}

.footer-tabs__tab {
    background: none;
    border: none;
    color: var(--white);
    font-family: inherit;
    font-size: 1.4rem;
    font-weight: 700;
    padding: 0.8rem 1.6rem;
    cursor: pointer;
    transition: color 0.2s;
    text-transform: uppercase;
}

.footer-tabs__tab:hover,
.footer-tabs__tab.active {
    color: var(--norte-gold);
}

.footer-tabs__panel {
    display: none;
    background: var(--norte-navy-dark);
    padding: 1.5rem 0;
    border-top: 0.1rem solid var(--norte-gold);
}

.footer-tabs__panel.active {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}

@media (min-width: 1200px) {
    .footer-tabs__header {
        display: none;
    }

    .footer-tabs__panels-desktop {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
        border-top: 0.1rem solid var(--norte-gold);
        background: var(--norte-navy-dark);
    }

    .footer-tabs__panel {
        display: block !important;
        border-top: none;
        padding: 1.5rem 0;
    }

    .footer-tabs__panel-title {
        display: block;
        color: var(--norte-gold);
        font-size: 1.4rem;
        font-weight: 700;
        text-transform: uppercase;
        padding: 0 1rem 1.2rem;
    }

    .footer-tabs__panel.active {
        display: block;
    }
}

@media (max-width: 1199px) {
    .footer-tabs__panels-desktop {
        display: contents;
    }

    .footer-tabs__panel-title {
        display: none;
    }
}

.footer-tabs__panel a {
    display: block;
    color: var(--white);
    font-size: 1.4rem;
    padding: 0.8rem 1rem 1.5rem;
    text-align: center;
    transition: color 0.2s;
}

@media (min-width: 1200px) {
    .footer-tabs__panel a {
        text-align: left;
    }

    .footer-tabs__panel a:first-child {
        padding-top: 1.5rem;
    }
}

.footer-tabs__panel a:hover {
    color: var(--norte-gold);
}

.footer-contacts {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 2.4rem 0;
    font-size: 1.4rem;
}

@media (min-width: 1200px) {
    .footer-contacts {
        flex-direction: row;
        gap: 2rem;
    }
}

.footer-contacts__item {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
}

.footer-contacts__link {
    color: var(--white);
    font-weight: 700;
    transition: color 0.2s;
}

.footer-contacts__link:hover {
    color: var(--norte-gold);
}

.footer-inst__links-inst .footer-links-inline {
    flex-direction: column;
    align-items: center;
}

@media (min-width: 1200px) {
    .footer-inst__links-inst .footer-links-inline {
        flex-direction: row;
        align-items: center;
    }
}

.footer-copyright {
    font-size: 1.2rem;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.8;
    text-align: center;
}

@media (min-width: 1200px) {
    .footer-copyright {
        text-align: left;
    }
}

.footer-copyright a {
    color: rgba(255, 255, 255, 0.7);
    transition: color 0.2s;
}

.footer-copyright a:hover {
    color: var(--norte-gold);
}

.footer-outros__title {
    text-transform: uppercase;
    margin-bottom: 2rem;
    font-size: 1.4rem;
    font-weight: 700;
}

.footer-outros__site {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    background: var(--white);
    border-radius: 0.8rem;
    padding: 0.8rem;
    margin-top: 2.2rem;
    max-width: 232px;
    transition: box-shadow 0.2s;
}

.footer-outros__site:hover {
    box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.2);
}

.footer-outros__site img {
    height: 2.4rem;
    width: auto;
}

.footer-outros__site--brand {
    max-width: 220px;
    padding: 1.4rem 1.6rem;
    background: rgba(255, 255, 255, 0.95);
}

.footer-outros__site--brand img {
    height: auto;
    max-height: 5.6rem;
    width: 100%;
    object-fit: contain;
}

/* Material Icons fallback */
.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
}
