/* ============================================================
   LINK 360 — Dra. Luanda Naiara
   LOCAL OVERRIDES ONLY — toda base vem de ../shared/advocacia/advocacia.css
   Aqui só sobrescrevemos as duas cores de marca (dourado vinho-mostarda + champagne).
   NÃO redefinir animações, modais, scroll utils — já existem no shared.
   ============================================================ */

html {
    scroll-behavior: smooth;
}

:root {
    --brand-main: #906c16;
    --brand-hover: #c9a227;
}

body.dark-mode {
    --brand-main: #906c16;
    --brand-hover: #c9a227;
}

body.light-mode {
    --brand-main: #906c16;
    --brand-hover: #b8954a;
}

/* Hero name (Dra. Luanda Naiara) — marrom escuro on-brand no light mode
   Gradiente mais escuro (vinho-mostarda → mostarda) para alto contraste sobre foto clara
   + text-shadow branco sutil pra destacar dos brancos da camisa da Dra. */
body.light-mode .hero-title span {
    background: linear-gradient(to right, #4a3508, #906c16) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    filter: drop-shadow(0 1px 1px rgba(255, 255, 255, 0.5)) drop-shadow(0 1px 3px rgba(0, 0, 0, 0.15));
}

/* Hero pill (categoria) — editorial premium no light mode */
body.light-mode .hero-pill {
    background: linear-gradient(135deg, rgba(255,255,255,0.55) 0%, rgba(250,246,239,0.45) 100%) !important;
    color: #6b4f10 !important;
    border: 1px solid rgba(144, 108, 22, 0.35) !important;
    box-shadow: 0 8px 24px -4px rgba(144, 108, 22, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
    backdrop-filter: blur(10px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(10px) saturate(160%) !important;
    letter-spacing: 0.28em !important;
}

/* ─── Override da fonte serif do nicho (Cormorant) para Playfair Display ─── */
.font-serif,
.ticker-content,
.btn-ativar-som,
.video-label {
    font-family: 'Playfair Display', serif !important;
    letter-spacing: -0.015em;
    line-height: 1.15;
}

/* ─── Hover-lift com tonalidade dourada Luanda ─── */
.hover-lift:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px -15px rgba(201, 162, 39, 0.35);
}

/* ============================================================
   SEÇÕES — Ritmo vertical padronizado + divisor premium entre seções
   Normaliza padding inconsistente (mt-16, py-12, pt-8 pb-2…) e insere
   uma hairline gold centralizada entre seções consecutivas.
   ============================================================ */
main > section.reveal {
    padding-top: 3rem !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
}
main > section.reveal:first-of-type {
    padding-top: 1.5rem !important;
}
main > section.reveal + section.reveal::before {
    content: '';
    display: block;
    width: 32px;
    height: 1px;
    background: rgba(144, 108, 22, 0.4);
    margin: 0 auto 3rem;
}

/* Cabeçalho de seção: gap consistente entre eyebrow → título → divider local */
main > section.reveal > .flex.flex-col.items-center {
    margin-bottom: 2.5rem !important;
}

/* ─── Diferenciais: garantir ícone branco visível sobre o gold no hover (dark + light) ─── */
.hover-lift:hover > div:first-child,
.hover-lift:hover > div:first-child i {
    color: #ffffff !important;
}

/* ─── Pill de comarca: hover dourado refinado ─── */
.bg-zinc-900.rounded-2xl:hover h4 {
    color: var(--brand-hover);
    transition: color 0.4s ease;
}

/* ─── Botão de download do ebook: efeito shimmer gold ─── */
a[href*="ebook.luandanaiaraadv"] {
    position: relative;
    overflow: hidden;
}
a[href*="ebook.luandanaiaraadv"]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);
    transition: left 0.7s ease;
    pointer-events: none;
}
a[href*="ebook.luandanaiaraadv"]:hover::before {
    left: 100%;
}

