body.page-enrollment.glass-college {
  min-height: 100dvh;
  margin: 0;
  background:
    linear-gradient(rgba(211, 227, 239, 0.78), rgba(247, 239, 226, 0.84)),
    url("/images/hero-grad-smoke.webp") center / cover fixed;
  color: var(--gc-ink);
  font-family: "Plus Jakarta Sans", sans-serif;
}

.ec-shell {
  width: min(62rem, calc(100% - 2rem));
  margin: 0 auto;
  padding: clamp(1.25rem, 3vw, 2.5rem) 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  min-height: calc(100dvh - 2.5rem);
}

.ec-panel {
  border: 1px solid rgba(255, 255, 255, 0.68);
  border-radius: var(--gc-r-glass, 1.6rem);
  box-shadow: var(--gc-shadow-glass, 0 18px 44px rgba(20, 24, 31, 0.14)), inset 0 1px 0 rgba(255, 255, 255, 0.64);
  -webkit-backdrop-filter: blur(18px) saturate(1.12);
  backdrop-filter: blur(18px) saturate(1.12);
}

.ec-chat-head { display: flex; align-items: center; gap: 0.75rem; }

.ec-panel {
  width: min(60rem, 100%);
  aspect-ratio: 1;
  min-height: min(52rem, calc(100dvh - 2.5rem));
  max-height: calc(100dvh - 2.5rem);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto auto;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.76);
  color: #101728;
}
.ec-chat-head { padding: 1.3rem 1.4rem; border-bottom: 1px solid rgba(20, 24, 31, 0.1); }
.ec-avatar { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #009fe3, #7048e8); font-weight: 900; font-size: 1.3rem; }
.ec-chat-head h2, .ec-chat-head p { margin: 0; }
.ec-chat-head h2 { font-size: 1.15rem; }
.ec-chat-head p { color: #2c3650; font-size: 0.88rem; }
.ec-online-dot { display: inline-block; width: 0.55rem; height: 0.55rem; margin-right: 0.35rem; border-radius: 50%; background: #16a34a; }

.ec-transcript { overflow-y: auto; padding: 2rem 2.25rem; display: grid; gap: 1rem; align-content: start; scrollbar-width: thin; }
.ec-message { max-width: min(100%, 41rem); padding: 0.85rem 1rem; border-radius: 1.15rem; line-height: 1.55; animation: ecMessageIn 0.24s ease both; }
@keyframes ecMessageIn { from { opacity: 0; transform: translateY(0.35rem); } to { opacity: 1; transform: translateY(0); } }
.ec-message.bot { justify-self: start; border: 1px solid rgba(20, 24, 31, 0.09); background: #fff; box-shadow: 0 6px 18px rgba(20, 24, 31, 0.06); }
.ec-message.user { justify-self: end; color: #fff; background: linear-gradient(135deg, #009fe3, #7048e8); }
.ec-message.summary { width: 100%; max-width: 100%; background: #fff; }
.ec-summary-title { margin: 0 0 0.7rem; font-weight: 800; }
.ec-summary-grid { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 0.45rem 1rem; font-size: 0.92rem; }
.ec-summary-grid dt { color: #2c3650; }
.ec-summary-grid dd { margin: 0; overflow-wrap: anywhere; }
.ec-typing { display: inline-flex; gap: 0.25rem; align-items: center; min-height: 1rem; }
.ec-typing i { width: 0.45rem; height: 0.45rem; border-radius: 50%; background: #64748b; animation: ecTyping 1s infinite; }
.ec-typing i:nth-child(2) { animation-delay: 0.12s; }
.ec-typing i:nth-child(3) { animation-delay: 0.24s; }
@keyframes ecTyping { 0%, 60%, 100% { transform: translateY(0); opacity: 0.45; } 30% { transform: translateY(-0.3rem); opacity: 1; } }

.ec-progress { margin: 0; padding: 0 2.25rem 0.35rem; color: #2c3650; font-size: 0.83rem; text-align: right; }
.ec-composer { padding: 1rem 2.25rem 1.25rem; border-top: 1px solid rgba(20, 24, 31, 0.1); }
.ec-chips { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-bottom: 0.75rem; }
.ec-chip, .ec-send { border: 0; cursor: pointer; font: inherit; }
.ec-chip { padding: 0.62rem 0.95rem; border-radius: 999px; color: #17202a; background: #fff; border: 1px solid rgba(20, 24, 31, 0.14); font-weight: 700; transition: transform 0.16s ease, box-shadow 0.16s ease; }
.ec-chip:hover, .ec-chip:focus-visible { transform: translateY(-1px); border-color: #009fe3; box-shadow: 0 5px 16px rgba(20, 24, 31, 0.08); }
.ec-input-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.7rem; }
.ec-input { width: 100%; min-height: 3rem; padding: 0.75rem 1rem; border: 1px solid rgba(20, 24, 31, 0.13); border-radius: 0.72rem; color: #101728; background: rgba(255, 255, 255, 0.9); font: inherit; }
.ec-send { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 0.72rem; color: #fff; background: #17202a; }
.ec-send:hover { background: #243b53; }
.ec-error { min-height: 1.2rem; margin: 0.5rem 0 0; color: #b91c1c; font-size: 0.87rem; }
.ec-privacy { margin: 0.2rem 0 0; color: #2c3650; font-size: 0.8rem; }
.ec-account { padding: 1.25rem 2.25rem 1.5rem; border-top: 1px solid rgba(20, 24, 31, 0.1); }
.ec-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.ec-chip:focus-visible, .ec-send:focus-visible, .ec-input:focus-visible { outline: 3px solid rgba(52, 87, 213, 0.35); outline-offset: 2px; }

@media (max-width: 920px) {
  .ec-shell { width: min(100% - 1rem, 52rem); }
  .ec-panel { width: 100%; aspect-ratio: auto; min-height: 40rem; max-height: none; }
  .ec-transcript { padding: 1.4rem; }
  .ec-progress { padding: 0 1.4rem 0.25rem; }
  .ec-composer { padding: 0.85rem 1.4rem 1rem; }
  .ec-account { padding: 1rem 1.4rem 1.2rem; }
}

@media (max-width: 640px) {
  .ec-panel { padding: 0; }
  .ec-chat-head { padding: 1rem; }
  .ec-transcript, .ec-composer, .ec-account { padding-left: 1rem; padding-right: 1rem; }
  .ec-progress { padding: 0 1rem; }
  .ec-summary-grid { grid-template-columns: 1fr; }
  .ec-input-row { grid-template-columns: minmax(0, 1fr) 3rem; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* ===== Opaque glass final pass (2026-09-25) ===== */
.ec-panel {
  background: linear-gradient(145deg, #ffffff 0%, #f4f7fb 48%, #e7ecf4 100%) !important;
  border: 1px solid rgba(15, 23, 42, 0.14) !important;
  box-shadow:
    0 22px 48px -24px rgba(15, 23, 42, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.85) !important;
  -webkit-backdrop-filter: blur(28px) saturate(160%) contrast(106%) !important;
  backdrop-filter: blur(28px) saturate(160%) contrast(106%) !important;
  color: #101728 !important;
}