:root {
     --brand: #1f6feb;
     --dark: #0b1220;
     --muted: #6c757d;
     --bg: #f6f8fb;
 }

 body {
     color: #111;
 }

 .navbar {
     background: #fff;
 }

 .hero {
     background: linear-gradient(180deg, #0b1220 0%, #111a2e 100%);
     color: #fff;
     position: relative;
     overflow: hidden;
 }

 label span {
     color: #cc0000;
 }

 .hero .badge-soft {
     background: rgba(255, 255, 255, .12);
     border: 1px solid rgba(255, 255, 255, .18);
     color: #fff;
     font-weight: 600;
 }

 .hero .lead {
     color: rgba(255, 255, 255, .85);
 }

 .hero-visual {
     background: rgba(255, 255, 255, .06);
     border: 1px dashed rgba(255, 255, 255, .25);
     border-radius: .75rem;
     min-height: 340px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     padding: 1.5rem;
 }

 .hero-visual small {
     color: rgba(255, 255, 255, .75);
 }

 .section {
     padding: 4.5rem 0;
 }

 .section-alt {
     background: var(--bg);
 }

 .kicker {
     text-transform: uppercase;
     letter-spacing: .08em;
     font-size: .85rem;
     color: var(--muted);
     font-weight: 700;
 }

 .card {
     border: 0;
     box-shadow: 0 10px 30px rgba(16, 24, 40, .06);
     border-radius: .9rem;
 }

 .card.card-outline {
     box-shadow: none;
     border: 1px solid rgba(0, 0, 0, .08);
 }

 .icon-placeholder {
     width: 42px;
     height: 42px;
     border-radius: 10px;
     background: rgba(31, 111, 235, .10);
     border: 1px dashed rgba(31, 111, 235, .35);
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: 700;
     color: var(--brand);
     flex: 0 0 42px;
 }

 .img-slot {
     background: #fff;
     border: 1px dashed rgba(0, 0, 0, .18);
     border-radius: .75rem;
     min-height: 240px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     padding: 1.25rem;
     color: var(--muted);
 }

 .btn-primary {
     background: var(--brand);
     border-color: var(--brand);
     border-radius: .65rem;
     padding: .75rem 1rem;
     font-weight: 700;
 }

 .btn-primary:focus {
     box-shadow: 0 0 0 .2rem rgba(31, 111, 235, .25);
 }

 .microcopy {
     color: var(--muted);
     font-size: .95rem;
 }

 .quote {
     position: relative;
     padding-left: 1.25rem;
     border-left: 4px solid rgba(31, 111, 235, .25);
 }

 .quote p {
     font-style: italic;
 }

 .footer {
     background: #0b1220;
     color: rgba(255, 255, 255, .85);
     padding: 2.5rem 0;
 }

 .footer a {
     color: #fff;
     text-decoration: underline;
 }

 .anchor-offset {
     scroll-margin-top: 90px;
 }

 .media-body {
     padding-top: 7px;
 }