/* Shared course family — measured hierarchy, ICE identity. */

/* The header, footer and global sticky CTA remain on the global type system. */
.page-course main,
.page-course .subnav{
  font-family:var(--ice-font-primary);
}

.page-course main{
  --course-rule:var(--hairline);
  --course-paper:var(--bg);
  --course-surface:var(--card);
  --course-tint:var(--band-bg);
  --course-ink:var(--navy);
  --course-copy:var(--slate);
  overflow:clip;
  background:var(--course-paper);
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  font-weight:450;
  line-height:var(--ice-type-body-line);
}

.page-course main h3,
.page-course main h4,
.page-course main button,
.page-course main a{
  font-family:var(--ice-font-primary);
}

.page-course main{
  --course-display:var(--ice-font-display);
}

.page-course main h1,
.page-course main h2{
  font-family:var(--course-display);
}

.page-course main h1,
.page-course main h2,
.page-course main h3,
.page-course main h4{
  color:var(--course-ink);
}

/* .merit-flash is the navy merit-list band on the homepage (site.css §8.5).
   The homepage carries `page-course`, so the blanket rule above outranks the
   band's own `.merit-flash__lead h2{color:#fff}` on specificity (0,1,2 beats
   0,1,1) and painted the headline `--course-ink` — which in light mode is
   `--navy` = navy-800, the exact colour the band's gradient starts from. The
   headline was invisible in light mode and fine in dark, where `--navy` flips
   to graphite-100. Reported 2026-08-23. */
.page-course main .merit-flash h2{
  color:#fff;
}

/* .scholar is a dark navy accent card (site.css) — its heading stays white
   even under the blanket page-course heading-color rule above. */
.page-course main .scholar h3{
  color:#fff;
}

.page-course main .course-kicker,
.page-course main .course-eyebrow{
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-4);
  color:var(--ice-color-text-accent);
  font-size:var(--ice-type-label-size);
  font-weight:600;
  letter-spacing:var(--ice-type-label-track);
  line-height:var(--ice-type-label-line);
}

/* ---------- Course hero ---------- */
.page-course main .course-hero{
  position:relative;
  padding:var(--ice-hero-pad-top-mobile) var(--ice-space-0) var(--ice-space-11);
  color:#fff;
  background:var(--navy-deep);
}

.page-course main .course-hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:var(--ice-rule-width-accent);
  background:var(--ice-media-hero-accent);
}

.page-course main .course-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-9);
}

.page-course main .course-hero__copy{min-width:0}

.page-course main .course-breadcrumb{
  display:flex;
  flex-wrap:wrap;
  gap:var(--ice-space-2) var(--ice-space-2);
  margin-bottom:var(--ice-space-9);
  color:rgba(255,255,255,.72);
  font-size:var(--ice-type-caption-size);
  font-weight:500;
  line-height:var(--ice-type-caption-line);
}

.page-course main .course-breadcrumb a{
  color:inherit;
  text-decoration:none;
}

.page-course main .course-breadcrumb a:hover{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:var(--ice-space-1);
}

.page-course main .course-eyebrow{color:var(--terracotta-soft)}

.page-course main .course-hero h1{
  max-width:var(--ice-measure-page-title);
  margin:var(--ice-space-0);
  color:#fff;
  font-family:var(--course-display);
  font-size:var(--ice-type-h1-size);
  font-weight:400;
  letter-spacing:var(--ice-type-h1-track);
  line-height:var(--ice-type-h1-line);
  text-wrap:balance;
}

.page-course main .course-hero h1 span{
  color:var(--terracotta-soft);
  white-space:nowrap;
}

.page-course main .course-hero__lede{
  max-width:var(--ice-measure-lede);
  margin:var(--ice-space-6) var(--ice-space-0) var(--ice-space-0);
  color:rgba(255,255,255,.84);
  font-size:var(--ice-type-lede-size);
  line-height:var(--ice-type-lede-line);
}

.page-course main .course-facts{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--ice-space-4) var(--ice-space-6);
  margin:var(--ice-space-8) var(--ice-space-0) var(--ice-space-0);
}

.page-course main .course-facts div{
  min-width:0;
  padding-left:var(--ice-space-4);
  border-left:var(--ice-rule-width) solid rgba(255,255,255,.3);
}

.page-course main .course-facts div:nth-child(odd){padding-left:var(--ice-space-0);border-left:0}

.page-course main .course-facts dt{
  margin-bottom:var(--ice-space-1);
  color:rgba(255,255,255,.58);
  font-size:var(--ice-type-caption-size);
  font-weight:600;
  letter-spacing:var(--ice-type-track-wide-75);
  text-transform:uppercase;
}

.page-course main .course-facts dd{
  color:#fff;
  font-size:var(--ice-type-body-size);
  font-weight:600;
  line-height:var(--ice-type-leading-125);
}

.page-course main .course-intake{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--ice-space-3);
  margin-top:var(--ice-space-7);
}

.page-course main .course-intake div{
  min-width:0;
  padding:var(--ice-space-3) var(--ice-space-4);
  background:rgba(255,255,255,.08);
  border:var(--ice-rule-width) solid rgba(255,255,255,.16);
}

.page-course main .course-intake span,
.page-course main .course-intake strong{display:block}

.page-course main .course-intake span{
  margin-bottom:var(--ice-space-1);
  color:rgba(255,255,255,.58);
  font-size:var(--ice-type-caption-size);
  font-weight:600;
  letter-spacing:var(--ice-type-track-wide-4);
  text-transform:uppercase;
}

.page-course main .course-intake strong{
  color:#fff;
  font-size:var(--ice-type-body-size);
  font-weight:500;
  line-height:var(--ice-type-leading-135);
}

.page-course main .course-actions{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:var(--ice-space-3);
  margin-top:var(--ice-space-8);
}

/* ---------- Post-hero quote band ---------- */
.page-course main .course-hero-quote{
  padding:var(--ice-space-fluid-28-44) var(--ice-space-0);
  background:var(--course-surface);
  border-bottom:var(--ice-rule-width) solid var(--course-rule);
}

.page-course main .course-hero-quote blockquote{
  max-width:var(--ice-measure-quote);
  margin:var(--ice-space-0);
  color:var(--course-ink);
  font-family:var(--course-display);
  font-size:var(--ice-type-h3-size);
  font-style:normal;
  line-height:var(--ice-type-leading-150);
}

.page-course main .course-hero-quote blockquote em{
  color:var(--ice-color-text-action-on-brand);
  font-style:italic;
}

.page-course main .course-hero__media{
  position:relative;
  min-width:0;
  margin:var(--ice-space-0);
  align-self:end;
  background:var(--navy-ink);
}

.page-course main .course-hero__media picture,
.page-course main .course-hero__media img{
  display:block;
  width:100%;
}

.page-course main .course-hero__media img{
  height:auto;
  aspect-ratio:var(--ice-media-ratio-course-hero);
  object-fit:cover;
}

.page-course main .course-hero__media figcaption{
  display:grid;
  gap:var(--ice-space-1);
  padding:var(--ice-space-4) var(--ice-space-5) var(--ice-space-5);
  background:var(--course-surface);
  color:var(--course-copy);
}

.page-course main .course-hero__media figcaption span{
  color:var(--ice-color-text-accent);
  font-size:var(--ice-type-caption-size);
  font-weight:600;
}

.page-course main .course-hero__media figcaption strong{
  color:var(--course-ink);
  font-size:var(--ice-type-body-size);
  font-weight:500;
  line-height:var(--ice-type-leading-145);
}

/* ---------- Immediate actions (inline in hero or any section) ---------- */
.page-course main .course-action{
  min-height:var(--ice-cta-min);
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--ice-space-4);
  padding:var(--ice-space-4) var(--ice-space-6);
  overflow:hidden;
  /* Default: navy border + ink colour — visible on any light background */
  border:2px solid var(--navy);
  color:var(--navy);
  background:transparent;
  font-size:var(--ice-type-button-size);
  font-weight:700;
  letter-spacing:var(--ice-type-button-track);
  line-height:var(--ice-type-button-line);
  text-decoration:none;
  transition:color var(--ice-duration-action) var(--ice-ease-standard),border-color var(--ice-duration-action) var(--ice-ease-standard),background var(--ice-duration-action) var(--ice-ease-standard);
}

.page-course main .course-action span{font-size:var(--ice-type-icon-scale);letter-spacing:var(--ice-type-track-none)}

/* Light-context hover: fill navy */
.page-course main .course-action:hover{
  background:var(--navy);
  color:#fff;
  border-color:var(--navy);
}

.page-course main .course-action::before{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-101%);
  background:var(--navy);
  transition:transform var(--ice-duration-action) var(--ice-ease-standard);
  z-index:-1;
}

.page-course main .course-action:hover::before{transform:translateX(0)}

/* Inside the dark course-hero: flip to white border + white text */
.page-course main .course-hero .course-action{
  border-color:rgba(255,255,255,.5);
  color:#fff;
  background:transparent;
}

.page-course main .course-hero .course-action:hover{
  color:var(--navy-deep);
  background:transparent;
  border-color:rgba(255,255,255,.5);
}

.page-course main .course-hero .course-action::before{
  background:#fff;
}

.page-course main .course-action--primary{
  justify-content:space-between;
  border:2px solid var(--crimson);
  background:var(--crimson);
  color:var(--accent-ink);
}

.page-course main .course-action--primary::before{background:var(--navy-deep)}

.page-course main .course-action--primary:hover{
  border-color:var(--navy-deep);
  color:#fff;
  background:transparent;
}

/* --link variant: underline-only, no box */
.page-course main .course-action--link{
  min-height:var(--ice-control-min-compact);
  border:0;
  padding:var(--ice-space-3) var(--ice-space-0);
  color:var(--navy);
  background:transparent;
  font-size:var(--ice-type-body-size);
  font-weight:600;
  letter-spacing:var(--ice-type-track-none);
  text-decoration:underline;
  text-decoration-color:rgba(14,22,71,.35);
  text-underline-offset:var(--ice-space-1);
}

.page-course main .course-action--link::before{display:none}

.page-course main .course-action--link:hover{
  color:var(--navy);
  background:transparent;
  text-decoration-color:var(--navy);
}

/* --link inside dark hero: white underline */
.page-course main .course-hero .course-action--link{
  color:#fff;
  text-decoration-color:rgba(255,255,255,.4);
}

.page-course main .course-hero .course-action--link:hover{
  color:#fff;
  text-decoration-color:#fff;
}

/* ---------- Highlight strip (post-hero) ---------- */
.page-course main .course-highlights{
  padding:var(--ice-space-6) var(--ice-space-0);
  background:var(--course-surface);
  border-bottom:var(--ice-rule-width) solid var(--course-rule);
}

.page-course main .course-highlights__row{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-5);
}

.page-course main .course-highlight{
  display:flex;
  align-items:baseline;
  gap:var(--ice-space-3);
}

