/* ============================================================
   B-School landing page — desktop layout
   ============================================================ */

body {
    font-family: var(--font-sans);
    font-weight: 300;
    color: var(--color-muted);
    background: var(--color-white);
}

/* ---- Layout helpers ---- */
.container {
    width: min(var(--container-w), 100% - (var(--container-pad) * 2));
    margin-inline: auto;
}

.eyebrow {
    font-family: var(--font-sans);
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 1.26px;
    text-transform: uppercase;
    color: var(--color-maroon);
}

/* ---- Buttons ---- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-serif);
    font-size: 24px;
    line-height: 1;
    border-radius: var(--radius-pill);
    padding: 22px 32px;
    transition:
        transform 0.15s ease,
        background-color 0.2s ease,
        color 0.2s ease;
    white-space: nowrap;
}
.btn:hover {
    transform: translateY(-1px);
}

.btn--primary {
    background: var(--color-maroon);
    color: var(--color-white);
}
.btn--primary:hover {
    background: #7d2417;
}

.btn--outline {
    border: 1px solid var(--color-maroon);
    color: var(--color-maroon);
    background: transparent;
}
.btn--outline:hover {
    background: var(--color-maroon);
    color: var(--color-white);
}

.btn--sm {
    font-size: 18px;
    padding: 13px 32px;
}

/* ============================================================
   NAV
   ============================================================ */
.site-nav {
    position: fixed;
    top: 56px;
    left: 0;
    right: 0;
    z-index: 100;
    display: flex;
    justify-content: center;
}
.site-nav__inner {
    position: relative;
    width: min(var(--container-w), 100% - (var(--container-pad) * 2));
    height: 68px;
    padding: 0 20px 0 0;
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: var(--radius-pill);
}
/* Frosted fill as a pseudo-element, inset on the left so it starts behind the
   opaque part of the overhanging circular logo. The left corners are squared
   (only the right end stays rounded) so the fill's left edge is a straight
   vertical line that tucks fully behind the logo — a rounded left cap would
   otherwise bulge past the logo's circular edge near the top/bottom and show
   as a small curve beside the logo. */
.site-nav__inner::before {
    content: "";
    position: absolute;
    inset: 0 0 0 52px;
    border-radius: 0 var(--radius-pill) var(--radius-pill) 0;
    background: var(--nav-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    z-index: -1;
}
.site-nav__logo {
    width: 100px;
    height: 100px;
    margin-left: -1px;
    margin-top: -17px;
    flex-shrink: 0;
}
.site-nav__logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.nav-links {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    gap: 24px;
    font-size: 17px;
}
.nav-links a {
    color: var(--color-muted);
    transition: color 0.2s ease;
}
.nav-links a:hover {
    color: var(--color-maroon);
}
.nav-links a.is-active {
    color: var(--color-maroon);
    font-weight: 700;
}

.site-nav__cta {
    flex-shrink: 0;
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
    padding-top: 136px;
    padding-bottom: 64px;
    background: var(--color-white);
    overflow: hidden;
}
.hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 690px) minmax(0, 1fr);
    align-items: center;
    gap: 30px;
}
.hero__eyebrow {
    margin-bottom: 22px;
}
.hero__title {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h1-size);
    line-height: var(--h1-lh);
    letter-spacing: var(--h1-tracking);
    color: var(--color-ink);
    max-width: 596px;
    margin-bottom: 26px;
}
.hero__sub {
    font-size: 24px;
    line-height: 31.5px;
    color: var(--color-muted);
    max-width: 498px;
    margin-bottom: 24px;
}
.hero__body {
    font-size: 15px;
    line-height: 24px;
    color: var(--color-muted);
    max-width: 525px;
    margin-bottom: 14px;
}
.hero__note {
    font-size: 11px;
    line-height: 17px;
    color: var(--color-muted);
    margin-bottom: 30px;
}
.hero__cta {
    display: flex;
    gap: 12px;
    flex-wrap: nowrap;
}
.hero__media {
    justify-self: end;
    margin-right: -60px;
    perspective: 1100px;
}
.hero__media img {
    width: 700px;
    max-width: none;
    height: 636px;
    object-fit: cover;
    object-position: center;
    transform: rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg))
        scale(var(--tilt-s, 1));
    transform-style: preserve-3d;
    transition: transform 0.3s ease-out;
    will-change: transform;
}

.scroll-cue {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    margin-top: 14px;
    color: var(--color-muted);
}
.scroll-cue span {
    font-size: 9.5px;
    letter-spacing: 1.8px;
    text-transform: uppercase;
}
.scroll-cue i {
    width: 8px;
    height: 8px;
    border-right: 1px solid var(--color-arrow);
    border-bottom: 1px solid var(--color-arrow);
    transform: rotate(45deg);
}

/* ---- Shared section heading ---- */
.section-head {
    text-align: center;
    margin-inline: auto;
}
.section-head h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    letter-spacing: var(--h2-tracking);
    color: var(--color-ink);
}
.section-head p {
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: var(--color-muted);
    margin-top: 16px;
}

/* ============================================================
   DIFERENCIAIS
   ============================================================ */
/* Full-bleed gray panel; its 50px top corners round over the hero above */
.diferenciais {
    position: relative;
    margin-top: -40px;
}
.diferenciais__panel {
    background: #f7f7f7;
    border-radius: var(--radius-pill);
    padding: 100px 48px;
}
.diferenciais .section-head {
    max-width: 1040px;
    margin-bottom: 72px;
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 60px;
    row-gap: 48px;
    max-width: 998px;
    margin-inline: auto;
}
.feature-card {
    position: relative;
    min-height: 190px;
    padding: 26px 26px 26px 100px;
    background: var(--color-white);
    border-radius: var(--radius-card);
    box-shadow: 0 4px 14px 0 #e3e3e3;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
.feature-card__ico {
    position: absolute;
    left: -52px;
    top: 40px;
    transform: translateY(-50%);
    width: 156px;
    height: auto;
    mix-blend-mode: multiply;
    pointer-events: none;
}
.feature-card h3 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h3-size);
    line-height: var(--h3-lh);
    color: var(--color-ink);
    margin-bottom: 8px;
}
.feature-card p {
    font-size: var(--label-size);
    line-height: var(--label-lh);
    color: var(--color-muted);
    max-width: 161px;
}

/* ============================================================
   METHOD (QCER)
   ============================================================ */
.method {
    background: #1f2769;
    /* Flat bottom: the Idiomas panel overlaps and sits in front, so the navy
     reads as a clean bleed behind that panel's rounded top (not a double curve). */
    border-radius: var(--radius-pill) var(--radius-pill) 0 0;
    padding: 100px 0 90px;
    overflow: hidden;
    color: var(--color-white);
}
.eyebrow--light {
    color: var(--color-white);
}
.method__intro {
    text-align: center;
}
.method__intro .eyebrow {
    margin-bottom: 24px;
}
.method__intro h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    letter-spacing: var(--h2-tracking);
}
.method__body {
    max-width: 897px;
    margin: 24px auto 0;
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
}

/* Light-blue band */
.method__band {
    position: relative;
    margin-top: 44px;
    background: #9fccf9;
    padding: 46px 0 40px;
}
/* Horizontal scroller wraps BOTH the cards and their group labels so the
   labels track the cards as they scroll (matches the Figma grouping). */
.levels-scroll {
    overflow-x: auto;
    scrollbar-width: none;
    scroll-behavior: smooth;
    padding: 44px 90px 8px;
}
.levels-scroll::-webkit-scrollbar {
    display: none;
}

.levels {
    display: flex;
    align-items: flex-start;
    gap: 61px;
    width: max-content;
}

.level-card {
    position: relative;
    flex: 0 0 292px;
    min-height: 240px;
    background: var(--color-white);
    border-radius: var(--radius-card);
    box-shadow: 0 4px 14px 0 #8388b4;
    padding: 54px 24px 24px;
    text-align: center;
    display: flex;
    flex-direction: column;
}
/* Active cards carry a note at the bottom, so their content starts higher
   (matches Figma) to keep the paragraph from touching the highlight. */
.level-card--active {
    border: 3px solid #1d2767;
    padding-top: 38px;
}

/* Badge PNGs are 321×300 — keep the intrinsic ratio so the circle stays round */
.level-card__badge {
    position: absolute;
    top: -41px;
    left: -28px;
    height: 97px;
    width: auto;
    pointer-events: none;
}
.level-bars {
    position: absolute;
    top: 10px;
    left: 74px;
    right: 44px;
    display: flex;
    gap: 3px;
}
.level-bars i {
    flex: 1 0 0;
    height: 7px;
    border-radius: 20px;
    border: 1px solid #1d2767;
}
.level-bars i.on {
    background: #1d2767;
}

