.site-header{
  --nav-gold:#ffc145;
  --nav-orange:#f3913a;
  --nav-coral:#ff3838;
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(28,26,66,.96);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.site-header *{box-sizing:border-box}
.site-header .nav{
  width:min(calc(100% - 48px),1180px);
  height:72px;
  margin-inline:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.site-header .brand{
  display:flex;
  align-items:center;
  color:#fff;
  font-family:GmarketSans,Pretendard,system-ui,sans-serif;
  font-size:23px;
  font-weight:700;
  letter-spacing:.07em;
}
.site-header .brand:hover{color:#fff}
.site-header .brand b{
  background:linear-gradient(90deg,var(--nav-gold),var(--nav-coral));
  background-clip:text;
  -webkit-background-clip:text;
  color:transparent;
  font-weight:700;
}
.site-header .nav-links{
  display:flex;
  align-items:center;
  gap:6px;
  color:rgba(255,255,255,.84);
  font-size:14px;
  font-weight:700;
}
.site-header .nav-links>a{
  padding:10px 11px;
  border-radius:10px;
  color:rgba(255,255,255,.84);
  transition:.2s;
}
.site-header .nav-links>a:hover,
.site-header .nav-links>a.active{color:var(--nav-gold)}
.site-header .nav-group{position:relative}
.site-header .nav-group>summary{
  display:flex;
  align-items:center;
  gap:5px;
  padding:10px 11px;
  border-radius:10px;
  list-style:none;
  cursor:pointer;
  white-space:nowrap;
  transition:.2s;
}
.site-header .nav-group>summary::-webkit-details-marker{display:none}
.site-header .nav-group>summary:after{
  content:"";
  width:5px;
  height:5px;
  border-right:1.8px solid currentColor;
  border-bottom:1.8px solid currentColor;
  opacity:.7;
  transform:rotate(45deg) translateY(-1px);
  transition:.2s;
}
.site-header .nav-group>summary:hover,
.site-header .nav-group[open]>summary{
  color:var(--nav-gold);
  background:rgba(255,255,255,.07);
}
.site-header .nav-group[open]>summary:after{transform:rotate(225deg) translateY(-2px)}
.site-header .nav-dropdown{
  position:absolute;
  left:0;
  top:calc(100% + 10px);
  z-index:20;
  display:flex;
  flex-direction:column;
  min-width:226px;
  padding:9px;
  border:1px solid #ecedf5;
  border-radius:16px;
  background:#fff;
  box-shadow:0 22px 50px rgba(17,14,48,.22);
}
.site-header .nav-dropdown:before{
  content:"";
  position:absolute;
  left:22px;
  top:-6px;
  width:12px;
  height:12px;
  border-top:1px solid #ecedf5;
  border-left:1px solid #ecedf5;
  background:#fff;
  transform:rotate(45deg);
}
.site-header .nav-dropdown a{
  padding:11px 13px;
  border-radius:10px;
  color:#2b2757;
  font-size:14px;
  font-weight:700;
  white-space:nowrap;
  transition:.15s;
}
.site-header .nav-dropdown a:hover{color:#d33a2c;background:#fff3ea}
.site-header .nav-cta{
  padding:12px 20px!important;
  border-radius:999px!important;
  color:#fff!important;
  font-weight:900;
  white-space:nowrap;
  background:linear-gradient(90deg,var(--nav-orange),var(--nav-coral));
  box-shadow:0 8px 22px rgba(255,56,56,.32);
}
.site-header .menu-btn{
  display:none;
  padding:8px;
  border:0;
  color:#fff;
  background:transparent;
  cursor:pointer;
}
@media (max-width:1080px){
  .site-header .nav-links{
    position:fixed;
    left:20px;
    right:20px;
    top:80px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    padding:14px;
    border-radius:18px;
    background:#242052;
    box-shadow:0 22px 55px rgba(17,14,48,.3);
  }
  .site-header .nav-links.open,
  .primary-nav-open .site-header .nav-links{display:flex}
  .site-header .nav-links>a{padding:13px 14px}
  .site-header .nav-group>summary{padding:13px 14px}
  .site-header .nav-dropdown{
    position:static;
    min-width:0;
    margin:2px 0 6px;
    padding:6px;
    border-color:rgba(255,255,255,.1);
    background:rgba(255,255,255,.06);
    box-shadow:none;
  }
  .site-header .nav-dropdown:before{display:none}
  .site-header .nav-dropdown a{color:rgba(255,255,255,.82)}
  .site-header .nav-dropdown a:hover{color:var(--nav-gold);background:rgba(255,255,255,.1)}
  .site-header .nav-cta{display:block;margin-top:8px;text-align:center}
  .site-header .menu-btn{display:block}
}
@media (max-width:640px){
  .site-header .nav{width:min(calc(100% - 28px),1180px)}
}