/* CoForgePilotAI — shared storefront renderer stylesheet
   Theme colors (--sf-bg, --sf-surface, --sf-text, --sf-muted, --sf-accent,
   --sf-accent-text) are set at runtime by storefront.js from store.theme.
   Defaults below match the original /store/ palette. */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --sf-bg:#F8FAFC; --sf-surface:#FFFFFF; --sf-text:#0F172A; --sf-muted:#64748B;
  --sf-accent:#059669; --sf-accent-text:#FFFFFF; --sf-accent-hover:#065F46;
  --sf-navy:#1B3A5C; --sf-navy-mid:#1e4976; --sf-navy-dark:#0c3057;
  --sf-hero-em:#0EA5E9; --sf-amber:#F59E0B; --sf-amber-border:#FDE68A;
  --sf-amber-dark-text:#92400E; --sf-amber-text:#B45309; --sf-lamber:#FFFBEB;
  --sf-border:#E2E8F0;
}
body { font-family:'DM Sans',sans-serif; background:var(--sf-bg); color:var(--sf-text); min-height:100vh; overflow-x:hidden; }

.topbar { background:var(--sf-navy); padding:12px 24px; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:100; }
.topbar-brand img { height:34px; width:auto; vertical-align:middle; }
.topbar-link { color:rgba(255,255,255,.75); text-decoration:none; font-size:13px; font-weight:500; }
.topbar-link:hover { color:var(--sf-surface); }

.hero { background:linear-gradient(135deg,var(--sf-navy) 0%,var(--sf-navy-mid) 60%,var(--sf-navy-dark) 100%); padding:56px 24px 48px; text-align:center; }
.hero h1 { font-family:'DM Serif Display',serif; font-size:clamp(28px,5vw,44px); color:var(--sf-surface); line-height:1.15; margin-bottom:14px; }
.hero h1 em { font-style:normal; color:var(--sf-hero-em); }
.hero p { font-size:clamp(14px,2.2vw,17px); color:rgba(255,255,255,.7); max-width:560px; margin:0 auto; line-height:1.6; font-weight:300; }

.section { max-width:1000px; margin:0 auto; padding:40px 20px; }
.section-title { font-family:'DM Serif Display',serif; font-size:24px; color:var(--sf-navy); margin-bottom:20px; }

.product-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.product-card { background:var(--sf-surface); border:1px solid var(--sf-border); border-radius:16px; padding:22px; display:flex; flex-direction:column; box-shadow:0 2px 12px rgba(15,23,42,.05); position:relative; }
.product-badge { position:absolute; top:-10px; right:16px; background:var(--sf-amber); color:var(--sf-surface); font-size:11px; font-weight:600; padding:4px 10px; border-radius:100px; letter-spacing:.03em; }
.product-name { font-family:'DM Serif Display',serif; font-size:17px; color:var(--sf-navy); line-height:1.3; margin-bottom:8px; padding-right:8px; }
.product-desc { font-size:13px; color:var(--sf-muted); line-height:1.6; font-weight:300; flex:1; margin-bottom:14px; }
.product-price { font-size:24px; font-weight:600; color:var(--sf-text); margin-bottom:14px; }
.cta-buy-btn { display:block; text-align:center; background:var(--sf-accent); color:var(--sf-accent-text); font-size:14px; font-weight:600; padding:12px; border-radius:8px; text-decoration:none; transition:background .15s; }
.cta-buy-btn:hover { background:var(--sf-accent-hover); }
.cta-alt-btn { display:block; text-align:center; background:var(--sf-accent); color:var(--sf-accent-text); font-size:14px; font-weight:600; padding:12px; border-radius:8px; text-decoration:none; transition:background .15s; }
.cta-alt-btn:hover { background:var(--sf-accent-hover); }

