:root{
  --bg:#fff7f9;
  --txt:#2a2a2a;
  --muted:#6b6b6b;
  --primary:#ff7aa2;
  --primary-2:#ffb3c7;
  --card:#ffffff;
  --shadow:0 6px 28px rgba(0,0,0,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;background:var(--bg);color:var(--txt);}
a{color:inherit;text-decoration:none}
.container{max-width:1120px;margin:0 auto;padding:0 16px}
.site-header{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid #f3dbe4}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}
.logo{font-weight:800;font-size:1.25rem}
.logo span{color:var(--primary)}
.nav{display:flex;gap:16px;flex-wrap:wrap}
.nav a{padding:8px 10px;border-radius:10px}
.nav a:hover{background:#ffe9f0}
.menu-btn{display:none;border:none;background:#ffe2ec;border-radius:10px;padding:8px 12px;font-size:1.2rem}
.hero{background:linear-gradient(120deg,#ffe9f1, #fff);}
.hero-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;padding:56px 0;align-items:center}
.hero-text h1{font-size:2.2rem;margin:0 0 8px}
.hero-text h1 span{color:var(--primary)}
.hero-text p{color:var(--muted);margin:0 0 16px}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-block;background:#fff;border:1px solid #f4c6d4;padding:10px 14px;border-radius:12px;box-shadow:var(--shadow)}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:var(--primary);color:white;border-color:transparent}
.btn.outline{background:transparent}
.hero-illu{position:relative;height:260px}
.hero-illu .bubble{position:absolute;inset:10% 5% auto auto;width:80%;height:80%;background:radial-gradient(circle at 30% 30%, #fff, #ffd9e7);border-radius:40px;box-shadow:var(--shadow)}
.tracker{padding:36px 0}
.tracker-form{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 16px}
.tracker-form input{padding:10px 12px;border:1px solid #f3cad9;border-radius:10px;background:#fff}
.tracker-result{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:16px}
.feature-cards{padding:24px 0}
.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:var(--card);padding:18px;border-radius:16px;box-shadow:var(--shadow)}
.card:hover{transform:translateY(-2px)}
.community{padding:32px 0}
.community-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:center}
.bullets{margin:10px 0 0 0;padding-left:18px}
.bullets li{margin:6px 0}
.chatbot-frame{width:100%;height:420px;border:0;border-radius:16px;box-shadow:var(--shadow);background:#fff}
.articles,.shop{padding:32px 0}
.articles-grid,.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.article,.product{background:var(--card);padding:16px;border-radius:16px;box-shadow:var(--shadow)}
.site-footer{background:#fff;border-top:1px solid #f3dbe4;margin-top:36px}
.footer-inner{padding:24px 0}
.footer-cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px}
.page{padding:32px 0}
@media (max-width:900px){
  .hero-inner{grid-template-columns:1fr}
  .community-grid{grid-template-columns:1fr}
  .articles-grid,.shop-grid,.cards-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  .nav{display:none}
  .menu-btn{display:inline-block}
  .articles-grid,.shop-grid,.cards-grid{grid-template-columns:1fr}
}
