/**
 * Estilos do site — JP Marketing Digital
 * Todos os valores vêm de colors_and_type.css (tokens).
 */

/* ==========================================================================
   Base
   ========================================================================== */
*,
*::before,
*::after {
    box-sizing: border-box;
}

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

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: var(--wt-focus-width) solid var(--wt-focus-color);
    outline-offset: var(--wt-focus-offset);
}

.wt-icon {
    display: block;
    flex: none;
    width: var(--wt-icon-md);
    height: var(--wt-icon-md);
}

.wt-container {
    width: 100%;
    max-width: calc(var(--wt-container) + (var(--wt-gutter) * 2));
    margin-inline: auto;
    padding-inline: var(--wt-gutter);
}

.wt-container--narrow {
    max-width: calc(var(--wt-container-narrow) + (var(--wt-gutter) * 2));
}

/* ==========================================================================
   Seções
   ========================================================================== */
.wt-hero,
.wt-section,
.wt-beneficios,
.wt-footer {
    width: 100%;
}

.wt-section {
    padding-block: var(--wt-section-pad);
    background: var(--wt-color-white);
}

.wt-section--alt {
    background: var(--wt-color-surface-alt);
}

.wt-section--dark {
    background: var(--wt-color-navy);
    color: var(--wt-color-white);
}

.wt-section__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--wt-space-16);
    max-width: var(--wt-container-narrow);
    margin: 0 auto var(--wt-space-64);
    text-align: center;
}

.wt-section__title {
    margin: 0;
    font-size: var(--wt-fs-h2);
    font-weight: var(--wt-fw-medium);
    line-height: var(--wt-lh-display);
    letter-spacing: var(--wt-ls-tight);
    color: var(--wt-color-navy);
}

.wt-section__desc {
    margin: 0;
    font-size: var(--wt-fs-button);
    line-height: var(--wt-lh-body);
}

/* Rótulo acima do título (hat) */
.wt-hat {
    margin: 0;
    font-size: var(--wt-fs-nav);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-body);
    letter-spacing: var(--wt-ls-nav);
    text-transform: uppercase;
    color: var(--wt-color-orange-text);
}

/* Texto corrido — justificado (context.md 4.6) */
.wt-text,
.wt-card__text,
.wt-diferencial__text,
.wt-faq__answer p,
.wt-hero__lead,
.wt-hero__desc {
    hyphens: auto;
    -webkit-hyphens: auto;
}

.wt-text {
    margin: 0;
    font-size: var(--wt-fs-button);
    line-height: var(--wt-lh-body);
    text-align: justify;
}

/* Seções escuras */
.wt-section--dark .wt-section__title { color: var(--wt-color-white); }
.wt-section--dark .wt-hat            { color: var(--wt-color-orange); }
.wt-section--dark .wt-section__desc  { color: var(--wt-color-sky); }
.wt-section--dark a:focus-visible    { outline-color: var(--wt-focus-color-on-dark); }

/* Grupos de botões */
.wt-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--wt-space-24);
}

.wt-actions--center {
    justify-content: center;
}

/* Duas colunas texto + mídia */
.wt-split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: var(--wt-space-64);
}

.wt-split__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wt-space-16);
}

.wt-split__text .wt-actions {
    margin-top: var(--wt-space-16);
}

/* ==========================================================================
   Header
   ========================================================================== */
.wt-header {
    padding-top: var(--wt-space-23);
    background: var(--wt-color-white);
}

.wt-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: var(--wt-header-h);
}

.wt-header__main {
    display: flex;
    align-items: center;
    gap: var(--wt-space-128);
}

.wt-header__logo {
    display: block;
    flex: none;
}

/* Logo padrão do tema: a arte tem margem branca, recortada como no Figma */
.wt-header__logo-crop {
    position: relative;
    display: block;
    width: var(--wt-logo-w);
    height: var(--wt-header-h);
    overflow: hidden;
}

.wt-header__logo-crop img {
    position: absolute;
    left: var(--wt-logo-crop-x);
    top: var(--wt-logo-crop-y);
    width: var(--wt-logo-crop-w);
    height: var(--wt-logo-crop-h);
    max-width: none;
}

/* Logo enviado pelo Customizer */
.wt-header__logo-img {
    width: auto;
    max-width: var(--wt-logo-w);
    height: var(--wt-header-h);
    object-fit: contain;
}

/* Menu */
.wt-nav__list {
    display: flex;
    align-items: center;
    gap: var(--wt-space-32);
    margin: 0;
    padding: 0;
    list-style: none;
}

.wt-nav__list a {
    display: flex;
    flex-direction: column;
    gap: var(--wt-space-4);
    font-size: var(--wt-fs-nav);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-body);
    letter-spacing: var(--wt-ls-nav);
    text-transform: uppercase;
    white-space: nowrap;
    text-decoration: none;
    color: var(--wt-color-nav-muted);
}

.wt-nav__list a:hover,
.wt-nav__list .current-menu-item > a {
    color: var(--wt-color-navy);
}

