/* Two Clouds Software — warm graphite + amber. Split layouts, banded catalogue. */

:root{
  --paper:      #FBFAF7;
  --paper-2:    #F3F1EA;
  --paper-3:    #EAE7DD;
  --ink:        #14130F;
  --ink-2:      #43413A;
  --ink-3:      #5F5C52;
  --line:       #E2DFD6;
  --line-soft:  #EDEBE3;

  --brand:      #B4530A;
  --brand-deep: #8C3F06;
  --brand-soft: #FBEEE0;
  --brand-line: #F0D9BF;

  --on-dark:    #F6F4EF;
  --on-dark-2:  rgba(246,244,239,.80);
  --on-dark-3:  rgba(246,244,239,.62);
  --line-dark:  rgba(246,244,239,.16);

  --ok: #1D6B43;

  --shell: 1180px;
  --gutter: 22px;
  --r:   16px;
  --r-s: 10px;
  --r-l: 24px;

  --sans:    'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --display: 'Sora', 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
  --mono:    'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --shadow:   0 1px 2px rgba(20,19,15,.05), 0 8px 24px rgba(20,19,15,.06);
  --shadow-l: 0 2px 6px rgba(20,19,15,.06), 0 24px 60px rgba(20,19,15,.10);
}

*,*::before,*::after{ box-sizing:border-box }
html{ -webkit-text-size-adjust:100%; overflow-x:clip }
/* the hero photo bleeds to the viewport edge with calc(50% - 50vw); 50vw counts
   the scrollbar, so clip the overflow rather than let the page scroll sideways */
body{ overflow-x:clip }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:16.5px; line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block }
a{ color:var(--brand-deep) }
h1,h2,h3,h4{ font-family:var(--display); font-weight:600; line-height:1.14; letter-spacing:-.018em; margin:0 0 .5em }
h1{ font-size:clamp(2.15rem,4.4vw,3.5rem) }
h2{ font-size:clamp(1.7rem,3vw,2.5rem) }
h3{ font-size:1.2rem; line-height:1.28 }
p{ margin:0 0 1em }
:focus-visible{ outline:3px solid var(--brand); outline-offset:2px; border-radius:4px }

.shell{ width:100%; max-width:var(--shell); margin:0 auto; padding:0 var(--gutter) }
.eyebrow{
  font-family:var(--mono); font-size:.76rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--brand-deep); margin:0 0 .9rem; font-weight:500;
}
.eyebrow--dark{ color:#F0B27A }
.lede{ font-size:1.1rem; color:var(--ink-2); max-width:62ch }
.muted{ color:var(--ink-3); font-size:.94rem }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--sans); font-size:.97rem; font-weight:600; line-height:1;
  padding:.92rem 1.5rem; border-radius:999px; border:1.5px solid transparent;
  cursor:pointer; text-decoration:none; transition:background .16s, color .16s, border-color .16s, transform .12s;
}
.btn:active{ transform:translateY(1px) }
.btn--primary{ background:var(--brand); color:#fff }
.btn--primary:hover{ background:var(--brand-deep) }
.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line) }
.btn--ghost:hover{ border-color:var(--ink-3); background:var(--paper-2) }
.btn--light{ background:var(--on-dark); color:var(--ink) }
.btn--light:hover{ background:#fff }
.btn--outline-light{ background:transparent; color:var(--on-dark); border-color:var(--line-dark) }
.btn--outline-light:hover{ border-color:var(--on-dark-2) }
.btn--sm{ padding:.66rem 1.05rem; font-size:.9rem }
.btn--wide{ width:100% }

/* ---------- header ---------- */
.top{
  position:sticky; top:0; z-index:60; background:rgba(251,250,247,.94);
  backdrop-filter:saturate(160%) blur(10px); border-bottom:1px solid var(--line);
}
.top-in{ display:flex; align-items:center; gap:1.5rem; height:68px }
.brand{ display:flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--ink); flex:0 0 auto }
.brand svg{ display:block }
.brand b{ font-family:var(--display); font-weight:600; font-size:1.02rem; letter-spacing:-.01em }
.nav{ display:flex; gap:1.45rem; margin-left:auto; align-items:center }
.top-in > .cart-link{ margin-left:.4rem }
.nav a:not(.btn){
  text-decoration:none; color:var(--ink-2); font-size:.95rem; font-weight:500;
  padding:.35rem 0; border-bottom:2px solid transparent;
}
.nav a:not(.btn):hover{ color:var(--ink); border-bottom-color:var(--brand) }
.nav a[aria-current="page"]{ color:var(--ink); border-bottom-color:var(--brand) }
.cart-link{
  display:inline-flex; align-items:center; gap:.45rem; text-decoration:none;
  color:var(--ink); font-size:.93rem; font-weight:600;
  border:1.5px solid var(--line); border-radius:999px; padding:.5rem .95rem;
}
.cart-link:hover{ border-color:var(--ink-3) }
.cart-count{
  min-width:20px; height:20px; padding:0 5px; border-radius:999px; background:var(--brand);
  color:#fff; font-size:.72rem; font-family:var(--mono); display:inline-flex;
  align-items:center; justify-content:center;
}
.burger{ display:none; background:none; border:1.5px solid var(--line); border-radius:10px; padding:.5rem .6rem; cursor:pointer }
.burger span{ display:block; width:18px; height:2px; background:var(--ink); margin:3px 0 }

