﻿/* ============================================================
   tema restyle — calmer BR SEO · prefix sp-
   Carregar por último após ./br-res/
   ============================================================ */

:root {
  --layout-max: 100%;
  --site-header-height: 0px;
  --site-header-open: 0px;
  --site-header-closed: 0px;
  --site-header-gap: 0px;
  --nav-pad-x: 14px;
  --sp-bg: #ffffff;
  --sp-bg-wide: #f3f4f6;
  --sp-surface: #ffffff;
  --sp-card: #ffffff;
  --sp-accent: #e07a5f;
  --sp-accent-deep: #c45d44;
  --sp-text: #1f2937;
  --sp-muted: #6b7280;
  --sp-edge: rgba(224,122,95,0.2);
  --sp-header: #2d3436;
  --sp-header-2: #1e2426;
  --sp-radius: 16px;
  --sp-shadow: 0 4px 20px rgba(31,41,55,0.08);
  --brand-ink: var(--sp-text);
  --canvas-bg: var(--sp-bg);
  --canvas-bg-wide: var(--sp-bg-wide);
  --nav-top-bg: var(--sp-header);
  --nav-main-bg: var(--sp-header);
  --site-accent: var(--sp-accent);
  --site-link: var(--sp-accent);
  --site-link-hover: var(--sp-accent-deep);
  --site-muted-text: var(--sp-muted);
  --ip-ink: var(--sp-text);
  --ip-muted: var(--sp-muted);
  --ip-surface: var(--sp-card);
  --ip-accent: var(--sp-accent);
  --ip-gold: var(--sp-accent);
  --ip-green: var(--sp-accent);
  --ip-blue: var(--sp-accent);
  --ip-radius: var(--sp-radius);
  --ip-edge: var(--sp-edge);
}

@media (min-width: 768px) {
  :root { --layout-max: min(100vw, calc(100vh * 750 / 1334)); }
}

html, body {
  background: var(--sp-bg-wide) !important;
  color: var(--sp-text) !important;
  font-family: "Source Sans 3","Nunito Sans","Segoe UI",sans-serif !important;
  -webkit-font-smoothing: antialiased;
}
body, body.app-banner-closed, body.bottom-action-bar-closed {
  padding-top: 0 !important;
  padding-bottom: 1.25rem !important;
}
body::before {
  background: var(--sp-bg) !important;
  box-shadow: none !important;
  border-left: 1px solid var(--sp-edge);
  border-right: 1px solid var(--sp-edge);
}
@media (min-width: 451px) {
  body::before {
    box-shadow: 0 0 0 1px var(--sp-edge), 0 16px 48px rgba(0,0,0,.1) !important;
  }
}
h1,h2,h3,h4,strong { color: var(--sp-text) !important; }
h1 {
  font-size: clamp(1.28rem, 4.8vw, 1.65rem) !important;
  font-weight: 700 !important;
  letter-spacing: -.02em;
  line-height: 1.25 !important;
}
a { color: var(--sp-accent); }
a:hover { color: var(--sp-accent-deep); }

.bottom-action-bar, [data-bottom-action-bar] {
  display: none !important; visibility: hidden !important;
  height: 0 !important; pointer-events: none !important;
}