.wt-nav__list .current-menu-item > a::after {
    content: "";
    display: block;
    width: 100%;
    border-top: var(--wt-border-width) solid var(--wt-color-orange);
}

/* Atalhos sociais */
.wt-header__social {
    display: flex;
    align-items: center;
    gap: var(--wt-space-16);
}

.wt-header__icon {
    display: block;
    color: var(--wt-color-orange-icon);
}

/* No Figma o vetor do Instagram está espelhado na vertical */
.wt-header__icon--instagram .wt-icon {
    transform: scaleY(-1);
}

/* ==========================================================================
   Botões
   ========================================================================== */
.wt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--wt-space-8);
    height: var(--wt-btn-h);
    padding-inline: var(--wt-space-32);
    font-family: inherit;
    font-size: var(--wt-fs-button);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-body);
    letter-spacing: var(--wt-ls-tight);
    white-space: nowrap;
    text-decoration: none;
    border: var(--wt-border-width) solid transparent;
    border-radius: var(--wt-radius-md);
    cursor: pointer;
}

.wt-btn .wt-btn__icon {
    width: var(--wt-icon-sm);
    height: var(--wt-icon-sm);
}

/* Ícone + texto: só eles crescem no hover — a caixa do botão não muda de tamanho */
.wt-btn__label {
    display: inline-flex;
    align-items: center;
    gap: var(--wt-space-8);
    transition: transform var(--wt-btn-hover-duration) ease;
}

.wt-btn:not(.wt-btn--static):hover .wt-btn__label,
.wt-btn:not(.wt-btn--static):focus-visible .wt-btn__label {
    transform: scale(var(--wt-btn-hover-scale));
}

@media (prefers-reduced-motion: reduce) {
    .wt-btn__label { transition: none; }
}

.wt-btn--primary {
    background: var(--wt-color-orange-aa);
    border-color: var(--wt-color-orange-aa);
    color: var(--wt-color-white);
}

.wt-btn--outline {
    background: transparent;
    border-color: var(--wt-color-orange-aa);
    color: var(--wt-color-orange-aa);
}

.wt-btn--outline-light {
    background: transparent;
    border-color: var(--wt-color-white);
    color: var(--wt-color-white);
}

/* "Saiba mais" sem página de destino ainda */
.wt-btn--static {
    cursor: default;
}

/* ==========================================================================
   Hero
   ========================================================================== */
.wt-hero {
    position: relative;
    overflow: hidden;
    padding-block: var(--wt-space-128);
    background: var(--wt-color-white);
}

.wt-hero__inner {
    position: relative;
}

.wt-hero__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wt-space-24);
    width: min(var(--wt-hero-text-w), var(--wt-hero-text-ratio));
}

.wt-hero__title,
.wt-hero__lead,
.wt-hero__desc {
    margin: 0;
    color: var(--wt-color-navy);
}

.wt-hero__title {
    font-size: var(--wt-fs-display);
    font-weight: var(--wt-fw-medium);
    line-height: var(--wt-lh-display);
    letter-spacing: var(--wt-ls-display);
}

.wt-hero__lead {
    font-size: var(--wt-fs-lead);
    font-weight: var(--wt-fw-medium);
    line-height: var(--wt-lh-body);
    letter-spacing: var(--wt-ls-tight);
    text-align: justify;
}

.wt-hero__lead strong {
    font-weight: var(--wt-fw-bold);
}

.wt-hero__desc {
    font-size: var(--wt-fs-body);
    font-weight: var(--wt-fw-regular);
    line-height: var(--wt-lh-body);
    letter-spacing: var(--wt-ls-tight);
    text-align: justify;
}

.wt-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--wt-space-24);
}

