/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 01 2026 | 06:20:16 */
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;500;600;700;800&family=Sulphur+Point:wght@400;500;600;700&family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,400,0,0&display=swap');

/* ================================================================
   HSE ELEMENTS | CANADIAN SAFETY SUPERVISOR SERIES
   Independent, complete WordPress page stylesheet.
   Informed by the Training Overview, Our Approach, and In-Person
   Training visual systems. No appended overrides required.
   ================================================================ */

/* 01 | FOUNDATION + WORDPRESS PAGE SPACING */
body:has(.hse-sup) { margin-top:0; }
body:has(.hse-sup) .wp-site-blocks,
body:has(.hse-sup) .wp-site-blocks > main,
body:has(.hse-sup) .wp-block-post-content,
body:has(.hse-sup) .entry-content { margin-block-start:0; padding-block-start:0; }
body:has(.hse-sup) .wp-site-blocks > header:has(.hse-site-header) + * { margin-block-start:0; }
body:has(.hse-sup) .wp-block-post-content > .wp-block-html:has(.hse-sup) { margin-block-start:0; padding-block-start:0; }
.hse-sup {
  --hsu-amber:#FFC84A;
  --hsu-amber-light:#FFD578;
  --hsu-amber-dark:#D89B2B;
  --hsu-light:#F7F7F5;
  --hsu-porcelain:#FBF6EF;
  --hsu-white:#fff;
  --hsu-black:#000;
  --hsu-ink:#151515;
  --hsu-charcoal:#232424;
  --hsu-muted:#585855;
  --hsu-silver:#C8CECD;
  --hsu-max:1520px;
  --hsu-gutter:clamp(20px,4.6vw,86px);
  --hsu-ease:cubic-bezier(.22,1,.36,1);
  --hsu-radius:16px;
  position:relative; isolation:isolate; width:100%; max-width:none;
  margin:0; overflow-x:clip; background:#080909; color:var(--hsu-ink);
  font:400 16px/1.56 'Sulphur Point',Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.hse-sup,.hse-sup *,.hse-sup *::before,.hse-sup *::after { box-sizing:border-box; }
.hse-sup > section { margin:0; }
.hse-sup img { display:block; max-width:100%; }
.hse-sup :is(h1,h2,h3,p) { margin:0; }
.hse-sup :is(h1,h2,h3) { font-family:'Oxanium',Arial,sans-serif; letter-spacing:-.045em; text-wrap:balance; }
.hse-sup h2 { font-size:clamp(36px,4vw,66px); font-weight:500; line-height:1.04; }
.hse-sup h3 { font-weight:600; }
.hse-sup a { color:inherit; text-decoration:none; -webkit-tap-highlight-color:transparent; }
.hse-sup button,.hse-sup input { font:inherit; }
.hse-sup button { cursor:pointer; }
.hse-sup :is(a,button,input,summary):focus-visible { outline:none; box-shadow:0 0 0 3px rgba(255,200,74,.30); }
.hse-sup [hidden] { display:none!important; }
.hse-sup .material-symbols-rounded {
  display:inline-grid; place-items:center; flex:none;
  font-family:'Material Symbols Rounded'; font-style:normal; font-weight:normal;
  font-size:24px; line-height:1; letter-spacing:normal; text-transform:none;
  white-space:nowrap; direction:ltr; -webkit-font-feature-settings:'liga'; font-feature-settings:'liga';
  -webkit-font-smoothing:antialiased;
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
}
.hse-sup-container { width:min(calc(100% - var(--hsu-gutter)*2),var(--hsu-max)); margin-inline:auto; }
.hse-sup-section { padding-block:clamp(82px,8.8vw,142px); }
.hse-sup .hse-sup-kicker {
  margin:0 0 23px; color:var(--hsu-amber-dark);
  font:700 clamp(11px,.81vw,13px)/1.4 'Oxanium',Arial,sans-serif;
  letter-spacing:.155em; text-transform:uppercase;
}
.hse-sup-sr-only { position:absolute!important; width:1px!important; height:1px!important; margin:-1px!important; padding:0!important; overflow:hidden!important; clip-path:inset(50%)!important; white-space:nowrap!important; border:0!important; }
.hse-sup :is(#hse-sup-learning,#hse-sup-differences,#hse-sup-jurisdictions,#hse-sup-map,#hse-sup-next) { scroll-margin-top:clamp(90px,10vw,130px); }

/* 02 | COMMON HSE ELEMENTS BUTTON LANGUAGE */
.hse-sup .hse-sup-btn {
  --hsu-pressed:#fff; position:relative; isolation:isolate;
  display:inline-flex; justify-content:center; align-items:center; gap:13px;
  min-height:49px; max-width:100%; width:fit-content; padding:12px 20px;
  border:1px solid transparent; border-radius:10px; overflow:hidden;
  font:700 12px/1.25 'Oxanium',Arial,sans-serif;
  letter-spacing:.015em; text-align:center; text-transform:uppercase;
  cursor:pointer; transform:translate3d(0,0,0);
  transition:transform .27s var(--hsu-ease),background-color .27s ease,color .27s ease,border-color .27s ease,box-shadow .27s ease;
}
.hse-sup-btn::before { content:''; position:absolute; z-index:-1; inset:0; pointer-events:none; background:var(--hsu-pressed); transform:translateX(-102%); transition:transform .43s var(--hsu-ease); }
.hse-sup-btn:active::before { transform:translateX(0); }
.hse-sup-btn > .material-symbols-rounded { font-size:19px!important; transition:transform .27s var(--hsu-ease); }
.hse-sup-btn:hover { transform:translate3d(0,-3px,0); }
.hse-sup-btn:active { transform:translate3d(0,0,0); }
.hse-sup-btn:hover > .material-symbols-rounded { transform:scale(1.08); }
.hse-sup .hse-sup-btn--amber { background:var(--hsu-amber); color:#080808; box-shadow:0 10px 30px rgba(216,155,43,.12),inset 0 1px rgba(255,255,255,.25); }
.hse-sup .hse-sup-btn--amber:hover { background:var(--hsu-amber-light); color:#080808; box-shadow:0 14px 35px rgba(216,155,43,.18); }
.hse-sup .hse-sup-btn--amber:active { background:var(--hsu-amber-light); border-color:rgba(216,155,43,.74); color:#080808; box-shadow:inset 0 0 0 2px rgba(255,200,74,.32),0 0 0 4px rgba(255,200,74,.12); }
.hse-sup .hse-sup-btn--outline { --hsu-pressed:#fff; color:var(--hsu-ink); background:rgba(255,255,255,.54); border-color:rgba(255,255,255,.96); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); box-shadow:inset 0 1px rgba(255,255,255,.86); }
.hse-sup .hse-sup-btn--outline:hover { background:rgba(255,200,74,.26); color:#111; border-color:rgba(216,155,43,.75); box-shadow:0 11px 29px rgba(0,0,0,.08); }
.hse-sup .hse-sup-btn--outline:active { background:rgba(255,200,74,.39); color:#111; border-color:rgba(255,200,74,.78); box-shadow:inset 0 0 0 2px rgba(255,200,74,.28); }
.hse-sup .hse-sup-btn--dark { --hsu-pressed:var(--hsu-amber); color:#fff; background:#181919; border-color:rgba(255,255,255,.16); box-shadow:0 10px 30px rgba(0,0,0,.11); }
.hse-sup .hse-sup-btn--dark:hover { color:#fff; background:#313232; box-shadow:0 13px 35px rgba(0,0,0,.15); }
.hse-sup .hse-sup-btn--dark:active { color:#080808; background:#161616; border-color:rgba(255,200,74,.82); box-shadow:inset 0 0 0 1px rgba(255,213,120,.50),0 0 0 3px rgba(255,200,74,.20),0 0 18px rgba(255,200,74,.17); }
.hse-sup .hse-sup-btn--light { --hsu-pressed:var(--hsu-amber); color:#161616; background:rgba(255,255,255,.53); border-color:rgba(255,255,255,.76); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:inset 0 1px rgba(255,255,255,.88); }
.hse-sup .hse-sup-btn--light:hover { background:#fff; color:#111; }
.hse-sup .hse-sup-btn--light:active { color:#111; border-color:rgba(255,255,255,.82); background:rgba(255,255,255,.55); box-shadow:inset 0 0 0 1px rgba(255,255,255,.39),0 0 0 3px rgba(255,255,255,.17); }

/* 03 | HERO: CENTRED TYPOGRAPHY + REFERENCE-INSPIRED CONNECTED PANELS */
.hse-sup-hero { position:relative; isolation:isolate; overflow:hidden; background:linear-gradient(160deg,#FCFCFB 0%,#F4F4F2 49%,#EEEDEA 100%); padding:clamp(134px,13.5vw,208px) 0 clamp(96px,9vw,140px); }
.hse-sup-hero::before { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.56; background:radial-gradient(ellipse at 50% 0%,rgba(255,200,74,.11),transparent 52%),radial-gradient(ellipse at 14% 92%,rgba(180,191,188,.11),transparent 55%),radial-gradient(ellipse at 91% 85%,rgba(255,200,74,.08),transparent 45%); }
.hse-sup-hero::after { content:""; position:absolute; inset:-100px; z-index:0; pointer-events:none; opacity:.72; background-image:linear-gradient(to right,rgba(87,91,88,.11) 1px,transparent 1px),linear-gradient(to bottom,rgba(87,91,88,.11) 1px,transparent 1px),linear-gradient(to right,rgba(216,155,43,.14) 2px,transparent 2px),linear-gradient(to bottom,rgba(216,155,43,.14) 2px,transparent 2px),radial-gradient(circle at 50% 50%,rgba(255,200,74,.10),transparent 58%); background-size:270px 270px,270px 270px,810px 810px,810px 810px,100% 100%; -webkit-mask-image:radial-gradient(ellipse at 50% 51%,#000 55%,rgba(0,0,0,.74) 90%,transparent 128%); mask-image:radial-gradient(ellipse at 50% 51%,#000 55%,rgba(0,0,0,.74) 90%,transparent 128%); animation:hsu-grid-drift 36s ease-in-out infinite alternate,hsu-grid-breathe 11s ease-in-out infinite alternate; }
@keyframes hsu-grid-drift { from { transform:translate3d(-55px,-38px,0); } to { transform:translate3d(55px,38px,0); } }
@keyframes hsu-grid-breathe { from { opacity:.68; } to { opacity:1; } }
.hse-sup-hero__glow { position:absolute; z-index:0; pointer-events:none; width:850px; height:430px; top:0; left:50%; transform:translateX(-50%); border-radius:50%; background:radial-gradient(ellipse,rgba(255,255,255,.48),transparent 70%); }
.hse-sup-hero__inner { position:relative; z-index:1; }
.hse-sup-hero__heading { max-width:1120px; margin-inline:auto; text-align:center; }
.hse-sup-hero .hse-sup-kicker--hero { display:inline-flex; align-items:center; justify-content:center; padding:9px 16px; border:1px solid rgba(250,217,149,.94); border-radius:999px; background:rgba(255,200,74,.16); -webkit-backdrop-filter:blur(18px) saturate(135%); backdrop-filter:blur(18px) saturate(135%); box-shadow:inset 0 1px rgba(255,255,255,.92),0 7px 24px rgba(0,0,0,.035); color:#000; }
.hse-sup-hero h1 { max-width:1150px; margin:0 auto; color:#181918; font-size:clamp(42px,5.1vw,85px); font-weight:500; line-height:1.02; }
.hse-sup-hero h1 em { font-style:normal; color:#6D6D68; }
.hse-sup-hero__lead { max-width:800px; margin:25px auto 0!important; color:#4C4D4B; font:400 clamp(17px,1.39vw,20px)/1.52 'Sulphur Point',Arial,sans-serif; }
.hse-sup-hero__secondary { max-width:805px; margin:12px auto 0!important; color:#666763; font-size:clamp(15px,1.13vw,17px); line-height:1.55; }
.hse-sup-hero__actions { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:31px; }
.hse-sup-hero__framework { position:relative; max-width:1330px; margin:clamp(46px,4.6vw,65px) auto 0; }
.hse-sup-hero__context { display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,5vw,85px); max-width:1330px; margin:clamp(33px,4vw,57px) auto 0; padding:clamp(25px,3vw,43px); border:1px solid rgba(255,255,255,.94); border-radius:16px; background:#fff; box-shadow:inset 0 1px rgba(255,255,255,.93),0 13px 37px rgba(22,24,22,.07); }
.hse-sup-hero__context p { color:#61635F; font-size:clamp(15px,1.11vw,17px); line-height:1.62; }
.hse-sup-hero__emblem { position:relative; z-index:3; isolation:isolate; overflow:hidden; display:flex; align-items:center; justify-content:center; width:fit-content; min-width:265px; min-height:78px; margin:0 auto; padding:22px 37px; border:1px solid rgba(255,213,120,.85); border-radius:14px; background:var(--hsu-amber); text-decoration:none; cursor:pointer; box-shadow:inset 0 1px rgba(255,255,255,.44),0 17px 37px rgba(0,0,0,.15),0 0 0 5px rgba(255,200,74,.13),0 0 31px rgba(255,200,74,.23); animation:hsu-emblem-in 2.15s var(--hsu-ease) .2s both; transition:background-color .38s ease,border-color .38s ease,box-shadow .38s ease,transform .4s var(--hsu-ease); }
.hse-sup-hero__emblem::before { content:""; position:absolute; z-index:0; inset:0; pointer-events:none; border-radius:inherit; background:rgba(255,200,74,.80); -webkit-backdrop-filter:blur(16px) saturate(135%); backdrop-filter:blur(16px) saturate(135%); transform:translateX(-102%); transition:transform .46s var(--hsu-ease); }
.hse-sup-hero__emblem:hover { transform:translateY(-3px); background:#fff; border-color:rgba(255,200,74,.74); box-shadow:0 17px 37px rgba(0,0,0,.13),0 0 0 5px rgba(255,200,74,.1),0 0 34px rgba(255,200,74,.22); }
.hse-sup-hero__emblem:active { transform:translateY(0); background:rgba(255,255,255,.78); border-color:rgba(255,200,74,.88); box-shadow:inset 0 0 0 1px rgba(255,200,74,.40),0 0 0 5px rgba(255,200,74,.2),0 0 36px rgba(255,200,74,.40),0 11px 25px rgba(0,0,0,.13); }
.hse-sup-hero__emblem:active::before { transform:translateX(0); }
.hse-sup-hero__emblem img { position:relative; z-index:1; display:block; width:clamp(196px,18.3vw,289px); height:auto; max-height:57px; object-fit:contain; filter:brightness(0) invert(1); transition:filter .38s ease; }
.hse-sup-hero__emblem:hover img { filter:none; }
.hse-sup-hero__emblem:active img { filter:brightness(0) invert(1); }
@keyframes hsu-emblem-in { from { opacity:0; translate:0 16px; } to { opacity:1; translate:0 0; } }
/* Connector columns exactly match card centres, including the card gaps. */
.hse-sup-hero__connector { --hsu-card-gap:clamp(13px,1.8vw,24px); position:relative; width:100%; height:100px; margin:0 auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--hsu-card-gap); align-items:end; pointer-events:none; }
.hse-sup-hero__connector::before { content:""; position:absolute; top:0; bottom:35px; left:50%; width:2px; transform:translateX(-50%); background:linear-gradient(180deg,rgba(216,155,43,.7) 0%,#FFC84A 34%,#E49C23 51%,rgba(255,200,74,.7) 100%); background-size:100% 250%; animation:hsu-path-flow-vertical 2.6s linear infinite; box-shadow:0 0 9px rgba(255,200,74,.38); }
.hse-sup-hero__connector::after { content:""; position:absolute; bottom:34px; left:calc(16.666667% - var(--hsu-card-gap) / 3); right:calc(16.666667% - var(--hsu-card-gap) / 3); height:2px; background:linear-gradient(90deg,rgba(216,155,43,.75) 0%,#FFBC36 27%,#FFD578 50%,#E49C23 74%,rgba(216,155,43,.72) 100%); background-size:220% 100%; animation:hsu-path-flow-horizontal 3.5s linear infinite; box-shadow:0 0 9px rgba(255,200,74,.43); }
.hse-sup-hero__connector span { position:relative; justify-self:center; align-self:end; width:2px; height:35px; background:linear-gradient(180deg,rgba(216,155,43,.63) 0%,#FFD578 42%,#E49C23 57%,rgba(216,155,43,.75) 100%); background-size:100% 240%; animation:hsu-path-flow-vertical 2.9s linear infinite; box-shadow:0 0 8px rgba(255,200,74,.38); }
.hse-sup-hero__connector span:nth-child(1) { animation-delay:-.95s; }
.hse-sup-hero__connector span:nth-child(2) { animation-delay:-.5s; }
.hse-sup-hero__connector span:nth-child(3) { animation-delay:-1.4s; }
@keyframes hsu-path-flow-vertical { from { background-position:0 100%; } to { background-position:0 0%; } }
@keyframes hsu-path-flow-horizontal { from { background-position:100% 0; } to { background-position:0 0; } }
.hse-sup-hero__cards { --hsu-card-gap:clamp(13px,1.8vw,24px); position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--hsu-card-gap); align-items:stretch; isolation:isolate; }
.hse-sup-hero-card { position:relative; z-index:1; min-width:0; display:flex; flex-direction:column; border:1.5px solid rgba(255,200,74,.59); border-radius:16px; overflow:hidden; background:#fff; box-shadow:inset 0 1px rgba(255,255,255,.95),0 16px 35px rgba(24,26,25,.072); transform:translate3d(0,0,0); transition:transform .42s var(--hsu-ease),border-color .35s ease,box-shadow .42s var(--hsu-ease),background-color .35s ease; }
.hse-sup-hero-card:hover { transform:translate3d(0,-6px,0); border-color:rgba(216,155,43,.75); background:#fff; box-shadow:inset 0 1px rgba(255,255,255,.9),0 24px 45px rgba(24,26,25,.105); }
.hse-sup-hero-card:active { transform:translate3d(0,0,0); background:rgba(255,200,74,.23); border-color:rgba(255,200,74,.88); box-shadow:inset 0 0 0 2px rgba(255,200,74,.40),0 0 0 4px rgba(255,200,74,.15),0 0 30px rgba(255,200,74,.24),0 11px 24px rgba(24,26,25,.075); }
.hse-sup-hero-card:hover:not(:active) h2,
.hse-sup-hero-card:hover:not(:active) .hse-sup-hero-card__head > span:last-child { color:var(--hsu-amber-dark); }
.hse-sup-hero-card--featured { border-color:rgba(255,200,74,.59); }
.hse-sup-hero-card__content { flex:1; padding:clamp(19px,2.2vw,29px); }
.hse-sup-hero-card__head { display:flex; align-items:center; justify-content:space-between; gap:10px; color:#80817F; font:700 10px/1.3 'Oxanium',Arial,sans-serif; letter-spacing:.08em; transition:color .32s ease; }
.hse-sup-hero-card__icon { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:12px; border:1px solid rgba(192,197,194,.6); background:#ECEDEB; color:#585E5A; transition:background-color .3s,border-color .3s,color .3s; }
.hse-sup-hero-card:hover .hse-sup-hero-card__icon { background:#fff; color:var(--hsu-amber-dark); border-color:rgba(255,255,255,.9); }
.hse-sup-hero-card:active .hse-sup-hero-card__icon { background:var(--hsu-amber); color:#000; border-color:var(--hsu-amber); }
.hse-sup-hero-card__icon .material-symbols-rounded { font-size:23px; }
.hse-sup-hero-card__icon--amber { background:#ECEDEB; color:#585E5A; border-color:rgba(192,197,194,.6); }
.hse-sup-hero-card__icon--stone { background:#ECEDEB; color:#585E5A; border-color:rgba(192,197,194,.6); }
.hse-sup-hero-card h2 { margin-top:26px; font-size:clamp(23px,1.85vw,30px); font-weight:600; line-height:1.12; color:#222323; transition:color .32s ease; }
.hse-sup-hero-card p { margin-top:12px; font-size:clamp(14px,1.04vw,16px); color:#777974; line-height:1.48; }
.hse-sup-hero-card__visual { position:relative; height:140px; overflow:hidden; background:linear-gradient(125deg,#CBCFCD,#E7E7E4); }
.hse-sup-hero-card__visual::after { content:''; position:absolute; inset:0; background-image:linear-gradient(180deg,transparent 15%,rgba(11,12,11,.75) 100%); background-color:rgba(0,0,0,0); opacity:1; transition:background-color .45s ease; pointer-events:none; }
.hse-sup-hero-card:hover:not(:active) .hse-sup-hero-card__visual::after { background-color:rgba(0,0,0,.08); }
.hse-sup-hero-card__visual img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 35%; filter:none; transition:filter .5s ease,transform .6s var(--hsu-ease); }
.hse-sup-hero-card:hover .hse-sup-hero-card__visual img { filter:grayscale(0) saturate(1); transform:scale(1.045); }
.hse-sup-hero-card:active .hse-sup-hero-card__visual img { filter:grayscale(1); transform:scale(1); }
.hse-sup-hero-card__visual > span { position:absolute; z-index:1; bottom:16px; left:20px; display:inline-flex; gap:7px; align-items:center; color:#fff; font:700 10px/1.25 'Oxanium',Arial,sans-serif; letter-spacing:.07em; }
.hse-sup-hero-card__visual .material-symbols-rounded { font-size:19px; color:var(--hsu-amber); }

/* 04 | WHAT THE SERIES COVERS: EDITORIAL HEAD + THREE-TONAL CARDS */
.hse-sup-learning { position:relative; z-index:1; background:#FBFBF9; box-shadow:0 -2px 0 #FBFBF9; }
.hse-sup-section__heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.92fr); gap:clamp(36px,7vw,115px); align-items:start; margin-bottom:clamp(40px,4.7vw,72px); }
.hse-sup-section__heading h2 span { color:#6D6D68; }
.hse-sup-section__text p { margin:0; max-width:700px; color:#545653; font-size:clamp(16px,1.25vw,19px); line-height:1.62; }
.hse-sup-learning .hse-sup-section__text p { font-size:17px; }
.hse-sup-learning .hse-sup-section__text .hse-sup-learning__gold-note {
  margin-top:17px;
  color:#545653;
  line-height:1.62;
}
.hse-sup-section__text .hse-sup-btn { margin-top:25px; }
.hse-sup-learning__button { margin-top:clamp(28px,3.3vw,43px); }
/* Align the right-side description with ACCOUNTABILITY (four cards).
   The seal floats centrally in its own clear space above the cards. */
.hse-sup-learning .hse-sup-section__heading { position:relative; grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:13px; margin-bottom:clamp(62px,5.8vw,95px); }
.hse-sup-learning .hse-sup-section__heading > div:first-child { grid-column:1 / span 2; min-width:0; }
.hse-sup-learning .hse-sup-section__heading > .hse-sup-section__text { grid-column:3 / span 2; min-width:0; }
.hse-sup-learning__seal { --hsu-seal-size:clamp(108px,8.8vw,132px); position:absolute; z-index:2; left:clamp(402px,29vw,430px); top:clamp(138px,9vw,155px); width:var(--hsu-seal-size); height:var(--hsu-seal-size); transform:none; pointer-events:none; }
.hse-sup-learning__seal-float { display:grid; place-items:center; width:100%; height:100%; padding:13%; border:1px solid rgba(255,255,255,.96); border-radius:50%; background:rgba(255,255,255,.72); -webkit-backdrop-filter:blur(20px) saturate(130%); backdrop-filter:blur(20px) saturate(130%); box-shadow:inset 0 2px rgba(255,255,255,.91),0 13px 35px rgba(24,26,25,.10),0 0 0 5px rgba(255,255,255,.23); animation:hsu-gold-seal-float 6s ease-in-out infinite; }
.hse-sup-learning__seal img { display:block; width:100%; height:100%; object-fit:contain; }
@keyframes hsu-gold-seal-float { 0%,100% { transform:translate3d(0,0,0); } 50% { transform:translate3d(0,-10px,0); } }
.hse-sup-learning__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }
.hse-sup-theme { position:relative; display:flex; flex-direction:column; min-height:252px; padding:clamp(20px,1.65vw,26px); overflow:hidden; border:1px solid rgba(194,200,198,.75); border-radius:16px; background:#E9EBE9; transition:transform .4s var(--hsu-ease),border-color .4s ease,box-shadow .4s ease,background-color .35s ease; }
.hse-sup-theme:hover { transform:translateY(-5px); border-color:rgba(255,200,74,.85); box-shadow:inset 0 0 0 1px rgba(255,200,74,.60),0 0 0 2px rgba(255,200,74,.17),0 17px 37px rgba(0,0,0,.11); }
.hse-sup-theme:active { transform:translateY(0); border-color:rgba(255,255,255,.96); box-shadow:inset 0 0 0 2px rgba(255,255,255,.88),0 0 0 2px rgba(255,255,255,.21),0 8px 20px rgba(0,0,0,.07); }
.hse-sup-theme--amber { background:#FFC84A; border-color:rgba(216,155,43,.53); }
.hse-sup-theme--dark { background:#191A1A; color:#fff; border-color:#313433; }
.hse-sup-theme:nth-child(3) { background:#6D6D68; border-color:rgba(255,255,255,.38); color:#fff; }
.hse-sup-theme:nth-child(3) .hse-sup-theme__top { color:var(--hsu-amber); }
.hse-sup-theme:nth-child(3) p { color:#fff; }
.hse-sup-theme:nth-child(3) h3,.hse-sup-theme--dark h3 { color:#fff; }
.hse-sup-theme__top { display:flex; justify-content:space-between; align-items:center; gap:12px; color:#545956; font:700 10px/1.35 'Oxanium',Arial,sans-serif; letter-spacing:.06em; }
.hse-sup-theme--dark .hse-sup-theme__top { color:var(--hsu-amber); }
.hse-sup-theme__top .material-symbols-rounded { color:#8B681E; font-size:29px; }
.hse-sup-theme:nth-child(3) .hse-sup-theme__top .material-symbols-rounded { color:var(--hsu-amber); }
.hse-sup-theme--dark .hse-sup-theme__top .material-symbols-rounded { color:var(--hsu-amber); }
.hse-sup-theme h3 { margin-top:auto; padding-top:20px; font-size:clamp(21px,1.7vw,28px); line-height:1.13; }
.hse-sup-theme p { margin-top:13px; color:#5B5D59; font-size:15px; line-height:1.49; }
.hse-sup-theme--amber p { color:#000; }
/* Roles and Hazards: requested initial + pressed colours, existing hover colours retained. */
.hse-sup-theme:nth-child(-n+2) h3 { color:#000; }
.hse-sup-theme:nth-child(-n+2) .hse-sup-theme__top,
.hse-sup-theme:nth-child(-n+2) .hse-sup-theme__top .material-symbols-rounded { color:#6D6D68; }
.hse-sup-theme:nth-child(-n+2) p { color:#000; }
.hse-sup-theme:nth-child(-n+2):hover:not(:active) h3 { color:#6D6D68; }
.hse-sup-theme:nth-child(-n+2):hover:not(:active) .hse-sup-theme__top { color:#6D6D68; }
.hse-sup-theme:nth-child(-n+2):hover:not(:active) .hse-sup-theme__top .material-symbols-rounded { color:#000; }
/* Due Diligence and Inspections: amber wording on hover, white icons.
   :not(:active) restores every original colour while pressed. */
.hse-sup-theme:nth-child(n+3):hover:not(:active) h3,
.hse-sup-theme:nth-child(n+3):hover:not(:active) .hse-sup-theme__top { color:var(--hsu-amber); }
.hse-sup-theme:nth-child(n+3):hover:not(:active) .hse-sup-theme__top .material-symbols-rounded { color:#fff; }
.hse-sup-theme--dark p { color:rgba(255,255,255,.73); }

/* 05 | ONE COUNTRY: PHOTOGRAPHIC CONTRAST / REGULATORY COMPARISON */
.hse-sup-differences { position:relative; isolation:isolate; overflow:hidden; color:#fff; background:radial-gradient(ellipse at 80% 5%,#292A29 0%,#171817 46%,#0C0D0C 100%); }
.hse-sup-differences > .hse-sup-container { position:relative; z-index:1; }
.hse-sup-differences__diamonds { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.hse-sup-differences__diamond { position:absolute; aspect-ratio:1; transform:rotate(45deg); border:1px solid rgba(255,200,74,.24); border-radius:clamp(17px,2vw,29px); background:linear-gradient(140deg,rgba(255,200,74,.15),rgba(255,255,255,.025) 78%); box-shadow:inset 0 1px rgba(255,255,255,.11); animation:hsu-diamond-float 15s ease-in-out infinite; }
.hse-sup-differences__diamond--one { width:clamp(250px,30vw,445px); right:-125px; top:-170px; animation-delay:-4s; }
.hse-sup-differences__diamond--two { width:clamp(230px,24vw,355px); left:-110px; bottom:-155px; animation-duration:18s; animation-delay:-9s; }
@keyframes hsu-diamond-float { 0%,100% { transform:translate3d(0,0,0) rotate(45deg); } 50% { transform:translate3d(10px,-24px,0) rotate(45deg); } }
.hse-sup-differences__layout { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(45px,8vw,130px); align-items:center; }
.hse-sup-differences .hse-sup-kicker { color:#FAD995; }
.hse-sup-differences h2 { color:#fff; }
.hse-sup-differences h2 em { color:var(--hsu-amber); font-style:normal; }
.hse-sup-differences__copy > p:not(.hse-sup-kicker) { max-width:650px; margin-top:22px; color:rgba(255,255,255,.77); font-size:clamp(16px,1.25vw,18px); line-height:1.59; }
.hse-sup-differences__copy .hse-sup-btn { margin-top:31px; }
.hse-sup-differences__visual { position:relative; padding:18px 18px 0 0; }
.hse-sup-differences__photo { height:clamp(410px,38vw,590px); overflow:hidden; border:1px solid rgba(255,255,255,.48); border-radius:18px; background:#343737; box-shadow:0 0 0 5px rgba(255,255,255,.09),0 17px 50px rgba(0,0,0,.26); }
.hse-sup-differences__photo img { width:100%; height:100%; object-fit:cover; object-position:45% center; filter:saturate(.85); transform:translate3d(0,var(--hsu-difference-parallax,0px),0) scale(1.50); will-change:transform; transition:filter .55s ease,scale .55s var(--hsu-ease); }
.hse-sup-differences__photo:hover img { filter:sepia(.5) saturate(1.12); scale:1.025; }
.hse-sup-differences__photo:active img { filter:grayscale(1); scale:1; }
.hse-sup-differences__glass { position:absolute; left:-35px; bottom:93px; display:flex; align-items:center; gap:15px; padding:17px 21px; max-width:86%; border:1px solid rgba(255,255,255,.42); border-radius:14px; color:#fff; background:rgba(23,25,24,.72); -webkit-backdrop-filter:blur(20px) saturate(135%); backdrop-filter:blur(20px) saturate(135%); box-shadow:inset 0 1px rgba(255,255,255,.15),0 20px 42px rgba(0,0,0,.21); font:700 11px/1.45 'Oxanium',Arial,sans-serif; letter-spacing:.075em; }
.hse-sup-differences__glass strong { display:block; margin-top:4px; color:var(--hsu-amber); font-size:12px; }
.hse-sup-differences__glass-icon { display:grid; place-items:center; width:46px; height:46px; flex:none; border:1px solid rgba(255,200,74,.4); border-radius:11px; background:rgba(255,200,74,.13); color:var(--hsu-amber); }


/* Soft directional proof-tag entrance: RTL in split layout, LTR when stacked. */
.hse-sup--side-tag-ready [data-hse-sup-side-tag]:not(.is-hse-sup-tag-visible) { opacity:0; }
.hse-sup--side-tag-ready [data-hse-sup-side-tag].is-hse-sup-tag-visible { animation:hsu-tag-rtl 1.3s var(--hsu-ease) 130ms both; }
@keyframes hsu-tag-rtl { from { opacity:0; translate:35px 0; } to { opacity:1; translate:0 0; } }
@keyframes hsu-tag-ltr { from { opacity:0; translate:-35px 0; } to { opacity:1; translate:0 0; } }
/* 06 | COURSE SELECTOR / FILTERS AND 11 DISTINCT JURISDICTIONS */
.hse-sup-jurisdictions { background:linear-gradient(140deg,#FBF7EF,#F7F7F5 54%,#F0F2F0); }
/* The right-hand intro and search begin at the third course card. */
.hse-sup-jurisdictions__heading { grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:33px; }
.hse-sup-jurisdictions__heading > * { grid-column:span 2; }
.hse-sup-jurisdictions__heading .hse-sup-section__text { min-width:0; }
.hse-sup-jurisdictions__toolbar { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:16px; align-items:center; padding:10px 0 12px; }
.hse-sup-jurisdictions__toolbar > * { grid-column:span 2; }
.hse-sup-jurisdictions__filters { display:flex; align-items:center; flex-wrap:wrap; gap:9px; padding:7px 0; min-width:0; overflow:visible; }
.hse-sup .hse-sup-filter { --hsu-filter-stroke:rgba(81,86,83,.48); appearance:none; position:relative; isolation:isolate; overflow:hidden; display:inline-flex; gap:8px; justify-content:center; align-items:center; min-height:47px; padding:12px 17px; border:1px solid transparent; border-radius:10px; background:rgba(255,255,255,.7); color:#373A37; box-shadow:inset 0 1px rgba(255,255,255,.8); white-space:nowrap; font:800 11px/1.25 'Oxanium',Arial,sans-serif; letter-spacing:.015em; text-transform:uppercase; transform:translate3d(0,0,0); transition:transform .34s var(--hsu-ease),background-color .28s,border-color .28s,box-shadow .28s,color .28s; }
.hse-sup-filter::after { content:''; position:absolute; inset:2px; border:1px solid var(--hsu-filter-stroke); border-radius:7px; pointer-events:none; }
.hse-sup-filter small { font:700 10px/1 'Oxanium',Arial,sans-serif; opacity:.7; }
.hse-sup-filter:hover { --hsu-filter-stroke:rgba(255,213,120,.95); transform:translate3d(0,-3px,0); background:#fff; border-color:transparent; box-shadow:inset 0 1px rgba(255,255,255,.85),0 8px 20px rgba(0,0,0,.065); }
.hse-sup-filter:active { transform:translate3d(0,0,0); }
.hse-sup-filter.is-active { --hsu-filter-stroke:rgba(255,213,120,.99); border-color:transparent; background:rgba(255,200,74,.27); color:#342716; box-shadow:inset 0 0 0 1px rgba(255,213,120,.35),0 8px 19px rgba(216,155,43,.065); }
.hse-sup-filter:not(.is-active):active { --hsu-filter-stroke:rgba(255,213,120,.99); border-color:transparent; background:rgba(255,200,74,.27); color:#342716; box-shadow:inset 0 0 0 1px rgba(255,213,120,.35),0 8px 19px rgba(216,155,43,.065); }
/* Selected filter: retain the original amber tint at rest; fill on hover,
   then sweep the opaque amber out to the left while pressed. */
.hse-sup .hse-sup-filter.is-active::before { content:''; position:absolute; z-index:-1; inset:0; border-radius:inherit; background:#FFC84A; transform:translate3d(-102%,0,0); transition:transform .45s var(--hsu-ease); pointer-events:none; }
.hse-sup .hse-sup-filter.is-active:hover { background:rgba(255,200,74,.27); }
.hse-sup .hse-sup-filter.is-active:hover::before { transform:translate3d(0,0,0); }
.hse-sup .hse-sup-filter.is-active:active::before { transform:translate3d(-102%,0,0); }
.hse-sup-search { display:flex; align-items:center; gap:12px; width:100%; min-width:0; height:55px; min-height:55px; padding:0 14px 0 18px; border:1.5px solid rgba(255,213,120,.92); border-radius:12px; background:rgba(255,255,255,.56); -webkit-backdrop-filter:blur(19px) saturate(133%); backdrop-filter:blur(19px) saturate(133%); box-shadow:inset 0 1px rgba(255,255,255,.96),0 9px 27px rgba(22,24,22,.06); transition:border-color .25s ease,box-shadow .25s ease,background-color .25s ease; }
.hse-sup-search:focus-within { border-color:#FFD578; box-shadow:inset 0 1px rgba(255,255,255,.96),0 0 0 3px rgba(255,213,120,.23),0 0 24px rgba(255,200,74,.29),0 9px 27px rgba(22,24,22,.06); background:rgba(255,255,255,.82); }
.hse-sup-search .material-symbols-rounded { font-size:21px; color:#777A75; }
.hse-sup-search input { appearance:none; -webkit-appearance:none; box-sizing:border-box; width:100%; flex:1; min-width:0; height:50px; min-height:50px; padding:0; margin:0; outline:none!important; border:0!important; border-radius:0; background:transparent!important; box-shadow:none!important; color:#252525; font:400 16px/1.4 'Sulphur Point',Arial,sans-serif; }
.hse-sup-search input:focus,.hse-sup-search input:focus-visible { outline:none!important; box-shadow:none!important; }
.hse-sup-search input::-webkit-search-decoration,.hse-sup-search input::-webkit-search-cancel-button,.hse-sup-search input::-webkit-search-results-button { -webkit-appearance:none; display:none; }
.hse-sup-search__clear { appearance:none; display:grid; place-items:center; flex:0 0 32px; width:32px; height:32px; padding:0; border:1px solid rgba(184,188,186,.82); border-radius:9px; color:#515652; background:rgba(255,255,255,.69); box-shadow:inset 0 1px rgba(255,255,255,.85); transition:background-color .25s ease,border-color .25s ease,color .25s ease; }
.hse-sup-search__clear[hidden] { display:none!important; }
.hse-sup-search__clear .material-symbols-rounded { font-size:19px; color:inherit; }
.hse-sup-search__clear:hover { color:#111; background:#fff; border-color:rgba(216,155,43,.68); }
.hse-sup-search__clear:active { color:#000; background:var(--hsu-amber); border-color:rgba(216,155,43,.84); }
.hse-sup-search input::placeholder { color:#6E726F; opacity:1; }
.hse-sup-jurisdictions__count { display:inline-flex; width:fit-content; max-width:100%; margin:8px 0 21px!important; padding:8px 13px; color:#111; border:1px solid rgba(255,255,255,.93); border-radius:999px; background:rgba(255,255,255,.34); -webkit-backdrop-filter:blur(15px) saturate(135%); backdrop-filter:blur(15px) saturate(135%); box-shadow:inset 0 1px rgba(255,255,255,.9); font:500 13px/1.4 'Sulphur Point',sans-serif; transform:translate3d(0,0,0); transition:transform .4s var(--hsu-ease); }
.hse-sup-jurisdictions__count:hover { transform:translate3d(0,-2px,0); }
.hse-sup-jurisdictions__count:active { transform:translate3d(0,0,0); }
.hse-sup-courses { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:start; gap:16px; }
.hse-sup-course { min-width:0; }
.hse-sup-course__surface { display:flex; flex-direction:column; height:100%; min-height:349px; padding:21px 22px 22px; border:1px solid rgba(208,212,209,.9); border-radius:16px; background:rgba(255,255,255,.75); -webkit-backdrop-filter:blur(13px) saturate(122%); backdrop-filter:blur(13px) saturate(122%); box-shadow:inset 0 1px rgba(255,255,255,.96),0 13px 29px rgba(19,25,20,.065); transform:translate3d(0,0,0); transition:transform .42s var(--hsu-ease),border-color .35s ease,background-color .35s ease,box-shadow .42s var(--hsu-ease); }
.hse-sup-course:hover .hse-sup-course__surface { transform:translate3d(0,-5px,0); border-color:rgba(255,200,74,.85); background:#fff; box-shadow:0 19px 41px rgba(19,25,20,.12); }
.hse-sup-course:active .hse-sup-course__surface { transform:translate3d(0,0,0); border-color:rgba(255,200,74,.95); box-shadow:inset 0 0 0 1px rgba(255,200,74,.52),0 0 0 4px rgba(255,200,74,.20),0 0 28px rgba(255,200,74,.26),0 10px 24px rgba(19,25,20,.07); }
.hse-sup-course__top { display:flex; justify-content:space-between; align-items:center; gap:12px; font:700 10px/1.2 'Oxanium',Arial,sans-serif; letter-spacing:.095em; color:#858985; }
.hse-sup-course__code { color:var(--hsu-amber-dark); font-size:13px; }
.hse-sup-course__flag { display:block; width:62px; height:43px; margin-top:22px; padding:4px; overflow:hidden; border:1px solid rgba(218,222,218,.95); border-radius:9px; background:#fff; box-shadow:0 6px 17px rgba(10,10,10,.07); transition:border-color .33s ease,box-shadow .33s ease; }
.hse-sup-course:hover .hse-sup-course__flag { border-color:rgba(255,200,74,.79); box-shadow:0 0 0 3px rgba(255,200,74,.15),0 8px 21px rgba(10,10,10,.11); }
.hse-sup-course__flag img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.hse-sup-course__kind { display:inline-block; margin-top:20px; color:var(--hsu-amber-dark); font:700 10px/1.3 'Oxanium',Arial,sans-serif; letter-spacing:.09em; }
.hse-sup-course h3 { margin-top:7px; font-size:clamp(20px,1.47vw,25px); line-height:1.13; min-height:2.26em; }
.hse-sup-course__focus { margin-top:10px!important; margin-bottom:22px!important; min-height:2.8em; color:#1A1C1A; font-size:14px; line-height:1.42; }
.hse-sup-course__details { margin-top:auto; border-top:1px solid rgba(209,214,210,.93); }
.hse-sup-course__details summary { display:flex; align-items:center; gap:8px; min-height:47px; padding:13px 0; list-style:none; cursor:pointer; color:#333835; font:700 11px/1.25 'Oxanium',Arial,sans-serif; letter-spacing:.05em; outline:none!important; box-shadow:none!important; }
.hse-sup-course__details summary:focus-visible { outline:none!important; box-shadow:none!important; color:#111; }
.hse-sup-course__details summary:focus-visible .hse-sup-course__toggle { box-shadow:0 0 0 3px rgba(255,200,74,.25); }
.hse-sup-course__details summary::-webkit-details-marker { display:none; }
.hse-sup-course__details summary::marker { content:''; }
.hse-sup-course__details summary .material-symbols-rounded { font-size:19px; color:var(--hsu-amber-dark); }
.hse-sup-course__toggle { position:relative; display:inline-block; flex:0 0 31px; width:31px; height:31px; margin-left:auto; border:1px solid rgba(174,181,181,.89); border-radius:50%; color:#5F6560; background:rgba(255,255,255,.56); transition:background-color .28s,border-color .28s,color .28s,box-shadow .28s; }
.hse-sup-course__toggle::before,.hse-sup-course__toggle::after { content:""; position:absolute; top:50%; left:50%; background:currentColor; transform:translate(-50%,-50%); border-radius:2px; transition:transform .25s var(--hsu-ease); }
.hse-sup-course__toggle::before { width:12px; height:2px; }
.hse-sup-course__toggle::after { width:2px; height:12px; }
.hse-sup-course__details[open] .hse-sup-course__toggle::after { transform:translate(-50%,-50%) rotate(90deg); }
.hse-sup-course__details summary:hover .hse-sup-course__toggle { background:rgba(255,200,74,.30); border-color:rgba(255,200,74,.72); }
.hse-sup-course__details summary:active .hse-sup-course__toggle { background:#FFC84A; border-color:#D89B2B; color:#000; }
.hse-sup-course__details-inner { padding:0 0 13px; animation:hsu-details-in .27s var(--hsu-ease) both; }
@keyframes hsu-details-in { from { opacity:0; translate:0 -5px; } to { opacity:1; translate:0 0; } }
.hse-sup-course__details-inner ul { margin:0; padding-left:19px; color:#141614; font-size:13px; line-height:1.5; }
.hse-sup-course__details-inner li + li { margin-top:6px; }
.hse-sup-course__details-inner li::marker { color:var(--hsu-amber-dark); }

/* Course details: original amber glass button styling, with the original PDF icon. */
.hse-sup-course__details-link {
  position:relative; isolation:isolate; display:inline-flex; align-items:center; justify-content:space-between; gap:9px;
  width:100%; min-height:42px; margin-bottom:9px; padding:10px 12px; overflow:hidden;
  border:1px solid rgba(216,155,43,.87); border-radius:9px;
  background:rgba(255,200,74,.86); color:#111!important;
  -webkit-backdrop-filter:blur(12px) saturate(135%); backdrop-filter:blur(12px) saturate(135%);
  box-shadow:inset 0 1px rgba(255,255,255,.31);
  font:700 10px/1.25 'Oxanium',Arial,sans-serif; letter-spacing:.04em;
  transform:translate3d(0,0,0);
  transition:background-color .32s ease,border-color .32s ease,box-shadow .32s ease,transform .25s var(--hsu-ease),color .3s ease;
}
.hse-sup-course__details-link::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none; background:#fff;
  transform:translateX(-102%); transition:transform .43s var(--hsu-ease);
}
.hse-sup-course__details-link > span { position:relative; z-index:1; }
.hse-sup-course__details-link .material-symbols-rounded { font-size:18px; color:#111; }
.hse-sup-course__details-link:hover { transform:translateY(-2px); background:rgba(18,19,19,.88); border-color:rgba(255,255,255,.65); color:#fff!important; box-shadow:inset 0 1px rgba(255,255,255,.14),0 8px 19px rgba(0,0,0,.19); }
.hse-sup-course__details-link:hover .material-symbols-rounded { color:#fff; }
.hse-sup-course__details-link:active { transform:translateY(0); background:#fff; color:#111!important; border-color:#FFC84A; box-shadow:0 0 0 3px rgba(255,200,74,.26),0 0 21px rgba(255,200,74,.22); }
.hse-sup-course__details-link:active::before { transform:translateX(0); }
.hse-sup-course__details-link:active .material-symbols-rounded { color:#111; }

.hse-sup-course__link { position:relative; isolation:isolate; display:inline-flex; align-items:center; justify-content:space-between; gap:9px; width:100%; min-height:42px; padding:10px 12px; overflow:hidden; border:1px solid rgba(216,155,43,.56); border-radius:9px; background:rgba(255,200,74,.18); color:#362814; font:700 10px/1.25 'Oxanium',Arial,sans-serif; letter-spacing:.04em; transform:translate3d(0,0,0); transition:transform .25s var(--hsu-ease),background-color .25s,border-color .25s,box-shadow .25s,color .25s; }
.hse-sup-course__link::before { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:#fff; transform:translateX(-102%); transition:transform .43s var(--hsu-ease); }
.hse-sup-course__link > span { position:relative; z-index:1; }
.hse-sup-course__link .material-symbols-rounded { font-size:18px; }
.hse-sup-course__link:hover { transform:translateY(-2px); background:rgba(255,255,255,.70); border-color:#BFC5C5; color:#111; -webkit-backdrop-filter:blur(16px) saturate(125%); backdrop-filter:blur(16px) saturate(125%); box-shadow:inset 0 1px rgba(255,255,255,.9),0 8px 16px rgba(38,44,44,.12); }
.hse-sup-course__link:active { transform:translateY(0); background:var(--hsu-amber); border-color:rgba(255,200,74,.81); color:#000; box-shadow:inset 0 0 0 1px rgba(255,200,74,.34),0 0 0 3px rgba(255,200,74,.13); }
.hse-sup-course__link:active::before { transform:translateX(0); }
.hse-sup-course__link:active .material-symbols-rounded { color:#000; }
.hse-sup-no-results { padding:70px 30px; border:1px solid rgba(160,160,160,.35); border-radius:16px; background:rgba(255,255,255,.8); text-align:center; }
.hse-sup-no-results .material-symbols-rounded { display:block; color:var(--hsu-amber-dark); font-size:35px; }
.hse-sup-no-results strong { display:block; margin-top:9px; font:600 20px/1.3 'Oxanium',sans-serif; }
.hse-sup-no-results p { margin-top:8px; color:#777A76; font-size:14px; }
.hse-sup-jurisdictions__note { display:inline-flex; width:fit-content; max-width:100%; gap:10px; align-items:flex-start; margin-top:27px!important; padding:12px 16px; color:#111; border:1px solid rgba(255,255,255,.93); border-radius:13px; background:rgba(255,255,255,.35); -webkit-backdrop-filter:blur(15px) saturate(130%); backdrop-filter:blur(15px) saturate(130%); box-shadow:inset 0 1px rgba(255,255,255,.86); font-size:13px; line-height:1.5; transform:translate3d(0,0,0); transition:transform .4s var(--hsu-ease); }
.hse-sup-jurisdictions__note:hover { transform:translate3d(0,-2px,0); }
.hse-sup-jurisdictions__note:active { transform:translate3d(0,0,0); }
.hse-sup-jurisdictions__note .material-symbols-rounded { color:var(--hsu-amber-dark); font-size:19px; }

/* 07 | CANADIAN JURISDICTION MAP: DARK FROSTED GLASS + INTERACTIVE SVG */
.hse-sup-map {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#fff;
  background:#050606;
}
.hse-sup-map::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse at 36% 40%,rgba(255,200,74,.09),transparent 53%),radial-gradient(ellipse at 89% 13%,rgba(149,163,159,.12),transparent 43%);
}
.hse-sup-map::after {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.024) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.024) 1px,transparent 1px);
  background-size:72px 72px;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 75%,transparent);
  mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 75%,transparent);
}
.hse-sup-map .hse-sup-kicker { color:#FAD995; }
.hse-sup-map__heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.76fr); gap:clamp(32px,6vw,100px); align-items:center; margin-bottom:clamp(31px,4vw,56px); }
.hse-sup-map__heading h2 { color:#fff; }
.hse-sup-map__heading h2 em { font-style:normal; color:var(--hsu-amber); }
.hse-sup-map__heading > p { max-width:640px; color:rgba(255,255,255,.70); font-size:clamp(16px,1.22vw,18px); line-height:1.62; }
.hse-sup-map__shell { display:grid; grid-template-columns:minmax(0,1.74fr) minmax(280px,.70fr); gap:clamp(12px,1.4vw,20px); align-items:stretch; }
.hse-sup-map__canvas,.hse-sup-map__detail,.hse-sup-map__directory {
  border:1px solid rgba(255,255,255,.20);
  border-radius:18px;
  background:linear-gradient(150deg,rgba(255,255,255,.105),rgba(255,255,255,.037) 60%,rgba(255,255,255,.07));
  -webkit-backdrop-filter:blur(24px) saturate(135%);
  backdrop-filter:blur(24px) saturate(135%);
  box-shadow:inset 0 1px rgba(255,255,255,.20),0 22px 60px rgba(0,0,0,.22);
}
.hse-sup-map__canvas { position:relative; isolation:isolate; display:flex; flex-direction:column; min-width:0; overflow:hidden; padding:clamp(18px,2.1vw,30px); }
.hse-sup-map__canvas::before { content:''; position:absolute; width:78%; aspect-ratio:1; top:14%; left:5%; z-index:-1; pointer-events:none; border-radius:50%; background:radial-gradient(circle,rgba(255,200,74,.075),transparent 65%); }
.hse-sup-map__canvas-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; color:#F4F6F3; font:700 10px/1.4 'Oxanium',Arial,sans-serif; letter-spacing:.075em; }
.hse-sup-map__canvas-head > span:first-child { display:inline-flex; align-items:center; gap:9px; }
.hse-sup-map__canvas-head .material-symbols-rounded { font-size:20px; color:var(--hsu-amber); }
.hse-sup-map__viewport { position:relative; display:grid; flex:1; place-items:center; min-height:0; padding:18px 0 5px; overflow:hidden; }
.hse-sup-map__svg { display:block; width:100%; max-width:100%; height:auto; max-height:none; overflow:visible; visibility:hidden; }
.hse-sup-map__svg.is-geography-ready { visibility:visible; }
.hse-sup-map__loader { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:26px; padding:24px; background:rgba(6,8,8,.46); -webkit-backdrop-filter:blur(13px) saturate(115%); backdrop-filter:blur(13px) saturate(115%); }
.hse-sup-map__loader-art { position:relative; display:grid; place-items:center; width:164px; height:164px; }
.hse-sup-map__loader-diamond { position:absolute; inset:10px; border:1px solid rgba(255,213,138,.54); border-radius:23px; background:linear-gradient(135deg,rgba(255,200,74,.16),rgba(232,237,235,.08) 70%); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); box-shadow:inset 0 1px rgba(255,255,255,.25),0 0 34px rgba(255,200,74,.10); animation:hsu-map-diamond-clockwise 8s linear infinite; }
.hse-sup-map__loader-logo { position:relative; display:grid; place-items:center; width:114px; height:114px; padding:13px; overflow:hidden; border:1px solid rgba(255,255,255,.42); border-radius:17px; background:rgba(20,22,21,.81); -webkit-backdrop-filter:blur(20px) saturate(125%); backdrop-filter:blur(20px) saturate(125%); box-shadow:inset 0 1px rgba(255,255,255,.19),0 17px 34px rgba(0,0,0,.28); }
.hse-sup-map__loader-logo img { width:100%; height:100%; object-fit:contain; }
.hse-sup-map__loader-caption { color:#F7F3E9; text-align:center; font:700 11px/1.4 'Oxanium',Arial,sans-serif; letter-spacing:.11em; }
@keyframes hsu-map-diamond-clockwise { from { transform:rotate(45deg); } to { transform:rotate(405deg); } }
.hse-sup-map__region { cursor:pointer; outline:none; -webkit-tap-highlight-color:transparent; }
.hse-sup-map__region path { stroke-width:1.55px; stroke-linejoin:round; vector-effect:non-scaling-stroke; transition:fill .23s ease,stroke .23s ease; pointer-events:visiblePainted; }
.hse-sup-map__region--available path { fill:rgba(185,194,194,.22); stroke:rgba(203,212,212,.67); }
.hse-sup-map__region--pending path { fill:rgba(255,200,74,.36); stroke:rgba(255,217,138,.82); }
.hse-sup-map__region--available:hover path,.hse-sup-map__region--available:focus-visible path { fill:rgba(195,204,204,.63); stroke:#F2F5F4; }
.hse-sup-map__region--pending:hover path,.hse-sup-map__region--pending:focus-visible path { fill:rgba(255,200,74,.77); stroke:#FFF1CE; }
.hse-sup-map__region--available.is-selected path { fill:#C5CECE; stroke:#fff; }
.hse-sup-map__region--pending.is-selected path { fill:#FFC84A; stroke:#FFF5DC; }
.hse-sup-map__region--available:active path { fill:#EBF0F0; }
.hse-sup-map__region--pending:active path { fill:#FFE2A0; }
.hse-sup-map__region:focus-visible path { stroke-width:2.5px; }
.hse-sup-map__label { pointer-events:none; fill:rgba(255,255,255,.89); paint-order:stroke fill; stroke:rgba(10,11,11,.42); stroke-width:3px; stroke-linejoin:round; font:700 15px 'Oxanium',Arial,sans-serif; letter-spacing:.05em; text-anchor:middle; dominant-baseline:middle; }
.hse-sup-map__label.is-selected { fill:#111; stroke:rgba(255,255,255,.58); }
.hse-sup-map__label.is-selected:is([data-hse-sup-map-label="PE"],[data-hse-sup-map-label="NS"]) { fill:#fff; stroke:rgba(10,11,11,.72); }
.hse-sup-map__label-leader { pointer-events:none; fill:none; stroke:rgba(234,238,238,.72); stroke-width:1.25px; vector-effect:non-scaling-stroke; }
.hse-sup-map__legend { display:flex; align-items:center; flex-wrap:wrap; gap:10px 24px; margin-top:8px; color:rgba(255,255,255,.73); font:500 12px/1.4 'Sulphur Point',Arial,sans-serif; }
.hse-sup-map__legend > span { display:inline-flex; align-items:center; gap:9px; }
.hse-sup-map__legend-swatch { display:inline-block; flex:none; width:11px; height:11px; border:1px solid rgba(203,212,212,.79); border-radius:3px; background:rgba(185,194,194,.35); }
.hse-sup-map__legend-swatch--pending { border-color:rgba(255,213,138,.85); background:rgba(255,200,74,.56); }
.hse-sup-map__detail { position:relative; display:flex; flex-direction:column; min-width:0; padding:clamp(21px,2.6vw,37px); overflow:hidden; }
.hse-sup-map__detail::before { content:''; position:absolute; top:-110px; right:-90px; width:265px; aspect-ratio:1; pointer-events:none; border:1px solid rgba(255,200,74,.17); border-radius:45px; transform:rotate(45deg); background:linear-gradient(135deg,rgba(255,200,74,.10),transparent 65%); }
.hse-sup-map__detail-top { position:relative; display:flex; justify-content:space-between; gap:12px; color:rgba(255,255,255,.63); font:700 10px/1.4 'Oxanium',Arial,sans-serif; letter-spacing:.07em; }
.hse-sup-map__detail-main { position:relative; padding-block:clamp(40px,5.2vw,82px) 38px; }
.hse-sup-map__symbol { display:grid; place-items:center; width:66px; height:66px; margin-bottom:28px; border:1px solid rgba(255,200,74,.43); border-radius:16px; color:var(--hsu-amber); background:rgba(255,200,74,.055); box-shadow:inset 0 1px rgba(255,255,255,.13),0 0 32px rgba(255,200,74,.09); font:700 24px/1 'Oxanium',Arial,sans-serif; }
.hse-sup-map__symbol .material-symbols-rounded { font-size:30px; }
.hse-sup-map__selected-kind { color:var(--hsu-amber); font:700 10px/1.45 'Oxanium',Arial,sans-serif; letter-spacing:.09em; }
.hse-sup-map__detail-main h3 { margin-top:13px; color:#fff; font:500 clamp(26px,2.45vw,39px)/1.08 'Oxanium',Arial,sans-serif; letter-spacing:-.04em; overflow-wrap:anywhere; }
.hse-sup-map__description { margin-top:18px!important; max-width:400px; color:rgba(255,255,255,.70); font-size:clamp(14px,1.1vw,16px); line-height:1.59; }
/* Jurisdiction flag appears only beside a separate-column Canada map. */
.hse-sup-map__flag { position:relative; display:none; place-items:center; width:120px; height:80px; margin-top:15px; padding:5px; overflow:hidden; border:1px solid rgba(255,213,120,.73); border-radius:10px; background:rgba(255,200,74,.11); -webkit-backdrop-filter:blur(17px) saturate(125%); backdrop-filter:blur(17px) saturate(125%); box-shadow:inset 0 1px rgba(255,255,255,.21),0 7px 19px rgba(0,0,0,.16); }
.hse-sup-map__flag.is-pending { border-color:rgba(255,255,255,.80); background:rgba(255,255,255,.10); box-shadow:inset 0 1px rgba(255,255,255,.26),0 7px 19px rgba(0,0,0,.16); }
.hse-sup-map__flag img { display:block; width:auto; height:auto; max-width:100%; max-height:100%; min-width:0; min-height:0; place-self:center; object-fit:contain; object-position:center center; border-radius:5px; animation:hsu-flag-reveal .22s ease-out both; }
.hse-sup-map__flag.is-loading::before { content:''; position:absolute; inset:5px; border-radius:5px; background:linear-gradient(105deg,rgba(255,255,255,.055) 20%,rgba(255,255,255,.21) 50%,rgba(255,255,255,.055) 80%); background-size:220% 100%; animation:hsu-flag-shimmer 1.75s ease-in-out infinite; }
.hse-sup-map__flag.is-error::after { content:'FLAG UNAVAILABLE'; color:rgba(255,255,255,.72); text-align:center; font:700 9px/1.4 'Oxanium',Arial,sans-serif; letter-spacing:.04em; }
@keyframes hsu-flag-shimmer { from { background-position:100% 50%; } to { background-position:-100% 50%; } }
@keyframes hsu-flag-reveal { from { opacity:0; } to { opacity:1; } }
@media (min-width:991px) { .hse-sup-map__flag:not([hidden]) { display:grid; } }
.hse-sup-map__detail-bottom { position:relative; display:flex; flex-direction:column; align-items:start; gap:14px; margin-top:auto; }
.hse-sup-map__status { display:inline-flex; align-items:center; gap:9px; color:rgba(255,255,255,.74); font:700 10px/1.45 'Oxanium',Arial,sans-serif; letter-spacing:.03em; }
.hse-sup-map__status i { --hsu-status-pulse:rgba(255,200,74,.11); flex:none; width:7px; height:7px; border-radius:50%; background:var(--hsu-amber); box-shadow:0 0 0 4px var(--hsu-status-pulse); animation:hsu-map-status-pulse 3.1s ease-in-out infinite; }
.hse-sup-map__status.is-pending i { --hsu-status-pulse:rgba(174,176,173,.11); background:#AEB0AD; box-shadow:0 0 0 4px var(--hsu-status-pulse); }
@keyframes hsu-map-status-pulse { 0%,100% { transform:scale(1); box-shadow:0 0 0 3px var(--hsu-status-pulse); opacity:.88; } 50% { transform:scale(1.16); box-shadow:0 0 0 6px var(--hsu-status-pulse); opacity:1; } }
.hse-sup-map__action { position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:13px; width:100%; min-height:52px; padding:12px 16px; border:1px solid rgba(255,200,74,.78); border-radius:11px; background:rgba(255,200,74,.93); color:#111!important; font:800 11px/1.3 'Oxanium',Arial,sans-serif; letter-spacing:.015em; transition:transform .3s var(--hsu-ease),background-color .3s ease,box-shadow .3s ease,border-color .3s ease,color .3s ease; }
.hse-sup-map__action::before { content:""; position:absolute; z-index:-1; inset:0; border-radius:inherit; background:#fff; transform:translateX(-102%); transition:transform .46s var(--hsu-ease); pointer-events:none; }
.hse-sup-map__action .material-symbols-rounded { font-size:19px; color:inherit; }
.hse-sup-map__action:hover { transform:translateY(-3px); background:#FFE19B; border-color:#FFE19B; box-shadow:0 12px 25px rgba(255,200,74,.15); }
.hse-sup-map__action:active { transform:translateY(0); color:#111!important; border-color:#FFC84A; box-shadow:inset 0 0 0 1px rgba(255,200,74,.39),0 0 0 3px rgba(255,200,74,.28),0 0 26px rgba(255,200,74,.44); }
.hse-sup-map__action:active::before { transform:translateX(0); }
.hse-sup-map__action.is-pending { background:#fff; color:#111!important; border-color:#BFC3C3; box-shadow:inset 0 1px rgba(255,255,255,.9); }
.hse-sup-map__action.is-pending::before { background:rgba(5,6,6,.88); -webkit-backdrop-filter:blur(18px) saturate(110%); backdrop-filter:blur(18px) saturate(110%); }
.hse-sup-map__action.is-pending:hover { background:rgba(255,255,255,.76); color:#111!important; border-color:#ACB3B3; -webkit-backdrop-filter:blur(18px) saturate(130%); backdrop-filter:blur(18px) saturate(130%); box-shadow:inset 0 1px rgba(255,255,255,.65),0 9px 22px rgba(0,0,0,.13); }
.hse-sup-map__action.is-pending:active { background:rgba(255,255,255,.76); border-color:#BFC3C3; color:#fff!important; box-shadow:0 0 0 3px rgba(194,204,204,.20),0 0 21px rgba(194,204,204,.22); }
.hse-sup .hse-sup-map__reset { position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:13px; width:100%; min-height:52px; padding:12px 16px; border:1px solid rgba(193,201,201,.48); border-radius:11px; background:rgba(218,226,226,.13); color:#F7F7F6; font:800 11px/1.3 'Oxanium',Arial,sans-serif; letter-spacing:.015em; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); transition:transform .3s var(--hsu-ease),background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease; }
.hse-sup-map__reset::before { content:""; position:absolute; z-index:-1; inset:0; border-radius:inherit; background:#fff; transform:translateX(-102%); transition:transform .46s var(--hsu-ease); pointer-events:none; }
.hse-sup-map__reset .material-symbols-rounded { font-size:20px; color:inherit; }
.hse-sup-map__reset:hover { transform:translateY(-3px); background:rgba(255,200,74,.25); color:#FFDC93; border-color:rgba(255,200,74,.72); box-shadow:0 10px 25px rgba(255,200,74,.11); }
.hse-sup-map__reset:active { transform:translateY(0); color:#111; border-color:#FFC84A; box-shadow:inset 0 0 0 1px rgba(255,200,74,.45),0 0 0 3px rgba(255,200,74,.23),0 0 24px rgba(255,200,74,.31); }
.hse-sup-map__reset:active::before { transform:translateX(0); }
.hse-sup-map__directory { margin-top:clamp(12px,1.4vw,20px); padding:clamp(19px,2.5vw,31px); }
.hse-sup-map__directory-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:18px; color:rgba(255,255,255,.71); font:700 11px/1.4 'Oxanium',Arial,sans-serif; letter-spacing:.065em; }
@media (min-width:991px) { .hse-sup-map__directory-head { font-size:13px; } }
.hse-sup-map__directory-head > span:last-child { color:var(--hsu-amber); }
.hse-sup-map__directory-head i { display:inline-block; width:6px; height:6px; margin:0 8px 1px; border:1px solid rgba(255,213,120,.66); border-radius:50%; background:rgba(255,200,74,.47); -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px); box-shadow:0 0 0 3px rgba(255,200,74,.09),inset 0 1px rgba(255,255,255,.37); }
.hse-sup-map__choices { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; }
.hse-sup .hse-sup-map__choice { appearance:none; position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; min-height:51px; padding:10px 12px; border:1px solid rgba(255,255,255,.19); border-radius:10px; color:rgba(255,255,255,.79); background:rgba(255,255,255,.055); text-align:left; font:600 14px/1.35 'Sulphur Point',Arial,sans-serif; transition:background-color .25s,border-color .25s,color .25s,box-shadow .25s; }
.hse-sup-map__choice::before { content:''; position:absolute; z-index:0; inset:0; border-radius:inherit; background:#050606; transform:translateX(-102%); transition:transform .46s var(--hsu-ease); pointer-events:none; }
.hse-sup-map__choice > span { position:relative; z-index:1; min-width:0; overflow-wrap:anywhere; }
.hse-sup-map__choice small { position:relative; z-index:1; flex:none; color:var(--hsu-amber); font:700 9px/1.2 'Oxanium',Arial,sans-serif; }
.hse-sup-map__choice:hover { border-color:rgba(255,200,74,.61); background:rgba(255,200,74,.12); color:#fff; box-shadow:inset 0 0 0 1px rgba(255,200,74,.13); }
.hse-sup-map__choice.is-selected { border-color:rgba(255,200,74,.89); background:rgba(255,200,74,.20); color:#fff; box-shadow:inset 0 1px rgba(255,255,255,.15); }
.hse-sup-map__choice.is-selected small { color:#fff; }
.hse-sup-map__choice.is-selected:hover { background:#FFC84A; border-color:#FFC84A; color:#111; }
.hse-sup-map__choice.is-selected:hover small { color:#111; }
.hse-sup-map__choice:active,.hse-sup-map__choice.is-selected:active { border-color:#FFC84A; color:#FFC84A; box-shadow:inset 0 0 0 1px rgba(255,200,74,.42); }
.hse-sup-map__choice:active::before,.hse-sup-map__choice.is-selected:active::before { transform:translateX(0); }
.hse-sup-map__choice:active > span,.hse-sup-map__choice.is-selected:active > span { color:#fff; }
.hse-sup-map__choice:active small,.hse-sup-map__choice.is-selected:active small { color:#FFC84A; }

/* 08 | CLOSING CTA: HSE ELEMENTS AMBER EDITORIAL / REAL WORKPLACE PHOTO */
.hse-sup-close { position:relative; background:linear-gradient(133deg,#FFD77C 0%,#FFC84A 49%,#EFB43B 100%); }
.hse-sup-close__layout { display:grid; grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr); gap:clamp(44px,6vw,100px); align-items:center; }
.hse-sup-close .hse-sup-kicker { color:#000; text-shadow:none; }
.hse-sup-close h2 { color:#161616; }
.hse-sup-close h2 em { color:#fff; font-style:normal; text-shadow:0 2px 4px rgba(72,44,10,.24); }
.hse-sup-close__copy > p:not(.hse-sup-kicker) { max-width:670px; margin-top:20px; color:#44371F; font-size:clamp(16px,1.2vw,18px); line-height:1.58; }
.hse-sup-close__actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:30px; }
.hse-sup-close__image { position:relative; min-width:0; }
.hse-sup-close__photo-frame { height:clamp(370px,34vw,540px); overflow:hidden; border:1px solid rgba(255,255,255,.8); border-radius:18px; background:#C9C2B0; box-shadow:0 0 0 5px rgba(255,255,255,.25),0 20px 52px rgba(80,54,10,.2); transform:translate3d(0,0,0); transition:transform .45s var(--hsu-ease); }
.hse-sup-close__photo-frame img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 39%; filter:saturate(.88); transform:translate3d(0,var(--hsu-close-parallax,0px),0) scale(1.50); will-change:transform; transition:filter .5s ease; }
/* Both editorial images use the same scroll-tracked parallax from the shared
   page-scoped JavaScript. Photo frames remain fixed and clip the moving images. */
.hse-sup-close__image:hover .hse-sup-close__photo-frame { transform:translateY(-4px); }
.hse-sup-close__image:hover .hse-sup-close__photo-frame img { filter:sepia(.48) saturate(1.05); }
.hse-sup-close__image:active .hse-sup-close__photo-frame { transform:translateY(0); }
.hse-sup-close__image:active .hse-sup-close__photo-frame img { filter:grayscale(1); }
.hse-sup-close__image-note { position:absolute; bottom:27px; left:-24px; display:flex; align-items:center; gap:12px; padding:16px 18px; border:1px solid rgba(255,255,255,.44); border-radius:14px; background:rgba(20,21,20,.7); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); box-shadow:0 17px 37px rgba(0,0,0,.15); color:#fff; font:700 11px/1.35 'Oxanium',Arial,sans-serif; letter-spacing:.07em; }
.hse-sup-close__image-note > .material-symbols-rounded { color:var(--hsu-amber); font-size:28px; }
.hse-sup-close__image-note strong { display:block; margin-top:4px; color:var(--hsu-amber); }

/* 09 | PHOTO-GLASS TEAM CONTACT PANEL, ALIGNED TO HOMEPAGE */
.hse-sup-contact { position:relative; isolation:isolate; overflow:hidden; padding:clamp(70px,8vw,120px) 0; color:#fff; background:#080909; }
.hse-sup-contact > .hse-sup-container { position:relative; z-index:1; }
.hse-sup-contact__diamonds { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.hse-sup-contact__diamond { position:absolute; aspect-ratio:1; transform:rotate(45deg); border:1px solid rgba(255,200,74,.23); border-radius:clamp(17px,2vw,29px); background:linear-gradient(130deg,rgba(255,200,74,.15),rgba(255,255,255,0)); animation:hsu-diamond-float 16s ease-in-out infinite; }
.hse-sup-contact__diamond--one { width:clamp(230px,25vw,345px); left:-105px; top:-155px; animation-delay:-5s; }
.hse-sup-contact__diamond--two { width:clamp(230px,24vw,330px); right:-100px; bottom:-155px; animation-delay:-11s; animation-duration:18s; }
.hse-sup-contact__panel { position:relative; isolation:isolate; overflow:hidden; min-height:320px; display:grid; grid-template-columns:1fr .78fr; gap:clamp(35px,7vw,120px); align-items:start; padding:clamp(36px,5vw,78px); border:1px solid rgba(255,255,255,.54); border-radius:18px; background:rgba(255,255,255,.08); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); box-shadow:0 0 0 5px rgba(255,255,255,.08),inset 0 1px rgba(255,255,255,.28),0 25px 62px rgba(0,0,0,.2); transition:transform .42s var(--hsu-ease),border-color .42s ease,box-shadow .42s var(--hsu-ease); }
.hse-sup-contact__panel:hover { transform:translateY(-4px); box-shadow:0 0 0 5px rgba(255,255,255,.08),inset 0 1px rgba(255,255,255,.28),0 31px 72px rgba(0,0,0,.25); }
.hse-sup-contact__panel:active { transform:translateY(0); border-color:rgba(255,200,74,.8); box-shadow:0 0 0 5px rgba(255,200,74,.12),inset 0 0 0 1px rgba(255,213,120,.38),0 0 27px rgba(255,200,74,.24),0 19px 46px rgba(0,0,0,.18); }
.hse-sup-contact__photo { position:absolute; inset:0; z-index:-2; }
.hse-sup-contact__photo img { display:block; width:100%; height:100%; object-fit:cover; object-position:58% 68%; transform:scale(1.02); }
.hse-sup-contact__panel::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(11,12,12,.95),rgba(11,12,12,.79) 56%,rgba(11,12,12,.88) 100%); }
.hse-sup-contact__panel::after { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; border-radius:inherit; background:linear-gradient(105deg,rgba(255,200,74,.20),rgba(216,155,43,.24) 52%,rgba(255,200,74,.12)); opacity:0; transition:opacity .42s ease; }
.hse-sup-contact__panel:hover::after { opacity:1; }
.hse-sup-contact__panel:active::after { opacity:0; }
.hse-sup-contact__title,.hse-sup-contact__details { position:relative; z-index:1; }
.hse-sup-contact .hse-sup-kicker { color:#FAD995; }
.hse-sup-contact h2 { max-width:780px; color:#fff; }
.hse-sup-contact h2 em { font-style:normal; color:var(--hsu-amber); }
.hse-sup-contact__details { align-self:center; }
.hse-sup-contact__details p { max-width:495px; color:rgba(255,255,255,.84); font-size:clamp(16px,1.3vw,19px); line-height:1.55; }
.hse-sup-contact__details .hse-sup-btn { margin-top:25px; }

/* 10 | SOFT ONE-TIME REVEALS; CONTENT REMAINS VISIBLE IF JS IS DISABLED */
@keyframes hsu-reveal { from { opacity:0; translate:0 21px; } to { opacity:1; translate:0 0; } }
.hse-sup.hse-sup--reveal-ready [data-hse-sup-reveal]:not(.is-hse-sup-visible) { opacity:0; }
.hse-sup.hse-sup--reveal-ready [data-hse-sup-reveal].is-hse-sup-visible { animation:hsu-reveal 800ms var(--hsu-ease) var(--hsu-stagger,0ms) both; }
.hse-sup.hse-sup--reveal-ready .hse-sup-hero-card[data-hse-sup-reveal].is-hse-sup-visible { animation-duration:1.55s; }

/* Match homepage title sizing, with the same rules at every viewport. */
@media (min-width:1200px) {
  .hse-sup-hero h1 { font-size:clamp(43px,4.65vw,77px); }
  .hse-sup :is(.hse-sup-section__heading,.hse-sup-differences__copy,.hse-sup-close__copy,.hse-sup-contact__title) h2 { font-size:clamp(36px,3.6vw,59px); }
}
@media (max-width:900px) {
  .hse-sup-hero h1 { font-size:clamp(40px,6vw,64px); }
}
@media (max-width:700px) {
  .hse-sup-hero h1 { font-size:clamp(36px,9vw,55px); }
  .hse-sup :is(.hse-sup-section__heading,.hse-sup-differences__copy,.hse-sup-close__copy,.hse-sup-contact__title) h2 { font-size:clamp(34px,8vw,48px); }
}
@media (max-width:400px) {
  .hse-sup-hero h1 { font-size:34px; }
}

/* Large desktop flag sizing; medium desktop retains the 120 × 80 px base size. */
@media (min-width:1291px) {
  .hse-sup-map__flag { width:140px; height:94px; }
}

/* 09 | RESPONSIVE: MEDIUM DESKTOP & TABLET */
@media (max-width:1290px) {
  /* Match the supporting-copy edge to the PREVENTION card at two columns. */
  .hse-sup-learning .hse-sup-section__heading { grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:clamp(74px,6.4vw,88px); }
  .hse-sup-learning__seal { left:calc(50% - 110px); top:clamp(215px,19.65vw,225px); transform:translateX(-50%); }
  .hse-sup-learning .hse-sup-section__heading > div:first-child { grid-column:1; }
  .hse-sup-learning .hse-sup-section__heading > .hse-sup-section__text { grid-column:2; }
  .hse-sup-learning__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hse-sup-theme { min-height:233px; }
  .hse-sup-courses { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .hse-sup-jurisdictions__heading,.hse-sup-jurisdictions__toolbar { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .hse-sup-jurisdictions__heading > :last-child,.hse-sup-jurisdictions__toolbar > :last-child { grid-column:span 1; }
  .hse-sup-map__choices { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .hse-sup .hse-sup-map__choice { min-height:60px; height:60px; max-height:60px; padding:9px 10px; font-size:13px; line-height:1.2; }
}
@media (max-width:990px) {
  .hse-sup-hero { padding-top:145px; }
  .hse-sup-hero-card__content { padding:20px; }
  .hse-sup-jurisdictions__heading { grid-template-columns:1fr; gap:31px; }
  .hse-sup-jurisdictions__heading > * { grid-column:auto; }
  .hse-sup-jurisdictions__toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; }
  .hse-sup-search { flex:1 1 350px; }
  .hse-sup-map__heading { grid-template-columns:1fr; gap:16px; }
  .hse-sup-map__shell { grid-template-columns:1fr; }
  .hse-sup-map__detail { min-height:270px; }
  .hse-sup-map__detail-main { padding-block:30px 27px; }
  .hse-sup-map__choices { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .hse-sup .hse-sup-map__choice { height:64px; min-height:64px; max-height:64px; padding:9px 10px; font-size:13px; line-height:1.17; }
  .hse-sup-map__choice small { font-size:9px; }
  .hse-sup-contact__panel { grid-template-columns:1fr; gap:28px; }
  .hse-sup-contact__details { align-self:start; }
  .hse-sup-hero-card h2 { font-size:23px; }
  .hse-sup-hero-card__visual { height:115px; }
  .hse-sup-section__heading,.hse-sup-differences__layout,.hse-sup-close__layout { grid-template-columns:1fr; gap:31px; }
  /* At stacked headings, the seal sits to the right of WHAT THE SERIES COVERS. */
  .hse-sup-learning .hse-sup-section__heading { grid-template-columns:minmax(0,1fr); gap:31px; margin-bottom:38px; }
  .hse-sup-learning .hse-sup-section__heading > div:first-child { grid-column:1; padding-right:clamp(125px,19vw,178px); }
  .hse-sup-learning .hse-sup-section__heading > .hse-sup-section__text { grid-column:1; }
  .hse-sup-learning__seal { --hsu-seal-size:clamp(110px,16vw,146px); top:clamp(40px,5vw,60px); right:clamp(90px,13vw,155px); left:auto; transform:none; }
  .hse-sup--side-tag-ready [data-hse-sup-side-tag].is-hse-sup-tag-visible { animation-name:hsu-tag-ltr; }
  .hse-sup-hero__context { gap:30px; }
  .hse-sup-section__heading { margin-bottom:38px; }
  .hse-sup-section__text p { max-width:820px; }
  .hse-sup-differences__copy { max-width:760px; }
  .hse-sup-differences__visual { width:min(100%,690px); margin-inline:auto; }
  .hse-sup-differences__glass { left:-10px; }
  .hse-sup-close__image { width:min(100%,760px); margin:0 auto; }
  .hse-sup-close__image-note { left:16px; }
}

@media (max-width:790px) {
  .hse-sup-hero__framework { margin-top:50px; }
  .hse-sup-map__canvas { padding:19px 15px; }
  .hse-sup-map__svg { max-height:none; }

  .hse-sup-hero__context {
    display:block;
    width:100%;
    max-width:none;
    padding:22px 14px;
  }

  .hse-sup-hero__context p {
    display:block;
    width:100%;
    max-width:none;
  }

  .hse-sup-hero__context p + p {
    margin-top:13px;
  }

  .hse-sup-hero__connector { height:64px; display:block; }
  .hse-sup-hero__cards { grid-template-columns:1fr; gap:14px; }
  .hse-sup-hero__connector::before { bottom:0; }
  .hse-sup-hero__connector::after,.hse-sup-hero__connector span { display:none; }
  .hse-sup-hero__connector::before { bottom:0; }
  .hse-sup-hero__cards::before { content:""; position:absolute; z-index:0; left:50%; top:-64px; bottom:0; width:2px; transform:translateX(-50%); pointer-events:none; background:linear-gradient(180deg,rgba(216,155,43,.7),#FFD578 45%,#E49C23 58%,rgba(255,200,74,.7)); background-size:100% 250%; animation:hsu-path-flow-vertical 2.9s linear infinite; box-shadow:0 0 9px rgba(255,200,74,.42); }
  .hse-sup-hero-card { flex-direction:row; min-height:190px; }
  .hse-sup-hero-card__content { padding:23px; }
  .hse-sup-hero-card h2 { margin-top:17px; }
  .hse-sup-hero-card__visual { flex:0 0 34%; height:auto; }
  .hse-sup-hero-card__visual > span { left:11px; right:6px; bottom:12px; font-size:8px; }
  .hse-sup-hero-card__visual > span .material-symbols-rounded { font-size:16px; }
  .hse-sup-courses { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hse-sup-jurisdictions__toolbar { align-items:stretch; }
  .hse-sup-search { width:100%; max-width:none; }
}

/* 10 | MOBILE / NARROW MOBILE */
@media (max-width:600px) {
  .hse-sup { --hsu-gutter:20px; }
  .hse-sup-section { padding-block:75px; }
  .hse-sup-hero { padding:110px 0 72px; }
  .hse-sup-map__heading { margin-bottom:26px; }
  .hse-sup-map__shell { gap:12px; }
  .hse-sup-map__canvas-head { font-size:9px; }
  .hse-sup-map__viewport { padding:22px 0 10px; }
  .hse-sup-map__label { font-size:19px; stroke-width:3.5px; }
  .hse-sup-map__detail { min-height:0; padding:24px; }
  .hse-sup-map__detail-main { padding-block:25px 28px; }
  .hse-sup-map__symbol { width:56px; height:56px; margin-bottom:17px; }
  .hse-sup-map__choices { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .hse-sup .hse-sup-map__choice { min-height:72px; height:72px; max-height:72px; padding:10px 9px; font-size:13px; line-height:1.22; }
  .hse-sup-map__directory { padding:20px 15px; }
  .hse-sup-hero__lead { font-size:16px; margin-top:19px!important; }
  .hse-sup-hero__secondary { font-size:15px; }
  .hse-sup-hero__actions { gap:9px; }
  .hse-sup .hse-sup-btn { padding:12px 14px; font-size:11px; min-height:46px; }
  .hse-sup-hero__emblem { min-height:70px; min-width:235px; max-width:100%; padding:17px 29px; }
  .hse-sup-hero__emblem img { width:min(100%,242px); height:auto; max-height:49px; }
  .hse-sup-hero__connector { height:48px; }
  .hse-sup-hero-card { min-height:175px; }
  .hse-sup-hero-card__content { padding:18px 17px; }
  .hse-sup-hero-card h2 { font-size:22px; margin-top:16px; }
  .hse-sup-hero-card p { font-size:13px; }
  .hse-sup-hero-card__head { font-size:9px; }
  .hse-sup-hero-card__icon { width:34px; height:34px; border-radius:9px; }
  .hse-sup-hero-card__icon .material-symbols-rounded { font-size:19px; }
  .hse-sup-hero-card__visual { flex-basis:30%; }
  /* Keep the seal's lower edge level with the jurisdiction button at every mobile width. */
  .hse-sup-learning .hse-sup-section__heading {
    grid-template-columns:minmax(0,1fr) clamp(82px,25vw,108px);
    grid-template-rows:auto auto auto auto;
    column-gap:12px;
    row-gap:28px;
  }
  .hse-sup-learning .hse-sup-section__heading > div:first-child { display:contents; padding-right:0; }
  .hse-sup-learning .hse-sup-section__heading > div:first-child .hse-sup-kicker { grid-column:1 / -1; grid-row:1; margin-bottom:0; }
  .hse-sup-learning .hse-sup-section__heading > div:first-child h2 { grid-column:1 / -1; grid-row:2; }
  .hse-sup-learning .hse-sup-section__heading > div:first-child .hse-sup-learning__button { grid-column:1; grid-row:3; justify-self:start; align-self:end; margin-top:0; }
  .hse-sup-learning .hse-sup-section__heading > .hse-sup-section__text { grid-column:1 / -1; grid-row:4; }
  .hse-sup-learning__seal {
    --hsu-seal-size:clamp(82px,25vw,108px);
    grid-column:2;
    grid-row:3;
    position:relative;
    height:0;
    justify-self:end;
    align-self:end;
    top:auto;
    right:auto;
    bottom:auto;
    left:auto;
    transform:none;
  }
  .hse-sup-learning__seal-float { position:absolute; right:0; bottom:0; height:var(--hsu-seal-size); }
  .hse-sup-learning__grid,.hse-sup-courses { grid-template-columns:1fr; }
  .hse-sup-theme { min-height:194px; }
  .hse-sup-theme h3 { padding-top:18px; }
  .hse-sup-differences__photo { height:370px; }
  .hse-sup-differences__glass { bottom:82px; padding:12px 14px; gap:10px; font-size:10px; }
  .hse-sup-differences__glass strong { font-size:10px; }
  .hse-sup-differences__glass-icon { width:35px; height:35px; border-radius:9px; }
  .hse-sup-jurisdictions__filters { width:100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
  .hse-sup .hse-sup-filter { white-space:normal; min-height:47px; padding:10px 7px; font-size:clamp(9.5px,2.5vw,11px); line-height:1.2; gap:4px; }
  .hse-sup-filter small { font-size:8.5px; }
  .hse-sup-course__surface { min-height:320px; }
  .hse-sup-course h3 { min-height:0; font-size:24px; }
  .hse-sup-course__focus { min-height:0; }
  .hse-sup-close__photo-frame { height:350px; }
  .hse-sup-close__image-note { left:12px; bottom:17px; max-width:calc(100% - 24px); }
  .hse-sup-contact__panel { padding:32px 23px; }
  .hse-sup-contact__photo img { object-position:58% 48%; }
}
/* 601–680px: lower and farther right; preserve the 681px layout untouched. */
@media (min-width:601px) and (max-width:680px) {
  .hse-sup-learning__seal { top:clamp(110px,16.5vw,114px); right:8px; }
}
@media (max-width:385px) {
  .hse-sup { --hsu-gutter:16px; }
  .hse-sup-map__choices { grid-template-columns:1fr; }
  .hse-sup .hse-sup-map__choice { min-height:52px; height:52px; max-height:52px; padding:10px 12px; gap:7px; font-size:13px; line-height:1.25; }
  .hse-sup-map__choice small { font-size:9px; }
  .hse-sup-hero-card__visual { flex-basis:26%; }
  .hse-sup-hero-card h2 { font-size:20px; }
  .hse-sup-hero-card__visual > span { display:none; }
  .hse-sup .hse-sup-filter { font-size:9px; padding:9px 4px; }
}

/* 11 | ACCESSIBILITY */
@media (prefers-reduced-motion:reduce) {
  .hse-sup *, .hse-sup *::before, .hse-sup *::after { scroll-behavior:auto!important; animation:none!important; transition-duration:.01ms!important; }
  .hse-sup.hse-sup--reveal-ready [data-hse-sup-reveal],.hse-sup.hse-sup--side-tag-ready [data-hse-sup-side-tag] { opacity:1!important; translate:0 0!important; }
}