/* =========================================================
   links.css — Link in bio · Confiança FIDC
   Mobile-first · CSS exclusivo · Subdomain standalone
   ========================================================= */

/* ── Tokens ─────────────────────────────────────────────── */
:root {
    --font-main:    'Montserrat', sans-serif;
    --fw-light:     300;
    --fw-regular:   400;
    --fw-medium:    500;
    --fw-semibold:  600;
    --fw-bold:      700;
    --fw-black:     800;
    --lh-tight:     1.1;
    --lh-normal:    1.5;
    --lh-loose:     1.8;

    --color-black:  #000000;
    --bg:           #0A0A0A;
    --white:        #FFFFFF;
    --muted:        rgba(255, 255, 255, 0.60);
    --dim:          rgba(255, 255, 255, 0.25);
    --soft:         rgba(255, 255, 255, 0.85); /* texto/ícone secundário — near-white padrão */
    --border:       rgba(255, 255, 255, 0.10);
    --green:        #25D366;
    --gold:         #d6960b;

    --r:            12px;
    --max:          420px;
    --ease:         0.35s ease;
}

/* ── Reset ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; font-family: var(--font-main); }

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-size-adjust: none;
    -webkit-text-size-adjust: none;
    font-size: 16px;
    overflow-x: hidden;
    max-width: 100%;
}

body {
    font-family: var(--font-main);
    background: var(--bg);
    color: var(--white);
    min-height: 100dvh;
    display: flex;
    justify-content: center;
    padding: 0 16px 52px;
    overflow-x: hidden;
    width: 100%;
    max-width: 100vw;
    position: relative;
}

a { text-decoration: none; color: inherit; -webkit-tap-highlight-color: transparent; }
button { background: none; border: none; font-family: var(--font-main); cursor: pointer; color: inherit; }

/* ── Fundo de página — preto sólido ──────────────────────── */
.lk-bg {
    position: fixed;
    inset: 0;
    z-index: -1;
    background-color: #000000;
}

/* ── Wrap ────────────────────────────────────────────────── */
.lk-wrap {
    width: 100%;
    max-width: var(--max);
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding-top: 32px;
    position: relative;
    z-index: 1;
    zoom: 0.9; /* escala geral — base compacta (ajustar em telas maiores) */
}

/* ═══════════════════════════════════════════════════════════
   HEADER — logo no topo, imagem abaixo, texto dentro da imagem
═══════════════════════════════════════════════════════════ */
.lk-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 6px;
    /* SEM overflow:hidden — o selo precisa sobressair */
}

/* ── Selo — link para o site, fica sobre a imagem ────────── */
.lk-seal {
    width: 82px;
    height: 82px;
    border-radius: 50%;
    background: #0E0E0E;
    border: 1.5px solid rgba(255, 255, 255, 0.315);
    box-shadow:
        0 0 0 4px rgba(255, 255, 255, 0.04),
        0 10px 32px rgba(0, 0, 0, 0.80);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px;
    margin-bottom: -21px; /* sobrepõe a imagem abaixo */
    position: relative;
    z-index: 2;
    flex-shrink: 0;
    transition: border-color 0.30s ease, box-shadow 0.30s ease, transform 0.25s ease;
}

.lk-seal:hover {
    border-color: rgba(255, 255, 255, 0.40);
    box-shadow:
        0 0 0 6px rgba(255, 255, 255, 0.07),
        0 0 32px rgba(255, 255, 255, 0.12),
        0 10px 32px rgba(0, 0, 0, 0.70);
    transform: translateY(-3px);
}

.lk-seal img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(1.05);
}

/* ── Imagem hero — foto viva, sem overlay ─────────────────── */
.lk-hero-img {
    width: 100%;
    aspect-ratio: 4 / 2;
    border-radius: 16px;
    background-image: url('assets/capa.png');
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}

/* ── Bloco de texto abaixo da imagem ──────────────────────── */
.lk-hero-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-align: center;
    margin-top: 16px;
}

.lk-name {
    font-size: 18px;
    font-weight: var(--fw-black);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--white);
    line-height: var(--lh-tight);
}

.lk-tagline {
    font-size: 13px;
    font-weight: var(--fw-regular);
    color: var(--soft);
    line-height: 1.60;
    position: relative;
    z-index: 1;
}

