:root{
  --primary:#1FA971;
  --secondary:#34D399;
  --bg:#F8FAFC;
  --card:#FFFFFF;
  --text:#111827;
  --border:#E5E7EB;
  --muted:#6B7280;
}

[data-theme="dark"]{
  --bg:#0F172A;
  --card:#1E293B;
  --text:#F1F5F9;
  --border:#334155;
  --muted:#94A3B8;
}
[data-theme="dark"] body{background:var(--bg);color:var(--text);}
[data-theme="dark"] .ost-header,
[data-theme="dark"] .ost-footer{background:var(--card);border-color:var(--border);}
[data-theme="dark"] .navbar-brand,
[data-theme="dark"] .nav-link{color:var(--text)!important;}
[data-theme="dark"] .ost-card,
[data-theme="dark"] .ost-tool-box,
[data-theme="dark"] .ost-article-card,
[data-theme="dark"] .ost-cat-pill{background:var(--card);border-color:var(--border);color:var(--text);}
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select{background-color:var(--card);border-color:var(--border);color:var(--text);}
[data-theme="dark"] .ost-hero{background:linear-gradient(135deg, rgba(31,169,113,.18), rgba(52,211,153,.10));}
[data-theme="dark"] .ost-hero-search input{background:var(--card);color:var(--text);border-color:var(--border);}
[data-theme="dark"] .ost-tags a{background:var(--card);border-color:var(--border);color:var(--muted);}

.ost-theme-toggle{
  background:none;border:1px solid var(--border);border-radius:50px;
  width:38px;height:38px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:16px;color:var(--text);
}
.ost-theme-toggle:hover{border-color:var(--primary);}

body{
  background:var(--bg);
  color:var(--text);
  font-family:'Segoe UI',-apple-system,BlinkMacSystemFont,Roboto,Arial,sans-serif;
}

a{color:var(--primary);}
a:hover{color:#178a5c;}

/* Header */
.ost-header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;}
.ost-logo-dot{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--secondary));display:inline-block;}
.navbar-brand{color:var(--text)!important;font-size:20px;}
.nav-link{color:var(--text)!important;font-weight:500;}
.nav-link:hover{color:var(--primary)!important;}
.ost-header-search{max-width:320px;}
.ost-header-search .btn{background:var(--primary);border-color:var(--primary);color:#fff;}

/* Hero */
.ost-hero{
  background:linear-gradient(135deg, rgba(31,169,113,.10), rgba(52,211,153,.18));
  border-radius:24px;
  padding:64px 32px;
  margin:32px 0;
  text-align:center;
}
.ost-hero h1{font-weight:800;font-size:2.6rem;color:var(--text);}
.ost-hero p{color:var(--muted);font-size:1.1rem;}
.ost-hero-search{max-width:600px;margin:24px auto 0;}
.ost-hero-search input{border-radius:50px 0 0 50px;padding:14px 20px;border:1px solid var(--border);}
.ost-hero-search button{border-radius:0 50px 50px 0;background:var(--primary);border-color:var(--primary);padding:14px 28px;color:#fff;font-weight:600;}
.ost-tags a{display:inline-block;background:#fff;border:1px solid var(--border);border-radius:50px;padding:6px 16px;margin:4px;font-size:.85rem;color:var(--muted);text-decoration:none;}
.ost-tags a:hover{border-color:var(--primary);color:var(--primary);}

/* Section headings */
.ost-section-title{font-weight:700;font-size:1.4rem;margin-bottom:0;}
.ost-section-link{font-size:.9rem;font-weight:600;text-decoration:none;}

/* Cards */
.ost-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:22px;
  height:100%;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.ost-card:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(17,24,39,.06);border-color:var(--secondary);}
.ost-card-icon{
  width:48px;height:48px;border-radius:12px;
  background:linear-gradient(135deg, rgba(31,169,113,.12), rgba(52,211,153,.20));
  display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:14px;
}
.ost-card h5{font-size:1rem;font-weight:700;margin-bottom:6px;}
.ost-card p{font-size:.85rem;color:var(--muted);margin-bottom:14px;}
.ost-card .btn-learn{font-size:.8rem;font-weight:600;color:var(--primary);text-decoration:none;}
.ost-card .btn-learn:hover{text-decoration:underline;}

.ost-cat-pill{
  background:#fff;border:1px solid var(--border);border-radius:14px;padding:18px;text-align:center;
  text-decoration:none;color:var(--text);display:block;height:100%;
}
.ost-cat-pill:hover{border-color:var(--primary);color:var(--primary);}
.ost-cat-pill .icon{font-size:26px;margin-bottom:8px;}

/* Article cards */
.ost-article-card{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;height:100%;}
.ost-article-card img{width:100%;height:160px;object-fit:cover;}
.ost-article-card .body{padding:16px;}
.ost-article-card h6{font-weight:700;font-size:.95rem;}
.ost-article-card .meta{font-size:.75rem;color:var(--muted);}

/* Newsletter */
.ost-newsletter{background:linear-gradient(135deg,var(--primary),var(--secondary));border-radius:20px;padding:48px;color:#fff;text-align:center;}
.ost-newsletter input{border-radius:50px;border:none;padding:12px 20px;max-width:320px;}
.ost-newsletter button{border-radius:50px;background:#111827;border-color:#111827;padding:12px 24px;font-weight:600;}

/* Tool page */
.ost-tool-box{background:#fff;border:1px solid var(--border);border-radius:16px;padding:28px;}
.ost-tool-header h1{font-weight:700;font-size:1.8rem;}
.ost-faq-item{border-bottom:1px solid var(--border);padding:14px 0;}

/* Footer */
.ost-footer{background:#fff;border-top:1px solid var(--border);}

/* Ads */
.ost-ad-slot{text-align:center;margin:24px 0;min-height:1px;}

@media (max-width:768px){
  .ost-hero h1{font-size:1.8rem;}
  .ost-hero{padding:40px 16px;}
}
