
:root{
  --bg:#f6fbff; --primary:#0b5fa5; --primary-2:#2c7ec3;
  --text:#0b2b45; --muted:#6b89a3; --white:#fff;
  --shadow:0 10px 30px rgba(0,0,0,.06); --radius:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;color:var(--text);background:var(--bg)}
img{max-width:100%;height:auto;display:block}

.container{width:min(1140px, 92vw);margin:0 auto}
.header{position:sticky;top:0;background:rgba(255,255,255,.98);backdrop-filter:saturate(180%) blur(12px); box-shadow:var(--shadow); z-index:1000}
.header .wrap{display:flex;align-items:center;justify-content:space-between; gap:12px; padding:10px 12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;white-space:nowrap;min-width:0}
.brand img{height:40px;width:auto}
.brand b{font-weight:800;font-size:1.05rem;letter-spacing:.2px;overflow:hidden;text-overflow:ellipsis}
.menu-toggle{display:none;border:0;background:transparent;font-size:28px;line-height:1;padding:6px 10px;border-radius:10px}
.nav{display:flex;align-items:center;gap:18px}
.nav a{color:var(--text);text-decoration:none;font-weight:600;opacity:.9;white-space:nowrap}
.nav a:hover{opacity:1}
.cta{padding:10px 14px;border-radius:10px;background:linear-gradient(180deg,var(--primary),var(--primary-2));color:#fff !important;box-shadow:var(--shadow)}

.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center;padding:56px 12px 12px 12px}
.hero h1{font-size:clamp(28px,4vw,46px);line-height:1.08;margin:0 0 14px 0}
.hero p{font-size:clamp(16px,2.2vw,20px);color:var(--muted);margin:0 0 20px 0}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:12px;border:2px solid transparent;background:var(--white);color:var(--primary);font-weight:700;text-decoration:none;box-shadow:var(--shadow)}
.btn.whatsapp{background:linear-gradient(180deg,#1fa855,#109647); color:#fff;}
.badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:#e8f2ff;color:var(--primary);font-weight:700;margin-bottom:10px}

.section{padding:48px 12px}
.section h2{font-size:clamp(22px,3vw,32px);margin:0 0 12px 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:#fff;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.card p{color:var(--muted);margin:6px 0 0 0}

.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.feature{background:#fff;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.feature b{display:block;margin-top:6px}

.products .grid img{border-radius:12px}

.about p{color:var(--muted)}

.footer{background:#071f33;color:#dce9f7}
.footer a{color:#9ad5ff;text-decoration:none}
.footer .wrap{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px;padding:26px 12px}
.footer small{display:block;margin-top:8px;opacity:.7}

.logo-inline{display:flex;align-items:center;gap:10px}
.logo-inline img{height:28px}

/* Mobile */
@media (max-width: 900px){
  .hero{grid-template-columns:1fr; padding-top:64px}
  .features{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr;gap:12px}
  .footer .wrap{grid-template-columns:1fr}
}
@media (max-width: 760px){
  .brand img{height:34px}
  .brand b{display:none} /* evita overlap do texto 'BauruGelo' com os links */
  .menu-toggle{display:block}
  .nav{position:fixed; top:56px; right:12px; background:#fff; border-radius:12px; box-shadow:var(--shadow);
       padding:12px; display:none; flex-direction:column; gap:10px; z-index:1001; min-width:240px}
  .nav.open{display:flex}
  .cta{width:100%; text-align:center}
}
