/* ==========================================================================
   Iowa JD7 overrides — layered on top of GCA's style.css / bootstrap.css
   Keeps the gold (#fbdd87) / brown (#4d2111) theme; adapts the header for the
   square Iowa Judicial Branch seal + a text lockup, and removes payment UI.
   ========================================================================== */

/* --- Header brand lockup (seal + title) --- */
.brand-row {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 4px 0;
}
.brand-seal img {
    height: 96px;
    width: auto;
    display: block;
}
.brand-title {
    line-height: 1.2;
}
.brand-title strong {
    display: block;
    font: 700 24px 'Open Sans', Arial, sans-serif;
    color: #612323;
}
.brand-title span {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #A5822D;
}

/* --- Footer seal sizing (square logo) --- */
.footer-widget-image img {
    max-height: 120px;
    width: auto;
}

/* --- Hide any leftover payment / credit-card imagery (JCS covers payment) --- */
.copyright img,
img[src*="cards"] {
    display: none !important;
}

/* --- Mobile: center the brand lockup --- */
@media (max-width: 767px) {
    .brand-row {
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
    .brand-title strong { font-size: 20px; }
    .call { border: none !important; }
    .call p { justify-content: center !important; }
    /* FAQ: left-align on mobile (justify makes ugly word gaps on narrow screens) */
    .faqs { text-align: left !important; }
    .home-faq h3 { font-size: 26px !important; }
    /* Inner-page banner heading: shrink so long titles don't overflow on mobile */
    .inner-header { padding: 40px 0 !important; }
    .inner-header h1 { font-size: 24px !important; word-break: break-word; }
}

/* ==========================================================================
   MAROON & GOLD palette
   Primary maroon #612323 | darker maroon #4a1a1a | gold seal accent #A5822D
   White text on maroon.
   ========================================================================== */

/* Top strip: soft gold */
.top-bar { background: #efe6d0 !important; }
.top-bar-left a { color: #612323 !important; }
.top-bar-left a:hover { color: #A5822D !important; }
.top-bar-left i { color: #A5822D !important; }

/* Navigation bar */
.navbar { background: #612323 !important; }
.navbar-nav li.active a { background: #A5822D !important; color: #ffffff !important; }
.navbar-nav li a:hover { color: #A5822D !important; }

/* Mobile hamburger toggle — visible on the maroon nav */
.navbar-toggle { border: 1px solid #A5822D !important; border-radius: 4px; margin-top: 13px; margin-bottom: 13px; }
.navbar-toggle .icon-bar { background-color: #ffffff !important; }
.navbar-toggle:hover, .navbar-toggle:focus { background-color: #4a1a1a !important; }

/* Top-bar pills */
.register { background: #612323 !important; }
.register a { color: #A5822D !important; }
.register a:hover { color: #ffffff !important; }
.resume, a.resume:link, a.resume:visited { background: #612323 !important; color: #ffffff !important; }
a.resume:hover { background: #4a1a1a !important; color: #A5822D !important; }

/* Phone text + gold icon + level the icon with the number */
.call p {
    color: #612323 !important;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    margin-top: 0 !important;
}
.call-fa { padding: 0 !important; line-height: 1; color: #A5822D !important; }

/* Vertically center the header row so the phone lines up with the logo lockup */
@media (min-width: 768px) {
    .top-logo-sec .row { display: flex; align-items: center; }
}

/* Hero banner height */
.banner { min-height: 340px !important; }

/* Section heading accents ("OUR COURSES", "FREQUENTLY ASKED") */
.course-sec h2 span, .home-faq h3 span { color: #A5822D !important; }

/* FAQ question rows (bold) */
.faqs li:nth-child(odd) { color: #612323 !important; }

/* Footer */
footer { background: #612323 !important; border-top-color: #A5822D !important; }
.footer-widget li:before { color: #A5822D !important; }
.footer-widget a:hover { color: #A5822D !important; }

/* Support page section headings */
.troubleshoot h3 { color: #612323 !important; }

/* Course section gray background: fill the whole grid + extend below the last circles */
.course-bg { background-color: #f6f6f6 !important; padding-bottom: 60px !important; }

/* Impulse Control custom circle image */
.course-impulse-bg { background: url(../images/impulse.png) center no-repeat; width: 294px; height: 294px; margin: 0 auto; }

/* Course circles: maroon course title + gold enroll on the gold-ring topic images */
.course-detail p { color: #612323 !important; }
.course-detail p span { color: #737373 !important; }
.purchasehere, a.purchasehere:link, a.purchasehere:visited { color: #612323 !important; font-weight: 600; }
a.purchasehere:hover { color: #A5822D !important; }

/* ==========================================================================
   Course cards (maroon/gold) — replaces the circular topic-image grid
   ========================================================================== */
.courses-wrap { max-width: 1160px; margin: 0 auto; padding: 6px 15px 20px; }
.jd-grid { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -13px; }
.jd-cell { width: 33.333%; padding: 0 13px; display: flex; }
@media (max-width: 991px) { .jd-cell { width: 50%; } }
@media (max-width: 600px)  { .jd-cell { width: 100%; } }

.jd-card {
    width: 100%;
    background: #ffffff;
    border: 1px solid #e7e1d7;
    border-top: 4px solid #612323;
    border-radius: 6px;
    padding: 22px 20px 24px;
    text-align: center;
    margin-bottom: 26px;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.jd-hrs {
    display: inline-block;
    background: #A5822D;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    padding: 3px 14px;
    border-radius: 20px;
    text-transform: uppercase;
    margin-bottom: 14px;
}
.jd-card.free .jd-hrs { background: #612323; }
.jd-title { color: #612323; font-size: 18px; font-weight: 700; margin: 0 0 4px; line-height: 1.25; }
.jd-sub { color: #808080; font-size: 13.5px; margin: 0 0 16px; }
.jd-enroll, a.jd-enroll:link, a.jd-enroll:visited {
    margin-top: auto;
    display: inline-block;
    background: #612323;
    color: #fff !important;
    text-decoration: none;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: .5px;
    padding: 9px 24px;
    border-radius: 25px;
    transition: all .2s;
}
.jd-enroll:hover { background: #4a1a1a; color: #fff !important; }
.jd-enroll .fa { margin-left: 6px; }

.course-group-title {
    text-align: center; color: #612323; font-size: 24px; font-weight: 700;
    text-transform: uppercase; margin: 26px 0 4px;
}
.course-group-sub { text-align: center; color: #777; font-size: 15px; margin: 0 0 22px; }

