/*
|--------------------------------------------------------------------------
| TMLC COMPETITION 2027 UI REFRESH
|--------------------------------------------------------------------------
|
| VISUAL OVERRIDES ONLY.
| No competition logic is controlled from this stylesheet.
|
*/

:root {
    --tmlc-navy: #071a36;
    --tmlc-navy-2: #0b3766;
    --tmlc-blue: #0b72c9;
    --tmlc-sky: #19ade4;
    --tmlc-gold: #ffd338;
    --tmlc-gold-deep: #efb900;
    --tmlc-purple: #6542c5;
    --tmlc-red: #e33a47;
    --tmlc-green: #17a66c;
    --tmlc-soft: #f4f7fb;
    --tmlc-border: #dfe7ef;
    --tmlc-text: #14243c;
    --tmlc-muted: #6e7b8d;
}

.tmlc-competition-page {
    font-family: "Inter", sans-serif;
    color: var(--tmlc-text);
    background: #f7f9fc;
}

.tmlc-competition-page h1,
.tmlc-competition-page h2,
.tmlc-competition-page h3,
.tmlc-competition-page h4,
.tmlc-competition-page h5,
.tmlc-competition-page h6 {
    font-family: "Inter", sans-serif;
    letter-spacing: -.035em;
}

/* TOP BAR */

.tmlc-topbar {
    background: linear-gradient(90deg, #061a35, #0c4d85);
    color: #fff;
    padding: 9px 0;
    font-size: 11px;
}

.tmlc-topbar-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.tmlc-topbar-contact {
    display: flex;
    gap: 22px;
    flex-wrap: wrap;
}

.tmlc-topbar-contact span,
.tmlc-topbar-contact a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: rgba(255,255,255,.88);
    text-decoration: none;
}

.tmlc-topbar-contact i {
    color: var(--tmlc-gold);
}

.tmlc-topbar-tagline {
    color: var(--tmlc-gold);
    font-family: "DM Serif Display", serif;
    font-size: 16px;
    font-style: italic;
}

/* HEADER */

.tmlc-2027-header {
    background: #fff;
    box-shadow: 0 6px 24px rgba(7,26,54,.08);
}

.tmlc-2027-header .navbar {
    padding: 11px 0;
}

.tmlc-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    max-width: 380px;
}

.tmlc-brand-crest {
    width: 76px;
    height: 76px;
    object-fit: contain;
}

.tmlc-brand-copy {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.tmlc-brand-copy strong {
    color: #263573;
    font-size: 19px;
    font-weight: 900;
    text-transform: uppercase;
    line-height: .96;
}

.tmlc-brand-copy strong span {
    display: block;
}

.tmlc-brand-copy small {
    margin-top: 7px;
    color: #d2a900;
    font-family: "DM Serif Display", serif;
    font-size: 14px;
    font-style: italic;
}

.tmlc-2027-header .nav-link {
    color: #172746 !important;
    font-size: 12px;
    font-weight: 750;
    border-radius: 8px;
    padding: 11px 9px !important;
}

.tmlc-2027-header .nav-link:hover,
.tmlc-2027-header .nav-link.active {
    color: var(--tmlc-blue) !important;
}

.tmlc-login-btn,
.tmlc-apply-btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 14px;
    border-radius: 11px;
    font-size: 11px;
    font-weight: 850;
    text-decoration: none;
}

.tmlc-login-btn {
    color: var(--tmlc-navy);
    background: #fff;
    border: 1px solid var(--tmlc-border);
}