/* Foguete — caixa rotacionada, geometria do Figma */
.wt-hero__media {
    position: absolute;
    left: var(--wt-hero-media-x);
    top: var(--wt-hero-media-y);
    width: var(--wt-hero-media-w);
    aspect-ratio: var(--wt-hero-media-ratio);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.wt-hero__media-rot {
    position: relative;
    z-index: 1;
    flex: none;
    width: var(--wt-hero-media-inner-w);
    height: var(--wt-hero-media-inner-h);
    overflow: hidden;
    transform: translateY(var(--wt-hero-parallax, 0px)) rotate(var(--wt-hero-media-rotate));
    filter: var(--wt-hero-shadow-rocket);
    will-change: transform;
}

.wt-hero__img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Recorte específico do arquivo padrão (hero-foguete.avif) */
.wt-hero__media--default .wt-hero__img {
    position: absolute;
    left: var(--wt-hero-img-x);
    top: var(--wt-hero-img-y);
    width: var(--wt-hero-img-w);
    height: var(--wt-hero-img-h);
    max-width: none;
    object-fit: fill;
}

/* Ícones de redes flutuando ao redor do foguete */
.wt-hero__floats {
    position: absolute;
    inset: 0;
}

/* Profundidade: as camadas ficam contidas na caixa do foguete */
.wt-hero__media {
    isolation: isolate;
}

.wt-hero__float {
    position: absolute;
    height: auto;
    filter: var(--wt-hero-shadow-icons);
    animation: wt-float 6s ease-in-out infinite alternate;
}

.wt-hero__float--instagram {
    z-index: 0;
    left: var(--wt-hero-float-ig-x);
    top: var(--wt-hero-float-ig-y);
    width: var(--wt-hero-float-ig-w);
}

.wt-hero__float--whatsapp {
    z-index: 2;
    right: var(--wt-hero-float-wa-x);
    top: var(--wt-hero-float-wa-y);
    width: var(--wt-hero-float-wa-w);
    animation-duration: 5s;
    animation-delay: -2s;
}

.wt-hero__float--facebook {
    z-index: 2;
    left: var(--wt-hero-float-fb-x);
    top: var(--wt-hero-float-fb-y);
    width: var(--wt-hero-float-fb-w);
    animation-duration: 7s;
    animation-delay: -4s;
}

@keyframes wt-float {
    from { transform: translateY(0); }
    to   { transform: translateY(calc(var(--wt-hero-float-distance) * -1)); }
}

@media (prefers-reduced-motion: reduce) {
    .wt-hero__float { animation: none; }
}

/* ==========================================================================
   Animação de entrada das seções
   [data-reveal]          o próprio elemento sobe com fade.
   [data-reveal-stagger]  os filhos diretos sobem um por vez (título, textos, cards…).
   Cada um anima quando entra na tela (.is-revealed, via JS no footer).
   Ordem: style="--wt-reveal-order: N" (atraso = N × --wt-reveal-step); no stagger,
   os filhos começam no N do container e seguem +1 cada (limite de 8 degraus).
   Sem JS ou com movimento reduzido, tudo aparece direto.
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
    .wt-js [data-reveal],
    .wt-js [data-reveal-stagger] > * {
        opacity: 0;
    }

    .wt-js [data-reveal].is-revealed,
    .wt-js [data-reveal-stagger].is-revealed > * {
        animation: wt-reveal var(--wt-reveal-duration) var(--wt-reveal-ease) calc((var(--wt-reveal-order, 0) + var(--wt-reveal-i, 0)) * var(--wt-reveal-step)) both;
    }

    .wt-js [data-reveal="lg"] {
        --wt-reveal-duration: var(--wt-reveal-duration-lg);
        --wt-reveal-distance: var(--wt-reveal-distance-lg);
    }

    [data-reveal-stagger] > *              { --wt-reveal-i: 0; }
    [data-reveal-stagger] > :nth-child(2)  { --wt-reveal-i: 1; }
    [data-reveal-stagger] > :nth-child(3)  { --wt-reveal-i: 2; }
    [data-reveal-stagger] > :nth-child(4)  { --wt-reveal-i: 3; }
    [data-reveal-stagger] > :nth-child(5)  { --wt-reveal-i: 4; }
    [data-reveal-stagger] > :nth-child(6)  { --wt-reveal-i: 5; }
    [data-reveal-stagger] > :nth-child(7)  { --wt-reveal-i: 6; }
    [data-reveal-stagger] > :nth-child(n+8) { --wt-reveal-i: 7; }
}

/* translate (e não transform) para não brigar com transforms/parallax já existentes */
@keyframes wt-reveal {
    from { opacity: 0; translate: 0 var(--wt-reveal-distance); }
    to   { opacity: 1; translate: 0 0; }
}

/* ==========================================================================
   Benefícios (faixa)
   ========================================================================== */
.wt-beneficios {
    padding-block: var(--wt-space-55);
    background: var(--wt-color-white);
}

.wt-beneficios__list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: var(--wt-space-91);
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
}

.wt-beneficios__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--wt-space-4);
}

.wt-beneficios__icon {
    width: var(--wt-icon-xl);
    height: var(--wt-icon-xl);
    margin-bottom: var(--wt-space-12);
}

/* Ícones duotone: contorno navy, preenchimento azul claro, detalhes laranja */
.wt-duo {
    color: var(--wt-color-navy);
}

.wt-duo .duo-fill {
    fill: var(--wt-color-sky);
    fill-opacity: var(--wt-duo-fill-opacity);
}

.wt-duo .duo-accent {
    stroke: var(--wt-color-orange);
}

.wt-duo .duo-accent-fill {
    fill: var(--wt-color-orange);
    fill-opacity: var(--wt-duo-fill-opacity);
}

.wt-beneficios__title {
    font-size: var(--wt-fs-stat);
    font-weight: var(--wt-fw-bold);
    line-height: var(--wt-lh-normal);
    color: var(--wt-color-navy);
}

.wt-beneficios__text {
    font-size: var(--wt-fs-stat-label);
    font-weight: var(--wt-fw-regular);
    line-height: var(--wt-lh-normal);
    color: var(--wt-color-text-muted);
}

