/* ============================================================================
   MGP ALUGUEL, FOLHA DE ESTILO PRINCIPAL (arquivo unico, sem @import)
   Para trocar as cores da marca, edite a secao "VARIAVEIS DE MARCA" logo abaixo.
   ========================================================================== */

/* ============================================================================
   VARIÁVEIS DE MARCA MGP — edite as cores aqui e o site todo muda junto
   ========================================================================== */
:root {
  /* Cores da marca */
  --primary:        #1C3553;
  --primary-light:  #2A4E72;
  --primary-dark:   #122338;
  --accent:         #C8A96E;   /* dourado MGP */
  --accent-light:   #E8D5A3;
  --accent-dark:    #A88748;

  /* UI */
  --bg:             #F8F6F2;
  --bg-section:     #FFFFFF;
  --bg-dark:        #0F1F30;
  --text:           #1A1A1A;
  --text-medium:    #555555;
  --text-light:     #8A8A8A;
  --white:          #FFFFFF;
  --border:         #E9E5DC;
  --border-dark:    #D8D2C5;

  /* Ações */
  --cta:            #E63946;
  --cta-hover:      #C62333;
  --whatsapp:       #25D366;
  --whatsapp-hover: #1FAD54;
  --success:        #27AE60;
  --info:           #2A7DE1;

  /* Sombras */
  --shadow-xs: 0 1px 3px rgba(18,35,56,.06);
  --shadow-sm: 0 2px 10px rgba(18,35,56,.07);
  --shadow-md: 0 6px 24px rgba(18,35,56,.10);
  --shadow-lg: 0 14px 44px rgba(18,35,56,.14);
  --shadow-xl: 0 24px 70px rgba(18,35,56,.20);
  --shadow-accent: 0 12px 34px rgba(200,169,110,.35);

  /* Raios */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --radius-full: 9999px;

  /* Tipografia */
  --font-display: 'Poppins', 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-body: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, sans-serif;

  /* Layout */
  --container: 1240px;
  --section-py: 104px;
  --section-px: clamp(18px, 5vw, 80px);

  /* Transições */
  --t-fast: .18s ease;
  --t: .32s cubic-bezier(.4,0,.2,1);
  --t-slow: .6s cubic-bezier(.22,.61,.36,1);

  /* Gradientes por tipo de imóvel (cartão automático sem foto) */
  --grad-studio:      linear-gradient(135deg,#1C3553,#2A4E72 55%,#3A6692);
  --grad-apartamento: linear-gradient(135deg,#16304d,#244a6e 60%,#356088);
  --grad-duplex:      linear-gradient(135deg,#2A4E72,#1C3553 60%,#0F1F30);
  --grad-sobrado:     linear-gradient(135deg,#122338,#1C3553 55%,#A88748);
}

@media (max-width: 768px) {
  :root { --section-py: 68px; }
}

/* ============================================================================
   RESET — base consistente entre navegadores
   ========================================================================== */
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scrollbar-gutter: stable; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}
body {
  font-family: var(--font-body);
  color: var(--text);
  background: var(--bg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img,svg,video { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input,select,textarea { font: inherit; color: inherit; }
ul,ol { list-style: none; }
h1,h2,h3,h4 { font-family: var(--font-display); font-weight: 600; line-height: 1.12; letter-spacing: -.01em; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
::selection { background: var(--accent); color: var(--primary-dark); }

.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--section-px); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
[hidden] { display: none !important; }

/* ============================================================================
   ANIMAÇÕES — reveal on scroll, flutuação, contadores, brilhos
   ========================================================================== */

/* Reveal ao rolar (ativado por JS adicionando .is-visible) */
.reveal { opacity: 0; transform: translateY(34px); transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal[data-delay="1"]{ transition-delay:.08s } .reveal[data-delay="2"]{ transition-delay:.16s }
.reveal[data-delay="3"]{ transition-delay:.24s } .reveal[data-delay="4"]{ transition-delay:.32s }
.reveal[data-delay="5"]{ transition-delay:.40s } .reveal[data-delay="6"]{ transition-delay:.48s }

@keyframes float-y { 0%,100%{ transform: translateY(0) } 50%{ transform: translateY(-18px) } }
@keyframes float-y-slow { 0%,100%{ transform: translateY(0) } 50%{ transform: translateY(-26px) } }
@keyframes float-soft { 0%,100%{ transform: translateY(0) } 50%{ transform: translateY(-9px) } }
@keyframes spin-slow { to { transform: rotate(360deg) } }
@keyframes pulse-ring { 0%{ box-shadow:0 0 0 0 rgba(37,211,102,.5) } 70%{ box-shadow:0 0 0 18px rgba(37,211,102,0) } 100%{ box-shadow:0 0 0 0 rgba(37,211,102,0) } }
@keyframes shimmer { 0%{ background-position:-200% 0 } 100%{ background-position:200% 0 } }
@keyframes fade-up { from{ opacity:0; transform:translateY(20px) } to{ opacity:1; transform:none } }
@keyframes scale-in { from{ opacity:0; transform:scale(.94) } to{ opacity:1; transform:none } }
@keyframes gradient-pan { 0%{ background-position:0% 50% } 50%{ background-position:100% 50% } 100%{ background-position:0% 50% } }
@keyframes badge-pop { 0%{ transform:scale(.6); opacity:0 } 60%{ transform:scale(1.08) } 100%{ transform:scale(1); opacity:1 } }
@keyframes bob { 0%,100%{ transform:translateY(0) rotate(0) } 50%{ transform:translateY(-6px) rotate(-3deg) } }

.float { animation: float-y 6s ease-in-out infinite; }
.float-slow { animation: float-y-slow 8s ease-in-out infinite; }

/* esqueleto de carregamento */
.skeleton { background: linear-gradient(90deg,#eee 25%,#f5f5f5 37%,#eee 63%); background-size: 200% 100%; animation: shimmer 1.4s infinite; }

/* ------------------------------------------------------------------ HELPERS */
.section { padding-block: var(--section-py); }
.section--tint { background: var(--bg); }
.section--dark { background: var(--bg-dark); color: #EAF0F6; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--accent-dark); margin-bottom: 16px;
}
.eyebrow::before { content:''; width: 26px; height: 2px; background: var(--accent); display:inline-block; }
.section--dark .eyebrow { color: var(--accent-light); }
.section-head { max-width: 720px; margin-bottom: 56px; }
.section-head--center { margin-inline: auto; text-align: center; }
.section-title { font-size: clamp(1.9rem, 4vw, 3rem); color: var(--primary); }
.section--dark .section-title { color: #fff; }
.section-sub { margin-top: 16px; font-size: 1.08rem; color: var(--text-medium); }
.section--dark .section-sub { color: #B9C6D4; }
.text-accent { color: var(--accent-dark); }
.section--dark .text-accent { color: var(--accent-light); }

/* botões */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding: 15px 28px; border-radius: var(--radius-full); font-weight: 700; font-size: .98rem;
  transition: transform var(--t-fast), box-shadow var(--t), background var(--t); white-space: nowrap; }
.btn svg { width: 20px; height: 20px; flex: none; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--wa { background: var(--whatsapp); color:#fff; box-shadow: 0 8px 22px rgba(37,211,102,.32); }
.btn--wa:hover { background: var(--whatsapp-hover); box-shadow: 0 12px 30px rgba(37,211,102,.42); }
.btn--primary { background: var(--primary); color:#fff; box-shadow: var(--shadow-md); }
.btn--primary:hover { background: var(--primary-light); }
.btn--accent { background: var(--accent); color: var(--primary-dark); box-shadow: var(--shadow-accent); }
.btn--accent:hover { background: var(--accent-light); }
.btn--ghost { background: transparent; border: 1.5px solid var(--border-dark); color: var(--primary); }
.btn--ghost:hover { border-color: var(--primary); background: var(--primary); color:#fff; }
.btn--light { background: #fff; color: var(--primary); box-shadow: var(--shadow-sm); }
.btn--block { width: 100%; }
.btn--lg { padding: 18px 36px; font-size: 1.05rem; }

/* =================================================================== HEADER */
.header { position: fixed; inset: 0 0 auto 0; z-index: 1100; transition: background var(--t), box-shadow var(--t), padding var(--t); padding-block: 18px; }
.header__inner { display:flex; align-items:center; justify-content:space-between; gap: 24px; }
.header__logo { display:inline-flex; align-items:center; }
.header__logo img { height: 38px; width:auto; transition: var(--t); }
.header.is-scrolled .header__logo img { filter: brightness(0); } /* fallback */
@supports ((-webkit-mask: url('')) or (mask: url(''))) {
  .header.is-scrolled .header__logo { -webkit-mask: url('../logo/logo-branco.png') no-repeat left center; -webkit-mask-size: auto 38px; mask: url('../logo/logo-branco.png') no-repeat left center; mask-size: auto 38px; background: var(--primary); }
  .header.is-scrolled .header__logo img { visibility: hidden; }
}
.header.is-scrolled { background: rgba(255,255,255,.96); box-shadow: var(--shadow-sm); padding-block: 11px; }
.header__nav { display:flex; align-items:center; gap: 30px; }
.header__link { font-weight: 600; font-size: .96rem; color: #fff; opacity: .92; position: relative; transition: var(--t-fast); }
.header__link::after { content:''; position:absolute; left:0; bottom:-6px; width:0; height:2px; background: var(--accent); transition: width var(--t); }
.header__link:hover { opacity:1; } .header__link:hover::after { width:100%; }
.header.is-scrolled .header__link { color: var(--primary); }
.header__actions { display:flex; align-items:center; gap: 14px; }
.header__cta { padding: 11px 22px; font-size: .92rem; }
.header__burger { display:none; flex-direction:column; gap:5px; padding:8px; }
.header__burger span { width: 26px; height: 2.5px; background:#fff; border-radius:2px; transform-origin:center; transition: transform var(--t), opacity var(--t-fast), background var(--t); }
.header.is-scrolled .header__burger span { background: var(--primary); }
/* sanduíche vira X ao abrir */
.header__burger.is-active span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.header__burger.is-active span:nth-child(2) { opacity:0; transform: scaleX(.2); }
.header__burger.is-active span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

/* com o menu aberto, o cabeçalho fica transparente e claro (X sobre fundo escuro) */
body.menu-open .header { background: transparent; box-shadow: none; }
body.menu-open .header__burger span { background:#fff; }
body.menu-open .header__logo img { filter: none; visibility: visible; }
body.menu-open .header.is-scrolled .header__logo { -webkit-mask: none; mask: none; background: transparent; }
body.menu-open .btn-auth { color:#fff; border-color: rgba(255,255,255,.4); }

/* menu mobile (moderno) */
.mobile-menu { position: fixed; inset: 0; z-index: 1090; display:flex; flex-direction:column; justify-content:center; align-items:center; gap: 4px; padding: 96px 24px 44px;
  background: radial-gradient(900px 520px at 82% 0%, rgba(200,169,110,.16), transparent 60%), linear-gradient(160deg, #0F1F30 0%, #16304d 58%, #1C3553 100%);
  opacity:0; visibility:hidden; transition: opacity var(--t), visibility var(--t); }
.mobile-menu.is-open { opacity:1; visibility:visible; }
.mobile-menu a { position:relative; color:#EAF0F6; font-family: var(--font-display); font-weight:600; font-size: 1.5rem; padding: 11px 8px; opacity:0; transform: translateY(14px); transition: opacity var(--t-slow), transform var(--t-slow), color var(--t-fast); }
.mobile-menu a:hover, .mobile-menu a:active { color: var(--accent); }
.mobile-menu.is-open a { opacity:1; transform:none; }
.mobile-menu.is-open a:nth-child(1){ transition-delay:.06s } .mobile-menu.is-open a:nth-child(2){ transition-delay:.11s }
.mobile-menu.is-open a:nth-child(3){ transition-delay:.16s } .mobile-menu.is-open a:nth-child(4){ transition-delay:.21s }
.mobile-menu.is-open a:nth-child(5){ transition-delay:.26s } .mobile-menu.is-open a:nth-child(6){ transition-delay:.31s }
.mobile-menu.is-open a:nth-child(7){ transition-delay:.36s }
.mobile-menu__close { display:none; }

/* ===================================================================== HERO */
.hero { position: relative; min-height: auto; display:flex; align-items:center; overflow:hidden; background: var(--primary-dark); padding-top: 124px; padding-bottom: 72px; }
.hero__bg { position:absolute; inset:0; z-index:0; background:
  radial-gradient(1100px 600px at 78% 12%, rgba(200,169,110,.20), transparent 60%),
  radial-gradient(900px 700px at 10% 90%, rgba(42,78,114,.55), transparent 60%),
  linear-gradient(160deg, #0F1F30 0%, #142a44 55%, #1C3553 100%); }
.hero__grid-overlay { position:absolute; inset:0; z-index:0; opacity:.5;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 54px 54px; mask-image: radial-gradient(ellipse at center, #000 30%, transparent 78%); }
.hero__inner { position: relative; z-index: 2; display:grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items:center; width:100%; }
.hero__badge { display:inline-block; max-width:100%; background: rgba(255,255,255,.08); border:1px solid rgba(200,169,110,.4); color: var(--accent-light); padding: 9px 18px; border-radius: 18px; font-size:.82rem; font-weight:600; line-height:1.55; backdrop-filter: blur(8px); margin-bottom: 24px; }
.hero__badge strong { color:#fff; font-weight:800; }
.hero__badge .dot { position:relative; display:inline-block; vertical-align:middle; width:8px; height:8px; margin-right:8px; border-radius:50%; background: var(--whatsapp); }
.hero__badge .dot::after { content:''; position:absolute; inset:0; border-radius:50%; background: var(--whatsapp); animation: fab-pulse 2.4s ease-out infinite; }
.hero__title { font-size: clamp(2.4rem, 5.4vw, 4.3rem); color:#fff; line-height: 1.05; }
.hero__title em { font-style: normal; color: var(--accent); position: relative; white-space: nowrap; }
.hero__title em::after { content:''; position:absolute; left:0; right:0; bottom: .06em; height:.14em; background: rgba(200,169,110,.3); border-radius:4px; z-index:-1; }
.hero__sub { margin-top: 22px; font-size: 1.16rem; color:#C7D3E0; max-width: 540px; }
.hero__cta-row { margin-top: 34px; display:flex; flex-wrap:wrap; gap: 14px; }
.hero__stats { margin-top: 40px; display:flex; flex-wrap:wrap; gap: 16px 32px; }
.hero__stat { position:relative; }
.hero__stat:not(:last-child)::after { content:''; position:absolute; right:-16px; top:3px; bottom:5px; width:1px; background: rgba(255,255,255,.16); }
.hero__stat .num { font-family: var(--font-display); font-size: 2rem; color:#fff; line-height:1; letter-spacing:-.01em; }
.hero__stat .num span { color: var(--accent); }
.hero__stat .lbl { font-size: .8rem; color:#9FB0C2; margin-top:8px; max-width:150px; line-height:1.35; }

/* composição 3D de cards flutuantes no hero */
.hero__visual { position: relative; height: 480px; perspective: 1400px; }
.hero__deck { position:absolute; inset:0; transform-style: preserve-3d; transform: rotateX(8deg) rotateY(-14deg); }
.fcard { position:absolute; border-radius: var(--radius-lg); padding: 20px; color:#fff; box-shadow: var(--shadow-xl); border:1px solid rgba(255,255,255,.12); }
.fcard--1 { width: 270px; top: 40px; left: 30px; background: linear-gradient(135deg,#244a6e,#1C3553); animation: float-y 7s ease-in-out infinite; }
.fcard--2 { width: 230px; top: 210px; left: 200px; background: linear-gradient(135deg, #C8A96E, #A88748); color: var(--primary-dark); animation: float-y-slow 9s ease-in-out infinite; z-index:3; }
.fcard--3 { width: 180px; top: 0; left: 250px; background: rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); animation: float-y 8s ease-in-out infinite .4s; }
.fcard__tag { display:flex; align-items:center; gap:5px; font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; opacity:.92; }
.fcard__tag svg { width:14px; height:14px; flex:none; }
.fcard__price { font-family: var(--font-display); font-size: 1.7rem; margin-top: 8px; }
.fcard__meta { display:flex; gap:14px; margin-top: 12px; font-size:.78rem; opacity:.9; }
.fcard__bar { height: 8px; border-radius: 6px; background: rgba(255,255,255,.25); margin-top: 14px; overflow:hidden; }
.fcard__bar i { display:block; height:100%; width: 70%; background:#fff; border-radius:6px; }
.hero__scroll { position:absolute; bottom: 26px; left:50%; transform:translateX(-50%); z-index:2; color:#9FB0C2; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; display:flex; flex-direction:column; align-items:center; gap:8px; }
.hero__scroll i { width: 22px; height: 36px; border:2px solid rgba(255,255,255,.3); border-radius: 12px; position:relative; }
.hero__scroll i::after { content:''; position:absolute; top:7px; left:50%; transform:translateX(-50%); width:4px; height:7px; background: var(--accent); border-radius:3px; animation: float-y 1.6s infinite; }

/* faixa de confiança (logos / selos) */
.trustbar { background: var(--bg-section); border-bottom:1px solid var(--border); }
.trustbar__inner { display:flex; flex-wrap:nowrap; align-items:center; justify-content:center; gap: 36px; padding-block: 20px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.trustbar__inner::-webkit-scrollbar { display:none; }
.trustbar__item { display:flex; align-items:center; gap:9px; color: var(--text-medium); font-size:.9rem; font-weight:600; white-space:nowrap; flex:none; }
.trustbar__item svg { width:20px; height:20px; color: var(--accent-dark); flex:none; }

/* ============================================================== FILTRO/BUSCA */
.catalog { background: var(--bg); }
.filterbar { position: relative; background: var(--bg); border:1px solid var(--border); border-radius: var(--radius-lg); padding: 16px; box-shadow: var(--shadow-sm); margin-bottom: 28px; }
.filterbar__row { display:grid; grid-template-columns: 1.4fr repeat(4, 1fr) auto; gap: 12px; align-items:center; }
.field { position:relative; }
.field svg { position:absolute; left:14px; top:50%; transform:translateY(-50%); width:18px; height:18px; color: var(--text-light); pointer-events:none; }
.field input, .field select { width:100%; padding: 13px 14px 13px 42px; border:1.5px solid var(--border-dark); border-radius: var(--radius-md); background:#fff; font-size:.92rem; transition: var(--t-fast); appearance:none; }
.field select { cursor:pointer; }
.field input:focus, .field select:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(200,169,110,.18); outline:none; }
.field--select::after { content:''; position:absolute; right:16px; top:50%; width:8px; height:8px; border-right:2px solid var(--text-light); border-bottom:2px solid var(--text-light); transform:translateY(-65%) rotate(45deg); pointer-events:none; }
.filterbar__reset { padding: 13px 18px; border-radius: var(--radius-md); border:1.5px solid var(--border-dark); color: var(--text-medium); font-weight:600; font-size:.88rem; transition: var(--t-fast); white-space:nowrap; }
.filterbar__reset:hover { border-color: var(--cta); color: var(--cta); }

.catalog__toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; margin-bottom: 26px; }
.catalog__count { display:inline-flex; align-items:center; gap:9px; font-size:.96rem; color: var(--text-medium); background:#fff; border:1px solid var(--border); border-radius: var(--radius-full); padding:9px 18px; box-shadow: var(--shadow-xs); }
.catalog__count svg { width:18px; height:18px; color: var(--accent-dark); flex:none; }
.catalog__count b { color: var(--primary); font-size:1.1rem; font-weight:800; }
.catalog__tools { display:flex; align-items:center; gap: 10px; }
.chip-toggle { display:inline-flex; align-items:center; gap:8px; padding: 9px 16px; border-radius: var(--radius-full); border:1.5px solid var(--border-dark); font-size:.86rem; font-weight:600; color: var(--text-medium); transition: var(--t-fast); }
.chip-toggle svg { width:16px; height:16px; }
.chip-toggle.is-active { background: var(--primary); border-color: var(--primary); color:#fff; }
.chip-toggle--fav.is-active { background: var(--cta); border-color: var(--cta); }
.sortselect { position:relative; }
.sortselect select { padding: 9px 38px 9px 16px; border-radius: var(--radius-full); border:1.5px solid var(--border-dark); background:#fff; font-size:.86rem; font-weight:600; appearance:none; cursor:pointer; }

/* chips rápidos (atalhos de filtro) */
.quickchips { display:flex; flex-wrap:wrap; gap:10px; margin-bottom: 24px; }
.quickchip { padding: 9px 18px; border-radius: var(--radius-full); background:#fff; border:1.5px solid var(--border); font-size:.88rem; font-weight:600; color: var(--text-medium); transition: var(--t-fast); }
.quickchip:hover { border-color: var(--accent); color: var(--primary); transform: translateY(-2px); }
.quickchip.is-active { background: var(--primary); color:#fff; border-color: var(--primary); }

/* ================================================================== GRID/CARD */
.grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.grid.is-list { grid-template-columns: 1fr; }

.card { position: relative; background:#fff; border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-sm); border:1px solid var(--border); transition: box-shadow var(--t), transform var(--t); display:flex; flex-direction:column; cursor: pointer; }
.card:hover { box-shadow: var(--shadow-lg); }
.card__media { position: relative; aspect-ratio: 16/11; overflow:hidden; }
.card__media img { width:100%; height:100%; object-fit:cover; transition: transform var(--t-slow); }
.card:hover .card__media img { transform: scale(1.06); }

/* cartão arquitetônico automático (quando não há foto) */
.card__art { position:absolute; inset:0; display:flex; align-items:flex-end; }
.card__art-pattern { position:absolute; inset:0; opacity:.16;
  background-image: linear-gradient(rgba(255,255,255,.5) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.5) 1px, transparent 1px);
  background-size: 26px 26px; }
.card__art-icon { position:absolute; top:50%; left:50%; transform:translate(-50%,-58%); width: 92px; height:92px; color: rgba(255,255,255,.9); }
.card__art-area { position: relative; z-index:2; padding: 14px 18px; color:#fff; font-family: var(--font-display); font-size: 1.5rem; }
.card__art-area small { display:block; font-family: var(--font-body); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; opacity:.8; font-weight:600; }

/* badges sobre a mídia */
.card__badges { position:absolute; top: 14px; left: 14px; display:flex; flex-direction:column; gap:7px; z-index:3; align-items:flex-start; }
.badge { display:inline-flex; align-items:center; gap:6px; padding: 6px 12px; border-radius: var(--radius-full); font-size:.74rem; font-weight:700; letter-spacing:.02em; box-shadow: var(--shadow-sm); animation: badge-pop .5s both; }
.badge svg { width:13px; height:13px; }
.badge--gold { background: linear-gradient(135deg,var(--accent),var(--accent-dark)); color: var(--primary-dark); }
.badge--dark { background: rgba(15,31,48,.9); color:#fff; }
.badge--green { background: var(--whatsapp); color:#fff; }
.badge--red { background: var(--cta); color:#fff; }

/* ---- selos especiais dos cards ---- */
.badge--rec { background: linear-gradient(135deg,var(--accent-light),var(--accent) 55%,var(--accent-dark)); color: var(--primary-dark); }
.badge--preco { background: var(--success); color:#fff; }
.badge--novo { background: var(--info); color:#fff; }
.badge--novo .badge__dot { width:7px; height:7px; border-radius:50%; background:#fff; box-shadow:0 0 0 0 rgba(255,255,255,.7); animation: pulse-dot 1.5s ease-in-out infinite; }
@keyframes pulse-dot { 0%,100%{ opacity:1; transform:scale(1) } 50%{ opacity:.45; transform:scale(.65) } }

/* CARD 1 — Mais recomendado: contorno dourado animado + brilho suave */
@property --mgp-angle { syntax:'<angle>'; initial-value:0deg; inherits:false; }
.card--recomendado {
  border: 2px solid transparent;
  background:
    linear-gradient(#fff,#fff) padding-box,
    conic-gradient(from var(--mgp-angle),
      var(--accent-light), var(--accent), var(--accent-dark),
      var(--primary-light), var(--accent), var(--accent-light)) border-box;
  box-shadow: 0 10px 34px rgba(200,169,110,.30);
  animation: mgp-spin-border 5s linear infinite;
}
@keyframes mgp-spin-border { to { --mgp-angle: 360deg; } }
.card--recomendado:hover { box-shadow: 0 16px 46px rgba(200,169,110,.42); }
/* fallback (navegadores sem @property): borda em gradiente estática, sem girar */
@supports not (background: conic-gradient(from var(--mgp-angle), red, blue)) {
  .card--recomendado { animation: none;
    background: linear-gradient(#fff,#fff) padding-box,
      linear-gradient(135deg,var(--accent-light),var(--accent),var(--accent-dark)) border-box; }
}

/* CARD 2 — Melhor preço: apresentação verde com foco no valor */
.card--preco { border-color: var(--success); box-shadow: 0 6px 22px rgba(39,174,96,.16); }
.card--preco:hover { box-shadow: 0 14px 40px rgba(39,174,96,.24); }
.card--preco .card__price .val { color: var(--success); }
.card__preco-tag { display:inline-flex; align-items:center; gap:6px; margin-top:9px; align-self:flex-start;
  background: rgba(39,174,96,.10); color: var(--success); font-weight:700; font-size:.76rem;
  padding:5px 12px; border-radius: var(--radius-full); }
.card__preco-tag svg { width:14px; height:14px; }

/* CARD 3 — Entrou agora: acento azul de novidade */
.card--novo { border-color: var(--info); box-shadow: 0 6px 22px rgba(42,125,225,.14); }
.card--novo:hover { box-shadow: 0 14px 40px rgba(42,125,225,.22); }

.card__fav { position:absolute; top: 12px; right: 12px; z-index:3; width: 40px; height:40px; border-radius:50%; background: rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; box-shadow: var(--shadow-sm); transition: var(--t-fast); }
.card__fav svg { width:20px; height:20px; color: var(--text-medium); transition: var(--t-fast); fill: none; stroke: currentColor; stroke-width:2; }
.card__fav:hover { transform: scale(1.12); }
.card__fav.is-active svg { color: var(--cta); fill: var(--cta); }

.card__type { position:absolute; bottom: 12px; right: 12px; z-index:3; background: rgba(15,31,48,.85); color:#fff; padding: 5px 12px; border-radius: var(--radius-full); font-size:.72rem; font-weight:700; }

.card__body { padding: 20px 20px 22px; display:flex; flex-direction:column; flex:1; }
.card__loc { display:flex; align-items:center; gap:6px; font-size:.82rem; color: var(--accent-dark); font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.card__loc svg { width:14px; height:14px; }
.card__title { font-size: 1.18rem; color: var(--primary); margin-top:7px; line-height:1.2; }
.card__price { margin-top: 14px; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.card__price .val { font-family: var(--font-display); font-size: 1.7rem; color: var(--primary); }
.card__price .per { font-size:.84rem; color: var(--text-light); }
.card__total { font-size:.82rem; color: var(--text-medium); margin-top:4px; }
.card__total b { color: var(--text); }

.card__specs { display:flex; gap: 4px; margin-top: 16px; padding-top: 16px; border-top:1px solid var(--border); }
.spec { flex:1; text-align:center; display:flex; flex-direction:column; align-items:center; gap:5px; }
.spec svg { width:19px; height:19px; color: var(--accent-dark); }
.spec b { font-size:.95rem; color: var(--primary); }
.spec span { font-size:.68rem; color: var(--text-light); text-transform:uppercase; letter-spacing:.04em; }

.card__perto { margin-top: 16px; display:flex; flex-direction:column; gap:7px; }
.card__perto-item { display:flex; align-items:center; gap:8px; font-size:.84rem; color: var(--text-medium); }
.card__perto-item svg { width:16px; height:16px; color: var(--primary-light); flex:none; }
.card__perto-item b { color: var(--text); font-weight:700; margin-left:auto; }

.card__actions { margin-top: auto; padding-top: 18px; display:flex; gap:10px; }
.card__actions .btn { flex:1; padding: 12px 14px; font-size:.9rem; }
.card__detail { flex:none !important; width: 48px; padding:0 !important; }

/* lista (modo lista) reorganiza o card */
.grid.is-list .card { flex-direction:row; }
.grid.is-list .card__media { width: 38%; aspect-ratio: auto; min-height: 260px; }
.grid.is-list .card__body { width: 62%; }

/* estado vazio */
.empty { grid-column:1/-1; text-align:center; padding: 64px 20px; }
.empty > svg { width: 72px; height:72px; color: var(--border-dark); margin:0 auto 20px; }
.empty h3 { color: var(--primary); font-size:1.4rem; }
.empty p { color: var(--text-medium); margin-top:8px; }
.empty .btn { display:inline-flex; width:auto; max-width:320px; margin-inline:auto; }

/* =================================================================== QUIZ */
.quiz { background: linear-gradient(135deg,#142a44,#1C3553); border-radius: var(--radius-xl); padding: clamp(28px,5vw,60px); color:#fff; position:relative; overflow:hidden; }
.quiz::before { content:''; position:absolute; top:-120px; right:-120px; width:360px; height:360px; border-radius:50%; background: radial-gradient(circle, rgba(200,169,110,.3), transparent 70%); }
.quiz__inner { position:relative; z-index:2; max-width: 680px; margin-inline:auto; text-align:center; }
.quiz__step { animation: fade-up .5s both; }
.quiz__topbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom: 28px; }
.quiz__count { font-size:.74rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color: var(--accent-light); white-space:nowrap; }
.quiz__q { font-family: var(--font-display); font-size: clamp(1.4rem,3.2vw,2.1rem); margin-bottom: 26px; line-height:1.2; }
.quiz__hint { color: var(--accent-light); margin: -14px 0 24px; font-size: .92rem; }
.quiz__opts { display:grid; grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); gap: 14px; }
.quiz__opt { padding: 22px 18px; border-radius: var(--radius-md); background: rgba(255,255,255,.06); border:1.5px solid rgba(255,255,255,.16); transition: var(--t); font-weight:600; display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; line-height:1.3; }
.quiz__opt svg { width: 30px; height:30px; color: var(--accent-light); }
.quiz__opt:hover { background: rgba(200,169,110,.18); border-color: var(--accent); transform: translateY(-3px); }
.quiz__opt.is-sel { background: var(--accent); border-color: var(--accent); color: var(--primary-dark); }
.quiz__opt.is-sel svg { color: var(--primary-dark); }
.quiz__opt-l { display:block; font-weight:700; font-size:1rem; }
.quiz__opt-s { display:block; font-size:.78rem; font-weight:500; opacity:.72; margin-top:1px; }
.quiz__progress { display:flex; gap:7px; }
.quiz__progress i { width: 30px; height:5px; border-radius:4px; background: rgba(255,255,255,.18); transition: var(--t); }
.quiz__progress i.on { background: var(--accent); }
.quiz__nav { margin-top: 30px; display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }
.quiz__btn-ghost { color:#fff; border-color: rgba(255,255,255,.3); }
.quiz__btn-ghost:hover { background: rgba(255,255,255,.1); border-color:#fff; color:#fff; }
.quiz__result-ic { width:66px; height:66px; border-radius:50%; background: rgba(200,169,110,.16); display:flex; align-items:center; justify-content:center; margin:0 auto 18px; }
.quiz__result-ic svg { width:32px; height:32px; color: var(--accent-light); }
.quiz__result h3 { font-family: var(--font-display); font-size: clamp(1.5rem,3vw,1.9rem); margin-bottom: 10px; }
.quiz__result-count { color: #C7D3E0; margin-bottom: 22px; font-size:1.02rem; line-height:1.6; }
.quiz__teaser { background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius: var(--radius-md); padding:16px 20px; margin: 0 auto 26px; max-width:440px; text-align:left; display:flex; flex-direction:column; gap:3px; }
.quiz__teaser span { font-size:.7rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color: var(--accent-light); }
.quiz__teaser b { color:#fff; font-family:var(--font-display); font-size:1.12rem; line-height:1.2; }
.quiz__teaser i { font-style:normal; color:#B9C6D4; font-size:.9rem; }
@media (max-width: 560px) {
  .quiz__topbar { flex-direction:column; align-items:stretch; gap:14px; }
  .quiz__progress i { flex:1; }
  .quiz__nav { flex-direction:column-reverse; }
  .quiz__nav .btn { width:100%; }
}

/* =================================================================== STEPS */
.steps { display:grid; grid-template-columns: repeat(4,1fr); gap: 24px; counter-reset: step; }
.step { position:relative; padding: 32px 24px; background:#fff; border-radius: var(--radius-lg); border:1px solid var(--border); box-shadow: var(--shadow-xs); transition: var(--t); }
.step:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.step__num { counter-increment: step; font-family: var(--font-display); font-size: 3rem; color: var(--accent); line-height:1; opacity:.5; }
.step__num::before { content: '0' counter(step); }
.step__icon { width: 52px; height:52px; border-radius: var(--radius-md); background: var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; margin: 14px 0 16px; }
.step__icon svg { width: 26px; height:26px; }
.step h3 { font-size: 1.16rem; color: var(--primary); margin-bottom: 8px; }
.step p { font-size:.94rem; color: var(--text-medium); }
.step::after { content:''; position:absolute; top: 60px; right: -16px; width: 24px; height:2px; background: var(--border-dark); }
.step:last-child::after { display:none; }

/* ================================================================== TRUST */
.why { display:grid; grid-template-columns: repeat(3,1fr); gap: 26px; }
.why__card { padding: 34px 28px; border-radius: var(--radius-lg); background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); transition: var(--t); }
.why__card:hover { background: rgba(200,169,110,.08); border-color: rgba(200,169,110,.3); transform: translateY(-6px); }
.why__icon { width: 56px; height:56px; border-radius: var(--radius-md); background: linear-gradient(135deg,var(--accent),var(--accent-dark)); color: var(--primary-dark); display:flex; align-items:center; justify-content:center; margin-bottom: 20px; }
.why__icon svg { width: 28px; height:28px; }
.why__card h3 { font-size: 1.25rem; color:#fff; margin-bottom: 10px; }
.why__card p { color:#B9C6D4; font-size:.96rem; }

/* ================================================================== BLOG */
.blog-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 26px; }
.post { display:flex; flex-direction:column; background:#fff; border-radius: var(--radius-lg); overflow:hidden; border:1px solid var(--border); box-shadow: var(--shadow-xs); transition: var(--t); }
.post:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.post__cover { aspect-ratio: 16/9; position:relative; display:flex; align-items:flex-end; padding: 18px; color:#fff; overflow:hidden; }
.post__cover--img { background-size: cover; background-position: center; }
.post__cover-pat { position:absolute; inset:0; opacity:.14; background-image: radial-gradient(circle at 20% 30%, #fff 1px, transparent 1px); background-size: 22px 22px; }
.post__cat { position:relative; z-index:2; background: rgba(255,255,255,.22); padding: 5px 12px; border-radius: var(--radius-full); font-size:.72rem; font-weight:700; }
.post__body { padding: 22px 22px 24px; display:flex; flex-direction:column; flex:1; }
.post__meta { font-size:.78rem; color: var(--text-light); margin-bottom: 8px; }
.post h3 { font-size: 1.18rem; color: var(--primary); line-height:1.25; }
.post p { font-size:.92rem; color: var(--text-medium); margin-top: 10px; flex:1; }
.post__more { margin-top: 16px; font-weight:700; color: var(--accent-dark); display:inline-flex; align-items:center; gap:6px; font-size:.9rem; }
.post__more svg { width:16px; height:16px; transition: var(--t-fast); }
.post:hover .post__more svg { transform: translateX(4px); }

/* =================================================================== FAQ */
.faq { max-width: 820px; margin-inline:auto; }
.faq__item { border-bottom:1px solid var(--border); }
.faq__q { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding: 22px 4px; text-align:left; font-family: var(--font-display); font-size: 1.14rem; color: var(--primary); }
.faq__q span.ico { flex:none; width:30px; height:30px; border-radius:50%; border:1.5px solid var(--border-dark); display:flex; align-items:center; justify-content:center; position:relative; transition: var(--t); }
.faq__q span.ico::before, .faq__q span.ico::after { content:''; position:absolute; background: var(--primary); border-radius:2px; transition: var(--t); }
.faq__q span.ico::before { width:12px; height:2px; } .faq__q span.ico::after { width:2px; height:12px; }
.faq__item.is-open .faq__q span.ico { background: var(--accent); border-color: var(--accent); }
.faq__item.is-open .faq__q span.ico::after { transform: scaleY(0); }
.faq__a { max-height:0; overflow:hidden; transition: max-height var(--t-slow); }
.faq__a p { padding: 0 4px 24px; color: var(--text-medium); font-size:.98rem; }

/* ================================================================ CTA FINAL */
.finalcta { position:relative; overflow:hidden; background: linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff; border-radius: var(--radius-xl); padding: clamp(36px,6vw,72px); text-align:center; }
.finalcta::before { content:''; position:absolute; inset:0; opacity:.5; background: radial-gradient(700px 400px at 80% 20%, rgba(200,169,110,.25), transparent 60%); }
.finalcta > * { position:relative; z-index:2; }
.finalcta h2 { font-size: clamp(1.8rem,4vw,2.8rem); color:#fff; max-width:760px; margin-inline:auto; }
.finalcta p { color:#C7D3E0; margin: 16px auto 30px; max-width: 560px; font-size:1.08rem; }
.finalcta__row { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ================================================================== FOOTER */
.footer { background: var(--bg-dark); color:#A9B7C6; padding-top: 70px; }
.footer__banner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px; padding: 22px 30px; background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius: var(--radius-lg); margin-bottom: 56px; }
.footer__banner p { color:#D6DEE7; font-size:.98rem; }
.footer__banner img { height: 30px; width:auto; }
.footer__grid { display:grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 40px; padding-bottom: 50px; }
.footer__logo img { height: 38px; width:auto; margin-bottom: 18px; }
.footer__brand p { font-size:.94rem; max-width: 320px; }
.footer__social { display:flex; gap:12px; margin-top: 20px; }
.footer__social a { width:42px; height:42px; border-radius:50%; background: rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; transition: var(--t-fast); }
.footer__social a:hover { background: var(--accent); color: var(--primary-dark); transform: translateY(-3px); }
.footer__social svg { width:20px; height:20px; }
.footer__col h4 { color:#fff; font-family: var(--font-body); font-size:.82rem; text-transform:uppercase; letter-spacing:.12em; margin-bottom: 18px; }
.footer__col a, .footer__col .fi { display:flex; align-items:center; gap:10px; padding: 7px 0; font-size:.94rem; transition: var(--t-fast); }
.footer__col a:hover { color: var(--accent-light); }
.footer__col svg { width:16px; height:16px; color: var(--accent); flex:none; }
.footer__bottom { border-top:1px solid rgba(255,255,255,.08); padding: 24px 0 40px; font-size:.82rem; color:#7E8EA0; }
.footer__bottom a { color: var(--accent-light); }
.footer__legal { margin-top: 12px; font-size:.76rem; color:#5F6E80; line-height:1.7; }

/* =========================================================== FLOAT BUTTONS */
.fab-wa { position: fixed; right: 22px; bottom: 22px; z-index: 900; width: 60px; height:60px; border-radius:50%; background: var(--whatsapp); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow: 0 10px 30px rgba(37,211,102,.45); transition: var(--t); }
.fab-wa::after { content:''; position:absolute; inset:0; border-radius:50%; background: var(--whatsapp); z-index:-1; animation: fab-pulse 2.8s ease-out infinite; }
@keyframes fab-pulse { 0% { transform: scale(1); opacity:.5; } 70% { transform: scale(1.85); opacity:0; } 100% { transform: scale(1.85); opacity:0; } }
.fab-wa svg { width: 30px; height:30px; }
.fab-wa:hover { transform: scale(1.08); background: var(--whatsapp-hover); }
.fab-wa__tip { position:absolute; right: 72px; background: var(--primary-dark); color:#fff; padding: 8px 14px; border-radius: var(--radius-md); font-size:.84rem; font-weight:600; white-space:nowrap; opacity:0; transform: translateX(8px); transition: var(--t); box-shadow: var(--shadow-md); pointer-events:none; }
.fab-wa:hover .fab-wa__tip { opacity:1; transform: translateX(0); }
.to-top { position: fixed; right: 24px; bottom: 92px; z-index: 899; width: 46px; height:46px; border-radius:50%; background: var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow: var(--shadow-md); opacity:0; visibility:hidden; transform: translateY(10px); transition: var(--t); }
.to-top.show { opacity:1; visibility:visible; transform: none; }
.to-top svg { width:22px; height:22px; }

/* ================================================================= MODAL */
.modal { position: fixed; inset:0; z-index: 1200; display:flex; align-items:center; justify-content:center; padding: 20px; opacity:0; visibility:hidden; transition: var(--t); }
.modal.is-open { opacity:1; visibility:visible; }
.modal__overlay { position:absolute; inset:0; background: rgba(11,22,36,.78); }
.modal__box { position:relative; z-index:2; background:#fff; border-radius: var(--radius-xl); max-width: 920px; width:100%; max-height: 92vh; overflow:hidden; box-shadow: var(--shadow-xl); transform: scale(.96) translateZ(0); transition: transform .28s cubic-bezier(.22,.61,.36,1), opacity .24s ease; opacity:0; will-change: transform, opacity; display:flex; flex-direction:column; }
.modal.is-open .modal__box { transform: scale(1) translateZ(0); opacity:1; }
.modal__close { position:absolute; top:16px; right:16px; z-index:5; width:42px; height:42px; border-radius:50%; background: rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; box-shadow: var(--shadow-sm); font-size:1.5rem; color: var(--primary); transition: var(--t-fast); }
.modal__close:hover { background: var(--cta); color:#fff; transform: rotate(90deg); }
.modal__scroll { overflow-y:auto; }
.modal__hero { position:relative; min-height: 230px; display:flex; align-items:flex-end; padding: 24px; color:#fff; }
.modal__hero-pat { position:absolute; inset:0; opacity:.16; background-image: linear-gradient(rgba(255,255,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.5) 1px,transparent 1px); background-size: 30px 30px; }
.modal__hero-icon { position:absolute; top:50%; right: 34px; transform: translateY(-50%); width: 120px; height:120px; color: rgba(255,255,255,.22); }
.modal__hero-info { position:relative; z-index:2; }
.modal__hero-loc { font-size:.84rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color: var(--accent-light); display:flex; align-items:center; gap:6px; }
.modal__hero-loc svg { width:15px; height:15px; }
.modal__hero h2 { font-size: clamp(1.4rem,3vw,2rem); margin-top:6px; }
.modal__hero-price { margin-top: 12px; font-family: var(--font-display); font-size: 1.8rem; }
.modal__hero-price span { font-family: var(--font-body); font-size:.9rem; opacity:.85; }
.modal__body { padding: 28px; }
.modal__specs { display:grid; grid-template-columns: repeat(auto-fit, minmax(74px,1fr)); gap: 12px; padding-bottom: 24px; border-bottom:1px solid var(--border); }
.modal__spec { text-align:center; padding: 14px 8px; background: var(--bg); border-radius: var(--radius-md); }
.modal__spec svg { width:22px; height:22px; color: var(--accent-dark); margin:0 auto 8px; }
.modal__spec b { display:block; color: var(--primary); font-size:1.05rem; }
.modal__spec span { font-size:.72rem; color: var(--text-light); text-transform:uppercase; }
.modal__cols { display:grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 24px; }
.modal__sec { margin-top: 26px; }
.feats { display:grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.feat { display:flex; align-items:flex-start; gap:12px; background: var(--bg); border:1px solid var(--border); border-radius: var(--radius-md); padding:13px 15px; font-size:.94rem; color: var(--text); line-height:1.4; transition: var(--t-fast); }
.feat:hover { border-color: var(--accent); box-shadow: var(--shadow-xs); transform: translateY(-1px); }
.feat__ic { flex:none; width:24px; height:24px; border-radius:50%; background: linear-gradient(135deg,var(--accent),var(--accent-dark)); color: var(--primary-dark); display:flex; align-items:center; justify-content:center; margin-top:1px; }
.feat__ic svg { width:14px; height:14px; }
.modal__cols .modal__price-break, .modal__sec .modal__price-break { margin-top: 0; }
@media (max-width: 768px) { .feats { grid-template-columns: 1fr; } }
.modal__h { font-family: var(--font-display); font-size:1.2rem; color: var(--primary); margin-bottom: 14px; display:flex; align-items:center; gap:8px; }
.modal__h svg { width:20px; height:20px; color: var(--accent-dark); }
.modal__list li { display:flex; gap:10px; padding: 7px 0; font-size:.94rem; color: var(--text-medium); }
.modal__list svg { width:18px; height:18px; color: var(--success); flex:none; margin-top:2px; }
.modal__perto li { display:flex; align-items:center; gap:10px; padding: 9px 0; font-size:.94rem; }
.modal__perto svg { width:18px; height:18px; color: var(--primary-light); flex:none; }
.modal__perto b { margin-left:auto; color: var(--primary); }
.modal__price-break { margin-top: 24px; background: var(--bg); border-radius: var(--radius-md); padding: 18px 20px; }
.modal__price-break .row { display:flex; justify-content:space-between; padding: 6px 0; font-size:.94rem; color: var(--text-medium); }
.modal__price-break .row.total { border-top:1px dashed var(--border-dark); margin-top:6px; padding-top:12px; font-weight:700; color: var(--primary); font-size:1.05rem; }
.modal__desc { margin-top: 24px; color: var(--text-medium); font-size:.98rem; line-height:1.8; }
.modal__cta { margin-top: 26px; display:flex; gap:12px; flex-wrap:wrap; }
.modal__cta .btn { flex:1; min-width: 200px; }

/* ================================================================== TOAST */
.toast-wrap { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 1300; display:flex; flex-direction:column; gap:10px; align-items:center; }
.toast { background: var(--primary-dark); color:#fff; padding: 13px 22px; border-radius: var(--radius-full); font-size:.9rem; font-weight:600; box-shadow: var(--shadow-lg); display:flex; align-items:center; gap:10px; animation: scale-in .3s both; }
.toast svg { width:18px; height:18px; color: var(--accent-light); }

/* ============================================================== RESPONSIVO */
@media (max-width: 1024px) {
  .hero__inner { grid-template-columns: 1fr; gap: 30px; }
  /* visual do banner no mobile/tablet: o deck reflui num empilhamento elegante e flutuante */
  .hero__visual { display:block; height:auto; perspective:none; margin-top: 4px; }
  .hero__deck {
    position: static; inset: auto; transform: none; transform-style: flat;
    display: flex; flex-direction: column; align-items: center; gap: 14px;
    max-width: 340px; margin: 0 auto;
  }
  .fcard {
    position: relative; top: auto; left: auto; right: auto; bottom: auto;
    width: 100%; margin: 0;
  }
  .fcard--1 { max-width: 320px; animation: float-soft 6s ease-in-out infinite; }
  .fcard--2 { max-width: 300px; animation: float-soft 7s ease-in-out infinite .3s; }
  .fcard--3 { max-width: 270px; animation: float-soft 6.5s ease-in-out infinite .6s; }
  .hero__content { text-align: center; }
  .hero__sub { margin-inline: auto; }
  .hero__cta-row { justify-content: center; }
  .hero__stats { justify-content: center; }
  .filterbar__row { grid-template-columns: 1fr 1fr; }
  .grid, .blog-grid, .why { grid-template-columns: repeat(2,1fr); }
  .steps { grid-template-columns: repeat(2,1fr); }
  .step::after { display:none; }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .modal__cols { grid-template-columns: 1fr; gap: 24px; }
  .modal__specs { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 768px) {
  .header__nav { display:none; }
  .header__cta { display:none; }
  .header__burger { display:flex; }
  .grid, .blog-grid, .why, .steps { grid-template-columns: 1fr; }
  .grid.is-list .card { flex-direction:column; }
  .grid.is-list .card__media { width:100%; min-height:0; aspect-ratio:16/11; }
  .grid.is-list .card__body { width:100%; }
  .filterbar { position: static; }
  .filterbar__row { grid-template-columns: 1fr; }
  .filterbar__chips { justify-content: center; }
  .filterbar__chips .quickchips { justify-content: center; }
  .catalog__toolbar { flex-direction:column; align-items:center; text-align:center; }
  .catalog__tools { flex-wrap:wrap; justify-content:center; }
  /* stats do banner: um embaixo do outro, centralizados */
  .hero__stats { flex-direction: column; align-items: center; gap: 18px; text-align: center; }
  .hero__stat:not(:last-child)::after { display:none; }
  .hero__stat .lbl { margin-inline: auto; }
  .footer__grid { grid-template-columns: 1fr; }
  .modal__specs { grid-template-columns: repeat(2,1fr); }
  .modal__box { max-height: 94vh; }
  /* centraliza todas as seções no mobile */
  .section-head { margin-bottom: 38px; text-align: center; }
  .section-head .eyebrow { justify-content: center; display: flex; }
  .section-sub { margin-inline: auto; }
  /* faixa de confiança: mostra todos os itens (quebra em linhas) */
  .trustbar__inner { flex-wrap: wrap; overflow-x: visible; justify-content: center; gap: 14px 22px; }
  .trustbar__item { font-size: .86rem; }
  /* passos, cards e rodapé centralizados e organizados no mobile */
  .step { text-align: center; }
  .step__icon { margin-inline: auto; }
  .why__card { text-align: center; }
  .why__icon { margin-inline: auto; }
  .footer__banner { flex-direction: column; text-align: center; }
  .footer__grid { text-align: center; }
  .footer__logo img { margin-inline: auto; }
  .footer__brand p { margin-inline: auto; }
  .footer__social { justify-content: center; }
  .footer__col a, .footer__col .fi { justify-content: center; }
  .finalcta__row { flex-direction: column; }
  .finalcta__row .btn { width: 100%; }
}
@media (max-width: 420px) {
  .hero__cta-row .btn { width:100%; }
  .card__actions { flex-wrap:wrap; }
}

/* ============================================================================
   V2 — FILTROS REFINADOS, GALERIA, LOGIN, COMPARADOR, ANOTAÇÕES, TARJA
   ========================================================================== */

/* -------- correção de alinhamento/overflow dos selects -------- */
.field select {
  padding-right: 38px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}
.field--select::after { right: 16px; }
.field input::placeholder { color: var(--text-light); }

/* ============================================================================
   NICE-SELECT — dropdown customizado (centralizado e empilhado, com a cara do site)
   ========================================================================== */
/* esconde o select nativo, mas o mantém funcional p/ o JS (não usar display:none) */
.nicesel__native {
  position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0;
}
/* a seta padrão do .field--select continua valendo sobre o botão customizado */
.nicesel { position: static; }

/* botão (estado fechado) — herda a cara do .field select */
.field--select .nicesel__btn {
  width: 100%;
  height: 52px;
  padding: 0 42px;
  border: 1.5px solid var(--border-dark);
  border-radius: var(--radius-md);
  background: #fff;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: .92rem;
  color: var(--primary);
  letter-spacing: .01em;
  text-align: center;
  display: flex; align-items: center; justify-content: center;
  transition: var(--t-fast);
  cursor: pointer;
}
.field--select .nicesel__btn:hover { border-color: var(--accent); }
.nicesel.is-open .nicesel__btn {
  border-color: var(--accent);
  box-shadow: 0 0 0 4px rgba(200,169,110,.18);
}
.nicesel__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* placeholder (nada selecionado) num tom mais suave */
.nicesel.is-empty .nicesel__label { color: var(--text-light); font-weight: 500; }

/* painel (estado aberto) — opções centralizadas, uma embaixo da outra */
.nicesel__panel {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 40;
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  padding: 6px;
  max-height: 280px;
  overflow-y: auto;
  display: none;
  animation: niceFade .16s ease;
}
.nicesel.is-open .nicesel__panel { display: block; }
@keyframes niceFade { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }

.nicesel__opt {
  text-align: center;            /* centralizado de verdade */
  padding: 11px 14px;
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: .9rem;
  color: var(--primary);
  cursor: pointer;
  transition: background .14s ease, color .14s ease;
}
.nicesel__opt:hover { background: var(--bg); color: var(--primary-dark); }
.nicesel__opt.is-selected { background: var(--primary); color: #fff; }
.nicesel__opt--placeholder { color: var(--text-light); font-weight: 500; }

/* variante pílula (ordenação do catálogo) */
.sortselect .nicesel--pill { position: relative; }
.sortselect .nicesel__btn {
  height: auto;
  padding: 9px 38px 9px 18px;
  border: 1.5px solid var(--border-dark);
  border-radius: var(--radius-full);
  background: #fff;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: .86rem;
  color: var(--primary);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: var(--t-fast);
}
.sortselect .nicesel__btn:hover { border-color: var(--accent); }
.sortselect .nicesel--pill { display: inline-block; }
.sortselect .nicesel--pill::after {
  content: ''; position: absolute; right: 16px; top: 50%;
  width: 8px; height: 8px;
  border-right: 2px solid var(--text-light); border-bottom: 2px solid var(--text-light);
  transform: translateY(-65%) rotate(45deg); pointer-events: none;
}

/* novo painel de filtros (mais bonito e organizado) */
.filterbar { padding: 18px; }
.filterbar__top { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom: 14px; }
.filterbar__title { display:flex; align-items:center; gap:10px; font-weight:700; color: var(--primary); font-size:.96rem; }
.filterbar__title svg { width:20px; height:20px; color: var(--accent-dark); }
.filterbar__row { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.field label.field__tag { position:absolute; top:-8px; left:14px; background:#fff; padding:0 6px; font-size:.68rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color: var(--accent-dark); border-radius:4px; }
.field input, .field select { height: 52px; }

/* botão pesquisar (aparece principalmente no mobile) */
.filterbar__search { display:none; }
.filterbar__chips { margin-top: 14px; padding-top: 16px; border-top: 1px solid var(--border); display:flex; align-items:center; flex-wrap:wrap; gap: 10px; }
.filterbar__chips-label { font-size:.74rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color: var(--text-light); margin-right:2px; }
.filterbar__chips .quickchips { margin:0; }
.filterbar__actions { display:flex; gap:10px; margin-top: 16px; }
.filterbar__actions .filterbar__reset { flex:0 0 auto; }
.btn-search { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:10px; height:52px; border-radius: var(--radius-md); background: var(--primary); color:#fff; font-weight:700; box-shadow: var(--shadow-md); transition: var(--t-fast); }
.btn-search:hover { background: var(--primary-light); transform: translateY(-2px); }
.btn-search svg { width:20px; height:20px; }
.btn-search .badge-count { background: var(--accent); color: var(--primary-dark); border-radius: var(--radius-full); padding:1px 9px; font-size:.82rem; }

/* chips de amenidade multi-seleção (visual melhorado) */
.quickchips { gap:10px; }
.quickchip { display:inline-flex; align-items:center; gap:8px; position:relative; }
.quickchip svg { width:17px; height:17px; flex:none; color: var(--accent-dark); transition: var(--t-fast); }
.quickchip.is-active { box-shadow: 0 6px 16px rgba(28,53,83,.25); }
.quickchip.is-active svg { color:#fff; }
.quickchips__hint { width:100%; font-size:.82rem; color: var(--text-light); margin-top:2px; }

/* sinalização de resultados (pílula que pulsa quando atualiza) */
.results-flash { position: sticky; top: 132px; z-index: 55; display:flex; justify-content:center; pointer-events:none; height:0; }
.results-flash span { transform: translateY(-6px); opacity:0; background: var(--success); color:#fff; padding:8px 18px; border-radius: var(--radius-full); font-size:.86rem; font-weight:700; box-shadow: var(--shadow-md); transition: var(--t); display:flex; align-items:center; gap:8px; }
.results-flash.show span { opacity:1; transform: translateY(0); }
.results-flash svg { width:16px; height:16px; }

/* indicador de nota e seleção de comparar no card */
.card__notebadge { position:absolute; top:12px; right:60px; z-index:3; width:40px; height:40px; border-radius:50%; background: rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; box-shadow: var(--shadow-sm); color: var(--accent-dark); }
.card__notebadge svg { width:18px; height:18px; }
.card__compare {
  display:inline-flex; align-items:center; gap:8px; margin-top:14px; align-self:flex-start;
  padding:7px 14px; border:1.5px solid var(--border-dark); border-radius: var(--radius-full);
  background:#fff; font-size:.8rem; font-weight:700; letter-spacing:.01em;
  color: var(--text-medium); cursor:pointer; user-select:none; transition: var(--t-fast);
}
.card__compare svg { width:16px; height:16px; color: var(--accent-dark); transition: var(--t-fast); }
/* esconde o checkbox nativo, mantém funcional e acessível */
.card__compare input { position:absolute; opacity:0; width:0; height:0; margin:0; }
.card__compare:hover { border-color: var(--accent); color: var(--primary); background: var(--bg); }
.card__compare:hover svg { color: var(--accent); }
.card__compare:focus-within { box-shadow: 0 0 0 4px rgba(200,169,110,.18); }
/* estado selecionado (na comparação) */
.card__compare:has(input:checked) {
  background: var(--primary); border-color: var(--primary); color:#fff;
  box-shadow: 0 5px 16px rgba(28,53,83,.26);
}
.card__compare:has(input:checked) svg { color: var(--accent-light); }
.card__compare:has(input:checked) span::before { content:'\2713\00a0'; } /* ✓ */

/* ---- prova social (visualizações reais + mais procurado + recência) ---- */
.card__social { display:flex; flex-wrap:wrap; align-items:center; gap:7px 12px; margin-top:10px; font-size:.76rem; font-weight:600; color: var(--text-light); }
.card__social svg { width:14px; height:14px; flex:none; }
.card__views { display:inline-flex; align-items:center; gap:5px; }
.card__views svg { color: var(--text-medium); }
.card__seen { display:inline-flex; align-items:center; gap:5px; color: var(--text-light); }
.card__seen::before { content:''; width:3px; height:3px; border-radius:50%; background: var(--border-dark); margin-right:6px; }
.card__social .card__hot:only-child { margin:0; }
.card__hot {
  display:inline-flex; align-items:center; gap:5px; padding:3px 10px; border-radius: var(--radius-full);
  background: linear-gradient(135deg, var(--accent-light), var(--accent));
  color: var(--primary-dark); font-weight:800; font-size:.72rem; letter-spacing:.01em;
  box-shadow: 0 2px 8px rgba(200,169,110,.35);
}
.card__hot svg { color: var(--accent-dark); animation: hot-flicker 1.8s ease-in-out infinite; }
@keyframes hot-flicker { 0%,100%{ transform: scale(1); opacity:1 } 50%{ transform: scale(1.12); opacity:.85 } }

/* ====================== GALERIA NO MODAL ====================== */
.gallery { position: relative; background:#0d1a2b; }
.gallery__stage { position:relative; aspect-ratio: 16/10; overflow:hidden; }
.gallery__stage img { width:100%; height:100%; object-fit:cover; cursor: zoom-in; }
.gallery__nav { position:absolute; top:50%; transform:translateY(-50%); width:46px; height:46px; border-radius:50%; background: rgba(255,255,255,.9); display:flex; align-items:center; justify-content:center; box-shadow: var(--shadow-md); transition: var(--t-fast); z-index:3; }
.gallery__nav:hover { background:#fff; transform: translateY(-50%) scale(1.08); }
.gallery__nav svg { width:24px; height:24px; color: var(--primary); }
.gallery__nav--prev { left:14px; } .gallery__nav--next { right:14px; }
.gallery__count { position:absolute; bottom:14px; right:14px; z-index:3; background: rgba(15,31,48,.8); color:#fff; padding:5px 12px; border-radius: var(--radius-full); font-size:.78rem; font-weight:700; backdrop-filter: blur(4px); }
.gallery__zoom { position:absolute; bottom:14px; left:14px; z-index:3; background: rgba(15,31,48,.8); color:#fff; padding:6px 12px; border-radius: var(--radius-full); font-size:.76rem; font-weight:600; display:flex; align-items:center; gap:6px; backdrop-filter: blur(4px); }
.gallery__zoom svg { width:15px; height:15px; }
.gallery__thumbs { display:flex; gap:8px; padding:12px; overflow-x:auto; background:#0d1a2b; scrollbar-width: thin; }
.gallery__thumb { flex:0 0 84px; height:60px; border-radius: var(--radius-sm); overflow:hidden; cursor:pointer; opacity:.55; border:2px solid transparent; transition: var(--t-fast); }
.gallery__thumb img { width:100%; height:100%; object-fit:cover; }
.gallery__thumb.is-active { opacity:1; border-color: var(--accent); }
.gallery__thumb:hover { opacity:1; }

/* lightbox (fullscreen) */
.lightbox { position: fixed; inset:0; z-index: 1400; background: rgba(8,16,26,.95); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition: var(--t); }
.lightbox.is-open { opacity:1; visibility:visible; }
.lightbox img { max-width: 92vw; max-height: 86vh; border-radius: var(--radius-md); box-shadow: var(--shadow-xl); }
.lightbox__close { position:absolute; top:24px; right:28px; width:48px; height:48px; border-radius:50%; background: rgba(255,255,255,.12); color:#fff; font-size:1.8rem; display:flex; align-items:center; justify-content:center; transition: var(--t-fast); }
.lightbox__close:hover { background: var(--cta); }
.lightbox__nav { position:absolute; top:50%; transform:translateY(-50%); width:56px; height:56px; border-radius:50%; background: rgba(255,255,255,.12); color:#fff; display:flex; align-items:center; justify-content:center; transition: var(--t-fast); }
.lightbox__nav:hover { background: rgba(255,255,255,.25); }
.lightbox__nav svg { width:30px; height:30px; }
.lightbox__nav--prev { left:24px; } .lightbox__nav--next { right:24px; }
.lightbox__count { position:absolute; bottom:24px; left:50%; transform:translateX(-50%); color:#fff; font-size:.9rem; background: rgba(255,255,255,.12); padding:6px 16px; border-radius: var(--radius-full); }

/* ====================== ANOTAÇÕES NO MODAL ====================== */
.notes { margin-top: 24px; background: var(--bg); border:1px solid var(--border); border-radius: var(--radius-md); padding: 20px; }
.notes__head { display:flex; align-items:center; gap:8px; font-family: var(--font-display); font-size:1.12rem; color: var(--primary); margin-bottom: 12px; }
.notes__head svg { width:19px; height:19px; color: var(--accent-dark); }
.notes textarea { width:100%; min-height: 84px; resize:vertical; border:1.5px solid var(--border-dark); border-radius: var(--radius-sm); padding:12px 14px; font-size:.95rem; transition: var(--t-fast); }
.notes textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(200,169,110,.18); outline:none; }
.notes__bar { display:flex; align-items:center; justify-content:space-between; margin-top:10px; gap:12px; }
.notes__status { font-size:.82rem; color: var(--success); font-weight:600; opacity:0; transition: var(--t); }
.notes__status.show { opacity:1; }
.notes__locked { text-align:center; padding: 8px 0; }
.notes__locked p { color: var(--text-medium); font-size:.94rem; margin-bottom:12px; }

/* ====================== MODAL DE LOGIN ====================== */
.header__auth { display:inline-flex; align-items:center; gap:8px; }
.btn-auth { display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius: var(--radius-full); border:1.5px solid rgba(255,255,255,.35); color:#fff; font-weight:700; font-size:.9rem; transition: var(--t-fast); }
.btn-auth svg { width:18px; height:18px; }
.btn-auth:hover { background:#fff; color: var(--primary); border-color:#fff; }
.header.is-scrolled .btn-auth { border-color: var(--border-dark); color: var(--primary); }
.header.is-scrolled .btn-auth:hover { background: var(--primary); color:#fff; border-color: var(--primary); }
.user-chip { display:inline-flex; align-items:center; gap:9px; padding:6px 14px 6px 6px; border-radius: var(--radius-full); background: rgba(255,255,255,.12); color:#fff; font-weight:700; font-size:.88rem; transition: var(--t-fast); }
.header.is-scrolled .user-chip { background: var(--bg); color: var(--primary); }
.user-chip:hover { background: var(--accent); color: var(--primary-dark); }
.user-chip__avatar { position:relative; width:30px; height:30px; border-radius:50%; background: var(--accent); color: var(--primary-dark); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.82rem; overflow:hidden; }
.user-chip__avatar img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

.auth { position:fixed; inset:0; z-index:1250; display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; visibility:hidden; transition: var(--t); }
.auth.is-open { opacity:1; visibility:visible; }
.auth__overlay { position:absolute; inset:0; background: rgba(11,22,36,.78); }
.auth__box { position:relative; z-index:2; background:#fff; border-radius: var(--radius-xl); max-width: 440px; width:100%; box-shadow: var(--shadow-xl); transform: scale(.94); transition: var(--t); overflow:hidden; max-height: 94vh; overflow-y:auto; }
.auth.is-open .auth__box { transform: scale(1); }
.auth__close { position:absolute; top:14px; right:14px; width:38px; height:38px; border-radius:50%; background: var(--bg); display:flex; align-items:center; justify-content:center; font-size:1.4rem; color: var(--primary); z-index:3; transition: var(--t-fast); }
.auth__close:hover { background: var(--cta); color:#fff; }
.auth__head { padding: 34px 32px 8px; text-align:center; }
.auth__head img { height: 30px; width:auto; margin:0 auto 16px; }
.auth__head h2 { font-size: 1.5rem; color: var(--primary); }
.auth__head p { color: var(--text-medium); font-size:.94rem; margin-top:6px; }
.auth__body { padding: 18px 32px 32px; }
.auth__google { width:100%; display:flex; align-items:center; justify-content:center; gap:10px; height:50px; border:1.5px solid var(--border-dark); border-radius: var(--radius-md); font-weight:700; color: var(--text); transition: var(--t-fast); }
.auth__google:hover { background: var(--bg); border-color: var(--text-light); }
.auth__google svg { width:20px; height:20px; }
.auth__divider { display:flex; align-items:center; gap:12px; margin: 18px 0; color: var(--text-light); font-size:.82rem; }
.auth__divider::before, .auth__divider::after { content:''; flex:1; height:1px; background: var(--border); }
.auth__field { margin-bottom: 14px; }
.auth__field label { display:block; font-size:.82rem; font-weight:700; color: var(--text-medium); margin-bottom:6px; }
.auth__field input { width:100%; height:50px; border:1.5px solid var(--border-dark); border-radius: var(--radius-md); padding:0 16px; font-size:.96rem; transition: var(--t-fast); }
.auth__field input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(200,169,110,.18); outline:none; }
.auth__submit { width:100%; height:52px; border-radius: var(--radius-md); background: var(--primary); color:#fff; font-weight:700; font-size:1rem; transition: var(--t-fast); margin-top: 6px; }
.auth__submit:hover { background: var(--primary-light); }
.auth__submit:disabled { opacity:.6; cursor: default; }
.auth__foot { text-align:center; margin-top: 18px; font-size:.92rem; color: var(--text-medium); }
.auth__foot a { color: var(--accent-dark); font-weight:700; cursor:pointer; }
.auth__error { background: #fdecec; color: #b3261e; border-radius: var(--radius-sm); padding:10px 14px; font-size:.88rem; margin-bottom: 14px; display:none; }
.auth__error.show { display:block; }
.auth__forgot { text-align:right; font-size:.84rem; margin: -6px 0 12px; }
.auth__forgot a { color: var(--accent-dark); font-weight:600; cursor:pointer; }
[data-auth-when="register"] { display:none; }
.auth[data-mode="register"] [data-auth-when="register"] { display:block; }
.auth[data-mode="register"] [data-auth-when="login"] { display:none; }
.auth__note { background: linear-gradient(135deg,#f3eee2,#faf7f0); border:1px solid var(--border-dark); border-radius: var(--radius-md); padding:14px 16px; font-size:.86rem; color: var(--text-medium); margin-bottom: 16px; }
.auth__note strong { color: var(--primary); }

/* ====================== BARRA DE COMPARAÇÃO ====================== */
.compare-bar { position: fixed; left:50%; bottom: 22px; transform: translate(-50%, 130%); z-index: 880; background: var(--primary-dark); color:#fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-xl); padding: 12px 14px 12px 20px; display:flex; align-items:center; gap:16px; transition: transform var(--t-slow); max-width: calc(100vw - 28px); }
.compare-bar.show { transform: translate(-50%, 0); }
.compare-bar__label { font-size:.88rem; font-weight:700; }
.compare-bar__label b { color: var(--accent-light); }
.compare-bar__thumbs { display:flex; gap:8px; }
.compare-bar__thumb { width:46px; height:38px; border-radius: var(--radius-sm); background: var(--primary-light); display:flex; align-items:center; justify-content:center; font-size:.7rem; font-weight:700; position:relative; overflow:hidden; }
.compare-bar__thumb img { width:100%; height:100%; object-fit:cover; }
.compare-bar__thumb x, .compare-bar__thumb .x { position:absolute; top:-4px; right:-4px; }
.compare-bar__btns { display:flex; gap:8px; }
.compare-bar .btn { padding:10px 18px; font-size:.88rem; }
.compare-bar__clear { color:#9FB0C2; font-size:.84rem; font-weight:600; }
.compare-bar__clear:hover { color:#fff; }

/* tabela comparativa */
.compare-table { width:100%; border-collapse: collapse; }
.compare-table th, .compare-table td { padding: 14px 16px; text-align:left; border-bottom:1px solid var(--border); font-size:.92rem; vertical-align: top; }
.compare-table thead th { background: var(--bg); color: var(--primary); font-family: var(--font-display); font-size:1rem; position:sticky; top:0; }
.compare-table tbody th { color: var(--text-medium); font-weight:600; width: 150px; }
.compare-table td b { color: var(--primary); }
.compare-table .win { color: var(--success); font-weight:700; }
.compare-table__wrap { overflow-x:auto; }

/* ====================== TARJA INSTITUCIONAL ====================== */
.portal-band { position: relative; overflow:hidden; background: linear-gradient(120deg,#122338,#1C3553 60%,#2A4E72); color:#fff; }
.portal-band__inner { position:relative; z-index:2; display:grid; grid-template-columns: 1.3fr 1fr; gap: 40px; align-items:center; padding-block: 64px; }
.portal-band::before { content:''; position:absolute; inset:0; opacity:.5; background: radial-gradient(600px 360px at 88% 30%, rgba(200,169,110,.28), transparent 60%); }
.portal-band__grid { position:absolute; inset:0; opacity:.5; background-image: linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size: 46px 46px; mask-image: radial-gradient(ellipse at center, #000 40%, transparent 80%); }
.portal-band h2 { font-size: clamp(1.8rem,3.6vw,2.7rem); color:#fff; }
.portal-band h2 span { color: var(--accent); }
.portal-band p { margin-top: 16px; color:#C7D3E0; font-size:1.08rem; max-width: 560px; }
.portal-band__stats { display:flex; flex-direction:column; gap:14px; }
.portal-stat { display:flex; align-items:center; gap:16px; background: rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius: var(--radius-md); padding: 18px 22px; transition: var(--t); }
.portal-stat:hover { background: rgba(200,169,110,.1); border-color: rgba(200,169,110,.3); transform: translateX(6px); }
.portal-stat svg { width:30px; height:30px; color: var(--accent-light); flex:none; }
.portal-stat b { display:block; font-family: var(--font-display); font-size:1.5rem; color:#fff; line-height:1; }
.portal-stat span { font-size:.86rem; color:#9FB0C2; }

/* ====================== BANNER DE COOKIES (LGPD) ====================== */
.mgp-aviso { position: fixed; left: 18px; right: 18px; bottom: 18px; z-index: 1500; max-width: 720px; margin-inline: auto; background: var(--primary-dark); color:#EAF0F6; border:1px solid rgba(255,255,255,.12); border-radius: var(--radius-lg); box-shadow: var(--shadow-xl); padding: 18px 22px; display:flex; align-items:center; gap: 22px; opacity: 1; transition: opacity .25s ease; }
.mgp-aviso--out { opacity: 0; }
.mgp-aviso__text strong { display:block; color:#fff; font-family: var(--font-display); font-size:1.05rem; margin-bottom:3px; }
.mgp-aviso__text span { font-size:.88rem; color:#B9C6D4; line-height:1.5; }
.mgp-aviso__text a { color: var(--accent-light); text-decoration: underline; }
.mgp-aviso__btns { display:flex; gap:10px; flex:none; }
.mgp-aviso__reject { padding:11px 18px; border-radius: var(--radius-full); border:1.5px solid rgba(255,255,255,.3); color:#EAF0F6; font-weight:700; font-size:.86rem; transition: var(--t-fast); }
.mgp-aviso__reject:hover { background: rgba(255,255,255,.1); }
.mgp-aviso__accept { padding:11px 20px; border-radius: var(--radius-full); background: var(--accent); color: var(--primary-dark); font-weight:700; font-size:.86rem; transition: var(--t-fast); }
.mgp-aviso__accept:hover { background: var(--accent-light); transform: translateY(-2px); }
@media (max-width: 600px) {
  .mgp-aviso { flex-direction:column; align-items:stretch; gap:14px; padding:16px; }
  .mgp-aviso__btns { justify-content:stretch; }
  .mgp-aviso__btns button { flex:1; }
}

@media (max-width: 1024px) {
  .filterbar__row { grid-template-columns: 1fr 1fr; }
  .portal-band__inner { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 768px) {
  .filterbar__row { grid-template-columns: 1fr; }
  .filterbar__search { display:flex; }
  .results-flash { top: 80px; }
  .compare-bar { flex-direction: column; gap:12px; padding:14px; width: calc(100vw - 24px); }
  .compare-bar__thumbs { order:-1; }
  .gallery__thumb { flex-basis: 64px; height:48px; }
  .lightbox__nav { width:44px; height:44px; }
}