/* =========================================================
   DAQUI — Portal da Cidade
   Design tokens: warm daylight neutrals + cobalt/marigold signal colors
   Display: Fraunces (institutional warmth) / Body: Inter / Data: JetBrains Mono
   ========================================================= */

:root{
  /* --- surfaces --- */
  --bg:            #FAF9F4;
  --bg-alt:        #F1EEE3;
  --surface:       #FFFFFF;
  --surface-sunk:  #F5F3EC;

  /* --- ink --- */
  --ink:           #15181F;
  --ink-soft:      #565E6C;
  --ink-faint:     #8A8F7B;
  --ink-faint-2:   #9AA0AC;
  --border:        #E6E2D4;
  --border-strong: #D6D1BE;

  /* --- brand: cobalt (trust / civic / action) --- */
  --brand:         #2748FF;
  --brand-dark:    #16257A;
  --brand-soft:    #E8EBFF;
  --brand-soft-2:  #DCE1FF;

  /* --- signal: marigold (offers / highlights / energy) --- */
  --accent:        #F5A522;
  --accent-dark:   #8A5A0A;
  --accent-soft:   #FDECC8;

  /* --- status --- */
  --success:       #1C8F63;
  --success-soft:  #E0F3E9;
  --danger:        #D6483F;
  --danger-soft:   #FBE5E2;

  /* --- shape --- */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-pill: 999px;

  /* --- elevation --- */
  --shadow-sm: 0 1px 2px rgba(21,24,31,.06), 0 1px 1px rgba(21,24,31,.04);
  --shadow-md: 0 8px 24px rgba(21,24,31,.08), 0 2px 6px rgba(21,24,31,.05);
  --shadow-lg: 0 20px 48px rgba(21,24,31,.14), 0 6px 16px rgba(21,24,31,.06);

  --container: 1140px;
}

@media (prefers-color-scheme: dark){
  :root{ /* prototype stays light-mode only, by design brief */ }
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{
  font-family:'DM Sans',Georgia,sans-serif;
  font-weight:600;
  line-height:1.12;
  margin:0 0 .4em;
  letter-spacing:-.01em;
  color:var(--ink);
}
h1{ font-size:clamp(2.1rem,4vw,3.4rem); font-weight:560; }
h2{ font-size:clamp(1.5rem,2.6vw,2.2rem); }
h3{ font-size:1.25rem; }
p{ margin:0 0 1em; color:var(--ink-soft); }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; }
.mono{ font-family:'DM Sans',ui-monospace,monospace; }

::selection{ background:var(--brand-soft-2); color:var(--brand-dark); }

:focus-visible{
  outline:2.5px solid var(--brand);
  outline-offset:2px;
  border-radius:4px;
}

