/* Premium Design System — brand overrides */
:root {
  --primary: #e11d48;
  --secondary: #f97316;
  --primary-light: color-mix(in srgb, #e11d48 75%, var(--text-on-primary));
  --accent: #f97316;
  --accent-soft: color-mix(in srgb, #e11d48 8%, var(--bg-secondary));
  --border: var(--border-color);
  /* Legacy aliases */
  --ink: var(--text-main);
  --muted: var(--text-muted);
  --bg: var(--bg-main);
  --surface: var(--bg-secondary);
  --border: var(--border-color);
  --radius: 12px;
}

*,*::before,*::after{box-sizing:border-box}
body {margin:0;color:var(--text-main);background:var(--bg-main);line-height:1.6}
a{color:inherit;text-decoration:none}
/* container → premium-design-system */
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg-secondary) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.1rem;color:var(--primary)}
.logo-mark{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-light));display:grid;place-items:center;color:var(--accent);font-size:16px;font-weight:800}
.nav{display:flex;align-items:center;gap:22px}
.nav a{font-size:.9rem;font-weight:500;color:var(--text-muted);transition:color .15s}
.nav a:hover,.nav a.active{color:var(--primary)}.nav a.active{font-weight:600}
.nav-toggle,.theme-toggle{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:8px 10px;cursor:pointer;font-size:1rem;color:var(--text-main)}
.nav-toggle{display:none}.header-actions{display:flex;align-items:center;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding: 12px 24px;border-radius: 8px;font-weight:600;font-size:.9rem;border:none;cursor:pointer;transition:transform .15s}
.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--primary);color: var(--text-on-primary)}.btn-outline{background:transparent;border:2px solid var(--primary);color:var(--primary)}.btn-sm{padding:8px 14px;font-size:.82rem}
.page{display:none}.page.active{display:block}
.hero{padding:56px 0 48px;background:linear-gradient(180deg,var(--accent-soft) 0%,var(--bg-main) 100%)}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.badge{display:inline-block;padding:6px 14px;border-radius:999px;background:var(--accent-soft);color:var(--primary);font-size:.8rem;font-weight:600;margin-bottom:16px}
.hero h1{margin:0 0 16px;font-size:clamp(2rem,4.5vw,3rem);line-height:1.15;color:var(--text-main)}
.hero p{color:var(--text-muted);font-size:1.05rem;max-width:520px;margin:0 0 24px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.hero-visual{background:var(--bg-secondary);border-radius:16px;padding:24px;border:1px solid var(--border);box-shadow: none;grid-template-columns:repeat(2,1fr);gap:12px}
.hero-stat{background:var(--accent-soft);border-radius:10px;padding:16px;text-align:center}
.hero-stat strong{display:block;font-size:1.4rem;color:var(--primary)}.hero-stat span{font-size:.8rem;color:var(--text-muted)}
.section-head{margin-bottom:28px}.section-head h2{margin:0 0 8px;font-size:1.75rem;color:var(--text-main)}.section-head p{margin:0;color:var(--text-muted)}
.features-strip{background:var(--primary);color: var(--text-on-primary);padding:32px 0}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:center}
.features-grid .icon{font-size:1.6rem;margin-bottom:8px}.features-grid strong{display:block;margin-bottom:4px}.features-grid span{font-size:.85rem;opacity:.85}
.filter-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.filter-tab{padding:8px 18px;border-radius:999px;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-muted);cursor:pointer;font-size:.85rem;font-weight:500}
.filter-tab.active{background:var(--primary);color: var(--text-on-primary);border-color:var(--primary)}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.card{background:var(--bg-secondary);border:1px solid var(--border);border-radius: 8px;overflow:hidden;transition:box-shadow .2s,transform .2s}
.card:hover{box-shadow: none;transform:translateY(-3px)}
.card-img{height:160px;background:var(--accent-soft);display:grid;place-items:center;font-size:2.5rem}
.card-body{padding:18px}.card-body h3{margin:0 0 8px;font-size:1rem;color:var(--text-main)}.card-body p{margin:0 0 12px;font-size:.88rem;color:var(--text-muted)}
.card-footer{display:flex;justify-content:space-between;align-items:center}
.price{font-weight:700;color:var(--primary)}.price small{color:var(--text-muted);text-decoration:line-through;font-weight:400;margin-left:6px}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:40px 0}
.about-img{height:280px;border-radius: 8px;background:var(--accent-soft);display:grid;place-items:center;font-size:4rem;border:1px solid var(--border)}
.about-list{list-style:none;padding:0;margin:16px 0 0}.about-list li{padding:8px 0;color:var(--text-muted)}
.contact-page{padding:40px 0;max-width:640px}
.contact-form input,.contact-form textarea,.newsletter-form input{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius: 8px;font:inherit;background:var(--bg-secondary);color:var(--text-main);margin-bottom:12px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:48px 0;text-align:center}
.stat-counter .num{display:block;font-size:2rem;font-weight:800;color:var(--primary)}.stat-counter .lbl{font-size:.85rem;color:var(--text-muted)}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding-bottom:48px}
.why-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius: 8px;padding:24px;text-align:center}
.why-card .icon{font-size:1.8rem;margin-bottom:12px}.why-card strong{display:block;margin-bottom:8px;color:var(--text-main)}.why-card p{margin:0;font-size:.88rem;color:var(--text-muted)}
.testimonials{padding:48px 0}.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.testimonial-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius: 8px;padding:24px}
.stars{color:var(--accent);margin-bottom:12px;letter-spacing: -0.01em}.testimonial-card p{margin:0 0 16px;font-size:.92rem;color:var(--text-muted);font-style:italic}
.author{display:flex;align-items:center;gap:12px}.author-avatar{width:44px;height:44px;border-radius:50%;background:var(--accent-soft);display:grid;place-items:center;font-weight:700;color:var(--primary);font-size:.85rem}
.author strong{display:block;font-size:.9rem;color:var(--text-main)}.author span{font-size:.8rem;color:var(--text-muted)}
.faq-section{padding:48px 0}.faq-list{max-width:720px}
.faq-item{border:1px solid var(--border);border-radius: 8px;margin-bottom:10px;background:var(--bg-secondary)}
.faq-item summary{padding:16px 20px;cursor:pointer;font-weight:600;color:var(--text-main)}.faq-item .answer{padding:0 20px 16px;color:var(--text-muted);font-size:.92rem}
.cta-banner{background:linear-gradient(135deg,var(--primary),var(--primary-light));color: var(--text-on-primary);text-align:center;padding:56px 24px}
.cta-banner h2{margin:0 0 12px;opacity:.9}.cta-banner .btn-primary{background: var(--bg-main);color:var(--primary)}
.newsletter-cta{text-align:center;padding:5rem 1rem;background:var(--bg-secondary);overflow:visible}.newsletter-form{display:flex;flex-wrap:wrap;gap:12px;max-width:520px;margin:1rem auto 0;align-items:stretch;justify-content:center}.newsletter-form input{margin:0;flex:1}
.trust-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;padding:24px 0;font-size:.85rem;color:var(--text-muted)}
.site-footer{background:var(--primary);color: var(--text-on-primary);padding:48px 0 24px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;margin-bottom:32px}
.site-footer h4{margin:0 0 14px;font-size:.9rem}.site-footer ul{list-style:none;padding:0;margin:0}.site-footer li{margin-bottom:8px}
.site-footer a{opacity:.8;font-size:.88rem}.site-footer p{opacity:.8;font-size:.9rem;line-height:1.6}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:20px;font-size:.82rem;opacity:.7}
.toast{position:fixed;bottom:24px;right:24px;background:var(--primary);color: var(--text-on-primary);padding:14px 22px;border-radius: 8px;opacity:0;transform:translateY(12px);transition:.3s;z-index:100;pointer-events:none;font-size:.9rem}
.toast.show{opacity:1;transform:translateY(0)}
.feature-tabs{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap}
.feature-tab{padding:10px 20px;border:1px solid var(--border);border-radius: 8px;background:var(--bg-secondary);cursor:pointer;font-weight:500;color:var(--text-muted)}
.feature-tab.active{background:var(--primary);color: var(--text-on-primary);border-color:var(--primary)}
.feature-panel{display:none;background:var(--bg-secondary);border:1px solid var(--border);border-radius: 8px;padding:28px}.feature-panel.active{display:block}

