/* Componentes compartilhados entre a home, o blog e os artigos. */
:root {
    --megatron-blue: #2563eb;
    --megatron-blue-dark: #1d4ed8;
    --megatron-sky: #38bdf8;
    --megatron-navy: #0f172a;
    --megatron-surface-dark: #172033;
    --megatron-border-dark: #334155;
}

.shared-site-header {
    min-height: 72px;
    border-bottom: 1px solid #e2e8f0;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(18px);
}
.shared-site-header :is(.header-inner, .full-blog-header-inner) { min-height: 72px; }
.shared-site-header :is(.header-brand, .full-blog-brand) { color: #1e293b; font-weight: 800; }
.shared-site-header :is(.header-brand, .full-blog-brand) img { width: 42px; height: 42px; border-radius: 50%; box-shadow: 0 5px 16px rgba(37,99,235,.22); }
.shared-site-header :is(.header-nav, .full-blog-nav) > a { min-height: 40px; display: inline-flex; align-items: center; padding: .55rem .62rem; border-radius: .6rem; color: #475569; font-size: .89rem; font-weight: 700; }
.shared-site-header :is(.header-nav, .full-blog-nav) > a:hover,
.shared-site-header :is(.header-nav, .full-blog-nav) > a:focus-visible,
.shared-site-header :is(.header-nav, .full-blog-nav) > a[aria-current="page"] { background: #eff6ff; color: #1d4ed8; outline: none; }
.shared-site-header :is(.header-remote > button, .full-blog-remote) { min-height: 40px; display: inline-flex; align-items: center; gap: .5rem; padding: .58rem .85rem; border: 1px solid #bfdbfe; border-radius: .72rem; background: rgba(239,246,255,.9); color: #1d4ed8; font-size: .86rem; font-weight: 700; box-shadow: 0 4px 12px rgba(37,99,235,.08); }
.shared-site-header :is(.header-remote > button, .full-blog-remote):hover,
.shared-site-header :is(.header-remote > button, .full-blog-remote):focus-visible,
.shared-site-header :is(.header-remote > button, .full-blog-remote)[aria-expanded="true"] { border-color: #60a5fa; background: #dbeafe; color: #1d4ed8; outline: none; }
body.dark .shared-site-header { border-color: #334155; background: rgba(15,23,42,.94) !important; }
body.dark .shared-site-header :is(.header-brand, .full-blog-brand),
body.dark .shared-site-header :is(.header-nav, .full-blog-nav) > a { color: #e2e8f0 !important; }
body.dark .shared-site-header :is(.header-nav, .full-blog-nav) > a:hover,
body.dark .shared-site-header :is(.header-nav, .full-blog-nav) > a:focus-visible,
body.dark .shared-site-header :is(.header-nav, .full-blog-nav) > a[aria-current="page"] { background: rgba(59,130,246,.16); color: #93c5fd !important; }
body.dark .shared-site-header :is(.header-remote > button, .full-blog-remote) { border-color: rgba(96,165,250,.32); background: rgba(30,64,175,.22); color: #bfdbfe !important; }

/* Na home, o header nasce integrado ao hero e ganha superfície ao rolar. */
.shared-site-header.site-header { transition: background .32s ease, border-color .32s ease, box-shadow .32s ease, backdrop-filter .32s ease; }
.shared-site-header.site-header:not(.header-scrolled) { border-bottom-color: rgba(191,219,254,.1); background: rgba(15,23,42,.16) !important; backdrop-filter: blur(6px) saturate(108%); box-shadow: 0 5px 22px rgba(2,6,23,.06) !important; }
.shared-site-header.site-header:not(.header-scrolled)::after { opacity: 0; }
.shared-site-header.site-header:not(.header-scrolled) :is(.header-brand-text strong, .header-nav > a, .theme-toggle, .menu-toggle) { color: #f8fafc !important; text-shadow: 0 1px 10px rgba(2,6,23,.28); }
.shared-site-header.site-header:not(.header-scrolled) .header-nav > a:hover,
.shared-site-header.site-header:not(.header-scrolled) .header-nav > a:focus-visible { background: rgba(255,255,255,.12); color: #fff !important; }
.shared-site-header.site-header:not(.header-scrolled) .header-remote > button { border-color: rgba(147,197,253,.72); background: linear-gradient(135deg, rgba(37,99,235,.68), rgba(29,78,216,.54)); color: #fff !important; box-shadow: inset 0 1px rgba(255,255,255,.16), 0 8px 22px rgba(29,78,216,.24), 0 0 0 3px rgba(59,130,246,.07); backdrop-filter: blur(8px); }
.shared-site-header.site-header:not(.header-scrolled) .header-remote > button:hover,
.shared-site-header.site-header:not(.header-scrolled) .header-remote > button:focus-visible,
.shared-site-header.site-header:not(.header-scrolled) .header-remote > button[aria-expanded="true"] { border-color: #bfdbfe; background: linear-gradient(135deg, rgba(37,99,235,.9), rgba(29,78,216,.78)); box-shadow: inset 0 1px rgba(255,255,255,.2), 0 10px 26px rgba(29,78,216,.34), 0 0 0 3px rgba(96,165,250,.12); }
.shared-site-header.site-header:not(.header-scrolled) .header-actions .theme-toggle { background: rgba(15,23,42,.18); }
.shared-site-header.site-header.header-scrolled { border-bottom-color: rgba(148,163,184,.28); background: rgba(255,255,255,.84) !important; backdrop-filter: blur(18px) saturate(140%); box-shadow: 0 8px 28px rgba(15,23,42,.1) !important; }
body.dark .shared-site-header.site-header.header-scrolled { border-bottom-color: rgba(71,85,105,.6); background: rgba(15,23,42,.82) !important; box-shadow: 0 9px 30px rgba(0,0,0,.28) !important; }

.shared-whatsapp {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    z-index: 70;
    width: 54px;
    height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 50%;
    background: linear-gradient(145deg, #22c55e, #16a34a);
    color: #fff;
    font-size: 1.55rem;
    box-shadow: 0 12px 28px rgba(22,163,74,.34);
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.shared-whatsapp:hover, .shared-whatsapp:focus-visible { transform: translateY(-3px) scale(1.04); background: linear-gradient(145deg, #16a34a, #15803d); color: #fff; box-shadow: 0 16px 34px rgba(22,163,74,.42); outline: none; }
body.dark .shared-whatsapp { color: #fff !important; box-shadow: 0 12px 30px rgba(0,0,0,.34), 0 0 0 1px rgba(74,222,128,.16); }

.shared-anydesk-dialog { width: min(650px, calc(100vw - 2rem)); overflow: hidden; border: 1px solid rgba(96,165,250,.34); border-radius: 1.25rem; background: #fff; color: #172033; box-shadow: 0 30px 90px rgba(15,23,42,.38), 0 0 0 1px rgba(255,255,255,.5); }
.shared-anydesk-dialog::before { content: ''; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, #2563eb, #38bdf8); }
.shared-anydesk-dialog :is(.privacy-dialog-header, .blog-dialog-header) { padding: 1.35rem 1.45rem 1.2rem; border-bottom: 1px solid #dbeafe; background: linear-gradient(135deg, #f8fbff, #eff6ff); }
.shared-anydesk-dialog :is(.anydesk-dialog-heading, .blog-anydesk-heading) { display: flex; align-items: center; gap: .9rem; }
.shared-anydesk-dialog :is(.anydesk-dialog-icon, .blog-anydesk-icon) { width: 46px; height: 46px; display: inline-flex; flex: 0 0 46px; align-items: center; justify-content: center; border-radius: .9rem; background: linear-gradient(145deg, #2563eb, #1d4ed8); color: #fff; box-shadow: 0 9px 22px rgba(37,99,235,.25); }
.shared-anydesk-dialog :is(.privacy-dialog-content, .blog-dialog-content) { padding: 1.45rem; background: #fff; }
.shared-anydesk-dialog :is(.privacy-dialog-content, .blog-dialog-content) p { max-width: 570px; margin: 0; color: #475569; font-size: 1rem; line-height: 1.72; }
.shared-anydesk-dialog :is(.privacy-dialog-actions, .blog-dialog-actions) { display: flex; justify-content: flex-end; gap: .75rem; padding: 1.05rem 1.45rem 1.25rem; border-top: 1px solid #e2e8f0; background: #f8fafc; }
body.dark .shared-anydesk-dialog { border-color: rgba(96,165,250,.34); background: #172033; color: #f8fafc; box-shadow: 0 32px 95px rgba(0,0,0,.56); }
body.dark .shared-anydesk-dialog :is(.privacy-dialog-header, .blog-dialog-header) { border-bottom-color: #334155; background: linear-gradient(135deg, #172033, #1e293b); }
body.dark .shared-anydesk-dialog :is(.privacy-dialog-content, .blog-dialog-content) { background: #172033; }
body.dark .shared-anydesk-dialog :is(.privacy-dialog-content, .blog-dialog-content) p { color: #cbd5e1; }
body.dark .shared-anydesk-dialog :is(.privacy-dialog-actions, .blog-dialog-actions) { border-top-color: #334155; background: #111827; }

.shared-site-footer { background-color: #111827; color: #cbd5e1; }
.shared-site-footer :is(.footer-col h4, .footer-brand strong) { color: #fff; }
.shared-site-footer :is(.footer-col p, .footer-col a, .footer-col li) { color: #a8b3c4; }
.shared-site-footer .footer-col h4::after { background: #3b82f6; }

@media (min-width: 769px) {
    .shared-site-footer .footer-grid { width: min(1480px, calc(100% - 2.5rem)); margin: 0 auto; padding: 2.15rem 0 1.85rem; grid-template-columns: 1.25fr .78fr .9fr 1.12fr; gap: clamp(1.75rem, 3vw, 3rem); }
    .shared-site-footer .footer-brand { margin-bottom: .75rem; }
    .shared-site-footer .footer-brand img { width: 44px; height: 44px; }
    .shared-site-footer .footer-brand strong { font-size: 1.25rem; }
    .shared-site-footer .footer-col h4 { margin-bottom: .72rem; padding-bottom: .45rem; font-size: .96rem; }
    .shared-site-footer .footer-col h4::after { width: 32px; height: 2px; }
    .shared-site-footer .footer-col p { max-width: 410px; font-size: .86rem; line-height: 1.62; }
    .shared-site-footer .footer-col li { line-height: 1.3; }
    .shared-site-footer .footer-col li a,
    .shared-site-footer .footer-contact-item a { margin: 0 !important; padding: .28rem .55rem !important; line-height: 1.35 !important; }
    .shared-site-footer .footer-contact-item { margin-bottom: .2rem; }
    .shared-site-footer .footer-contact-item > i { margin-top: .4rem; }
    .shared-site-footer .footer-social { gap: .45rem; margin-top: .9rem; }
    .shared-site-footer .footer-social a { width: 35px; height: 35px; }
    .shared-site-footer .footer-bottom { padding: 0 1.25rem; }
    .shared-site-footer .footer-bottom-inner { min-height: 54px; padding-right: 4.5rem; }
}
@media (max-width: 720px) {
    .shared-whatsapp { right: .9rem; bottom: .9rem; width: 50px; height: 50px; font-size: 1.4rem; }
    .shared-anydesk-dialog :is(.privacy-dialog-header, .blog-dialog-header) { padding: 1.1rem; }
    .shared-anydesk-dialog :is(.anydesk-dialog-icon, .blog-anydesk-icon) { width: 40px; height: 40px; flex-basis: 40px; }
    .shared-anydesk-dialog :is(.privacy-dialog-content, .blog-dialog-content) { padding: 1.2rem 1.1rem; }
    .shared-anydesk-dialog :is(.privacy-dialog-actions, .blog-dialog-actions) { display: grid; grid-template-columns: 1fr; padding: 1rem 1.1rem; }
    .shared-anydesk-dialog :is(.privacy-dialog-actions, .blog-dialog-actions) > * { width: 100%; text-align: center; }
}