.sp-header.site-header, .site-header {
  position: sticky !important; top: 0 !important;
  left: auto !important; right: auto !important; transform: none !important;
  width: min(100%, var(--layout-max)) !important;
  margin-left: auto !important; margin-right: auto !important;
  background: var(--sp-header) !important;
  border-bottom: none !important;
  box-shadow: 0 1px 10px rgba(0,0,0,.08) !important;
  z-index: 120;
}
.sp-gift.app-install-bar, .app-install-bar {
  background: var(--sp-header-2) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  padding: 10px var(--nav-pad-x) !important; gap: 10px !important;
}
.app-install-bar__title {
  color: rgba(255,255,255,.7) !important; font-size: .68rem !important;
  letter-spacing: .06em !important; text-transform: uppercase !important;
}
.app-install-bar__amount {
  color: #fff !important; font-weight: 700 !important; font-size: 1.05rem !important;
}
.app-install-bar__button {
  background: var(--sp-accent) !important; color: #fff !important;
  border-radius: 10px !important; font-weight: 700 !important;
  padding: 8px 16px !important; border: none !important;
}
.app-install-bar__close { color: rgba(255,255,255,.65) !important; }
.sp-nav.site-nav, .site-nav {
  background: var(--sp-header) !important;
  padding: 10px var(--nav-pad-x) !important; border: none !important;
}
.site-nav__toggle { color: #fff !important; }
.site-nav__cta--login {
  background: transparent !important; color: #fff !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  border-radius: 10px !important; font-weight: 600 !important;
}
.site-nav__cta--register {
  background: var(--sp-accent) !important; color: #fff !important;
  border: none !important; border-radius: 10px !important; font-weight: 700 !important;
}
.site-nav__badge {
  background: #fff !important; color: #e07a5f !important;
  border-radius: 8px !important; font-weight: 700 !important; font-size: .65rem !important;
}
.sp-menu.site-menu, .site-menu {
  background: #1e2426 !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
}
.site-menu a {
  color: #f2f2f2 !important; border-radius: 10px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.05) !important;
  margin: 4px 10px !important; text-align: center; font-weight: 600;
}
.site-menu a[aria-current="page"] {
  border-color: var(--sp-accent) !important; color: #fff !important;
  background: color-mix(in srgb, var(--sp-accent) 28%, transparent) !important;
}

.nt-breadcrumb {
  width: min(100%, var(--layout-max)); margin: 0 auto;
  padding: .65rem var(--nav-pad-x); box-sizing: border-box;
  font-size: .78rem; color: var(--sp-muted);
}
.nt-breadcrumb a { color: var(--sp-accent); text-decoration: none; font-weight: 600; }
.nt-breadcrumb ol { display:flex; gap:.35rem; list-style:none; margin:0; padding:0; flex-wrap:wrap; }
.nt-breadcrumb li:not(:last-child)::after { content:"/"; margin-left:.35rem; color: var(--sp-muted); }

.container, .download-hero, main, .page-main, .ip-wrap, .py-4 {
  width: min(100%, var(--layout-max)) !important;
  margin-left: auto !important; margin-right: auto !important;
  box-sizing: border-box; padding-left: var(--nav-pad-x); padding-right: var(--nav-pad-x);
}
.btn-success, .btn.btn-success, a.btn-success, .btn-lg.btn-success {
  background: var(--sp-accent) !important; border-color: var(--sp-accent) !important;
  color: #fff !important; font-weight: 700 !important;
  border-radius: 12px !important;
}
.btn-success:hover { background: var(--sp-accent-deep) !important; color:#fff !important; }
.app-spec-table { width:100%; border-collapse:collapse; font-size:.88rem; }
.app-spec-table th, .app-spec-table td {
  padding:.55rem .4rem; border-bottom:1px solid var(--sp-edge); text-align:left;
}
.app-spec-table th { color: var(--sp-muted); font-weight:600; width:38%; }
.app-spec-table td { color: var(--sp-text); }
.themed-link { color: var(--sp-accent) !important; font-weight:600; }
.sp-age, .as-age {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:28px; height:22px; padding:0 6px;
  border:1.5px solid var(--sp-muted); border-radius:6px;
  font-size:.7rem; font-weight:700; color: var(--sp-muted); margin-right:.35rem;
}
.nt-footer-note {
  width: min(100%, var(--layout-max)); margin: 0 auto;
  padding: .85rem var(--nav-pad-x) 1.5rem; box-sizing: border-box;
  font-size: .72rem; color: var(--sp-muted); line-height: 1.45;
}
form input, form textarea, form select {
  border: 1px solid var(--sp-edge) !important;
  border-radius: var(--sp-radius) !important;
  background: var(--sp-card) !important; color: var(--sp-text) !important;
}

/* —— Layout 12: navy app band + overlapping logo card —— */
.sp-app-band {
  width: min(100%, var(--layout-max)); margin: 0 auto;
  background: #1a2744; color: #fff;
  display: flex; align-items: flex-start; gap: .85rem;
  padding: 1.15rem var(--nav-pad-x) 2.4rem; box-sizing: border-box;
}
.sp-app-band__icon {
  width: 56px; height: 56px; border-radius: 14px; object-fit: cover;
  border: 2px solid rgba(255,255,255,.2); flex-shrink: 0;
}
.sp-app-band__copy { flex: 1; min-width: 0; }
.sp-app-band h1 {
  margin: 0 0 .4rem !important; color: #fff !important;
  font-size: clamp(1.05rem, 4vw, 1.35rem) !important; text-align: left;
}
.sp-stars { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .55rem; }
.sp-stars__glyphs { color: #f5c542; letter-spacing: .05em; font-size: 1rem; }
.sp-stars__score { color: rgba(255,255,255,.75); font-size: .78rem; }
.sp-logo-wrap {
  width: min(100%, var(--layout-max)); margin: -1.6rem auto 0;
  padding: 0 var(--nav-pad-x); box-sizing: border-box; position: relative; z-index: 2;
}
.sp-logo-card {
  background: #fff; border: 1px solid #e5e7eb; border-radius: 18px;
  padding: 1rem; margin: 0 auto; box-shadow: 0 12px 32px rgba(26,39,68,.18); max-width: 100%;
}
.sp-logo-hero {
  display: block; width: 100%; max-width: min(100%, var(--layout-max, 420px)); height: auto;
  margin: 0 auto; object-fit: contain; border-radius: 12px;
}
.sp-features {
  display: grid; grid-template-columns: 1fr 1fr; gap: .55rem;
  width: min(100%, var(--layout-max)); margin: 0 auto; padding: 1rem var(--nav-pad-x) .75rem;
  box-sizing: border-box;
}
.sp-feature {
  background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: .7rem .6rem; text-align: left;
}
.sp-feature--wide { grid-column: 1 / -1; }
.sp-feature strong { display:block; color: var(--sp-accent); font-size: .95rem; }
.sp-feature span { font-size: .74rem; color: var(--sp-muted); }
.sp-cta-full {
  display: block; width: min(100%, var(--layout-max)); margin: 0 auto .9rem;
  box-sizing: border-box; padding: .95rem var(--nav-pad-x); text-align: center;
  background: var(--sp-accent) !important; color: #fff !important;
  text-decoration: none !important; font-weight: 800; font-size: 1.05rem;
  border-radius: 0;
}
.sp-shots {
  display: grid; grid-template-columns: 1fr 1fr; gap: .55rem;
  width: min(100%, var(--layout-max)); margin: 0 auto; padding: 0 var(--nav-pad-x) 1rem;
  box-sizing: border-box;
}
.sp-shot { margin: 0; }
.sp-shot img { width:100%; height:auto; display:block; border-radius: 12px; border:1px solid #e5e7eb; }
.sp-shot figcaption { font-size:.7rem; color:var(--sp-muted); text-align:center; padding:.3rem 0 0; }
.sp-shell { width:min(100%,var(--layout-max)); margin:0 auto; padding:0 var(--nav-pad-x) 1.5rem; box-sizing:border-box; }
.sp-contact {
  background:#fff; border:2px solid #1a2744; border-radius:10px; padding:1rem;
  font-size:.88rem; color:var(--sp-muted); line-height:1.55;
}
.sp-contact h2 { color:var(--sp-text) !important; margin:0 0 .6rem; font-size:1.05rem; }
.sp-contact strong { color:var(--sp-text) !important; }

/* Footer 12: 2-column grid */
.sp-footer.site-footer, .site-footer {
  background: var(--sp-header-2) !important; color: rgba(255,255,255,.72) !important;
  width:min(100%,var(--layout-max))!important; margin:0 auto!important;
  padding:1.1rem var(--nav-pad-x) 1.3rem!important; box-sizing:border-box;
  border-top:1px solid var(--sp-edge)!important;
}
.site-footer__nav {
  display:grid!important; grid-template-columns:1fr 1fr!important; gap:1rem .85rem!important;
}
.site-footer__group:last-child { grid-column: 1 / -1; }
.site-footer__group-label {
  display:block!important; font-size:.68rem; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; color: rgba(255,255,255,.55); margin-bottom:.35rem;
}
.site-footer__list { list-style:none!important; margin:0!important; padding:0!important; }
.site-footer__list li { margin:.2rem 0; }
.site-footer a {
  color: rgba(255,255,255,.88)!important; text-decoration:none!important;
  font-size:.8rem!important; font-weight:500!important;
}
.site-footer a:hover { color: var(--sp-accent)!important; }
.site-footer__meta {
  color: rgba(255,255,255,.5)!important; font-size:.68rem!important; margin-top:.85rem;
  padding-top:.7rem; border-top:1px solid rgba(255,255,255,.1); line-height:1.45;
}
.site-footer__meta strong { color: #fff!important; }


/* —— Extra phone-shell & inner-page polish —— */
img { max-width: 100%; height: auto; }
.hero-lead, .hero-cta-wrap { max-width: 100%; }
.hero-banner img, .img-fluid { border-radius: 12px; width: 100%; height: auto; display: block; }
.rounded-5 { border-radius: var(--ip-radius) !important; }
.py-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.row { display: block; }
.col-12 { width: 100%; }
.card, .content-card, .info-box, .nt-card { background: var(--ip-surface); }
h1 + .hero-lead { margin-top: 0.5rem; }
.hero-cta-wrap { margin: 0.85rem 0 1rem; }
.hero-cta-wrap .btn { display: inline-block; padding: 0.85rem 1.25rem; text-decoration: none !important; }
ol.steps, ul.feature-list, .checklist { padding-left: 1.1rem; color: var(--ip-muted); line-height: 1.55; font-size: 0.9rem; }
ol.steps li, ul.feature-list li { margin: 0.35rem 0; }
table { width: 100%; border-collapse: collapse; font-size: 0.88rem; margin: 0.75rem 0; }
table th, table td { padding: 0.5rem 0.4rem; border-bottom: 1px solid var(--ip-edge); text-align: left; vertical-align: top; }
table th { color: var(--ip-muted); font-weight: 600; }
form { background: var(--ip-surface); border: 1px solid var(--ip-edge); border-radius: var(--ip-radius); padding: 1rem; margin: 0.75rem 0 1.25rem; }
form label { display: block; font-size: 0.82rem; font-weight: 600; margin: 0.55rem 0 0.25rem; color: var(--ip-ink); }
form input[type="text"], form input[type="email"], form input[type="password"], form input[type="tel"], form input[type="number"], form input[type="search"], form textarea, form select {
  width: 100%; box-sizing: border-box; padding: 0.65rem 0.75rem; font-size: 0.95rem;
}
form button[type="submit"], form .btn, form input[type="submit"] {
  margin-top: 0.85rem; width: 100%; padding: 0.85rem; font-weight: 700; border: none; cursor: pointer;
  background: var(--ip-accent) !important; color: #fff !important; border-radius: var(--ip-radius) !important;
}
.faq-item, .accordion-item, details.faq { border-bottom: 1px solid var(--ip-edge); padding: 0.75rem 0; }
.faq-item h3, .accordion-item h3 { font-size: 0.95rem; margin: 0 0 0.35rem; }
.faq-item p, .accordion-item p { font-size: 0.86rem; color: var(--ip-muted); line-height: 1.5; margin: 0; }
.legal-doc h2 { font-size: 1.05rem; margin: 1.25rem 0 0.5rem; padding-bottom: 0.25rem; border-bottom: 1px solid var(--ip-edge); }
.legal-doc p, .legal-doc li { font-size: 0.88rem; color: var(--ip-muted); line-height: 1.55; }
.legal-toc { background: var(--ip-surface); border: 1px solid var(--ip-edge); border-radius: var(--ip-radius); padding: 0.85rem 1rem; margin: 0.75rem 0 1.25rem; }
.legal-toc a { font-size: 0.84rem; }
.promo-full, .shot-full { display: block; width: 100%; margin: 0.75rem 0; }
.promo-full img, .shot-full img { width: 100%; height: auto; display: block; }
hr { border: 0; border-top: 1px solid var(--ip-edge); margin: 1.25rem 0; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid var(--ip-accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
.text-muted { color: var(--ip-muted) !important; }
.text-center { text-align: center; }
.fw-bold { font-weight: 700; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 1rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 1rem; }
.p-2 { padding: 0.5rem; }
.p-3 { padding: 1rem; }
body[style] { padding-top: 0 !important; }
.floating-cta, .sticky-download-bar, .app-bottom-bar { display: none !important; }
main p, .container p, .download-hero p { line-height: 1.55; }
main h2, .container h2 { margin-top: 1.35rem; margin-bottom: 0.55rem; }
.badge-pill, .chip {
  display: inline-block; padding: 0.2rem 0.55rem; border-radius: 8px;
  font-size: 0.72rem; font-weight: 700;
  background: color-mix(in srgb, var(--ip-accent) 14%, transparent); color: var(--ip-accent);
}
.site-nav__logo img { max-height: 40px; width: auto; object-fit: contain; }
.app-install-bar__icon { border-radius: 10px; object-fit: cover; }