[data-theme="dark"] .site-header, body.dark .site-header, body.dark-mode .site-header{background:color-mix(in srgb,var(--bg-secondary) 95%,transparent)}
[data-theme="dark"] .btn-outline, body.dark .btn-outline, body.dark-mode .btn-outline{color:var(--text-main);border-color:var(--border)}
[data-theme="dark"] .filter-tab.active, body.dark .filter-tab.active, body.dark-mode .filter-tab.active{color: var(--text-on-primary)}
[data-theme="dark"] .contact-form input,[data-theme="dark"] .contact-form textarea,[data-theme="dark"] .newsletter-form input,body.dark .contact-form input,body.dark .contact-form textarea,body.dark .newsletter-form input,body.dark-mode .contact-form input,body.dark-mode .contact-form textarea,body.dark-mode .newsletter-form input{background:var(--bg-secondary);color:var(--text-main);border-color:var(--border)}
@media(max-width:900px){.hero-grid,.about-grid,.footer-grid,.why-grid{grid-template-columns:1fr}.stats-row,.testimonials-grid,.features-grid{grid-template-columns:repeat(2,1fr)}.form-row{grid-template-columns:1fr}}
@media(max-width:700px){.nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:var(--bg-secondary);padding:16px;border-bottom:1px solid var(--border)}.nav.open{display:flex}.nav-toggle{display:block}.header-inner{position:relative}.stats-row,.testimonials-grid{grid-template-columns:1fr}.newsletter-form{display:flex;flex-wrap:wrap;gap:12px;max-width:520px;margin:1rem auto 0;align-items:stretch;justify-content:center}}

.home-extras.hidden { display: none !important; }