.level-card h3 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h3-size);
    line-height: var(--h3-lh);
    color: var(--color-ink);
    margin-bottom: 12px;
}
.level-card p {
    font-size: var(--label-size);
    line-height: var(--label-lh);
    color: var(--color-ink);
    max-width: 216px;
    margin-inline: auto;
}
/* Note anchors to the card bottom and bleeds to the card's OUTER edge (over the
   3px active border): padding 24 + border 3 = 27. Its corner radius equals the
   card's outer radius, so its rounded corners coincide exactly with the card's —
   no white background can peek through at the bottom corners. */
.level-card__note {
    margin: auto -27px -27px;
    padding: 12px 20px;
    background: #1d2767;
    color: var(--color-white);
    font-weight: 700;
    font-size: 13px;
    line-height: 16px;
    border-radius: 0 0 var(--radius-card) var(--radius-card);
}

/* Carousel arrows — centered on the blue band's bottom edge (per Figma) */
.levels-nav {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 50%);
    display: flex;
    gap: 14px;
    z-index: 2;
}
.levels-nav button {
    width: 41px;
    height: 41px;
    border-radius: 50%;
    background: var(--color-maroon);
    color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease;
}
.levels-nav__ico {
    height: 18px;
    width: auto;
    display: block;
}
.levels-nav__ico--next {
    transform: scaleX(-1);
}
.levels-nav button:hover {
    background: #7d2417;
}

/* Group labels — one label centered under each pair of level cards.
   Track shares the cards' width/gap so labels sit under their pair. */
.level-groups {
    display: flex;
    gap: 61px;
    width: max-content;
    margin-top: 30px;
}
.level-groups span {
    flex: 0 0 645px;
    display: flex;
    align-items: center;
    gap: 16px;
    color: var(--color-ink);
    font-weight: 300;
    font-size: var(--body-size);
    white-space: nowrap;
    justify-content: center;
}
.level-groups span::before,
.level-groups span::after {
    content: "";
    flex: 1;
    border-top: 1px solid #4a5a86;
}

/* Accordion */
.method__accordion {
    max-width: 982px;
    margin: 60px auto 0;
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.acc-item {
    background: #f7f7f7;
    border-radius: 32px; /* same radius open & closed to avoid toggle jitter */
    padding: 0 32px;
}
.acc-item[open] {
    padding-bottom: 40px;
}
.acc-item:not([open]) {
    border: 1px solid #1f2768;
}
.acc-item summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 0;
    font-family: var(--font-serif);
    font-size: var(--h3a-size);
    line-height: var(--h3a-lh);
    color: #17578b;
}
.acc-item summary::-webkit-details-marker {
    display: none;
}
.acc-item summary::after {
    content: "";
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    background:
        linear-gradient(#17578b, #17578b) center/16px 2px no-repeat,
        linear-gradient(#17578b, #17578b) center/2px 16px no-repeat;
}
.acc-item[open] summary::after {
    background: linear-gradient(#1e2669, #1e2669) center/16px 2px no-repeat;
}
.acc-body {
    display: flex;
    flex-direction: column;
    gap: 42px;
    text-align: left;
}
.acc-body .btn {
    align-self: center;
}
.acc-body p {
    font-weight: 300;
    font-size: 20px;
    line-height: 26px;
    color: var(--color-muted);
}

/* ---- Shared centered body copy ---- */
.lead {
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: var(--color-muted);
    text-align: center;
    margin-inline: auto;
}
.center {
    text-align: center;
}
.mt-btn {
    margin-top: 44px;
}

/* ============================================================
   IDIOMAS
   ============================================================ */
/* Full-bleed gray panel sits in FRONT of the navy method section and overlaps
   its (now flat) bottom, so a little navy bleeds behind the panel's rounded top. */
.idiomas {
    position: relative;
    z-index: 2;
    margin-top: -54px;
}
.idiomas__panel {
    background: #f7f7f7;
    border-radius: var(--radius-pill);
    padding: 90px 48px;
    text-align: center;
}
.idiomas h2,
.modalidades h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    letter-spacing: var(--h2-tracking);
    color: var(--color-ink);
}
.idiomas > .idiomas__panel > .lead {
    max-width: 809px;
    margin-top: 20px;
}

.chips {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 28px;
    margin-top: 56px;
    flex-wrap: nowrap;
}
.chip {
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 68px;
    padding: 0 38px 0 92px;
    white-space: nowrap;
    background: var(--color-white);
    border-radius: var(--radius-pill);
    box-shadow: 0 4px 14px 0 #e3e3e3;
    font-family: var(--font-serif);
    font-size: var(--h3a-size);
    color: #1f2769;
}
.chip--outline {
    border: 1px solid #1f276b;
}
.chip img {
    position: absolute;
    left: -26px;
    bottom: 0;
    width: 120px;
    height: auto;
    mix-blend-mode: multiply;
    pointer-events: none;
}
.chip--italiano img {
    mix-blend-mode: normal;
}
/* Vertical connector dropping from the Italiano chip down to the bridge below */
.chip--italiano::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: 52px;
    background: #1f2669;
}

.bridge {
    position: relative;
    max-width: 943px;
    margin: 52px auto 0;
    padding: 20px 40px;
    border: 1px solid #1f2669;
    border-radius: var(--radius-pill);
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: #1f266a;
}
.bridge b {
    font-weight: 700;
}
.idiomas__note {
    margin-top: 36px;
}

/* ============================================================
   MODALIDADES
   ============================================================ */
.modalidades {
    padding: 80px 0;
    text-align: center;
}
.modalidades .lead {
    max-width: 865px;
    margin-top: 18px;
}

.format-grid {
    display: flex;
    justify-content: center;
    gap: 34px;
    margin-top: 72px;
}
.format-card {
    position: relative;
    width: 280px;
    padding: 74px 24px 24px;
    background: var(--color-white);
    border-radius: var(--radius-card);
    box-shadow: 0 4px 14px 0 #e3e3e3;
    text-align: center;
}
.format-card__ico {
    position: absolute;
    top: -50px;
    left: 50%;
    transform: translateX(-50%);
    width: 122px;
    height: auto;
    pointer-events: none;
}
.format-card h3 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h3-size);
    line-height: var(--h3-lh);
    color: #20296c;
    margin-bottom: 12px;
}
.format-card p {
    font-size: var(--label-size);
    line-height: var(--label-lh);
    color: var(--color-muted);
}

.band-note {
    max-width: 1031px;
    margin: 44px auto 0;
    padding: 14px 32px;
    background: #f7f7f7;
    border: 1px solid #20296c;
    border-radius: 30px;
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: #1f286b;
}
.band-note b {
    font-weight: 700;
}
.modalidades__fine {
    max-width: 900px;
    margin: 24px auto 0;
    font-size: var(--label-size);
    line-height: var(--label-lh);
    color: var(--color-muted);
}

/* ============================================================
   EMPRESAS (B2B)
   ============================================================ */
.empresas {
    padding: 20px 0 136px; /* ~96px gap to Intercambio after the -40px overlap */
}
.empresas__card {
    position: relative;
    background: #1f2769;
    border-radius: var(--radius-pill);
    box-shadow: 0 4px 7px #b8b8b8;
    min-height: 387px;
    display: grid;
    grid-template-columns: 572px 1fr;
    align-items: center;
}
.empresas__photo {
    align-self: stretch;
    margin: -16px 0;
    border-radius: var(--radius-pill);
    overflow: hidden;
    box-shadow: 0 4px 14px 0 rgba(31, 39, 105, 0.18);
}
.empresas__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.empresas__text {
    padding: 40px 60px 40px 62px;
    color: var(--color-white);
}
.empresas__text h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    letter-spacing: var(--h2-tracking);
    margin-bottom: 16px;
}
.empresas__text p {
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    max-width: 529px;
    margin-bottom: 28px;
}
.btn--white {
    background: var(--color-white);
    color: var(--color-maroon);
}
.btn--white:hover {
    background: #f0e9e7;
}
.btn--navy {
    background: #1f2769;
    color: var(--color-white);
}
.btn--navy:hover {
    background: #182052;
}

/* ============================================================
   INTERCAMBIO (red feature)
   ============================================================ */
/* Full-bleed maroon panel; rounded top rounds over the (white) empresas section.
   Flat bottom: the Quem Somos panel overlaps in front, so the maroon bleeds cleanly. */
.intercambio {
    position: relative;
    margin-top: -40px;
}
.intercambio__panel {
    background: #912b1c;
    border-radius: var(--radius-pill) var(--radius-pill) 0 0;
    padding: 80px 31px 150px; /* generous space below the CTA before Quem Somos overlaps */
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 48px;
    color: var(--color-white);
}

.int-head {
    max-width: 1135px;
    text-align: center;
}
.int-head .eyebrow {
    color: var(--color-white);
}
.int-head h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h1-size);
    line-height: var(--h1-lh);
    letter-spacing: var(--h1-tracking);
    margin: 8px 0;
}
.int-head__sub {
    font-weight: 700;
    font-size: 17px;
    line-height: 27px;
}
.int-head__body {
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    padding: 24px 0;
}