/* ═══════════════════════════════════════════════════════════
   SECTION LABEL — linha + texto + linha
═══════════════════════════════════════════════════════════ */
.lk-label {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--soft);
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 0 2px;
    white-space: nowrap;
}

.lk-label::before,
.lk-label::after {
    content: '';
    flex: 1;
    height: 1px;
    background: rgba(255, 255, 255, 0.07);
}

/* ═══════════════════════════════════════════════════════════
   BOTÕES — sistema de ripple idêntico ao site principal
═══════════════════════════════════════════════════════════ */
.lk-btn {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 13px 15px;
    background: rgba(255, 255, 255, 0.04);
    border: 1.5px solid rgba(255, 255, 255, 0.13);
    border-radius: var(--r);
    color: rgba(255, 255, 255, 0.88);
    cursor: pointer;
    position: relative;
    overflow: visible;
    width: 100%;
    text-align: left;
    -webkit-tap-highlight-color: transparent;
    transition: background var(--ease), color var(--ease),
                border-color var(--ease), box-shadow 0.4s ease;
}

/* Anel ripple — expande e desaparece */
.lk-btn::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: calc(var(--r) + 1px);
    border: 2px solid rgba(255, 255, 255, 0.70);
    opacity: 0;
    transform: scale(1);
    pointer-events: none;
}

.lk-btn:hover {
    background: rgba(255, 255, 255, 0.92);
    border-color: transparent;
    color: var(--color-black);
    box-shadow:
        0 0 0 5px rgba(255, 255, 255, 0.08),
        0 0 28px rgba(255, 255, 255, 0.16);
}

.lk-btn:hover::after {
    animation: btnRippleDark 0.52s ease forwards;
}

.lk-btn:active { transform: scale(0.98); }

/* ── Site — destaque máximo ──────────────────────────────── */
.lk-btn--site {
    border-color: rgba(255, 255, 255, 0.30);
    padding: 15px 15px;
}

/* ── WhatsApp ────────────────────────────────────────────── */
.lk-btn--wa {
    background: rgba(37, 211, 102, 0.07);
    border-color: rgba(37, 211, 102, 0.28);
}

.lk-btn--wa::after {
    border-color: rgba(37, 211, 102, 0.72);
}

.lk-btn--wa:hover {
    background: rgba(37, 211, 102, 0.88);
    border-color: transparent;
    color: #0A0A0A;
    box-shadow:
        0 0 0 4px rgba(37, 211, 102, 0.08),
        0 0 22px rgba(37, 211, 102, 0.24);
}

.lk-btn--wa:hover::after {
    animation: btnRippleGreen 0.52s ease forwards;
}

/* ── Investimento — efeito dourado ───────────────────────── */
.lk-btn--gold {
    background: rgba(201, 165, 90, 0.06);
    border-color: rgba(201, 165, 90, 0.28);
}

.lk-btn--gold .lk-btn-title {
    color: rgba(201, 165, 90, 0.90);
}

.lk-btn--gold .lk-btn-icon {
    background: rgba(201, 165, 90, 0.08);
    color: rgba(201, 165, 90, 0.68);
}

.lk-btn--gold::after {
    border-color: #E8B923;
}

/* Hover dourado claro — mistura gold + branco para não escurecer */
.lk-btn--gold:hover {
    background: #E8B923;
    border-color: transparent;
    color: #1a1200;
    box-shadow:
        0 0 0 5px rgba(230, 200, 128, 0.10),
        0 0 32px rgba(230, 200, 128, 0.26);
}

.lk-btn--gold:hover .lk-btn-title { color: #1a1200; }

.lk-btn--gold:hover::after {
    animation: btnRippleGold 0.52s ease forwards;
}

/* ── Ícone interno ───────────────────────────────────────── */
.lk-btn-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.65);
    transition: background var(--ease), color var(--ease);
}

.lk-btn--wa .lk-btn-icon {
    background: rgba(37, 211, 102, 0.09);
    color: var(--green);
}

.lk-btn:hover .lk-btn-icon,
.lk-btn--wa:hover .lk-btn-icon,
.lk-btn--gold:hover .lk-btn-icon {
    background: rgba(0, 0, 0, 0.07);
    color: #1a1a1a;
}

