/* drafthammer.com — small layer over Bootstrap 5.3 */
:root {
    --dh-navy: #1b2838;
    --dh-navy-2: #23364d;
    --dh-gold: #ffc107;
    --dh-band: #f4f6f9;
}

html { scroll-behavior: smooth; scroll-padding-top: 4.5rem; }
body { display: flex; flex-direction: column; min-height: 100vh; background: #fff; }
main { flex: 1 0 auto; }

.ls-wide { letter-spacing: .12em; }

/* nav */
.dh-nav { background: var(--dh-navy); box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.dh-nav .navbar-brand { font-weight: 600; }
.dh-brand-old { color: rgba(255,255,255,.6); text-decoration: line-through; text-decoration-thickness: 1px; }
.dh-brand-img { object-fit: cover; border: 2px solid rgba(255,255,255,.35); }

/* hero */
.dh-hero {
    background:
        radial-gradient(1200px 400px at 85% -10%, rgba(255,193,7,.18), transparent 60%),
        linear-gradient(160deg, var(--dh-navy) 0%, var(--dh-navy-2) 60%, #2d4a6a 100%);
}
.dh-hero-compact { border-bottom: 4px solid var(--dh-gold); }
.dh-hero-img { border: 5px solid rgba(255,255,255,.85); width: min(260px, 100%); height: auto; }

/* sections */
.dh-band { background: var(--dh-band); }
.dh-link { color: #0d5fb3; text-decoration: none; font-weight: 600; }
.dh-link:hover { text-decoration: underline; }

/* feature cards */
.dh-feature { transition: transform .15s ease, box-shadow .15s ease; }
.dh-feature:hover { transform: translateY(-3px); box-shadow: 0 .75rem 1.5rem rgba(27,40,56,.12) !important; }
.dh-feature-icon {
    width: 3.25rem; height: 3.25rem; border-radius: .9rem;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--dh-navy); color: var(--dh-gold); font-size: 1.5rem;
}

/* league grid */
.dh-league { color: #212529; background: #fff; border: 1px solid #e3e7ec; text-decoration: none; }
.dh-league:hover { border-color: var(--dh-navy); background: #fffdf5; color: #000; }
.dh-league-init { min-width: 4.5rem; font-size: .7rem; letter-spacing: .03em; }

/* micromanagers */
.dh-mm-glyph { font-size: 9rem; color: #e3e7ec; }
#mmTable th.dh-mm-name, #mmTable td:first-child { min-width: 280px; }
#mmTable thead th { white-space: nowrap; }

/* contact honeypot: keep out of view, out of tab order, but present in the DOM */
.dh-hp { position: absolute; left: -5000px; width: 1px; height: 1px; overflow: hidden; }

/* footer */
.dh-footer { background: var(--dh-navy); color: rgba(255,255,255,.75); }
.dh-footer a { color: #fff; text-decoration: none; }
.dh-footer a:hover { color: var(--dh-gold); }