/* ===========================
   VARIÁVEIS DE TEMA — CLARO (sem preto)
   =========================== */
:root{
  /* Paleta da prefeitura */
  --amarelo:#FFD23F;   /* amarelo sol */
  --laranja:#FF9800;   /* laranja sol */
  --rosa:#E6538E;      /* rosa */
  --verde:#4CAF50;     /* verde */
  --azul:#29B6F6;      /* azul */

  /* Fundos claros */
  --bg:#FFFFFF;        /* fundo principal */
  --paper:#F9FAFB;     /* cartões/painéis */
  --paper-soft:#F3F6FA;/* gradiente suave */

  /* Texto */
  --text:#1A1A1A;
  --muted:#606B7A;

  /* Tints (chips/badges) */
  --tint-rosa:#FFE8F1;
  --tint-amarelo:#FFF6D6;
  --tint-azul:#E7F7FF;
  --tint-verde:#EAF9EF;

  /* Sombras suaves (sem tom preto) */
  --shadow-1:0 6px 18px rgba(17,24,39,.06);
  --shadow-rosa:0 10px 24px rgba(230,83,142,.18);
  --shadow-amarelo:0 10px 24px rgba(255,210,63,.18);
}

/* ===========================
   RESET
   =========================== */
*{box-sizing:border-box}
html,body{margin:0;padding:0}

/* ===========================
   BODY
   =========================== */
body{
  font-family:Inter,Arial,system-ui;
  background:
    radial-gradient(1200px 600px at 0% 0%, rgba(230,83,142,.08), transparent 50%),
    radial-gradient(1000px 800px at 100% 10%, rgba(255,210,63,.07), transparent 55%),
    var(--bg);
  color:var(--text);
  line-height:1.55;
}

/* ===========================
   CONTAINER
   =========================== */
.container{max-width:1200px;margin:0 auto;padding:0 22px}

/* ===========================
   NAVBAR
   =========================== */
.navbar{
  position:sticky;top:0;z-index:50;
  background:linear-gradient(90deg, rgba(255,255,255,.92), rgba(255,255,255,.88));
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(17,24,39,.06);
}
.navbar .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;gap:12px;align-items:center;color:var(--rosa);text-decoration:none;font-weight:800;letter-spacing:.2px}
.brand .logo{
  width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:18px;color:#000;
  background:conic-gradient(from 200deg,var(--amarelo),#ffa726,var(--rosa));
  box-shadow:var(--shadow-amarelo);
}
.navlinks a{
  color:var(--text);text-decoration:none;font-weight:700;padding:12px 10px;border-radius:10px;opacity:.85
}
.navlinks a:hover{opacity:1;background:var(--tint-rosa)}

/* ===========================
   FOOTER
   =========================== */
.footer{
  margin-top:48px;
  background:linear-gradient(180deg, var(--paper-soft), var(--bg));
  color:#334155;
  padding:26px 0;
  border-top:1px solid rgba(17,24,39,.06);
}

/* ===========================
   HERO
   =========================== */
.hero{margin:32px 0;display:grid;gap:22px;grid-template-columns:1.15fr .85fr;align-items:stretch}
.stamp{
  display:inline-block;background:rgba(230,83,142,.12);color:#8A1B4A;
  padding:6px 12px;border-radius:999px;font-weight:800;letter-spacing:.3px;border:1px solid rgba(230,83,142,.35)
}

/* ===========================
   PAINÉIS & CARDS
   =========================== */
.panel{
  background:linear-gradient(180deg,var(--paper),var(--paper-soft));
  border:1px solid rgba(17,24,39,.06);
  border-radius:16px;padding:22px;box-shadow:var(--shadow-1)
}
.card{
  background:linear-gradient(180deg,var(--paper),var(--paper-soft));
  border:1px solid rgba(17,24,39,.06);
  border-radius:16px;padding:16px;box-shadow:var(--shadow-1)
}
.card h3,.card h4{margin:8px 0}

/* ===========================
   TIPOGRAFIA
   =========================== */
h1{font-size:36px;margin:10px 0 6px}
p.lead{color:var(--muted);margin:0}
.small{font-size:12px;color:var(--muted)}

/* ===========================
   BOTÕES
   =========================== */
.btn{
  display:inline-block;padding:12px 16px;border-radius:12px;text-decoration:none;font-weight:800;
  background:linear-gradient(90deg,var(--rosa),#ff7baf);color:#fff;box-shadow:var(--shadow-rosa)
}
.btn.alt{
  background:linear-gradient(90deg,var(--amarelo),#ffc65c);color:#101010;box-shadow:var(--shadow-amarelo)
}

/* ===========================
   SEÇÕES
   =========================== */
.section{margin:26px 0}
.section-title{display:flex;align-items:center;gap:10px;margin:0 0 14px}
.section-title .dot{width:10px;height:10px;border-radius:50%;background:var(--amarelo);box-shadow:0 0 0 4px rgba(255,210,63,.25)}
.kicker{font-weight:900;letter-spacing:.2px;color:#9A6A00}

/* ===========================
   GRIDS
   =========================== */
.grid-news{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}

/* ===========================
   BADGES & TAGS
   =========================== */
.badge{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--tint-azul);padding:6px 10px;border-radius:999px;
  color:#0B6B8E;font-weight:800
}
.tag{
  display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;
  background:var(--tint-rosa);color:var(--rosa);font-weight:800
}

/* ===========================
   IMAGENS
   =========================== */
img.round{border-radius:14px}

/* ===========================
   SLIDER (versão de rolagem)
   =========================== */
.slider{
  display:flex;gap:14px;overflow:auto;scroll-snap-type:x mandatory;padding:4px 2px;
  background:linear-gradient(90deg,#FFF5FA,#FFFBE8)
}
.slider>a{scroll-snap-align:center;min-width:280px}
.slide-img{
  height:190px;width:100%;max-width:360px;object-fit:cover;border-radius:14px;display:block;margin:0 auto;
  box-shadow:var(--shadow-1)
}

/* ===========================
   FORMULÁRIOS
   =========================== */
label{display:block;font-weight:800;margin:8px 0 6px}
input,select,textarea{
  width:100%;padding:12px;border-radius:12px;
  border:1px solid rgba(17,24,39,.08);
  background:#FFFFFF;color:#1A1A1A;
  box-shadow:0 2px 0 rgba(17,24,39,.02) inset
}

/* ===========================
   LINKS
   =========================== */
a{color:var(--rosa)}
a:hover{filter:brightness(1.05)}