.page-course main .course-highlight span{
  color:var(--ice-color-text-accent);
  font-size:var(--ice-type-caption-size);
  font-weight:700;
  font-variant-numeric:tabular-nums;
}

.page-course main .course-highlight p{
  margin:var(--ice-space-0);
  color:var(--course-ink);
  font-size:var(--ice-type-body-size);
  font-weight:500;
  line-height:var(--ice-type-leading-140);
}

/* ---------- Sticky local navigation ---------- */
.page-course .subnav{
  position:sticky;
  top:var(--nav-main-h);
  z-index:40;
  border-bottom:var(--ice-rule-width) solid var(--course-rule,var(--hairline));
  background:var(--card);
}

@supports ((backdrop-filter:blur(4px)) or (-webkit-backdrop-filter:blur(4px))) and (background:color-mix(in srgb,red 50%,blue)){
  .page-course .subnav{
    background:color-mix(in srgb,var(--card) var(--ice-glass-mix),transparent);
    -webkit-backdrop-filter:blur(var(--ice-glass-blur)) saturate(var(--ice-glass-saturation));
    backdrop-filter:blur(var(--ice-glass-blur)) saturate(var(--ice-glass-saturation));
  }
}

.page-course .subnav .wrap{
  display:flex;
  align-items:center;
  gap:var(--ice-space-0);
  overflow-x:auto;
  scrollbar-width:none;
}

.page-course .subnav .wrap::-webkit-scrollbar{display:none}

.page-course .subnav a{
  min-height:var(--ice-subnav-height);
  display:inline-flex;
  align-items:center;
  flex:none;
  padding:var(--ice-space-3) var(--ice-space-4);
  border-bottom:var(--ice-rule-width-active) solid transparent;
  color:var(--slate);
  font-size:var(--ice-type-button-size);
  font-weight:500;
  line-height:var(--ice-type-button-line);
  text-decoration:none;
}

.page-course .subnav a:hover,
.page-course .subnav a.on{
  border-bottom-color:var(--crimson);
  color:var(--navy);
}

.page-course .subnav .apply-mini{
  margin-left:auto;
  border:0;
  background:var(--crimson);
  color:var(--accent-ink);
  font-weight:700;
}

.page-course .subnav .apply-mini:hover{
  border:0;
  background:var(--crimson-hover);
  color:var(--accent-ink);
}

/* ---------- Shared section language ---------- */
.page-course main .course-section{
  padding:var(--ice-section-block) var(--ice-space-0);
  background:var(--course-paper);
}

.page-course main .course-section--tint{background:var(--course-tint)}

.page-course main .course-section__heading{max-width:var(--ice-measure-heading)}

.page-course main .course-section__heading h2,
.page-course main .career-heading h2,
.page-course main .course-apply h2{
  margin:var(--ice-space-0);
  font-size:var(--ice-type-h2-size);
  font-weight:500;
  letter-spacing:var(--ice-type-h2-track);
  line-height:var(--ice-type-h2-line);
  text-wrap:balance;
}

.page-course main .course-section__heading>p:not(.course-kicker){
  max-width:var(--ice-measure-prose);
  margin:var(--ice-space-5) var(--ice-space-0) var(--ice-space-0);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-body-line);
}

.page-course main .course-intro-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-9);
}

.page-course main .course-pull-quote{
  align-self:start;
  margin:var(--ice-space-0);
  padding:var(--ice-space-0);
  color:var(--ice-color-text-action);
  font-family:var(--course-display);
  font-size:var(--ice-type-quote-size);
  font-weight:400;
  font-style:normal;
  letter-spacing:var(--ice-type-track-tight-10);
  line-height:var(--ice-type-quote-line);
  text-wrap:balance;
}

.page-course main .course-pull-quote em{
  color:inherit;
  font-style:italic;
}

.page-course main .course-intro-copy{max-width:var(--ice-measure-prose-wide)}

.page-course main .course-intro-copy p{
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-6);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-body-line);
}

.page-course main .course-intro-copy .course-lede{
  color:var(--course-ink);
  font-size:var(--ice-type-lede-size);
  font-weight:500;
  line-height:var(--ice-type-lede-line);
}

.page-course main .career-card>span{
  display:block;
  margin-bottom:var(--ice-space-7);
  color:var(--ice-color-text-accent);
  font-size:var(--ice-type-caption-size);
  font-weight:600;
  font-variant-numeric:tabular-nums;
}

.page-course main .career-card h3{
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-2);
  font-size:var(--ice-type-h3-size);
  font-weight:600;
  letter-spacing:var(--ice-type-track-tight-10);
  line-height:var(--ice-type-leading-120);
}

.page-course main .career-card p{
  max-width:var(--ice-measure-card);
  margin:var(--ice-space-0);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-155);
}

/* ---------- Curriculum ---------- */
.page-course main .curriculum-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-10);
}

.page-course main .curriculum-years{
  border-top:var(--ice-rule-width-active) solid var(--course-ink);
}

.page-course main .year-block{
  border-bottom:var(--ice-rule-width) solid var(--course-ink);
}

.page-course main .year-block summary{
  min-height:var(--ice-space-20);
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--ice-space-6);
  padding:var(--ice-space-5) var(--ice-space-13) var(--ice-space-5) var(--ice-space-0);
  cursor:pointer;
  list-style:none;
  color:var(--course-ink);
}

.page-course main .year-block summary::-webkit-details-marker{display:none}

.page-course main .year-block summary span,
.page-course main .year-block summary b,
.page-course main .year-block summary small{display:block}

.page-course main .year-block summary b{
  font-size:var(--ice-type-h3-size);
  font-weight:600;
  line-height:var(--ice-type-leading-120);
}

.page-course main .year-block summary small{
  margin-top:var(--ice-space-1);
  color:var(--course-copy);
  font-size:var(--ice-type-button-size);
  font-weight:450;
  line-height:var(--ice-type-leading-135);
}

.page-course main .year-block summary i,
.page-course main .course-faq summary i{
  position:absolute;
  right:var(--ice-space-2);
  top:50%;
  width:var(--ice-icon-size);
  height:var(--ice-icon-size);
  transform:translateY(-50%);
}

.page-course main .year-block summary i::before,
.page-course main .year-block summary i::after,
.page-course main .course-faq summary i::before,
.page-course main .course-faq summary i::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:var(--ice-mark-size);
  height:var(--ice-rule-width);
  background:currentColor;
  transform:translate(-50%,-50%);
  transition:transform var(--ice-duration-quick) var(--ice-ease-standard);
}

.page-course main .year-block summary i::after,
.page-course main .course-faq summary i::after{transform:translate(-50%,-50%) rotate(90deg)}

.page-course main .year-block[open] summary i::after,
.page-course main .course-faq details[open] summary i::after{transform:translate(-50%,-50%) rotate(0)}

.page-course main .year-block__content{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-6);
  padding:var(--ice-space-2) var(--ice-space-0) var(--ice-space-8);
}

.page-course main .semester-panel{
  min-width:0;
  padding-top:var(--ice-space-5);
  border-top:var(--ice-rule-width) solid var(--terracotta);
}

.page-course main .semester-panel h3{
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-4);
  font-size:var(--ice-type-h4-size);
  font-weight:600;
  line-height:var(--ice-type-leading-125);
}

.page-course main .mod-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-3);
}

.page-course main .mod-card{
  min-width:0;
  padding:var(--ice-space-4) var(--ice-space-4) var(--ice-space-4);
  background:var(--course-surface);
  border:var(--ice-rule-width) solid var(--course-rule);
  color:var(--course-ink);
  font-size:var(--ice-type-body-size);
  font-weight:500;
  line-height:var(--ice-type-leading-140);
}

.page-course main .mod-badge{
  display:inline-block;
  margin-bottom:var(--ice-space-2);
  padding:var(--ice-space-1) var(--ice-space-2);
  background:var(--band-bg);
  color:var(--course-copy);
  font-size:var(--ice-type-caption-size);
  font-weight:700;
  letter-spacing:var(--ice-type-track-wide-4);
  text-transform:uppercase;
}

.page-course main .mod-badge--elective{background:var(--terracotta-soft);color:var(--navy-deep)}
.page-course main .mod-badge--field{background:var(--ice-color-action);color:var(--ice-color-on-action)}

.page-course main .course-note{
  max-width:var(--ice-measure-course-copy);
  margin:var(--ice-space-0);
  color:var(--course-copy);
  font-size:var(--ice-type-caption-size);
  line-height:var(--ice-type-leading-155);
}

/* ---------- Facilities: list + single large photo ---------- */
.page-course main .facility-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-10);
}

.page-course main .facility-list{
  border-top:var(--ice-rule-width-active) solid var(--course-ink);
}

.page-course main .facility-list li{
  padding:var(--ice-space-5) var(--ice-space-0);
  border-bottom:var(--ice-rule-width) solid var(--course-rule);
}

.page-course main .facility-list h3{
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-2);
  font-size:var(--ice-type-h3-size);
  font-weight:600;
  letter-spacing:var(--ice-type-track-tight-8);
  line-height:var(--ice-type-leading-125);
}

.page-course main .facility-list p{
  max-width:var(--ice-measure-facility);
  margin:var(--ice-space-0);
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-150);
}

.page-course main .facility-photo{
  min-width:0;
  margin:var(--ice-space-0);
  background:var(--navy-ink);
}

.page-course main .facility-photo picture,
.page-course main .facility-photo img{display:block;width:100%}

.page-course main .facility-photo img{
  height:auto;
  aspect-ratio:var(--ice-media-ratio-square);
  object-fit:cover;
}

.page-course main .facility-photo figcaption{
  padding:var(--ice-space-4) var(--ice-space-4);
  border:var(--ice-rule-width) solid var(--course-rule);
  border-top:0;
  background:var(--course-surface);
  color:var(--course-copy);
  font-size:var(--ice-type-caption-size);
  line-height:var(--ice-type-leading-145);
}

.page-course main .course-text-link{
  min-height:var(--ice-control-min-compact);
  display:inline-flex;
  align-items:center;
  gap:var(--ice-space-6);
  margin-top:var(--ice-space-fluid-28-40);
  padding:var(--ice-space-2) var(--ice-space-0);
  border-bottom:var(--ice-rule-width) solid currentColor;
  color:var(--course-ink);
  font-size:var(--ice-type-body-size);
  font-weight:600;
  text-decoration:none;
}

.page-course main .course-text-link:hover{color:var(--ice-color-text-action)}

/* ---------- Promo band (survey video) ---------- */
.page-course main .course-promo{
  padding:var(--ice-space-fluid-56-88) var(--ice-space-0);
  background:var(--ice-color-surface-brand);
}

.page-course main .course-promo__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-8);
  align-items:center;
}

.page-course main .course-promo .course-kicker{color:var(--ice-color-accent)}

.page-course main .course-promo h2{
  margin:var(--ice-space-0);
  max-width:var(--ice-measure-promo-heading);
  color:#fff;
  font-size:var(--ice-type-h2-size);
  font-weight:400;
  letter-spacing:var(--ice-type-track-tight-20);
  line-height:var(--ice-type-leading-115);
  text-wrap:balance;
}

