/* ASA_DEPLOY_MARKER_PORTAL_V2_1_5_D_STUDENT360_02_LAYOUT_BALANCE_HOTFIX */
/*
 * ASA Portal v2.1.5.D-STUDENT360-02
 * Smart Next Action Layout & Balance Hotfix
 * Scope: #progress / Student 360 only.
 * Important: this intentionally replaces the v215d-student36001 stylesheet so
 * no landing.php change is required and other landing-page sections stay intact.
 */

.asa-student360-v215d01{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#f8fbff 0%,#fff 58%,#f4f7fc 100%);
}
.asa-student360-v215d01:before{
  content:"";
  position:absolute;
  left:-120px;
  bottom:-180px;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(29,78,137,.08),transparent 68%);
  pointer-events:none;
}

/* Desktop balance: copy is flexible; action panel has a sane maximum width. */
.asa-student360-grid-v215d01{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(500px,.92fr);
  gap:clamp(34px,3.5vw,58px);
  align-items:stretch;
}
.asa-student360-labels-v215d01{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:22px;
}
.asa-student360-copy-v215d01{min-width:0}
.asa-student360-copy-v215d01 h2{
  max-width:760px;
  margin:0 0 22px;
  font-size:clamp(2.35rem,4vw,4.35rem);
  line-height:1.035;
  letter-spacing:-.045em;
  color:#0f172a;
}
.asa-student360-copy-v215d01 h2 span{
  background:linear-gradient(90deg,#1d4ed8,#2563eb,#06b6d4);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.asa-student360-lead-v215d01{
  max-width:760px;
  margin:0;
  color:#64748b;
  font-size:1.06rem;
  line-height:1.78;
}

/* Keep the three metrics dominant and illustration supportive, not oversized. */
.asa-student360-body-v215d01{
  display:grid;
  grid-template-columns:minmax(330px,1.2fr) minmax(210px,.62fr);
  gap:20px;
  align-items:end;
  margin-top:32px;
}
.asa-progress-list-v215d01{display:grid;gap:13px;min-width:0}
.asa-progress-metric-v215d01{
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  gap:14px;
  align-items:center;
  padding:14px 17px;
  border:1px solid #e3ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.9);
  box-shadow:0 12px 30px rgba(15,23,42,.055);
  backdrop-filter:blur(8px);
}
.asa-progress-icon-v215d01{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:15px;
  background:linear-gradient(145deg,#eff6ff,#e0f2fe);
  color:#1d4ed8;
  font-weight:800;
  font-size:1.18rem;
}
.asa-progress-metric-v215d01>div{min-width:0}
.asa-progress-metric-v215d01 header{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-bottom:8px;
}
.asa-progress-metric-v215d01 header span{
  min-width:0;
  font-weight:750;
  color:#10213f;
  line-height:1.3;
}
.asa-progress-metric-v215d01 header b{
  flex:0 0 auto;
  font-size:1.1rem;
  color:#0f172a;
}
.asa-progress-metric-v215d01 i{
  display:block;
  height:9px;
  border-radius:999px;
  background:#e8eef7;
  overflow:hidden;
}
.asa-progress-metric-v215d01 em{
  display:block;
  width:var(--value);
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#2563eb 0%,#1d4ed8 35%,#06b6d4 100%);
  transform-origin:left;
  transform:scaleX(.1);
  transition:transform .85s cubic-bezier(.2,.8,.2,1);
}
.asa-student360-v215d01.is-visible .asa-progress-metric-v215d01 em{transform:scaleX(1)}
.asa-student360-visual-v215d01{
  margin:0;
  align-self:end;
  justify-self:center;
  width:100%;
  max-width:300px;
  filter:drop-shadow(0 16px 26px rgba(15,23,42,.12));
}
.asa-student360-visual-v215d01 img{display:block;width:100%;height:auto}
.asa-student360-copy-v215d01>.asa-inline-link{display:inline-flex;margin-top:8px;align-items:center;gap:6px}

/* Action panel */
.asa-insight-card-v215d01{
  position:relative;
  overflow:hidden;
  min-width:0;
  min-height:590px;
  border-radius:34px;
  padding:40px 40px 30px;
  background:linear-gradient(145deg,#0b1f3a 0%,#102d56 64%,#0c2346 100%);
  box-shadow:0 30px 64px rgba(4,18,45,.22);
  border:1px solid rgba(255,255,255,.1);
  color:#fff;
}
.asa-insight-card-v215d01:before{
  content:"";
  position:absolute;
  right:-120px;
  bottom:-120px;
  width:320px;
  height:320px;
  border-radius:50%;
  border:1px solid rgba(96,165,250,.16);
  box-shadow:0 0 0 48px rgba(96,165,250,.05),0 0 0 96px rgba(96,165,250,.03);
  pointer-events:none;
}
.asa-insight-glow-v215d01{
  position:absolute;
  right:18px;
  top:0;
  width:90px;
  height:90px;
  background:radial-gradient(circle,#f6c84b 0%,rgba(246,200,75,.3) 18%,transparent 64%);
  opacity:.7;
  pointer-events:none;
}
.asa-insight-top-v215d01{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
}
.asa-insight-top-v215d01>span{
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.16em;
  color:#b8d4ff;
  line-height:1.3;
}
.asa-insight-top-v215d01 strong{
  flex:0 0 auto;
  white-space:nowrap;
  font-size:clamp(3.25rem,4.4vw,4.8rem);
  line-height:.9;
  color:#f7c744;
  letter-spacing:-.04em;
}
.asa-insight-top-v215d01 strong small{
  font-size:1rem;
  color:#b9c8dc;
  letter-spacing:0;
}
.asa-insight-card-v215d01 h3{
  position:relative;
  z-index:1;
  margin:42px 0 26px;
  font-size:clamp(2rem,2.7vw,3rem);
  line-height:1.08;
  color:#fff;
  letter-spacing:-.035em;
}

/*
 * Critical legacy-CSS collision fix.
 * v2.1.5.A has `.asa-insight-card li:before { content:"✓" }`.
 * It becomes an unexpected fourth grid child and pushes action text/chevron
 * into narrow columns. Reset it and use flex rows so labels stay horizontal.
 */
.asa-student360-v215d01 .asa-next-actions-v215d01{
  position:relative;
  z-index:1;
  list-style:none !important;
  padding:0 !important;
  margin:0 !important;
  display:grid;
  gap:14px;
}
.asa-student360-v215d01 .asa-next-actions-v215d01>li{
  display:flex !important;
  width:100%;
  min-width:0;
  align-items:center;
  gap:14px;
  padding:16px 18px !important;
  border-radius:19px;
  border:1px solid rgba(191,219,254,.28) !important;
  background:linear-gradient(90deg,rgba(255,255,255,.085),rgba(255,255,255,.045)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  font-size:1rem;
  line-height:1.35;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.asa-student360-v215d01 .asa-next-actions-v215d01>li::before,
.asa-student360-v215d01 .asa-next-actions-v215d01>li::after{
  content:none !important;
  display:none !important;
}
.asa-student360-v215d01 .asa-next-actions-v215d01>li:hover{
  transform:translateY(-2px);
  border-color:rgba(247,199,68,.58) !important;
  background:linear-gradient(90deg,rgba(255,255,255,.11),rgba(255,255,255,.055)) !important;
}
.asa-student360-v215d01 .asa-action-check-v215d01{
  flex:0 0 42px;
  display:grid !important;
  place-items:center;
  width:42px;
  height:42px;
  margin:0 !important;
  border-radius:50%;
  border:1px solid rgba(34,211,238,.55);
  background:rgba(6,182,212,.08);
  color:#67e8f9;
  font-weight:900;
  font-size:1.15rem;
  line-height:1;
  text-align:center;
}
.asa-student360-v215d01 .asa-next-actions-v215d01>li>span:nth-child(2){
  flex:1 1 auto;
  min-width:0;
  display:block !important;
  margin:0 !important;
  color:#fff;
  white-space:normal;
  overflow-wrap:normal;
  word-break:normal;
  text-align:left !important;
  font-size:1rem;
  line-height:1.4;
}
.asa-student360-v215d01 .asa-next-actions-v215d01>li>b{
  flex:0 0 24px;
  display:block !important;
  margin:0 0 0 auto !important;
  color:#f7c744;
  font-size:1.75rem;
  font-weight:400;
  line-height:1;
  text-align:center !important;
}
.asa-insight-meta-v215d01{
  position:absolute;
  z-index:1;
  left:40px;
  right:40px;
  bottom:28px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid rgba(255,255,255,.14);
  padding-top:18px;
  color:#9fb3cf;
  font-size:.86rem;
}
.asa-insight-meta-v215d01 span:first-child{display:flex;align-items:center;gap:8px}
.asa-insight-meta-v215d01 i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#2dd4bf}

/* 1100–1280px: preserve two columns but give the action panel enough width. */
@media (max-width:1280px) and (min-width:1051px){
  .asa-student360-grid-v215d01{grid-template-columns:minmax(0,1fr) minmax(460px,.92fr);gap:34px}
  .asa-student360-copy-v215d01 h2{font-size:clamp(2.3rem,3.8vw,3.7rem)}
  .asa-student360-body-v215d01{grid-template-columns:minmax(300px,1fr) minmax(190px,.52fr);gap:16px}
  .asa-student360-visual-v215d01{max-width:245px}
  .asa-insight-card-v215d01{padding:34px 32px 28px;min-height:560px}
  .asa-insight-meta-v215d01{left:32px;right:32px}
}

/* Tablet: stack major columns; keep action rows horizontal. */
@media(max-width:1050px){
  .asa-student360-grid-v215d01{grid-template-columns:1fr;gap:34px}
  .asa-insight-card-v215d01{min-height:510px}
  .asa-student360-body-v215d01{grid-template-columns:minmax(0,1.1fr) minmax(210px,.58fr)}
  .asa-student360-visual-v215d01{max-width:270px}
}

@media(max-width:720px){
  .asa-student360-v215d01{padding-top:54px}
  .asa-student360-copy-v215d01 h2{font-size:clamp(2rem,10.5vw,2.9rem)}
  .asa-student360-lead-v215d01{font-size:.98rem;line-height:1.7}
  .asa-student360-body-v215d01{grid-template-columns:1fr;margin-top:26px}
  .asa-student360-visual-v215d01{max-width:230px;order:-1;margin:2px auto -4px}
  .asa-insight-card-v215d01{min-height:auto;border-radius:26px;padding:28px 20px 24px}
  .asa-insight-card-v215d01 h3{margin:30px 0 20px;font-size:1.9rem}
  .asa-insight-top-v215d01{gap:12px}
  .asa-insight-top-v215d01 strong{font-size:3.35rem}
  .asa-student360-v215d01 .asa-next-actions-v215d01{gap:11px}
  .asa-student360-v215d01 .asa-next-actions-v215d01>li{gap:11px;padding:13px 13px !important;font-size:.94rem}
  .asa-student360-v215d01 .asa-action-check-v215d01{flex-basis:38px;width:38px;height:38px}
  .asa-student360-v215d01 .asa-next-actions-v215d01>li>span:nth-child(2){font-size:.94rem;line-height:1.35}
  .asa-student360-v215d01 .asa-next-actions-v215d01>li>b{flex-basis:18px;font-size:1.5rem}
  .asa-insight-meta-v215d01{position:relative;left:auto;right:auto;bottom:auto;margin-top:24px;padding-top:16px}
  .asa-progress-metric-v215d01{grid-template-columns:44px minmax(0,1fr);padding:12px 13px}
  .asa-progress-icon-v215d01{width:40px;height:40px;border-radius:13px}
  .asa-student360-labels-v215d01{gap:9px;margin-bottom:17px}
}

@media(max-width:420px){
  .asa-insight-top-v215d01{align-items:center}
  .asa-insight-top-v215d01>span{max-width:160px;font-size:.72rem}
  .asa-insight-top-v215d01 strong{font-size:2.85rem}
  .asa-insight-top-v215d01 strong small{font-size:.8rem}
  .asa-student360-v215d01 .asa-next-actions-v215d01>li{padding:12px !important}
  .asa-student360-v215d01 .asa-next-actions-v215d01>li>span:nth-child(2){font-size:.9rem}
  .asa-insight-meta-v215d01{font-size:.78rem}
}

@media(prefers-reduced-motion:reduce){
  .asa-progress-metric-v215d01 em{transition:none;transform:scaleX(1)}
  .asa-student360-v215d01 .asa-next-actions-v215d01>li{transition:none}
}

/* ASA_DEPLOY_MARKER_PORTAL_V2_1_5_D_STUDENT360_03_CACHE_BUST_ACTION_ROW_FINAL */
/* Final cache-busted action row guard. This block intentionally comes last. */
#progress.asa-student360-v215d01 .asa-insight-card-v215d01 .asa-next-actions-v215d01 > li{
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) 22px !important;
  align-items:center !important;
  column-gap:14px !important;
  min-height:74px !important;
  width:100% !important;
  box-sizing:border-box !important;
}
#progress.asa-student360-v215d01 .asa-insight-card-v215d01 .asa-next-actions-v215d01 > li::before,
#progress.asa-student360-v215d01 .asa-insight-card-v215d01 .asa-next-actions-v215d01 > li::after{
  content:none !important;
  display:none !important;
}
#progress.asa-student360-v215d01 .asa-next-actions-v215d01 > li > .asa-action-check-v215d01{
  grid-column:1 !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  max-width:42px !important;
  margin:0 !important;
}
#progress.asa-student360-v215d01 .asa-next-actions-v215d01 > li > span:not(.asa-action-check-v215d01){
  grid-column:2 !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:break-word !important;
  text-align:left !important;
  line-height:1.45 !important;
  margin:0 !important;
}
#progress.asa-student360-v215d01 .asa-next-actions-v215d01 > li > b{
  grid-column:3 !important;
  justify-self:end !important;
  width:22px !important;
  min-width:22px !important;
  margin:0 !important;
  text-align:center !important;
}
@media (min-width:1051px){
  #progress.asa-student360-v215d01 .asa-student360-grid-v215d01{
    grid-template-columns:minmax(0,1fr) minmax(560px,.92fr) !important;
  }
  #progress.asa-student360-v215d01 .asa-insight-card-v215d01{
    min-height:560px !important;
  }
}
@media (max-width:720px){
  #progress.asa-student360-v215d01 .asa-insight-card-v215d01 .asa-next-actions-v215d01 > li{
    grid-template-columns:38px minmax(0,1fr) 18px !important;
    min-height:64px !important;
    column-gap:11px !important;
  }
}