/* Video */
.int-video {
    position: relative;
    width: 100%;
    max-width: 1235px;
    aspect-ratio: 16 / 9;
    border-radius: var(--radius-pill);
    overflow: hidden;
    box-shadow: 0 4px 14px 0 rgba(83, 22, 22, 0.46);
    cursor: pointer;
}
.int-video img,
.int-video__player {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.int-video::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.4);
    pointer-events: none;
    transition: opacity 0.3s ease;
}
/* Once playback starts, drop the poster wash + play button and reveal native controls */
.int-video.is-playing {
    cursor: default;
}
.int-video.is-playing::before,
.int-video.is-playing .int-video__play {
    opacity: 0;
    pointer-events: none;
}
.int-video__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);
    border: 2px solid #1f2769;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
.int-video__play::after {
    content: "";
    margin-left: 6px;
    border-left: 22px solid #1f2769;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
}

/* Info cards row */
.int-cards {
    display: flex;
    gap: 76px;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    max-width: 1235px;
}
.info-card {
    position: relative;
    width: 231px;
    min-height: 155px;
    padding: 24px 20px 24px 74px;
    background: var(--color-white);
    border-radius: var(--radius-card);
    box-shadow: 0 4px 14px 0 #531616;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.info-card__ico {
    position: absolute;
    left: -50px;
    top: 50%;
    transform: translateY(-50%);
    width: 105px;
    height: auto;
    pointer-events: none;
}
.info-card h3 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h3a-size);
    line-height: var(--h3a-lh);
    color: var(--color-ink);
    margin-bottom: 8px;
}
.info-card p {
    font-weight: 300;
    font-size: 18px;
    line-height: 22px;
    color: var(--color-muted);
}

/* Ideal list */
.int-ideal {
    text-align: center;
}
.int-ideal .eyebrow {
    color: var(--color-white);
    margin-bottom: 32px;
}
.int-ideal ul {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.int-ideal li {
    font-family: var(--font-serif);
    font-size: var(--h3a-size);
    line-height: var(--h3a-lh);
    color: var(--color-white);
}

/* Origin block */
.int-origin {
    width: 100%;
    max-width: 1167px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.int-origin__strip {
    width: 100%;
    height: 312px;
    border-radius: var(--radius-pill);
    overflow: hidden;
    box-shadow: 0 4px 14px 0 #531616;
}
.int-origin__strip picture {
    display: block;
    width: 100%;
    height: 100%;
}
.int-origin__strip img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.int-origin__card {
    width: 1036px;
    max-width: 100%;
    margin-top: 0;
    padding: 50px 60px 56px;
    background: var(--color-white);
    border-radius: 0 0 var(--radius-pill) var(--radius-pill);
    box-shadow: 0 4px 14px 0 #531616;
    text-align: center;
}
.int-origin__card h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    letter-spacing: var(--h2-tracking);
    color: var(--color-ink);
    margin-bottom: 24px;
}
.int-origin__card p {
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: var(--color-muted);
    max-width: 916px;
    margin: 0 auto 8px;
}

/* Organization cards */
.int-org {
    text-align: center;
    width: 100%;
    max-width: 1036px;
}
.int-org .eyebrow {
    color: var(--color-white);
    font-size: 12px;
}
.org-grid {
    display: flex;
    justify-content: center;
    gap: 44px;
    margin-top: 66px;
    align-items: stretch;
}
.org-card {
    position: relative;
    background: var(--color-white);
    border-radius: var(--radius-card);
    box-shadow: 0 4px 7px #531616;
    padding: 80px 28px 32px;
    text-align: center;
}
.org-card--wide {
    flex: 0 0 440px;
}
.org-card:not(.org-card--wide) {
    flex: 0 0 274px;
}
.org-card__ico {
    position: absolute;
    top: -34px;
    left: 50%;
    transform: translateX(-50%);
    height: 105px;
    width: auto;
    pointer-events: none;
}
/* The Valores icon is a wide horizontal bar (404×151); constrain by width so it
   doesn't blow up to ~280px at the shared height. Matches the Figma (~181px). */
.org-card__ico[src*="org-valores"] {
    height: auto;
    width: 190px;
    top: -18px;
}
.org-card h3 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h3-size);
    line-height: var(--h3-lh);
    color: var(--color-ink);
    margin-bottom: 16px;
}
.org-card p {
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: var(--color-muted);
}
.org-card b {
    font-weight: 400;
}

/* ============================================================
   QUEM SOMOS
   ============================================================ */
/* Full-bleed gray panel, in FRONT of intercambio, overlapping so the maroon
   bleeds behind its rounded top. Flat bottom flows continuously into the next section. */
.quemsomos {
    position: relative;
    z-index: 3;
    margin-top: -54px;
}
.quemsomos__panel {
    background: #f7f7f7;
    border-radius: var(--radius-pill) var(--radius-pill) 0 0;
    padding: 70px 90px 80px;
    text-align: center;
}
.quemsomos h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    letter-spacing: var(--h2-tracking);
    color: var(--color-ink);
}
.quemsomos__lead {
    max-width: 1178px;
    margin: 20px auto 0;
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: var(--color-muted);
}
.quemsomos .eyebrow {
    color: var(--color-ink);
    margin-top: 48px;
}

.founders {
    display: flex;
    gap: 16px;
    justify-content: center;
    margin-top: 28px;
}
.fcard {
    display: grid;
    grid-template-columns: 196px 1fr;
    width: 607px;
    flex-shrink: 0;
    min-height: 464px;
    background: #1f2769;
    border-radius: var(--radius-pill);
    box-shadow: 0 4px 7px #e3e3e3;
    overflow: hidden;
    text-align: left;
}
/* The <picture> wrapper (used only to swap in the mobile portrait) takes the
   grid cell just like the old <img> did, so desktop layout is unchanged. */
.fcard picture {
    display: block;
    height: 100%;
}
.fcard__photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.fcard__body {
    padding: 40px 28px 40px 24px;
    color: var(--color-white);
}
.fcard__tag {
    display: block;
    font-weight: 800;
    font-size: 10px;
    letter-spacing: 1.26px;
    text-transform: uppercase;
    color: #9fa7e8;
    margin-bottom: 10px;
}
.fcard__name {
    font-family: var(--font-serif);
    font-size: 32px;
    line-height: 34px;
    margin-bottom: 8px;
}
.fcard__role {
    font-size: 14px;
    line-height: 18px;
    color: #9fa7e8;
    margin-bottom: 18px;
}
.fcard__bio p {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 8px;
}

.offices {
    display: flex;
    gap: 14px;
    justify-content: center;
    margin-top: 24px;
}
.office {
    width: 511px;
    padding: 26px 20px;
    background: var(--color-white);
    border-radius: var(--radius-card);
    box-shadow: 0 4px 7px #e3e3e3;
    text-align: center;
}
.office .tel {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}
.office .tel:hover {
    color: var(--color-maroon);
    text-decoration: underline;
}
.office__region {
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 1.26px;
    text-transform: uppercase;
    color: var(--color-ink);
}
.office h3 {
    font-family: var(--font-serif);
    font-size: var(--h3a-size);
    line-height: var(--h3a-lh);
    color: var(--color-ink);
    margin: 8px 0;
}
.office p {
    font-size: 14px;
    line-height: 21.75px;
    color: var(--color-muted);
}
.office p b {
    font-weight: 700;
}

/* ============================================================
   DEPOIMENTOS
   ============================================================ */
.depoimentos {
    position: relative;
    padding: 90px 0 60px;
    text-align: center;
    background: #f7f7f7; /* continuous with the Quem Somos section above */
}
.depoimentos::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 175px;
    height: 402px;
    background: #e3e3e3;
}
.depoimentos h2 {
    position: relative;
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    letter-spacing: var(--h2-tracking);
    color: var(--color-ink);
    margin-bottom: 68px;
}
.quotes-track {
    position: relative;
    display: flex;
    gap: 32px;
    overflow-x: auto;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
    /* Top padding is trimmed (vs. bottom) so the card sits vertically balanced
       inside the fixed-height grey band (.depoimentos::before), matching Figma. */
    padding: 8px max(90px, calc((100% - 781px) / 2)) 24px;
}
.quotes-track::-webkit-scrollbar {
    display: none;
}
.quote-card {
    position: relative;
    flex: 0 0 781px;
    scroll-snap-align: center;
    min-height: 266px;
    background: var(--color-white);
    border-radius: var(--radius-card);
    box-shadow: 0 4px 7px #e3e3e3;
    padding: 56px 24px 28px;
    text-align: left;
}
.quote-card__mark {
    position: absolute;
    top: 50px;
    left: 24px;
    font-family: var(--font-serif);
    font-size: 50px;
    line-height: 0;
    color: #1f2769;
}
.quote-card blockquote {
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: var(--color-muted);
    text-indent: 40px;
    margin-bottom: 28px;
}
.quote-card figcaption {
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: center;
}
.quote-card figcaption b {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h3-size);
    color: var(--color-ink);
}
.quote-card figcaption span {
    font-size: 14px;
    color: var(--color-arrow);
}
/* Carousel arrows — centered on the grey band's bottom edge (per Figma, same
   as the Metodologia section). The band is .depoimentos::before at top:175px with
   height:402px, so its bottom edge sits 577px from the section top. */