.page-course main .course-promo__copy p:not(.course-kicker){
  max-width:var(--ice-measure-promo-copy);
  margin:var(--ice-space-4) var(--ice-space-0) var(--ice-space-0);
  color:rgba(255,255,255,.88);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-155);
}

.page-course main .course-promo__media{
  min-width:0;
  margin:var(--ice-space-0);
  box-shadow:var(--ice-shadow-promo);
}

.page-course main .course-promo__media video,
.page-course main .course-promo__media img{
  display:block;
  width:100%;
  aspect-ratio:var(--ice-media-ratio-promo);
  object-fit:cover;
  background:var(--navy-ink);
}

/* ---------- Future prospects ---------- */
.page-course main .career-band{
  position:relative;
  color:#fff;
  background-image:url("/media/ice-intake/survey-camp-briefing-1920.webp");
  background-size:cover;
  background-position:center;
}

.page-course main .career-band::before{
  content:"";
  position:absolute;
  inset:0;
  background:var(--ice-media-career-overlay);
}

.page-course main .career-band>.wrap{position:relative}

@supports (background-image:image-set(url(a) 1x)){
  .page-course main .career-band{
    background-image:image-set(
      url("/media/ice-intake/survey-camp-briefing-1920.avif") type("image/avif"),
      url("/media/ice-intake/survey-camp-briefing-1920.webp") type("image/webp")
    );
  }

  .page-computer main .career-band{
    background-image:image-set(
      url("/media/ice-intake/computer-lab-empty-wide-1920.avif") type("image/avif"),
      url("/media/ice-intake/computer-lab-empty-wide-1920.webp") type("image/webp")
    );
  }

  .page-electronics main .career-band{
    background-image:image-set(
      url("/media/ice-intake/electronics-bench-team-1920.avif") type("image/avif"),
      url("/media/ice-intake/electronics-bench-team-1920.webp") type("image/webp")
    );
  }
}

.page-computer main .career-band{background-image:url("/media/ice-intake/computer-lab-empty-wide-1920.webp")}
.page-electronics main .career-band{background-image:url("/media/ice-intake/electronics-bench-team-1920.webp")}
.page-home main .career-band{background-image:none;background-color:var(--navy-deep)}

.page-course main .career-heading{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-6);
}

.page-course main .career-heading h2{color:#fff}

.page-course main .career-heading>p{
  max-width:var(--ice-measure-career-copy);
  margin:var(--ice-space-0);
  color:rgba(255,255,255,.74);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-160);
}

/* Homepage-only: "Projects & Practical Learning" is a bespoke composition on
   the dark .career-band field (image + stacked heading + highlights list +
   ghost CTA) rather than the course pages' .career-grid card layout, so it
   needs its own light-on-navy treatment, vertical rhythm and image framing —
   owner-specified pass, 2026-07-13. */
.page-home main .career-band .media-row{
  /* Stretch (not start) — the text column's real height varies with content/
     viewport, so the image must fill exactly that height, not stop short of
     it and leave dead space below. */
  align-items:stretch;
}
.page-home main .career-band .media-frame{
  display:flex;
  flex-direction:column;
  gap:var(--ice-space-4);
  height:100%;
  border:0;
  box-shadow:none;
}
.page-home main .career-band .media-frame__glass{
  display:flex;
  flex:1 1 auto;
  min-height:0;
  padding:var(--ice-space-5);
  border:1px solid rgba(255,255,255,.14);
  border-radius:24px;
  background:rgba(255,255,255,.05);
  box-shadow:0 24px 60px rgba(3,9,26,.45);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.page-home main .career-band .media-frame__glass .ice-picture{
  display:block;
  flex:1 1 auto;
  min-height:0;
  aspect-ratio:auto;
  border-radius:14px;
  overflow:hidden;
}
.page-home main .career-band .media-frame__glass img{
  display:block;
  width:100%;
  height:100%;
  border-radius:inherit;
}
.page-home main .career-band .media-frame>figcaption{
  display:flex;
  align-items:flex-start;
  gap:var(--ice-space-2);
  padding:var(--ice-space-0);
  background:transparent;
  color:rgba(255,255,255,.68);
}
.page-home main .career-band .media-frame>figcaption::before{
  content:"";
  flex:none;
  width:8px;
  height:8px;
  margin-top:7px;
  border-radius:50%;
  background:var(--ice-color-accent);
  box-shadow:0 0 8px 2px rgba(232,145,90,.7);
}
.page-home main .career-band .career-heading{
  /* Stack headline over lede instead of the course pages' side-by-side
     6fr/5fr split — reads as one hierarchical block, not two columns. */
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-4);
  margin-bottom:var(--ice-space-8);
}
.page-home main .career-band .course-kicker{color:var(--ice-color-accent)}
.page-home main .career-band .highlights{
  margin-top:var(--ice-space-0);
  padding-block:var(--ice-space-4);
  border-top-color:rgba(255,255,255,.14);
}
.page-home main .career-band .highlights li{
  align-items:flex-start;
  padding-block:var(--ice-space-6);
  border-bottom-color:rgba(255,255,255,.14);
  color:rgba(255,255,255,.74);
}
.page-home main .career-band .highlights li b{color:#fff}
.page-home main .career-band .highlights li::before{
  content:"";
  flex:none;
  width:22px;
  height:22px;
  margin-top:2px;
  border-radius:50%;
  border:2px solid var(--ice-color-accent);
  background:rgba(232,145,90,.14);
  box-shadow:0 0 10px 2px rgba(232,145,90,.55),inset 0 0 6px rgba(232,145,90,.35);
}
.page-home main .career-band .cta-row{
  margin-top:var(--ice-space-8);
}
.page-home main .career-band .btn-ghost{
  border:none;
  color:var(--ice-color-surface-brand);
  background:var(--ice-color-on-surface-brand);
  box-shadow:0 0 28px 4px rgba(130,218,244,.45);
}
.page-home main .career-band .btn-ghost:hover{
  background:var(--ice-color-accent);
  color:var(--ice-color-on-accent);
  box-shadow:0 0 36px 6px rgba(130,218,244,.6);
}

.page-course main .career-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  margin-top:var(--ice-space-fluid-28-44);
  border-top:var(--ice-rule-width) solid rgba(255,255,255,.42);
}

.page-course main .career-card{
  min-width:0;
  padding:var(--ice-space-7) var(--ice-space-0);
  border-bottom:var(--ice-rule-width) solid rgba(255,255,255,.2);
}

.page-course main .career-card h3{color:#fff}
.page-course main .career-card p{color:rgba(255,255,255,.7)}
.page-course main .career-card>span{color:var(--terracotta-soft)}

/* ---------- FAQ ---------- */
.page-course main .faq-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-10);
}

.page-course main .course-faq{border-top:var(--ice-rule-width-active) solid var(--course-ink)}

.page-course main .course-faq details{border-bottom:var(--ice-rule-width) solid var(--course-rule)}

.page-course main .course-faq summary{
  min-height:var(--ice-space-18);
  position:relative;
  padding:var(--ice-space-5) var(--ice-space-12) var(--ice-space-5) var(--ice-space-0);
  cursor:pointer;
  list-style:none;
  color:var(--course-ink);
  font-size:var(--ice-type-h3-size);
  font-weight:600;
  line-height:var(--ice-type-leading-128);
}

.page-course main .course-faq summary::-webkit-details-marker{display:none}

.page-course main .stat-card{
  margin-top:var(--ice-space-fluid-28-40);
  padding:var(--ice-space-6) var(--ice-space-6);
  max-width:var(--ice-measure-stat);
  background:var(--crimson-soft);
}

.page-course main .stat-card span{
  display:block;
  margin-bottom:var(--ice-space-2);
  color:var(--ice-color-text-action);
  font-size:var(--ice-type-caption-size);
  font-weight:700;
  letter-spacing:var(--ice-type-track-wide-3);
  text-transform:uppercase;
}

.page-course main .stat-card strong{
  display:block;
  color:var(--navy-deep);
  font-size:var(--ice-type-stat-size);
  font-weight:600;
  line-height:var(--ice-type-leading-110);
}

.page-course main .stat-card p{
  margin:var(--ice-space-2) var(--ice-space-0) var(--ice-space-0);
  color:var(--navy-deep);
  font-size:var(--ice-type-button-size);
  line-height:var(--ice-type-leading-140);
}

.page-course main .course-faq details>p{
  max-width:var(--ice-measure-faq);
  padding:var(--ice-space-0) var(--ice-space-12) var(--ice-space-6) var(--ice-space-0);
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-160);
}

/* ---------- Closing application band ---------- */
.page-course main .course-apply{
  padding:var(--ice-space-fluid-64-104) var(--ice-space-0);
  color:var(--ice-color-on-surface-muted);
  background:var(--ice-color-surface-muted);
}

.page-course main .course-apply__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-8);
}

.page-course main .course-apply .course-kicker{color:var(--ice-color-on-surface-muted)}
.page-course main .course-apply h2{max-width:var(--ice-measure-apply-heading);color:var(--ice-color-on-surface-muted)}

.page-course main .course-apply__copy>p{
  max-width:var(--ice-measure-career-copy);
  margin:var(--ice-space-0);
  color:var(--ice-color-on-surface-muted);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-160);
}

.page-course main .course-apply__actions{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:var(--ice-space-3);
  margin-top:var(--ice-space-7);
}

.page-course main .course-apply__media{
  min-width:0;
  margin:var(--ice-space-0);
}

.page-course main .course-apply__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
}

.page-course main .course-apply .course-action--primary{
  border-color:var(--ice-color-action);
  background:var(--ice-color-action);
  color:var(--ice-color-on-action);
}

.page-course main .course-apply .course-action--primary:hover{
  background:var(--ice-color-action-hover);
  border-color:var(--ice-color-action-hover);
  color:var(--ice-color-on-action-hover);
}

.page-course main .course-action--light{
  border-color:var(--ice-color-on-surface-muted);
  border-bottom-color:var(--ice-color-on-surface-muted);
  color:var(--ice-color-on-surface-muted);
}

.page-course main .course-action--light:hover{
  background:var(--ice-color-surface-brand);
  color:var(--ice-color-on-surface-brand);
}

/* ---------- Program index rows (courses.astro) ---------- */
.page-course main .prog-list{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-pixel);
  margin-top:var(--ice-space-fluid-36-56);
  background:var(--course-rule);
  border:var(--ice-rule-width) solid var(--course-rule);
}

.page-course main .prog-row{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-5);
  padding:var(--ice-space-6);
  background:var(--course-surface);
  text-decoration:none;
  color:var(--course-ink);
  transition:background var(--ice-duration-quick) var(--ice-ease-standard);
}

.page-course main .prog-row:hover{background:var(--course-tint)}

.page-course main .prog-row__media{
  min-width:0;
  margin:var(--ice-space-0);
  background:var(--navy-ink);
}

