/* Design CLONADO da frota geladeira (consertosgeladeiramanaus.com.br): mesmas
   variáveis, classes e componentes (service-card, advantages, cta-24h, faq-item,
   footer em colunas). Componentes de diretório (biz-card, busca, chips) seguem a
   mesma linguagem. Ícones: Font Awesome 6 (mesmo CDN da referência). */
:root {
  --clr-primary: #0057b8; --clr-primary-dark: #003d82; --clr-primary-light: #e8f0fb;
  --clr-accent: #ff5722; --clr-whatsapp: #25d366; --clr-whatsapp-dark: #128c7e;
  --clr-text: #1a1a2e; --clr-text-muted: #5a6273; --clr-border: #dce3f0;
  --clr-bg: #fff; --clr-bg-soft: #f4f7fc; --clr-bg-dark: #0d1b3e;
  --clr-yellow: #ffc107; --clr-green: #2ecc71; --clr-orange: #e67e22;
  --clr-cyan: #0097a7; --clr-purple: #7c3aed; --clr-brown: #795548;
  --radius-sm: 6px; --radius-md: 12px; --radius-lg: 20px;
  --space-section-y: 64px; --space-section-y-mobile: 40px;
  --shadow-sm: 0 2px 8px #00000014; --shadow-md: 0 6px 24px #0000001f; --shadow-lg: 0 16px 48px #00000029;
  --font-base: "Inter", system-ui, -apple-system, sans-serif;
  --fw-regular: 400; --fw-medium: 500; --fw-semi: 600; --fw-bold: 700; --fw-extra: 800;
  --transition: .25s ease; --max-w: 1200px;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--font-base); font-size: 16px; line-height: 1.6; color: var(--clr-text); background: var(--clr-bg); }
.container { width: 100%; max-width: var(--max-w); margin: 0 auto; padding: 0 20px; }
a { color: var(--clr-primary); }
h1 { font-size: clamp(1.7rem, 5vw, 2.6rem); line-height: 1.2; margin: .5rem 0; font-weight: var(--fw-extra); text-wrap: balance; }
h2, .section-title { font-size: clamp(1.4rem, 3vw, 2.25rem); margin: 0 0 .5rem; font-weight: var(--fw-bold); text-wrap: pretty; color: var(--clr-text); }
.muted { color: var(--clr-text-muted); font-size: .92rem; }
main > section { padding: var(--space-section-y-mobile) 0; }
@media (min-width: 768px) { main > section { padding: calc(var(--space-section-y) * .75) 0; } }
.section-header { text-align: center; margin-bottom: 32px; }
.section-header p { color: var(--clr-text-muted); margin: 8px auto 0; max-width: 640px; }

/* ---------- header fixo com blur (idêntico à referência) ---------- */
.header { position: sticky; top: 0; left: 0; right: 0; z-index: 1000; background: #fffffff7; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--clr-border); }
.header__inner { display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; max-width: var(--max-w); margin: 0 auto; }
.logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.logo__icon { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--radius-md); background: var(--clr-primary-light); font-size: 1.25rem; }
.logo__title { display: block; font-weight: var(--fw-extra); color: var(--clr-text); line-height: 1.15; }
.logo__sub { display: block; font-size: .7rem; font-weight: var(--fw-semi); color: var(--clr-text-muted); text-transform: uppercase; letter-spacing: .05em; }
.nav__list { display: none; list-style: none; margin: 0; padding: 0; gap: 22px; }
.nav__list a { text-decoration: none; color: var(--clr-text); font-weight: var(--fw-medium); font-size: .95rem; }
.nav__list a:hover { color: var(--clr-primary); }
@media (min-width: 860px) { .nav__list { display: flex; align-items: center; } }