/* ── Textos dos botões ───────────────────────────────────── */
.lk-btn-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.lk-btn-title {
    font-size: 13.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.01em;
    line-height: 1.2;
    transition: color var(--ease);
}

.lk-btn-sub {
    font-size: 12.5px;
    font-weight: var(--fw-medium);
    color: rgba(255, 255, 255, 0.40);
    line-height: 1.35;
    transition: color var(--ease);
}

.lk-btn:hover .lk-btn-sub { color: rgba(0, 0, 0, 0.62); }

.lk-btn-arrow {
    font-size: 22px;
    font-weight: 300;
    color: rgba(255, 255, 255, 0.28);
    flex-shrink: 0;
    line-height: 1;
    transition: transform 0.22s ease, color var(--ease);
}

.lk-btn:hover .lk-btn-arrow {
    transform: translateX(3px);
    color: rgba(0, 0, 0, 0.28);
}

/* ═══════════════════════════════════════════════════════════
   MINI BOTÕES — acesso rápido sob o Site Oficial
═══════════════════════════════════════════════════════════ */
.lk-mini-row {
    display: flex;
    gap: 8px;
    margin-top: -2px; /* aproxima visualmente do botão site */
}

.lk-mini-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 9px 10px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: var(--r);
    color: rgba(255, 255, 255, 0.60);
    font-family: var(--font-main);
    font-size: 10.5px;
    font-weight: var(--fw-semibold);
    letter-spacing: 0.02em;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    position: relative;
    overflow: visible;
    -webkit-tap-highlight-color: transparent;
    transition: background var(--ease), color var(--ease),
                border-color var(--ease), box-shadow 0.4s ease;
}

.lk-mini-btn::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: calc(var(--r) + 1px);
    border: 2px solid rgba(255, 255, 255, 0.65);
    opacity: 0;
    pointer-events: none;
}

.lk-mini-btn:hover {
    background: rgba(255, 255, 255, 0.90);
    border-color: transparent;
    color: var(--color-black);
    box-shadow:
        0 0 0 3px rgba(255, 255, 255, 0.07),
        0 0 18px rgba(255, 255, 255, 0.13);
}

.lk-mini-btn:hover::after {
    animation: btnRippleDark 0.52s ease forwards;
}

.lk-mini-btn:active { transform: scale(0.97); }

/* ═══════════════════════════════════════════════════════════
   KEYFRAMES — idênticos ao style.css principal
═══════════════════════════════════════════════════════════ */
@keyframes btnRippleDark {
    0%   { opacity: 0.65; transform: scale(1);    }
    100% { opacity: 0;    transform: scale(1.22); }
}

@keyframes btnRippleLight {
    0%   { opacity: 1;   transform: scale(1);    }
    100% { opacity: 0;   transform: scale(1.18); }
}

@keyframes btnRippleGreen {
    0%   { opacity: 0.6; transform: scale(1);    }
    100% { opacity: 0;   transform: scale(1.28); }
}

@keyframes btnRippleGold {
    0%   { opacity: 0.65; transform: scale(1);    }
    100% { opacity: 0;    transform: scale(1.22); }
}

/* ═══════════════════════════════════════════════════════════
   CARDS DE APPS — btn-store idêntico ao index/style.css
═══════════════════════════════════════════════════════════ */
.lk-app-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 14px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.lk-app-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.lk-app-ico { color: rgba(255, 255, 255, 0.48); flex-shrink: 0; }

.lk-app-name {
    font-size: 12px;
    font-weight: var(--fw-black);
    letter-spacing: 0.06em;
    color: var(--white);
    line-height: 1.2;
    margin-bottom: 2px;
}

.lk-app-desc {
    font-size: 12.5px;
    font-weight: var(--fw-regular);
    color: var(--soft);
    line-height: 1.45;
    margin-bottom: 0;
}

.lk-app-btns {
    display: flex;
    gap: 10px;
}

/* ── btn-store — cópia fiel do style.css principal ────────── */
.btn-store {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: rgba(255, 255, 255, 0.178);
    border: 1.5px solid rgba(255, 255, 255, 0.45);
    border-radius: 50px;
    color: rgba(255, 255, 255, 0.88);
    text-decoration: none;
    cursor: pointer;
    overflow: visible;
    position: relative;
    flex: 1;
    justify-content: center;
    -webkit-tap-highlight-color: transparent;
    transition: background var(--ease), color var(--ease),
                border-color var(--ease), box-shadow 0.4s ease;
}