.quotes-nav {
    position: absolute;
    left: 50%;
    top: 577px;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: center;
    gap: 14px;
    z-index: 2;
}
.quotes-nav button {
    width: 41px;
    height: 41px;
    border-radius: 50%;
    background: var(--color-maroon);
    color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: background-color 0.2s ease;
}
.quotes-nav button:hover {
    background: #7d2417;
}

/* ============================================================
   CONTATO
   ============================================================ */
/* #f7f7f7 keeps the flow continuous with Depoimentos/Quem somos above —
   without it, the section's top padding showed a white gap between the two greys */
.contato {
    padding: 40px 0;
    background: #f7f7f7;
}
.contato__panel {
    background: #e3e3e3;
    border-radius: var(--radius-pill);
    /* extra bottom padding leaves grey for the footer's rounded top to tuck into */
    padding: 80px 31px 130px;
}
.contact-card {
    max-width: 1036px;
    margin: 0 auto;
    background: var(--color-white);
    border-radius: 30px;
    box-shadow: 0 4px 7px #f4ebde;
    padding: 40px 24px;
    text-align: center;
}
.contact-card h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    letter-spacing: var(--h2-tracking);
    color: var(--color-ink);
}
.contact-card__intro {
    max-width: 923px;
    margin: 16px auto 32px;
    font-weight: 300;
    font-size: var(--body-size);
    line-height: var(--body-lh);
    color: var(--color-muted);
}

.contact-form {
    max-width: 972px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px 32px;
    text-align: left;
}
.field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.field--full {
    grid-column: 1 / -1;
}
.field label,
.field__label {
    font-weight: 700;
    font-size: 14px;
    line-height: 18px;
    color: var(--color-muted);
}
.field input,
.field select,
.field textarea {
    border: 1px solid #d7dcde;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 14px;
    color: var(--color-ink);
    background: var(--color-white);
    width: 100%;
}
.field textarea {
    min-height: 78px;
    resize: vertical;
}
.field input::placeholder,
.field textarea::placeholder {
    color: #8b969b;
}
.field select {
    color: #8b969b;
    height: 40px;
}

/* ---- Inline validation ---- */
.field__error {
    color: #c0392b;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 16px;
    margin-top: 2px;
}
.field__error[hidden] {
    display: none;
}
.field--error label,
.field--error .field__label {
    color: #c0392b;
}
.field--error input,
.field--error textarea,
.field--error .multiselect__toggle {
    border-color: #c0392b;
}
.field--error input:focus-visible,
.field--error textarea:focus-visible {
    outline: 2px solid #c0392b;
    outline-offset: 1px;
}

/* ---- Multi-select (idioma de interesse) ---- */
.multiselect {
    position: relative;
}
.multiselect__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    height: 40px;
    padding: 10px 12px;
    border: 1px solid #d7dcde;
    border-radius: 6px;
    background: var(--color-white);
    font-size: 14px;
    color: var(--color-ink);
    cursor: pointer;
    text-align: left;
}
.multiselect__toggle:focus-visible {
    outline: 2px solid var(--color-maroon);
    outline-offset: 1px;
}
.multiselect__value {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.multiselect__value--empty {
    color: #8b969b;
}
.multiselect__arrow {
    flex: none;
    color: #8b969b;
    transition: transform 0.2s ease;
}
.multiselect__toggle[aria-expanded="true"] .multiselect__arrow {
    transform: rotate(180deg);
}
.multiselect__menu {
    position: absolute;
    z-index: 5;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    margin: 0;
    padding: 6px;
    list-style: none;
    background: var(--color-white);
    border: 1px solid #d7dcde;
    border-radius: 6px;
    box-shadow: 0 8px 20px rgba(42, 47, 51, 0.12);
}
.multiselect__menu[hidden] {
    display: none;
}
.multiselect__option label {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 4px;
    font-weight: 400;
    font-size: 14px;
    color: var(--color-ink);
    cursor: pointer;
}
.multiselect__option label:hover {
    background: #f3f4f5;
}
.multiselect__option input {
    width: 16px;
    height: 16px;
    accent-color: var(--color-maroon);
    cursor: pointer;
}

/* Honeypot — visually hidden, kept in the tab-order gap for bots only */
.contact-form__honeypot {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.contact-form__status {
    font-weight: 700;
    font-size: 14px;
    text-align: center;
}
.contact-form__status--ok {
    color: #1f7a44;
}
.contact-form__status--error {
    color: var(--color-maroon);
}

.contact-form__actions {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    margin-top: 22px;
}
.contact-form__fine {
    font-weight: 700;
    font-size: 14px;
    color: #8b969b;
}

.contato .eyebrow {
    display: block;
    text-align: center;
    color: var(--color-ink);
    margin: 42px 0 20px;
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
    position: relative;
    z-index: 2;
    /* pull the footer up so its rounded top overlaps the contato grey (matches Figma) */
    margin-top: -90px;
    background: #1f2769;
    border-radius: var(--radius-pill) var(--radius-pill) 0 0;
    color: var(--color-white);
    /* extra bottom padding clears the fixed WhatsApp FAB so it never covers footer content */
    padding: 50px 0 120px;
}
.footer-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}
.footer-logo img {
    height: 84px;
    width: auto;
}
.footer-nav {
    display: flex;
    gap: 40px;
    font-size: 17px;
}
.footer-nav a:hover {
    text-decoration: underline;
}
.footer-nav a.is-strong {
    font-weight: 700;
}

.footer-divider {
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    margin: 34px 0 24px;
}
.footer-bottom {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    font-size: 12px;
}
.footer-legal {
    display: flex;
    gap: 32px;
}
.footer-legal a,
.footer-legal button {
    color: inherit;
    font: inherit;
    padding: 0;
    border: 0;
    background: none;
    text-decoration: underline;
    cursor: pointer;
}
.footer-legal button:hover {
    opacity: 0.8;
}
.footer-social {
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: center;
}
.footer-social img {
    height: 30px;
    width: auto;
}
/* The LinkedIn badge has almost no built-in padding (its glyph fills ~97% of the
   image vs ~86–88% for Instagram/TikTok), so at the same height it reads larger.
   Trim it ~10% so all three match visually. */
.footer-social img[alt="LinkedIn"] {
    height: 27px;
}
.footer-copy {
    text-align: right;
}

/* ============================================================
   Floating WhatsApp button (FAB)
   ============================================================ */
.fab {
    position: fixed;
    right: 28px;
    bottom: 28px;
    z-index: 200;
    display: flex;
    align-items: center;
    gap: 10px;
}
.fab__label {
    background: #25d366;
    color: var(--color-white);
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 12.3px;
    line-height: 1;
    padding: 11px 13px;
    border-radius: 30px;
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.14);
    white-space: nowrap;
    transition:
        transform 0.2s ease,
        opacity 0.2s ease;
}
.fab__btn {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #25d366;
    box-shadow: 0 8px 11px rgba(0, 0, 0, 0.16);
    display: flex;
    align-items: center;
    justify-content: center;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}
.fab__btn img {
    width: 28px;
    height: 28px;
}
.fab:hover .fab__btn {
    transform: scale(1.06);
    box-shadow: 0 10px 16px rgba(0, 0, 0, 0.22);
}
.fab:hover .fab__label {
    transform: translateX(-2px);
}

/* ============================================================
   Legal modals (Política de Privacidade / Termos de Uso)
   ============================================================ */
.modal[hidden] {
    display: none;
}
.modal {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(31, 39, 105, 0.55);
    animation: modal-fade 0.2s ease;
}
.modal__dialog {
    position: relative;
    width: min(760px, 100%);
    max-height: min(85vh, 900px);
    display: flex;
    flex-direction: column;
    background: var(--color-white);
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
    overflow: hidden;
    animation: modal-pop 0.22s ease;
}
.modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 24px 28px;
    border-bottom: 1px solid #ececec;
}
.modal__title {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: 28px;
    line-height: 1.1;
    color: var(--color-ink);
}
.modal__close {
    flex: none;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    background: #f2f2f2;
    color: var(--color-ink);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}
.modal__close:hover {
    background: #e3e3e3;
}
.modal__close:focus-visible {
    outline: 2px solid var(--color-maroon);
    outline-offset: 2px;
}
.modal__body {
    padding: 24px 28px 30px;
    overflow-y: auto;
    color: var(--color-muted);
    font-size: 15px;
    line-height: 1.62;
}
.modal__body:focus-visible {
    outline: none;
}
.modal__updated {
    font-weight: 700;
    color: var(--color-ink);
    margin-bottom: 18px;
}
.modal__body h3 {
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 16px;
    color: var(--color-ink);
    margin: 22px 0 8px;
}
.modal__body p {
    margin: 0 0 12px;
}
.modal__body ul {
    margin: 0 0 12px;
    padding-left: 20px;
}
.modal__body li {
    margin-bottom: 6px;
}
.modal__body a {
    color: var(--color-maroon);
    text-decoration: underline;
}
body.modal-open {
    overflow: hidden;
}