/* ==========================================================================
   Avaliações Google (Trustindex)
   ========================================================================== */
.wt-reviews {
    padding-block: var(--wt-space-64);
}

.wt-reviews .wt-section__head {
    margin-bottom: var(--wt-space-32);
}

.wt-reviews__widget {
    width: 100%; /* NÃO usar max-width (context.md 4.8) */
}

.wt-reviews__cta {
    text-align: center;
    margin-top: var(--wt-space-32);
}

.wt-reviews__cta:first-child {
    margin-top: 0;
}

/* ==========================================================================
   Vídeos verticais (facade — context.md 4.3)
   ========================================================================== */
.wt-videos {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--wt-space-24);
}

.wt-videos--pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wt-video {
    display: flex;
    flex-direction: column;
    gap: var(--wt-space-12);
    margin: 0;
}

.wt-video-btn,
.wt-video-frame {
    border-radius: var(--wt-radius-lg);
    background: var(--wt-color-navy);
}

.wt-video-btn {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: var(--wt-video-ratio);
    padding: 0;
    border: 0;
    overflow: hidden;
    cursor: pointer;
}

.wt-video-btn img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.wt-video-btn__play {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--wt-float-size);
    height: var(--wt-float-size);
    border-radius: var(--wt-radius-pill);
    background: var(--wt-color-orange-aa);
    color: var(--wt-color-white);
    transform: translate(-50%, -50%);
}

.wt-video-btn__play .wt-icon {
    fill: currentColor;
}

.wt-video__caption {
    font-size: var(--wt-fs-body);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-body);
    color: var(--wt-color-navy);
}

/* ==========================================================================
   Serviços
   ========================================================================== */
.wt-servico {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: var(--wt-space-64);
}

.wt-servico + .wt-servico {
    margin-top: var(--wt-section-pad);
}

.wt-servico--reverse > :first-child {
    order: 2;
}

.wt-servico__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wt-space-16);
}

.wt-servico__logo {
    width: auto;
    height: var(--wt-brand-logo-h);
}

.wt-servico__logo--maps {
    height: calc(var(--wt-brand-logo-h) * 2);
}

.wt-servico__selo {
    width: 100%;
    max-width: calc(var(--wt-brand-logo-h) * 9);
    border-radius: var(--wt-radius-md);
}

.wt-servico__kicker {
    margin: 0;
    font-size: var(--wt-fs-button);
    font-weight: var(--wt-fw-bold);
}

.wt-servico__title {
    margin: 0;
    font-size: var(--wt-fs-stat);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-heading);
    letter-spacing: var(--wt-ls-tight);
}

.wt-servico__subtitle {
    margin: 0;
    font-size: var(--wt-fs-button);
    font-weight: var(--wt-fw-bold);
}

.wt-servico__figure {
    margin: 0;
    width: 100%;
}

.wt-servico__figure img,
.wt-result__img {
    width: 100%;
    border: var(--wt-border-width) solid var(--wt-color-sky);
    border-radius: var(--wt-radius-md);
}

.wt-servico__cards {
    display: flex;
    flex-direction: column;
    gap: var(--wt-space-24);
}

/* Google Maps: cabeçalho centralizado em largura total, cards lado a lado abaixo */
.wt-servico--stacked {
    grid-template-columns: minmax(0, 1fr);
}

.wt-servico--stacked .wt-servico__body {
    align-items: center;
    text-align: center;
}

.wt-servico--stacked .wt-servico__lead {
    width: 100%;
    max-width: var(--wt-servico-lead-w);
    text-align: center;
}

.wt-servico--stacked .wt-servico__cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
}

.wt-servico--stacked .wt-result .wt-actions {
    margin-top: auto;
}

.wt-servico__media {
    display: flex;
    justify-content: center;
}

.wt-servico__illustration {
    width: 100%;
    max-width: var(--wt-portrait-max);
    border-radius: var(--wt-radius-lg);
}

/* Card de resultado */
.wt-result {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wt-space-16);
    padding: var(--wt-space-32);
    border-radius: var(--wt-radius-lg);
    background: var(--wt-color-white);
    box-shadow: var(--wt-shadow-card);
}

.wt-result__title {
    margin: 0;
    font-size: var(--wt-fs-lead);
    font-weight: var(--wt-fw-bold);
    line-height: var(--wt-lh-heading);
}

.wt-result__period {
    margin: 0;
    font-size: var(--wt-fs-body);
}

.wt-result__metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wt-space-12);
    width: 100%;
    margin: 0;
}

.wt-result__metric {
    padding: var(--wt-space-12) var(--wt-space-16);
    border-radius: var(--wt-radius-md);
    background: var(--wt-color-white);
}

.wt-result__metric dt {
    font-size: var(--wt-fs-nav);
    font-weight: var(--wt-fw-semibold);
    letter-spacing: var(--wt-ls-nav);
    text-transform: uppercase;
    color: var(--wt-color-text-muted);
}

.wt-result__metric dd {
    margin: 0;
    font-size: var(--wt-fs-lead);
    font-weight: var(--wt-fw-bold);
}