.page-course main .prog-row__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:var(--ice-media-ratio-square);
  object-fit:cover;
}

.page-course main .prog-row__index{
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-3);
  color:var(--ice-color-text-accent);
  opacity:1;
  font-size:var(--ice-type-caption-size);
  font-weight:700;
  font-variant-numeric:tabular-nums;
}

.page-course main .prog-row__code{
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-2);
  color:var(--ice-color-text-accent);
  font-size:var(--ice-type-caption-size);
  font-weight:600;
  letter-spacing:var(--ice-type-track-wide-4);
  text-transform:uppercase;
}

.page-course main .prog-row__body h3{
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-3);
  font-size:var(--ice-type-h3-size);
  font-weight:500;
  letter-spacing:var(--ice-type-track-tight-10);
  line-height:var(--ice-type-leading-120);
}

.page-course main .prog-row__body>p{
  max-width:var(--ice-measure-program-copy);
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-4);
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-155);
}

.page-course main .prog-row__meta{
  display:flex;
  flex-wrap:wrap;
  gap:var(--ice-space-5);
  margin-bottom:var(--ice-space-4);
}

.page-course main .prog-row__meta div{min-width:0}

.page-course main .prog-row__meta b{
  display:block;
  color:var(--course-ink);
  font-size:var(--ice-type-body-size);
  font-weight:600;
  line-height:var(--ice-type-leading-120);
}

.page-course main .prog-row__meta span{
  color:var(--course-copy);
  font-size:var(--ice-type-caption-size);
}

.page-course main .prog-row__go{
  margin:var(--ice-space-0);
  color:var(--course-ink);
  font-size:var(--ice-type-button-size);
  font-weight:600;
}

/* ---------- Compare table ---------- */
.page-course main .course-compare{
  width:100%;
  margin-top:var(--ice-space-fluid-36-56);
  border-collapse:collapse;
}

.page-course main .course-compare th,
.page-course main .course-compare td{
  padding:var(--ice-space-4) var(--ice-space-4) var(--ice-space-4) var(--ice-space-0);
  border-bottom:var(--ice-rule-width) solid var(--course-rule);
  text-align:left;
  vertical-align:top;
}

.page-course main .course-compare thead th{
  color:var(--course-copy);
  font-size:var(--ice-type-caption-size);
  font-weight:700;
  letter-spacing:var(--ice-type-track-wide-6);
  text-transform:uppercase;
  border-bottom:var(--ice-rule-width-active) solid var(--course-ink);
}

.page-course main .course-compare tbody td{
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-150);
}

.page-course main .course-compare tbody td b{
  display:block;
  color:var(--course-ink);
  font-size:var(--ice-type-body-size);
  font-weight:600;
}

/* ---------- Related courses ---------- */
.page-course main .related-courses{
  padding:var(--ice-space-fluid-56-88) var(--ice-space-0) var(--ice-space-fluid-72-104);
  background:var(--course-paper);
}

.page-course main .related-courses .course-kicker{margin-bottom:var(--ice-space-6)}

.page-course main .related-courses__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-pixel);
  background:var(--course-rule);
  border:var(--ice-rule-width) solid var(--course-rule);
}

.page-course main .related-course{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--ice-space-2);
  padding:var(--ice-space-7) var(--ice-space-6) var(--ice-space-7);
  background:var(--course-surface);
  color:var(--course-ink);
  text-decoration:none;
  transition:background var(--ice-duration-quick) var(--ice-ease-standard);
}

.page-course main .related-course:hover{background:var(--course-tint)}

.page-course main .related-course__eyebrow{
  color:var(--ice-color-text-accent);
  font-size:var(--ice-type-caption-size);
  font-weight:600;
  letter-spacing:var(--ice-type-track-wide-3);
}

.page-course main .related-course h3{
  margin:var(--ice-space-0);
  font-size:var(--ice-type-h4-size);
  font-weight:600;
  letter-spacing:var(--ice-type-track-tight-8);
  line-height:var(--ice-type-leading-125);
}

.page-course main .related-course p{
  max-width:var(--ice-measure-related-copy);
  margin:var(--ice-space-0);
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-150);
}

.page-course main .related-course__link{
  margin-top:var(--ice-space-2);
  color:var(--course-ink);
  font-size:var(--ice-type-button-size);
  font-weight:600;
}

/* ---------- Responsive composition ---------- */
@media(min-width:640px){
  .page-course main .course-intake{grid-template-columns:1fr 1fr}
  .page-course main .career-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-course main .mod-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-course main .course-highlights__row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-course main .related-courses__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-course main .career-card:nth-child(odd){padding-right:var(--ice-space-7);border-right:var(--ice-rule-width) solid var(--course-rule)}
  .page-course main .career-card:nth-child(even){padding-left:var(--ice-space-7)}
  .page-course main .career-card:nth-child(odd){border-right-color:rgba(255,255,255,.2)}
  .page-course main .course-actions,
  .page-course main .course-apply__actions{flex-direction:row;flex-wrap:wrap;align-items:stretch;gap:var(--ice-space-4)}
  .page-course main .course-action{min-width:var(--ice-component-min)}
}

@media(min-width:768px){
  .page-course main .course-hero{padding-top:var(--ice-hero-pad-top-tablet);padding-bottom:var(--ice-space-16)}
  .page-course main .course-hero__grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:"media copy";
    gap:var(--ice-gap-grid-large);
    align-items:end;
  }
  .page-course main .course-hero__copy{grid-area:copy}
  .page-course main .course-hero__media{grid-area:media;transform:none;z-index:2}
  .page-course main .course-intro-grid,
  .page-course main .faq-layout{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--ice-space-fluid-48-104);align-items:start}
  .page-course main .course-intro-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .page-course main .year-block__content{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ice-space-10)}
  .page-course main .facility-layout{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--ice-space-fluid-44-88);align-items:start}
  .page-course main .course-promo__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--ice-space-fluid-44-88);align-items:center}
  .page-course main .course-apply__grid{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    grid-template-areas:"head media" "copy media";
    gap:var(--ice-space-fluid-44-88);
    align-items:end;
  }
  .page-course main .course-apply__grid>div:first-child{grid-area:head;align-self:end}
  .page-course main .course-apply__copy{grid-area:copy;align-self:end}
  .page-course main .course-apply__media{grid-area:media;align-self:end}
  .page-course main .course-apply__grid:not(:has(.course-apply__media)){
    grid-template-areas:"head copy";
    grid-template-columns:minmax(0,6fr) minmax(0,6fr);
  }
  .page-course main .course-apply__grid:not(:has(.course-apply__media))>.cta-row{grid-area:copy;align-self:end}
  .page-course main .prog-row{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--ice-space-8);align-items:center;padding:var(--ice-space-7)}
}

@media(min-width:1024px){
  .page-course main .course-hero{padding-bottom:var(--ice-space-0)}
  .page-course main .course-hero__copy{padding-bottom:var(--ice-space-18)}
  .page-course main .course-facts{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--ice-space-0)}
  .page-course main .course-facts div{padding-left:var(--ice-space-5);border-left:var(--ice-rule-width) solid rgba(255,255,255,.3)}
  .page-course main .course-facts div:first-child{padding-left:var(--ice-space-0);border-left:0}
  .page-course main .curriculum-shell{grid-template-columns:minmax(var(--ice-curriculum-rail-min),4fr) minmax(0,8fr);gap:var(--ice-space-fluid-56-112);align-items:start}
  .page-course main .course-note{grid-column:2}
  .page-course main .career-heading{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--ice-gap-career-heading);align-items:end}
  .page-course main .course-highlights__row{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--ice-space-8)}
  .page-course main .career-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .page-course main .career-card,
  .page-course main .career-card:nth-child(odd),
  .page-course main .career-card:nth-child(even){padding:var(--ice-space-7);border-right:var(--ice-rule-width) solid var(--course-rule)}
  .page-course main .career-card:nth-child(3n+1){padding-left:var(--ice-space-0)}
  .page-course main .career-card:nth-child(3n){padding-right:var(--ice-space-0);border-right:0}
  .page-course main .career-card,
  .page-course main .career-card:nth-child(odd),
  .page-course main .career-card:nth-child(even){border-right-color:rgba(255,255,255,.2)}
}

@media(min-width:1181px){
  .page-course .subnav{top:var(--nav-main-h)}
  .page-course main .course-hero{padding-top:var(--ice-hero-pad-top-wide)}
}

@media(min-width:1280px){
  .page-course main .course-hero__grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--ice-gap-grid-large)}
}

@media(max-width:639px){
  .page-course main .course-apply{padding-bottom:var(--ice-space-24)}
}

@media(max-width:767px){
  .page-course main .course-hero__media picture{
    width:calc(100% - (var(--ice-media-hero-bleed) * 2));
    margin-inline:var(--ice-media-hero-bleed);
  }
}

@media(prefers-reduced-motion:reduce){
  .page-course main .course-hero__media{transform:none}
}

/* ---------- Phase 7: course-system bridge for re-sequenced routes ----------
   These selectors give the existing ICE content modules the Pure Strain's
   typography, geometry, rule-led treatment, and breakpoint behavior while
   page markup is progressively assigned the canonical course class names. */
.page-resequenced main{
  overflow:clip;
  background:var(--course-paper);
  color:var(--course-copy);
}
.page-resequenced main .section-anchor{display:block;height:0;scroll-margin-top:calc(var(--nav-main-h) + var(--ice-subnav-height))}

