/* Home page styles extracted from inline <style> for CSP + maintainability */

.navbar-custom { background:#fff; box-shadow:0 2px 8px rgba(0,0,0,0.05); }
.navbar-custom .navbar-brand { font-weight:700; color:#0d6efd; }
.navbar-custom .nav-link { color:#555; font-weight:500; }
.navbar-custom .btn-login { border:2px solid #0d6efd; color:#0d6efd; transition:background .3s,color .3s; }
.navbar-custom .btn-login:hover { background:#0d6efd; color:#fff; }

/* Dark theme overrides */
body[data-theme='dark'] .navbar-custom { background:#0d1115; box-shadow:0 2px 8px -2px rgba(0,0,0,.7); }
body[data-theme='dark'] .navbar-custom .navbar-brand { color:#7fb4ff; }
body[data-theme='dark'] .navbar-custom .nav-link { color:#c2cbd2; }
body[data-theme='dark'] .navbar-custom .nav-link:hover { color:#fff; }
body[data-theme='dark'] .navbar-custom .btn-login { border-color:#215a9f; color:#7fb4ff; }
body[data-theme='dark'] .navbar-custom .btn-login:hover { background:#215a9f; color:#fff; }

.hero { position:relative; background:linear-gradient(135deg,#0d6efd 0%,#00c6ff 100%); color:#fff; padding:120px 0 80px; text-align:center; overflow:hidden; }
.hero h1 { font-size:3rem; font-weight:700; margin-bottom:.5rem; }
.hero p.lead { font-size:1.25rem; margin-bottom:1.5rem; }
.hero .btn-primary { padding:.75rem 2rem; font-size:1rem; }
.hero svg { position:absolute; bottom:-1px; left:0; width:100%; height:80px; fill:#fff; }
body[data-theme='dark'] .hero { background:linear-gradient(135deg,#0f1820 0%,#14222c 55%,#0f1820 100%); color:#e1e7ec; }
body[data-theme='dark'] .hero svg { fill:#0b1014; }
body[data-theme='dark'] .hero .btn-primary { background:#215a9f; border:none; }
body[data-theme='dark'] .hero .btn-primary:hover { background:#2b6dbd; }

section { padding:60px 0; }
section h2 { font-weight:600; margin-bottom:2rem; text-align:center; }

.feature-card { transition:transform .3s, box-shadow .3s; }
.feature-card:hover { transform:translateY(-5px); box-shadow:0 6px 18px rgba(0,0,0,0.1); }
.feature-card .card-body { text-align:center; }
.feature-card i { font-size:2.5rem; color:#0d6efd; margin-bottom:.75rem; }
body[data-theme='dark'] .feature-card { background:#141a20; border:1px solid #1f262c; }
body[data-theme='dark'] .feature-card:hover { box-shadow:0 6px 18px -6px rgba(0,0,0,.7); }
body[data-theme='dark'] .feature-card i { color:#7fb4ff; }

.testimonial-card { background:#f8f9fa; border:none; transition:transform .3s; }
.testimonial-card:hover { transform:translateY(-3px); }
.testimonial-card .card-body p { font-style:italic; }
.testimonial-card .card-footer { background:transparent; border-top:none; text-align:right; font-weight:600; }
body[data-theme='dark'] .testimonial-card { background:#141a20; }
body[data-theme='dark'] .testimonial-card .card-footer { color:#c9d1d7; }

.pricing-card { border:none; transition:transform .3s, box-shadow .3s; }
.pricing-card:hover { transform:translateY(-5px); box-shadow:0 6px 18px rgba(0,0,0,0.1); }
.pricing-card .card-header { background:#0d6efd; color:#fff; font-size:1.5rem; font-weight:700; }
.pricing-card .btn { margin-top:1rem; }
body[data-theme='dark'] .pricing-card { background:#141a20; }
body[data-theme='dark'] .pricing-card .card-header { background:#215a9f; }
body[data-theme='dark'] .pricing-card:hover { box-shadow:0 6px 18px -6px rgba(0,0,0,.7); }

.cta { background:#0d6efd; color:#fff; text-align:center; padding:60px 20px; }
.cta .btn-light { color:#0d6efd; background:#fff; font-weight:600; padding:.75rem 2rem; transition:background .3s,color .3s; }
.cta .btn-light:hover { background:#e9ecef; }
body[data-theme='dark'] .cta { background:#14222c; }
body[data-theme='dark'] .cta .btn-light { background:#1f2a32; color:#7fb4ff; }
body[data-theme='dark'] .cta .btn-light:hover { background:#273440; color:#fff; }

/* Responsive tweaks */
@media (max-width:992px){ .hero { padding:100px 0 70px; } .hero h1 { font-size:2.5rem; } }
@media (max-width:768px){ .hero { padding:80px 0 60px; } .hero h1 { font-size:2.2rem; } .hero p.lead { font-size:1.1rem; } }
@media (max-width:576px){ .hero h1 { font-size:1.9rem; } .hero p.lead { font-size:1rem; } }

.logo-max { max-width:480px; }
@media (max-width:576px){ .logo-max { max-width:300px; } }