.wt-result__cta {
    margin: 0;
    font-size: var(--wt-fs-button);
    font-weight: var(--wt-fw-semibold);
}

/* ==========================================================================
   Clientes — carrossel infinito (context.md 4.10)
   ========================================================================== */
/* Dentro de Cases: faixa full width (fora do .wt-container), logo abaixo dos vídeos */
.wt-clientes {
    margin-top: var(--wt-space-64);
}

.wt-clientes__hat {
    margin: 0 0 var(--wt-space-32);
    padding-inline: var(--wt-gutter);
    text-align: center;
}

.wt-marquee {
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}

.wt-marquee__track {
    display: flex;
    align-items: center;
    width: max-content;
    animation: wt-marquee 80s linear infinite;
}

.wt-marquee:hover .wt-marquee__track {
    animation-play-state: paused;
}

/* margin (e não gap) para o trilho duplicado fechar o loop em exatos -50% */
.wt-marquee__item {
    flex: none;
    margin-right: var(--wt-space-48);
}

.wt-marquee__item img {
    display: block;
    width: auto;
    height: var(--wt-marquee-logo-h);
    border-radius: var(--wt-radius-md);
    object-fit: contain;
}

@keyframes wt-marquee {
    to { transform: translateX(-50%); }
}

/* ==========================================================================
   Demais serviços — cards
   ========================================================================== */
.wt-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--wt-space-24);
}

.wt-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wt-space-16);
    padding: var(--wt-space-32);
    border-radius: var(--wt-radius-lg);
    background: var(--wt-color-white);
    box-shadow: var(--wt-shadow-card);
}

.wt-card__icons {
    display: flex;
    justify-content: center;
    gap: var(--wt-space-8);
    align-self: center;
}

.wt-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--wt-icon-box);
    height: var(--wt-icon-box);
    border-radius: var(--wt-radius-pill);
    background: var(--wt-color-white);
    color: var(--wt-color-orange-icon);
}

.wt-card__icon .wt-icon {
    width: var(--wt-icon-lg);
    height: var(--wt-icon-lg);
}

.wt-card__title {
    align-self: stretch;
    margin: 0;
    text-align: center;
    font-size: var(--wt-fs-stat);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-heading);
    letter-spacing: var(--wt-ls-tight);
}

.wt-card__text {
    align-self: stretch;
    margin: 0;
    font-size: var(--wt-fs-button);
    line-height: var(--wt-lh-body);
    text-align: justify;
}

.wt-card__actions {
    align-self: center;
    margin-top: auto;
    padding-top: var(--wt-space-8);
}

/* ==========================================================================
   Mentoria
   ========================================================================== */
.wt-mentoria .wt-split {
    align-items: start;
}

.wt-mentoria .wt-split__media {
    display: flex;
    flex-direction: column;
    gap: var(--wt-space-24);
}

.wt-mentoria__videos-title {
    margin: 0;
    font-size: var(--wt-fs-button);
    font-weight: var(--wt-fw-bold);
    letter-spacing: var(--wt-ls-tight);
}

/* ==========================================================================
   Presença
   ========================================================================== */
.wt-presenca__box {
    padding: var(--wt-space-32);
    border-radius: var(--wt-radius-lg);
    background: var(--wt-color-white);
    box-shadow: var(--wt-shadow-card);
}

.wt-presenca__box-title {
    margin: 0 0 var(--wt-space-24);
    font-size: var(--wt-fs-stat);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-heading);
}

.wt-checklist {
    display: flex;
    flex-direction: column;
    gap: var(--wt-space-12);
    margin: 0;
    padding: 0;
    list-style: none;
}

.wt-checklist li {
    position: relative;
    padding-left: var(--wt-space-24);
    font-size: var(--wt-fs-button);
    line-height: var(--wt-lh-body);
}

.wt-checklist li::before {
    content: "";
    position: absolute;
    left: 0;
    top: calc((1em * var(--wt-lh-body) - var(--wt-space-8)) / 2);
    width: var(--wt-space-8);
    height: var(--wt-space-8);
    border-radius: var(--wt-radius-pill);
    background: var(--wt-color-orange-icon);
}

.wt-presenca__close {
    max-width: var(--wt-container-narrow);
    margin: var(--wt-space-64) auto 0;
    text-align: center;
}

.wt-presenca__conclusao {
    margin: 0 0 var(--wt-space-32);
    font-size: var(--wt-fs-stat);
    font-weight: var(--wt-fw-bold);
    line-height: var(--wt-lh-heading);
}

/* ==========================================================================
   Experiência — segmentos
   ========================================================================== */
.wt-experiencia__intro {
    font-style: italic;
}

.wt-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--wt-space-12);
    max-width: var(--wt-container);
    margin: 0 auto var(--wt-space-64);
    padding: 0;
    list-style: none;
}