.page-resequenced main .page-hero{
  display:block;
  min-height:0;
  padding:var(--ice-hero-pad-top-mobile) var(--ice-space-0) var(--ice-space-11);
  overflow:clip;
  color:#fff;
  background:var(--navy-deep);
}
.page-resequenced main .page-hero::after{
  content:"";
  position:absolute;
  inset:auto var(--ice-space-0) var(--ice-space-0) var(--ice-space-0);
  height:var(--ice-rule-width-accent);
  background:var(--ice-media-hero-accent);
}
.page-resequenced main .page-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-9);
  align-items:end;
}
.page-resequenced main .page-hero-grid::after{display:none}
.page-resequenced main .page-hero-grid>div:first-child{min-width:0}
.page-resequenced main .page-hero-grid:not(:has(.editorial-hero-media))>div:first-child{
  max-width:var(--ice-measure-heading);
}
.page-resequenced main .page-hero .crumb{
  display:flex;
  flex-wrap:wrap;
  gap:var(--ice-space-2) var(--ice-space-2);
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-8);
  color:rgba(255,255,255,.72);
  font-size:var(--ice-type-caption-size);
  font-weight:500;
  line-height:var(--ice-type-caption-line);
}
.page-resequenced main .page-hero .course-eyebrow{
  margin-bottom:var(--ice-space-4);
  color:var(--terracotta-soft);
}
.page-resequenced main .page-hero h1{
  max-width:var(--ice-measure-page-title);
  margin:var(--ice-space-0) var(--ice-space-0) var(--ice-space-6);
  color:#fff;
  font-size:var(--ice-type-h1-size);
  font-weight:400;
  letter-spacing:var(--ice-type-h1-track);
  line-height:var(--ice-type-h1-line);
}
.page-resequenced main .page-hero p.sub{
  max-width:var(--ice-measure-lede);
  color:rgba(255,255,255,.78);
  font-size:var(--ice-type-lede-size);
  font-weight:500;
  line-height:var(--ice-type-lede-line);
}
.page-resequenced main .page-hero .facts{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--ice-space-4) var(--ice-space-6);
  margin-top:var(--ice-space-8);
}
.page-resequenced main .page-hero .facts>div{
  min-width:0;
  margin:0;
  padding:var(--ice-space-0) var(--ice-space-0) var(--ice-space-0) var(--ice-space-4);
  border-left:var(--ice-rule-width) solid rgba(255,255,255,.3);
}
.page-resequenced main .page-hero .facts>div:nth-child(odd){padding-left:0;border-left:0}
.page-resequenced main .page-hero .facts b{
  font-family:var(--ice-font-primary);
  font-size:var(--ice-type-body-size);
  font-weight:600;
  letter-spacing:normal;
  line-height:var(--ice-type-leading-125);
}
.page-resequenced main .page-hero .facts span{
  font-size:var(--ice-type-caption-size);
  line-height:var(--ice-type-caption-line);
}
.page-resequenced main .page-hero .cta-row{margin-top:var(--ice-space-8)}
.page-resequenced main .editorial-hero-media{
  position:relative;
  align-self:end;
  margin:0;
  overflow:visible;
  background:var(--course-surface);
  box-shadow:none;
}
.page-resequenced main .editorial-hero-media picture{
  width:calc(100% - (var(--ice-media-hero-bleed) * 2));
  margin-inline:var(--ice-media-hero-bleed);
}
.page-resequenced main .editorial-hero-media img{
  width:100%;
  height:auto;
  aspect-ratio:var(--ice-media-ratio-course-hero);
  object-fit:cover;
}
.page-resequenced main .editorial-hero-media figcaption{
  padding:var(--ice-space-4) var(--ice-space-5) var(--ice-space-5);
  background:var(--course-surface);
  color:var(--course-ink);
  font-size:var(--ice-type-body-size);
  font-weight:500;
  line-height:var(--ice-type-leading-145);
}
.page-resequenced main .lineart{display:none}

.page-resequenced main .trust-strip{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-6);
  margin:0;
  padding:var(--ice-space-fluid-28-44) var(--gutter);
  background:var(--course-surface);
}
.page-resequenced main .trust-strip>div{
  padding:var(--ice-space-0) var(--ice-space-0) var(--ice-space-0) var(--ice-space-4);
  border:0;
  border-left:var(--ice-rule-width-active) solid var(--terracotta);
}
.page-resequenced main .trust-strip b{
  font-family:var(--ice-font-primary);
  font-size:var(--ice-type-body-size);
  font-weight:600;
  line-height:var(--ice-type-leading-125);
}
.page-resequenced main .trust-strip span{
  margin-top:var(--ice-space-1);
  font-size:var(--ice-type-caption-size);
  line-height:var(--ice-type-caption-line);
}

.page-resequenced main>section:not(.hero):not(.course-hero):not(.statement):not(.career-band):not(.course-apply){
  padding:var(--ice-space-fluid-64-104) var(--ice-space-0);
}
.page-resequenced main .band{background:var(--course-tint)}
.page-resequenced main .sec-head{
  max-width:var(--ice-measure-heading);
  margin-bottom:var(--ice-space-fluid-36-56);
}
.page-resequenced main .sec-head .label{
  margin-bottom:var(--ice-space-4);
  color:var(--ice-color-text-accent);
  font-size:var(--ice-type-label-size);
  font-weight:600;
  letter-spacing:var(--ice-type-label-track);
  line-height:var(--ice-type-label-line);
}
.page-resequenced main .sec-head h2,
.page-resequenced main .article-body h2{
  color:var(--course-ink);
  font-family:var(--course-display);
  font-size:var(--ice-type-h2-size);
  font-weight:500;
  letter-spacing:var(--ice-type-h2-track);
  line-height:var(--ice-type-h2-line);
}
.page-resequenced main .sec-head h2::after{display:none}
.page-resequenced main .sec-head>p:not(.label){
  max-width:var(--ice-measure-lede);
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-body-line);
}
.page-resequenced main .article-body{max-width:var(--ice-measure-prose-wide)}
.page-resequenced main .article-body p,
.page-resequenced main .article-body li{
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-body-line);
}
.page-resequenced main .editorial-story__body>p:not(.label),
.page-resequenced main .seo-card>p:not(.label),
.page-resequenced main .source-note,
.page-resequenced main .fact-panel li,
.page-resequenced main .scholar p,
.page-resequenced main .job p,
.page-resequenced main .contact-card>p:not(.label){
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-body-line);
}
/* .scholar is a dark navy accent card (site.css) — its body copy keeps the
   light-on-navy color from the base rule instead of the course-copy dark tone above. */
.page-resequenced main .scholar p{
  color:rgba(255,255,255,.8);
}
.page-resequenced main .article-body h3{
  font-size:var(--ice-type-h3-size);
  font-weight:600;
  line-height:var(--ice-type-h3-line);
}
.page-resequenced main .article-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-fluid-48-104);
}
.page-resequenced main .article-aside{position:static}

.page-resequenced main .prog-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:0;
  border-top:var(--ice-rule-width-active) solid var(--course-ink);
}
.page-resequenced main .prog{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-6);
  padding:var(--ice-space-7) var(--ice-space-0);
  border:0;
  border-bottom:var(--ice-rule-width) solid var(--course-rule);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.page-resequenced main .prog:hover{background:var(--course-tint);transform:none}
.page-resequenced main .prog-photo{
  width:100%;
  height:auto;
  aspect-ratio:var(--ice-media-ratio-square);
  object-fit:cover;
}
.page-resequenced main .prog-body{padding:0}
.page-resequenced main .prog .code{
  color:var(--ice-color-text-accent);
  font-size:var(--ice-type-label-size);
  font-weight:600;
  letter-spacing:var(--ice-type-label-track);
}
.page-resequenced main .prog h3{
  font-size:var(--ice-type-h3-size);
  line-height:var(--ice-type-h3-line);
}
.page-resequenced main .prog-body>p:not(.code):not(.go){
  max-width:var(--ice-measure-program-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-body-line);
}
.page-resequenced main .prog .meta{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin-top:var(--ice-space-6);
}
.page-resequenced main .prog .meta>div{
  padding-left:var(--ice-space-4);
  border-left:var(--ice-rule-width) solid var(--course-rule);
}
.page-resequenced main .prog .meta>div:first-child{padding-left:0;border-left:0}
.page-resequenced main .prog .meta b,
.page-resequenced main .prog .meta .stat-val{
  display:block;
  font-family:var(--ice-font-primary);
  font-size:var(--ice-type-h3-size);
  font-weight:600;
}

.page-resequenced main .mini-steps,
.page-resequenced main .steps,
.page-resequenced main .highlights,
.page-resequenced main .notice-list,
.page-resequenced main .job-list,
.page-resequenced main .faq{
  border-top:var(--ice-rule-width-active) solid var(--course-ink);
}
.page-resequenced main .mini-steps>div,
.page-resequenced main .steps>li,
.page-resequenced main .highlights>li,
.page-resequenced main .notice-list>li,
.page-resequenced main .job,
.page-resequenced main .faq>details{
  border-bottom:var(--ice-rule-width) solid var(--course-rule);
}
.page-resequenced main .faq summary{
  min-height:var(--ice-space-18);
  padding:var(--ice-space-5) var(--ice-space-12) var(--ice-space-5) var(--ice-space-0);
  color:var(--course-ink);
  font-size:var(--ice-type-h3-size);
  font-weight:600;
  line-height:var(--ice-type-leading-128);
}
.page-resequenced main .faq details>p{
  max-width:var(--ice-measure-faq);
  padding:var(--ice-space-0) var(--ice-space-12) var(--ice-space-6) var(--ice-space-0);
  color:var(--course-copy);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-leading-160);
}

.page-resequenced main .seo-grid,
.page-resequenced main .editorial-story-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:0;
  border-top:var(--ice-rule-width-active) solid var(--course-ink);
}
.page-resequenced main .seo-card,
.page-resequenced main .editorial-story{
  padding:var(--ice-space-7) var(--ice-space-0);
  border:0;
  border-bottom:var(--ice-rule-width) solid var(--course-rule);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.page-resequenced main .seo-card:hover{transform:none;background:var(--course-tint)}
.page-resequenced main .editorial-story img{
  width:100%;
  aspect-ratio:var(--ice-media-ratio-square);
  object-fit:cover;
}
.page-resequenced main .seo-card h3,
.page-resequenced main .editorial-story h3{
  font-size:var(--ice-type-h4-size);
  line-height:var(--ice-type-h4-line);
}

/* Embedded story grid (about #overview): when a card grid sits inside an
   article-body reading column (~68ch / 762px), the section's fixed 3-column
   rule crams three tracks into that measure — ~210px cards whose body text
   wraps to 5 skinny lines. Inside the reading column, let the grid pick its
   column count from the space available (auto-fit, min 240px), so it settles to
   2 wider cards that stay edge-aligned with the prose above. Standalone story
   grids elsewhere keep the full 3-up section treatment. */
.page-resequenced main .article-body > .editorial-story-grid{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}

.page-resequenced main .cta-banner{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ice-space-8);
  padding:var(--ice-space-fluid-48-80);
  border:0;
  border-radius:0;
  background:var(--ice-color-surface-brand);
  color:var(--ice-color-on-surface-brand);
  box-shadow:none;
}
.page-resequenced main .cta-banner h3{
  max-width:var(--ice-measure-apply-heading);
  color:var(--ice-color-on-surface-brand);
  font-family:var(--course-display);
  font-size:var(--ice-type-h2-size);
  font-weight:500;
  letter-spacing:var(--ice-type-h2-track);
  line-height:var(--ice-type-h2-line);
}
.page-resequenced main .cta-banner p{
  max-width:var(--ice-measure-course-copy);
  color:var(--ice-color-on-surface-brand);
  font-size:var(--ice-type-body-size);
  line-height:var(--ice-type-body-line);
}
.page-resequenced main .cta-banner .btn-primary{
  background:var(--ice-color-action);
  color:var(--ice-color-on-action);
  box-shadow:none;
}
.page-resequenced main .cta-banner .btn-primary:hover{
  background:var(--ice-color-action-hover);
  color:var(--ice-color-on-action-hover);
  box-shadow:none;
}
.page-resequenced main .cta-banner .btn-ghost{
  border-color:var(--ice-color-on-surface-brand);
  color:var(--ice-color-on-surface-brand);
  background:transparent;
}
.page-resequenced main .cta-banner .btn-ghost:hover{
  background:var(--ice-color-on-surface-brand);
  border-color:var(--ice-color-on-surface-brand);
  color:var(--ice-color-surface-brand);
}