/* ---------- hero: asymmetric split ---------- */
.hero{ border-bottom:1px solid var(--line); background:var(--paper) }
.hero-grid{ display:grid; grid-template-columns:1.08fr .92fr; gap:0; align-items:stretch }
.hero-text{ padding:5.2rem 3.4rem 5.2rem 0 }
.hero h1{ margin-bottom:1.1rem }
.hero h1 em{ font-style:normal; color:var(--brand-deep) }
.hero-actions{ display:flex; flex-wrap:wrap; gap:.7rem; margin:1.9rem 0 2.2rem }
.hero-facts{ display:flex; flex-wrap:wrap; gap:1.6rem 2.4rem; padding-top:1.6rem; border-top:1px solid var(--line) }
.hero-fact{ min-width:120px }
.hero-fact b{ display:block; font-family:var(--display); font-size:1.5rem; line-height:1.1 }
.hero-fact span{ font-size:.86rem; color:var(--ink-3) }
.hero-media{ position:relative; margin-right:calc(50% - 50vw); min-height:520px }
.hero-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.hero-badge{
  position:absolute; left:2rem; bottom:2rem; z-index:2; max-width:290px;
  background:rgba(20,19,15,.90); color:var(--on-dark); border-radius:var(--r);
  padding:1rem 1.15rem; font-size:.9rem; line-height:1.5;
}
.hero-badge b{ display:block; font-family:var(--display); font-size:.98rem; margin-bottom:.2rem }
.hero-badge span{ color:var(--on-dark-2) }

/* ---------- generic sections ---------- */
.band{ padding:5rem 0; border-bottom:1px solid var(--line) }
.band--tint{ background:var(--paper-2) }
.band--dark{ background:var(--ink); color:var(--on-dark); border-bottom-color:var(--ink) }
.band--dark h2,.band--dark h3{ color:var(--on-dark) }
.band--dark p{ color:var(--on-dark-2) }
.band-head{ max-width:66ch; margin-bottom:2.6rem }
.band-head p{ color:var(--ink-2) }
.band--dark .band-head p{ color:var(--on-dark-2) }