.cpds-card { background:var(--sf-lamber); border:1px solid var(--sf-amber-border); border-radius:16px; padding:28px 32px; text-align:center; margin-top:8px; }
.cpds-card h3 { font-family:'DM Serif Display',serif; font-size:22px; color:var(--sf-amber-dark-text); margin-bottom:10px; }
.cpds-card p { font-size:14px; color:var(--sf-amber-text); line-height:1.6; font-weight:300; max-width:460px; margin:0 auto 20px; }
.cpds-form { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; max-width:420px; margin:0 auto; }
.cpds-form input { flex:1; min-width:180px; padding:12px 14px; border:1px solid var(--sf-amber-border); border-radius:8px; font-size:14px; font-family:'DM Sans',sans-serif; background:var(--sf-surface); outline:none; }
.cpds-form button { padding:12px 20px; background:var(--sf-amber); color:var(--sf-surface); border:none; border-radius:8px; font-size:14px; font-weight:600; font-family:'DM Sans',sans-serif; cursor:pointer; white-space:nowrap; }
.cpds-msg { margin-top:10px; font-size:13px; }

.lead-card { background:var(--sf-surface); border:1px solid var(--sf-border); border-radius:16px; padding:28px 32px; }
.lead-form { display:flex; flex-direction:column; gap:12px; max-width:420px; margin:0 auto; }
.lead-form label { font-size:13px; font-weight:600; color:var(--sf-text); margin-bottom:4px; display:block; }
.lead-form input, .lead-form textarea, .lead-form select { width:100%; padding:12px 14px; border:1px solid var(--sf-border); border-radius:8px; font-size:14px; font-family:'DM Sans',sans-serif; background:var(--sf-surface); color:var(--sf-text); outline:none; }
.lead-form button { padding:12px 20px; background:var(--sf-accent); color:var(--sf-accent-text); border:none; border-radius:8px; font-size:14px; font-weight:600; font-family:'DM Sans',sans-serif; cursor:pointer; white-space:nowrap; }
.lead-form button:hover { background:var(--sf-accent-hover); }
.lead-msg { margin-top:10px; font-size:13px; }

.faq-item { background:var(--sf-surface); border:1px solid var(--sf-border); border-radius:12px; padding:18px 20px; margin-bottom:10px; }
.faq-q { font-size:14px; font-weight:600; color:var(--sf-navy); margin-bottom:6px; }
.faq-a { font-size:13px; color:var(--sf-muted); line-height:1.6; font-weight:300; }

.email-footer { background:var(--sf-navy); border-radius:16px; overflow:hidden; }
.email-footer-top { padding:24px 28px 0; }
.email-footer-tag { font-size:11px; font-weight:600; color:var(--sf-hero-em); letter-spacing:.08em; text-transform:uppercase; margin-bottom:8px; }
.email-footer-title { font-family:'DM Serif Display',serif; font-size:20px; color:var(--sf-surface); line-height:1.2; margin-bottom:6px; }
.email-footer-sub { font-size:13px; color:rgba(255,255,255,.55); font-weight:300; margin-bottom:16px; }
.email-footer-bottom { padding:0 28px 24px; }
.email-footer-form { display:flex; gap:8px; flex-wrap:wrap; }
.email-footer-form input { flex:1; min-width:150px; padding:12px 14px; border:1px solid rgba(255,255,255,.2); border-radius:8px; font-size:14px; font-family:'DM Sans',sans-serif; background:rgba(255,255,255,.08); color:var(--sf-surface); outline:none; }
.email-footer-form button { padding:12px 20px; background:var(--sf-accent); color:var(--sf-accent-text); border:none; border-radius:8px; font-size:14px; font-weight:600; font-family:'DM Sans',sans-serif; cursor:pointer; white-space:nowrap; }
.email-footer-msg { margin-top:10px; font-size:13px; }

footer.site-footer { background:var(--sf-navy); padding:28px 24px; text-align:center; }
footer.site-footer p { font-size:13px; color:rgba(255,255,255,.4); font-weight:300; line-height:1.8; }
footer.site-footer a { color:var(--sf-hero-em); text-decoration:none; }

.loading-note { text-align:center; color:var(--sf-muted); font-size:13px; padding:20px; }

@media (max-width:480px) {
  .hero { padding:44px 16px 40px; }
  .section { padding:32px 16px; }
  .cpds-form, .email-footer-form, .lead-form { flex-direction:column; }
}