.page-resequenced main .contact-sec{
  position:relative;
  background:var(--navy-deep);
  color:#fff;
}
.page-resequenced main .contact-sec .sec-head h2{color:#fff}
.page-resequenced main .contact-sec .sec-head>p:not(.label){color:rgba(255,255,255,.76)}
.page-resequenced main .contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:0;
  border-top:var(--ice-rule-width-active) solid rgba(255,255,255,.7);
}
.page-resequenced main .contact-card{
  padding:var(--ice-space-6) var(--ice-space-0);
  border:0;
  border-bottom:var(--ice-rule-width) solid rgba(255,255,255,.24);
  background:transparent;
}
.page-resequenced main .contact-sec .contact-card>p:not(.label){color:rgba(255,255,255,.76)}

@media(min-width:640px){
  .page-resequenced main .trust-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-resequenced main .seo-grid,
  .page-resequenced main .editorial-story-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(min-width:768px){
  .page-resequenced main .page-hero{padding-top:var(--ice-hero-pad-top-tablet);padding-bottom:var(--ice-space-16)}
  .page-resequenced main .page-hero-grid:has(.editorial-hero-media){
    grid-template-areas:"media copy";
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--ice-gap-grid-large);
  }
  .page-resequenced main .page-hero-grid:has(.editorial-hero-media)>div:first-child{grid-area:copy}
  .page-resequenced main .page-hero-grid:has(.editorial-hero-media)>.editorial-hero-media{grid-area:media}
  .page-resequenced main .editorial-hero-media picture{width:100%;margin-inline:0}
  .page-resequenced main .trust-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .page-resequenced main .article-layout{grid-template-columns:minmax(0,7fr) minmax(280px,5fr)}
  .page-resequenced main .article-aside{position:sticky;top:var(--ice-media-sticky-offset);align-self:start}
  .page-resequenced main .prog{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--ice-space-fluid-48-104);align-items:center}
  .page-resequenced main .seo-grid,
  .page-resequenced main .editorial-story-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .page-resequenced main .seo-card,
  .page-resequenced main .editorial-story{padding:var(--ice-space-8)}
  .page-resequenced main .cta-banner{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:end}
  .page-resequenced main .contact-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .page-resequenced main .contact-card{padding:var(--ice-space-6);border-right:var(--ice-rule-width) solid rgba(255,255,255,.24)}
  .page-resequenced main .contact-card:last-child{border-right:0}
}

@media(min-width:1024px){
  .page-resequenced main .page-hero .facts{grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
  .page-resequenced main .page-hero .facts>div{padding-left:var(--ice-space-5);border-left:var(--ice-rule-width) solid rgba(255,255,255,.3)}
  .page-resequenced main .page-hero .facts>div:first-child{padding-left:0;border-left:0}
  .page-resequenced main .trust-strip{grid-template-columns:repeat(4,minmax(0,1fr))}
}

@media(min-width:1181px){
  .page-resequenced main .page-hero{padding-top:var(--ice-hero-pad-top-wide)}
}

@media(min-width:1280px){
  .page-resequenced main .page-hero-grid:has(.editorial-hero-media){grid-template-columns:minmax(0,6.3fr) minmax(0,5.7fr)}
}

/* ---------- 22 · Academic Course Hero Overrides ---------- */
.page-hero-panel main .course-hero {
  background: transparent !important;
  padding: 0 !important;
}

/* Hide the broken cyan line progress bar rule at bottom */
.page-hero-panel main .course-hero::after {
  display: none !important;
}

/* Full-bleed background color split zone - reserve header height top offset */
.course-hero-wrapper {
  padding-top: 156px !important; /* Reserves header height + 48px content offset in document flow */
  background: linear-gradient(to bottom, #0E1647 480px, #ffffff 480px) !important; /* Navy region ends at 480px to align heights exactly */
}

html[data-theme="dark"] .course-hero-wrapper {
  background: linear-gradient(to bottom, #0E1647 480px, #181F4D 480px) !important;
}

/* Tight editorial composition: the hero is a contained, centered block — the
   480px media snug against the text column, which fills the capped width so
   there is no stray right-hand whitespace. Centred within the full-width page. */
@media(min-width: 1024px) {
  .page-hero-panel main .wrap.course-hero-grid {
    max-width: 1240px !important;
    width: 100% !important;
    margin-inline: auto !important; /* centre the composed hero in the full-width page */
    display: grid !important;
    grid-template-columns: minmax(0, 480px) minmax(0, 1fr) !important; /* media = its 480px, text fills the rest of the capped width */
    column-gap: 56px !important; /* snug editorial gap */
    align-items: start !important;
  }
}

/* Flat Hero Media - spans both rows of the single grid (no boxed card look!) */
.page-hero-panel main .course-hero__media {
  position: relative !important;
  background: transparent !important; /* Visual flatness: no card background */
  padding: 0 !important; /* Visual flatness: no frame padding */
  border: none !important; /* Visual flatness: no border */
  border-radius: 4px !important;
  box-shadow: none !important; /* Visual flatness: no shadows */
  transform: none !important;
  max-width: 480px !important; /* Visual authority: matches left column width */
  justify-self: start !important;
  align-self: start !important; /* Aligns gallery top with breadcrumb top */
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important; /* Stable flow, no arbitrary negative margins needed */
  z-index: 10 !important;
}

@media(min-width: 1024px) {
  .page-hero-panel main .course-hero__media {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important; /* Stable grid overhang span */
  }
}

/* Specific Dark Theme Containment for Image Card - flat styling */
html[data-theme="dark"] .page-hero-panel main .course-hero__media {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.page-hero-panel main .course-hero__media picture {
  display: block !important;
  overflow: hidden !important;
  position: relative !important;
  aspect-ratio: 1/1.06 !important; /* Taller editorial aspect ratio to balance height */
  border-radius: 4px !important;
}

.page-hero-panel main .course-hero__media picture img,
.page-hero-panel main .course-hero__media img {
  aspect-ratio: 1/1.06 !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 4px !important; /* Matching internal border-radius */
  width: 100% !important;
  height: auto !important;
}

/* Per-photo crop tuning for the civil materials-testing hero image only */
.page-civil main .course-hero__media picture img,
.page-civil main .course-hero__media img {
  object-position: center 36% !important; /* Move crop down to completely hide the roof clutter */
  transform: scale(1.45) !important; /* Zoom in 45% to focus tightly on students and machine */
  transform-origin: 50% 36% !important; /* Focus tightly on students and testing machine */
  filter: contrast(1.04) brightness(0.93) saturate(0.80) !important; /* Mute concrete highlights and tone down orange focal dominance */
}

/* Badge overlay top-left */
.page-hero-panel .course-hero__badge {
  position: absolute;
  top: 18px;
  left: 18px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  /* Was `#5EEAD4` on `#0E1647` — a mint green and a navy that exist nowhere in
     the ICE palette, hard-coded in both themes. Five literals of that mint were
     the only off-system colour left on /about, /careers, /campus-location and
     /courses; all five now read brand roles, which also gives them the
     dark-mode tint they never had. This pill matches `.pf-id__flag`. */
  background: var(--crimson);
  color: var(--accent-ink);
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: 4px;
  box-shadow: none !important;
}

/* Quiet thumbnail strip below image (no border layout/extra white space) */
.page-hero-panel .course-hero__media-controls {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: 12px !important;
  padding: 0 !important; /* No extra padding whitespace */
}

.page-hero-panel .course-hero__thumbnails {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

.page-hero-panel .course-hero__thumbnails::-webkit-scrollbar {
  display: none !important;
}

.page-hero-panel .course-hero__thumbnails .thumbnail {
  width: 36px !important; /* Tiny, minimal, quiet thumbnails */
  height: 36px !important;
  border-radius: 2px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  cursor: pointer !important;
  opacity: 0.6 !important;
  transition: all 0.2s ease;
}

.page-hero-panel .course-hero__thumbnails .thumbnail.is-active,
.page-hero-panel .course-hero__thumbnails .thumbnail:hover {
  border-color: var(--terracotta) !important; /* Active thumbnail */
  opacity: 1 !important;
}

.page-hero-panel .course-hero__thumbnails img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Right Column Spacing & Copy layout - no stretching, natural top-aligned vertical flow */
.page-hero-panel main .course-hero__copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: start !important;
  align-self: start !important;
  gap: 0 !important;
  padding-bottom: 0 !important;
}

/* scroll margin top to accommodate sticky header */
.page-hero-panel main section[id] {
  scroll-margin-top: 100px !important;
}

/* detailed breadcrumb - muted, single-line navigation context */
.page-hero-panel main .course-breadcrumb {
  margin-bottom: 24px !important; /* Spacing between breadcrumb and category: 24px */
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--ice-color-on-surface-brand) !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
}

.page-hero-panel main .course-breadcrumb a {
  color: var(--ice-color-on-surface-brand) !important;
  text-decoration: none !important;
  transition: color var(--dur-fast) var(--ease);
}

.page-hero-panel main .course-breadcrumb a:hover {
  color: #fff !important;
}

.page-hero-panel main .course-breadcrumb span:not(.breadcrumb-sep) {
  color: var(--ice-color-on-surface-brand) !important;
}

.page-hero-panel main .course-breadcrumb .breadcrumb-sep {
  margin: 0 6px !important;
  color: rgba(255, 255, 255, 0.2) !important;
  font-size: 13px !important;
  font-weight: normal !important;
}

/* Small caps category label - uppercase, tracked, medium weight */
.page-hero-panel .course-category {
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important; /* Medium weight, not bold */
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.65) !important;
  margin: 0 0 18px 0 !important; /* Category to title gap: 16-20px (18px) */
}

/* Dominant serif page title - large & elegant visual hierarchy */
.page-hero-panel main .course-hero h1 {
  font-family: var(--ice-font-primary) !important;
  font-size: clamp(32px, 3.8vw, 44px) !important;
  line-height: 1.2 !important;
  font-weight: 500 !important;
  color: #fff !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 0 !important;
}

@media(min-width: 1024px) {
  .page-hero-panel main .course-hero h1 {
    font-size: 52px !important; /* Scaled to 52px to prevent awkward wrapping on narrower viewports */
    line-height: 1.15 !important;
  }
}

.page-hero-panel main .course-hero h1 span {
  color: inherit !important;
}

/* Right column container - top row (navy background) */
.page-hero-panel main .course-hero__info {
  display: flex !important;
  flex-direction: column !important;
  justify-content: start !important;
}

@media(min-width: 1024px) {
  .page-hero-panel main .course-hero__info {
    height: 320px !important; /* Navy height fits exactly into the 480px background split point */
    padding-top: 24px !important; /* Compressed padding for visual hierarchy */
    padding-bottom: 20px !important;
    box-sizing: border-box !important;
  }
}

/* Controlled top gaps between copy segments */
body.page-course.page-hero-panel main .course-facts {
  margin-top: 28px !important; /* Title to statistics: 28px gap */
  display: grid !important;
  grid-template-columns: 1fr 1fr !important; /* Collapsed on mobile */
  gap: 24px !important; /* More horizontal air between columns */
  border: none !important;
  padding: 0 !important;
}

@media(min-width: 768px) {
  body.page-course.page-hero-panel main .course-facts {
    grid-template-columns: 1fr 1.2fr 1.2fr 1.2fr !important; /* Single horizontal sequence on desktop */
  }
}

body.page-course.page-hero-panel main .course-facts div {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important; /* controlled vertical rhythm label-to-value */
  padding: 0 0 0 20px !important; /* Slightly more padding for horizontal air */
  border-left: 1px solid rgba(255, 255, 255, 0.08) !important; /* quiet separator */
}

body.page-course.page-hero-panel main .course-facts div:nth-child(n) {
  padding-left: 20px !important;
  border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.page-course.page-hero-panel main .course-facts div:first-child {
  padding-left: 0 !important;
  border-left: none !important;
}

/* Small caps label for statistics - refined size & contrast */
body.page-course.page-hero-panel main .course-facts dt {
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important; /* Medium weight instead of heavy bold */
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.65) !important; /* Muted contrast */
  margin-bottom: 0 !important;
}

/* Statistics values - reduced to let the page title dominate */
body.page-course.page-hero-panel main .course-facts dd {
  font-family: var(--sans) !important;
  font-size: 26px !important; /* Quieter values to keep title dominant (25-28px) */
  font-weight: 500 !important; /* medium weight instead of heavy bold */
  line-height: 1.15 !important;
  color: #fff !important;
}

.page-hero-panel .hero-action-group {
  margin-top: 36px !important; /* Statistics to form: 36px */
}

/* Dropdown styling */
.page-hero-panel .course-selectors {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 20px !important; /* Generous side gap */
  margin-top: 28px !important; /* Statistics to form gap: 28px */
  margin-bottom: 0 !important;
}

.page-hero-panel .selector-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important; /* Added more breathing room from label to field: 8px */
}

.page-hero-panel .selector-group label {
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important; /* Medium weight instead of heavy bold */
  letter-spacing: 0.05em !important;
  color: rgba(255, 255, 255, 0.65) !important;
}

/* Pale cool interactive fields in light mode, translucent in dark mode */
.page-hero-panel .select-wrapper {
  position: relative !important;
  background: #ffffff !important; /* Pure white select surface */
  border-radius: 4px !important;
  overflow: hidden !important;
  border: 1px solid rgba(14, 22, 71, 0.08) !important; /* Quieter border contrast for flat appearance */
  transition: border-color var(--dur-fast) var(--ease) !important;
}

.page-hero-panel .select-wrapper:hover {
  border-color: rgba(14, 22, 71, 0.2) !important;
}

html[data-theme="dark"] .page-hero-panel .select-wrapper {
  background: rgba(255, 255, 255, 0.12) !important; /* Elevated surface to prevent merging with dark background */
  border: 1px solid rgba(255, 255, 255, 0.25) !important; /* Stronger border contrast */
}

html[data-theme="dark"] .page-hero-panel .select-wrapper:hover {
  border-color: rgba(255, 255, 255, 0.5) !important;
}

.page-hero-panel .select-wrapper select {
  width: 100% !important;
  padding: 19px 24px !important; /* Increased padding to hit exactly ~56-62px height: 60px */
  font-family: var(--sans) !important;
  font-size: 15.5px !important; /* Enlarged text size for calm and deliberate read */
  font-weight: 500 !important; /* Medium weight instead of shouting bold */
  color: #0E1647 !important; /* Dark navy text in light mode */
  border: none !important;
  background: transparent !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  cursor: pointer !important;
  outline: none !important;
  position: relative !important;
  z-index: 1 !important;
}

html[data-theme="dark"] .page-hero-panel .select-wrapper select {
  color: #fff !important; /* White text in dark mode */
}

.page-hero-panel .select-wrapper::after {
  content: "" !important;
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-25%) !important;
  border-left: 5px solid transparent !important;
  border-right: 5px solid transparent !important;
  border-top: 5px solid #0E1647 !important; /* Navy arrow in light mode */
  pointer-events: none !important;
  display: block !important;
  z-index: 2 !important;
}