@keyframes modal-fade {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes modal-pop {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
@media (prefers-reduced-motion: reduce) {
    .modal__overlay,
    .modal__dialog {
        animation: none;
    }
}

/* ============================================================
   Hover micro-interactions (card lift + deeper shadow)
   Base transition here is the fallback for reduced-motion users;
   for everyone else the reveal layer supplies the same timing.
   ============================================================ */
.feature-card,
.format-card,
.chip,
.info-card,
.org-card,
.fcard,
.empresas__card {
    transition:
        transform 0.28s cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

.feature-card:hover,
.format-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 14px 30px rgba(20, 25, 40, 0.13);
}
.chip:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(20, 25, 40, 0.14);
}
.info-card:hover,
.org-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 30px rgba(83, 22, 22, 0.55);
}
.fcard:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.28);
}
.empresas__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 30px rgba(0, 0, 0, 0.22);
}

/* ============================================================
   RESPONSIVE — new nav elements (desktop defaults)
   The hamburger + overlay menu only appear on mobile; on desktop
   the menu wrapper is transparent so links/CTA flow into the bar.
   ============================================================ */
.nav-toggle {
    display: none;
}
.nav-menu {
    display: contents;
}
.nav-menu__social {
    display: none;
}
body.nav-open {
    overflow: hidden;
}
/* iOS Safari quirk: an element whose ::before has -webkit-backdrop-filter is
   treated as a CONTAINING BLOCK for fixed descendants (Chrome, per spec, is
   not — it only counts the element's own filter). That traps the fixed
   full-screen `.nav-menu` inside `.site-nav__inner`'s pill box, so the overlay
   stops covering the viewport (shows ~24px side gaps + content bleeding). While
   the menu is open the frosted pill is fully hidden behind the opaque overlay,
   so dropping its ::before frost then is invisible and frees the overlay to
   fill the screen. `.is-open` only ever applies at hamburger widths (≤1024px),
   so this never affects the desktop bar. Higher specificity than the base/mobile
   ::before rules, so it wins regardless of source order. */