/* ---------- fact strip ---------- */
.facts{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:#fff }
.facts > div{ padding:1.6rem 1.4rem; border-right:1px solid var(--line) }
.facts > div:last-child{ border-right:0 }
.facts h3{ font-size:1rem; margin-bottom:.3rem }
.facts p{ margin:0; font-size:.9rem; color:var(--ink-3) }

/* ---------- catalogue: horizontal bands ---------- */
.course{
  display:grid; grid-template-columns:250px 1fr 232px; gap:2rem; align-items:center;
  background:#fff; border:1px solid var(--line); border-radius:var(--r);
  padding:1.15rem; margin-bottom:1.05rem; transition:border-color .16s, box-shadow .16s;
}
.course:hover{ border-color:var(--brand-line); box-shadow:var(--shadow) }
.course-media{ position:relative; border-radius:var(--r-s); overflow:hidden; aspect-ratio:16/11 }
.course-media img{ width:100%; height:100%; object-fit:cover }
.course-kicker{
  position:absolute; top:.6rem; left:.6rem; background:rgba(20,19,15,.90); color:var(--on-dark);
  font-family:var(--mono); font-size:.75rem; letter-spacing:.09em; text-transform:uppercase;
  padding:.32rem .58rem; border-radius:6px;
}
.course-body h3{ margin-bottom:.4rem }
.course-body h3 a{ color:var(--ink); text-decoration:none }
.course-body h3 a:hover{ color:var(--brand-deep) }
.course-body p{ margin:0 0 .8rem; color:var(--ink-2); font-size:.96rem }
.course-meta{ display:flex; flex-wrap:wrap; gap:.45rem }
.chip{
  font-family:var(--mono); font-size:.73rem; letter-spacing:.04em; color:var(--ink-3);
  border:1px solid var(--line); border-radius:999px; padding:.24rem .6rem; background:var(--paper);
}
.course-buy{ border-left:1px solid var(--line-soft); padding-left:1.6rem; align-self:stretch; display:flex; flex-direction:column; justify-content:center }
.price{ font-family:var(--display); font-size:1.85rem; font-weight:600; line-height:1 }
.price-note{ display:block; font-family:var(--sans); font-size:.78rem; color:var(--ink-3); margin-top:.3rem; letter-spacing:0 }
.course-buy form{ margin:.9rem 0 0 }

/* ---------- split feature ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:3.4rem; align-items:center }
.split--flip .split-media{ order:2 }
.split-media img{ border-radius:var(--r); width:100%; height:100%; object-fit:cover; aspect-ratio:4/3 }
.steps{ counter-reset:s; margin:0; padding:0; list-style:none }
.steps li{ counter-increment:s; position:relative; padding:0 0 1.5rem 3.1rem; margin:0 }
.steps li::before{
  content:counter(s,decimal-leading-zero); position:absolute; left:0; top:.05rem;
  font-family:var(--mono); font-size:.8rem; color:var(--brand-deep);
  border:1.5px solid var(--brand-line); border-radius:8px; width:2.1rem; height:2.1rem;
  display:flex; align-items:center; justify-content:center; background:var(--brand-soft);
}
.band--dark .steps li::before{ background:rgba(240,178,122,.14); border-color:rgba(240,178,122,.34); color:#F0B27A }
.steps b{ display:block; font-family:var(--display); font-weight:600; margin-bottom:.15rem }
.steps span{ color:var(--ink-2); font-size:.95rem }
.band--dark .steps span{ color:var(--on-dark-2) }

/* ---------- audience cards ---------- */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem }
.card{ background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column }
.band--dark .card{ background:#1D1B16; border-color:var(--line-dark) }
.card img{ width:100%; aspect-ratio:16/10; object-fit:cover }
.card-in{ padding:1.4rem }
.card-in p{ font-size:.95rem; color:var(--ink-2); margin:0 }
.band--dark .card-in p{ color:var(--on-dark-2) }

/* ---------- lists ---------- */
.ticks{ list-style:none; margin:0; padding:0 }
.ticks li{ position:relative; padding:0 0 .62rem 1.65rem; font-size:.96rem; color:var(--ink-2) }
.ticks li::before{
  content:""; position:absolute; left:0; top:.55em; width:9px; height:9px; border-radius:2px;
  background:var(--brand); transform:rotate(45deg);
}
.band--dark .ticks li{ color:var(--on-dark-2) }
.band--dark .ticks li::before{ background:#F0B27A }

/* ---------- faq ---------- */
.faq{ border-top:1px solid var(--line) }
.faq details{ border-bottom:1px solid var(--line); padding:1.15rem 0 }
.faq summary{ cursor:pointer; font-family:var(--display); font-weight:600; font-size:1.04rem; list-style:none; display:flex; gap:1rem; align-items:baseline }
.faq summary::-webkit-details-marker{ display:none }
.faq summary::after{ content:"+"; margin-left:auto; font-family:var(--mono); color:var(--brand-deep); font-size:1.2rem }
.faq details[open] summary::after{ content:"–" }
.faq p{ margin:.8rem 0 0; color:var(--ink-2); max-width:74ch }

/* ---------- forms ---------- */
.field{ display:grid; align-content:start; gap:.36rem; margin-bottom:1.05rem }
.field label{ font-size:.88rem; font-weight:600; color:var(--ink-2) }
.field input,.field select,.field textarea{
  font-family:var(--sans); font-size:1rem; color:var(--ink); background:#fff;
  border:1.5px solid var(--line); border-radius:var(--r-s); padding:.72rem .85rem; width:100%;
}
.field input:focus,.field select:focus,.field textarea:focus{ border-color:var(--brand); outline:none; box-shadow:0 0 0 3px var(--brand-soft) }
.field-help{ font-size:.82rem; color:var(--ink-3) }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:0 1.05rem }
.check{ display:flex; gap:.6rem; align-items:flex-start; font-size:.9rem; color:var(--ink-2); margin-bottom:1rem }
.check input{ margin-top:.25rem; width:auto; flex:0 0 auto }

/* ---------- tables / summary ---------- */
.panel{ background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:1.5rem }
.panel h3{ margin-bottom:1rem }
.sum-row{ display:flex; justify-content:space-between; gap:1rem; padding:.5rem 0; font-size:.95rem; color:var(--ink-2) }
.sum-row--total{ border-top:1px solid var(--line); margin-top:.5rem; padding-top:.85rem; font-size:1.14rem; color:var(--ink); font-weight:600 }
.sum-row--total span:last-child{ font-family:var(--display) }

/* ---------- footer ---------- */
.foot{ background:var(--ink); color:var(--on-dark); padding:3.6rem 0 2rem }
.foot a{ color:var(--on-dark-2); text-decoration:none }
.foot a:hover{ color:var(--on-dark); text-decoration:underline }
.foot-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:2rem; padding-bottom:2.4rem; border-bottom:1px solid var(--line-dark) }
.foot h4{ font-size:.78rem; font-family:var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark-3); margin-bottom:.9rem }
.foot ul{ list-style:none; margin:0; padding:0; display:grid; gap:.5rem; font-size:.93rem }
.foot-brand p{ color:var(--on-dark-2); font-size:.93rem; max-width:34ch; margin:.9rem 0 0 }
.pay{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin-top:1.2rem }
.pay img{ height:26px; width:auto }
.foot-legal{ padding-top:1.6rem; font-size:.83rem; color:var(--on-dark-3); display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; line-height:1.6 }
.foot-legal p{ margin:0 }