html[data-theme="dark"] .page-hero-panel .select-wrapper::after {
  border-top: 5px solid #fff !important; /* White arrow in dark mode */
}

/* Actions - Form to actions: 24px */
.page-hero-panel main .course-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 20px !important;
  margin-top: 24px !important;
}


.page-hero-panel main .course-action--primary {
  padding: 12px 24px !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  border-radius: 4px !important;
  background: var(--ice-color-action) !important;
  border: 2px solid var(--ice-color-action) !important;
  color: var(--ice-color-on-action) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all var(--dur-fast) var(--ease) !important;
}

.page-hero-panel main .course-action--primary:hover {
  background: var(--ice-color-action-hover) !important;
  border-color: var(--ice-color-action-hover) !important;
  color: var(--ice-color-on-action-hover) !important;
}

.page-hero-panel main .course-action--primary::before {
  display: none !important;
}

.course-hero__actions-copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

@media(min-width: 1024px) {
  .course-hero__actions-copy {
    grid-column: 2 !important;
    grid-row: 2 !important; /* Row 2 grid alignment */
    padding-top: 24px !important; /* Dense academic spacing */
    padding-bottom: 40px !important; /* Terminates columns at identical height */
    box-sizing: border-box !important;
  }
}

/* Actions styling on Light Background in Light Mode, Dark Navy in Dark Mode */
.page-hero-panel main .course-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important; /* locked baseline horizontal alignment */
  gap: 28px !important; /* Breathing room for actions */
  margin-top: 20px !important; /* separates selectors from actions */
}

.page-hero-panel main .course-action--primary {
  min-height: 48px !important; /* premium standard height */
  padding: 0 28px !important; /* premium spacing (important, not oversized) */
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  border-radius: 4px !important;
  background: var(--ice-color-action) !important;
  border: 2px solid var(--ice-color-action) !important;
  color: var(--ice-color-on-action) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all var(--dur-fast) var(--ease) !important;
}

.page-hero-panel main .course-action--primary:hover {
  background: var(--ice-color-action-hover) !important;
  border-color: var(--ice-color-action-hover) !important;
  color: var(--ice-color-on-action-hover) !important;
}

.page-hero-panel main .course-action--primary::before {
  display: none !important;
}

.page-hero-panel main .course-action--link {
  font-family: var(--sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important; /* Muted nav link weight */
  color: var(--ice-color-on-surface) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important; /* flat clean appearance */
  border-bottom: 1px solid currentColor !important; /* elegant underline replacement */
  padding-bottom: 3px !important; /* breathing spacing from text to line */
}

.page-hero-panel main .course-action--link:hover {
  color: var(--ice-color-text-accent) !important;
  border-bottom-color: transparent !important;
}

/* Horizontal divider inside Section 2 - Restrained elegant style */
.course-actions-divider {
  border: none !important;
  border-top: 1px solid rgba(14, 22, 71, 0.04) !important; /* Muted elegant hairline */
  margin: 28px 0 !important; /* Spacing from CTA to divider: 28px */
}

html[data-theme="dark"] .course-actions-divider {
  border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
}

/* Promo Text Callout in Section 2 actions copying */
/* The 3px terracotta rail came off on 2026-08-22 — the stock callout tell, which
   the craft floor names outright. The indent stays and the accent moves onto the
   `<strong>` lead-in instead, so the block still reads as a note.

   Worth knowing before editing this: this rule is NOT what paints on the three
   pages that render `.course-promo-block`. /about, /careers and
   /campus-location all carry `page-info-redesign`, and
   compact-info-v1.css:250 restates the whole block and wins. Both copies were
   corrected together; change one and you have to change the other. */
.page-hero-panel .course-promo-block {
  margin-top: 0 !important;
  padding: 2px 0 0 !important;
  max-width: 580px !important; /* Constrained to readable content width */
}

.page-hero-panel .course-promo-block strong {
  color: var(--terracotta) !important;
  font-weight: 700 !important;
}

.page-hero-panel .course-promo-block p {
  font-family: var(--sans) !important;
  font-size: 18px !important; /* Larger normal body/lead-copy size */
  font-weight: 400 !important; /* Regular weight instead of shouting bold */
  line-height: 1.80 !important; /* Comfortable line height */
  color: #4A5568 !important; /* Clean charcoal text on white background */
  margin: 0 !important;
}

html[data-theme="dark"] .page-hero-panel .course-promo-block p {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* Section 3: Quote Section transition, spacing and theme colors - flow seamlessly to white background */
.page-hero-panel main .course-hero-quote {
  background: #ffffff !important; /* Pure white background to flow seamlessly */
  padding: 48px 0 80px 0 !important; /* Generous breathing room gap */
  border-top: none !important; /* Removes harsh top border */
}

html[data-theme="dark"] .page-hero-panel main .course-hero-quote {
  background: #181F4D !important; /* Cohesive deep slate navy transition in dark mode */
  border-top: none !important;
}

.page-hero-panel main .course-hero-quote blockquote {
  font-size: 26px !important; /* Quieter display headline */
  line-height: 1.45 !important;
  font-weight: 500 !important;
  color: #0E1647 !important;
}

html[data-theme="dark"] .page-hero-panel main .course-hero-quote blockquote {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* ==========================================================================
   GLOBAL REFINED PROGRAM PAGES STYLE TUNING (SITE-WIDE CONSISTENCY)
   distributes visual rhythm, spacing, breadcrumbs, typography, facts and
   quote styles across B.E. Computer (BCT) and B.E. Electronics (BEI) pages.
   ========================================================================== */

/* Breathing space under the fixed header nav */
@media(min-width: 1024px) {
  .page-course main .course-hero {
    padding-top: 156px !important; /* Unified breathing space below header nav */
  }

  /* ...except where the header is an OVERLAY, and so is not in the flow at all.
     A solid-header course page gets 156px of breathing room under a header that
     has already taken its own space. An overlay page gets 156px to clear a
     header that is 195px tall, and prints its first line 39px inside it. That is
     what /404 has been doing at every width above 1024px: the "Home / Error 404"
     breadcrumb rendered behind the identity ribbon.

     156px was right for the header of the day. --nav-h is the header's own sum
     of its own four rows, so this cannot drift the same way again.

     Scoped to the overlay case deliberately. Every solid .page-course page keeps
     its 156px and does not move — /404 is the only overlay page in the site that
     uses .course-hero, which is measured, not assumed. */
  body.page-course.site-header-overlay main .course-hero {
    padding-top: calc(var(--nav-h) + var(--ice-space-12)) !important;
  }
}

/* Breadcrumbs typography & spacing */
.page-course main .course-breadcrumb {
  margin-bottom: 24px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--ice-color-on-surface-brand) !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
}

.page-course main .course-breadcrumb a {
  color: var(--ice-color-on-surface-brand) !important;
  text-decoration: none !important;
}

.page-course main .course-breadcrumb a:hover {
  color: #fff !important;
}

.page-course main .course-breadcrumb span {
  color: var(--ice-color-on-surface-brand) !important;
  margin: 0 6px !important;
}

/* Eyebrow kicker text spacing */
.page-course .course-eyebrow {
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.65) !important;
  margin: 0 0 18px 0 !important; /* Category to title gap: 18px */
}

/* Page Title typography overrides */
.page-course main .course-hero h1 {
  font-size: 52px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
  color: #fff !important;
  margin-bottom: 28px !important;
}

.page-course main .course-hero h1 span {
  font-weight: 300 !important;
  opacity: 0.6 !important;
}

/* Facts row layout gaps and quiet border dividers */
body.page-course main .course-facts {
  margin-top: 28px !important; /* Title to stats: 28px */
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important; /* Elegant horizontal air */
  border: none !important;
  padding: 0 !important;
}

@media(min-width: 768px) {
  body.page-course main .course-facts {
    grid-template-columns: 1fr 1.2fr 1.2fr 1.2fr !important; /* Single row flow */
  }
}

body.page-course main .course-facts div {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 0 0 0 20px !important; /* horizontal spacing air */
  border-left: 1px solid rgba(255, 255, 255, 0.08) !important; /* elegant line */
}

body.page-course main .course-facts div:first-child {
  padding-left: 0 !important;
  border-left: none !important;
}

body.page-course main .course-facts dt {
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.65) !important;
  margin-bottom: 0 !important;
}