.wt-chip {
    padding: var(--wt-space-8) var(--wt-space-16);
    border: var(--wt-border-width) solid var(--wt-color-sky);
    border-radius: var(--wt-radius-pill);
    font-size: var(--wt-fs-body);
    line-height: var(--wt-lh-body);
    color: var(--wt-color-white);
}

/* ==========================================================================
   Diferenciais
   ========================================================================== */
.wt-diferenciais__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--wt-space-64) var(--wt-space-32);
    margin: 0;
    padding: 0;
    list-style: none;
}

.wt-diferencial {
    display: flex;
    flex-direction: column;
    gap: var(--wt-space-12);
    padding-top: var(--wt-space-24);
    border-top: var(--wt-border-width) solid var(--wt-color-sky);
}

.wt-diferencial__num {
    font-size: var(--wt-fs-body);
    font-weight: var(--wt-fw-bold);
    letter-spacing: var(--wt-ls-nav);
    color: var(--wt-color-orange-text);
}

.wt-diferencial__title {
    margin: 0;
    font-size: var(--wt-fs-stat);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-heading);
}

.wt-diferencial__text {
    margin: 0;
    font-size: var(--wt-fs-button);
    line-height: var(--wt-lh-body);
    text-align: justify;
}

/* ==========================================================================
   Retrato (Quem somos / Formulário)
   ========================================================================== */
.wt-portrait {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: 100%;
    padding-top: var(--wt-space-32);
    overflow: hidden;
    border-radius: var(--wt-radius-lg);
    background: var(--wt-color-navy);
}

.wt-portrait__img {
    width: 100%;
}

.wt-portrait--form {
    max-width: calc(var(--wt-icon-box) * 5);
    margin-top: var(--wt-space-16);
}

.wt-sobre .wt-split {
    align-items: start;
}

.wt-sobre .wt-portrait {
    max-width: var(--wt-portrait-max);
    margin-left: auto;
}

/* ==========================================================================
   Atendimento online
   ========================================================================== */
.wt-atendimento,
.wt-experiencia {
    background: var(--wt-color-navy-deep);
    background-image: var(--wt-gradient-dark);
}

.wt-atendimento .wt-section__head {
    margin-bottom: var(--wt-space-32);
}

.wt-atendimento__intro,
.wt-atendimento .wt-section__title {
    max-width: var(--wt-heading-narrow);
    text-wrap: balance;
}

/* ==========================================================================
   FAQ
   ========================================================================== */
.wt-faq__list {
    border-top: var(--wt-border-width) solid var(--wt-color-sky);
}

.wt-faq__item {
    border-bottom: var(--wt-border-width) solid var(--wt-color-sky);
}

.wt-faq__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--wt-space-16);
    padding-block: var(--wt-space-24);
    cursor: pointer;
    list-style: none;
}

.wt-faq__question::-webkit-details-marker {
    display: none;
}

.wt-faq__question-text {
    margin: 0;
    font-size: var(--wt-fs-lead);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-heading);
}

.wt-faq__chevron {
    color: var(--wt-color-orange-icon);
    transition: transform .2s ease;
}

.wt-faq__item[open] .wt-faq__chevron {
    transform: rotate(180deg);
}

.wt-faq__answer {
    padding-bottom: var(--wt-space-24);
}

.wt-faq__answer p {
    margin: 0;
    font-size: var(--wt-fs-button);
    line-height: var(--wt-lh-body);
    text-align: justify;
}

/* ==========================================================================
   Formulário
   ========================================================================== */
.wt-formulario .wt-split {
    align-items: start;
}

.wt-formulario__texto {
    margin: 0;
    font-size: var(--wt-fs-button);
    font-weight: var(--wt-fw-semibold);
    line-height: var(--wt-lh-body);
}

.wt-form {
    padding: var(--wt-space-32);
    border-radius: var(--wt-radius-lg);
    background: var(--wt-color-white);
}

.wt-form__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wt-space-16) var(--wt-space-24);
}

.wt-form__field {
    display: flex;
    flex-direction: column;
    gap: var(--wt-space-8);
}

.wt-form__field--full {
    grid-column: 1 / -1;
}

.wt-form__label {
    font-size: var(--wt-fs-nav);
    font-weight: var(--wt-fw-semibold);
    letter-spacing: var(--wt-ls-nav);
    text-transform: uppercase;
}

.wt-form__input {
    width: 100%;
    height: var(--wt-btn-h);
    padding: 0 var(--wt-space-16);
    border: var(--wt-border-width) solid var(--wt-color-nav-muted);
    border-radius: var(--wt-radius-md);
    background: var(--wt-color-white);
    font-family: inherit;
    font-size: var(--wt-fs-button);
    color: var(--wt-color-navy);
}

.wt-form__input--textarea {
    height: var(--wt-textarea-h);
    padding-block: var(--wt-space-12);
    resize: vertical;
}

.wt-form__submit {
    width: 100%;
    margin-top: var(--wt-space-24);
}