.btn-store::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: 50px;
    border: 2px solid rgba(255, 255, 255, 0.75);
    opacity: 0;
    transform: scale(1);
    pointer-events: none;
}

.btn-store:hover {
    background: rgba(255, 255, 255, 0.92);
    border-color: transparent;
    color: var(--color-black);
    box-shadow:
        0 0 0 5px rgba(255, 255, 255, 0.10),
        0 0 28px rgba(255, 255, 255, 0.22);
}

.btn-store:hover::after { animation: btnRippleDark 0.52s ease forwards; }
.btn-store:active { transform: scale(0.97); }

.btn-store svg { width: 18px; height: 18px; flex-shrink: 0; }

.btn-store span {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    font-size: 12px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.02em;
}

.btn-store span small {
    font-size: 8.5px;
    font-weight: var(--fw-medium);
    letter-spacing: 0.08em;
    opacity: 0.70;
}

/* ═══════════════════════════════════════════════════════════
   REDES SOCIAIS — sem círculo, só ícones
═══════════════════════════════════════════════════════════ */
.lk-social {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 4px 0;
}

.lk-social-group {
    display: flex;
    align-items: center;
}

.lk-social-sep {
    width: 3px;
    height: 18px;
    background: rgba(255, 255, 255, 0.14);
    border-radius: 2px;
    margin: 0 8px;
    flex-shrink: 0;
}

.lk-social-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--soft);
    padding: 12.6px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.25s ease, transform 0.22s ease;
}

.lk-social-btn svg { width: 23px; height: 23px; }

/* Regra do projeto: ímpar → direita, par → esquerda — por grupo */
.lk-social-group .lk-social-btn:nth-child(odd):hover {
    color: rgba(255, 255, 255, 1);
    transform: translateX(3px);
}

.lk-social-group .lk-social-btn:nth-child(even):hover {
    color: rgba(255, 255, 255, 1);
    transform: translateX(-3px);
}

/* ═══════════════════════════════════════════════════════════
   CARREIRAS — card Trabalhe Conosco + selo GPTW
═══════════════════════════════════════════════════════════ */
.lk-career-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 18px 16px;
    background: rgba(255, 255, 255, 0.04);
    border: 1.5px solid rgba(255, 255, 255, 0.13);
    border-radius: var(--r);
    color: rgba(255, 255, 255, 0.88);
    text-align: center;
    position: relative;
    overflow: visible;
    -webkit-tap-highlight-color: transparent;
    transition: background var(--ease), color var(--ease),
                border-color var(--ease), box-shadow 0.4s ease;
}

.lk-career-card::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: calc(var(--r) + 1px);
    border: 2px solid rgba(255, 255, 255, 0.70);
    opacity: 0;
    pointer-events: none;
}

.lk-career-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.lk-career-title {
    font-size: 15px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.01em;
    color: var(--white);
    line-height: 1.2;
    transition: color var(--ease);
}

.lk-career-sub {
    font-size: 13px;
    font-weight: var(--fw-medium);
    color: var(--soft);
    line-height: 1.4;
    transition: color var(--ease);
}

.lk-career-seal {
    width: 220px;
    height: auto;
    display: block;
}

/* Hover (desktop) — realce branco, igual aos botões */
.lk-career-card:hover {
    background: rgba(255, 255, 255, 0.92);
    border-color: transparent;
    color: var(--color-black);
    box-shadow:
        0 0 0 5px rgba(255, 255, 255, 0.08),
        0 0 28px rgba(255, 255, 255, 0.16);
}

.lk-career-card:hover .lk-career-title { color: var(--color-black); }
.lk-career-card:hover .lk-career-sub   { color: rgba(0, 0, 0, 0.62); }
.lk-career-card:hover::after { animation: btnRippleDark 0.52s ease forwards; }
.lk-career-card:active { transform: scale(0.98); }

/* ═══════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════ */
.lk-footer {
    text-align: center;
    padding-top: 6px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.lk-footer p {
    font-size: 13px;
    font-weight: var(--fw-regular);
    color: rgba(255, 255, 255, 0.45);
    line-height: var(--lh-loose);
    margin-bottom: 0;
}

/* ═══════════════════════════════════════════════════════════
   POPUP — bottom sheet deslizante
═══════════════════════════════════════════════════════════ */
.lk-popup-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.28s ease;
}

