/* NimbleAF Sales Kit — styles.css (visual polish) */
:root{
  --bg:#F8FEFC;
  --charcoal:#0D3530;
  --teal:#0E9488;
  --accent:#6EDDD5;
  --ink:#0A1E1C;
  --muted:#6B7D77;
  --white:#FFFFFF;
  --glass: rgba(255,255,255,0.6);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.65;margin:0;font-size:16px}
.container{max-width:980px;margin:0 auto;padding:24px}
.serif{font-family:Playfair Display,serif}
.center{text-align:center}

/* HERO */
.hero{background:linear-gradient(135deg,var(--charcoal),#0b2d2a);color:var(--white);padding:72px 24px;position:relative;overflow:hidden}
.hero__inner{display:grid;grid-template-columns:1fr 360px;gap:32px;align-items:center}
.hero__headline{font-size:clamp(28px,5vw,48px);font-weight:900;line-height:1.02;margin-bottom:12px}
.hero__sub{color:#B9DCD8;max-width:640px;margin-bottom:18px}
.hero__bullets{list-style:none;margin-top:16px;display:grid;gap:10px}
.bullet{background:rgba(255,255,255,0.04);padding:10px 12px;border-radius:8px;color:#DFF6F2}

/* Buttons */
.btn{display:inline-block;background:var(--teal);color:var(--white);padding:14px 34px;border-radius:10px;text-decoration:none;font-weight:700;box-shadow:0 8px 18px rgba(14,148,136,0.18);transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(14,148,136,0.16)}

/* Sections */
.section{padding:64px 24px}
.section--light{background:#F0F9F7}
.section--transform{background:#FFFFFF;box-shadow:inset 0 0 0 1px rgba(13,53,48,0.05)}
.section--dark{background:#0d374e;color:var(--white)}
.section--dark .section__title{color:var(--white)}
.section--dark .card{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.08);box-shadow:none}
.section--dark .card h3{color:#F4FCFB}
.section--dark p{color:#D8F5F0}
.section__title{font-family:Playfair Display,serif;font-size:28px;margin-bottom:8px}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;margin-top:18px}
.card{background:var(--white);border-radius:12px;padding:32px;box-shadow:0 10px 30px rgba(10,10,10,0.06)}
.card h3{font-size:20px;margin-bottom:12px;font-weight:700}
.card p{font-size:17px;line-height:1.6}
.card__icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:16px;background:rgba(14,148,136,0.12);}
.card--saving{border:1px solid rgba(14,148,136,0.12);background:#FFFFFF}
.card--transform{border-left:4px solid var(--accent);padding:32px;background:#FFFFFF}
.cards--savings .card{box-shadow:0 8px 24px rgba(14,148,136,0.08)}
.cards--transform{grid-template-columns:repeat(2,1fr);}

/* Testimonials */
.testimonials{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:18px}
.testimonial{background:linear-gradient(180deg,#FFFFFF,#F7FFFE);padding:16px;border-radius:12px;border:1px solid #E6F7F5}
.testimonial strong{display:block;margin-bottom:8px}

/* Value stack */
.value{max-width:640px;margin:24px auto 0;background:var(--white);padding:20px;border-radius:12px;box-shadow:0 12px 36px rgba(14,148,136,0.08)}
.price{font-family:Playfair Display,serif;font-size:48px;color:var(--accent);font-weight:900}

/* CTA Section */
.section--cta{background:#0d374e;padding:80px 24px;color:var(--white)}
.cta-card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.12);border-radius:24px;padding:72px 48px;max-width:600px;margin:0 auto}

/* Footer */
footer{text-align:center;padding:28px 24px;color:var(--muted)}

/* Images */
img{max-width:100%;height:auto;display:block}

/* Utility */
.container--narrow{max-width:760px}

/* Responsive */
@media (max-width:900px){.hero__inner{grid-template-columns:1fr}.cards{grid-template-columns:1fr}}
@media (max-width:640px){.hero{padding:48px 18px}.hero__inner{grid-template-columns:1fr}.hero__headline{font-size:28px}.card{padding:24px}.cards{gap:18px}.section--cta{padding:48px 18px}.cta-card{padding:48px 28px}.price{font-size:56px !important}}

/* Accessibility tweaks */
a:focus{outline:3px solid rgba(110,221,213,0.22);outline-offset:3px}

/* small flourishes */
.card:hover{transform:translateY(-4px);transition:transform .18s ease,box-shadow .18s ease}

/* CTA size variant */
.btn--large{padding:18px 44px;font-size:17px}

/* CTA variations */
.btn--primary{background:linear-gradient(90deg,var(--teal),#0aa992);border:none}
.btn--ghost{background:transparent;color:var(--charcoal);border:1px solid rgba(13,53,48,0.06);box-shadow:none}
.cta-note{font-size:13px;color:var(--muted);margin-top:8px}

/* Sticky purchase bar (mobile) */
.sticky-cta{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;z-index:1200;width:calc(100% - 48px);max-width:980px}
.sticky-cta .bar{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--charcoal);color:var(--white);padding:14px 16px;border-radius:14px;box-shadow:0 18px 40px rgba(10,10,10,0.28);animation: slide-up 0.35s ease-out;}
.sticky-cta .bar .price{font-size:20px;font-weight:800;color:var(--accent)}
.sticky-cta .bar .btn{padding:10px 18px;border-radius:8px}

@keyframes slide-up{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%,0)}}

@media (min-width:901px){.sticky-cta{display:none}}