
:root {
  --primary: #1a1a2e;
  --accent: #e94560;
  --bg-main: #fafafa;
  --bg-dark: #16213e;
  --text-primary: #1a1a2e;
  --text-secondary: #4a4a5a;
  --border: #dde1e8;
  --font-heading: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-body); background:var(--bg-main); color:var(--text-primary); line-height:1.6; }
h1,h2,h3 { font-family:var(--font-heading); font-weight:700; line-height:1.2; }
h2 { font-size:clamp(1.4rem,3vw,1.8rem); margin:1.5rem 0 0.8rem; }
h3 { font-size:1.1rem; margin:0.8rem 0 0.4rem; }
p { margin:0.6rem 0; }
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }
a:hover { color:var(--accent); }
.article__body a { color:#0066cc; text-decoration:underline; }
.article__body a:hover { color:#004499; }
.container { max-width:1200px; margin:0 auto; padding:0 1rem; }
.site-header { background:#fff; border-bottom:2px solid var(--primary); position:sticky; top:0; z-index:100; }
.site-header__top { display:flex; align-items:center; justify-content:space-between; padding:1rem 0; flex-wrap:wrap; gap:0.8rem; }
.site-header__logo { display:flex; align-items:center; gap:0.5rem; font-family:var(--font-heading); font-size:1.6rem; font-weight:700; color:var(--primary); }
.site-header__tagline { font-size:0.65rem; text-transform:uppercase; letter-spacing:2px; color:var(--text-secondary); }
.site-nav { display:flex; gap:0.9rem; align-items:center; flex-wrap:wrap; }
.site-nav__link { font-family:var(--font-heading); font-size:0.8rem; text-transform:uppercase; letter-spacing:0.5px; padding:0.2rem 0; border-bottom:2px solid transparent; }
.site-nav__link:hover, .site-nav__link--active { color:var(--accent); border-bottom-color:var(--accent); }
.site-search__input { background:#fff; border:1px solid var(--border); padding:0.35rem 0.7rem; border-radius:4px; width:150px; font-size:0.8rem; }
.ticker-bar { background:var(--primary); color:#fff; padding:0.35rem 0; overflow:hidden; white-space:nowrap; }
.ticker-bar__text { display:inline-block; animation:ticker 25s linear infinite; font-size:0.75rem; }
@keyframes ticker { 0% { transform:translateX(100%); } 100% { transform:translateX(-100%); } }
.hero { background:linear-gradient(135deg,#fff 0%,#eef0f5 100%); padding:2.5rem 0; border-bottom:1px solid var(--border); }
.hero__content { display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:center; }
.hero__text h1 { font-size:clamp(1.8rem,4vw,3rem); color:var(--primary); margin-bottom:0.8rem; }
.hero__cta { display:inline-block; background:var(--accent); color:#fff; font-family:var(--font-heading); text-transform:uppercase; padding:0.7rem 1.8rem; border-radius:4px; font-weight:700; }
.hero__image img { border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.15); }
@media (max-width:768px) { .hero__content { grid-template-columns:1fr; } }
.card-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.2rem; padding:1.5rem 0; }
.blog-card { background:#fff; border:1px solid var(--border); border-radius:6px; overflow:hidden; transition:transform 0.2s; }
.blog-card:hover { transform:translateY(-3px); box-shadow:0 6px 18px rgba(0,0,0,0.1); }
.blog-card__img { width:100%; height:160px; object-fit:cover; }
.blog-card__body { padding:0.8rem; }
.blog-card__cat { display:inline-block; background:var(--accent); color:#fff; font-size:0.65rem; text-transform:uppercase; padding:0.15rem 0.5rem; border-radius:3px; }
.blog-card__title { font-size:0.95rem; margin:0.4rem 0; }
.blog-card__excerpt { color:var(--text-secondary); font-size:0.8rem; }
.blog-card__time { color:var(--text-secondary); font-size:0.7rem; display:block; margin-top:0.3rem; }
.cat-card { background:#fff; border:1px solid var(--border); border-radius:6px; overflow:hidden; display:block; }
.cat-card:hover { transform:translateY(-3px); }
.cat-card__img { width:100%; height:120px; object-fit:cover; }
.cat-card__title { padding:0.7rem; font-size:0.9rem; text-align:center; }
.breadcrumb { display:flex; gap:0.4rem; align-items:center; padding:0.8rem 0; font-size:0.8rem; color:var(--text-secondary); flex-wrap:wrap; }
.breadcrumb a { color:var(--text-secondary); }
.breadcrumb a:hover { color:var(--accent); }
.breadcrumb__current { color:var(--text-primary); }
.article { max-width:750px; margin:0 auto; padding:1.5rem 1rem; }
.article__title { font-size:clamp(1.6rem,3.5vw,2.4rem); color:var(--primary); margin:0.8rem 0; }
.article__meta { display:flex; gap:0.8rem; color:var(--text-secondary); font-size:0.8rem; border-bottom:1px solid var(--border); padding-bottom:0.8rem; margin-bottom:1rem; }
.article__hero-img { width:100%; border-radius:6px; margin:0.8rem 0; }
.article__inline { width:100%; border-radius:6px; margin:1rem 0; }
.site-footer { background:var(--bg-dark); color:#c0c8d8; margin-top:2rem; }
.site-footer__newsletter { text-align:center; padding:2rem 0; border-bottom:1px solid #2a3650; }
.site-footer__newsletter h3 { color:#fff; font-size:1.4rem; margin-bottom:0.4rem; }
.site-footer__form { display:flex; gap:0.4rem; justify-content:center; flex-wrap:wrap; margin-top:0.8rem; }
.site-footer__form input { background:#2a3650; border:1px solid #3a4a6a; color:#fff; padding:0.6rem 0.9rem; border-radius:4px; width:250px; }
.site-footer__form button { background:var(--accent); color:#fff; font-family:var(--font-heading); text-transform:uppercase; padding:0.6rem 1.3rem; border-radius:4px; font-weight:700; }
.site-footer__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; padding:1.5rem 0; }
.site-footer__grid h4 { color:var(--accent); font-size:0.85rem; margin-bottom:0.6rem; }
.site-footer__grid a { display:block; color:#9fb0c8; font-size:0.8rem; padding:0.15rem 0; }
.site-footer__grid a:hover { color:#fff; }
.site-footer__bottom { text-align:center; padding:0.8rem 0; border-top:1px solid #2a3650; font-size:0.75rem; }
.scroll-top { position:fixed; bottom:1.2rem; right:1.2rem; background:var(--accent); color:#fff; width:40px; height:40px; border-radius:50%; font-size:1.2rem; display:flex; align-items:center; justify-content:center; z-index:50; opacity:0; pointer-events:none; transition:opacity 0.3s; }
.scroll-top--visible { opacity:1; pointer-events:auto; }
@media (max-width:768px) { .site-footer__grid { grid-template-columns:1fr 1fr; } }
@media (prefers-reduced-motion:reduce) { * { animation:none!important; transition:none!important; } }