/* ---------- chat ---------- */
.chat-open{
  position:fixed; right:20px; bottom:20px; z-index:80; border:0; cursor:pointer;
  background:var(--brand); color:#fff; border-radius:999px; padding:.85rem 1.3rem;
  font-family:var(--sans); font-weight:600; font-size:.94rem; box-shadow:var(--shadow-l);
  display:inline-flex; gap:.5rem; align-items:center;
}
.chat-open:hover{ background:var(--brand-deep) }
.chat{
  position:fixed; right:20px; bottom:20px; z-index:81; width:min(360px,calc(100vw - 40px));
  background:#fff; border:1px solid var(--line); border-radius:var(--r-l);
  box-shadow:var(--shadow-l); overflow:hidden;
}
.chat[hidden]{ display:none }
.chat-head{ background:var(--ink); color:var(--on-dark); padding:1rem 1.1rem; display:flex; align-items:center; gap:.7rem }
.chat-head b{ font-family:var(--display); font-size:.98rem; display:block }
.chat-head span{ font-size:.8rem; color:var(--on-dark-3) }
.chat-close{ margin-left:auto; background:none; border:0; color:var(--on-dark-2); font-size:1.3rem; cursor:pointer; line-height:1; padding:.2rem .3rem }
.chat-close:hover{ color:var(--on-dark) }
.chat-log{ padding:1rem 1.1rem; max-height:230px; overflow-y:auto; display:grid; gap:.7rem; background:var(--paper-2) }
.msg{ font-size:.9rem; line-height:1.5; padding:.65rem .8rem; border-radius:12px; max-width:88% }
.msg--them{ background:#fff; border:1px solid var(--line); color:var(--ink-2) }
.msg--me{ background:var(--brand); color:#fff; justify-self:end }
.chat-form{ padding:1rem 1.1rem; display:grid; gap:.55rem; border-top:1px solid var(--line) }
.chat-form input,.chat-form textarea{
  font-family:var(--sans); font-size:.93rem; border:1.5px solid var(--line);
  border-radius:var(--r-s); padding:.6rem .7rem; width:100%; color:var(--ink);
}
.chat-form textarea{ resize:vertical; min-height:64px }
.chat-note{ font-size:.78rem; color:var(--ink-3); margin:0 }

/* ---------- misc ---------- */
.notice{ background:var(--brand-soft); border:1px solid var(--brand-line); border-radius:var(--r-s); padding:.9rem 1.05rem; font-size:.92rem; color:var(--ink-2); margin-bottom:1.4rem }
.notice--ok{ background:#E9F4EE; border-color:#BFDECC; color:#14532D }
.notice--bad{ background:#FDECEA; border-color:#F3C7C1; color:#7A1F14 }
.crumbs{ font-size:.85rem; color:var(--ink-3); margin-bottom:1.6rem }
.crumbs a{ color:var(--ink-3) }
.prose{ max-width:74ch }
.prose h2{ font-size:1.5rem; margin-top:2.4rem }
.prose h3{ margin-top:1.8rem }
.prose ul{ padding-left:1.2rem; color:var(--ink-2) }
.prose li{ margin-bottom:.4rem }
.prose dl{ margin:1rem 0 }
.prose dt{ font-weight:600; margin-top:.7rem }
.prose dd{ margin:0 0 .2rem; color:var(--ink-2) }
.skip{ position:absolute; left:-9999px }
.skip:focus{ left:12px; top:12px; z-index:100; background:#fff; padding:.7rem 1rem; border-radius:8px; border:2px solid var(--brand) }

/* ---------- responsive (after base rules, see §CC) ---------- */
@media (max-width:1000px){
  .hero-grid{ grid-template-columns:1fr }
  .hero-text{ padding:3.4rem 0 2.6rem }
  .hero-media{ margin:0 calc(50% - 50vw); min-height:340px; height:52vw; max-height:440px }
  .facts{ grid-template-columns:1fr 1fr }
  .facts > div:nth-child(2n){ border-right:0 }
  .facts > div:nth-child(-n+2){ border-bottom:1px solid var(--line) }
  .course{ grid-template-columns:190px 1fr; gap:1.3rem }
  .course-buy{ grid-column:1/-1; border-left:0; border-top:1px solid var(--line-soft); padding:1rem 0 0; flex-direction:row; align-items:center; justify-content:space-between; gap:1rem }
  .course-buy form{ margin:0 }
  .split{ grid-template-columns:1fr; gap:2.2rem }
  .split--flip .split-media{ order:0 }
  .cards{ grid-template-columns:1fr 1fr }
  .foot-grid{ grid-template-columns:1fr 1fr }
}
@media (max-width:720px){
  .nav{ display:none }
  .nav--open{
    display:flex; flex-direction:column; align-items:flex-start; gap:1rem;
    position:absolute; left:0; right:0; top:68px; background:var(--paper);
    border-bottom:1px solid var(--line); padding:1.3rem var(--gutter);
  }
  .burger{ display:block; margin-left:auto }
  /* brand + basket + burger must all fit 360px without pushing the burger off-screen */
  .top-in{ gap:.6rem }
  .brand b{ font-size:.9rem }
  .brand svg{ width:26px; height:22px }
  .top-in > .cart-link{ margin-left:auto; padding:.45rem .7rem; font-size:.86rem }
  .burger{ margin-left:0; flex:0 0 auto }
  .facts{ grid-template-columns:1fr }
  .facts > div{ border-right:0; border-bottom:1px solid var(--line) }
  .facts > div:last-child{ border-bottom:0 }
  .course{ grid-template-columns:1fr }
  .course-media{ aspect-ratio:16/9 }
  .cards{ grid-template-columns:1fr }
  .field-row{ grid-template-columns:1fr }
  .foot-grid{ grid-template-columns:1fr }
  .band{ padding:3.4rem 0 }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important }
}

/* ---------- enrolment page ---------- */
.enrol-head{ display:grid; grid-template-columns:1fr 230px; gap:2.4rem; align-items:start; margin-bottom:2.8rem }
.enrol-ref{
  background:var(--ink); color:var(--on-dark); border-radius:var(--r); padding:1.2rem 1.3rem;
  display:grid; gap:.25rem;
}
.enrol-ref span{ font-family:var(--mono); font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--on-dark-3) }
.enrol-ref b{ font-family:var(--mono); font-size:1.14rem; letter-spacing:.03em }
.enrol-grid{ display:grid; grid-template-columns:1.5fr 1fr; gap:2.6rem; align-items:start }
.enrol-h{ font-size:1.25rem; margin:0 0 1.1rem }
.enrol-grid > div > .enrol-h:not(:first-child){ margin-top:2.6rem }
.enrol-side{ margin-bottom:1.1rem }
.enrol-side h3{ font-size:1rem; margin-bottom:.8rem }
.enrol-dl span{ font-family:var(--mono); font-size:.75rem; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); display:block; margin-top:.9rem }
.enrol-dl p{ margin:.25rem 0 0; font-size:.92rem; color:var(--ink-2); line-height:1.55 }

.track{ list-style:none; margin:0 0 0; padding:0; position:relative }
.track-step{ position:relative; display:grid; grid-template-columns:34px 1fr; gap:.9rem; padding-bottom:1.5rem }
.track-step::after{
  content:""; position:absolute; left:11px; top:22px; bottom:0; width:2px; background:var(--line);
}
.track-step:last-child::after{ display:none }
.track-dot{ width:24px; height:24px; border-radius:50%; border:2px solid var(--line); background:#fff; margin-top:1px; z-index:1 }
.track-step--done .track-dot{ background:var(--ok); border-color:var(--ok) }
.track-step--done::after{ background:var(--ok) }
.track-step--now .track-dot{ background:var(--brand); border-color:var(--brand); box-shadow:0 0 0 5px var(--brand-soft) }
.track-step b{ display:block; font-family:var(--display); font-weight:600; margin-bottom:.15rem }
.track-step span{ color:var(--ink-2); font-size:.94rem }
.track-step--next b,.track-step--next span{ color:var(--ink-3) }
.track-tag{
  font-family:var(--mono); font-size:.74rem; letter-spacing:.09em; text-transform:uppercase;
  background:var(--brand-soft); color:var(--brand-deep); border-radius:5px; padding:.16rem .42rem; margin-left:.4rem;
}

@media (max-width:1000px){
  .enrol-head{ grid-template-columns:1fr }
  .enrol-grid{ grid-template-columns:1fr; gap:2rem }
}

@media print{
  .top,.foot,.chat,.chat-open,.crumbs,.notice{ display:none !important }
  body{ background:#fff; font-size:10.5pt }
  .band{ padding:0; border:0 }
  .shell{ max-width:100%; padding:0 }
  .enrol-head{ grid-template-columns:1fr 180pt; gap:20pt; margin-bottom:18pt }
  .enrol-grid{ grid-template-columns:1fr 200pt; gap:20pt }
  .panel{ border:1pt solid #999; box-shadow:none; padding:10pt }
  .enrol-ref{ background:#fff; color:#000; border:1pt solid #999 }
  .enrol-ref span{ color:#444 }
  h1{ font-size:19pt }
  .enrol-h{ font-size:12pt }
  @page{ margin:14mm }
}