/* ==============================================================
   HAPPY 2027 — Design system
   Branco predominante • amarelo ouro • preto
   Camada visual não altera conteúdo ou URLs existentes.
   ============================================================== */
:root {
    --ink: #181818;
    --muted: #646464;
    --gold: #d5a72b;
    --gold-light: #f7e8bb;
    --paper: #ffffff;
    --soft: #f7f7f5;
    --line: #ecece9;
    --radius: 26px;
    --content: 1280px;
}
html { scroll-behavior: smooth; scroll-padding-top: 108px; }
body { background: #fff; color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; font-size: 16px; line-height: 1.7; letter-spacing: -.012em; }
h1, h2, h3, h4 { font-weight: 680; letter-spacing: -.052em; line-height: 1.13; }
h1 { font-size: clamp(44px, 5.25vw, 82px); }
h2 { font-size: clamp(32px, 3.8vw, 54px); }
h3 { font-size: clamp(22px, 2.1vw, 29px); }
a { transition: color .22s ease, background-color .22s ease, border-color .22s ease, transform .22s ease; }
.wrap { max-width: 1328px; margin: 0 auto; padding: 0 32px; }
.topline { background: #181818; color: #f9f9f9; text-align: center; letter-spacing: .15em; font-size: 10px; padding: 7px 12px; }
.header { background: rgba(255,255,255,.94); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); border-bottom: 1px solid rgba(0,0,0,.055); box-shadow: 0 4px 28px rgba(0,0,0,.025); }
.header-row { min-height: 92px; }
.logo img { width: 146px; height: auto; object-fit: contain; }
.nav { gap: 7px; }
.nav a { font-size: 13px; font-weight: 600; border-radius: 999px; padding: 11px 15px; }
.nav a:hover, .nav a[aria-current=page] { background: #f4f4f1; color: #111; }
.nav a.nav-cta { background: var(--gold); color: #171717; border-radius: 999px; padding: 12px 20px; box-shadow: 0 6px 18px rgba(213,167,43,.17); }
.nav a.nav-cta:hover { background: #e4b832; transform: translateY(-1px); }
.menu-toggle { border-radius: 16px; }
.button { border-radius: 999px; padding: 14px 26px; font-weight: 650; letter-spacing: -.015em; }
.button.gold, .button:hover { background: var(--gold); color: #171717; }
.text-link { font-weight: 650; text-underline-offset: 5px; }
.hero { background: #fff; border-bottom: 1px solid var(--line); }
.hero-copy { background: #fff; padding-top: 88px; padding-bottom: 88px; }
.hero h1 { max-width: 750px; }
.hero h1 em { color: #b58a16; font-style: normal; }
.hero-copy p { max-width: 560px; color: #555; }
.hero-visual { margin: 24px 24px 24px 0; overflow: hidden; border-radius: 36px; }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; }
.photo-note { border-radius: 999px; background: rgba(255,255,255,.9); color: #222; backdrop-filter: blur(10px); padding: 7px 14px; }
.eyebrow { color: #9c7513; font-weight: 750; letter-spacing: .15em; }
.facts { background: #fff; border-bottom: 1px solid var(--line); }
.fact strong { letter-spacing: -.04em; }
.section { padding-top: 100px; padding-bottom: 100px; }
.section.soft { background: #fafaf9; }
.section.dark { background: #222; border-radius: 40px; margin: 18px 24px; }
.card { overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 28px; box-shadow: 0 12px 40px rgba(0,0,0,.03); }
.card:hover { transform: translateY(-5px); box-shadow: 0 22px 56px rgba(0,0,0,.085); }
.card-image { overflow: hidden; }
.card-image img { width: 100%; border-radius: 0; }
.card-body { padding: 24px 25px 29px; }
.card h3 { font-weight: 670; }
.card-label { color: #977314; }
.card-link { color: #a67b0c; font-weight: 700; }
.step { background: #fff; border: 1px solid var(--line); padding: 25px 23px; border-radius: 23px; }
.step span { color: #ba8b17; }
.split figure, .split>img, .split figure img { border-radius: 30px; overflow: hidden; }
.page-hero { background: #fafaf9; padding-top: 52px; padding-bottom: 66px; }
.page-hero h1 { max-width: 1070px; font-size: clamp(36px, 4.2vw, 65px); }
.page-hero .lead { max-width: 860px; color: #5d5d5d; }
.breadcrumbs a { text-decoration: none; color: #7a7a7a; }
.article-layout { gap: 58px; }
.article-body { min-width: 0; }
.article-body figure img { border-radius: 24px; }
.article-body h2 { margin-top: 45px; }
.article-aside, .contact-panel { background: #fafaf9; border: 1px solid #efefeb; border-radius: 28px; padding: 30px; }
.article-aside .button { color: #191919; background: var(--gold); }
.catalog .module-card, .article-body .color-item { border-radius: 24px; border-color: var(--line); }
.callout, .guide-index a, .form-message { border-radius: 20px; }
.field input, .field select, .field textarea, .search-field { border-radius: 14px; border-color: #dcdcd8; }
.cta-band { background: #f8f6ef; color: #1b1b1b; margin: 24px; border-radius: 32px; }
.cta-band .button { background: var(--gold); color: #191919; }
.footer { background: #fff; color: #252525; border-top: 1px solid var(--line); }
.footer a:hover { color: #a47d18; }
.whatsapp { border-radius: 999px; box-shadow: 0 14px 32px rgba(0,0,0,.15); }
.consent { border-radius: 24px; }
@media (max-width: 1100px) { .nav { gap: 2px; } .nav a { padding: 9px 10px; } }
@media (max-width: 860px) {
    .wrap { padding: 0 24px; }
    .header-row { min-height: 76px; }
    .nav { background: rgba(255,255,255,.98); backdrop-filter: blur(20px); padding: 18px 24px 28px; }
    .nav a { border-radius: 14px; padding: 13px 14px; }
    .hero-visual { margin: 0 20px 20px; border-radius: 28px; }
    .section { padding-top: 68px; padding-bottom: 68px; }
    .section.dark { margin: 12px; border-radius: 28px; }
    .article-layout { gap: 32px; }
}
@media (max-width: 600px) {
    .wrap { padding: 0 20px; }
    .hero-copy { padding: 62px 24px 40px; }
    .hero h1 { font-size: clamp(42px, 10.5vw, 60px); }
    .hero-visual { min-height: 320px; margin: 0 16px 16px; border-radius: 24px; }
    .card { border-radius: 22px; }
    .card-body { padding: 22px; }
    .page-hero { padding-top: 31px; padding-bottom: 48px; }
    .cta-band { margin: 12px; border-radius: 24px; }
    .footer-grid { gap: 22px; }
}



/* ============================================================
   HAPPY 2027 — CONTRASTE, ACESSIBILIDADE E PROFUNDIDADE
   Fundo claro = texto escuro. Fundo escuro = texto claro.
   ============================================================ */
:root {
    --ink: #141414;
    --muted: #414141;
    --gold: #D7A51E;
    --gold-dark: #765400;
    --paper: #FFFFFF;
    --soft: #F6F6F4;
    --line: #DADADA;
    --shadow-soft: 0 8px 25px rgba(0, 0, 0, 0.075);
    --shadow-card: 0 18px 42px rgba(0, 0, 0, 0.10);
}
body, .section, .hero-copy, .page-hero, .article-aside,
.contact-panel, .card, .step, .cta-band, .footer, .consent {
    color: var(--ink);
}
body, .hero-copy, .footer, .card, .step, .consent {
    background-color: #FFFFFF;
}
.hero, .hero-copy { color: #141414; }
.hero-copy p, .page-hero .lead, .article-body p,
.article-body li, .footer p, .footer a, .footer span,
.footer-bottom, .footer h3, .article-aside p,
.section-head p, .breadcrumbs, .fact, .form-note {
    color: #353535;
}
.footer { background: #FFFFFF; border-top: 1px solid #DADADA; }
.footer h2, .footer h3, .footer strong { color: #141414; }
.footer a { color: #252525; }
.footer a:hover { color: #785800; }
.footer-bottom { border-top-color: #DADADA; }
.section.dark, .section.dark .wrap,
.section.dark h1, .section.dark h2,
.section.dark h3, .section.dark p,
.section.dark li, .section.dark span,
.section.dark .eyebrow {
    color: #FFFFFF;
}
.section.dark { background: #1B1B1B; }
.section.dark a:not(.button) { color: #F5D885; }
.topline { color: #FFFFFF; background: #191919; }
.hero .eyebrow, .eyebrow, .card-label { color: #775600; }
.hero h1 em { color: #9B7210; }
.nav a { color: #242424; }
.nav a.nav-cta, .button.gold, .cta-band .button,
.article-aside .button { background: var(--gold); color: #171717; }
.nav a.nav-cta:hover, .button.gold:hover,
.cta-band .button:hover { background: #E7B939; color: #111111; }
.button:not(.gold):not(.outline) { background: #1E1E1E; color: #FFFFFF; }
.button:not(.gold):not(.outline):hover { background: #373737; color: #FFFFFF; }
.card, .article-aside, .contact-panel, .step,
.callout, .cta-band, .form-message {
    box-shadow: var(--shadow-soft);
    border: 1px solid #E0E0E0;
}
.card:hover { box-shadow: var(--shadow-card); }
.card h2, .card h3, .step h3,
.article-aside h2, .contact-panel h2 { color: #161616; }
.card p, .step p, .cta-band p { color: #373737; }
.hero-visual, .article-body figure img {
    box-shadow: 0 20px 48px rgba(0, 0, 0, .12);
}
.field input, .field select, .field textarea, .search-field {
    color: #171717; background: #FFFFFF; border: 1px solid #A9A9A9;
}
.field input::placeholder, .field textarea::placeholder { color: #585858; }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible {
    outline: 3px solid #9B7312; outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}



/* ============================================================
   HAPPY 2027 — CONTRASTE, ACESSIBILIDADE E PROFUNDIDADE
   Fundo claro = texto escuro. Fundo escuro = texto claro.
   ============================================================ */
:root {
    --ink: #141414;
    --muted: #414141;
    --gold: #D7A51E;
    --gold-dark: #765400;
    --paper: #FFFFFF;
    --soft: #F6F6F4;
    --line: #DADADA;
    --shadow-soft: 0 8px 25px rgba(0, 0, 0, 0.075);
    --shadow-card: 0 18px 42px rgba(0, 0, 0, 0.10);
}
body, .section, .hero-copy, .page-hero, .article-aside,
.contact-panel, .card, .step, .cta-band, .footer, .consent {
    color: var(--ink);
}
body, .hero-copy, .footer, .card, .step, .consent {
    background-color: #FFFFFF;
}
.hero, .hero-copy { color: #141414; }
.hero-copy p, .page-hero .lead, .article-body p,
.article-body li, .footer p, .footer a, .footer span,
.footer-bottom, .footer h3, .article-aside p,
.section-head p, .breadcrumbs, .fact, .form-note {
    color: #353535;
}
.footer { background: #FFFFFF; border-top: 1px solid #DADADA; }
.footer h2, .footer h3, .footer strong { color: #141414; }
.footer a { color: #252525; }
.footer a:hover { color: #785800; }
.footer-bottom { border-top-color: #DADADA; }
.section.dark, .section.dark .wrap,
.section.dark h1, .section.dark h2,
.section.dark h3, .section.dark p,
.section.dark li, .section.dark span,
.section.dark .eyebrow {
    color: #FFFFFF;
}
.section.dark { background: #1B1B1B; }
.section.dark a:not(.button) { color: #F5D885; }
.topline { color: #FFFFFF; background: #191919; }
.hero .eyebrow, .eyebrow, .card-label { color: #775600; }
.hero h1 em { color: #9B7210; }
.nav a { color: #242424; }
.nav a.nav-cta, .button.gold, .cta-band .button,
.article-aside .button { background: var(--gold); color: #171717; }
.nav a.nav-cta:hover, .button.gold:hover,
.cta-band .button:hover { background: #E7B939; color: #111111; }
.button:not(.gold):not(.outline) { background: #1E1E1E; color: #FFFFFF; }
.button:not(.gold):not(.outline):hover { background: #373737; color: #FFFFFF; }
.card, .article-aside, .contact-panel, .step,
.callout, .cta-band, .form-message {
    box-shadow: var(--shadow-soft);
    border: 1px solid #E0E0E0;
}
.card:hover { box-shadow: var(--shadow-card); }
.card h2, .card h3, .step h3,
.article-aside h2, .contact-panel h2 { color: #161616; }
.card p, .step p, .cta-band p { color: #373737; }
.hero-visual, .article-body figure img {
    box-shadow: 0 20px 48px rgba(0, 0, 0, .12);
}
.field input, .field select, .field textarea, .search-field {
    color: #171717; background: #FFFFFF; border: 1px solid #A9A9A9;
}
.field input::placeholder, .field textarea::placeholder { color: #585858; }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible {
    outline: 3px solid #9B7312; outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}



/* ============================================================
   HAPPY 2027 — CONTRASTE, ACESSIBILIDADE E PROFUNDIDADE
   Fundo claro = texto escuro. Fundo escuro = texto claro.
   ============================================================ */
:root {
    --ink: #141414;
    --muted: #414141;
    --gold: #D7A51E;
    --gold-dark: #765400;
    --paper: #FFFFFF;
    --soft: #F6F6F4;
    --line: #DADADA;
    --shadow-soft: 0 8px 25px rgba(0, 0, 0, 0.075);
    --shadow-card: 0 18px 42px rgba(0, 0, 0, 0.10);
}
body, .section, .hero-copy, .page-hero, .article-aside,
.contact-panel, .card, .step, .cta-band, .footer, .consent {
    color: var(--ink);
}
body, .hero-copy, .footer, .card, .step, .consent {
    background-color: #FFFFFF;
}
.hero, .hero-copy { color: #141414; }
.hero-copy p, .page-hero .lead, .article-body p,
.article-body li, .footer p, .footer a, .footer span,
.footer-bottom, .footer h3, .article-aside p,
.section-head p, .breadcrumbs, .fact, .form-note {
    color: #353535;
}
.footer { background: #FFFFFF; border-top: 1px solid #DADADA; }
.footer h2, .footer h3, .footer strong { color: #141414; }
.footer a { color: #252525; }
.footer a:hover { color: #785800; }
.footer-bottom { border-top-color: #DADADA; }
.section.dark, .section.dark .wrap,
.section.dark h1, .section.dark h2,
.section.dark h3, .section.dark p,
.section.dark li, .section.dark span,
.section.dark .eyebrow {
    color: #FFFFFF;
}
.section.dark { background: #1B1B1B; }
.section.dark a:not(.button) { color: #F5D885; }
.topline { color: #FFFFFF; background: #191919; }
.hero .eyebrow, .eyebrow, .card-label { color: #775600; }
.hero h1 em { color: #9B7210; }
.nav a { color: #242424; }
.nav a.nav-cta, .button.gold, .cta-band .button,
.article-aside .button { background: var(--gold); color: #171717; }
.nav a.nav-cta:hover, .button.gold:hover,
.cta-band .button:hover { background: #E7B939; color: #111111; }
.button:not(.gold):not(.outline) { background: #1E1E1E; color: #FFFFFF; }
.button:not(.gold):not(.outline):hover { background: #373737; color: #FFFFFF; }
.card, .article-aside, .contact-panel, .step,
.callout, .cta-band, .form-message {
    box-shadow: var(--shadow-soft);
    border: 1px solid #E0E0E0;
}
.card:hover { box-shadow: var(--shadow-card); }
.card h2, .card h3, .step h3,
.article-aside h2, .contact-panel h2 { color: #161616; }
.card p, .step p, .cta-band p { color: #373737; }
.hero-visual, .article-body figure img {
    box-shadow: 0 20px 48px rgba(0, 0, 0, .12);
}
.field input, .field select, .field textarea, .search-field {
    color: #171717; background: #FFFFFF; border: 1px solid #A9A9A9;
}
.field input::placeholder, .field textarea::placeholder { color: #585858; }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible {
    outline: 3px solid #9B7312; outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}