.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }
.section{ padding:64px 0; }
.section--tight{ padding:40px 0; }
.section--alt{ background:var(--bg-alt); }
.section--dark{ background:var(--brand-dark); color:#fff; }
.section--dark p{ color:#C7CFFF; }
.section--dark h2,.section--dark h3{ color:#fff; }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'DM Sans',monospace;
  font-size:.72rem; letter-spacing:.10em; text-transform:uppercase;
  color:var(--brand); font-weight:600; margin-bottom:14px;
}
.eyebrow::before{ content:''; width:16px; height:2px; background:var(--brand); border-radius:2px; }

.section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:32px; flex-wrap:wrap; }
.section-head p{ max-width:52ch; margin:0; }
.section-head .link-more{ white-space:nowrap; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 22px; border-radius:var(--r-pill);
  font-weight:600; font-size:.92rem; border:1.5px solid transparent;
  cursor:pointer; transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
  white-space:nowrap;
}
.btn svg{ width:18px; height:18px; flex-shrink:0; }
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:var(--brand); color:#fff; box-shadow:var(--shadow-sm); }
.btn-primary:hover{ background:#1E3AE0; box-shadow:var(--shadow-md); }
.btn-accent{ background:var(--accent); color:#2B1C02; }
.btn-accent:hover{ background:#E39412; }
.btn-outline{ background:transparent; border-color:var(--border-strong); color:var(--ink); }
.btn-outline:hover{ border-color:var(--brand); color:var(--brand); }
.btn-ghost{ background:transparent; color:var(--ink-soft); padding:13px 16px; }
.btn-ghost:hover{ color:var(--ink); background:var(--surface-sunk); }
.btn-sm{ padding:9px 14px; font-size:.82rem; }
.btn-block{ width:100%; }
.btn-white{ background:#fff; color:var(--brand-dark); }
.btn-white:hover{ background:var(--brand-soft); }

.link-more{ font-weight:600; font-size:.9rem; color:var(--brand); display:inline-flex; align-items:center; gap:6px; }
.link-more svg{ width:16px; height:16px; transition:transform .15s ease; }
.link-more:hover svg{ transform:translateX(3px); }

/* ---------- header / nav ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(250,249,244,.88); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.header-row{ display:flex; align-items:center; gap:12px; height:76px; }
.logo{ display:flex; align-items:center; gap:10px; font-family:'DM Sans',serif; font-weight:650; font-size:1.35rem; color:var(--ink); flex-shrink:0; }
.logo .dot{ color:var(--accent); }
.logo-mark{ width:34px; height:34px; border-radius:10px; background:var(--brand); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.logo-mark svg{ width:19px; height:19px; color:#fff; }

.city-chip{
  display:flex; align-items:center; gap:6px; padding:7px 14px 7px 10px;
  border:1px solid var(--border-strong); border-radius:var(--r-pill);
  font-size:.82rem; font-weight:600; color:var(--ink-soft); flex-shrink:0;
  cursor:pointer; background:var(--surface);
}
.city-chip svg{ width:15px; height:15px; color:var(--brand); }
.city-chip:hover{ border-color:var(--brand); color:var(--ink); }

.main-nav{ display:flex; align-items:center; gap:2px; margin-left:4px; flex:1; }
.main-nav a{ padding:10px 9px; border-radius:var(--r-pill); font-size:.88rem; font-weight:500; color:var(--ink-soft); white-space:nowrap; }
.main-nav a:hover{ color:var(--ink); background:var(--surface-sunk); }
.main-nav a.active{ color:var(--brand); background:var(--brand-soft); }

.header-actions{ display:flex; align-items:center; gap:8px; flex-shrink:0; }
.icon-btn{
  width:36px; height:36px; border-radius:var(--r-pill); display:flex; align-items:center; justify-content:center;
  border:1px solid var(--border-strong); background:var(--surface); color:var(--ink-soft); cursor:pointer; position:relative;
}
.icon-btn svg{ width:16px; height:16px; }
.icon-btn:hover{ border-color:var(--brand); color:var(--brand); }
.icon-btn .dot-badge{ position:absolute; top:-3px; right:-3px; width:9px; height:9px; border-radius:50%; background:var(--accent); border:2px solid var(--bg); }

.nav-toggle{ display:none; }

.subnav{
  display:flex; gap:8px; overflow-x:auto; padding:12px 0; border-top:1px solid var(--border);
  scrollbar-width:none;
}
.subnav::-webkit-scrollbar{ display:none; }
.subnav a{
  padding:8px 15px; border-radius:var(--r-pill); font-size:.84rem; font-weight:600;
  color:var(--ink-soft); background:var(--surface-sunk); white-space:nowrap; border:1px solid transparent;
}
.subnav a:hover{ color:var(--ink); }
.subnav a.active{ background:var(--brand); color:#fff; }

/* ---------- breadcrumb ---------- */
.breadcrumb{ display:flex; align-items:center; gap:8px; font-size:.82rem; color:var(--ink-faint-2); margin-bottom:18px; flex-wrap:wrap; }
.breadcrumb a:hover{ color:var(--brand); }
.breadcrumb svg{ width:13px; height:13px; }

/* ---------- hero / search ---------- */
.hero{ padding:76px 0 60px; position:relative; overflow:hidden; }
.hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center; }
.hero h1{ margin-bottom:18px; }
.hero .lede{ font-size:1.12rem; max-width:46ch; }
.hero-badges{ display:flex; gap:10px; flex-wrap:wrap; margin-top:22px; }
.hero-badge{ display:flex; align-items:center; gap:7px; font-size:.8rem; font-weight:600; color:var(--ink-soft); background:var(--surface); border:1px solid var(--border); padding:7px 13px; border-radius:var(--r-pill); }
.hero-badge svg{ width:14px; height:14px; color:var(--success); }

.omnisearch{
  background:var(--surface); border:1.5px solid var(--border-strong); border-radius:var(--r-lg);
  padding:8px; box-shadow:var(--shadow-lg); display:flex; align-items:center; gap:8px;
}
.omnisearch-icon{ width:44px; height:44px; border-radius:var(--r-md); background:var(--brand-soft); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.omnisearch-icon svg{ width:20px; height:20px; color:var(--brand); }
.omnisearch input{
  flex:1; border:none; outline:none; background:transparent; font-size:1.02rem; color:var(--ink); font-family:inherit; min-width:0;
}
.omnisearch input::placeholder{ color:var(--ink-faint-2); }
.omnisearch .btn{ flex-shrink:0; }
.search-caption{ font-size:.82rem; color:var(--ink-faint-2); margin:12px 4px 0; display:flex; align-items:center; gap:6px; }
.search-caption b{ color:var(--ink-soft); font-weight:600; }

.hero-visual{ position:relative; }
.stat-card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:22px;
  box-shadow:var(--shadow-md); display:flex; align-items:center; gap:16px;
}
.stat-card + .stat-card{ margin-top:14px; }
.stat-card .num{ font-family:'DM Sans',serif; font-size:2rem; font-weight:600; color:var(--brand); line-height:1; }
.stat-icon{ width:46px; height:46px; border-radius:var(--r-md); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stat-icon svg{ width:22px; height:22px; }

/* quick services row */
.quick-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.quick-card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md);
  padding:20px 14px; text-align:center; transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.quick-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:var(--brand-soft-2); }
.quick-card .qi{ width:42px; height:42px; border-radius:var(--r-sm); background:var(--brand-soft); color:var(--brand); display:flex; align-items:center; justify-content:center; margin:0 auto 12px; }
.quick-card .qi svg{ width:21px; height:21px; }
.quick-card span{ font-size:.82rem; font-weight:600; color:var(--ink-soft); }

/* ---------- category grid ---------- */
.cat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.cat-card{
  position:relative; border-radius:var(--r-lg); padding:26px 22px; min-height:132px;
  display:flex; flex-direction:column; justify-content:space-between; overflow:hidden;
  border:1px solid var(--border); background:var(--surface);
  transition:transform .15s ease, box-shadow .15s ease;
}
.cat-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.cat-card .ci{ width:38px; height:38px; color:var(--brand); }
.cat-card .ci svg{ width:100%; height:100%; }
.cat-card h4{ font-family:'DM Sans',sans-serif; font-weight:700; font-size:1rem; margin:0; }
.cat-card .count{ font-size:.78rem; color:var(--ink-faint-2); font-family:'DM Sans',monospace; }

/* ---------- home nav menu (simple destination tiles) ---------- */
.hero--simple{ padding:60px 0 44px; text-align:center; }
.hero--simple .omnisearch{ max-width:640px; margin:26px auto 0; }
.hero--simple .search-caption{ justify-content:center; }
.hero--simple .lede{ margin:0 auto; }

.nav-menu-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.nav-tile{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
  padding:24px; display:flex; flex-direction:column; gap:12px; position:relative;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.nav-tile:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--brand-soft-2); }
.nav-tile .nt-icon{ width:48px; height:48px; border-radius:var(--r-md); background:var(--brand-soft); color:var(--brand); display:flex; align-items:center; justify-content:center; }
.nav-tile .nt-icon svg{ width:23px; height:23px; }
.nav-tile h3{ font-family:'DM Sans',sans-serif; font-weight:700; font-size:1rem; margin:0; }
.nav-tile p{ font-size:.82rem; margin:0; color:var(--ink-soft); }
.nav-tile .nt-arrow{ position:absolute; top:24px; right:22px; color:var(--ink-faint-2); transition:transform .15s ease, color .15s ease; }
.nav-tile .nt-arrow svg{ width:16px; height:16px; }
.nav-tile:hover .nt-arrow{ color:var(--brand); transform:translate(3px,-3px); }
.nav-tile.featured{ background:var(--brand); border-color:var(--brand); }
.nav-tile.featured .nt-icon{ background:rgba(255,255,255,.16); color:#fff; }
.nav-tile.featured h3{ color:#fff; }
.nav-tile.featured p{ color:#C7CFFF; }
.nav-tile.featured .nt-arrow{ color:#fff; }
.nav-tile.featured--accent{ background:var(--accent); border-color:var(--accent); }
.nav-tile.featured--accent .nt-icon{ background:rgba(43,28,2,.14); color:#2B1C02; }
.nav-tile.featured--accent h3{ color:#2B1C02; }
.nav-tile.featured--accent p{ color:#6B4A10; }
.nav-tile.featured--accent .nt-arrow{ color:#2B1C02; }

/* ---------- cards: business / professional ---------- */
.card-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.card-row.cols-3{ grid-template-columns:repeat(3,1fr); }
.card-row.cols-2{ grid-template-columns:repeat(2,1fr); }

.biz-card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden;
  transition:transform .15s ease, box-shadow .15s ease; display:flex; flex-direction:column;
}
.biz-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.biz-thumb{
  height:132px; position:relative; display:flex; align-items:center; justify-content:center;
  font-family:'DM Sans',serif; font-weight:600; font-size:1.8rem; color:#fff;
}
.biz-thumb .fav{
  position:absolute; top:10px; right:10px; width:32px; height:32px; border-radius:50%;
  background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; cursor:pointer;
  border:none; color:var(--ink-soft);
}
.biz-thumb .fav svg{ width:16px; height:16px; }
.biz-thumb .fav.is-active{ color:var(--danger); }
.biz-thumb .fav.is-active svg{ fill:var(--danger); }
.biz-thumb .badge-verified{
  position:absolute; bottom:10px; left:10px; display:flex; align-items:center; gap:5px;
  background:rgba(21,24,31,.55); color:#fff; font-size:.68rem; font-weight:700; padding:4px 9px; border-radius:var(--r-pill);
  backdrop-filter:blur(4px);
}
.biz-thumb .badge-verified svg{ width:11px; height:11px; color:var(--accent); }
.biz-body{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:8px; flex:1; }
.biz-cat{ font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--brand); }
.biz-body h3{ font-family:'DM Sans',sans-serif; font-weight:700; font-size:1.02rem; margin:0; }
.biz-meta{ display:flex; align-items:center; gap:6px; font-size:.82rem; color:var(--ink-faint-2); }
.biz-meta svg{ width:13px; height:13px; }
.biz-rating{ display:flex; align-items:center; gap:5px; font-size:.84rem; font-weight:700; color:var(--ink); }
.biz-rating svg{ width:14px; height:14px; color:var(--accent); }
.biz-rating span{ color:var(--ink-faint-2); font-weight:500; }
.biz-status{ display:flex; align-items:center; gap:6px; font-size:.78rem; font-weight:600; }
.biz-status.open{ color:var(--success); }
.biz-status.closed{ color:var(--ink-faint-2); }
.biz-status .dot{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.biz-actions{ display:flex; gap:8px; margin-top:auto; padding-top:10px; }
.biz-actions .btn{ flex:1; padding:9px 10px; font-size:.8rem; }

/* thumb color variants */
.t1{ background:linear-gradient(135deg,#2748FF,#5A73FF); }
.t2{ background:linear-gradient(135deg,#1C8F63,#33B784); }
.t3{ background:linear-gradient(135deg,#F5A522,#F0821E); }
.t4{ background:linear-gradient(135deg,#D6483F,#E5695F); }
.t5{ background:linear-gradient(135deg,#7A4CD6,#9A6FE0); }
.t6{ background:linear-gradient(135deg,#16257A,#2748FF); }
.t7{ background:linear-gradient(135deg,#0E9AA5,#39C2CC); }
.t8{ background:linear-gradient(135deg,#B5852A,#D6A94B); }

/* ---------- filter bar ---------- */
.filter-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:16px; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md); margin-bottom:26px; }
.filter-bar .fb-search{ flex:1; min-width:220px; display:flex; align-items:center; gap:8px; background:var(--surface-sunk); border-radius:var(--r-pill); padding:9px 14px; }
.filter-bar .fb-search svg{ width:16px; height:16px; color:var(--ink-faint-2); flex-shrink:0; }
.filter-bar .fb-search input{ border:none; background:none; outline:none; font-size:.9rem; width:100%; font-family:inherit; }
.chip{
  display:inline-flex; align-items:center; gap:6px; padding:9px 15px; border-radius:var(--r-pill);
  border:1px solid var(--border-strong); background:var(--surface); font-size:.83rem; font-weight:600; color:var(--ink-soft);
  cursor:pointer; white-space:nowrap;
}
.chip svg{ width:14px; height:14px; }
.chip:hover{ border-color:var(--brand); color:var(--ink); }
.chip.active{ background:var(--ink); border-color:var(--ink); color:#fff; }
.chip.active--brand{ background:var(--brand); border-color:var(--brand); color:#fff; }

/* ---------- badges/pills/labels ---------- */
.badge{ display:inline-flex; align-items:center; gap:5px; font-size:.72rem; font-weight:700; padding:4px 10px; border-radius:var(--r-pill); }
.badge-success{ background:var(--success-soft); color:var(--success); }
.badge-accent{ background:var(--accent-soft); color:var(--accent-dark); }
.badge-brand{ background:var(--brand-soft); color:var(--brand); }
.badge-danger{ background:var(--danger-soft); color:var(--danger); }
.badge-neutral{ background:var(--surface-sunk); color:var(--ink-soft); }

/* ---------- promo strip ---------- */
.promo-card{
  border-radius:var(--r-lg); padding:22px; position:relative; overflow:hidden; min-height:170px;
  display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--border);
}
.promo-card .expires{ font-family:'DM Sans',monospace; font-size:.72rem; }
.promo-card h4{ font-family:'DM Sans',serif; font-size:1.3rem; margin:6px 0 4px; }
.promo-card .from{ font-size:.8rem; color:var(--ink-faint-2); }

/* ---------- generic list rows (jobs, classifieds) ---------- */
.list-row{
  display:flex; align-items:center; gap:18px; padding:18px 20px; background:var(--surface);
  border:1px solid var(--border); border-radius:var(--r-md); transition:box-shadow .15s ease, transform .15s ease;
}
.list-row:hover{ box-shadow:var(--shadow-sm); transform:translateY(-1px); }
.list-row + .list-row{ margin-top:10px; }
.list-icon{ width:48px; height:48px; border-radius:var(--r-md); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.list-icon svg{ width:22px; height:22px; }
.list-main{ flex:1; min-width:0; }
.list-main h4{ font-family:'DM Sans',sans-serif; font-size:.98rem; font-weight:700; margin:0 0 4px; }
.list-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
.list-price{ font-family:'DM Sans',serif; font-weight:600; font-size:1.15rem; color:var(--ink); white-space:nowrap; }

/* ---------- classificados: ad cards ---------- */
.ad-icon{ width:44px; height:44px; color:#fff; }
.ad-title{ font-family:'DM Sans',sans-serif; font-weight:700; font-size:1rem; margin:0; }
.ad-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:12px; border-top:1px solid var(--border); }
.ad-date{ font-size:.74rem; color:var(--ink-faint-2); font-family:'DM Sans',monospace; }
.ad-price{ font-family:'DM Sans',serif; font-weight:700; font-size:1.1rem; color:var(--ink); white-space:nowrap; }

/* ---------- classificado: detail page ---------- */
.ad-detail-grid{ display:grid; grid-template-columns:1.35fr .9fr; gap:40px; align-items:start; }
.ad-gallery-main{ height:360px; border-radius:var(--r-lg); display:flex; align-items:center; justify-content:center; position:relative; cursor:zoom-in; }
.ad-gallery-main .ad-icon{ width:72px; height:72px; }
.ad-gallery-main .fav{ position:absolute; top:14px; right:14px; }
.ad-gallery-thumbs{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:10px; }
.ad-gallery-thumbs .ad-thumb-sm{ height:64px; border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:.8; }
.ad-gallery-thumbs .ad-thumb-sm.active{ opacity:1; outline:2px solid var(--brand); outline-offset:2px; }
.ad-gallery-thumbs .ad-thumb-sm svg{ width:22px; height:22px; }
.ad-price-lg{ font-family:'DM Sans',serif; font-weight:700; font-size:2rem; color:var(--brand); margin:8px 0 16px; }
.ad-info-meta{ display:flex; flex-wrap:wrap; gap:16px; font-size:.84rem; color:var(--ink-faint-2); margin:14px 0 18px; padding:14px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.ad-info-meta span{ display:flex; align-items:center; gap:6px; }
.ad-info-meta svg{ width:15px; height:15px; }
.seller-row{ display:flex; align-items:center; gap:12px; }
.seller-avatar{ width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; flex-shrink:0; }
.seller-name{ font-weight:700; font-size:.92rem; color:var(--ink); }
.seller-since{ font-size:.78rem; color:var(--ink-faint-2); }

/* ---------- lightbox: imagem ampliada ---------- */
.lightbox{
  position:fixed; inset:0; z-index:300; display:none; align-items:center; justify-content:center; padding:40px;
  background:rgba(15,17,23,.82); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
}
.lightbox.is-open{ display:flex; }
.lightbox-image{
  width:100%; max-width:820px; height:min(70vh,640px); border-radius:var(--r-lg);
  display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-lg);
}
.lightbox-icon{ width:120px; height:120px; }
.lightbox-close{
  position:absolute; top:24px; right:24px; width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.28); color:#fff;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.lightbox-close:hover{ background:rgba(255,255,255,.22); }
.lightbox-close svg{ width:18px; height:18px; }

/* ---------- sidebar / two-col layouts ---------- */
.layout-2col{ display:grid; grid-template-columns:1fr 320px; gap:32px; align-items:start; }
.side-box{ background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; }
.side-box + .side-box{ margin-top:20px; }
.side-box h4{ font-size:.95rem; margin-bottom:14px; }

/* ---------- formulários (cadastro, publicar anúncio, etc.) ---------- */
input[type="text"], input[type="email"], input[type="password"], input[type="tel"],
input[type="number"], input[type="search"], textarea, select{
  width:100%; padding:10px 14px; border:1px solid var(--border-strong); border-radius:var(--r-sm);
  background:var(--surface); color:var(--ink); font-family:'DM Sans',sans-serif; font-size:.9rem;
}
textarea{ min-height:110px; resize:vertical; }
input:focus, textarea:focus, select:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-soft-2); }

/* ---------- forms ---------- */
.field{ margin-bottom:16px; }
.field label{ display:block; font-size:.82rem; font-weight:600; color:var(--ink-soft); margin-bottom:7px; }
.field input,.field select,.field textarea{
  width:100%; padding:11px 14px; border:1.5px solid var(--border-strong); border-radius:var(--r-sm);
  font-family:inherit; font-size:.92rem; background:var(--surface); color:var(--ink); outline:none;
  transition:border-color .15s ease;
}
.field input:focus,.field select:focus,.field textarea:focus{ border-color:var(--brand); }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.checkline{ display:flex; align-items:center; gap:9px; font-size:.86rem; color:var(--ink-soft); }

/* ---------- tables (admin) ---------- */
.data-table{ width:100%; border-collapse:collapse; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; }
.data-table th{ text-align:left; font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-faint-2); padding:13px 16px; background:var(--surface-sunk); font-weight:700; }
.data-table td{ padding:14px 16px; border-top:1px solid var(--border); font-size:.87rem; }
.data-table tr:hover td{ background:var(--surface-sunk); }
.row-entity{ display:flex; align-items:center; gap:10px; }
.row-avatar{ width:34px; height:34px; border-radius:9px; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:.78rem; }

/* ---------- dashboard stat tiles ---------- */
.tile-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.tile{ background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; }
.tile .tile-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.tile .tile-icon{ width:38px; height:38px; border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; }
.tile .tile-icon svg{ width:18px; height:18px; }
.tile .num{ font-family:'DM Sans',serif; font-size:1.9rem; font-weight:600; }
.tile .lbl{ font-size:.82rem; color:var(--ink-faint-2); }
.tile .delta{ font-size:.76rem; font-weight:700; display:inline-flex; align-items:center; gap:3px; margin-top:6px; }
.tile .delta.up{ color:var(--success); }
.tile .delta.down{ color:var(--danger); }

/* ---------- dash shell (admin/company panel) ---------- */
.dash-shell{ display:grid; grid-template-columns:238px 1fr; min-height:calc(100vh - 76px); }
.dash-side{ background:var(--surface); border-right:1px solid var(--border); padding:24px 14px; }
.dash-side .dside-group{ margin-bottom:22px; }
.dash-side .dside-label{ font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-faint-2); font-weight:700; padding:0 10px; margin-bottom:8px; }
.dash-side a{ display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:var(--r-sm); font-size:.87rem; font-weight:600; color:var(--ink-soft); margin-bottom:2px; }
.dash-side a svg{ width:17px; height:17px; }
.dash-side a:hover{ background:var(--surface-sunk); color:var(--ink); }
.dash-side a.active{ background:var(--brand-soft); color:var(--brand); }
.dash-main{ padding:32px 36px; background:var(--bg); }
.dash-headline{ display:flex; align-items:center; justify-content:space-between; margin-bottom:26px; flex-wrap:wrap; gap:14px; }

/* ---------- calendar (events) ---------- */
.cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:8px; }
.cal-day{ aspect-ratio:1/.82; border:1px solid var(--border); border-radius:var(--r-sm); padding:8px; font-size:.78rem; color:var(--ink-faint-2); background:var(--surface); position:relative; }
.cal-day.has-event{ border-color:var(--brand-soft-2); }
.cal-day .dnum{ font-weight:700; color:var(--ink); }
.cal-day .devt{ margin-top:5px; font-size:.66rem; font-weight:700; padding:2px 6px; border-radius:5px; background:var(--brand-soft); color:var(--brand); display:block; }
.cal-day.today{ background:var(--brand); }
.cal-day.today .dnum{ color:#fff; }

/* ---------- news ---------- */
.news-card{ display:flex; gap:16px; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md); padding:16px; }
.news-thumb{ width:110px; height:80px; border-radius:var(--r-sm); flex-shrink:0; }
.news-card h4{ font-size:.95rem; margin-bottom:4px; }
.news-meta{ font-size:.74rem; color:var(--ink-faint-2); font-family:'DM Sans',monospace; }

/* ---------- footer ---------- */
.site-footer{ background:var(--ink); color:#C8CBD6; padding:60px 0 26px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:32px; margin-bottom:44px; }
.footer-grid h5{ color:#fff; font-size:.82rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:16px; font-weight:700; }
.footer-grid a{ display:block; color:#9AA0B2; font-size:.87rem; margin-bottom:10px; }
.footer-grid a:hover{ color:#fff; }
.site-footer .logo{ color:#fff; margin-bottom:14px; }
.site-footer .foot-desc{ font-size:.87rem; color:#9AA0B2; max-width:34ch; }
.foot-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:26px; border-top:1px solid rgba(255,255,255,.1); font-size:.8rem; color:#7C8194; flex-wrap:wrap; gap:12px; }
.foot-social{ display:flex; gap:10px; }
.foot-social a{ width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; }
.foot-social a svg{ width:15px; height:15px; }

/* ---------- CTA band ---------- */
.cta-band{
  background:var(--brand); border-radius:var(--r-lg); padding:44px 48px; display:flex; align-items:center;
  justify-content:space-between; gap:24px; flex-wrap:wrap; position:relative; overflow:hidden;
}
.cta-band h2,.cta-band p{ color:#fff; margin:0; }
.cta-band p{ color:#C7CFFF; margin-top:6px; max-width:44ch; }
.cta-actions{ display:flex; gap:12px; flex-wrap:wrap; }

/* ---------- empty state ---------- */
.empty-state{ text-align:center; padding:70px 20px; }
.empty-state .ei{ width:64px; height:64px; margin:0 auto 18px; color:var(--ink-faint-2); }
.empty-state .ei svg{ width:100%; height:100%; }
.empty-state h3{ margin-bottom:8px; }
.empty-state p{ max-width:40ch; margin:0 auto 20px; }

/* ---------- pagination ---------- */
.pagination{ display:flex; align-items:center; justify-content:center; gap:6px; margin-top:36px; }
.pagination a{ width:38px; height:38px; display:flex; align-items:center; justify-content:center; border-radius:var(--r-sm); font-size:.85rem; font-weight:700; color:var(--ink-soft); border:1px solid var(--border); background:var(--surface); }
.pagination a.active{ background:var(--brand); color:#fff; border-color:var(--brand); }
.pagination a:hover:not(.active){ border-color:var(--brand); color:var(--brand); }

/* ---------- utility ---------- */
.mt-0{margin-top:0} .mb-0{margin-bottom:0}
.text-center{ text-align:center; }
.stack{ display:flex; flex-direction:column; }
.gap-8{ gap:8px; } .gap-12{ gap:12px; } .gap-16{ gap:16px; }
.tag-scroller{ display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; scrollbar-width:none; }
.tag-scroller::-webkit-scrollbar{ display:none; }

/* ================= responsive ================= */
@media (max-width:1080px){
  .ad-detail-grid{ grid-template-columns:1fr; }
  .hero-grid{ grid-template-columns:1fr; gap:40px; }
  .card-row{ grid-template-columns:repeat(3,1fr); }
  .card-row.cols-3{ grid-template-columns:repeat(2,1fr); }
  .cat-grid{ grid-template-columns:repeat(3,1fr); }
  .quick-grid{ grid-template-columns:repeat(4,1fr); }
  .footer-grid{ grid-template-columns:1.2fr 1fr 1fr; }
  .layout-2col{ grid-template-columns:1fr; }
  .dash-shell{ grid-template-columns:210px 1fr; }
  .tile-grid{ grid-template-columns:repeat(2,1fr); }
  .nav-menu-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:1140px){
  .main-nav{ display:none; }
  .nav-toggle{ display:flex; }
}
@media (max-width:760px){
  .city-chip span{ display:none; }
  .header-only-lg{ display:none; }
  .card-row,.card-row.cols-3,.card-row.cols-2{ grid-template-columns:repeat(2,1fr); }
  .cat-grid{ grid-template-columns:repeat(2,1fr); }
  .quick-grid{ grid-template-columns:repeat(3,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .dash-shell{ grid-template-columns:1fr; }
  .dash-side{ display:none; }
  .field-row{ grid-template-columns:1fr; }
  .cta-band{ padding:32px 26px; flex-direction:column; align-items:flex-start; }
  .cal-grid{ grid-template-columns:repeat(7,minmax(38px,1fr)); font-size:.7rem; }
  .tile-grid{ grid-template-columns:1fr 1fr; }
  .subnav{ padding:10px 0; }
  .nav-menu-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px){
  .card-row,.card-row.cols-3,.card-row.cols-2{ grid-template-columns:1fr 1fr; }
  .cat-grid{ grid-template-columns:1fr 1fr; }
  .quick-grid{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .news-card{ flex-direction:column; }
  .news-thumb{ width:100%; height:140px; }
}

/* ---------- mobile nav drawer ---------- */
.mobile-drawer{
  position:fixed; inset:0; background:rgba(21,24,31,.5); z-index:200; display:none;
}
.mobile-drawer.is-open{ display:block; }
.mobile-drawer .panel{
  position:absolute; top:0; right:0; width:82%; max-width:340px; height:100%; background:var(--surface);
  padding:26px 22px; overflow-y:auto;
}
.mobile-drawer nav a{ display:block; padding:14px 4px; font-weight:600; font-size:1.02rem; border-bottom:1px solid var(--border); }
.mobile-drawer .close-drawer{ margin-bottom:20px; }