/* ============================================================
   CCPDGC — custom styles layered over Bootstrap/Sandstone
   ============================================================ */

:root {
    --charcoal: #2b2b2b;
    --charcoal-90: rgba(43, 43, 43, 0.92);

    /* Make text links the Sandstone PRIMARY blue (matches buttons),
       overriding Sandstone's default green link color. */
    --bs-link-color: #325d88;
    --bs-link-color-rgb: 50, 93, 136;
    --bs-link-hover-color: #284a6d;      /* primary, ~20% darker */
    --bs-link-hover-color-rgb: 40, 74, 109;
}

html { scroll-behavior: smooth; }
body {
    font-family: 'Figtree', 'Segoe UI', system-ui, sans-serif;
    /* offset for fixed navbar when jumping to anchors */
    scroll-padding-top: 72px;
}

/* keep in-page anchors clear of the fixed navbar */
section[id], header[id] { scroll-margin-top: 72px; }

.letter-spaced { letter-spacing: 0.08em; }
.text-white-75 { color: rgba(255, 255, 255, 0.78); }

/* ---------- Navbar ---------- */
.navbar-charcoal {
    background-color: var(--charcoal-90);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
.navbar-charcoal.scrolled {
    background-color: var(--charcoal);
    box-shadow: 0 2px 18px rgba(0, 0, 0, 0.25);
}
.bg-charcoal { background-color: var(--charcoal) !important; }
.navbar .nav-link { font-weight: 500; }

/* ---------- Hero ---------- */
.hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.hero-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.03);
}
.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.30) 40%, rgba(0,0,0,0.60) 100%);
}
.hero-content {
    position: relative;
    z-index: 2;
    padding: 6rem 1rem;
    max-width: 900px;
}
.hero-content h1 { text-shadow: 0 2px 20px rgba(0, 0, 0, 0.45); }
.hero-sub { color: rgba(255, 255, 255, 0.82); }
.hero-logo {
    width: min(600px, 86vw);   /* scale down on narrow screens instead of clipping */
    height: auto;
    max-width: 100%;
    filter: drop-shadow(0 4px 12px rgba(0,0,0,0.4));
}
.hero-scroll {
    position: absolute;
    bottom: 1.5rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    color: rgba(255, 255, 255, 0.85);
    font-size: 1.75rem;
    animation: bob 2s ease-in-out infinite;
}
.hero-scroll:hover { color: #fff; }
@keyframes bob { 0%,100% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, 8px); } }

@media (max-width: 575.98px) {
    .hero-content h1 { font-size: 2.5rem; }
    .hero { min-height: 88vh; }
}

/* ---------- Course section ---------- */
.course-img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}
.ironwood-mark {
    height: 96px;
    width: auto;
}
.video-link {
    font-weight: 600;
    text-decoration: none;
}
.video-link:hover { text-decoration: underline; }
.video-link .bi-youtube { color: #ff0000; font-size: 1.3em; }
.course-facts li {
    font-size: 1.05rem;
    padding: 0.35rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.course-facts li:last-child { border-bottom: 0; }

/* ---------- Help cards ---------- */
.help-card { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.help-card:hover { transform: translateY(-4px); box-shadow: 0 1rem 2rem rgba(0,0,0,0.12) !important; }
.help-icon {
    width: 60px; height: 60px;
    border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.6rem;
}
.sponsor-tiers li {
    padding: 0.4rem 0;
    border-bottom: 1px dashed rgba(0, 0, 0, 0.1);
}
.sponsor-tiers li:last-child { border-bottom: 0; }
.tier-price {
    font-weight: 700;
    font-size: 1.15rem;
    color: var(--bs-primary);
    display: inline-block;
    min-width: 4.5rem;
}

/* ---------- Volunteer band ---------- */
.volunteer-band {
    position: relative;
    background: linear-gradient(var(--charcoal-90), var(--charcoal-90)),
                url('../img/course/sunrays.jpg') center/cover no-repeat fixed;
}
.volunteer-perks i { color: #ffc107; }

@media (max-width: 991.98px) {
    /* fixed backgrounds are janky on mobile */
    .volunteer-band { background-attachment: scroll; }
}

/* ---------- Contact ---------- */
.contact-details li { display: flex; }
.contact-ico {
    flex: 0 0 1.75rem;   /* fixed icon column so all text shares one left edge */
    width: 1.75rem;
    margin-top: 0.05rem;  /* nudge icon onto the first text line */
}
.contact-details a { text-decoration: none; }
.contact-details a:hover { text-decoration: underline; }

/* ---------- Footer ---------- */
.footer-nav a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    margin: 0 0.25rem;
    font-weight: 500;
}
.footer-nav a:hover { color: #fff; }
.icrc-link img { opacity: 0.85; transition: opacity 0.2s ease; }
.icrc-link:hover img { opacity: 1; }

/* ---------- Form status ---------- */
.form-status:empty { display: none; }
.form-status .alert { margin-bottom: 0; }