/* ==========================================================================
   Portal MAXSENIOR CONSULTORIA — folha de estilo unica.
   Paleta derivada do logotipo: azul-aco (#7C3AED), cinza (#6e7173) e
   laranja (#EC4899). Layout inspirado em portais de tecnologia (topo,
   hero com card, grade de solucoes, faixa de CTA, rodape).
   ========================================================================== */

:root {
    --navy:        #1A1636;   /* fundo escuro (hero/rodapé) — GRS */
    --navy-2:      #0B0A19;
    --blue:        #7C3AED;   /* violeta GRS (primária) */
    --blue-600:    #6D28D9;
    --orange:      #EC4899;   /* pink GRS (destaque secundário) */
    --orange-600:  #DB2777;
    --gray:        #7A7898;   /* neutro GRS */
    --ink:         #151233;
    --muted:       #6C6A86;
    --line:        #E9E6F7;
    --bg:          #FAF9FF;
    --white:       #ffffff;
    /* Degradês GRS (violeta -> pink -> âmbar) */
    --grad:        linear-gradient(92deg, #7C3AED 0%, #EC4899 52%, #F59E0B 100%);
    --grad-rev:    linear-gradient(92deg, #F59E0B 0%, #EC4899 48%, #7C3AED 100%);
    --grad-line:   linear-gradient(90deg, #7C3AED 0%, #2563EB 35%, #EC4899 68%, #F59E0B 100%);
    /* Degradê GRS em tom PASTEL (seções e botões claros) */
    --grad-pastel: linear-gradient(135deg, #F3ECFF 0%, #FAF9FF 46%, #FEF3E2 100%);
    --grad-btn:    linear-gradient(92deg, #E9DDFF 0%, #FBE3F1 55%, #FCEBD2 100%);
    /* Tons fortes GRS (multi-cor) */
    --h-violet: #7C3AED; --h-blue: #2563EB; --h-cyan: #0E96B4;
    --h-green:  #0E9F6E; --h-amber: #D97706; --h-pink: #DB2777;
    --radius:      14px;
    --shadow-sm:   0 2px 8px rgba(90,60,180,.08);
    --shadow-md:   0 10px 30px rgba(90,60,180,.14);
    --shadow-lg:   0 24px 60px rgba(90,60,180,.22);
    --maxw:        1160px;
}

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
    font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: var(--ink);
    background:
        radial-gradient(900px 520px at 88% -4%, rgba(236,72,153,.12), transparent 60%),
        radial-gradient(1000px 640px at -6% 3%, rgba(124,58,237,.12), transparent 60%),
        radial-gradient(760px 540px at 55% 108%, rgba(245,158,11,.10), transparent 62%),
        radial-gradient(680px 480px at 108% 58%, rgba(37,99,235,.08), transparent 60%),
        var(--bg);
    background-attachment: fixed;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }

.container {
    width: 100%;
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 0 22px;
}

/* ------------------------------- Topo -------------------------------- */
/* Barra utilitária (padrão Locaweb): faixa fina de contato acima da nav */
.topbar-util { background: #FAF9FF; border-bottom: 1px solid var(--line); font-size: 12.5px; color: var(--muted); }
.topbar-util .util-inner { display: flex; align-items: center; justify-content: space-between; height: 38px; gap: 16px; }
.topbar-util .util-left { font-weight: 600; }
.topbar-util .util-right { display: flex; align-items: center; gap: 18px; }
.topbar-util .util-right a { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-weight: 600; }
.topbar-util .util-right a:hover { color: var(--blue); text-decoration: none; }
.topbar-util .util-right a svg { width: 14px; height: 14px; fill: currentColor; }
@media (max-width: 700px) { .topbar-util .util-left { display: none; } .topbar-util .util-inner { justify-content: center; } }

.topbar {
    position: fixed; top: 0.5cm; left: 0; right: 0; z-index: 50;
    background: transparent; padding: 0 16px;
}
/* Menu flutuante (estilo Locaweb) a 0,5cm do topo. As âncoras ganham folga para
   não ficarem escondidas atrás do menu ao rolar. */
section { scroll-margin-top: 104px; }
.topbar .inner {
    display: flex; align-items: center; justify-content: space-between;
    height: 64px;
    background: rgba(255,255,255,.97);
    backdrop-filter: saturate(180%) blur(10px);
    border: 1px solid rgba(90,60,180,.07);
    border-radius: 14px;
    box-shadow: 0 14px 34px rgba(90,60,180,.16);
}
/* Logo em imagem (arquivo), quando presente */
.brand-logo { height: 50px; width: auto; display: block; }

/* -------------------------- Logotipo (marca) ------------------------- */
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { display: inline-flex; align-items: center; }
.brand-mark .mx-mark { width: 48px; height: auto; display: block; }
.brand .name { display: flex; flex-direction: column; justify-content: center; line-height: 1; }
.brand .name .word { font-size: 22px; font-weight: 800; letter-spacing: .5px; }
.brand .name .c1 { color: #7C3AED; }
.brand .name .c2 { color: #2563EB; }
.brand .name .c3 { color: #EC4899; }
.brand .brand-sub { font-size: 9.5px; font-weight: 700; letter-spacing: .6px; color: var(--muted); margin-top: 3px; }
/* versao reverse (fundos escuros) */
.brand.rev .name .c1, .brand.rev .name .c2, .brand.rev .name .c3 { color: #fff; }
.brand.rev .brand-sub { color: rgba(255,255,255,.72); }

.nav { display: flex; align-items: center; gap: 26px; }
.nav a { position: relative; color: var(--navy); font-weight: 600; font-size: 15px; padding: 4px 0; }
.nav a::after { content: ""; position: absolute; left: 0; bottom: -3px; height: 2px; width: 0; background: var(--grad-line); transition: width .2s ease; }
.nav a:hover { color: var(--blue); text-decoration: none; }
.nav a:hover::after { width: 100%; }

/* Dropdown "Soluções" — abre ao passar o mouse */
.nav-drop { position: relative; display: inline-flex; align-items: center; }
.nav-drop-toggle .caret { font-size: 10px; margin-left: 2px; }
.nav-menu {
    position: absolute; top: calc(100% + 22px); left: 50%; transform: translateX(-50%);
    min-width: 300px; background: linear-gradient(160deg,#7C3AED,#6D28D9); border: 1px solid rgba(255,255,255,.18); border-radius: 12px;
    box-shadow: var(--shadow-md); padding: 8px; z-index: 60;
    display: flex; flex-direction: column;
    opacity: 0; visibility: hidden; transition: opacity .16s ease;
}
.nav-menu::before { content: ""; position: absolute; top: -22px; left: 0; right: 0; height: 22px; }
.nav-drop:hover .nav-menu, .nav-drop:focus-within .nav-menu { opacity: 1; visibility: visible; }
.nav-menu a { padding: 10px 14px; border-radius: 8px; font-size: 14px; color: #fff; font-weight: 600; white-space: nowrap; }
.nav-menu a::after { display: none; }
.nav-menu a:hover { background: rgba(255,255,255,.16); color: #fff; }
.nav-menu .nav-menu-all { margin-top: 6px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.28); color: #fff; font-weight: 800; }
.nav-menu .nav-menu-all:hover { color: #FCD34D; background: rgba(255,255,255,.10); }

/* Menu "Admin" (dropdown à direita nas telas de administração) */
.nav-admin { display: inline-flex; align-items: center; }
.nav-admin .nav-drop-toggle {
    display: inline-flex; align-items: center; gap: 5px;
    color: var(--navy); font-weight: 700; font-size: 15px; padding: 9px 16px;
    border-radius: 10px; background: var(--grad-btn); border: 1px solid rgba(124,58,237,.18);
    text-decoration: none;
}
.nav-admin .nav-menu { left: auto; right: 0; transform: none; }

.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 11px 20px; border-radius: 10px; font-weight: 700; font-size: 15px;
    border: 0; cursor: pointer; transition: transform .05s ease, box-shadow .2s ease, background .2s ease;
    text-decoration: none;
}
.btn:hover { text-decoration: none; }
.btn:active { transform: translateY(1px); }
/* Botões coloridos: degradê GRS forte (violeta->pink->âmbar, texto branco) — exceto WhatsApp */
.btn-primary, .btn-accent, .btn-suporte {
    background: var(--grad); color: #fff;
    border: 0;
    box-shadow: 0 10px 24px -8px rgba(124,58,237,.5);
}
.btn-primary:hover, .btn-accent:hover, .btn-suporte:hover { filter: brightness(1.05); color: #fff; transform: translateY(-1px); }
.btn-ghost { background: transparent; color: var(--navy); border: 1.5px solid var(--line); }
.btn-ghost:hover { border-color: var(--blue); color: var(--blue); }
.btn-block { width: 100%; }
.btn-lg { padding: 14px 26px; font-size: 16px; }

/* ------------------------------- Hero (pastel azul->laranja) --------- */
.hero {
    background:
        radial-gradient(660px 380px at 86% 10%, rgba(236,72,153,.22), transparent 60%),
        radial-gradient(720px 420px at 6% 2%, rgba(124,58,237,.20), transparent 60%),
        radial-gradient(560px 360px at 58% 0%, rgba(37,99,235,.14), transparent 60%),
        radial-gradient(520px 340px at 98% 66%, rgba(245,158,11,.16), transparent 62%),
        radial-gradient(520px 340px at 16% 92%, rgba(16,185,129,.12), transparent 62%),
        linear-gradient(135deg, #F3ECFF 0%, #FAF9FF 46%, #FEF3E2 100%);
    color: var(--ink);
    padding: 118px 0 84px;   /* topo maior: menu flutua sobre o hero */
    position: relative; overflow: hidden;
    border-bottom: 1px solid rgba(124,58,237,.08);
}
.hero .grid {
    display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center;
}
.eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,.75); border: 1px solid rgba(124,58,237,.18);
    color: var(--blue); padding: 7px 14px; border-radius: 999px; font-size: 13px; font-weight: 700;
    letter-spacing: .3px; margin-bottom: 20px;
}
.eyebrow .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--orange); }
.hero h1 { font-size: 44px; line-height: 1.1; margin: 0 0 16px; color: var(--navy); font-weight: 800; letter-spacing: -.5px; }
.hero h1 span {
    background: linear-gradient(120deg, #7C3AED 0%, #6e7173 45%, #EC4899 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero p.lead { font-size: 18px; color: var(--muted); margin: 0 0 26px; max-width: 560px; }
.hero .cta-row { display: flex; gap: 14px; flex-wrap: wrap; max-width: 520px; }
.hero .cta-row .btn { flex: 1 1 200px; }

.trust {
    margin-top: 34px; display: flex; gap: 28px; flex-wrap: wrap;
    color: var(--muted); font-size: 14px;
}
.trust b { color: var(--navy); font-size: 20px; display: block; }

/* Card de destaque — qualidade e produtos Senior (lugar do antigo box) */
.senior-card {
    background: #fff; border-radius: 18px; padding: 28px 26px;
    box-shadow: var(--shadow-lg); position: relative; overflow: hidden;
    border: 1px solid rgba(124,58,237,.08);
}
.senior-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--grad-line); }
.senior-card .sc-badge {
    display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase;
    color: var(--blue); background: rgba(124,58,237,.08); padding: 6px 12px; border-radius: 999px; margin-bottom: 14px;
}
.senior-card h3 { margin: 0 0 10px; font-size: 21px; color: var(--navy); letter-spacing: -.3px; }
.senior-card > p { margin: 0 0 18px; color: var(--muted); font-size: 14.5px; }
.sc-list { list-style: none; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: 1fr; gap: 10px; }
.sc-list li { position: relative; padding-left: 28px; color: var(--ink); font-size: 14.5px; font-weight: 600; }
.sc-list li::before {
    content: "✓"; position: absolute; left: 0; top: 1px; color: #fff; font-size: 11px; font-weight: 900;
    width: 19px; height: 19px; border-radius: 50%; display: grid; place-items: center; background: var(--grad-rev);
}
.sc-foot { display: flex; gap: 8px; flex-wrap: wrap; }
.sc-tag { font-size: 12px; font-weight: 700; color: var(--blue); background: rgba(124,58,237,.07); border: 1px solid rgba(124,58,237,.12); padding: 6px 12px; border-radius: 999px; }

/* Card de login no hero */
.login-card {
    background: #fff; color: var(--ink);
    border-radius: 18px; padding: 30px 28px;
    box-shadow: var(--shadow-lg);
    position: relative; overflow: hidden;
}
.login-card::before {
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px;
    background: var(--grad-line);
}

/* Hero em coluna unica (sem o box de login) */
.hero-solo { max-width: 760px; }

/* Pagina de login dedicada (login.php) */
.auth-page {
    min-height: 100vh; display: grid; place-items: center; padding: 40px 20px;
    background:
        radial-gradient(900px 500px at 15% 0%, rgba(124,58,237,.10), transparent 60%),
        radial-gradient(900px 500px at 85% 100%, rgba(236,72,153,.10), transparent 60%),
        var(--bg);
}
.auth-box { width: 100%; max-width: 420px; }
.auth-brand { display: flex; justify-content: center; margin-bottom: 22px; }
.auth-back { text-align: center; margin-top: 18px; }
.auth-back a { color: var(--muted); font-size: 14px; font-weight: 600; }
.auth-back a:hover { color: var(--blue); text-decoration: none; }
.login-card h3 { margin: 0 0 4px; font-size: 20px; color: var(--navy); }
.login-card .sub { margin: 0 0 20px; color: var(--muted); font-size: 14px; }

.field { margin-bottom: 15px; }
.field label { display: block; font-size: 13px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
.input {
    width: 100%; padding: 12px 14px; border: 1.5px solid var(--line); border-radius: 10px;
    font-size: 15px; color: var(--ink); background: #fbfcff; transition: border .15s, box-shadow .15s;
}
.input:focus { outline: 0; border-color: var(--blue); box-shadow: 0 0 0 4px rgba(124,58,237,.16); background: #fff; }
.input::placeholder { color: #9aa8c0; }

.form-row { display: flex; gap: 14px; }
.form-row .field { flex: 1; }

.form-help { font-size: 12.5px; color: var(--muted); margin-top: 6px; }

.alert { padding: 12px 14px; border-radius: 10px; font-size: 14px; margin-bottom: 16px; border: 1px solid transparent; }
.alert-error   { background: #fdecec; color: #a11b1b; border-color: #f6c9c9; }
.alert-success { background: #eaf7ea; color: #1f6b1f; border-color: #c6e6c1; }
.alert-info    { background: #eaf1fd; color: #6D28D9; border-color: #cadcfa; }

/* ------------------------- Faixa de destaques ------------------------ */
.stripe {
    background: #fff; border-bottom: 1px solid var(--line);
    padding: 22px 0;
}
.stripe .inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.stripe .item { display: flex; align-items: center; gap: 10px; color: var(--navy); font-weight: 700; font-size: 15px; }
.stripe .item i { color: var(--orange); font-style: normal; font-size: 18px; }
.stripe .item:nth-child(4n+1) i { color: var(--h-violet); }
.stripe .item:nth-child(4n+2) i { color: var(--h-blue); }
.stripe .item:nth-child(4n+3) i { color: var(--h-cyan); }
.stripe .item:nth-child(4n)   i { color: var(--h-amber); }

/* ------------------------------ Secoes ------------------------------- */
section.block { padding: 78px 0; background: transparent; }
.section-head { text-align: center; max-width: 720px; margin: 0 auto 46px; }
.section-head .kicker { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; font-size: 13px; }
.section-head h2 { font-size: 34px; margin: 10px 0 12px; color: var(--navy); letter-spacing: -.5px; }
.section-head p { color: var(--muted); font-size: 17px; margin: 0; }

.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.card {
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
    padding: 26px 24px; box-shadow: var(--shadow-sm); transition: transform .15s ease, box-shadow .2s ease, border-color .2s;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: #d3ddf0; }
.card .ico {
    width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center;
    background: var(--h-violet); color: #fff; font-size: 22px; margin-bottom: 16px;
    box-shadow: 0 8px 18px -8px var(--h-violet);
}
.cards .card:nth-child(6n+2) .ico { background: var(--h-blue);  box-shadow: 0 8px 18px -8px var(--h-blue); }
.cards .card:nth-child(6n+3) .ico { background: var(--h-cyan);  box-shadow: 0 8px 18px -8px var(--h-cyan); }
.cards .card:nth-child(6n+4) .ico { background: var(--h-green); box-shadow: 0 8px 18px -8px var(--h-green); }
.cards .card:nth-child(6n+5) .ico { background: var(--h-amber); box-shadow: 0 8px 18px -8px var(--h-amber); }
.cards .card:nth-child(6n)   .ico { background: var(--h-pink);  box-shadow: 0 8px 18px -8px var(--h-pink); }
.card h3 { margin: 0 0 8px; font-size: 18px; color: var(--navy); }
.card p { margin: 0; color: var(--muted); font-size: 14.5px; }
/* Card como link (menu de Soluções -> páginas de produto) */
.card-link { text-decoration: none; color: inherit; display: block; }
.card-link:hover { text-decoration: none; }
.card-link .card-more { display: inline-block; margin-top: 12px; font-weight: 700; font-size: 14px; color: var(--blue); }
.card-link:hover .card-more { color: var(--orange); }

/* Segmentos (chips) */
.segments { background: transparent; }
.chips { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.chip {
    background: #fff; border: 1.5px solid var(--line); border-radius: 999px;
    padding: 10px 18px; font-weight: 700; color: var(--navy); font-size: 14.5px; transition: transform .12s ease;
}
.chip:hover { transform: translateY(-2px); }
.chips .chip:nth-child(6n+1) { color: #7C3AED; border-color: #C9B6F5; }
.chips .chip:nth-child(6n+2) { color: #2563EB; border-color: #B7CCF7; }
.chips .chip:nth-child(6n+3) { color: #0E96B4; border-color: #A9DDE8; }
.chips .chip:nth-child(6n+4) { color: #0E9F6E; border-color: #A7E0CC; }
.chips .chip:nth-child(6n+5) { color: #D97706; border-color: #F3D19A; }
.chips .chip:nth-child(6n)   { color: #DB2777; border-color: #F4B6D2; }

/* Sobre + numeros */
.about .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.about h2 { font-size: 32px; color: var(--navy); margin: 0 0 16px; letter-spacing: -.5px; }
.about p { color: var(--muted); font-size: 16px; margin: 0 0 14px; }
.stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }
.stat {
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
    padding: 24px; text-align: center; box-shadow: var(--shadow-sm);
}
.stat .num {
    font-size: 34px; font-weight: 800;
    background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.stat .lbl { color: var(--muted); font-size: 14px; margin-top: 4px; }

/* Seção Agronegócio */
.agro { background: var(--grad-pastel); }
.agro-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 42px; }
.agro-cta { text-align: center; margin-top: 34px; }
@media (max-width: 720px) { .agro-stats { grid-template-columns: 1fr; } }

/* CTA band */
.cta-band {
    background: linear-gradient(120deg, #241a4d 0%, #7C3AED 35%, #EC4899 100%);
    color: #fff; border-radius: 20px; padding: 46px; text-align: center;
    box-shadow: var(--shadow-md);
}
.cta-band h2 { font-size: 30px; margin: 0 0 10px; }
.cta-band p { color: #d3e0ee; margin: 0 0 22px; font-size: 17px; }

/* ------------------------------ Rodape ------------------------------- */
footer.site {
    background: linear-gradient(120deg, #0B0A19 0%, #3a2a6e 52%, #8a2f66 100%);
    color: #cdd8e6; padding: 56px 0 90px; margin-top: 10px;
}
footer.site .grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 34px; }
footer.site h4 { color: #fff; font-size: 15px; margin: 0 0 14px; text-transform: uppercase; letter-spacing: .5px; }
footer.site a { color: #b6c6d8; display: block; margin-bottom: 8px; font-size: 14.5px; }
footer.site a:hover { color: #fff; text-decoration: none; }
footer.site .muted { font-size: 14px; color: #8ea3ba; }
footer.site .bottom {
    border-top: 1px solid rgba(255,255,255,.1); margin-top: 34px; padding-top: 20px;
    display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 13.5px; color: #8ea3ba;
}
/* Acesso discreto às Configurações do Site (login) no rodapé */
footer.site .bottom .site-config {
    display: inline-flex; align-items: center; gap: 7px;
    color: #7d90a8; font-size: 12.5px; font-weight: 600; opacity: .65; text-decoration: none;
    transition: opacity .15s ease, color .15s ease;
}
footer.site .bottom .site-config:hover { opacity: 1; color: #fff; text-decoration: none; }
footer.site .bottom .site-config svg { display: block; }

/* --------------------- Botao flutuante WhatsApp ---------------------- */
.wa-float {
    position: fixed; right: 22px; bottom: 22px; z-index: 60;
    display: inline-flex; align-items: center; gap: 10px;
    background: #25D366; color: #fff; padding: 12px 18px 12px 14px;
    border-radius: 999px; box-shadow: 0 10px 26px rgba(37,211,102,.45);
    font-weight: 700; text-decoration: none;
    transition: transform .12s ease, box-shadow .2s ease;
}
.wa-float:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(37,211,102,.55); color: #fff; text-decoration: none; }
.wa-float svg { width: 26px; height: 26px; fill: #fff; }
.wa-float .wa-label { font-size: 14.5px; white-space: nowrap; }
@media (max-width: 560px) { .wa-float .wa-label { display: none; } .wa-float { padding: 15px; gap: 0; } }

/* ----------------------- Modal "Fale conosco" ------------------------ */
.modal-overlay {
    position: fixed; inset: 0; z-index: 80; display: none;
    align-items: flex-start; justify-content: center; padding: 40px 16px;
    background: rgba(11,25,45,.55); backdrop-filter: blur(3px); overflow-y: auto;
}
.modal-overlay.open { display: flex; }
.modal {
    position: relative; width: 100%; max-width: 480px; margin-top: 3vh;
    background: #fff; border-radius: 16px; padding: 30px 28px;
    box-shadow: 0 30px 70px rgba(11,31,58,.35); overflow: hidden;
    animation: modalIn .18s ease;
}
.modal::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--grad-line); }
@keyframes modalIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
.modal h3 { margin: 0 0 4px; font-size: 21px; color: var(--navy); }
.modal .modal-sub { margin: 0 0 18px; color: var(--muted); font-size: 14px; }
.modal-close {
    position: absolute; top: 12px; right: 14px; border: 0; background: transparent;
    font-size: 26px; line-height: 1; color: var(--muted); cursor: pointer;
}
.modal-close:hover { color: var(--navy); }
.modal textarea.input { resize: vertical; min-height: 96px; font-family: inherit; }
.modal .g-recaptcha { margin: 6px 0 4px; }
.mc-alert { padding: 11px 14px; border-radius: 10px; font-size: 14px; margin-bottom: 14px; }
.mc-alert.ok  { background: #eaf7ea; color: #1f6b1f; border: 1px solid #c6e6c1; }
.mc-alert.err { background: #fdecec; color: #a11b1b; border: 1px solid #f6c9c9; }

/* ------------------------- Página de produto ------------------------- */
.prod-hero {
    padding: 118px 0 46px;
    background:
        radial-gradient(700px 360px at 90% 8%, rgba(236,72,153,.16), transparent 60%),
        radial-gradient(720px 380px at 4% 0%, rgba(124,58,237,.14), transparent 60%),
        linear-gradient(135deg, #F1ECFF 0%, #FAF9FF 50%, #FEF2E2 100%);
    border-bottom: 1px solid rgba(124,58,237,.08);
}
.prod-back { display: inline-block; margin-bottom: 14px; color: var(--muted); font-weight: 600; font-size: 14px; }
.prod-back:hover { color: var(--blue); text-decoration: none; }
.prod-ico { font-size: 42px; line-height: 1; margin-bottom: 6px; }
.prod-kicker { color: var(--blue); font-weight: 800; letter-spacing: 1px; text-transform: uppercase; font-size: 13px; }
.prod-hero h1 { font-size: 38px; color: var(--navy); margin: 6px 0 8px; letter-spacing: -.5px; }
.prod-tag { font-size: 18px; color: var(--muted); margin: 0; }

.prod-grid { display: grid; grid-template-columns: 1.6fr .9fr; gap: 40px; align-items: start; }
.prod-intro { font-size: 17px; color: var(--ink); margin: 0 0 24px; }
.prod-main h3 { font-size: 20px; color: var(--navy); margin: 0 0 14px; }
.prod-list { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 12px; }
.prod-list li { position: relative; padding-left: 30px; color: var(--ink); font-size: 15.5px; }
.prod-list li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: var(--grad-rev); color: #fff; font-size: 12px; font-weight: 900; display: grid; place-items: center; }
.prod-note { color: var(--muted); font-size: 13.5px; font-style: italic; }

.prod-cta-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px; box-shadow: var(--shadow-sm); position: relative; overflow: hidden; }
.prod-cta-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--grad-line); }
.prod-cta-card h4 { margin: 4px 0 8px; font-size: 18px; color: var(--navy); }
.prod-cta-card p { margin: 0 0 16px; color: var(--muted); font-size: 14px; }
.prod-side-list { margin-top: 22px; display: flex; flex-direction: column; }
.prod-side-title { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; color: var(--muted); margin-bottom: 8px; }
.prod-side-list a { padding: 9px 0; color: var(--navy); font-weight: 600; font-size: 14.5px; border-bottom: 1px solid var(--line); }
.prod-side-list a:hover { color: var(--blue); text-decoration: none; }
@media (max-width: 820px) { .prod-grid { grid-template-columns: 1fr; } }

/* ---------------------------- Publicações ---------------------------- */
.pub-thumb { width: 100%; height: 160px; object-fit: cover; border-radius: 10px; margin-bottom: 14px; }
.pub-hero-img { width: 100%; max-height: 380px; object-fit: cover; border-radius: 14px; margin-bottom: 24px; }
.pub-conteudo { color: var(--ink); font-size: 16px; line-height: 1.7; }
.pub-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.pub-row:last-child { border-bottom: 0; }
.pub-acoes { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pub-acoes .btn { padding: 7px 14px; font-size: 13px; }

/* Grid/tabela (ex.: usuários) */
.tbl-wrap { overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.tbl th { text-align: left; padding: 10px 12px; border-bottom: 2px solid var(--line); color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; }
.tbl td { padding: 10px 12px; border-bottom: 1px solid var(--line); color: var(--ink); }
.tbl tbody tr:hover td { background: var(--bg); }
.tbl .col-chk { width: 40px; text-align: center; }
.tbl .col-chk input { width: 17px; height: 17px; }

/* Guias (abas) — página de Configurações */
.tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 2px solid var(--line); margin: 10px 0 22px; }
.tabs .tab { appearance: none; -webkit-appearance: none; border: 1px solid transparent; border-bottom: none; background: transparent; color: var(--muted); font: inherit; font-weight: 700; font-size: 14px; padding: 10px 16px; border-radius: 10px 10px 0 0; cursor: pointer; margin-bottom: -2px; display: inline-flex; align-items: center; gap: 7px; transition: color .15s, background .15s; }
.tabs .tab:hover { color: var(--ink); background: var(--bg); }
.tabs .tab.active { color: var(--blue); background: #fff; border-color: var(--line); border-bottom-color: #fff; box-shadow: 0 -2px 6px rgba(90,60,180,.05); }
.tabs .tab .ti { font-size: 16px; line-height: 1; }
.tabpane { display: none; }
.tabpane.active { display: block; animation: tabIn .18s ease; }

/* reCAPTCHA dentro dos modais */
.mx-recaptcha-wrap { display: flex; justify-content: center; margin: 6px 0 2px; }
@keyframes tabIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (max-width: 640px) {
    .tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .tabs .tab { white-space: nowrap; }
}

/* ======================= Area administrativa ======================== */
.admin-bg { background: var(--bg); min-height: 100vh; padding-top: 74px; }
.admin-top {
    background: var(--navy); color: #fff;
    border-bottom: 3px solid transparent; border-image: var(--grad-line) 1;
}
.admin-top .inner { display: flex; align-items: center; justify-content: space-between; height: 68px; }
.admin-top .brand-mark .mx-mark { width: 40px; }
.admin-top .brand .name .word { font-size: 18px; }
.admin-tag { color: #bcd0e4; font-weight: 600; font-size: 14px; align-self: center; }
.admin-top .right { display: flex; align-items: center; gap: 18px; font-size: 14px; color: #c6d6e8; }
.admin-top .right a { color: #fff; font-weight: 600; }

.admin-wrap { max-width: 900px; margin: 34px auto; padding: 0 22px; }
.admin-wrap h1 { font-size: 26px; color: var(--navy); margin: 0 0 4px; }
.admin-wrap .desc { color: var(--muted); margin: 0 0 26px; }

.panel {
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
    box-shadow: var(--shadow-sm); margin-bottom: 24px; overflow: hidden;
}
.panel .head {
    padding: 18px 24px; border-bottom: 1px solid var(--line);
    display: flex; align-items: center; gap: 12px;
}
.panel .head .pico {
    width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center;
    background: linear-gradient(135deg, rgba(124,58,237,.12), rgba(236,72,153,.16)); color: var(--blue); font-size: 18px;
}
.panel .head h2 { font-size: 18px; margin: 0; color: var(--navy); }
.panel .head p { margin: 2px 0 0; font-size: 13px; color: var(--muted); }
.panel .body { padding: 24px; }

.switch { display: flex; align-items: center; gap: 12px; }
.switch input { width: 18px; height: 18px; }

.form-actions { display: flex; gap: 12px; align-items: center; margin-top: 8px; flex-wrap: wrap; }

.note {
    background: #f2f6ff; border: 1px solid #d9e4fb; border-radius: 10px;
    padding: 14px 16px; font-size: 13.5px; color: #244a94; margin-top: 6px;
}
.note b { color: #17306a; }

.badge-lock { font-size: 12px; color: var(--muted); }

/* ------------------------------ Responsivo --------------------------- */
@media (max-width: 900px) {
    .hero .grid { grid-template-columns: 1fr; gap: 34px; }
    .cards { grid-template-columns: 1fr 1fr; }
    .about .grid { grid-template-columns: 1fr; }
    footer.site .grid { grid-template-columns: 1fr 1fr; }
    .nav { display: none; }
}
@media (max-width: 560px) {
    .hero h1 { font-size: 34px; }
    .cards { grid-template-columns: 1fr; }
    .stats { grid-template-columns: 1fr; }
    footer.site .grid { grid-template-columns: 1fr; }
    .form-row { flex-direction: column; gap: 0; }
}

/* ============================================================
   GRS — camada de tema da PAGINA INICIAL (body.home)
   Aditivo e escopado: traz o visual da apresentacao GRS sobre
   a estrutura atual da home, sem afetar as demais paginas.
   ============================================================ */
body.home .hero{ position:relative; overflow:hidden; }
body.home .hero::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(124,58,237,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(124,58,237,.06) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(120% 80% at 50% 0,#000,transparent 70%);
          mask-image:radial-gradient(120% 80% at 50% 0,#000,transparent 70%);
}
body.home .hero > .container{ position:relative; z-index:1; }
body.home .hero h1 span{ background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
body.home .hero .eyebrow{ font-family:ui-monospace,"SF Mono",Consolas,monospace; text-transform:uppercase; letter-spacing:.18em; font-size:.72rem; font-weight:700; color:#7C3AED; display:inline-flex; align-items:center; gap:10px; }
body.home .hero .eyebrow .dot{ width:8px; height:8px; border-radius:50%; background:var(--grad); display:inline-block; }

body.home .section-head .kicker{
  display:inline-block; font-family:ui-monospace,"SF Mono",Consolas,monospace; font-size:.7rem; letter-spacing:.14em;
  text-transform:uppercase; color:#fff; background:var(--grad); padding:5px 12px; border-radius:7px; font-weight:700;
}

body.home .cards .card{ position:relative; overflow:hidden; border-radius:18px; transition:transform .18s ease, box-shadow .25s ease; }
body.home .cards .card::before{ content:""; position:absolute; left:0; right:0; top:0; height:5px; background:var(--grad); z-index:1; }
body.home .cards .card:nth-child(3n+2)::before{ background:linear-gradient(92deg,#2563EB,#06B6D4); }
body.home .cards .card:nth-child(3n)::before{ background:linear-gradient(92deg,#0E9F6E,#F59E0B); }
body.home .cards .card:hover{ transform:translateY(-4px); box-shadow:0 26px 50px -30px rgba(90,60,180,.5); }

body.home .senior-card{ position:relative; overflow:hidden; }
body.home .senior-card::before{ content:""; position:absolute; left:0; right:0; top:0; height:5px; background:var(--grad); }

body.home .cta-band{ position:relative; overflow:hidden; }
body.home .cta-band::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(500px 300px at 12% 10%, rgba(124,58,237,.20), transparent 60%),
    radial-gradient(480px 300px at 88% 18%, rgba(236,72,153,.18), transparent 60%),
    radial-gradient(420px 260px at 60% 115%, rgba(245,158,11,.18), transparent 60%);
}
body.home .cta-band > *{ position:relative; z-index:1; }

/* ============================================================
   TEMA ESCURO do site publico (body.dark) — base: fabrikaideias.
   Menu (topbar) roxo com texto branco. Nao afeta o admin (sem .dark).
   ============================================================ */
body.dark{
  --navy:#EDEBFF; --ink:#F4F2FF; --muted:#9C99BE; --line:#2A2450; --bg:#0B0A19;
  background:#0B0A19; color:#F4F2FF;   /* fundo liso igual ao da fabrikaideias */
}
/* Herói com os "blobs" coloridos da fabrikaideias (violeta/pink/ciano/âmbar/verde) */
body.dark .hero{
  background:
    radial-gradient(480px 480px at 96% -40px, rgba(124,58,237,.42), transparent 62%),
    radial-gradient(420px 420px at 72% 70px,  rgba(236,72,153,.38), transparent 62%),
    radial-gradient(380px 380px at 54% -30px, rgba(6,182,212,.32),  transparent 62%),
    radial-gradient(360px 360px at 101% 210px, rgba(245,158,11,.32), transparent 62%),
    radial-gradient(320px 320px at 66% 250px, rgba(16,185,129,.26), transparent 62%),
    #0B0A19;
  border-bottom-color: rgba(124,58,237,.25);
}
body.dark .hero h1 span{ background:linear-gradient(120deg,#A277FF 0%,#FF74B2 55%,#FFB454 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
body.dark .eyebrow{ background:rgba(124,58,237,.20); border-color:rgba(162,119,255,.45); color:#C9B6F5; }
body.dark .senior-card, body.dark .card, body.dark .stat, body.dark .chip, body.dark .login-card{ background:#151327; border-color:#2A2450; }
body.dark .stripe{ background:#120F24; border-bottom-color:#2A2450; }
body.dark .input{ background:#1B1930; color:#F4F2FF; border-color:#2A2450; }
body.dark .input::placeholder{ color:#6f6c92; }
body.dark .card:hover{ border-color:#3a3466; }
body.dark .sc-tag, body.dark .senior-card .sc-badge{ background:rgba(124,58,237,.22); }
/* Menu (topbar) roxo, texto branco */
body.dark .topbar .inner{ background:linear-gradient(160deg,#7C3AED,#6D28D9); border:1px solid rgba(255,255,255,.14); box-shadow:0 16px 36px rgba(0,0,0,.5); }
body.dark .nav a{ color:#fff; }
body.dark .nav a:hover{ color:#fff; }
body.dark .brand-logo{ content: url('../img/maxsenior-white.png'); background: transparent; padding: 0; border-radius: 0; }
body.dark .btn-ghost{ color:#EDEBFF; border-color:#3a3466; }
body.dark .btn-ghost:hover{ border-color:#A277FF; color:#A277FF; }
/* Hero das páginas de produto/solução no tema escuro */
body.dark .prod-hero{
    background:
        radial-gradient(700px 360px at 90% 6%, rgba(236,72,153,.20), transparent 60%),
        radial-gradient(720px 380px at 2% 0%, rgba(124,58,237,.24), transparent 60%),
        radial-gradient(620px 320px at 65% 108%, rgba(245,158,11,.12), transparent 60%),
        #0B0A19;
    border-bottom:1px solid rgba(124,58,237,.28);
}
body.dark .prod-hero h1{
    background:linear-gradient(92deg,#A277FF 0%,#FF74B2 52%,#FFB454 100%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
body.dark .prod-kicker{ color:#A277FF; }
body.dark .prod-tag{ color:#C9C6E4; }
body.dark .prod-back{ color:#C9C6E4; }
body.dark .prod-back:hover{ color:#fff; }
body.dark .prod-cta-card{ background:#151327; border-color:#2A2450; box-shadow:0 18px 40px rgba(0,0,0,.45); }
body.dark .prod-side-list a{ border-bottom-color:#2A2450; }
body.dark .prod-list li::before{ color:#fff; }