html { scroll-behavior: smooth; }

.container-padding { padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px) { .container-padding { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .container-padding { padding-left: 2rem; padding-right: 2rem; } }

.section { padding-top: 4rem; padding-bottom: 4rem; }
@media (min-width: 640px) { .section { padding-top: 5rem; padding-bottom: 5rem; } }
@media (min-width: 1024px) { .section { padding-top: 7rem; padding-bottom: 7rem; } }

.card { border-radius: 1rem; border: 1px solid rgb(229 231 235); background: #fff; box-shadow: 0 6px 24px rgba(0,0,0,0.06); }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: 9999px; padding: .625rem 1.25rem; font-size: .875rem; font-weight: 600; transition: background-color .2s; outline: none; }
.btn:focus-visible { box-shadow: 0 0 0 2px #3b5bdb40, 0 0 0 4px #fff0; }
.btn-primary { background: #3b5bdb; color: #fff; }
.btn-primary:hover { background: #364fc7; }
.btn-secondary { background: #fff; color: #3b5bdb; box-shadow: 0 0 0 1px rgba(59,91,219,.3) inset; }
.btn-secondary:hover { background: rgba(59,91,219,.1); }

.badge { display: inline-flex; align-items: center; border-radius: 9999px; border: 1px solid rgb(229 231 235); background: #fff; padding: .25rem .75rem; font-size: .75rem; font-weight: 500; color: rgb(75 85 99); box-shadow: 0 1px 1px rgba(0,0,0,.03); }

/* Reveal animations */
.reveal { transition: opacity .6s ease, transform .6s ease; }
.reveal.in-view { opacity: 1 !important; transform: translateY(0) !important; }

/* Header scroll state */
#site-header.scrolled { background: rgba(255,255,255,.7); border-bottom: 1px solid rgb(229 231 235); }