/* Mu Sagitario • Gran inauguración — midnight blue and gold */
:root {
  --musa-gold: #e6c36b;
  --musa-gold-bright: #ffe29a;
  --musa-navy: #07152d;
  --musa-night: #030916;
}

.musa-opening-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  place-items: center;
  padding: clamp(14px, 3vw, 38px);
  overflow-y: auto;
  background: radial-gradient(ellipse at center, rgba(16, 37, 74, .82), rgba(2, 7, 17, .96) 72%);
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
}
.musa-opening-overlay[hidden] { display: none !important; }
body.musa-opening-open { overflow: hidden; }
.musa-opening-card {
  position: relative;
  width: min(860px, 100%);
  padding: clamp(30px, 6vw, 62px) clamp(18px, 5vw, 58px) clamp(24px, 4vw, 42px);
  overflow: hidden;
  text-align: center;
  color: #f8f4e8;
  border: 1px solid rgba(230, 195, 107, .86);
  border-radius: 24px;
  background:
    radial-gradient(ellipse at 50% -15%, rgba(35, 67, 119, .62), transparent 58%),
    linear-gradient(155deg, #0d2143 0%, #09172f 48%, #050d1d 100%);
  box-shadow: 0 28px 100px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,239,192,.18), inset 0 0 34px rgba(224,184,86,.055);
  animation: musa-opening-arrive .52s cubic-bezier(.2,.75,.25,1) both;
}
.musa-opening-card::before,
.musa-opening-card::after {
  position: absolute;
  left: 7%; right: 7%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(230,195,107,.64), transparent);
}
.musa-opening-card::before { top: 15px; }
.musa-opening-card::after { bottom: 15px; }
@keyframes musa-opening-arrive {
  from { opacity: 0; transform: translateY(14px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.musa-opening-x {
  position: absolute;
  top: 14px; right: 17px;
  width: 38px; height: 38px;
  border: 1px solid rgba(230,195,107,.4);
  border-radius: 50%;
  color: #f2d98d;
  background: rgba(3,9,21,.54);
  font: 300 26px/1 Arial, sans-serif;
  cursor: pointer;
  transition: background .18s ease, transform .18s ease;
}
.musa-opening-x:hover { background: rgba(230,195,107,.14); transform: rotate(90deg); }
.musa-opening-kicker {
  margin-bottom: 22px;
  color: #c8d4e7;
  font: 700 11px/1.4 Inter, Arial, sans-serif;
  letter-spacing: .26em;
  text-transform: uppercase;
}
.musa-opening-kicker span { padding: 0 7px; color: var(--musa-gold); }
.musa-opening-rule { display: flex; align-items: center; justify-content: center; gap: 16px; }
.musa-opening-rule span { width: min(11vw, 82px); height: 1px; background: linear-gradient(90deg, transparent, #cba74e); }
.musa-opening-rule span:last-child { transform: rotate(180deg); }
.musa-opening-rule h1 {
  margin: 0;
  color: var(--musa-gold-bright);
  font: 500 clamp(25px, 5vw, 48px)/1.08 Cinzel, Georgia, serif;
  letter-spacing: .08em;
  text-shadow: 0 0 24px rgba(232,192,91,.24);
}
.musa-opening-date {
  margin: 16px 0 0;
  color: #f6f3e9;
  font: 800 clamp(11px, 1.7vw, 15px)/1.5 Inter, Arial, sans-serif;
  letter-spacing: .13em;
}
.musa-opening-date i { padding: 0 8px; color: var(--musa-gold); font-size: .8em; font-style: normal; }
.musa-opening-zone {
  margin: 8px 0 26px;
  color: #98a9c6;
  font: 700 10px/1.4 Inter, Arial, sans-serif;
  letter-spacing: .24em;
}
.musa-countdown-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(7px, 1.7vw, 17px); }
.musa-countdown-cell {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 112px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid rgba(218,185,99,.38);
  border-radius: 13px;
  background: linear-gradient(155deg, rgba(17,39,77,.94), rgba(3,12,29,.98));
  box-shadow: inset 0 1px 0 rgba(255,239,190,.08), 0 8px 22px rgba(0,0,0,.22);
}
.musa-countdown-cell::before {
  position: absolute;
  top: -5px; left: calc(50% - 4px);
  width: 8px; height: 8px;
  content: "";
  background: var(--musa-gold-bright);
  box-shadow: 0 0 12px rgba(255,220,120,.85);
  transform: rotate(45deg);
}
.musa-countdown-value {
  color: var(--musa-gold-bright);
  font: 500 clamp(30px, 6vw, 54px)/.95 Cinzel, Georgia, serif;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 14px rgba(232,192,91,.22);
}
.musa-countdown-unit {
  color: #c3d0e3;
  font: 800 9px/1 Inter, Arial, sans-serif;
  letter-spacing: .19em;
}
.musa-countdown-complete {
  margin: 8px 0 0;
  color: var(--musa-gold-bright);
  font: 600 clamp(18px, 3vw, 28px)/1.3 Cinzel, Georgia, serif;
  letter-spacing: .08em;
}
.musa-opening-enter {
  min-width: 220px;
  margin-top: 28px;
  padding: 13px 28px;
  border: 1px solid rgba(255,225,151,.82);
  border-radius: 7px;
  color: #1a1407;
  background: linear-gradient(180deg, #ffe6a0, #c9a34c);
  box-shadow: 0 8px 24px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.5);
  font: 800 11px/1.2 Inter, Arial, sans-serif;
  letter-spacing: .17em;
  cursor: pointer;
}
.musa-opening-enter:hover { filter: brightness(1.08); }

/* Persistent countdown below the navigation, centered over the home hero. */
.exmu-login-band { position: relative; }
.musa-launch-inline {
  position: absolute;
  z-index: 6;
  top: 30px;
  left: 50%;
  width: min(570px, calc(100% - 32px));
  padding: 15px 20px 17px;
  border: 1px solid rgba(218,185,99,.7);
  border-radius: 15px;
  color: #f7f1df;
  background: linear-gradient(145deg, rgba(12,31,62,.96), rgba(4,12,27,.97));
  box-shadow: 0 16px 42px rgba(0,0,0,.43), inset 0 1px 0 rgba(255,239,190,.1);
  text-align: center;
  transform: translateX(-50%);
}
.musa-launch-inline-title {
  color: var(--musa-gold-bright);
  font: 600 17px/1.2 Cinzel, Georgia, serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.musa-launch-inline-date {
  margin: 6px 0 12px;
  color: #b6c5da;
  font: 700 9px/1.4 Inter, Arial, sans-serif;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.musa-countdown--inline .musa-countdown-grid { gap: 8px; }
.musa-countdown--inline .musa-countdown-cell { min-height: 68px; gap: 5px; border-radius: 9px; }
.musa-countdown--inline .musa-countdown-value { font-size: clamp(22px, 3vw, 31px); }
.musa-countdown--inline .musa-countdown-unit { font-size: 8px; }
.musa-countdown--inline .musa-countdown-cell::before { width: 6px; height: 6px; top: -4px; left: calc(50% - 3px); }
.musa-countdown--inline .musa-countdown-complete { margin: 8px 0 1px; font-size: 19px; }

@media (max-width: 640px) {
  .musa-opening-card { padding: 42px 16px 28px; border-radius: 17px; }
  .musa-opening-kicker { margin-bottom: 18px; font-size: 9px; letter-spacing: .2em; }
  .musa-opening-rule { gap: 8px; }
  .musa-opening-rule span { width: 22px; }
  .musa-opening-rule h1 { font-size: clamp(21px, 7vw, 32px); letter-spacing: .035em; }
  .musa-opening-date { letter-spacing: .065em; }
  .musa-opening-date i { padding: 0 3px; }
  .musa-opening-zone { margin-bottom: 22px; }
  .musa-countdown-cell { min-height: 82px; gap: 8px; border-radius: 9px; }
  .musa-countdown-unit { font-size: 7px; letter-spacing: .11em; }
  .musa-opening-enter { width: 100%; min-width: 0; margin-top: 22px; }
  .musa-launch-inline { top: 18px; padding: 12px 12px 13px; }
  .musa-launch-inline-title { font-size: 14px; }
  .musa-launch-inline-date { font-size: 8px; letter-spacing: .07em; }
  .musa-countdown--inline .musa-countdown-cell { min-height: 57px; }
}
@media (prefers-reduced-motion: reduce) {
  .musa-opening-card { animation: none; }
  .musa-opening-x { transition: none; }
}

/* Compact timer beside the brand on wide screens. */
.musa-launch-header {
  display: flex;
  flex: 0 1 255px;
  min-width: 215px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  margin: 0 auto;
  padding: 5px 10px;
  border-left: 1px solid rgba(230,195,107,.42);
  border-right: 1px solid rgba(230,195,107,.42);
  color: #f6efdc;
  text-align: center;
}
.musa-launch-header-title {
  color: var(--musa-gold-bright);
  font: 700 9px/1.1 Cinzel, Georgia, serif;
  letter-spacing: .16em;
}
.musa-launch-header-date {
  color: #aebed3;
  font: 700 7px/1.2 Inter, Arial, sans-serif;
  letter-spacing: .08em;
}
.musa-countdown--header { width: 100%; }
.musa-countdown--header .musa-countdown-grid { gap: 4px; }
.musa-countdown--header .musa-countdown-cell {
  min-height: 30px;
  gap: 1px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  box-shadow: none;
}
.musa-countdown--header .musa-countdown-cell::before { display: none; }
.musa-countdown--header .musa-countdown-value { font-size: 15px; }
.musa-countdown--header .musa-countdown-unit { font-size: 6px; letter-spacing: .1em; }
.musa-countdown--header .musa-countdown-complete { margin: 3px 0 0; font-size: 10px; letter-spacing: .03em; }
/* Original Musagitario opening announcement: ember, charcoal and gold. */
.musa-opening-overlay {
  background: radial-gradient(ellipse at 50% 42%, rgba(122,48,20,.34), rgba(8,8,11,.94) 72%), rgba(5,6,9,.84);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}
.musa-opening-card {
  display: grid;
  grid-template-columns: 205px minmax(0,1fr);
  width: min(900px,100%);
  min-height: 430px;
  padding: 0;
  border: 1px solid rgba(233,184,82,.76);
  border-radius: 8px 32px 8px 32px;
  background: linear-gradient(130deg,#191313 0%,#0e1015 56%,#090b10 100%);
  box-shadow: 0 30px 110px rgba(0,0,0,.8), inset 0 0 50px rgba(191,86,27,.08);
  animation: musa-opening-arrive .55s cubic-bezier(.2,.75,.25,1) both;
}
.musa-opening-card::before { inset: 12px; left: 12px; right: 12px; top: 12px; bottom: 12px; height: auto; border: 1px solid rgba(233,184,82,.16); background: none; pointer-events: none; }
.musa-opening-card::after { display: none; }
.musa-opening-mark {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  margin: 14px 0 14px 14px; padding: 22px 12px;
  border-radius: 4px 0 0 24px; color:#f1d18a;
  background: radial-gradient(ellipse at 50% 45%,rgba(178,74,28,.3),transparent 68%),linear-gradient(160deg,#29201b,#111115 70%);
  border-right:1px solid rgba(233,184,82,.34);
}
.musa-opening-mark-overline { font:700 12px/1 Cinzel,Georgia,serif; letter-spacing:.38em; margin-left:.38em; }
.musa-opening-mark strong { margin-top:12px; font:500 clamp(70px,10vw,112px)/.95 Cinzel,Georgia,serif; color:#f4d38b; text-shadow:0 4px 0 #70441f,0 0 30px rgba(255,168,51,.28); }
.musa-opening-mark-month { margin-top:8px; font:700 18px/1 Inter,Arial,sans-serif; letter-spacing:.42em; margin-left:.42em; }
.musa-opening-mark-line { width:46px; height:1px; margin:22px 0 14px; background:linear-gradient(90deg,transparent,#e9b852,transparent); }
.musa-opening-mark-year { color:#c8c1b1; font:700 10px/1 Inter,Arial,sans-serif; letter-spacing:.35em; }
.musa-opening-main { align-self:center; padding:52px clamp(22px,5vw,56px) 44px; text-align:left; }
.musa-opening-kicker { margin:0 0 12px; color:#d99b59; font-size:10px; letter-spacing:.34em; }
.musa-opening-main h1 { margin:0; color:#fff3d6; font:500 clamp(31px,5vw,49px)/1.02 Cinzel,Georgia,serif; letter-spacing:.035em; text-shadow:0 4px 22px rgba(235,155,58,.12); }
.musa-opening-date { margin:17px 0 0; font-size:11px; letter-spacing:.09em; }
.musa-opening-date span { color:#e3ad55; padding:0 5px; }
.musa-opening-zone { margin:6px 0 19px; color:#bc9b72; font-size:9px; letter-spacing:.22em; }
.musa-opening-main .musa-countdown-cell { min-height:82px; border-color:rgba(217,155,89,.36); border-radius:4px 12px 4px 12px; background:linear-gradient(150deg,rgba(75,42,28,.65),rgba(14,15,19,.98)); }
.musa-opening-main .musa-countdown-cell::before { background:#f2c56d; box-shadow:0 0 14px rgba(248,170,63,.72); }
.musa-opening-main .musa-countdown-value { color:#f6d58e; }
.musa-opening-main .musa-countdown-unit { color:#d0b99a; font-size:8px; }
.musa-opening-enter { min-width:0; margin-top:21px; padding:13px 18px; border:1px solid rgba(238,190,99,.7); border-radius:3px 14px 3px 14px; color:#22150b; background:linear-gradient(110deg,#f5d88e,#ca8a3f); font-size:10px; }
.musa-opening-enter span { padding-left:13px; font-size:18px; line-height:0; vertical-align:-1px; }
.musa-opening-x { z-index:2; top:22px; right:24px; border-color:rgba(240,206,137,.38); color:#f1d18a; }
.musa-launch-inline {
  top: 50%; left: 50%; width: min(560px, calc(100% - 32px));
  padding: 23px 26px 25px; border-radius: 5px 22px 5px 22px;
  border-color: rgba(226,184,99,.8);
  background: linear-gradient(135deg,rgba(24,18,17,.94),rgba(10,12,17,.94));
  box-shadow: 0 18px 55px rgba(0,0,0,.62), inset 0 0 35px rgba(178,74,28,.12);
  transform: translate(-50%,-50%);
}
.musa-launch-inline-title { color:#f1d18a; }
.musa-launch-inline-date { color:#ddc7a4; }
.musa-countdown--inline .musa-countdown-cell { border-color:rgba(217,155,89,.38); background:linear-gradient(150deg,rgba(75,42,28,.62),rgba(14,15,19,.96)); }
.musa-countdown--inline .musa-countdown-value { color:#f6d58e; }
.musa-countdown--inline .musa-countdown-unit { color:#d0b99a; }
@media (max-width: 700px) {
  .musa-opening-card { grid-template-columns: 1fr; width:min(480px,100%); min-height:0; border-radius:8px 26px 8px 26px; }
  .musa-opening-mark { display:none; }
  .musa-opening-main { padding:48px 20px 26px; text-align:center; }
  .musa-opening-main h1 { font-size:clamp(28px,8vw,39px); }
  .musa-opening-date { font-size:9px; line-height:1.7; }
  .musa-opening-main .musa-countdown-cell { min-height:68px; }
  .musa-opening-main .musa-countdown-unit { font-size:6px; letter-spacing:.08em; }
  .musa-launch-inline { padding:15px 13px 16px; }
}