/* ─── Blocos com fundo dourado-preto (ebook + credenciais OAB): preservar contraste no light mode ─── */
body.light-mode [class*="from-[#1a1408]"],
body.light-mode [class*="from-[#0d0d0d]"] {
    color: #ffffff !important;
}
body.light-mode [class*="from-[#1a1408]"] *,
body.light-mode [class*="from-[#0d0d0d]"] * {
    color: inherit;
}
body.light-mode [class*="from-[#1a1408]"] h2,
body.light-mode [class*="from-[#1a1408]"] h3,
body.light-mode [class*="from-[#0d0d0d]"] h2,
body.light-mode [class*="from-[#0d0d0d]"] h3 {
    color: #ffffff !important;
}

/* ─── CTA WhatsApp principal (gradiente dourado): texto sempre branco no light mode ─── */
body.light-mode [class*="from-[#906c16]"],
body.light-mode [class*="from-[#906c16]"] span,
body.light-mode [class*="from-[#906c16]"] i,
body.light-mode [class*="from-[#906c16]"] div {
    color: #ffffff !important;
}

/* ============================================================
   LINK CARDS — Modelo herdado do Lumina (Google, IG, LinkedIn, FB)
   Mesma estrutura em light e dark — só muda fundo + cor de texto
   Estrutura HTML esperada:
     <a class="link-card">
       <div class="lc-icon"><i class="..."></i></div>
       <div class="flex-1 min-w-0">
         <div class="lc-label">SUBLABEL</div>
         <div class="lc-title">TÍTULO</div>
       </div>
       <i class="fa-solid fa-chevron-right lc-arrow"></i>
     </a>
   ============================================================ */