/* ---------- botões (classes da referência) ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 2px solid transparent; border-radius: var(--radius-md); padding: 14px 28px; font: inherit; font-weight: var(--fw-semi); font-size: 1rem; cursor: pointer; text-decoration: none; text-align: center; transition: var(--transition); white-space: nowrap; }
.btn--primary { background: var(--clr-whatsapp); color: #fff; border-color: var(--clr-whatsapp); }
.btn--primary:hover { background: var(--clr-whatsapp-dark); border-color: var(--clr-whatsapp-dark); }
.btn--accent { background: var(--clr-accent); color: #fff; border-color: var(--clr-accent); box-shadow: var(--shadow-sm); }
.btn--accent:hover { filter: brightness(.94); }
.btn--white { background: #fff; color: var(--clr-primary); border-color: #fff; }
.btn--outline { background: transparent; border-color: #ffffffb3; color: #fff; }
.btn--outline-dark { background: transparent; border-color: var(--clr-primary); color: var(--clr-primary); }
.btn--lg { border-radius: var(--radius-lg); padding: 16px 36px; font-size: 1.1rem; }
.btn--sm { padding: 8px 16px; font-size: .85rem; border-radius: var(--radius-sm); }
.btn-phone { background: var(--clr-green); color: #fff; border-color: var(--clr-green); }
.btn-wa { background: var(--clr-whatsapp); color: #fff; border-color: var(--clr-whatsapp); }
.phone-revealed { display: flex; gap: 10px; flex-wrap: wrap; }

/* ---------- hero (gradiente da referência) ---------- */
.hero { position: relative; display: flex; align-items: center; padding: 72px 0 56px; overflow: visible; }
.hero__bg { position: absolute; inset: 0; z-index: 0; background: linear-gradient(135deg, var(--clr-primary-dark) 0, var(--clr-primary) 60%, #0097a7 100%); }
.hero .container { position: relative; z-index: 1; }
.hero__content { max-width: 640px; }
.hero__title { color: #fff; margin-bottom: 20px; }
.hero__title .highlight { color: #aef3ff; }
.hero__subtitle { color: #ffffffe0; margin-bottom: 32px; font-size: clamp(1.05rem, 2vw, 1.35rem); line-height: 1.6; }
.hero__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
.hero-slim { position: relative; color: #fff; padding: 26px 0 30px; background: linear-gradient(135deg, var(--clr-primary-dark) 0, var(--clr-primary) 60%, #0097a7 100%); }
.hero-slim h1 { color: #fff; margin: .35rem 0 0; }
.hero-slim .crumbs, .hero-slim .crumbs a { color: #ffffffcc; }
.hero-slim .intro { color: #ffffffe0; max-width: 780px; margin: 10px 0 0; font-size: .98rem; }
.crumbs { font-size: .85rem; color: var(--clr-text-muted); }
.crumbs a { color: inherit; }

/* busca (home) */
.search-box { position: relative; max-width: 560px; margin-top: 8px; }
#busca { width: 100%; padding: 16px 18px; font: inherit; font-size: 1rem; border: 0; border-radius: var(--radius-md); box-shadow: var(--shadow-md); }
.search-results { position: absolute; z-index: 5; left: 0; right: 0; top: 100%; background: #fff; border-radius: 0 0 var(--radius-md) var(--radius-md); box-shadow: var(--shadow-md); text-align: left; max-height: 300px; overflow-y: auto; }
.search-results a { display: block; padding: 12px 16px; text-decoration: none; border-bottom: 1px solid var(--clr-border); font-size: .95rem; }
.search-results a:hover { background: var(--clr-bg-soft); }

/* ---------- services (clone .service-card da referência) ---------- */
.services { background: var(--clr-bg); }
.services__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
.service-card { display: flex; flex-direction: column; gap: 12px; padding: 32px 28px; background: var(--clr-bg); border: 1px solid var(--clr-border); border-radius: var(--radius-lg); color: inherit; text-decoration: none; transition: var(--transition); height: 100%; }
.service-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.service-card h3 { margin: 0; font-size: 1.05rem; font-weight: var(--fw-bold); }
.service-card p { margin: 0; color: var(--clr-text-muted); font-size: .93rem; }
.service-card__icon { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: var(--radius-md); color: #fff; font-size: 1.35rem; margin-bottom: 4px; }
.service-card__icon--blue { background: var(--clr-primary); }
.service-card__icon--green { background: var(--clr-green); }
.service-card__icon--orange { background: var(--clr-orange); }
.service-card__icon--cyan { background: var(--clr-cyan); }
.service-card__icon--purple { background: var(--clr-purple); }
.service-card__icon--brown { background: var(--clr-brown); }
.service-card__link { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; color: var(--clr-primary); font-weight: var(--fw-semi); font-size: .9rem; transition: var(--transition); }

/* ---------- advantages (clone) ---------- */
.advantages { background: var(--clr-bg); }
.advantages__grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 640px) { .advantages__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .advantages__grid { grid-template-columns: repeat(4, 1fr); } }
.advantage-card { background: var(--clr-bg-soft); border: 1px solid var(--clr-border); border-radius: var(--radius-lg); text-align: center; padding: 36px 28px; transition: var(--transition); }
.advantage-card:hover { box-shadow: var(--shadow-md); }
.advantage-card__icon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin: 0 auto 20px; border-radius: 50%; background: var(--clr-primary-light); color: var(--clr-primary); font-size: 1.5rem; }
.advantage-card h3 { margin: 0 0 8px; font-size: 1.05rem; }
.advantage-card p { margin: 0; color: var(--clr-text-muted); font-size: .93rem; }

/* ---------- cta-24h full-bleed (clone) ---------- */
.cta-24h { background: linear-gradient(90deg, var(--clr-accent) 0, #ff3d00 100%); text-align: center; color: #fff; }
.cta-24h h2 { color: #fff; }
.cta-24h p { color: #ffffffe0; max-width: 620px; margin: 8px auto 24px; font-size: 1.05rem; }

/* ---------- faq (visual .faq-item da referência, via <details>) ---------- */
.faq { background: var(--clr-bg-soft); }
.faq .faq-list { display: grid; gap: 12px; margin-top: 24px; }
.faq details { background: var(--clr-bg); border: 1px solid var(--clr-border); border-radius: var(--radius-md); transition: var(--transition); }
.faq summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 24px; font-weight: var(--fw-semi); cursor: pointer; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-weight: var(--fw-bold); font-size: 1.2rem; color: var(--clr-primary); transition: var(--transition); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { color: var(--clr-text-muted); padding: 0 24px 20px; margin: 0; font-size: .95rem; line-height: 1.8; }

/* ---------- listagem do diretório (biz-card na linguagem service-card) ---------- */
.listagem { background: var(--clr-bg); }
.biz-list { display: grid; gap: 16px; margin: 20px 0 4px; }
.biz-card { background: var(--clr-bg); border: 1px solid var(--clr-border); border-radius: var(--radius-lg); padding: 26px 28px; transition: var(--transition); }
.biz-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.biz-head { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.biz-card h3 { margin: 0; font-size: 1.1rem; font-weight: var(--fw-bold); }
.biz-card h3 a { color: var(--clr-text); text-decoration: none; }
.biz-bairro { color: var(--clr-text-muted); font-size: .9rem; margin: 4px 0; }
.biz-desc { font-size: .94rem; margin: 8px 0; }
.biz-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.badges { display: flex; gap: 6px; }
.badge { font-size: .72rem; font-weight: var(--fw-bold); padding: 3px 10px; border-radius: 100px; text-decoration: none; }
.badge-wa { background: #e7f9ee; color: var(--clr-whatsapp-dark); }
.badge-maps { background: var(--clr-primary-light); color: var(--clr-primary); }
.lista-sentinela { text-align: center; padding: 10px 0 2px; }

.chip { display: inline-block; border: 1px solid var(--clr-border); background: #fff; border-radius: 100px; padding: 6px 14px; font: inherit; font-size: .82rem; font-weight: var(--fw-semi); cursor: pointer; text-decoration: none; color: var(--clr-primary); transition: var(--transition); }
.chip:hover { border-color: var(--clr-primary); }
.chip-on { background: var(--clr-primary); color: #fff; border-color: var(--clr-primary); }
.bairro-chips { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: .85rem; color: var(--clr-text-muted); margin: 6px 0; }

/* hubs / listas de link */
.city-list { list-style: none; padding: 0; margin: 0; }
.city-list li { padding: 14px 0; border-bottom: 1px solid var(--clr-border); }
.city-cats { display: block; font-size: .9rem; margin-top: 2px; }
.city-cats a { margin-right: 4px; }
.cidades-cols { list-style: none; padding: 0; margin: 16px 0 0; columns: 2; column-gap: 24px; }
.cidades-cols li { padding: 4px 0; break-inside: avoid; font-size: .92rem; }
.cidades-cols a { text-decoration: none; }
@media (min-width: 768px) { .cidades-cols { columns: 3; } }
.related ul { padding-left: 20px; }
.related li { margin: 6px 0; }
.cat-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .cat-grid { grid-template-columns: repeat(3, 1fr); } }

.empty-state { text-align: center; padding: 36px 20px; border: 1px dashed var(--clr-border); border-radius: var(--radius-lg); background: var(--clr-bg-soft); }
.empty-state .btn { margin-top: 12px; }
.how ol { padding-left: 20px; }
.how li { margin: 8px 0; }

.share-block { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 20px 0 0; font-size: .9rem; color: var(--clr-text-muted); }
.moderar-block { display: flex; gap: 16px; flex-wrap: wrap; font-size: .85rem; font-weight: var(--fw-semi); border-top: 1px dashed var(--clr-border); border-bottom: 1px dashed var(--clr-border); padding: 14px 0; margin: 20px 0 0; }
.moderar-block a { text-decoration: none; }

.ad-slot { border: 2px dashed #c9b458; background: #fdf9e7; color: #8a7a1e; text-align: center; padding: 26px 10px; font-size: .8rem; border-radius: var(--radius-sm); margin: 18px auto; max-width: var(--max-w); }
section .ad-slot { margin-left: 0; margin-right: 0; }

.form { display: grid; gap: 14px; max-width: 520px; margin: 8px 0 24px; }
.form label { display: grid; gap: 5px; font-weight: var(--fw-semi); font-size: .9rem; }
.form input, .form select, .form textarea { padding: 12px 14px; border: 1px solid var(--clr-border); border-radius: var(--radius-sm); font: inherit; }
.form input:focus, .form select:focus, .form textarea:focus { outline: 2px solid var(--clr-primary); border-color: var(--clr-primary); }
.hp { position: absolute; left: -9999px; }

/* ---------- footer escuro em colunas (clone) ---------- */
.footer { background: var(--clr-bg-dark); color: #ffffffbf; padding: 56px 0 0; margin-top: 48px; font-size: .92rem; }
.footer a { color: #ffffffd9; text-decoration: none; }
.footer a:hover { color: #fff; }
.footer__grid { display: grid; grid-template-columns: 1fr; gap: 32px; margin-bottom: 40px; }
@media (min-width: 768px) { .footer__grid { grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px; } }
.footer__col h4 { font-size: .95rem; font-weight: var(--fw-semi); color: #fff; margin: 0 0 16px; }
.footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.footer__brand .logo__title, .footer__brand .logo__sub { color: #fff; }
.footer__brand p { margin: 12px 0 0; color: #ffffff99; }
.footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; border-top: 1px solid #ffffff1a; padding: 24px 0; color: #ffffff80; }