.wt-form__notice {
    margin: 0 0 var(--wt-space-24);
    padding: var(--wt-space-12) var(--wt-space-16);
    border-radius: var(--wt-radius-md);
    font-size: var(--wt-fs-body);
    font-weight: var(--wt-fw-semibold);
}

.wt-form__notice--ok {
    background: var(--wt-color-surface-alt);
}

.wt-form__notice--erro {
    border: var(--wt-border-width) solid var(--wt-color-orange-aa);
    color: var(--wt-color-orange-text);
}

/* Honeypot — fora da tela, invisível para pessoas */
.wt-form__hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* ==========================================================================
   Política de Privacidade
   ========================================================================== */
.wt-legal__topbar {
    margin-bottom: var(--wt-space-32);
}

.wt-legal .wt-section__head {
    margin-bottom: var(--wt-space-32);
}

.wt-legal__body p,
.wt-legal__body li {
    font-size: var(--wt-fs-button);
    line-height: var(--wt-lh-body);
    text-align: justify;
}

.wt-legal__body h2 {
    margin-top: var(--wt-space-32);
    padding-top: var(--wt-space-32);
    border-top: var(--wt-border-width) solid var(--wt-color-sky);
    font-size: var(--wt-fs-stat);
}

.wt-legal__body a {
    color: var(--wt-color-navy);
}

.wt-legal__actions--bottom {
    margin-top: var(--wt-space-64);
    text-align: center;
}

/* ==========================================================================
   Mapa — faixa full width colada no rodapé, com a mesma altura dele
   (--wt-map-h vem do JS no footer; o token é só o valor até o JS medir)
   ========================================================================== */
.wt-map {
    height: var(--wt-map-h, var(--wt-map-h-fallback));
    background: var(--wt-color-surface-alt);
}

.wt-map__frame {
    display: block; /* sem o vão de baseline de elemento inline */
    width: 100%;
    height: 100%;
    border: 0;
}

/* ==========================================================================
   Rodapé (context.md 4.4)
   ========================================================================== */
.wt-footer {
    padding-top: var(--wt-space-64);
    background: var(--wt-color-navy-deep);
    background-image: var(--wt-gradient-dark);
    color: var(--wt-color-white);
    font-size: var(--wt-fs-body);
}

.wt-footer a:focus-visible {
    outline-color: var(--wt-focus-color-on-dark);
}

.wt-footer__grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1.2fr 0.8fr; /* context.md: 1.4fr 1fr 1fr 0.8fr — col. 3 alargada p/ o e-mail caber */
    gap: var(--wt-space-32);
    padding-bottom: var(--wt-space-64);
}

.wt-footer__logo {
    display: inline-block;
}

.wt-footer__logo-crop {
    position: relative;
    display: block;
    width: var(--wt-logo-white-w);
    aspect-ratio: var(--wt-logo-white-ratio);
    overflow: hidden;
}

.wt-footer__logo-crop img {
    position: absolute;
    left: var(--wt-logo-white-crop-x);
    top: var(--wt-logo-white-crop-y);
    width: var(--wt-logo-white-crop-w);
    height: var(--wt-logo-white-crop-h);
    max-width: none;
}

.wt-footer__title {
    margin: 0 0 var(--wt-space-8);
    font-size: var(--wt-fs-nav);
    font-weight: var(--wt-fw-semibold);
    letter-spacing: var(--wt-ls-nav);
    text-transform: uppercase;
    color: var(--wt-color-sky);
}

.wt-footer__list {
    display: flex;
    flex-direction: column;
    gap: var(--wt-space-24);
    margin: 0;
    padding: 0;
    list-style: none;
}

.wt-footer__link {
    display: flex;
    align-items: flex-start;
    gap: var(--wt-space-8);
    color: var(--wt-color-white);
    text-decoration: none;
    line-height: var(--wt-lh-body);
    overflow-wrap: break-word;
}

.wt-footer__link:hover span {
    text-decoration: underline;
}

.wt-footer__link .wt-footer__icon {
    width: var(--wt-icon-sm);
    height: calc(1em * var(--wt-lh-body));
    color: var(--wt-color-orange);
}

.wt-footer__social {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wt-space-8);
    margin: 0;
    padding: 0;
    list-style: none;
}

.wt-footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--wt-social-size);
    height: var(--wt-social-size);
    border: var(--wt-border-width) solid var(--wt-color-sky);
    border-radius: var(--wt-radius-pill);
    color: var(--wt-color-white);
}

.wt-footer__social-link .wt-icon {
    width: var(--wt-icon-sm);
    height: var(--wt-icon-sm);
}

.wt-footer__bottom {
    background: var(--wt-color-navy-deepest);
}

.wt-footer__bottom-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--wt-space-16);
    padding-block: var(--wt-space-24);
    color: var(--wt-color-sky);
}

.wt-footer__bottom-inner p {
    margin: 0;
}

.wt-footer__bottom-inner a {
    color: var(--wt-color-white);
}

