body { font-family: 'Pretendard'; } 
/* Header state-dependent styles */
#header {
    transition: background-color 0.4s, box-shadow 0.4s;
}
#header.scrolled {
    background-color: white;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
#header .logo, #header nav .desktop-menu-toggle {
    transition: color 0.4s;
}

/* --- Global default colors --- */
#header .logo          { color: #862633; }   /* KU crimson */
#header nav .desktop-menu-toggle { color: #333; } /* menu dark‑gray */
#header nav .desktop-menu-toggle:hover { color: #862633; }
#header nav a:hover { color: #862633; }

/* --- Home (index) initial state --- */
#header.home-header .logo,
#header.home-header nav .desktop-menu-toggle,
#header.home-header .mobile-menu-button { color: #ffffff; }

/* --- Mobile button base color --- */
#header .mobile-menu-button { color: #333; }

#header.scrolled .logo, #header.scrolled .mobile-menu-button {
    color: #862633;
}
#header.scrolled nav .desktop-menu-toggle, #header.scrolled nav a {
    color: #333;
}
#header.scrolled nav .desktop-menu-toggle:hover, #header.scrolled nav a:hover {
    color: #862633;
}

/* Dropdown menu specific styles */
#header nav .dropdown-menu a {
        color: #333 !important;
}
#header nav .dropdown-menu a:hover {
        background-color: #f5f5f5;
        color: #862633 !important;
}

/* Mobile menu style */
#mobile-menu {
    transition: transform 0.3s ease-in-out;
}
#header.scrolled .mobile-menu-button {
    color: #333;
}

.desktop-menu-toggle i {
    transition: transform 0.3s ease-in-out;
}
li.is-active .desktop-menu-toggle i {
    transform: rotate(180deg);
}
.subhead-wrapper {
    font-size: 1.875rem;   /* text-3xl (30px) */
    line-height: 2.25rem;  /* text-3xl 기본 line-height */
    font-weight: 700;      /* font-bold */
    text-align: center;    /* text-center */
    color: #1f2937;        /* text-gray-900 */
    margin-bottom: 2rem;   /* mb-8 (32px) */
}
.subhead {
    border-style: solid;             /* 꼭 추가! */
    border-left-width: 4px;         /* border-l-4 */
    border-right-width: 4px;        /* border-r-4 */
    border-radius: 0.375rem;        /* rounded-md */
    border-color: #862633;        /* border-ku-crimson */
    padding-left: 1rem;             /* px-4 (left/right padding 1rem) */
    padding-right: 1rem;
}
.custom-loader {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: 
        radial-gradient(farthest-side,#862633 94%,#0000) top/8px 8px no-repeat,
        conic-gradient(#0000 30%,#862633);
    -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0);
    animation:s3 1s infinite linear;
}

@keyframes s3{ 
    100%{transform: rotate(1turn)}
}