body.page-course main .course-facts dd {
  font-family: var(--sans) !important;
  font-size: 26px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  color: #fff !important;
}

/* Intake information block divider & spacing */
.page-course main .course-intake {
  display: flex !important;
  gap: 32px !important;
  margin-top: 28px !important;
  padding-top: 20px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important; /* quiet separator */
}

.page-course main .course-intake div {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.page-course main .course-intake span {
  font-family: var(--sans) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: rgba(255, 255, 255, 0.65) !important;
  font-weight: 500 !important;
}

.page-course main .course-intake strong {
  font-family: var(--sans) !important;
  font-size: 16px !important;
  color: #fff !important;
  font-weight: 500 !important;
}

/* Actions block spacing & alignments */
.page-course main .course-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important; /* baseline alignment */
  gap: 28px !important;
  margin-top: 32px !important; /* separated space under content */
}

.page-course main .course-action--primary {
  min-height: 48px !important;
  padding: 0 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  border-radius: 4px !important;
  background: var(--ice-color-action) !important;
  border: 2px solid var(--ice-color-action) !important;
  color: var(--ice-color-on-action) !important;
  transition: all var(--dur-fast) var(--ease) !important;
}

.page-course main .course-action--primary:hover {
  background: var(--ice-color-action-hover) !important;
  border-color: var(--ice-color-action-hover) !important;
  color: var(--ice-color-on-action-hover) !important;
}

.page-course main .course-action--link {
  font-family: var(--sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--ice-color-on-surface) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor !important; /* clean bottom underline */
  padding-bottom: 3px !important;
}

.page-course main .course-action--link:hover {
  color: var(--ice-color-text-accent) !important;
  border-bottom-color: transparent !important;
}

/* Quote Section Flow: seamless background split zone with thin turquoise rule */
.page-course main .course-hero-quote {
  background: #ffffff !important; /* Pure white background to flow seamlessly */
  padding: 48px 0 80px 0 !important; /* Generous breathing room gap */
  border-top: none !important;
}

html[data-theme="dark"] .page-course main .course-hero-quote {
  background: #181F4D !important; /* Cohesive deep slate navy in dark mode */
  border-top: none !important;
}

.page-course main .course-hero-quote blockquote {
  font-family: var(--ice-font-primary) !important;
  font-size: 26px !important;
  line-height: 1.45 !important;
  font-weight: 500 !important;
  color: #0E1647 !important;
  /* A rule down the left of a quotation is the oldest typographic convention
     there is, and a blockquote is none of the shapes the side-tab rule scopes
     itself to: cards, list items, callouts, alerts. The sibling callout at
     .course-promo-block DID match it and had its rail removed on 2026-08-22;
     this one is kept on purpose. */
  /* impeccable-disable-next-line side-tab: blockquote, see above */
  border-left: 3px solid var(--terracotta) !important;
  padding: 6px 0 6px 20px !important;
  margin: 0 !important;
}

html[data-theme="dark"] .page-course main .course-hero-quote blockquote {
  color: rgba(255, 255, 255, 0.9) !important;
}

.page-course main .course-hero-quote blockquote em {
  font-weight: 400 !important;
  color: #4A5568 !important;
}

html[data-theme="dark"] .page-course main .course-hero-quote blockquote em {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* ==========================================================================
   MULTI-LINE TITLE COMPENSATION — reusable line-count hooks
   The navy/white hero split (480px) and the fixed info-zone height (320px) are
   tuned on the civil reference for a ONE-line H1. Longer titles wrap and push
   the facts row (and selectors, where present) past the seam — white-on-white
   facts, selectors overlapping the actions row. Add `hero-lines-2` or
   `hero-lines-3` to the body of any panel page whose H1 wraps to 2 or 3 lines
   at desktop: it shifts the seam + info height by exactly one/two H1
   line-heights (60px/120px) so every element keeps civil's offset from the
   seam. Desktop grid only — below 1024px all panel pages share identical
   (stacked, solid-navy) behavior. Civil (1 line) needs no class.
   ========================================================================== */
@media(min-width: 1024px) {
  .hero-lines-2 .course-hero-wrapper {
    background: linear-gradient(to bottom, #0E1647 540px, #ffffff 540px) !important;
  }
  html[data-theme="dark"] .hero-lines-2 .course-hero-wrapper {
    background: linear-gradient(to bottom, #0E1647 540px, #181F4D 540px) !important;
  }
  .hero-lines-2 main .course-hero__info {
    height: 380px !important;
  }
  .hero-lines-3 .course-hero-wrapper {
    background: linear-gradient(to bottom, #0E1647 600px, #ffffff 600px) !important;
  }
  html[data-theme="dark"] .hero-lines-3 .course-hero-wrapper {
    background: linear-gradient(to bottom, #0E1647 600px, #181F4D 600px) !important;
  }
  .hero-lines-3 main .course-hero__info {
    height: 440px !important;
  }
  .hero-lines-4 .course-hero-wrapper {
    background: linear-gradient(to bottom, #0E1647 660px, #ffffff 660px) !important;
  }
  html[data-theme="dark"] .hero-lines-4 .course-hero-wrapper {
    background: linear-gradient(to bottom, #0E1647 660px, #181F4D 660px) !important;
  }
  .hero-lines-4 main .course-hero__info {
    height: 500px !important;
  }
}

/* ==========================================================================
   MOBILE/TABLET HERO CONTRAST REPAIR (<1024px) — all three course pages
   Below the desktop grid the hero stacks (media → info → actions), so the
   fixed 480px gradient stop cannot track content height: the white-text
   breadcrumb/category/H1/facts were landing on the white zone (invisible)
   on every course page, civil included. Solid navy field behind the stack;
   the actions/promo zone paints its own light surface edge-to-edge via
   box-shadow spread + clip-path (paint-only — no horizontal overflow).
   ========================================================================== */
@media(max-width: 1023.98px) {
  .page-hero-panel .course-hero-wrapper {
    background: #0E1647 !important;
  }
  html[data-theme="dark"] .page-hero-panel .course-hero-wrapper {
    background: #0E1647 !important;
  }
  .page-hero-panel .course-hero__actions-copy {
    background: var(--ice-color-surface) !important;
    color: var(--ice-color-on-surface) !important;
    box-shadow: 0 0 0 100vmax var(--ice-color-surface) !important;
    clip-path: inset(0 -100vmax) !important;
    margin-top: 28px !important;
    padding-top: 24px !important;
    padding-bottom: 8px !important;
  }
}

/* ==========================================================================
   HEADER-CLEARANCE FIX — course panel pages (civil / computer / electronics)
   Two defects from the wrapper redesign, both visible as header spacing bugs:
   (1) DESKTOP double header-reserve. The panel wraps the hero in
       .course-hero-wrapper (padding-top:156px) to clear the position:absolute
       header, but the global ".page-course main .course-hero{padding-top:156px}"
       rule (loaded later, same specificity, also !important) still wins the tie
       on the SECTION — a second 156px stacks, so content starts at 312px while
       the header ends at ~117px: ~195px of empty navy under the header. Zero the
       section padding so ONLY the wrapper reserves. The wrapper must keep top:0
       (its navy gradient paints behind the transparent header); zeroing the
       section — not the wrapper — is what lets it rise. Panel seam geometry is
       unaffected: hero content and the navy seam shift up 156px together.
   (2) MOBILE cramp. The fixed 156px reserve ignores the +30px TU ribbon that
       only shows below 1024px, leaving ~5px clearance vs ~31px sitewide. Reserve
       header + ~35px on the wrapper below the desktop grid.
   ========================================================================== */
@media(min-width: 1024px) {
  body.page-course.page-hero-panel main .course-hero {
    padding-top: 0 !important;
  }
}
@media(max-width: 1023.98px) {
  .page-hero-panel .course-hero-wrapper {
    padding-top: 186px !important;
  }
}

/* Compact overrides for guides using the resequenced landing layout */
.page-guide.page-resequenced main .article-layout {
  gap: clamp(32px, 5vw, 64px);
}
@media(min-width: 768px) {
  .page-guide.page-resequenced main .article-layout {
    grid-template-columns: minmax(0,1fr) 320px;
  }
}
.page-guide.page-resequenced main .article-body h2 {
  font-size: var(--ice-type-h3-size);
}
.page-guide.page-resequenced main .article-body h3 {
  font-size: var(--ice-type-h4-size);
}
.page-guide.page-resequenced main .course-hero {
  padding-bottom: var(--ice-space-6);
}
.page-guide.page-resequenced main .faq summary {
  min-height: auto;
  padding: var(--ice-space-4) var(--ice-space-8) var(--ice-space-4) var(--ice-space-0);
  font-size: var(--ice-type-h4-size);
}

/* Flat guide articles use this shared breadcrumb outside a dark course hero.
   The older global course rule above forces a white hero colour with
   `!important`, so this solid-header exception deliberately overrides it at
   the end of the cascade with theme-aware canvas text. */
body.site-header-solid.page-guide main .article-body > .course-breadcrumb,
body.site-header-solid.page-guide main .article-body > .course-breadcrumb a,
body.site-header-solid.page-guide main .article-body > .course-breadcrumb span {
  color: var(--ice-color-text-muted) !important;
}

body.site-header-solid.page-guide main .article-body > .course-breadcrumb a:hover {
  color: var(--ice-color-text) !important;
}