.site-nav.is-open .site-nav__inner::before {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* ============================================================
   TABLET / SMALL-LAPTOP SAFETY (≤1240px)
   The desktop layout uses fixed pixel widths that would overflow
   horizontally below the ~1330px it was designed at. Make the
   worst offenders fluid so there's no horizontal scrollbar.
   ============================================================ */
@media (max-width: 1240px) {
    .hero__media {
        margin-right: 0;
        justify-self: center;
    }
    .hero__media img {
        width: 100%;
        max-width: 620px;
        height: auto;
    }
    .founders {
        flex-wrap: wrap;
    }
    .fcard {
        width: min(607px, 100%);
    }
    .offices {
        flex-wrap: wrap;
    }
    .office {
        width: min(511px, 100%);
    }
    .empresas__card {
        grid-template-columns: minmax(0, 46%) minmax(0, 1fr);
    }
    .int-origin__card {
        width: 100%;
    }
    .quote-card {
        flex-basis: min(781px, 88%);
    }
}

/* ============================================================
   MOBILE (≤768px) — full phone layout, built from the Figma
   mobile frame (node 215:14). Everything stacks and centers.
   Most typography + spacing scales via the token overrides below.
   ============================================================ */

/* Nav overlay social row — shared by mobile (≤768px) and tablet
   (769–1024px) so the recoloured mask icons appear in both menus. */
@media (max-width: 1024px) {
    .nav-menu__social {
        display: flex;
        gap: 42px;
        margin-top: 6px;
    }
    .nav-menu__social-link {
        width: 34px;
        height: 34px;
        /* recolor the white social PNGs to navy via alpha mask (Figma shows navy) */
        background-color: #1f2769;
        -webkit-mask-position: center;
        mask-position: center;
        -webkit-mask-size: contain;
        mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
    }
    .nav-menu__social-link.is-ig {
        -webkit-mask-image: url(data:image/png;base64,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);
        mask-image: url(data:image/png;base64,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);
    }
    .nav-menu__social-link.is-in {
        -webkit-mask-image: url(data:image/png;base64,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);
        mask-image: url(data:image/png;base64,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);
    }
    .nav-menu__social-link.is-tk {
        -webkit-mask-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOCAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPCEtLSBiYWRnZSBzY2FsZWQgdG8gfjg4JSBvZiB0aGUgdmlld0JveCAocGFkZGluZyBhZGRlZCkgc28gaXQgbWF0Y2hlcyB0aGUgdmlzdWFsIHNpemUgb2YgdGhlIEluc3RhZ3JhbS9MaW5rZWRJbiBpY29ucyAtLT4KPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMS42OCAxLjY4KSBzY2FsZSgwLjg4KSI+CjxwYXRoIGQ9Ik0yNi41OTk3IDBIMS4zOTk4NUMwLjYyNjYzNyAwIDAgMC42MjY2MzcgMCAxLjM5OTg1VjI2LjU5OTdDMCAyNy4zNzI5IDAuNjI2NjM3IDI3Ljk5OTYgMS4zOTk4NSAyNy45OTk2SDI2LjU5OTdDMjcuMzcyOSAyNy45OTk2IDI3Ljk5OTYgMjcuMzcyOSAyNy45OTk2IDI2LjU5OTdWMS4zOTk4NUMyNy45OTk2IDAuNjI2NjM3IDI3LjM3MjkgMCAyNi41OTk3IDBaTTIyLjAwNjYgMTIuMjE0OEMyMS44NTQyIDEyLjIzMDMgMjEuNyAxMi4yMzcxIDIxLjU0NzYgMTIuMjM4N0MxOS44NiAxMi4yNDA4IDE4LjI4NTQgMTEuMzkxNiAxNy4zNjAyIDkuOTgwNDFWMTcuNjcwNkMxNy4zNjEgMjAuODEwNSAxNC44MTYzIDIzLjM1NjUgMTEuNjc2NCAyMy4zNTczQzguNTM2NDYgMjMuMzU4MiA1Ljk5MDQzIDIwLjgxMzQgNS45ODk1OSAxNy42NzM1QzUuOTg4NzUgMTQuNTMzNiA4LjUzMzUyIDExLjk4NzYgMTEuNjczNCAxMS45ODY3SDExLjY3NjRDMTEuNzk1MiAxMS45ODY3IDExLjkxMDMgMTEuOTk4MSAxMi4wMjc5IDEyLjAwNDhWMTQuODA0OUMxMC40NDExIDE0LjYxMjYgOC45OTkzIDE1Ljc0MzIgOC44MDY5NCAxNy4zM0M4LjYxNDU4IDE4LjkxNjcgOS43NDUyMSAyMC4zNTg2IDExLjMzMiAyMC41NTA5QzExLjQ0NjIgMjAuNTY0OCAxMS41NjEzIDIwLjU3MTkgMTEuNjc2NCAyMC41NzE5QzEzLjI5NjMgMjAuNjAxMyAxNC42NDExIDE5LjMyNzkgMTQuNzAwMyAxNy43MDg4TDE0LjcyODUgNC42NDU2SDE3LjQwODFDMTcuNjYwNSA3LjA0Nzk4IDE5LjU5NzkgOC45MjQ1NCAyMi4wMDcgOS4xMDA1MVYxMi4yMTU2TDIyLjAwNjYgMTIuMjE0OFoiIGZpbGw9IndoaXRlIi8+CjwvZz4KPC9zdmc+Cg==);
        mask-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOCAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPCEtLSBiYWRnZSBzY2FsZWQgdG8gfjg4JSBvZiB0aGUgdmlld0JveCAocGFkZGluZyBhZGRlZCkgc28gaXQgbWF0Y2hlcyB0aGUgdmlzdWFsIHNpemUgb2YgdGhlIEluc3RhZ3JhbS9MaW5rZWRJbiBpY29ucyAtLT4KPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMS42OCAxLjY4KSBzY2FsZSgwLjg4KSI+CjxwYXRoIGQ9Ik0yNi41OTk3IDBIMS4zOTk4NUMwLjYyNjYzNyAwIDAgMC42MjY2MzcgMCAxLjM5OTg1VjI2LjU5OTdDMCAyNy4zNzI5IDAuNjI2NjM3IDI3Ljk5OTYgMS4zOTk4NSAyNy45OTk2SDI2LjU5OTdDMjcuMzcyOSAyNy45OTk2IDI3Ljk5OTYgMjcuMzcyOSAyNy45OTk2IDI2LjU5OTdWMS4zOTk4NUMyNy45OTk2IDAuNjI2NjM3IDI3LjM3MjkgMCAyNi41OTk3IDBaTTIyLjAwNjYgMTIuMjE0OEMyMS44NTQyIDEyLjIzMDMgMjEuNyAxMi4yMzcxIDIxLjU0NzYgMTIuMjM4N0MxOS44NiAxMi4yNDA4IDE4LjI4NTQgMTEuMzkxNiAxNy4zNjAyIDkuOTgwNDFWMTcuNjcwNkMxNy4zNjEgMjAuODEwNSAxNC44MTYzIDIzLjM1NjUgMTEuNjc2NCAyMy4zNTczQzguNTM2NDYgMjMuMzU4MiA1Ljk5MDQzIDIwLjgxMzQgNS45ODk1OSAxNy42NzM1QzUuOTg4NzUgMTQuNTMzNiA4LjUzMzUyIDExLjk4NzYgMTEuNjczNCAxMS45ODY3SDExLjY3NjRDMTEuNzk1MiAxMS45ODY3IDExLjkxMDMgMTEuOTk4MSAxMi4wMjc5IDEyLjAwNDhWMTQuODA0OUMxMC40NDExIDE0LjYxMjYgOC45OTkzIDE1Ljc0MzIgOC44MDY5NCAxNy4zM0M4LjYxNDU4IDE4LjkxNjcgOS43NDUyMSAyMC4zNTg2IDExLjMzMiAyMC41NTA5QzExLjQ0NjIgMjAuNTY0OCAxMS41NjEzIDIwLjU3MTkgMTEuNjc2NCAyMC41NzE5QzEzLjI5NjMgMjAuNjAxMyAxNC42NDExIDE5LjMyNzkgMTQuNzAwMyAxNy43MDg4TDE0LjcyODUgNC42NDU2SDE3LjQwODFDMTcuNjYwNSA3LjA0Nzk4IDE5LjU5NzkgOC45MjQ1NCAyMi4wMDcgOS4xMDA1MVYxMi4yMTU2TDIyLjAwNjYgMTIuMjE0OFoiIGZpbGw9IndoaXRlIi8+CjwvZz4KPC9zdmc+Cg==);
    }
    .nav-menu__social img {
        display: none;
    }
}
@media (max-width: 768px) {
    :root {
        --h1-size: 40px;
        --h1-lh: 44px;
        --h1-tracking: -0.5px;
        --h2-size: 38px;
        --h2-lh: 42px;
        --h2-tracking: -0.5px;
        --h3a-size: 22px;
        --h3a-lh: 27px;
        --h3-size: 20px;
        --h3-lh: 25px;
        --body-size: 16px;
        --body-lh: 24px;
        --label-size: 14px;
        --label-lh: 20px;
        --container-pad: 20px;
        --radius-pill: 40px;
        --radius-card: 24px;
        /* Mobile nav bar height + the gap above it (keeps overlay + hero in sync).
       Bar is 64px (per design); the 78px logo overhangs it by 7px, so
       logo top = nav-top − 7 = 32px. */
        --nav-h: 64px;
        --nav-top: 39px;
    }

    /* Guard against sub-pixel horizontal overflow on very narrow phones.
     The level/testimonial carousels are self-contained overflow-x scrollers,
     so clipping the page horizontally is safe. `clip` (vs hidden) doesn't
     create a scroll container, so it won't disturb the fixed nav. */
    html {
        overflow-x: clip;
    }

    /* ---- Buttons: smaller, and allow long labels to wrap ---- */
    .btn {
        font-size: 18px;
        padding: 16px 26px;
        white-space: normal;
        text-align: center;
    }
    .btn--sm {
        font-size: 15px;
        padding: 12px 24px;
    }

    /* ==================== NAV + HAMBURGER ==================== */
    .site-nav {
        top: var(--nav-top);
    }
    .site-nav__inner {
        /* Floating frosted pill, inset 24px from each edge (per design) */
        width: calc(100% - 48px);
        height: var(--nav-h);
        padding: 0 18px 0 0;
        gap: 0;
        justify-content: space-between;
        border-radius: 50px;
        background: none;
        position: relative;
        /* clear the desktop blur from the element itself — the frost lives on
       ::before, so .site-nav__inner never becomes a containing block that
       would trap the fixed full-screen overlay menu */
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    /* Frosted fill as a pseudo-element, clipped to the pill's rounded corners */
    .site-nav__inner::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: rgba(255, 255, 255, 0.72);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
    }
    /* logo aligned to the pill's 24px inset (no overhang), so the bar reads as
     evenly padded; sits above the overlay so the full badge shows when open */
    .site-nav__logo {
        width: 78px;
        height: 78px;
        margin: 0;
        position: relative;
        z-index: 2;
    }

    .nav-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 46px;
        height: 46px;
        position: relative;
        z-index: 2;
    }
    .nav-toggle__icon {
        width: 26px;
        height: auto;
        display: block;
    }
    .site-nav.is-open .nav-toggle__icon {
        display: none;
    }
    /* Open state → close (X), drawn to match the icon's navy bars */
    .site-nav.is-open .nav-toggle::before,
    .site-nav.is-open .nav-toggle::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 28px;
        height: 4px;
        border-radius: 2px;
        background: #21205d;
    }
    .site-nav.is-open .nav-toggle::before {
        transform: translate(-50%, -50%) rotate(45deg);
    }
    .site-nav.is-open .nav-toggle::after {
        transform: translate(-50%, -50%) rotate(-45deg);
    }

    .nav-menu {
        display: flex;
        position: fixed;
        inset: 0; /* full-screen takeover — covers the bar + any gap above it */
        z-index: 1;
        flex-direction: column;
        align-items: center;
        /* `safe center` centers when the content fits but top-aligns when it would
       overflow (prevents the top links being clipped/unreachable on short
       screens); flex-start is the fallback for iOS < 16.4 */
        justify-content: flex-start;
        justify-content: safe center;
        gap: 42px;
        /* generous top padding clears the logo/close bar so the first link never
       crowds it (bar bottom ≈ 103px) */
        padding: 136px 24px 52px;
        background: #fff;
        /* Base show/hide is a plain fade (also the reduced-motion fallback); the
       center scale + item stagger live in animations.css under no-preference */
        opacity: 0;
        visibility: hidden;
        transition:
            opacity 0.28s ease,
            visibility 0s linear 0.28s;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .site-nav.is-open .nav-menu {
        opacity: 1;
        visibility: visible;
        transition:
            opacity 0.28s ease,
            visibility 0s;
    }
    .nav-menu .nav-links {
        flex: none;
        flex-direction: column;
        gap: 30px;
        font-size: 24px;
    }
    .nav-menu .nav-links a {
        color: var(--color-ink);
    }
    .nav-menu .nav-links a.is-active {
        color: var(--color-maroon);
        font-weight: 700;
    }
    .site-nav__cta {
        font-size: 20px;
        padding: 15px 40px;
    }
    /* ==================== HERO ==================== */
    .hero {
        padding-top: calc(var(--nav-top) + var(--nav-h) + 64px);
        padding-bottom: 36px;
    }
    .hero__grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .hero__content {
        align-items: center;
        text-align: center;
    }
    .hero__title,
    .hero__sub,
    .hero__body {
        max-width: none;
    }
    .hero__sub {
        font-size: 18px;
        line-height: 25px;
        margin-bottom: 18px;
    }
    .hero__body {
        margin-bottom: 12px;
    }
    .hero__note {
        margin-bottom: 26px;
    }
    .hero__cta {
        flex-direction: column;
        width: 100%;
        gap: 12px;
    }
    .hero__cta .btn {
        width: 100%;
    }
    .hero__media {
        margin-right: 0;
        justify-self: center;
        width: 100%;
        perspective: none;
    }
    .hero__media img {
        width: 100%;
        max-width: 460px;
        height: auto;
    }
    .scroll-cue {
        display: none;
    }

    /* ==================== DIFERENCIAIS ==================== */
    .diferenciais__panel {
        padding: 56px 20px;
    }
    .diferenciais .section-head {
        margin-bottom: 40px;
    }
    .feature-grid {
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 20px;
        max-width: 420px;
    }
    .feature-card {
        min-height: 0;
        padding: 22px 20px 22px 96px;
    }
    .feature-card__ico {
        left: 8px;
        top: 24px;
        transform: none;
        width: 72px;
    }
    .feature-card p {
        max-width: none;
    }

    /* ==================== METHOD (QCER) ==================== */
    .method {
        padding: 60px 0 110px; /* ~56px gap to Idiomas after the -54px overlap */
    }
    .method__band {
        margin-top: 40px;
        padding: 40px 0 40px;
    }
    /* left pad = page gutter + badge overhang (28px), so the A1 badge — the
     card's leftmost element — lands on the page's --container-pad line */
    .levels-scroll {
        padding: 44px 16px 8px calc(var(--container-pad) + 28px);
        scroll-snap-type: x mandatory;
    }
    /* stretch → all cards share the tallest card's height (blank space in the
     note-less ones), matching the desktop pattern */
    .levels {
        gap: 28px;
        align-items: stretch;
    }
    .level-card {
        flex: 0 0 262px;
        min-height: 0;
        padding: 50px 22px 22px;
        scroll-snap-align: center;
    }
    .level-card--active {
        padding-top: 40px;
    }
    .level-card p {
        max-width: none;
    }
    /* 16px breathing room between the description and the note on the active
     cards (B1/B2) — pushes all cards a little taller, which is fine */
    .level-card--active p {
        margin-bottom: 16px;
    }
    /* note bleeds to the mobile card's outer edge: padding 22 + border 3 = 25
     (radius still tracks --radius-card via the base rule) */
    .level-card__note {
        margin: auto -25px -25px;
    }
    /* group labels: one label spans a pair of cards (2×262 + 28 gap = 552) */
    .level-groups {
        display: flex;
        gap: 28px;
        margin-top: 24px;
    }
    .level-groups span {
        flex: 0 0 552px;
    }
    .method__accordion {
        margin-top: 44px;
        gap: 20px;
    }
    .acc-item {
        padding: 0 22px;
    }
    .acc-item summary {
        padding: 20px 0;
    }

    /* ==================== IDIOMAS ==================== */
    .idiomas__panel {
        padding: 56px 20px;
    }
    .chips {
        flex-direction: column;
        gap: 52px;
        margin-top: 48px;
    }
    .chip {
        width: 100%;
        max-width: 320px;
        height: 62px;
        padding: 0 20px;
        justify-content: center; /* center the language label in the pill */
        font-size: 20px;
    }
    .chip img {
        width: 110px;
        left: -20px;
    }
    /* Italiano moves to the end of the column (per design) so it sits directly
     above the bridge; DOM order naturally leaves Inglês, Espanhol, Francês,
     Alemão before it */
    .chip--italiano {
        order: 1;
    }
    /* vertical connector from the Italiano chip down to the bridge (like desktop) */
    .chip--italiano::after {
        display: block;
        height: 44px;
    }
    .bridge {
        max-width: none;
        padding: 18px 22px;
        margin-top: 44px;
    }
    .idiomas__note {
        margin-top: 30px;
    }

    /* ==================== MODALIDADES ==================== */
    .modalidades {
        padding: 52px 0;
    }
    .format-grid {
        flex-direction: column;
        align-items: center;
        gap: 68px;
        margin-top: 64px;
    }
    .format-card {
        width: 100%;
        max-width: 320px;
    }
    .band-note {
        max-width: none;
        padding: 14px 22px;
    }
    .modalidades__fine {
        max-width: none;
    }

    /* ==================== EMPRESAS (B2B) ==================== */
    .empresas {
        padding: 16px 0 100px; /* ~60px gap to Intercambio after the -40px overlap */
    }
    .empresas__card {
        grid-template-columns: 1fr;
        min-height: 0;
    }
    .empresas__photo {
        margin: 0;
        height: 230px;
        border-radius: var(--radius-pill) var(--radius-pill) 0 0;
    }
    .empresas__text {
        padding: 30px 24px 34px;
        text-align: center;
    }
    .empresas__text p {
        max-width: none;
    }

    /* ==================== INTERCAMBIO ==================== */
    .intercambio__panel {
        padding: 56px 20px 96px;
        gap: 40px;
    }
    .int-head__body {
        padding: 18px 0;
    }
    .int-video {
        aspect-ratio: 16 / 9;
        height: auto;
        border-radius: 24px;
    }
    .int-video__play {
        width: 64px;
        height: 64px;
    }
    .int-video__play::after {
        border-left-width: 15px;
        border-top-width: 9px;
        border-bottom-width: 9px;
    }
    .int-cards {
        flex-direction: column;
        gap: 20px;
        align-items: stretch;
    }
    .info-card {
        width: 100%;
        min-height: 0;
        padding: 18px 18px 18px 96px;
    }
    .info-card__ico {
        left: 10px;
        width: 70px;
    }
    .int-ideal ul {
        gap: 20px;
    }
    .int-ideal li {
        font-size: 18px;
        line-height: 24px;
    }
    /* mobile collage (intercambio-collage-mobile.png, ~3:2) shown in full.
     Round only the top corners so the strip + card below read as one card
     (hard bottom corners meet the card's square top). */
    .int-origin__strip {
        height: auto;
        aspect-ratio: 1516 / 1004;
        border-radius: var(--radius-pill) var(--radius-pill) 0 0;
    }
    .int-origin__card {
        padding: 32px 20px 36px;
        border-radius: 0 0 var(--radius-pill) var(--radius-pill);
    }
    .int-origin__card p {
        max-width: none;
    }
    .org-grid {
        flex-direction: column;
        gap: 44px;
        margin-top: 48px;
    }
    /* `.org-grid .org-card` (0,2,0) beats the desktop `.org-card:not(.org-card--wide)`
     flex:0 0 274px — otherwise that basis becomes a fixed height in the mobile
     column, inflating the short cards. flex:none → variable, content-driven height. */
    .org-grid .org-card {
        flex: none;
        width: 100%;
        padding: 78px 24px 30px;
    }

    /* ==================== QUEM SOMOS ==================== */
    .quemsomos__panel {
        padding: 56px 20px 60px;
    }
    .quemsomos .eyebrow {
        margin-top: 40px;
    }
    .founders {
        flex-direction: column;
        gap: 22px;
        margin-top: 24px;
    }
    .fcard {
        grid-template-columns: 1fr;
        width: 100%;
        min-height: 0;
    }
    /* full-body portraits in a top landscape band — anchor to the top so the
     crop lands on the faces (both founders' faces sit in the upper ~15%) */
    .fcard__photo {
        height: 280px;
        object-position: top;
    }
    .fcard__body {
        padding: 26px 24px 30px;
    }
    .fcard__name {
        font-size: 28px;
        line-height: 32px;
    }
    .offices {
        flex-direction: column;
        gap: 14px;
    }
    .office {
        width: 100%;
    }

    /* ==================== DEPOIMENTOS ==================== */
    .depoimentos {
        padding: 56px 0 52px;
    }
    /* title size now comes from the global --h2 bump; keep the 40px gap to the band */
    .depoimentos h2 {
        margin-bottom: 40px;
    }
    /* grey band = the track's own background (auto-adapts to the card height, no
     magic offsets); 24px of grey shows above/below the card, full-bleed sides */
    .depoimentos::before {
        display: none;
    }
    /* 24px grey above the card, 36px below so the paginator (which straddles the
     band's bottom edge) sits ~16px clear of the card */
    .quotes-track {
        background: #e3e3e3;
        padding: 24px 20px 36px;
        gap: 20px;
        position: relative;
    }
    .quote-card {
        flex-basis: 86%;
        padding: 44px 20px 24px;
    }
    /* paginator floats centered on the band's bottom edge (half on, half below).
       Reset the desktop absolute anchoring — here the band is the track's own
       background, so the paginator just straddles it via a negative margin. */
    .quotes-nav {
        margin-top: -20px;
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        z-index: 2;
    }

    /* ==================== CONTATO ==================== */
    .contato {
        padding: 32px 0;
    }
    .contato__panel {
        padding: 48px 14px 104px;
    }
    .contact-card {
        padding: 28px 16px;
    }
    .contact-form {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    /* ==================== FOOTER ==================== */
    .site-footer {
        padding: 48px 0 96px;
    }
    .footer-top {
        flex-direction: column;
        gap: 30px;
        text-align: center;
    }
    .footer-logo img {
        height: 88px;
    } /* small bump (not matching Figma exactly) */
    .footer-nav {
        flex-direction: column;
        gap: 22px;
        align-items: center;
        font-size: 22px;
    }
    .footer-divider {
        display: none;
    }
    /* 56px between the last nav link and the social row */
    .footer-bottom {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 22px;
        margin-top: 56px;
    }
    .footer-social {
        order: -1;
    }
    .footer-social img {
        width: 48px;
        height: 48px;
    }
    .footer-social img[alt="LinkedIn"] {
        width: 43px;
        height: 43px;
    }
    .footer-legal {
        order: 0;
        flex-direction: column;
        gap: 14px;
        align-items: center;
        width: 100%;
        padding-top: 24px;
        border-top: 1px solid rgba(255, 255, 255, 0.25);
        font-size: 14px; /* was inheriting the 12px footer-bottom size */
    }
    .footer-copy {
        order: 1;
        text-align: center;
    }

    /* ==================== FLOATING WHATSAPP ==================== */
    .fab {
        right: 16px;
        bottom: 16px;
        gap: 8px;
        transition:
            opacity 0.2s ease,
            visibility 0.2s ease;
    }
    .fab__btn {
        width: 52px;
        height: 52px;
    }
    .fab__btn img {
        width: 26px;
        height: 26px;
    }
    /* hide the FAB while the full-screen menu is open (it crowded the logo/social) */
    body.nav-open .fab {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
}

/* ============================================================
   TABLET (769px–1024px) — in-between layout derived from the
   desktop + mobile breakpoints. Mobile is ≤768px and the desktop
   fluid-safety pass is ≤1240px, so this block covers the gap where
   the desktop grid is too wide but a full phone stack wastes space.
   Placed last so it wins over the ≤1240px safety rules; it never
   overlaps the ≤768px block, so mobile is untouched.
   ============================================================ */
@media (min-width: 769px) and (max-width: 1024px) {
    /* Type scale sits between the desktop and mobile tokens */
    :root {
        --h1-size: 52px;
        --h1-lh: 56px;
        --h1-tracking: -0.8px;
        --h2-size: 42px;
        --h2-lh: 46px;
        --h2-tracking: -0.8px;
        --h3a-size: 24px;
        --h3a-lh: 28px;
        --h3-size: 21px;
        --h3-lh: 26px;
        --body-size: 19px;
        --body-lh: 26px;
        --label-size: 14px;
        --label-lh: 19px;
    }

    /* ==================== NAV → hamburger + overlay ====================
       Below ~1000px the six horizontal links + CTA + logo no longer fit,
       so reuse the mobile hamburger/overlay pattern (JS is breakpoint-
       agnostic — it toggles .is-open on click at any width). The desktop
       nav bar/pill geometry is kept; only the menu becomes an overlay. */
    .nav-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        position: relative;
        z-index: 2;
    }
    .nav-toggle__icon {
        width: 28px;
        height: auto;
        display: block;
    }
    .site-nav.is-open .nav-toggle__icon {
        display: none;
    }
    .site-nav.is-open .nav-toggle::before,
    .site-nav.is-open .nav-toggle::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 30px;
        height: 4px;
        border-radius: 2px;
        background: #21205d;
    }
    .site-nav.is-open .nav-toggle::before {
        transform: translate(-50%, -50%) rotate(45deg);
    }
    .site-nav.is-open .nav-toggle::after {
        transform: translate(-50%, -50%) rotate(-45deg);
    }
    /* bar now holds only the logo + toggle */
    .site-nav__inner {
        justify-content: space-between;
        padding-right: 24px;
    }
    /* keep the logo above the full-screen overlay (z-index:1) when open —
       without this it's painted behind the white menu, same as mobile */
    .site-nav__logo {
        position: relative;
        z-index: 2;
    }
    .nav-menu {
        display: flex;
        position: fixed;
        inset: 0;
        z-index: 1;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        justify-content: safe center;
        gap: 40px;
        padding: 110px 40px 60px;
        background: #fff;
        opacity: 0;
        visibility: hidden;
        transition:
            opacity 0.28s ease,
            visibility 0s linear 0.28s;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .site-nav.is-open .nav-menu {
        opacity: 1;
        visibility: visible;
        transition:
            opacity 0.28s ease,
            visibility 0s;
    }
    .nav-menu .nav-links {
        flex: none;
        flex-direction: column;
        gap: 34px;
        font-size: 28px;
    }
    .nav-menu .nav-links a {
        color: var(--color-ink);
    }
    .nav-menu .nav-links a.is-active {
        color: var(--color-maroon);
        font-weight: 700;
    }
    .site-nav__cta {
        font-size: 20px;
        padding: 15px 40px;
    }
    /* Social row now shows in the tablet menu too (rules shared via the
       @media(max-width:1024px) block above). Hide the WhatsApp FAB while the
       menu is open so it doesn't float over the overlay — same as mobile. */
    body.nav-open .fab {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    /* ==================== HERO — stack ==================== */
    .hero {
        padding-top: 128px;
        padding-bottom: 56px;
    }
    .hero__grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .hero__content {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .hero__title,
    .hero__sub,
    .hero__body {
        max-width: none;
    }
    .hero__sub {
        font-size: 20px;
        line-height: 28px;
    }
    .hero__cta {
        justify-content: center;
        flex-wrap: wrap;
    }
    .hero__media {
        justify-self: center;
        margin-right: 0;
        perspective: none;
        width: 100%;
    }
    .hero__media img {
        width: 100%;
        /* larger than before (was 560px) so the collage fills the stacked hero
           and doesn't read as small/lost on the wider tablet canvas */
        max-width: 700px;
        height: auto;
    }
    .scroll-cue {
        display: none;
    }

    /* ==================== DIFERENCIAIS — 2 columns ==================== */
    .feature-grid {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 28px;
        row-gap: 28px;
        max-width: 640px;
    }
    .feature-card {
        min-height: 0;
        padding: 22px 22px 22px 96px;
    }
    .feature-card__ico {
        left: 6px;
        top: 24px;
        transform: none;
        width: 76px;
    }
    .feature-card p {
        max-width: none;
    }

    /* ==================== IDIOMAS — chips wrap ==================== */
    .chips {
        flex-wrap: wrap;
        gap: 40px 44px;
        margin-top: 48px;
    }
    /* the vertical connector assumes Italiano sits directly above the
       bridge; once the chips wrap that no longer holds, so drop it */
    .chip--italiano::after {
        display: none;
    }

    /* ==================== MODALIDADES — cards wrap ==================== */
    .format-grid {
        flex-wrap: wrap;
        gap: 56px 34px;
        margin-top: 64px;
    }

    /* ==================== EMPRESAS — stack ==================== */
    .empresas__card {
        grid-template-columns: 1fr;
        min-height: 0;
    }
    .empresas__photo {
        margin: 0;
        height: 300px;
        border-radius: var(--radius-pill) var(--radius-pill) 0 0;
    }
    .empresas__text {
        padding: 36px 40px 40px;
        text-align: center;
    }
    .empresas__text p {
        max-width: none;
        margin-inline: auto;
    }

    /* ==================== INTERCAMBIO — widen card gaps ==================== */
    /* .int-cards already wraps; use a column gap wider than the icons'
       -50px overhang so wrapped cards never collide */
    .int-cards {
        gap: 36px 60px;
    }

    /* ==================== INTERCAMBIO (orgs) — wrap ==================== */
    .org-grid {
        flex-wrap: wrap;
        gap: 44px;
        margin-top: 56px;
    }

    /* ==================== DEPOIMENTOS ====================
       Card heights are unpredictable at these widths, so adopt the mobile
       approach: the grey band is the track's own background (no fixed-height
       ::before to overflow) and the paginator straddles its bottom edge. */
    .depoimentos::before {
        display: none;
    }
    .quotes-track {
        background: #e3e3e3;
        padding: 28px 32px 40px;
        gap: 28px;
        position: relative;
    }
    .quote-card {
        flex-basis: min(781px, 78%);
    }
    .quotes-nav {
        margin-top: -20px;
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        z-index: 2;
    }

    /* ==================== FOOTER — stack top, wrap nav ==================== */
    .footer-top {
        flex-direction: column;
        gap: 28px;
        text-align: center;
    }
    .footer-nav {
        flex-wrap: wrap;
        justify-content: center;
        gap: 18px 30px;
    }
    .footer-divider {
        margin: 28px 0 22px;
    }
}

/* ============================================================================
   Cookie / tracking consent banner (LGPD) — gates the Meta Pixel
   ============================================================================ */
.cookie-consent {
    position: fixed;
    left: 24px;
    right: 24px;
    bottom: 24px;
    z-index: 250; /* above the WhatsApp FAB (200), below the legal modals (300) */
    display: flex;
    justify-content: center;
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    pointer-events: none;
}
.cookie-consent[hidden] {
    display: none;
}
.cookie-consent.is-visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.cookie-consent__inner {
    width: min(760px, 100%);
    display: flex;
    align-items: center;
    gap: 28px;
    padding: 22px 26px;
    background: var(--color-white);
    border: 1px solid rgba(42, 47, 51, 0.08);
    border-radius: 20px;
    box-shadow: 0 18px 48px rgba(42, 47, 51, 0.18);
}
.cookie-consent__text {
    margin: 0;
    flex: 1 1 auto;
    font-family: var(--font-sans);
    font-size: 15px;
    line-height: 22px;
    color: var(--color-muted);
}
.cookie-consent__link {
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    color: var(--color-maroon);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}
.cookie-consent__link:hover {
    text-decoration: none;
}
.cookie-consent__actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
}
.cookie-consent__btn {
    font-family: var(--font-sans);
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    padding: 13px 22px;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    white-space: nowrap;
}
.cookie-consent__btn--primary {
    border: 1px solid var(--color-maroon);
    background: var(--color-maroon);
    color: var(--color-white);
}
.cookie-consent__btn--primary:hover {
    background: #7d2519;
    border-color: #7d2519;
}
.cookie-consent__btn--ghost {
    border: 1px solid rgba(42, 47, 51, 0.25);
    background: transparent;
    color: var(--color-ink);
}
.cookie-consent__btn--ghost:hover {
    border-color: var(--color-ink);
    background: rgba(42, 47, 51, 0.04);
}
.cookie-consent__btn:focus-visible,
.cookie-consent__link:focus-visible {
    outline: 2px solid var(--color-maroon);
    outline-offset: 2px;
}

@media (max-width: 768px) {
    .cookie-consent {
        left: 12px;
        right: 12px;
        bottom: 12px;
    }
    .cookie-consent__inner {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding: 20px;
        border-radius: 18px;
    }
    .cookie-consent__actions {
        justify-content: flex-end;
    }
    .cookie-consent__btn {
        flex: 1 1 0;
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cookie-consent {
        transition: none;
        transform: none;
    }
}