.tmlc-apply-btn {
    color: var(--tmlc-navy);
    background: linear-gradient(135deg, var(--tmlc-gold), #ffbd00);
}

/* HERO */

.challenge-hero {
    position: relative;
    overflow: hidden;
    min-height: 410px;
    padding: 74px 0 92px !important;
    background:
        radial-gradient(circle at 88% 24%, rgba(255,211,56,.16), transparent 26%),
        radial-gradient(circle at 72% 88%, rgba(25,173,228,.25), transparent 28%),
        linear-gradient(120deg, #061a35 0%, #0a315d 55%, #0a5795 100%) !important;
}

.challenge-hero::before {
    content: "π";
    position: absolute;
    right: 8%;
    top: -70px;
    font-family: Georgia, serif;
    font-size: 340px;
    line-height: 1;
    color: rgba(255,255,255,.035);
    pointer-events: none;
}

.challenge-hero-pattern {
    opacity: .16;
}

.challenge-badge {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    padding: 8px 12px !important;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px !important;
    background: rgba(255,255,255,.08) !important;
    color: var(--tmlc-gold) !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: .09em;
}

.challenge-main-title {
    max-width: 930px;
    margin: 18px 0 0 !important;
    color: #fff !important;
    font-size: clamp(48px, 6vw, 78px) !important;
    line-height: .98 !important;
    font-weight: 900 !important;
    letter-spacing: -.055em !important;
}

.challenge-main-title span {
    display: block;
    color: var(--tmlc-gold) !important;
}

.challenge-lead {
    max-width: 720px;
    margin-top: 20px !important;
    color: rgba(255,255,255,.75) !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

.challenge-feature-row {
    display: flex !important;
    gap: 12px !important;
    flex-wrap: wrap;
    margin-top: 28px !important;
}

.challenge-feature {
    min-width: 190px;
    padding: 13px 15px !important;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 15px !important;
    background: rgba(255,255,255,.07) !important;
    backdrop-filter: blur(5px);
}

.challenge-feature-icon {
    background: var(--tmlc-gold) !important;
    color: var(--tmlc-navy) !important;
    border-radius: 12px !important;
}

.challenge-feature strong {
    color: #fff !important;
    font-weight: 850 !important;
}

.challenge-feature small {
    color: rgba(255,255,255,.58) !important;
}

/* MAIN AREA */

.challenge-main-section {
    padding: 54px 0 90px !important;
    background:
        linear-gradient(180deg, #f8fbfe 0%, #fff 48%, #f7f9fc 100%) !important;
}

.challenge-section-kicker {
    color: var(--tmlc-blue) !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: .1em !important;
}

/* SCHEDULE */

.challenge-schedule-wrap {
    padding: 23px !important;
    border: 1px solid var(--tmlc-border);
    border-radius: 21px !important;
    background: #fff;
    box-shadow: 0 14px 42px rgba(7,26,54,.06);
}

.challenge-schedule-heading h3 {
    color: var(--tmlc-navy) !important;
    font-size: 24px !important;
    font-weight: 900 !important;
}

.challenge-mini-row {
    border: 1px solid var(--tmlc-border) !important;
    border-radius: 15px !important;
    box-shadow: none !important;
}

.challenge-mini-row.finished {
    background: #f7f9fc !important;
}

.challenge-mini-row.upcoming {
    border-left: 4px solid var(--tmlc-gold) !important;
    background: linear-gradient(90deg, #fffdf4, #fff) !important;
}

.challenge-countdown-segment {
    background: var(--tmlc-navy) !important;
    border-radius: 10px !important;
}

/* PRIZES */

.challenge-prizes {
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 34px;
    border-radius: 24px;
    border: 1px solid var(--tmlc-border);
    background: #fff;
    box-shadow: 0 14px 45px rgba(7,26,54,.06);
}

.challenge-section-heading h2 {
    color: var(--tmlc-navy) !important;
    font-size: 34px !important;
    font-weight: 900 !important;
}

.public-prize-card {
    min-height: 265px;
    border-radius: 21px !important;
    border: 1px solid var(--tmlc-border) !important;
    box-shadow: 0 12px 35px rgba(7,26,54,.06) !important;
}

.prize-first {
    border: 2px solid var(--tmlc-gold) !important;
    background:
        linear-gradient(180deg, #fff9dc, #fff) !important;
}

.prize-second {
    background:
        linear-gradient(180deg, #f3f6fb, #fff) !important;
}

.prize-third {
    background:
        linear-gradient(180deg, #fff1e7, #fff) !important;
}

/* ENTRY PANEL */

.challenge-panel {
    overflow: hidden;
    border: 1px solid var(--tmlc-border) !important;
    border-radius: 22px !important;
    background: #fff !important;
    box-shadow: 0 16px 50px rgba(7,26,54,.07) !important;
}

.challenge-panel-heading {
    padding: 26px 27px 22px !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(25,173,228,.12), transparent 28%),
        #fff;
    border-bottom: 1px solid #edf1f5;
}

.challenge-panel-heading h2 {
    color: var(--tmlc-navy) !important;
    font-size: 29px !important;
    font-weight: 900 !important;
}

.challenge-live-badge {
    background: #e8f8ef !important;
    color: #157748 !important;
    border: 1px solid #c7ebd7;
}

.challenge-closing-countdown {
    margin-top: 8px !important;
    background: #fff0f1 !important;
    border: 1px solid #f1b8bd !important;
    border-radius: 11px !important;
}

.challenge-closing-label,
.challenge-closing-time {
    color: var(--tmlc-red) !important;
}

.challenge-closing-time {
    font-weight: 900 !important;
}

.challenge-info-strip {
    margin: 20px 26px 0 !important;
    border-radius: 14px !important;
    background: #f4f8fc !important;
    border: 1px solid #e4ebf2;
}

.challenge-form-heading h4 {
    color: var(--tmlc-navy) !important;
    font-size: 24px !important;
    font-weight: 900 !important;
}

.challenge-entry-panel form {
    padding: 25px 27px 30px;
}

.challenge-entry-panel .form-label {
    color: #25354c;
    font-size: 11px;
    font-weight: 800;
}

.challenge-entry-panel .form-control,
.challenge-entry-panel .form-select,
.challenge-result-lookup .form-control,
.challenge-result-lookup .form-select {
    min-height: 49px;
    border: 1px solid #d8e1ea;
    border-radius: 11px;
    background: #fff;
    box-shadow: none;
    font-size: 13px;
}

.challenge-entry-panel .form-control:focus,
.challenge-entry-panel .form-select:focus,
.challenge-result-lookup .form-control:focus,
.challenge-result-lookup .form-select:focus {
    border-color: var(--tmlc-blue);
    box-shadow: 0 0 0 3px rgba(11,114,201,.09);
}

.challenge-consent-box {
    border-radius: 14px !important;
    background: #f7f9fc !important;
    border: 1px solid var(--tmlc-border) !important;
}

.challenge-primary-btn {
    min-height: 50px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #0b72c9, #0a4b88) !important;
    color: #fff !important;
    box-shadow: 0 10px 25px rgba(11,114,201,.18);
    font-weight: 850 !important;
}

.challenge-primary-btn:hover {
    transform: translateY(-1px);
}

/* QUIZ */

.challenge-quiz-header {
    padding: 24px 26px !important;
    border-radius: 20px !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(255,211,56,.13), transparent 25%),
        linear-gradient(135deg, #071a36, #0b4f91) !important;
    color: #fff;
}

.challenge-quiz-header h2 {
    color: #fff !important;
    font-weight: 900 !important;
}

.challenge-quiz-header p {
    color: rgba(255,255,255,.66) !important;
}

.challenge-timer {
    border-radius: 14px !important;
    background: rgba(255,255,255,.1) !important;
    border: 1px solid rgba(255,255,255,.14);
}

.challenge-timer span {
    color: var(--tmlc-gold) !important;
}

.challenge-progress-card,
.challenge-refresh-warning,
.challenge-question-card,
.challenge-question-navigation {
    border-radius: 17px !important;
    border: 1px solid var(--tmlc-border) !important;
    box-shadow: 0 12px 36px rgba(7,26,54,.05) !important;
}

.challenge-refresh-warning {
    background: #fff7dc !important;
    border-color: #efd77d !important;
}

.challenge-question-card {
    background: #fff !important;
    padding: 28px !important;
}

.question-number {
    color: var(--tmlc-blue) !important;
    font-weight: 900 !important;
}

.question-subject {
    background: #eaf5ff !important;
    color: var(--tmlc-blue) !important;
}

.quiz-option {
    border-radius: 13px !important;
    border: 1px solid #dce4ec !important;
    background: #fff !important;
}

.quiz-option:hover {
    border-color: var(--tmlc-blue) !important;
    background: #f7fbff !important;
}

.quiz-option:has(input:checked) {
    border-color: var(--tmlc-blue) !important;
    background: #edf7ff !important;
    box-shadow: 0 0 0 2px rgba(11,114,201,.07);
}

.quiz-option-letter {
    background: var(--tmlc-navy) !important;
    color: #fff !important;
}

#nextQuestion {
    background: linear-gradient(135deg, #0b72c9, #0a4d8d) !important;
}

/* SIDE CARDS */

.challenge-side-card {
    overflow: hidden;
    border-radius: 20px !important;
    border: 1px solid var(--tmlc-border) !important;
    background: #fff !important;
    box-shadow: 0 14px 42px rgba(7,26,54,.055) !important;
}

.side-card-heading {
    padding-bottom: 17px !important;
    border-bottom: 1px solid #edf1f5;
}

.side-card-heading h3 {
    color: var(--tmlc-navy) !important;
    font-weight: 900 !important;
}

.side-card-icon {
    background: var(--tmlc-gold) !important;
    color: var(--tmlc-navy) !important;
}

.side-card-icon.blue-icon {
    background: #eaf5ff !important;
    color: var(--tmlc-blue) !important;
}

.leaderboard-item {
    border-radius: 12px !important;
}

.leaderboard-rank-first {
    background: #fff9dc !important;
}

.leaderboard-rank-second {
    background: #f4f7fa !important;
}

.leaderboard-rank-third {
    background: #fff2e8 !important;
}

/* RESULT LOOKUP */

.challenge-result-lookup {
    padding: 30px !important;
    border: 1px solid var(--tmlc-border) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(255,211,56,.09), transparent 25%),
        #fff !important;
    box-shadow: 0 16px 45px rgba(7,26,54,.06);
}

.challenge-result-lookup .lookup-icon {
    background: var(--tmlc-gold) !important;
    color: var(--tmlc-navy) !important;
}

.challenge-result-lookup h3 {
    color: var(--tmlc-navy) !important;
    font-size: 25px !important;
    font-weight: 900 !important;
}

.private-result-card {
    border-radius: 22px !important;
    box-shadow: 0 16px 48px rgba(7,26,54,.07) !important;
}

.result-metric {
    border-radius: 14px !important;
    background: #f5f8fb !important;
}

.result-metric strong {
    color: var(--tmlc-blue) !important;
}

/* FOOTER */

.tmlc-competition-footer {
    padding: 42px 0 22px;
    background: #061a35;
    color: #fff;
}

.tmlc-competition-footer-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 28px;
    padding-bottom: 28px;
    border-bottom: 1px solid rgba(255,255,255,.1);
}

.tmlc-competition-footer-brand {
    display: flex;
    align-items: center;
    gap: 14px;
}

.tmlc-competition-footer-brand img {
    width: 68px;
    height: 68px;
    object-fit: contain;
}

.tmlc-competition-footer-brand strong,
.tmlc-competition-footer-brand span {
    display: block;
}

.tmlc-competition-footer-brand strong {
    font-size: 17px;
    font-weight: 850;
}

.tmlc-competition-footer-brand span {
    margin-top: 3px;
    color: var(--tmlc-gold);
    font-family: "DM Serif Display", serif;
    font-style: italic;
}

.tmlc-competition-footer-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.tmlc-competition-footer-actions a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 43px;
    padding: 9px 14px;
    border-radius: 10px;
    color: #fff;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,.18);
    font-size: 11px;
    font-weight: 800;
}

.tmlc-competition-footer-actions a:first-child {
    color: var(--tmlc-navy);
    background: var(--tmlc-gold);
    border-color: var(--tmlc-gold);
}

.tmlc-competition-footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding-top: 20px;
    color: rgba(255,255,255,.52);
    font-size: 10px;
}

.tmlc-competition-footer-bottom div {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.tmlc-competition-footer-bottom a {
    color: rgba(255,255,255,.68);
    text-decoration: none;
}

/* MOBILE */

@media (max-width: 1199px) {
    .tmlc-brand-copy {
        display: none;
    }

    .tmlc-brand {
        max-width: 90px;
    }
}

@media (max-width: 991px) {
    .tmlc-topbar-tagline {
        display: none;
    }

    .tmlc-topbar-inner {
        justify-content: center;
    }

    .challenge-hero {
        padding: 64px 0 78px !important;
    }

    .challenge-feature {
        min-width: 0;
        flex: 1 1 180px;
    }
}

@media (max-width: 767px) {
    .tmlc-topbar-contact {
        justify-content: center;
        gap: 10px 16px;
    }

    .tmlc-topbar-contact span:first-child,
    .tmlc-topbar-contact a:last-child {
        display: none;
    }

    .tmlc-brand-crest {
        width: 66px;
        height: 66px;
    }

    .challenge-main-title {
        font-size: 47px !important;
    }

    .challenge-hero {
        min-height: 0;
        padding: 52px 0 68px !important;
    }

    .challenge-feature-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    .challenge-prizes,
    .challenge-result-lookup {
        padding: 22px 17px !important;
    }

    .challenge-panel-heading {
        padding: 21px 18px 18px !important;
    }

    .challenge-entry-panel form {
        padding: 20px 18px 24px;
    }

    .challenge-info-strip {
        margin: 16px 17px 0 !important;
    }

    .challenge-question-card {
        padding: 20px 16px !important;
    }

    .tmlc-competition-footer-inner,
    .tmlc-competition-footer-bottom {
        display: block;
        text-align: center;
    }

    .tmlc-competition-footer-brand {
        justify-content: center;
    }

    .tmlc-competition-footer-actions {
        justify-content: center;
        margin-top: 20px;
    }

    .tmlc-competition-footer-bottom div {
        justify-content: center;
        margin-top: 12px;
    }
}