/* Botão flutuante WhatsApp (context.md 4.1) */
.wt-whatsapp-float {
    position: fixed;
    bottom: var(--wt-float-offset);
    right: var(--wt-float-offset);
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--wt-float-size);
    height: var(--wt-float-size);
    border-radius: var(--wt-radius-pill);
    background: var(--wt-color-whatsapp);
    color: var(--wt-color-white);
    box-shadow: var(--wt-shadow-float);
    text-decoration: none;
    transition: transform .2s ease;
}

.wt-whatsapp-float:hover {
    transform: scale(1.1);
}

.wt-whatsapp-float svg {
    width: var(--wt-float-icon);
    height: var(--wt-float-icon);
}

/* ==========================================================================
   Até 1024px — header em duas linhas, grids menores
   ========================================================================== */
@media (max-width: 1024px) {
    .wt-header__inner {
        flex-wrap: wrap;
        row-gap: var(--wt-space-16);
    }

    .wt-header__main {
        display: contents;
    }

    .wt-header__logo   { order: 1; }
    .wt-header__social { order: 2; }

    .wt-nav {
        order: 3;
        width: 100%;
    }

    .wt-nav__list {
        flex-wrap: wrap;
        column-gap: var(--wt-space-24);
        row-gap: var(--wt-space-8);
    }

    .wt-videos {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .wt-videos--pair {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wt-cards,
    .wt-diferenciais__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

/* ==========================================================================
   Tablet — até 768px
   ========================================================================== */
@media (max-width: 768px) {
    :root {
        --wt-gutter: var(--wt-gutter-mobile);
        --wt-section-pad: var(--wt-section-pad-mobile);
    }

    .wt-section__title {
        font-size: var(--wt-fs-h2-mobile);
    }

    .wt-section__head {
        margin-bottom: var(--wt-space-32);
    }

    .wt-hero {
        padding-block: var(--wt-space-64);
    }

    .wt-hero__content {
        width: 100%;
    }

    .wt-hero__title {
        font-size: var(--wt-fs-display-mobile);
    }

    .wt-hero__media {
        position: relative;
        left: auto;
        top: auto;
        width: min(var(--wt-hero-media-w-mobile), 100%);
        margin: var(--wt-space-32) auto 0;
    }

    .wt-beneficios__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: var(--wt-space-24);
        row-gap: var(--wt-space-32);
    }

    .wt-split,
    .wt-servico {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--wt-space-32);
    }

    .wt-servico--reverse > :first-child {
        order: 0;
    }

    .wt-servico--stacked .wt-servico__cards {
        grid-template-columns: minmax(0, 1fr);
    }

    .wt-portrait {
        max-width: calc(var(--wt-icon-box) * 6);
        margin-inline: auto;
    }
}

/* ==========================================================================
   Mobile — até 600px
   ========================================================================== */
@media (max-width: 600px) {
    /* Justificado abre buracos em linhas curtas: alinhado à esquerda no mobile */
    .wt-hero__lead,
    .wt-hero__desc,
    .wt-text,
    .wt-card__text,
    .wt-diferencial__text,
    .wt-faq__answer p,
    .wt-legal__body p,
    .wt-legal__body li {
        text-align: left;
    }

    /* Vídeos verticais: carrossel com respiro lateral de 48px (context.md 4.3) */
    .wt-videos,
    .wt-videos--pair {
        display: flex;
        gap: var(--wt-space-16);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-inline: var(--wt-space-48);
        margin-inline: calc(var(--wt-gutter) * -1);
    }

    .wt-video {
        flex: 0 0 100%;
        scroll-snap-align: center;
    }

    .wt-cards,
    .wt-diferenciais__list,
    .wt-result__metrics,
    .wt-form__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .wt-card,
    .wt-result,
    .wt-presenca__box,
    .wt-form {
        padding: var(--wt-space-24);
    }

    .wt-actions .wt-btn {
        flex: 1 1 auto;
    }

    /* Rodapé: 1 coluna centralizada; ícones acima do texto, exceto redes */
    .wt-footer__grid {
        grid-template-columns: minmax(0, 1fr);
        text-align: center;
    }

    .wt-footer__logo {
        display: flex;
        justify-content: center;
    }

    .wt-footer__link {
        flex-direction: column;
        align-items: center;
    }

    .wt-footer__social {
        justify-content: center;
    }

    .wt-footer__bottom-inner {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    /* espaço para o botão flutuante não cobrir o copyright */
    .wt-footer__bottom-inner {
        padding-bottom: calc(var(--wt-float-size) + var(--wt-float-offset) * 2);
    }
}

/* ==========================================================================
   Carrossel: mobile ~20% mais rápido; respeita redução de movimento
   ========================================================================== */
@media (max-width: 768px) {
    .wt-marquee__track { animation-duration: 64s; }
    .wt-map { height: var(--wt-map-h-mobile); }
}

@media (prefers-reduced-motion: reduce) {
    .wt-marquee__track { animation: none; }
    .wt-faq__chevron,
    .wt-whatsapp-float { transition: none; }
}