/* FertGroup brand — PREVIEW local (injetado no index.php do YOOtheme).
   Cor teal->petróleo já feita via swap no theme.9.css (equivale ao Customizer).
   Este arquivo: fontes da marca + CTAs rosa + sublinhado do menu. */

@font-face{font-family:"The Seasons";src:url("fonts/TheSeasons-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"DM Sans";src:url("fonts/DMSans-Light.ttf")   format("truetype");font-weight:300;font-display:swap}
@font-face{font-family:"DM Sans";src:url("fonts/DMSans-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"DM Sans";src:url("fonts/DMSans-Medium.ttf")  format("truetype");font-weight:500;font-display:swap}
@font-face{font-family:"DM Sans";src:url("fonts/DMSans-Bold.ttf")    format("truetype");font-weight:700;font-display:swap}

:root{--fg-petrol:#394F5A;--fg-pink:#C96B92;--fg-pink-dark:#b1577d}

/* Cor de seleção padrão da marca (substitui o amarelo do tema) */
::selection{background:#C96B92;color:#fff}
::-moz-selection{background:#C96B92;color:#fff}

/* Tipografia: corpo DM Sans, títulos The Seasons */
body,.uk-text-default,p,li,.el-content,.uk-navbar-nav>li>a{font-family:"DM Sans",system-ui,sans-serif !important}
h1,h2,h3,h4,h5,h6,.uk-h1,.uk-h2,.uk-h3,.uk-h4,
.uk-heading-small,.uk-heading-medium,.uk-heading-large,.uk-heading-xlarge,
.el-title{font-family:"The Seasons",Georgia,serif !important;font-weight:400 !important}

/* CTAs: primário rosa (pílula), secundário petróleo */
.uk-button-primary{background-color:var(--fg-pink) !important;border-color:var(--fg-pink) !important;color:#fff !important;border-radius:40px}
.uk-button-primary:hover,.uk-button-primary:focus{background-color:var(--fg-pink-dark) !important;border-color:var(--fg-pink-dark) !important}
.uk-button-secondary{background-color:var(--fg-petrol) !important;border-color:var(--fg-petrol) !important;border-radius:40px}
.uk-button-default{border-radius:40px}

/* Menu: sublinhado rosa animado (estilo V2) */
.tm-header .uk-navbar-nav>li>a{position:relative}
.tm-header .uk-navbar-nav>li>a::after{content:"";position:absolute;left:16px;right:16px;bottom:20px;transform:scaleX(0);transform-origin:left center;height:2px;background:var(--fg-pink);transition:transform .25s ease}
.tm-header .uk-navbar-nav>li:hover>a::after,.tm-header .uk-navbar-nav>li.uk-active>a::after{transform:scaleX(1)}

/* ===== Faixa utilitária do topo (estilo VIDA) ===== */
.fg-topbar{background:#F6F8F7;border-bottom:1px solid #ece6e1;font-family:"DM Sans",sans-serif;position:relative;z-index:980}
.fg-topbar-inner{max-width:1550px;margin:0 auto;padding:9px 32px;display:flex;justify-content:flex-end;align-items:center;gap:26px;font-size:14px}
.fg-topbar a{color:#394F5A;text-decoration:none;line-height:1}
.fg-topbar a:hover{color:#C96B92}
.fg-topbar .fg-topbar-painel{border:1px solid #394F5A;border-radius:40px;padding:7px 20px}
.fg-topbar .fg-topbar-painel:hover{background:#394F5A;color:#fff}

/* ===== Seção CTA do footer "Juntos por um sonho" ===== */
.fg-foot-cta{background:#F6F8F7;text-align:center;padding:72px 20px 76px}
.fg-foot-cta .fg-slogan{font-family:"The Seasons",Georgia,serif;font-weight:400;color:#394F5A;font-size:clamp(34px,5vw,54px);line-height:1.05;margin:0 0 30px}
.fg-foot-cta .fg-slogan em{font-style:normal;color:#C96B92}
.fg-foot-cta .uk-button-primary{background:#C96B92 !important;border-color:#C96B92 !important;color:#fff !important;border-radius:40px;padding:0 36px}

/* ===== Footer claro (estilo VIDA) ===== */
footer .uk-section-secondary,footer>.uk-section,footer{background-color:#F6F8F7 !important}
footer,footer a,footer p,footer li,footer span,footer .el-content,footer .uk-h2,footer h2,footer h3,footer .el-title{color:#394F5A !important}
footer a:hover{color:#C96B92 !important}
footer .uk-heading-line,footer hr,footer .uk-divider-icon{border-color:#e0d8d2 !important}

/* ===== Header sólido branco (estilo VIDA) + logo colorido ===== */
.tm-header,.tm-header-overlay{position:relative !important}
.tm-header .uk-navbar-container,.tm-header .uk-navbar-transparent{background:#ffffff !important}
.tm-header .uk-navbar-nav>li>a{color:#394F5A !important}
.tm-header .uk-logo img{content:url("labforlife-logo.svg") !important;height:48px !important;width:auto !important}
/* logo do footer (sobre fundo claro) */
footer .el-image img[src*="labforlife-logo"]{max-height:56px;width:auto}

/* ================= AJUSTES FINOS v2 — match VIDA ================= */
/* Largura de conteúdo 1550 (igual VIDA) */
.uk-container{max-width:1550px !important}

/* Faixa utilitária: nude #FBF6F3, à direita, com pílulas outline (Painel/Embryoscope) */
.fg-topbar{background:#FBF6F3 !important;border-bottom:1px solid #ece6e1}
.fg-topbar-inner{max-width:1550px;margin:0 auto;padding:0 clamp(16px,3vw,32px);min-height:42px;display:flex;justify-content:flex-end;align-items:center;gap:20px;font-size:13px}
.fg-topbar a{color:#394F5A;text-decoration:none;line-height:1}
.fg-topbar a:hover{color:#C96B92}
.fg-topbar .fg-util-btn{border:1px solid #394F5A;border-radius:40px;padding:6px 16px;line-height:24px;transition:.2s}
.fg-topbar .fg-util-btn:hover{background:#394F5A;color:#fff}

/* Menu: petróleo, SEM caixa-alta, DM Sans 15px; linha nativa do YOOtheme em ROSA (base);
   mata o meu ::after antigo (que riscava o meio do texto) */
.tm-header .uk-navbar-nav>li>a{color:#394F5A !important;text-transform:none !important;font-family:"DM Sans",system-ui,sans-serif !important;font-size:15px !important;font-weight:500 !important}
.tm-header .uk-navbar-nav>li>a::before{background-color:#C96B92 !important}
.tm-header .uk-navbar-nav>li>a::after{display:none !important}

/* Logo 57px (igual VIDA) */
.tm-header .uk-logo img{height:57px !important}

/* Esconde os botões Painel/Embryoscope do header (movidos p/ a faixa) e o selo ISO (vai p/ o footer) */
.tm-header .uk-navbar .uk-button{display:none !important}
.tm-header img[src*="selo-iso"]{display:none !important}

/* ================= v3 — pós-raspagem do VIDA ================= */
/* Faixa: cor REAL do VIDA (#F6F8F7, NÃO nude) + botões mais próximos */
.fg-topbar{background:#F6F8F7 !important}
.fg-topbar-inner{gap:16px !important;min-height:48px}

/* Logo/itens centralizados VERTICALMENTE: padding simétrico + sem min-height extra */
.tm-header .uk-navbar-container{position:relative;padding:16px 0 !important;min-height:0 !important}
.tm-header .uk-navbar-left{align-items:center !important}

/* Menu centralizado no header — overlay de largura cheia + flex-center (centro real).
   pointer-events:none deixa o clique passar pro logo/CTA; só o menu é clicável. */
.tm-header .uk-navbar{position:static !important}
.tm-header .uk-navbar-right{position:absolute !important;left:0 !important;right:0 !important;top:0 !important;bottom:0 !important;transform:none !important;pointer-events:none}
.tm-header .uk-navbar-right .uk-navbar-nav{position:absolute !important;left:50% !important;top:50% !important;transform:translate(-50%,-50%) !important;pointer-events:auto}

/* CTA "Agendar consulta" rosa, à direita do header -> /contato */
.fg-cta-header{position:absolute;top:72px;right:calc(max(0px, (100vw - 1550px) / 2) + clamp(16px,3vw,32px));z-index:999;background:#C96B92;color:#fff;border-radius:40px;padding:16px 32px;font:500 15px/1 "DM Sans",sans-serif;text-decoration:none}
.fg-cta-header:hover{background:#b1577d;color:#fff}

/* ================= v4 — detalhes finos (match VIDA) ================= */
/* 1) Faixa do topo SEM borda inferior */
.fg-topbar{border-bottom:0 !important}

/* 2) Chevron (v) nos itens de menu com submenu (li.uk-parent) */
.tm-header .uk-navbar-nav>li.uk-parent>a{padding-right:20px !important;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23394F5A' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;background-repeat:no-repeat !important;background-position:right center !important;background-size:10px 6px !important}

/* 3) Sublinhado ROSA com efeito SLIDE (width 0->100%, da esquerda) = igual VIDA.
   Desliga a linha nativa do YOOtheme (cresce em altura) e usa ::after (cresce em largura). */
.tm-header .uk-navbar-nav>li>a::before{display:none !important}
.tm-header .uk-navbar-nav>li>a{position:relative !important}
.tm-header .uk-navbar-nav>li>a::after{content:"" !important;display:block !important;position:absolute !important;left:0 !important;right:auto !important;bottom:8px !important;width:0 !important;height:2px !important;background:#C96B92 !important;transform:none !important;transition:width .3s ease !important}
.tm-header .uk-navbar-nav>li:hover>a::after,
.tm-header .uk-navbar-nav>li.uk-active>a::after{width:100% !important}

/* ================= v5 — detalhes VIDA (raspagem) ================= */
/* Faixa branca do header mais baixa (~77px igual VIDA): logo 50 + padding 13 */
.tm-header .uk-navbar-container{padding:13px 0 !important}
.tm-header .uk-logo img{height:50px !important}

/* Topbar: fonte igual VIDA (DM Sans 400, 12.5px) — mais fina */
.fg-topbar-inner{font-size:12.5px !important}
.fg-topbar a{font-weight:400 !important}

/* Pílulas Painel/Embryoscope ~3px mais juntas */
.fg-topbar .fg-util-btn + .fg-util-btn{margin-left:-3px}

/* Chevron PREENCHIDO (triângulo) nos itens com submenu — igual VIDA */
.tm-header .uk-navbar-nav>li.uk-parent>a{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='9' height='6' viewBox='0 0 9 6'><path d='M0 0 H9 L4.5 6 Z' fill='%23394F5A'/></svg>") !important;background-size:9px 6px !important;padding-right:18px !important}

/* CTA reposicionado p/ o header mais baixo */
.fg-cta-header{top:62px !important}

/* ================= v6 — submenu (dropdown) match VIDA ================= */
/* 1) Itens do submenu: inicial maiúscula apenas (mata o UPPERCASE do tema) + DM Sans 14/400 */
.tm-header .uk-navbar-dropdown-nav>li>a,
.tm-header .uk-navbar-dropdown li a,
.tm-header .uk-nav-default>li>a{text-transform:none !important;font-family:"DM Sans",system-ui,sans-serif !important;font-weight:400 !important;font-size:14px !important;letter-spacing:0 !important}

/* 2) Cantos arredondados do VIDA: 5px 20px 5px 20px (TL/BR menores, TR/BL maiores).
   overflow:hidden faz o realce de hover dos itens respeitar os cantos. */
.tm-header .uk-navbar-dropdown{border-radius:5px 20px 5px 20px !important;overflow:hidden}

/* 3) Padding reduzido (igual VIDA): container enxuto + itens ~13px 22px */
.tm-header .uk-navbar-dropdown{padding:14px 0 !important;min-width:210px}
.tm-header .uk-navbar-dropdown-nav>li>a{padding:13px 22px !important;line-height:1.2 !important}

/* 4) Menu principal: um pouco mais de respiro entre os itens */
.tm-header .uk-navbar-nav>li{margin-left:6px !important;margin-right:6px !important}

/* ================= v7 — hover rosa no submenu + remove Início ================= */
/* Realce rosa (pílula c/ cantos do VIDA) no hover/ativo do item de submenu */
.tm-header .uk-navbar-dropdown-nav>li>a:hover,
.tm-header .uk-navbar-dropdown-nav>li>a:focus,
.tm-header .uk-navbar-dropdown-nav>li.uk-active>a{background:#C96B92 !important;color:#fff !important;border-radius:5px 20px 5px 20px !important}

/* Remove o item "Início" do menu (Joomla menu item id 101) */
.tm-header .uk-navbar-nav>li.item-101{display:none !important}

/* ================= v8 — footer reconstruído (estrutura VIDA) ================= */
.fg-footer{background:#F6F8F7;font-family:"DM Sans",system-ui,sans-serif;color:#394F5A}
.fg-footer-inner{max-width:1550px;margin:0 auto;padding:64px clamp(16px,3vw,32px) 0}

/* Grid: logo+ISO | Institucional | Conteúdo | Atendimento */
.fg-footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.5fr;gap:40px;padding-bottom:56px}

/* Marca: logo + selo ISO abaixo (pedido do cliente) */
.fg-foot-brand{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.fg-foot-logo{height:64px;width:auto}
.fg-foot-iso{height:92px;width:auto;opacity:.95}

/* Labels das colunas: DM Sans 13px/500 caixa-alta petróleo (igual VIDA) */
.fg-foot-col h3{font-size:13px !important;font-weight:500 !important;letter-spacing:.04em;color:#394F5A !important;margin:0 0 22px;text-transform:uppercase;font-family:"DM Sans",system-ui,sans-serif !important}
.fg-foot-col ul{list-style:none;margin:0;padding:0}
.fg-foot-col li{margin:0 0 14px}
.fg-foot-col a{color:#56666f;text-decoration:none;font-size:14.5px;line-height:1.4;transition:color .2s}
.fg-foot-col a:hover{color:#C96B92}

/* Coluna Atendimento: redes + contato */
.fg-foot-social{display:flex;gap:10px;margin:0 0 24px}
.fg-foot-social a{width:38px;height:38px;border-radius:50%;background:#394F5A;color:#fff;display:flex;align-items:center;justify-content:center;transition:background .2s}
.fg-foot-social a:hover{background:#C96B92}
.fg-foot-social svg{width:18px;height:18px}
.fg-foot-contact .fg-foot-hours{color:#56666f;font-size:14px;margin-top:6px}

/* Barra inferior: faixa full-width, conteúdo centrado em 1550 */
.fg-footer-bottom{border-top:1px solid #ece6e1}
.fg-footer-bottom-inner{max-width:1550px;margin:0 auto;padding:22px clamp(16px,3vw,32px) 30px;display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap}
.fg-footer-bottom span{color:#6b7780;font-size:12.5px;line-height:1.6;font-family:"DM Sans",system-ui,sans-serif !important;font-weight:400 !important}
.fg-footer-bottom span:nth-child(2){text-align:center}
.fg-footer-bottom span:last-child{text-align:right}

/* Responsivo */
@media (max-width:960px){
  .fg-footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .fg-foot-brand{grid-column:1 / -1}
}
@media (max-width:600px){
  .fg-footer-grid{grid-template-columns:1fr;text-align:center;justify-items:center}
  .fg-foot-brand{align-items:center}
  .fg-foot-social{justify-content:center}
  .fg-foot-contact a{justify-content:center}
  .fg-footer-bottom-inner{flex-direction:column;align-items:center;text-align:center}
  .fg-footer-bottom span{text-align:center !important}
}

/* ================= v9 — footer detalhes finos (raspagem VIDA no ar) ================= */
/* Botões 52px de altura (footer "Agende" + CTA do header) — igual VIDA */
.fg-foot-cta .uk-button-primary,
.fg-cta-header{height:52px !important;line-height:1 !important;padding:0 34px !important;font-size:15px !important;font-weight:500 !important;display:inline-flex !important;align-items:center !important;justify-content:center !important}

/* Dividers 1px #ece6e1 FULL-WIDTH (100vw): topo da seção "Juntos",
   entre "Juntos" e o miolo, e antes da barra legal */
.fg-foot-cta{border-top:1px solid #ece6e1}
.fg-footer{border-top:1px solid #ece6e1}
.fg-footer-bottom{border-top:1px solid #ece6e1 !important}

/* Links do footer: PETRÓLEO, DM Sans 14.5/400; hover ROSA */
.fg-foot-col a{color:#394F5A !important;font-size:14.5px !important;font-weight:400 !important;font-family:"DM Sans",system-ui,sans-serif !important}
.fg-foot-col li{margin:0 0 12px !important}
.fg-foot-col a:hover{color:#C96B92 !important}

/* Redes sociais: círculo CONTORNADO (transparente + borda), glifo petróleo; hover rosa */
.fg-foot-social a{width:36px !important;height:36px !important;background:transparent !important;border:1px solid #ece6e1 !important;color:#394F5A !important}
.fg-foot-social a:hover{background:#C96B92 !important;border-color:#C96B92 !important;color:#fff !important}
.fg-foot-social a i{font-size:18px;line-height:1}

/* Contato: endereço cidade-UF + ícone de telefone rosa */
.fg-foot-contact{list-style:none;margin:18px 0 0;padding:0}
.fg-foot-contact li{margin:0 0 11px}
.fg-foot-contact a{color:#56666f;text-decoration:none;font-size:14.5px;display:inline-flex;align-items:center;gap:8px}
.fg-foot-contact a:hover{color:#C96B92}
.fg-foot-addr a{display:block !important}
.fg-foot-addr strong{color:#394F5A;font-weight:600}
.fg-tel-icon{color:#C96B92 !important;font-size:13px;flex:0 0 auto}
.fg-foot-hours{color:#56666f;font-size:14px;margin-top:4px}

/* ================= v13 — redes (zoom hover), acessibilidade, CTA sticky ================= */
/* Efeito de zoom no hover das redes (igual VIDA: transform .3s) */
.fg-foot-social a{transition:background .2s,border-color .2s,transform .3s}
.fg-foot-social a:hover{transform:scale(1.12)}

/* Oculta o widget de acessibilidade */
._access-icon,._access-menu,._access-icon._access{display:none !important}

/* CTA "Agendar consulta" agora vive DENTRO do .uk-sticky: ancora nele (relative)
   e centraliza verticalmente na barra — acompanha o header fixo ao rolar. */
.tm-header .uk-sticky{position:relative}
.fg-cta-header{top:50% !important;transform:translateY(-50%)}

/* ================= v14 — espaço label↔linha do menu (~3px) ================= */
.tm-header .uk-navbar-nav>li>a::after{bottom:5px !important}

/* ================= v15 — cores do conteúdo, cards e tour ================= */
/* Cor BASE do texto em PETRÓLEO (html/body + títulos + conteúdo) */
body,
:is(h1,h2,h3,h4,h5,h6,.uk-h1,.uk-h2,.uk-h3,.uk-h4,.uk-h5,.uk-h6,.el-title,.el-content){color:#394F5A !important}

/* Contextos ESCUROS do UIkit (hero .uk-light, cards de depoimento .uk-card-primary,
   seções/tiles/overlays primárias): texto BRANCO */
:is(.uk-light,.uk-card-primary,.uk-section-primary,.uk-tile-primary,.uk-overlay-primary),
:is(.uk-light,.uk-card-primary,.uk-section-primary,.uk-tile-primary,.uk-overlay-primary) *{color:#fff !important}

/* Títulos dos cards de Procedimentos em DM Sans 500 (não The Seasons) */
.uk-card-body .el-title{font-family:"DM Sans",system-ui,sans-serif !important;font-weight:500 !important}

/* Botões mantêm texto branco (re-afirma após a regra de .el-content acima) */
.uk-button-primary,.uk-button-secondary{color:#fff !important}

/* Ícones de valor (PNG preto) tingidos com o rosa EXATO da marca via filtro SVG */
img[src*="acolhimento"],
img[src*="trevo"],
img[src*="seguranca"],
img[src*="transparencia"]{filter:url(#fg-rosa)}

/* ================= v16 — botões, acordeão e links (páginas internas) ================= */
/* Botões "default" (pílula branca): texto petróleo (estavam brancos/invisíveis) */
.uk-button-default{color:#394F5A !important}
/* ...o botão "Currículo Lattes" da equipe (.el-link, sobre foto/overlay) → rosa + branco */
.el-link.uk-button-default,.uk-card-primary .uk-button-default{background:#C96B92 !important;border-color:#C96B92 !important;color:#fff !important}
.el-link.uk-button-default:hover,.uk-card-primary .uk-button-default:hover{background:#b1577d !important;border-color:#b1577d !important}

/* Acordeão (Dúvidas): ícone +/− em rosa da marca (tinge o SVG do ::before via filtro) */
.uk-accordion-title::before{filter:url(#fg-rosa) !important}

/* Links de conteúdo (verdes/teal do tema) → petróleo, hover rosa.
   Escopo amplo (títulos, painéis, listas), re-afirmando branco em contexto escuro. */
:is(.el-content,.uk-accordion-content,.tm-main,article,.el-item,.uk-panel,.el-title,.uk-list,.uk-text-lead) a:not(.uk-button):not(.el-link){color:#394F5A !important}
:is(.el-content,.uk-accordion-content,.tm-main,article,.el-item,.uk-panel,.el-title,.uk-list,.uk-text-lead) a:not(.uk-button):not(.el-link):hover{color:#C96B92 !important}
:is(.uk-light,.uk-card-primary) a:not(.uk-button):not(.el-link){color:#fff !important}

/* Botão "Enviar" dos formulários (Convert Forms): pílula PETRÓLEO, texto branco */
.cf-btn,button.cf-btn,input.cf-btn{background:#394F5A !important;border-color:#394F5A !important;color:#fff !important;border-radius:40px !important}
.cf-btn:hover{background:#2c3d46 !important;border-color:#2c3d46 !important}

/* ================= v17 — títulos do acordeão em DM Sans 500 ================= */
.uk-accordion-title{font-family:"DM Sans",system-ui,sans-serif !important;font-weight:500 !important}

/* ================= v18 — header mobile (padrão VIDA) ================= */
@media (max-width:959px){
  /* esconde a faixa de pills do topo no mobile */
  .fg-topbar{display:none !important}

  /* hambúrguer: caixa com borda rosa + linhas rosa */
  .tm-header-mobile .uk-navbar-toggle{border:1px solid #C96B92;border-radius:8px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;padding:0}
  .tm-header-mobile .uk-navbar-toggle .uk-navbar-toggle-icon{color:#C96B92 !important}
  .tm-header-mobile .uk-navbar-toggle svg *{stroke:#C96B92 !important}

  /* painel off-canvas: petróleo, canto arredondado (estilo VIDA) */
  #tm-dialog-mobile .uk-offcanvas-bar{background:#394F5A !important;border-radius:0 0 0 18px;padding-top:24px}

  /* botão fechar (X): rosa em caixa */
  #tm-dialog-mobile .uk-offcanvas-close{color:#C96B92 !important;border:1px solid #C96B92;border-radius:8px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;top:18px;right:18px;padding:0}
  #tm-dialog-mobile .uk-offcanvas-close svg *{stroke:#C96B92 !important}

  /* itens do menu: brancos, DM Sans 500, maiores */
  #tm-dialog-mobile .uk-nav>li>a{color:#fff !important;font-family:"DM Sans",system-ui,sans-serif !important;font-weight:500 !important;font-size:19px !important;padding:11px 14px !important;border-radius:8px}
  /* item ativo / hover: barra rosa */
  #tm-dialog-mobile .uk-nav>li.uk-active>a,
  #tm-dialog-mobile .uk-nav>li.uk-open>a,
  #tm-dialog-mobile .uk-nav>li>a:hover{background:#C96B92 !important;color:#fff !important}
  /* submenu: itens recuados, branco translúcido, menores */
  #tm-dialog-mobile .uk-nav .uk-nav-sub a{color:rgba(255,255,255,.82) !important;font-family:"DM Sans",system-ui,sans-serif !important;font-weight:400 !important;font-size:16px !important;padding:8px 14px !important}
  #tm-dialog-mobile .uk-nav .uk-nav-sub a:hover{color:#fff !important}
  /* chevrons / ícones de submenu em rosa */
  #tm-dialog-mobile .uk-nav .uk-icon svg *,
  #tm-dialog-mobile .uk-nav [class*="parent-icon"] svg *{stroke:#C96B92 !important}

  /* esconde "Início" no mobile também */
  #tm-dialog-mobile .uk-nav>li.item-101{display:none !important}

  /* botões Painel/Embryoscope: pílula contornada branca */
  #tm-dialog-mobile .uk-button{border-radius:40px !important;border:1px solid #fff !important;background:transparent !important;color:#fff !important;margin-top:10px}
  #tm-dialog-mobile .uk-button:hover{background:rgba(255,255,255,.12) !important}

  /* "Agendar consulta" (injetado): pílula rosa cheia */
  #tm-dialog-mobile .fg-mobile-cta{display:block;text-align:center;background:#C96B92 !important;color:#fff !important;border:0 !important;border-radius:40px !important;padding:14px 24px;margin:20px 0 6px;font:500 16px/1 "DM Sans",sans-serif;text-decoration:none}
  #tm-dialog-mobile .fg-mobile-cta:hover{background:#b1577d !important}
}

/* v18b — painel mais largo + logo mobile da marca */
@media (max-width:959px){
  #tm-dialog-mobile .uk-offcanvas-bar{width:86vw !important;max-width:400px !important}
  .tm-header-mobile .uk-logo img{content:url("labforlife-logo.svg") !important;height:42px !important;width:auto !important}
}

/* ================= v19 — header mobile: posição, slide-down, acordeão ================= */
@media (max-width:959px){
  /* Logo à ESQUERDA, hambúrguer à DIREITA, centralizados verticalmente + padding simétrico */
  .tm-header-mobile .uk-navbar-container{padding-top:14px !important;padding-bottom:14px !important;min-height:0 !important}
  .tm-header-mobile .uk-navbar{display:flex !important;align-items:center !important;justify-content:space-between !important;min-height:0 !important}
  .tm-header-mobile .uk-navbar-center{position:static !important;transform:none !important;left:auto !important;width:auto !important;margin:0 !important;order:1}
  .tm-header-mobile .uk-navbar-left{order:2;min-height:0 !important}

  /* Painel abre ABAIXO do header, deslizando para baixo (full-width) */
  #tm-dialog-mobile .uk-offcanvas-bar{position:fixed !important;top:72px !important;left:0 !important;right:0 !important;bottom:auto !important;width:100% !important;max-width:none !important;height:auto !important;max-height:calc(100vh - 72px);overflow-y:auto;transform:translateY(-110%);border-radius:0 0 18px 18px;padding-top:18px}
  #tm-dialog-mobile.uk-open .uk-offcanvas-bar{transform:translateY(0) !important}
  /* X (fechar) como 1ª linha do painel, alinhado à direita — não sobrepõe o menu */
  #tm-dialog-mobile .uk-offcanvas-close{position:static !important;align-self:flex-end;margin:0 16px 4px 0 !important}

  /* Submenus COLAPSÁVEIS + chevron preenchido rosa */
  #tm-dialog-mobile .uk-nav .uk-nav-sub{display:none !important}
  #tm-dialog-mobile .uk-nav>li.fg-open>.uk-nav-sub{display:block !important}
  #tm-dialog-mobile .uk-nav>li.uk-parent>a{position:relative;padding-right:36px !important}
  #tm-dialog-mobile .uk-nav>li.uk-parent>a::after{content:"";position:absolute;right:16px;top:50%;margin-top:-3px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #C96B92;transition:transform .2s}
  #tm-dialog-mobile .uk-nav>li.fg-open>a::after{transform:rotate(180deg)}
}

/* ================= v20 — header mobile: X no hambúrguer, slide fluido, sombra, chevron, ativo ================= */
@media (max-width:959px){
  /* X interno escondido — o próprio hambúrguer vira X */
  #tm-dialog-mobile .uk-offcanvas-close{display:none !important}

  /* header acima do backdrop: hambúrguer continua nítido e clicável (fecha) */
  .tm-header-mobile{position:relative;z-index:1011 !important}

  /* hambúrguer desenhado em CSS (3 barras rosa) que vira X com efeito */
  .tm-header-mobile .uk-navbar-toggle-icon svg{display:none !important}
  .tm-header-mobile .uk-navbar-toggle-icon{position:relative;width:24px;height:2px;background:#C96B92;border-radius:2px;transition:background .2s}
  .tm-header-mobile .uk-navbar-toggle-icon::before,
  .tm-header-mobile .uk-navbar-toggle-icon::after{content:"";position:absolute;left:0;width:24px;height:2px;background:#C96B92;border-radius:2px;transition:transform .25s ease,top .25s ease}
  .tm-header-mobile .uk-navbar-toggle-icon::before{top:-7px}
  .tm-header-mobile .uk-navbar-toggle-icon::after{top:7px}
  .tm-header-mobile .uk-navbar-toggle.fg-open .uk-navbar-toggle-icon{background:transparent}
  .tm-header-mobile .uk-navbar-toggle.fg-open .uk-navbar-toggle-icon::before{top:0;transform:rotate(45deg)}
  .tm-header-mobile .uk-navbar-toggle.fg-open .uk-navbar-toggle-icon::after{top:0;transform:rotate(-45deg)}

  /* slide-down FLUIDO: o painel expande a partir do fim da faixa branca (max-height) */
  #tm-dialog-mobile .uk-offcanvas-bar{transform:none !important;max-height:0 !important;overflow:hidden !important;box-shadow:none !important;transition:max-height .4s cubic-bezier(.4,0,.2,1) !important}
  #tm-dialog-mobile.uk-open .uk-offcanvas-bar{max-height:calc(100vh - 72px) !important;overflow-y:auto !important}

  /* sem sombra na faixa branca do header com o menu aberto */
  .tm-header-mobile,.tm-header-mobile .uk-navbar-container{box-shadow:none !important}

  /* chevrons BRANCOS */
  #tm-dialog-mobile .uk-nav>li.uk-parent>a::after{border-top-color:#fff !important}

  /* item selecionado/ativo/aberto/hover: cantos estilo VIDA (TR e BL maiores) */
  #tm-dialog-mobile .uk-nav>li.uk-active>a,
  #tm-dialog-mobile .uk-nav>li.fg-open>a,
  #tm-dialog-mobile .uk-nav>li>a:hover,
  #tm-dialog-mobile .uk-nav .uk-nav-sub>li.uk-active>a,
  #tm-dialog-mobile .uk-nav .uk-nav-sub>li>a:hover{background:#C96B92 !important;color:#fff !important;border-radius:5px 20px 5px 20px !important}
}

/* ================= v21 — header mobile: ajustes finos 2 ================= */
@media (max-width:959px){
  /* 1) Logo 15px da esquerda + hambúrguer 15px da direita */
  .tm-header-mobile .uk-navbar-container>.uk-container{padding-left:15px !important;padding-right:15px !important}
  .tm-header-mobile .uk-navbar{padding:0 !important}

  /* 5) faixa do header SEMPRE branca (mesmo com o menu aberto) — tb mascara o topo do painel */
  .tm-header-mobile .uk-navbar-container{background:#fff !important}

  /* 2) slide-down SUAVE via transform (sem engasgo do max-height) */
  #tm-dialog-mobile .uk-offcanvas-bar{transform:translateY(-100%) !important;max-height:calc(100vh - 72px) !important;overflow-y:auto !important;box-shadow:none !important;transition:transform .35s cubic-bezier(.4,0,.2,1) !important;
    /* 7) painel: TL e BR com arredondamento maior (oposto do item) */
    border-radius:20px 5px 20px 5px !important}
  #tm-dialog-mobile.uk-open .uk-offcanvas-bar{transform:translateY(0) !important}

  /* 3) itens e sub-itens: MESMO tamanho (16px), DM Sans 400, BRANCO */
  #tm-dialog-mobile .uk-nav>li>a{font-size:16px !important;font-weight:400 !important}
  #tm-dialog-mobile .uk-nav .uk-nav-sub>li>a{color:#fff !important;font-size:16px !important;font-weight:400 !important}

  /* 4) chevron logo APÓS o texto (inline), não no fim do item */
  #tm-dialog-mobile .uk-nav>li.uk-parent>a{padding-right:14px !important}
  #tm-dialog-mobile .uk-nav>li.uk-parent>a::after{position:static !important;display:inline-block;margin:0 0 2px 8px !important;vertical-align:middle;right:auto !important;top:auto !important}

  /* 6) Embryoscope mais perto do Painel (remove a margem extra do wrapper) */
  #tm-dialog-mobile .uk-offcanvas-bar .el-item.uk-grid-margin{margin-top:0 !important}
}

/* ================= v22 — cantos do painel invertidos + margens dos botões ================= */
@media (max-width:959px){
  /* painel: cantos INVERTIDOS (TR e BL maiores — igual ao item) */
  #tm-dialog-mobile .uk-offcanvas-bar{border-radius:5px 20px 5px 20px !important}
  /* Agendar consulta sem margem; Painel/Embryoscope com margin-top 20px */
  #tm-dialog-mobile .fg-mobile-cta{margin:0 !important}
  #tm-dialog-mobile .uk-button{margin-top:20px !important}
}

/* ================= v23 — mobile: logo/hambúrguer a 40px das laterais ================= */
@media (max-width:959px){
  .tm-header-mobile .uk-navbar-container>.uk-container{padding-left:40px !important;padding-right:40px !important}
}

/* ================= v24 — overlay de imagem (verde fixo por seção) -> petróleo ================= */
/* As seções têm um overlay com cor inline rgba(27,63,59,.6) (verde). Recolorimos pro petróleo. */
.uk-position-cover[style*="27, 63, 59"],
.uk-position-cover[style*="27,63,59"],
.uk-overlay-primary[style*="27, 63, 59"]{background-color:rgba(57,79,90,.6) !important}
/* segundo tom de overlay (teal #45736E @ .82) -> petróleo */
.uk-position-cover[style*="69, 115, 110"],
.uk-position-cover[style*="69,115,110"]{background-color:rgba(57,79,90,.82) !important}

/* ================= v25 — header mobile STICKY (a barra branca acompanha) ================= */
@media (max-width:959px){
  .tm-header-mobile{position:sticky !important;top:0 !important;z-index:1011 !important;background:#fff}
}

/* ================= v26 — submenu DESKTOP: fundo petróleo (tema usa #61a1a1 teal) ================= */
.uk-navbar-dropdown{background-color:#394F5A !important}

/* ================= v27 — sweep do teal do tema (theme.9.css) -> marca =================
   Mapeado de todos os usos de #61a1a1 (teal)->#394F5A e #55bbaf (turquesa)->#C96B92.
   Cobre riscos/barras de titulo (uk-heading-bullet/divider), dropdown, botoes, etc. */
.uk-heading-divider{border-bottom:calc(.2px + .05em) solid #C96B92 !important}
.uk-heading-bullet::before{border-left:calc(4px + .08em) solid #C96B92 !important}
.uk-divider-small::after{border-top:2px solid #C96B92 !important}
.uk-divider-vertical{border-left:2px solid #C96B92 !important}
.btn-light:hover,.uk-button-default:hover{background-color:#C96B92 !important}
.btn-light.uk-active,.btn-light:active,.uk-button-default.uk-active,.uk-button-default:active{background-color:#C96B92 !important}
.btn-info,.btn-primary,.btn-success,.uk-button-primary{background-color:#C96B92 !important}
.uk-navbar-nav>li>a::before{background-color:#394F5A !important}
.uk-navbar-toggle:hover,.uk-navbar-toggle[aria-expanded=true]{color:#394F5A !important}
.uk-navbar-dropdown{background:#394F5A !important}
.tm-toolbar-default .uk-button-primary,.uk-card-primary.uk-card-body .uk-button-primary,.uk-card-primary>:not([class*=uk-card-media]) .uk-button-primary,.uk-card-secondary.uk-card-body .uk-button-primary,.uk-card-secondary>:not([class*=uk-card-media]) .uk-button-primary,.uk-light .btn-info,.uk-light .btn-primary,.uk-light .btn-success,.uk-light .uk-button-primary,.uk-navbar-dropdown .uk-button-primary,.uk-notification-message-danger .btn-info,.uk-notification-message-danger .btn-primary,.uk-notification-message-danger .btn-success,.uk-notification-message-danger .uk-button-primary,.uk-notification-message-primary .btn-info,.uk-notification-message-primary .btn-primary,.uk-notification-message-primary .btn-success,.uk-notification-message-primary .uk-button-primary,.uk-notification-message-success .btn-info,.uk-notification-message-success .btn-primary,.uk-notification-message-success .btn-success,.uk-notification-message-success .uk-button-primary,.uk-notification-message-warning .btn-info,.uk-notification-message-warning .btn-primary,.uk-notification-message-warning .btn-success,.uk-notification-message-warning .uk-button-primary,.uk-overlay-primary .uk-button-primary,.uk-section-primary:not(.uk-preserve-color) .uk-button-primary,.uk-section-secondary:not(.uk-preserve-color) .uk-button-primary,.uk-tile-primary:not(.uk-preserve-color) .uk-button-primary,.uk-tile-secondary:not(.uk-preserve-color) .uk-button-primary{background-color:#C96B92 !important}
.tm-toolbar-default .uk-navbar-nav>li>a::before,.uk-card-primary.uk-card-body .uk-navbar-nav>li>a::before,.uk-card-primary>:not([class*=uk-card-media]) .uk-navbar-nav>li>a::before,.uk-card-secondary.uk-card-body .uk-navbar-nav>li>a::before,.uk-card-secondary>:not([class*=uk-card-media]) .uk-navbar-nav>li>a::before,.uk-light .uk-navbar-nav>li>a::before,.uk-navbar-dropdown .uk-navbar-nav>li>a::before,.uk-overlay-primary .uk-navbar-nav>li>a::before,.uk-section-primary:not(.uk-preserve-color) .uk-navbar-nav>li>a::before,.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav>li>a::before,.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-nav>li>a::before,.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-nav>li>a::before{background-color:#394F5A !important}