.link-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    border-radius: 1.5rem;
    padding: 1.15rem 1.25rem;
    min-height: 72px;
    width: 100%;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.link-card:active {
    transform: scale(0.98);
}
.lc-icon {
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.6rem;
    color: var(--brand-main);
}
.lc-label {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lc-title {
    display: block;
    font-family: 'Playfair Display', serif;
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.01em;
    text-transform: uppercase;
}
.lc-arrow {
    margin-left: auto;
    color: var(--brand-main);
    font-size: 0.72rem;
    opacity: 0.55;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    flex-shrink: 0;
}
.link-card:hover .lc-arrow {
    opacity: 1;
    transform: translateX(3px);
}

/* ─── Dark mode ─── */
body.dark-mode .link-card {
    background: #0d0d0d;
    border: 1px solid rgba(144, 108, 22, 0.18);
    box-shadow: 0 4px 16px -4px rgba(0, 0, 0, 0.4);
}
body.dark-mode .link-card:hover {
    transform: translateY(-3px);
    border-color: var(--brand-main);
    box-shadow: 0 10px 28px -8px rgba(144, 108, 22, 0.35);
}
body.dark-mode .lc-label { color: rgba(255, 255, 255, 0.55); }
body.dark-mode .lc-title { color: #ffffff; }

/* ─── Light mode ─── */
body.light-mode .link-card {
    background: #ffffff;
    border: 1px solid rgba(144, 108, 22, 0.14);
    box-shadow: 0 2px 12px rgba(144, 108, 22, 0.08);
}
body.light-mode .link-card:hover {
    transform: translateY(-3px);
    border-color: var(--brand-main);
    box-shadow: 0 8px 28px rgba(144, 108, 22, 0.22);
}
body.light-mode .lc-label { color: #71717a; }
body.light-mode .lc-title { color: #1a1a1a; }

/* ─── Variant Premium WhatsApp (gradiente dourado, mesma estrutura) ─── */
.link-card--whatsapp,
body.dark-mode .link-card--whatsapp,
body.light-mode .link-card--whatsapp {
    background: linear-gradient(135deg, #906c16 0%, #c9a227 100%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 8px 24px -8px rgba(144, 108, 22, 0.45);
}
.link-card--whatsapp:hover,
body.dark-mode .link-card--whatsapp:hover,
body.light-mode .link-card--whatsapp:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 255, 255, 0.25);
    box-shadow: 0 14px 32px -10px rgba(144, 108, 22, 0.6);
}
.link-card--whatsapp .lc-icon,
.link-card--whatsapp .lc-icon i { color: #ffffff !important; }
.link-card--whatsapp .lc-label { color: rgba(255, 255, 255, 0.85) !important; }
.link-card--whatsapp .lc-title { color: #ffffff !important; }
.link-card--whatsapp .lc-arrow { color: rgba(255, 255, 255, 0.85) !important; opacity: 1 !important; }
.link-card--whatsapp:hover .lc-arrow { color: #ffffff !important; }

/* ============================================================
   MODAL ESCOLHA DE ÁREA — WhatsApp Principal
   ============================================================ */
.wa-choice-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border-radius: 1.25rem;
    text-decoration: none;
    min-height: 76px;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
    border: 1px solid rgba(144, 108, 22, 0.18);
    background: linear-gradient(135deg, #ffffff 0%, #faf6ef 100%);
    box-shadow: 0 2px 12px rgba(144, 108, 22, 0.08);
}
body.dark-mode .wa-choice-card {
    background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
    border-color: rgba(144, 108, 22, 0.25);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}
.wa-choice-card:hover {
    transform: translateY(-2px);
    border-color: var(--brand-main);
    box-shadow: 0 10px 28px -8px rgba(144, 108, 22, 0.35);
}
.wa-choice-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: rgba(144, 108, 22, 0.10);
    border: 1px solid rgba(144, 108, 22, 0.25);
    color: var(--brand-main);
    font-size: 1.1rem;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.wa-choice-card:hover .wa-choice-icon {
    background: var(--brand-main);
    color: #ffffff;
    border-color: var(--brand-main);
}
.wa-choice-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.58rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--brand-main);
    margin-bottom: 4px;
}
.wa-choice-title {
    font-family: 'Playfair Display', serif;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    color: #1a1a1a;
}
body.dark-mode .wa-choice-title { color: #ffffff; }
.wa-choice-arrow {
    color: #25D366;
    font-size: 1.5rem;
    margin-left: auto;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    flex-shrink: 0;
}
.wa-choice-card:hover .wa-choice-arrow {
    transform: scale(1.15) rotate(8deg);
}

/* ============================================================
   LIGHT MODE — Specialty Cards (Administrativo + Previdenciário)
   ============================================================ */
body.light-mode .specialty-card {
    background-color: #ffffff !important;
    border: 1px solid rgba(144, 108, 22, 0.18) !important;
    box-shadow: 0 8px 24px -8px rgba(144, 108, 22, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
}
body.light-mode .specialty-card:hover {
    border-color: rgba(144, 108, 22, 0.45) !important;
    box-shadow: 0 12px 32px -10px rgba(144, 108, 22, 0.22) !important;
}
body.light-mode .specialty-card h4 {
    color: #1a1a1a !important;
}
body.light-mode .specialty-card h4 span,
body.light-mode .specialty-card h4 .text-brand-hover {
    color: #906c16 !important;
}
body.light-mode .specialty-card p.text-brand-hover {
    color: #906c16 !important;
}
body.light-mode .specialty-card .text-white\/40,
body.light-mode .specialty-card [class*="text-white/4"] {
    color: #71717a !important;
}
body.light-mode .specialty-card [class*="border-white/5"] {
    border-color: rgba(0, 0, 0, 0.08) !important;
}
/* Remove o gradiente dark-fade da imagem (era pra combinar com bg escuro) */
body.light-mode .specialty-card [class*="from-transparent"][class*="to-[#0d0d0d]"] {
    background: linear-gradient(to right, transparent, transparent, rgba(255, 255, 255, 0.4)) !important;
}

/* ============================================================
   OVERRIDES DE HOVER — Correção da borda avermelhada/vinho
   Sobrescreve a cor vinho herdada do advocacia-base.css para
   a paleta dourada institucional da Dra. Luanda Naiara.
   ============================================================ */

/* ─── Dark Mode Overrides ─── */
body.dark-mode [class*="bg-[#18181b]"]:hover,
body.dark-mode [class*="bg-zinc-900"]:hover,
body.dark-mode .modal-content:hover {
    border-color: rgba(201, 162, 39, 0.35) !important;
    box-shadow: 0 25px 50px -20px rgba(0, 0, 0, 0.6), 0 0 15px rgba(201, 162, 39, 0.15) !important;
}

/* ─── Light Mode Overrides ─── */
body.light-mode [class*="bg-[#18181b]"]:hover,
body.light-mode [class*="bg-zinc-900"]:hover,
body.light-mode .modal-content:hover {
    border-color: rgba(144, 108, 22, 0.3) !important;
    box-shadow: 0 15px 35px rgba(144, 108, 22, 0.12) !important;
}

/* Remover a borda fina amarelada e manter apenas a sombra no card OAB no Light Mode */
body.light-mode #card-credenciais-oab {
    border: none !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06) !important;
}

/* ─── Ebook Card Adaptativo (Light Mode) ─── */
body.light-mode .ebook-card {
    background: #ffffff !important; /* fundo branco luxuoso */
    border-color: rgba(144, 108, 22, 0.15) !important; /* borda dourada super fina */
    box-shadow: 0 15px 45px -10px rgba(144, 108, 22, 0.08) !important; /* sombra suave on-brand */
}

/* Reduz brilhos decorativos no fundo branco para manter clean */
body.light-mode .ebook-card .pointer-events-none {
    opacity: 0.12 !important;
}

/* Títulos, Eyebrow e Textos em cores escuras de alto contraste e sofisticação */
body.light-mode .ebook-card h3 {
    color: #1a1408 !important; /* marrom profundo on-brand */
}

body.light-mode .ebook-card span {
    color: #906c16 !important; /* dourado institucional */
}

body.light-mode .ebook-card p.text-white\/50 {
    color: #8c7e65 !important; /* marrom-cinza suave para o subtítulo */
}

body.light-mode .ebook-card p.text-white\/80 {
    color: #4a4235 !important; /* marrom escuro muito legível para o parágrafo */
}

body.light-mode .ebook-card p.text-white\/40 {
    color: #9c9280 !important; /* marrom-cinza claro para o rodapé */
}

/* Força o botão de download do E-book a ter contraste excelente e cores brancas */
body.light-mode .ebook-card a[href*="ebook.luandanaiaraadv"] {
    color: #ffffff !important;
    background: linear-gradient(to right, #906c16, #c9a227) !important;
    box-shadow: 0 10px 25px rgba(144, 108, 22, 0.25) !important;
}

body.light-mode .ebook-card a[href*="ebook.luandanaiaraadv"]:hover {
    box-shadow: 0 12px 30px rgba(144, 108, 22, 0.35) !important;
}

/* Oculta o divisor automático do CSS geral para manter a seção de fotos integrada com divisor sutil local */
#secao-destaques-mosaic::before {
    display: none !important;
}

/* ─── Welcome Ticker Premium Overrides ─── */
.welcome-ticker {
    background: transparent !important; /* totalmente transparente */
    border-top: 1px solid rgba(144, 108, 22, 0.3) !important; /* borda superior fina e dourada */
    border-bottom: none !important; /* remove a divisória inferior */
    padding: 10px 0 0px 0 !important; /* reduz o padding inferior */
    backdrop-filter: none !important;
}

body.dark-mode .welcome-ticker {
    background: transparent !important;
    border-top: 1px solid rgba(201, 162, 39, 0.22) !important;
    border-bottom: none !important;
}

.ticker-content span:not(.separator) {
    font-weight: 600 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    font-size: 0.72rem !important;
    color: #4a3508 !important; /* marrom profundo luxuoso */
}

body.dark-mode .ticker-content span:not(.separator) {
    color: #f3e8c9 !important; /* dourado champagne muito refinado */
}

/* --- WHATSAPP PREMIUM EXPERIENCE (Modelo Lumina) --- */
.wa-premium-container { position: fixed; bottom: 25px; right: 20px; z-index: 2000; }
.wa-bubble {
    width: 280px;
    position: absolute;
    bottom: 68px;
    right: 0;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(15px) saturate(140%);
    -webkit-backdrop-filter: blur(15px) saturate(140%);
    border: 1px solid rgba(144, 108, 22, .35);
    border-radius: 1.2rem;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, .6) inset,
        0 18px 40px -10px rgba(74, 53, 32, 0.15),
        0 0 0 1px rgba(255, 255, 255, .4);
    padding: 1.2rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px) scale(0.95);
    transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Cauda conectando o balão ao botão WhatsApp */
.wa-bubble::before {
    content: '';
    position: absolute;
    bottom: -10px;
    right: 16px;
    width: 20px;
    height: 20px;
    background: inherit;
    border-right: 1px solid rgba(144, 108, 22, .35);
    border-bottom: 1px solid rgba(144, 108, 22, .35);
    transform: rotate(45deg);
    border-bottom-right-radius: 4px;
    z-index: -1;
}

body.dark-mode .wa-bubble {
    background: linear-gradient(160deg, #18181b 0%, #0d0d0d 100%);
    border-color: rgba(201, 162, 39, .35);
    box-shadow:
        0 1px 0 rgba(201, 162, 39, .12) inset,
        0 20px 45px -10px rgba(0, 0, 0, .55),
        0 0 0 1px rgba(201, 162, 39, .08),
        0 0 30px -8px rgba(144, 108, 22, .15);
}

body.dark-mode .wa-bubble::before {
    background: #0d0d0d;
    border-right-color: rgba(201, 162, 39, .35);
    border-bottom-color: rgba(201, 162, 39, .35);
}

.wa-bubble.show { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.wa-header { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.wa-avatar-wrapper { position: relative; }
.wa-avatar { width: 42px; height: 42px; border-radius: 12px; object-fit: cover; border: 2px solid #25d366; box-shadow: 0 4px 12px -4px rgba(37, 211, 102, .35); }
body.dark-mode .wa-avatar { border-color: rgba(201, 162, 39, .55); box-shadow: 0 4px 12px -4px rgba(201, 162, 39, .3); }
.wa-status-dot { position: absolute; bottom: -2px; right: -2px; width: 10px; height: 10px; background: #25d366; border: 2px solid #fff; border-radius: 50%; animation: wa-pulse-green 2s infinite; }
body.dark-mode .wa-status-dot { border-color: #0d0d0d; }
.wa-name { display: block; font-weight: 700; color: #2c2c2c; font-size: 14px; letter-spacing: .01em; }
body.dark-mode .wa-name { color: #f3e8c9; }
.wa-typing { display: flex; gap: 4px; padding: 8px 0; }
.wa-typing span { width: 5px; height: 5px; background: #25d366; border-radius: 50%; animation: wa-typing-ani 1.4s infinite; opacity: 0.4; }
.wa-typing span:nth-child(2) { animation-delay: 0.2s; }
.wa-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes wa-typing-ani { 0%, 100% { transform: translateY(0); opacity: 0.4; } 50% { transform: translateY(-4px); opacity: 1; } }
@keyframes wa-pulse-green { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); } 70% { box-shadow: 0 0 0 8px rgba(37, 211, 102, 0); } 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } }
.wa-message-text p { margin: 0; font-size: 13px; color: #444; line-height: 1.5; }
body.dark-mode .wa-message-text p { color: rgba(243, 232, 201, 0.88); }
body.dark-mode .wa-message-text p strong { color: var(--brand-hover); }
.wa-float-btn { width: 54px; height: 54px; background: #25D366; color: #fff !important; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 28px; box-shadow: 0 8px 24px rgba(37, 211, 102, 0.3); text-decoration: none; transition: all 0.6s ease; opacity: 0; visibility: hidden; transform: translateY(20px) scale(0.8); }
.wa-float-btn.visible { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.wa-float-btn:hover { transform: scale(1.1) translateY(-3px); }
.wa-badge { position: absolute; top: -2px; right: -2px; background: #ff3b30; color: #fff; font-size: 10px; width: 18px; height: 18px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; border: 2px solid #fff; opacity: 0; transform: scale(0); transition: all 0.4s ease; }
.wa-badge.show { opacity: 1; transform: scale(1); }
.wa-close { position: absolute; top: 10px; right: 10px; background: none; border: none; color: #999; cursor: pointer; font-size: 14px; padding: 5px; transition: color 0.3s; }
.wa-close:hover { color: #666; }
body.dark-mode .wa-close { color: rgba(201, 162, 39, .45); }
body.dark-mode .wa-close:hover { color: var(--brand-hover); }