.lk-popup-overlay.is-open {
    opacity: 1;
    pointer-events: all;
}

.lk-popup {
    width: 100%;
    max-width: 440px;
    background: #141414;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 20px;
    padding: 26px 22px 30px;
    position: relative;
    zoom: 0.9; /* mesma escala do conteúdo */
    transform: translateY(24px) scale(0.98);
    transition: transform 0.38s cubic-bezier(0.34, 1.12, 0.64, 1);
}

.lk-popup-overlay.is-open .lk-popup { transform: translateY(0) scale(1); }

.lk-popup-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 30px;
    height: 30px;
    background: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--soft);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.2s ease, transform 0.2s ease;
}

.lk-popup-close:hover {
    color: #fff;
    transform: scale(1.1);
}

.lk-popup-eyebrow {
    font-size: 8.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: var(--soft);
    margin-bottom: 7px;
}

.lk-popup-title {
    font-size: 20px;
    font-weight: var(--fw-black);
    letter-spacing: -0.015em;
    color: var(--white);
    line-height: var(--lh-tight);
    margin-bottom: 10px;
}

.lk-popup-desc {
    font-size: 12.5px;
    font-weight: var(--fw-regular);
    color: var(--soft);
    line-height: 1.65;
    margin-bottom: 0;
}

.lk-popup-features {
    list-style: none;
    display: flex;
    flex-direction: column;
    margin-top: 16px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 10px;
    overflow: hidden;
}

.lk-popup-features li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    font-size: 12px;
    font-weight: var(--fw-regular);
    color: var(--soft);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    line-height: 1.3;
    transition: background 0.2s ease, color 0.2s ease;
}

.lk-popup-features li:hover {
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 1);
}

.lk-popup-features li:last-child { border-bottom: none; }

.lk-popup-features li::before {
    content: '';
    width: 5px;
    height: 5px;
    min-width: 5px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.26);
    transition: background 0.2s ease;
}

.lk-popup-features li:hover::before { background: rgba(255, 255, 255, 0.68); }

/* CTA do popup — mesmo padrão ripple */
.lk-popup-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin-top: 16px;
    padding: 13px 20px;
    background: linear-gradient(135deg, #ffffff 0%, #e8e8ec 100%);
    border: 1.5px solid transparent;
    border-radius: var(--r);
    color: var(--color-black);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
    font-family: var(--font-main);
    font-size: 13.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    overflow: visible;
    transition: background var(--ease), color var(--ease),
                border-color var(--ease), box-shadow 0.4s ease;
}

.lk-popup-cta::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: calc(var(--r) + 1px);
    border: 2px solid rgba(255, 255, 255, 0.70);
    opacity: 0;
    pointer-events: none;
}

.lk-popup-cta:hover {
    background: rgba(255, 255, 255, 0.92);
    border-color: transparent;
    color: var(--color-black);
    box-shadow:
        0 0 0 4px rgba(255, 255, 255, 0.07),
        0 0 20px rgba(255, 255, 255, 0.14);
}

.lk-popup-cta:hover::after { animation: btnRippleDark 0.52s ease forwards; }

/* ═══════════════════════════════════════════════════════════
   ANIMAÇÃO DE ENTRADA — stagger
═══════════════════════════════════════════════════════════ */
.lk-item {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 0.44s ease, transform 0.44s ease;
}

.lk-item.lk-in {
    opacity: 1;
    transform: translateY(0);
}

