/* KCBMC Eastern Region - Custom Styles
 * Theme: "A 클래식" — light, blue (#0067B1) + orange (#E5842B) accent, Pretendard.
 */

:root {
    --blue: #0067B1; --blue-d: #005291;
    --accent: #E5842B; --accent-d: #CC6F1C;
    --ink: #13314F; --body: #4A5C6E; --muted: #7A8A99;
    --line: #E2E8EF; --bg: #FFFFFF; --alt: #EEF2F6; --card: #FFFFFF;
    --band: #0067B1; --dark: #0E2740;
    --card-sh: 0 2px 16px rgba(19,49,79,.08); --r: 6px; --rbtn: 4px;
}

/* Brand-blue utilities — these are NOT in the prebuilt tailwind.css, so define them
   here (loaded after tailwind.css). Without these, bg-brand/text-brand render as
   nothing (white background + invisible white text on CTA bands). */
.bg-brand { background-color: var(--blue); }
.bg-brand-light { background-color: #E6F0F7; }
.bg-brand-dark { background-color: var(--blue-d); }
.bg-brand\/10 { background-color: rgba(0, 103, 177, 0.10); }
.bg-brand\/15 { background-color: rgba(0, 103, 177, 0.15); }
.bg-brand\/20 { background-color: rgba(0, 103, 177, 0.20); }
.text-brand { color: var(--blue); }
.text-brand-dark { color: var(--blue-d); }
.border-brand { border-color: var(--blue); }
.border-brand-dark { border-color: var(--blue-d); }
.border-brand\/20 { border-color: rgba(0, 103, 177, 0.20); }
.border-brand\/30 { border-color: rgba(0, 103, 177, 0.30); }
.hover\:bg-brand:hover { background-color: var(--blue); }
.hover\:bg-brand-dark:hover { background-color: var(--blue-d); }
.hover\:text-brand:hover { color: var(--blue); }
.hover\:bg-brand-light:hover { background-color: #D7E7F3; }
.border-l-brand { border-left-color: var(--blue); }
.border-l-brand-light { border-left-color: #9CC6E3; }
.border-l-gold-400 { border-left-color: #E5842B; }
.border-l-navy-400 { border-left-color: #5B6E80; }

* {
    font-family: 'Pretendard', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Headings default to ink on light content. Dark hero banners re-assert white below. */
main h1, main h2, main h3, main h4, main h5, main h6 { color: var(--ink); }

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

/* Korean text: prevent mid-word breaks, prevent horizontal scroll */
body {
    word-break: keep-all;
    overflow-wrap: break-word;
    overflow-x: hidden;
}

::selection { background: var(--accent); color: #fff; }

/* ========================================
   Sub-page Hero Banners (stay dark — image + overlay + white text)
   ======================================== */
.hero-banner {
    position: relative;
    min-height: 200px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.5rem;
}
.hero-banner img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.hero-banner .hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(14, 39, 64, 0.82) 0%,
        rgba(14, 39, 64, 0.72) 40%,
        rgba(14, 39, 64, 0.96) 100%
    );
}
.hero-banner .hero-content {
    position: relative;
    z-index: 1;
    text-align: center;
    width: 100%;
    max-width: 48rem;
    margin: 0 auto;
    padding: 0 0.5rem;
}
/* Re-assert white headings/text inside dark hero banners (beats the ink rule above) */
.hero-banner h1, .hero-banner h2, .hero-banner h3, .hero-banner h4 { color: #fff; }
@media (min-width: 768px) {
    .hero-banner {
        min-height: 220px;
        max-height: 320px;
        padding: 3rem 2rem;
    }
}

/* ========================================
   Mobile Sticky Navigation - Firm & Sturdy (light)
   ======================================== */
.mobile-header-fixed {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
    background-color: rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}
.mobile-bottom-fixed {
    position: fixed !important;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
    background-color: rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    box-shadow: 0 -2px 12px rgba(19, 49, 79, 0.06);
}

/* Hide scrollbar */
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Gradient text (orange accent) */
.gradient-text {
    background: linear-gradient(135deg, #E5842B 0%, #CC6F1C 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Hero gradient background (deep navy) */
.hero-gradient {
    background: linear-gradient(135deg, #0E2740 0%, #13314F 55%, #0E2740 100%);
    position: relative;
    overflow: hidden;
}
.hero-gradient::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23E5842B' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    opacity: 0.5;
}

/* Card hover */
.card-hover {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-hover:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px -12px rgba(19, 49, 79, 0.18);
}

/* Button press */
.btn-press:active { transform: scale(0.97); }

/* Float animation */
@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}
.float-animation { animation: float 3s ease-in-out infinite; }

/* Fade in up */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}
.fade-in-up { animation: fadeInUp 0.6s ease-out forwards; }

/* Stagger children */
.stagger-children > * { opacity: 0; animation: fadeInUp 0.5s ease-out forwards; }
.stagger-children > *:nth-child(1) { animation-delay: 0.1s; }
.stagger-children > *:nth-child(2) { animation-delay: 0.2s; }
.stagger-children > *:nth-child(3) { animation-delay: 0.3s; }
.stagger-children > *:nth-child(4) { animation-delay: 0.4s; }
.stagger-children > *:nth-child(5) { animation-delay: 0.5s; }
.stagger-children > *:nth-child(6) { animation-delay: 0.6s; }

/* Mobile nav safe area */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .mobile-nav-safe {
        padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    }
}

/* Desktop scrollbar */
@media (min-width: 768px) {
    ::-webkit-scrollbar { width: 8px; }
    ::-webkit-scrollbar-track { background: #EEF2F6; }
    ::-webkit-scrollbar-thumb { background: #E5842B; border-radius: 4px; }
}

/* Section divider */
.section-divider {
    height: 4px;
    background: linear-gradient(90deg, transparent, #E5842B, transparent);
}

/* Mobile bottom nav spacer */
@media (max-width: 767px) {
    body { padding-bottom: 5rem; }
    footer { padding-bottom: 5rem; }
}

/* Prose/content styling for dynamic HTML content (light theme) */
.prose-content p { margin-bottom: 1rem; line-height: 1.8; color: var(--body); }
.prose-content h2 { font-size: 1.5rem; font-weight: 700; margin: 2rem 0 1rem; color: var(--ink); }
.prose-content h3 { font-size: 1.25rem; font-weight: 600; margin: 1.5rem 0 0.75rem; color: var(--ink); }
.prose-content ul { list-style: disc; margin-left: 1.5rem; margin-bottom: 1rem; color: var(--body); }
.prose-content ol { list-style: decimal; margin-left: 1.5rem; margin-bottom: 1rem; color: var(--body); }
.prose-content li { margin-bottom: 0.5rem; }
.prose-content a { color: var(--accent); text-decoration: underline; }
.prose-content strong { color: var(--ink); }
.prose-content img { max-width: 100%; height: auto; border-radius: 0.75rem; margin: 1rem 0; }
.prose-content blockquote {
    border-left: 4px solid var(--accent);
    padding-left: 1rem;
    margin: 1rem 0;
    font-style: italic;
    color: var(--muted);
}

/* Responsive YouTube / Video Embed */
.prose-content .video-embed {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    overflow: hidden;
    margin: 1.5rem 0;
    border-radius: 1rem;
    background: #0E2740;
}
.prose-content .video-embed iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    border: 0;
    border-radius: 1rem;
}

/* Photo Gallery Grid */
.prose-content .photo-gallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
    margin: 1.5rem 0;
}
.prose-content .photo-gallery img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    border-radius: 0.75rem;
    margin: 0;
    transition: transform 0.3s, opacity 0.3s;
    cursor: pointer;
}
.prose-content .photo-gallery img:hover {
    transform: scale(1.02);
    opacity: 0.9;
}
.prose-content .photo-gallery.cols-3 {
    grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 767px) {
    .prose-content .photo-gallery { grid-template-columns: 1fr; }
    .prose-content .photo-gallery img { height: 200px; }
    .prose-content .photo-gallery.cols-3 { grid-template-columns: repeat(2, 1fr); }
}

/* News / Reference Card (light) */
.prose-content .news-reference {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem;
    background: #FFFFFF;
    border: 1px solid var(--line);
    border-radius: 1rem;
    margin: 1.5rem 0;
    text-decoration: none;
    box-shadow: var(--card-sh);
}
.prose-content .news-reference:hover {
    border-color: var(--accent);
    background: #FFFFFF;
}
.prose-content .news-reference .news-icon {
    flex-shrink: 0;
    width: 40px; height: 40px;
    background: rgba(229, 132, 43, 0.12);
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent);
}

/* Calendar styles (light) */
.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.calendar-day { min-height: 80px; padding: 0.5rem; background: #EEF2F6; border-radius: 0.5rem; }
.calendar-day:hover { background: #E2E8EF; }
.calendar-day.today { border: 2px solid #E5842B; }
.calendar-day.has-event::after {
    content: '';
    display: block;
    width: 6px; height: 6px;
    background: #E5842B;
    border-radius: 50%;
    margin: 4px auto 0;
}

@media (max-width: 767px) {
    .calendar-day { min-height: 50px; padding: 0.25rem; font-size: 0.75rem; }
}

/* ============================================================
   Supplemental utilities — classes the prebuilt tailwind.css
   does not include (the original build was dark-only). Loaded
   after tailwind.css so these fill the gaps for the light theme.
   ============================================================ */
.bg-navy-50{background-color:rgb(238,242,246)}
.bg-navy-100{background-color:rgb(226,232,239)}
.bg-navy-200{background-color:rgb(199,210,222)}
.bg-navy-400{background-color:rgb(91,110,128)}
.hover\:bg-navy-50:hover{background-color:rgb(238,242,246)}
.hover\:bg-navy-100:hover{background-color:rgb(226,232,239)}
.hover\:bg-navy-200:hover{background-color:rgb(199,210,222)}
.hover\:bg-navy-700:hover{background-color:rgb(19,49,79)}
.border-navy-100{border-color:rgb(226,232,239)}
.border-navy-200{border-color:rgb(199,210,222)}
.border-navy-300{border-color:rgb(122,138,153)}
.placeholder-navy-300::placeholder{color:rgb(122,138,153)}
.bg-white\/10{background-color:rgba(255,255,255,.10)}
.bg-white\/15{background-color:rgba(255,255,255,.15)}
.bg-white\/20{background-color:rgba(255,255,255,.20)}
.bg-white\/90{background-color:rgba(255,255,255,.90)}
.bg-white\/95{background-color:rgba(255,255,255,.95)}
.hover\:bg-white\/15:hover{background-color:rgba(255,255,255,.15)}
.hover\:bg-white\/20:hover{background-color:rgba(255,255,255,.20)}
.text-white\/40{color:rgba(255,255,255,.40)}
.text-white\/45{color:rgba(255,255,255,.45)}
.text-white\/55{color:rgba(255,255,255,.55)}
.text-white\/60{color:rgba(255,255,255,.60)}
.text-white\/70{color:rgba(255,255,255,.70)}
.text-white\/90{color:rgba(255,255,255,.90)}
.border-white\/10{border-color:rgba(255,255,255,.10)}
.border-white\/30{border-color:rgba(255,255,255,.30)}
.bg-gold-400\/3{background-color:rgba(229,132,43,.03)}
.bg-gold-400\/5{background-color:rgba(229,132,43,.05)}
.text-gold-400\/50{color:rgba(229,132,43,.50)}
.text-gold-400\/60{color:rgba(229,132,43,.60)}
.text-gold-400\/70{color:rgba(229,132,43,.70)}
.border-gold-400\/30{border-color:rgba(229,132,43,.30)}
.border-gold-400\/40{border-color:rgba(229,132,43,.40)}
.border-gold-500\/40{border-color:rgba(204,111,28,.4)}
.hover\:bg-gold-400\/20:hover{background-color:rgba(229,132,43,.2)}
.hover\:text-gold-500:hover{color:rgb(204,111,28)}
.hover\:text-gold-600:hover{color:rgb(180,94,19)}
.hover\:border-gold-400:hover{border-color:rgb(229,132,43)}
.focus\:border-gold-400:focus{border-color:rgb(229,132,43)}
.group:hover .group-hover\:text-gold-500{color:rgb(204,111,28)}
.group:hover .group-hover\:text-navy-300{color:rgb(122,138,153)}
.group:hover .group-hover\:border-gold-400{border-color:rgb(229,132,43)}
.group:hover .group-hover\:bg-gold-400\/15{background-color:rgba(229,132,43,.15)}
.group:hover .group-hover\:bg-gold-500\/15{background-color:rgba(204,111,28,.15)}
.group:hover .group-hover\:bg-gold-500\/25{background-color:rgba(204,111,28,.25)}
.group:hover .group-hover\:bg-navy-950\/30{background-color:rgba(10,30,51,.3)}
.group:hover .group-hover\:opacity-100{opacity:1}
.bg-navy-950\/0{background-color:rgba(10,30,51,0)}
.bg-navy-950\/30{background-color:rgba(10,30,51,.3)}
.bg-navy-950\/95{background-color:rgba(10,30,51,.95)}
.bg-navy-800\/80{background-color:rgba(16,43,71,.8)}
.ring-1{box-shadow:0 0 0 1px var(--tw-ring-color,rgba(19,49,79,.08))}
.ring-navy-100{--tw-ring-color:rgb(226,232,239)}
.ring-white{--tw-ring-color:#fff}
.focus\:ring-gold-400:focus{--tw-ring-color:rgb(229,132,43);box-shadow:0 0 0 3px rgba(229,132,43,.35)}
.group:hover .group-hover\:ring-gold-400\/50{--tw-ring-color:rgba(229,132,43,.5)}
.shadow-sm{box-shadow:0 1px 2px 0 rgba(19,49,79,.06)}
.shadow-navy-900\/10{box-shadow:0 12px 28px -8px rgba(14,39,64,.18)}
.shadow-gold-500\/10{box-shadow:0 8px 24px -6px rgba(204,111,28,.18)}
.from-navy-900\/80{--tw-gradient-from:rgba(14,39,64,.8) var(--tw-gradient-from-position);--tw-gradient-to:rgba(14,39,64,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.from-navy-900\/90{--tw-gradient-from:rgba(14,39,64,.9) var(--tw-gradient-from-position);--tw-gradient-to:rgba(14,39,64,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.via-navy-900\/20{--tw-gradient-to:rgba(14,39,64,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(14,39,64,.2) var(--tw-gradient-via-position),var(--tw-gradient-to)}
.via-navy-900\/40{--tw-gradient-to:rgba(14,39,64,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(14,39,64,.4) var(--tw-gradient-via-position),var(--tw-gradient-to)}
.via-gold-500\/40{--tw-gradient-to:rgba(204,111,28,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(204,111,28,.4) var(--tw-gradient-via-position),var(--tw-gradient-to)}
.to-navy-900{--tw-gradient-to:rgb(14,39,64) var(--tw-gradient-to-position)}
.to-white{--tw-gradient-to:#fff var(--tw-gradient-to-position)}
.to-gold-600\/5{--tw-gradient-to:rgba(180,94,19,.05) var(--tw-gradient-to-position)}
.via-transparent{--tw-gradient-to:rgba(0,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),transparent var(--tw-gradient-via-position),var(--tw-gradient-to)}
.text-7xl{font-size:4.5rem;line-height:1}
.text-\[9px\]{font-size:9px}
.text-\[10px\]{font-size:10px}
.text-\[11px\]{font-size:11px}
.border-4{border-width:4px}
.border-y{border-top-width:1px;border-bottom-width:1px}
.ring-4{box-shadow:0 0 0 4px var(--tw-ring-color,rgba(19,49,79,.08))}
.top-3{top:.75rem}
.top-4{top:1rem}
.top-1\/2{top:50%}

/* Remaining gap-fills: primary-button hover, footer hovers, kept-semantic red */
.hover\:bg-gold-500:hover { background-color: rgb(204, 111, 28); }
.hover\:border-gold-400\/40:hover { border-color: rgba(229, 132, 43, 0.4); }
.border-red-500\/20 { border-color: rgba(239, 68, 68, 0.2); }
.text-red-400\/60 { color: rgba(248, 113, 113, 0.6); }

/* ============================================================
   Accessibility & contrast fixes (from 2026-06-24 audit)
   ============================================================ */
/* Visible keyboard focus on all interactive elements (WCAG 2.4.7) */
a:focus-visible, button:focus-visible, [tabindex]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
    border-radius: 3px;
}
/* Accessible accent: the bright orange fails AA as small text / button fill on
   white (2.7–3.6:1). Darken the TEXT and solid-button uses to pass ~4.5:1+,
   while keeping recognizably-orange. Icons/gradients/tints are unaffected. */
.text-gold-500 { color: #A85510; }   /* ~5.2:1 on white */
.text-gold-400 { color: #C2671A; }   /* darker orange for text/icons */
.bg-gold-400   { background-color: #CC6F1C; }   /* button fill: white text ~4.2:1 (large/bold) */
.hover\:bg-gold-500:hover { background-color: #A85510; }
/* Featured badge must sit above the card's z-10 content layer */
.z-20 { z-index: 20; }
/* Section padding steps used by the responsive pass but absent from the dark build */
.py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }

/* Supplemental spacing utilities missing from the prebuilt tailwind.css */
.mx-3{margin-left:0.75rem;margin-right:0.75rem}
.p-10{padding:2.5rem}
.pb-3{padding-bottom:0.75rem}
.pl-3{padding-left:0.75rem}
.pl-4{padding-left:1rem}
.pt-2{padding-top:0.5rem}
.py-10{padding-top:2.5rem;padding-bottom:2.5rem}
.py-14{padding-top:3.5rem;padding-bottom:3.5rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-8{padding-top:2rem;padding-bottom:2rem}
.space-x-1 > :not([hidden]) ~ :not([hidden]){margin-left:0.25rem}
.space-x-3 > :not([hidden]) ~ :not([hidden]){margin-left:0.75rem}
.space-y-0\.5 > :not([hidden]) ~ :not([hidden]){margin-top:0.125rem}
.space-y-1 > :not([hidden]) ~ :not([hidden]){margin-top:0.25rem}
.space-y-2 > :not([hidden]) ~ :not([hidden]){margin-top:0.5rem}
.space-y-2\.5 > :not([hidden]) ~ :not([hidden]){margin-top:0.625rem}
.space-y-3 > :not([hidden]) ~ :not([hidden]){margin-top:0.75rem}
.space-y-4 > :not([hidden]) ~ :not([hidden]){margin-top:1rem}
.space-y-5 > :not([hidden]) ~ :not([hidden]){margin-top:1.25rem}
.space-y-6 > :not([hidden]) ~ :not([hidden]){margin-top:1.5rem}
.space-y-8 > :not([hidden]) ~ :not([hidden]){margin-top:2rem}

/* Supplemental layout/effect utilities missing from the prebuilt tailwind.css */
.-right-6{right:-1.5rem}
.-top-3{top:-0.75rem}
.-top-6{top:-1.5rem}
.-translate-y-1\/2{transform:translateY(-50%)}
.backdrop-blur-xl{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
.blur-2xl{filter:blur(40px)}
.break-all{word-break:break-all}
.col-span-2{grid-column:span 2/span 2}
.h-px{height:1px}
.left-3{left:0.75rem}
.left-8{left:2rem}
.max-w-6xl{max-width:72rem}
.max-w-full{max-width:100%}
.opacity-10{opacity:0.1}
.opacity-90{opacity:0.9}
.right-3{right:0.75rem}
.right-4{right:1rem}
.self-start{align-self:flex-start}
.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.underline{text-decoration-line:underline}
.w-1\/2{width:50%}
.last\:border-0:last-child{border-width:0}
.focus\:not-sr-only:focus{position:static;width:auto;height:auto;padding:0;margin:0;overflow:visible;clip:auto;white-space:normal}
.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}
.focus\:absolute:focus{position:absolute}
.focus\:top-4:focus{top:1rem}
.focus\:left-4:focus{left:1rem}
.focus\:ring-2:focus{box-shadow:0 0 0 2px var(--tw-ring-color,#0067B1)}
.hover\:brightness-125:hover{filter:brightness(1.25)}
.hover\:shadow-xl:hover{box-shadow:0 20px 25px -5px rgba(19,49,79,.12)}
@media (min-width:768px){.md\:-translate-x-1\/2{transform:translateX(-50%)}.md\:-translate-x-px{transform:translateX(-1px)}.md\:bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.md\:col-span-1{grid-column:span 1/span 1}.md\:from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:rgba(0,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.md\:gap-2{gap:0.5rem}.md\:gap-4{gap:1rem}.md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.md\:inline{display:inline}.md\:left-1\/2{left:50%}.md\:left-6{left:1.5rem}.md\:py-28{padding-top:7rem;padding-bottom:7rem}.md\:right-6{right:1.5rem}.md\:text-8xl{font-size:6rem}.md\:to-navy-900\/40{--tw-gradient-to:rgba(14,39,64,.4) var(--tw-gradient-to-position)}.md\:via-transparent{--tw-gradient-to:rgba(0,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),transparent var(--tw-gradient-via-position),var(--tw-gradient-to)}.md\:w-1\/2{width:50%}}
@media (min-width:1024px){.lg\:col-span-3{grid-column:span 3/span 3}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}

@media (min-width:768px){.md\:space-y-12 > :not([hidden]) ~ :not([hidden]){margin-top:3rem}}