/* ═══════════════════════════════════════════════════════════
   TOQUE (mobile) — sem mouse, o hover é o estado PRINCIPAL
   Cada botão já nasce sólido; o hover fica reservado ao desktop.
═══════════════════════════════════════════════════════════ */
@media (hover: none) {

    /* ── Botões neutros — brancos por padrão ── */
    .lk-btn {
        background: var(--white);
        border-color: transparent;
        color: var(--color-black);
        box-shadow:
            0 0 0 4px rgba(255, 255, 255, 0.06),
            0 6px 22px rgba(0, 0, 0, 0.35);
    }

    .lk-btn .lk-btn-icon {
        background: rgba(0, 0, 0, 0.07);
        color: #1a1a1a;
    }

    .lk-btn .lk-btn-sub   { color: rgba(0, 0, 0, 0.87); }
    .lk-btn .lk-btn-arrow { color: rgba(0, 0, 0, 0.28); }

    /* Site Oficial — realce um pouco maior */
    .lk-btn--site {
        box-shadow:
            0 0 0 5px rgba(255, 255, 255, 0.08),
            0 8px 26px rgba(0, 0, 0, 0.40);
    }

    /* ── WhatsApp — verde sólido ── */
    .lk-btn--wa {
        background: rgba(37, 211, 102, 0.95);
        border-color: transparent;
        color: #0A0A0A;
        box-shadow:
            0 0 0 4px rgba(37, 211, 102, 0.10),
            0 6px 22px rgba(0, 0, 0, 0.35);
    }
    .lk-btn--wa .lk-btn-icon {
        background: rgba(0, 0, 0, 0.10);
        color: #0A0A0A;
    }
    .lk-btn--wa .lk-btn-sub   { color: rgba(0, 0, 0, 0.87); }
    .lk-btn--wa .lk-btn-arrow { color: rgba(0, 0, 0, 0.35); }

    /* ── Investir — dourado sólido ── */
    .lk-btn--gold {
        background: #E8B923;
        border-color: transparent;
        color: #1a1200;
        box-shadow:
            0 0 0 5px rgba(230, 200, 128, 0.12),
            0 6px 24px rgba(0, 0, 0, 0.38);
    }
    .lk-btn--gold .lk-btn-title { color: #1a1200; }
    .lk-btn--gold .lk-btn-icon {
        background: rgba(0, 0, 0, 0.10);
        color: #4a3200;
    }
    .lk-btn--gold .lk-btn-sub   { color: rgba(26, 18, 0, 0.87); }
    .lk-btn--gold .lk-btn-arrow { color: rgba(26, 18, 0, 0.40); }

    /* ── Mini botões — brancos ── */
    .lk-mini-btn {
        background: var(--white);
        border-color: transparent;
        color: var(--color-black);
        box-shadow:
            0 0 0 3px rgba(255, 255, 255, 0.06),
            0 4px 16px rgba(0, 0, 0, 0.30);
    }

    /* ── Card Carreiras — branco ── */
    .lk-career-card {
        background: rgb(255, 255, 255);
        border-color: transparent;
        color: var(--color-black);
        box-shadow:
            0 0 0 4px rgba(255, 255, 255, 0.06),
            0 6px 22px rgba(0, 0, 0, 0.35);
    }
    .lk-career-card .lk-career-title { color: var(--color-black); }
    .lk-career-card .lk-career-sub   { color: rgba(0, 0, 0, 0.877); }

    /* ── Botões de loja (App Store / Google Play) — brancos ── */
    .btn-store {
        background: var(--white);
        border-color: transparent;
        color: var(--color-black);
        box-shadow:
            0 0 0 3px rgba(255, 255, 255, 0.06),
            0 4px 16px rgba(0, 0, 0, 0.30);
    }

    /* ── Feedback de toque — ripple ao tocar (:active) ── */
    .lk-btn:active::after,
    .lk-mini-btn:active::after,
    .btn-store:active::after,
    .lk-popup-cta:active::after,
    .lk-career-card:active::after {
        animation: btnRippleDark 0.52s ease forwards;
    }
    .lk-btn--wa:active::after   { animation: btnRippleGreen 0.52s ease forwards; }
    .lk-btn--gold:active::after { animation: btnRippleGold 0.52s ease forwards; }
}

/* ── Desktop ─────────────────────────────────────────────── */
@media (min-width: 540px) {
    body { padding: 0 24px 64px; }
    .lk-wrap { padding-top: 48px; }
    .lk-popup { max-width: 420px; }
}

/* ── Full HD (1920×1080) e acima — escala +20% sobre a base ── */
@media (min-width: 1920px) {
    .lk-wrap  { zoom: 1.08; } /* 0.9 base × 1.2 = +20% */
    .lk-popup { zoom: 1.08; }
}

/* ── Fallback para navegadores sem suporte a zoom (ex.: Firefox < 126) ── */
@supports not (zoom: 1) {
    .lk-wrap {
        transform: scale(0.9);
        transform-origin: top center;
    }
    @media (min-width: 1920px) {
        .lk-wrap { transform: scale(1.08); }
    }
}