/* ==========================================================================
   HSE Hub — Design System
   Health, Safety & Environment: articles, training courses, certification
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=Lexend:wght@400;500;600;700;800&family=Source+Sans+3:wght@400;500;600;700&display=swap');

:root{
  /* ---- Brand ---- */
  --brand-900:#062821;
  --brand-800:#0a3b30;
  --brand-700:#0f5a45;
  --brand-600:#147a5a;
  --brand-500:#1c9a72;
  --brand-400:#3ec090;
  --brand-100:#e3f6ee;
  --brand-50:#f2fbf7;

  --accent-600:#c2760a;
  --accent-500:#ea9a1c;
  --accent-400:#f7ad2e;
  --accent-100:#fef1da;

  --danger-600:#b91c1c;
  --danger-500:#dc2626;
  --danger-100:#fde2e2;

  /* ---- Neutrals ---- */
  --slate-900:#0f172a;
  --slate-800:#1e293b;
  --slate-700:#334155;
  --slate-600:#475569;
  --slate-500:#64748b;
  --slate-400:#94a3b8;
  --slate-300:#cbd5e1;
  --slate-200:#e2e8f0;
  --slate-100:#f1f5f9;
  --slate-50:#f8fafc;
  --white:#ffffff;

  /* ---- Semantic (light mode default) ---- */
  --bg:var(--white);
  --bg-alt:var(--slate-50);
  --surface:var(--white);
  --surface-raised:var(--white);
  --fg:var(--slate-900);
  --fg-muted:var(--slate-600);
  --fg-subtle:var(--slate-500);
  --border:var(--slate-200);
  --border-strong:var(--slate-300);
  --brand:var(--brand-700);
  --brand-strong:var(--brand-800);
  --brand-soft:var(--brand-100);
  --accent:var(--accent-500);
  --ring:var(--brand-500);

  /* ---- Type ---- */
  --font-head:'Lexend',ui-sans-serif,system-ui,sans-serif;
  --font-body:'Source Sans 3',ui-sans-serif,system-ui,sans-serif;

  --fs-xs:.8125rem;
  --fs-sm:.9375rem;
  --fs-base:1.0625rem;
  --fs-md:1.1875rem;
  --fs-lg:1.375rem;
  --fs-xl:1.75rem;
  --fs-2xl:2.25rem;
  --fs-3xl:2.875rem;
  --fs-4xl:3.5rem;

  /* ---- Spacing (8px rhythm) ---- */
  --sp-1:.25rem;
  --sp-2:.5rem;
  --sp-3:.75rem;
  --sp-4:1rem;
  --sp-5:1.5rem;
  --sp-6:2rem;
  --sp-7:2.5rem;
  --sp-8:3rem;
  --sp-9:4rem;
  --sp-10:5rem;
  --sp-11:6.5rem;
  --sp-12:8rem;

  /* ---- Radius ---- */
  --r-sm:8px;
  --r-md:12px;
  --r-lg:20px;
  --r-pill:999px;

  /* ---- Shadow ---- */
  --shadow-sm:0 1px 2px rgba(15,23,42,.06);
  --shadow-md:0 6px 20px -6px rgba(15,23,42,.14);
  --shadow-lg:0 20px 45px -12px rgba(15,23,42,.22);
  --shadow-brand:0 14px 32px -10px rgba(10,59,48,.35);

  /* ---- Motion ---- */
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --dur-fast:150ms;
  --dur-base:250ms;
  --dur-slow:420ms;

  --container:1240px;
}

:root[data-theme="dark"]{
  --bg:#0a1210;
  --bg-alt:#0e1815;
  --surface:#111d1a;
  --surface-raised:#152420;
  --fg:#eef3f1;
  --fg-muted:#a9bab3;
  --fg-subtle:#7f948d;
  --border:#20322c;
  --border-strong:#2b4038;
  --brand:var(--brand-400);
  --brand-strong:var(--brand-400);
  --brand-soft:#12352a;
  --accent:var(--accent-400);
  --ring:var(--brand-400);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 6px 20px -6px rgba(0,0,0,.5);
  --shadow-lg:0 20px 45px -12px rgba(0,0,0,.6);
  --shadow-brand:0 14px 32px -10px rgba(0,0,0,.55);
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0a1210;
    --bg-alt:#0e1815;
    --surface:#111d1a;
    --surface-raised:#152420;
    --fg:#eef3f1;
    --fg-muted:#a9bab3;
    --fg-subtle:#7f948d;
    --border:#20322c;
    --border-strong:#2b4038;
    --brand:var(--brand-400);
    --brand-strong:var(--brand-400);
    --brand-soft:#12352a;
    --accent:var(--accent-400);
    --ring:var(--brand-400);
    --shadow-sm:0 1px 2px rgba(0,0,0,.4);
    --shadow-md:0 6px 20px -6px rgba(0,0,0,.5);
    --shadow-lg:0 20px 45px -12px rgba(0,0,0,.6);
    --shadow-brand:0 14px 32px -10px rgba(0,0,0,.55);
  }
}

/* ---- Reset ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}
body{
  font-family:var(--font-body);
  font-size:var(--fs-base);
  line-height:1.65;
  color:var(--fg);
  background:var(--bg);
  min-height:100dvh;
  -webkit-font-smoothing:antialiased;
  transition:background var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out);
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
input,textarea,select{font:inherit;color:inherit}
ul,ol{list-style:none}
h1,h2,h3,h4{font-family:var(--font-head);line-height:1.15;font-weight:700;letter-spacing:-.01em}
:focus-visible{outline:2.5px solid var(--ring);outline-offset:3px;border-radius:4px}

/* ---- Layout ---- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--sp-5)}
@media (max-width:640px){.container{padding-inline:var(--sp-4)}}
.section{padding-block:var(--sp-11)}
@media (max-width:768px){.section{padding-block:var(--sp-9)}}
.section-tight{padding-block:var(--sp-8)}

.eyebrow{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  font-family:var(--font-head);font-size:var(--fs-xs);font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:var(--brand-strong);
  background:var(--brand-soft);padding:.4rem .9rem;border-radius:var(--r-pill);
}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:currentColor}

h1,.h1{font-size:var(--fs-4xl)}
h2,.h2{font-size:var(--fs-2xl)}
h3,.h3{font-size:var(--fs-lg)}
@media (max-width:768px){
  h1,.h1{font-size:var(--fs-3xl)}
  h2,.h2{font-size:var(--fs-xl)}
}
.lede{font-size:var(--fs-md);color:var(--fg-muted);line-height:1.6}
.eyebrow + h1, .eyebrow + h2{margin-top:var(--sp-4)}

.text-muted{color:var(--fg-muted)}
.text-subtle{color:var(--fg-subtle)}
.text-brand{color:var(--brand-strong)}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);
  padding:.85rem 1.6rem;border-radius:var(--r-sm);border:1.5px solid transparent;
  transition:transform var(--dur-fast) var(--ease-out),
             box-shadow var(--dur-fast) var(--ease-out),
             background var(--dur-fast) var(--ease-out),
             border-color var(--dur-fast) var(--ease-out),
             color var(--dur-fast) var(--ease-out);
  white-space:nowrap;
}
.btn svg{width:1.1em;height:1.1em}
.btn:active{transform:translateY(1px) scale(.98)}
.btn-primary{background:var(--brand-800);color:#fff;box-shadow:var(--shadow-brand)}
.btn-primary:hover{background:var(--brand-700);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn-accent{background:var(--accent-500);color:#231402}
.btn-accent:hover{background:var(--accent-400);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn-ghost{background:transparent;border-color:var(--border-strong);color:var(--fg)}
.btn-ghost:hover{border-color:var(--brand);color:var(--brand-strong);background:var(--brand-soft)}
.btn-lg{padding:1.05rem 2rem;font-size:var(--fs-base)}
.btn-sm{padding:.55rem 1.05rem;font-size:var(--fs-xs)}
.btn-block{width:100%}
.btn[disabled]{opacity:.55;cursor:not-allowed;pointer-events:none}

/* ---- Cards ---- */
.card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);
  transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out);
}
.card-hover:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--border-strong)}

.badge{
  display:inline-flex;align-items:center;gap:.35rem;font-family:var(--font-head);
  font-size:.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:.3rem .65rem;border-radius:var(--r-pill);background:var(--brand-soft);color:var(--brand-strong);
}
.badge-accent{background:var(--accent-100);color:var(--accent-600)}
.badge-outline{background:transparent;border:1px solid var(--border-strong);color:var(--fg-muted)}

/* ---- Nav ---- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out);
}
.site-header.is-scrolled{border-bottom-color:var(--border);box-shadow:var(--shadow-sm)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-5);padding-block:var(--sp-3);min-height:76px}
.brand-mark{display:flex;align-items:center;gap:.6rem;font-family:var(--font-head);font-weight:700;font-size:1.15rem;color:var(--fg)}
.brand-mark .mark{
  width:38px;height:38px;border-radius:10px;
  background:linear-gradient(135deg,var(--brand-600),var(--brand-900));
  display:flex;align-items:center;justify-content:center;color:#fff;flex:none;
  box-shadow:var(--shadow-brand);
}
.brand-mark .mark svg{width:20px;height:20px}
.nav-links{display:flex;align-items:center;gap:var(--sp-6)}
.nav-links a{
  font-family:var(--font-head);font-size:var(--fs-sm);font-weight:500;color:var(--fg-muted);
  position:relative;padding-block:.3rem;transition:color var(--dur-fast) var(--ease-out);
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--brand);
  transition:width var(--dur-base) var(--ease-out);
}
.nav-links a:hover,.nav-links a.active{color:var(--fg)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-actions{display:flex;align-items:center;gap:var(--sp-3)}
.nav-toggle{display:none;background:none;border:none;color:var(--fg);padding:.4rem}
.nav-toggle svg{width:26px;height:26px}

/* ---- Nav dropdown (Insights) ---- */
.nav-dropdown{position:relative}
.nav-drop-trigger{
  display:inline-flex;align-items:center;gap:.3rem;background:none;border:none;
  font-family:var(--font-head);font-size:var(--fs-sm);font-weight:500;color:var(--fg-muted);
  padding-block:.3rem;transition:color var(--dur-fast) var(--ease-out);
}
.nav-drop-trigger svg{width:14px;height:14px;transition:transform var(--dur-fast) var(--ease-out)}
.nav-dropdown:hover .nav-drop-trigger,.nav-dropdown.is-open .nav-drop-trigger{color:var(--fg)}
.nav-dropdown.is-open .nav-drop-trigger svg{transform:rotate(180deg)}
.nav-dropdown-menu{
  position:absolute;top:calc(100% + 14px);left:50%;transform:translate(-50%,-8px);min-width:230px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-lg);
  padding:.5rem;opacity:0;pointer-events:none;transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out);
  z-index:110;
}
.nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown.is-open .nav-dropdown-menu{
  opacity:1;pointer-events:auto;transform:translate(-50%,0);
}
.nav-dropdown-menu a{
  display:block;padding:.65rem .8rem;border-radius:8px;font-size:var(--fs-sm);color:var(--fg-muted);
  transition:all var(--dur-fast) var(--ease-out);
}
.nav-dropdown-menu a:hover{background:var(--brand-soft);color:var(--brand-strong)}
.nav-dropdown-menu a::after{content:none}

@media (max-width:960px){
  .nav-dropdown-menu{
    position:static;transform:none;opacity:1;pointer-events:auto;box-shadow:none;border:none;
    background:transparent;padding:0 0 0 var(--sp-4);display:none;
  }
  .nav-dropdown.is-open .nav-dropdown-menu{display:block}
  .nav-drop-trigger{width:100%;justify-content:space-between;padding-block:.85rem;border-bottom:1px solid var(--border)}
  .nav-dropdown-menu a{padding:.7rem 0;border-bottom:none}

  .nav-links{
    position:fixed;inset:76px 0 0 0;background:var(--bg);flex-direction:column;
    align-items:flex-start;padding:var(--sp-6) var(--sp-5);gap:var(--sp-2);
    transform:translateY(-12px);opacity:0;pointer-events:none;
    transition:transform var(--dur-base) var(--ease-out),opacity var(--dur-base) var(--ease-out);
    border-top:1px solid var(--border);overflow-y:auto;
  }
  .nav-links.is-open{transform:translateY(0);opacity:1;pointer-events:auto}
  .nav-links a{width:100%;padding:.85rem 0;font-size:var(--fs-md);border-bottom:1px solid var(--border)}
  .nav-toggle{display:inline-flex}
  .nav-actions .btn-ghost{display:none}
}
@media (max-width:480px){
  .nav-actions .btn-primary{display:none}
}

/* ---- Footer ---- */
.site-footer{background:var(--brand-900);color:#cfe6dc;padding-block:var(--sp-9) var(--sp-6)}
.site-footer a{color:#cfe6dc;opacity:.85;transition:opacity var(--dur-fast) var(--ease-out)}
.site-footer a:hover{opacity:1;color:#fff}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--sp-7)}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr}}
.footer-grid h4{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.08em;color:#fff;margin-bottom:var(--sp-4)}
.footer-grid li{margin-bottom:var(--sp-2);font-size:var(--fs-sm)}
.footer-bottom{
  margin-top:var(--sp-8);padding-top:var(--sp-5);border-top:1px solid rgba(255,255,255,.12);
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--sp-3);
  font-size:var(--fs-xs);color:#9fc2b4;
}

/* ---- Grid utilities ---- */
.grid{display:grid;gap:var(--sp-6)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

.split{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:var(--sp-9)}
.split-rev{grid-template-columns:.9fr 1.1fr}
@media (max-width:860px){
  /* !important beats any inline grid-template-columns set per-instance (e.g. sidebar widths).
     minmax(0,1fr), not plain 1fr, so a long unbreakable child (e.g. a nav label) can't force
     the track past the viewport width via its min-content size. */
  .split,.split-rev{grid-template-columns:minmax(0,1fr) !important;gap:var(--sp-6)}
  .split-rev>*:first-child{order:2}
  .split>*,.split-rev>*{min-width:0}
}

.flex{display:flex}
.flex-center{display:flex;align-items:center;justify-content:center}
.flex-between{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem}
.gap-2{gap:var(--sp-2)} .gap-3{gap:var(--sp-3)} .gap-4{gap:var(--sp-4)} .gap-5{gap:var(--sp-5)}

/* ---- Scroll reveal ---- */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
[data-reveal].is-visible{opacity:1;transform:translateY(0)}
[data-reveal-group]>*{opacity:0;transform:translateY(24px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
[data-reveal-group].is-visible>*{opacity:1;transform:translateY(0)}
[data-reveal-group].is-visible>*:nth-child(1){transition-delay:.03s}
[data-reveal-group].is-visible>*:nth-child(2){transition-delay:.11s}
[data-reveal-group].is-visible>*:nth-child(3){transition-delay:.19s}
[data-reveal-group].is-visible>*:nth-child(4){transition-delay:.27s}
[data-reveal-group].is-visible>*:nth-child(5){transition-delay:.35s}
[data-reveal-group].is-visible>*:nth-child(6){transition-delay:.43s}
@media (prefers-reduced-motion: reduce){
  [data-reveal],[data-reveal-group]>*{opacity:1 !important;transform:none !important}
}

/* ---- Hero decoration ---- */
.hero-glow{
  position:absolute;inset:0;overflow:hidden;z-index:-1;pointer-events:none;
}
.hero-glow span{
  position:absolute;border-radius:50%;filter:blur(70px);opacity:.35;
  animation:float 22s ease-in-out infinite;
}
.hero-glow span:nth-child(1){width:480px;height:480px;background:var(--brand-400);top:-160px;left:-120px}
.hero-glow span:nth-child(2){width:380px;height:380px;background:var(--accent-400);top:40px;right:-140px;animation-delay:-7s}
.hero-glow span:nth-child(3){width:320px;height:320px;background:var(--brand-600);bottom:-180px;left:35%;animation-delay:-14s}
@keyframes float{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(30px,-24px) scale(1.08)}
  66%{transform:translate(-24px,20px) scale(.95)}
}
@media (prefers-reduced-motion: reduce){.hero-glow span{animation:none}}

/* ---- Skip link ---- */
.skip-link{
  position:absolute;left:var(--sp-4);top:-60px;background:var(--brand-900);color:#fff;
  padding:.75rem 1.25rem;border-radius:var(--r-sm);z-index:200;transition:top var(--dur-fast) var(--ease-out);
}
.skip-link:focus{top:var(--sp-4)}

/* ---- Utility ---- */
.mt-1{margin-top:var(--sp-1)} .mt-2{margin-top:var(--sp-2)} .mt-3{margin-top:var(--sp-3)}
.mt-4{margin-top:var(--sp-4)} .mt-5{margin-top:var(--sp-5)} .mt-6{margin-top:var(--sp-6)} .mt-8{margin-top:var(--sp-8)}
.mb-2{margin-bottom:var(--sp-2)} .mb-3{margin-bottom:var(--sp-3)} .mb-4{margin-bottom:var(--sp-4)} .mb-5{margin-bottom:var(--sp-5)} .mb-6{margin-bottom:var(--sp-6)}
.text-center{text-align:center}
.max-w-sm{max-width:520px}
.max-w-md{max-width:720px}
.mx-auto{margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ==========================================================================
   Forms
   ========================================================================== */
.field{margin-bottom:var(--sp-5)}
.field label{
  display:block;font-family:var(--font-head);font-size:var(--fs-sm);font-weight:600;
  margin-bottom:.5rem;color:var(--fg);
}
.field .required{color:var(--danger-500);margin-left:.15rem}
.field .hint{display:block;font-size:var(--fs-xs);color:var(--fg-subtle);margin-top:.4rem}
.input,.textarea,.select{
  width:100%;padding:.85rem 1rem;border:1.5px solid var(--border-strong);border-radius:var(--r-sm);
  background:var(--surface);color:var(--fg);font-size:var(--fs-sm);
  transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out);
}
.input::placeholder,.textarea::placeholder{color:var(--fg-subtle)}
.input:focus,.textarea:focus,.select:focus{
  outline:none;border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-soft);
}
.textarea{resize:vertical;min-height:140px}
.field.has-error .input,.field.has-error .textarea,.field.has-error .select{border-color:var(--danger-500)}
.field.has-error .input:focus,.field.has-error .textarea:focus,.field.has-error .select:focus{box-shadow:0 0 0 4px var(--danger-100)}
.error-msg{
  display:none;align-items:center;gap:.35rem;font-size:var(--fs-xs);color:var(--danger-600);
  margin-top:.45rem;font-weight:600;
}
.field.has-error .error-msg{display:flex}
.error-msg svg{width:14px;height:14px;flex:none}
.checkbox-row{display:flex;align-items:flex-start;gap:.65rem;font-size:var(--fs-sm);color:var(--fg-muted)}
.checkbox-row input{margin-top:.3rem;width:17px;height:17px;accent-color:var(--brand-700)}
.pw-toggle{position:relative}
.pw-toggle button{
  position:absolute;right:.85rem;top:50%;transform:translateY(-50%);background:none;border:none;
  color:var(--fg-subtle);padding:.25rem;display:flex;
}
.pw-toggle button svg{width:19px;height:19px}
.form-status{
  display:none;align-items:center;gap:.6rem;padding:.9rem 1.1rem;border-radius:var(--r-sm);
  font-size:var(--fs-sm);font-weight:600;margin-top:var(--sp-4);
}
.form-status.is-success{display:flex;background:var(--brand-soft);color:var(--brand-strong)}
.form-status.is-error{display:flex;background:var(--danger-100);color:var(--danger-600)}
.form-status svg{width:19px;height:19px;flex:none}

/* ==========================================================================
   Alerts / toasts
   ========================================================================== */
.alert{
  display:flex;gap:var(--sp-3);padding:var(--sp-4);border-radius:var(--r-md);border:1px solid var(--border);
  background:var(--bg-alt);
}
.alert svg{width:22px;height:22px;flex:none;color:var(--brand-strong)}
.alert-title{font-family:var(--font-head);font-weight:700;margin-bottom:.2rem}

/* ==========================================================================
   Article / editorial
   ========================================================================== */
.article-meta{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--fs-xs);color:var(--fg-subtle);flex-wrap:wrap}
.article-meta .dot{width:3px;height:3px;border-radius:50%;background:currentColor}
.reading-progress{
  position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--brand-500),var(--accent-500));
  z-index:150;width:0%;transition:width 80ms linear;
}
.prose{max-width:720px;font-size:var(--fs-base);color:var(--fg)}
.prose h2{font-size:var(--fs-xl);margin-top:var(--sp-8);margin-bottom:var(--sp-3)}
.prose h3{font-size:var(--fs-md);margin-top:var(--sp-6);margin-bottom:var(--sp-2)}
.prose p{margin-bottom:var(--sp-4);color:var(--fg-muted)}
.prose ul,.prose ol{margin:0 0 var(--sp-4) var(--sp-5);color:var(--fg-muted)}
.prose ul{list-style:disc}.prose ol{list-style:decimal}
.prose li{margin-bottom:.5rem}
.prose blockquote{
  border-left:4px solid var(--brand-500);padding:.25rem var(--sp-5);margin:var(--sp-6) 0;
  font-family:var(--font-head);font-size:var(--fs-md);font-style:italic;color:var(--fg);
}
.prose strong{color:var(--fg);font-weight:700}
.prose figure{margin:var(--sp-6) 0}
.prose figcaption{font-size:var(--fs-xs);color:var(--fg-subtle);margin-top:.5rem}
.toc{
  border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-5);background:var(--bg-alt);
  position:sticky;top:100px;
}
.toc h4{font-family:var(--font-head);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--sp-3);color:var(--fg-subtle)}
.toc li{margin-bottom:.55rem}
.toc a{font-size:var(--fs-sm);color:var(--fg-muted);display:block;padding-left:var(--sp-3);border-left:2px solid var(--border);transition:all var(--dur-fast) var(--ease-out)}
.toc a:hover,.toc a.active{color:var(--brand-strong);border-left-color:var(--brand-500)}

/* ==========================================================================
   Tags / filters / pagination
   ========================================================================== */
.tag-pill{
  font-family:var(--font-head);font-size:var(--fs-xs);font-weight:600;padding:.5rem 1.05rem;
  border-radius:var(--r-pill);border:1.5px solid var(--border-strong);color:var(--fg-muted);
  background:var(--surface);transition:all var(--dur-fast) var(--ease-out);white-space:nowrap;
}
.tag-pill:hover{border-color:var(--brand);color:var(--brand-strong)}
.tag-pill.is-active{background:var(--brand-800);border-color:var(--brand-800);color:#fff}
.search-box{position:relative}
.search-box svg{position:absolute;left:1rem;top:50%;transform:translateY(-50%);width:19px;height:19px;color:var(--fg-subtle)}
.search-box input{padding-left:2.85rem}

/* ==========================================================================
   Quiz
   ========================================================================== */
.quiz-shell{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:var(--sp-7);box-shadow:var(--shadow-md);
}
.quiz-progress-track{height:8px;background:var(--border);border-radius:var(--r-pill);overflow:hidden;margin-bottom:var(--sp-6)}
.quiz-progress-fill{height:100%;background:linear-gradient(90deg,var(--brand-500),var(--brand-700));border-radius:var(--r-pill);width:0%;transition:width var(--dur-slow) var(--ease-out)}
.quiz-question{animation:quizIn .4s var(--ease-out)}
@keyframes quizIn{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}
@media (prefers-reduced-motion: reduce){.quiz-question{animation:none}}
.quiz-options{display:grid;gap:var(--sp-3);margin-top:var(--sp-5)}
.quiz-option{
  display:flex;align-items:center;gap:var(--sp-3);text-align:left;padding:var(--sp-4);
  border:1.5px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);
  transition:all var(--dur-fast) var(--ease-out);font-size:var(--fs-sm);
}
.quiz-option:hover{border-color:var(--brand);background:var(--brand-soft)}
.quiz-option .letter{
  width:28px;height:28px;border-radius:50%;border:1.5px solid var(--border-strong);flex:none;
  display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);
  transition:all var(--dur-fast) var(--ease-out);
}
.quiz-option.is-selected{border-color:var(--brand-700);background:var(--brand-soft)}
.quiz-option.is-selected .letter{background:var(--brand-700);border-color:var(--brand-700);color:#fff}
.quiz-option.is-correct{border-color:var(--brand-500);background:var(--brand-soft)}
.quiz-option.is-correct .letter{background:var(--brand-500);border-color:var(--brand-500);color:#fff}
.quiz-option.is-wrong{border-color:var(--danger-500);background:var(--danger-100)}
.quiz-option.is-wrong .letter{background:var(--danger-500);border-color:var(--danger-500);color:#fff}
.quiz-option:disabled{cursor:default}
.quiz-result{text-align:center;padding-block:var(--sp-6)}
.quiz-result .score-ring{width:140px;height:140px;margin:0 auto var(--sp-5)}

/* ==========================================================================
   Certificate
   ========================================================================== */
.certificate{
  background:var(--white);color:var(--slate-900);border-radius:var(--r-md);
  padding:var(--sp-9) var(--sp-8);position:relative;overflow:hidden;
  border:2px solid var(--brand-700);box-shadow:var(--shadow-lg);
}
.certificate::before{
  content:"";position:absolute;inset:12px;border:1.5px solid var(--accent-500);border-radius:calc(var(--r-md) - 6px);pointer-events:none;
}
.certificate .cert-seal{
  width:86px;height:86px;border-radius:50%;background:linear-gradient(135deg,var(--accent-400),var(--accent-600));
  display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-4);box-shadow:var(--shadow-md);
}
.certificate .cert-seal svg{width:44px;height:44px;color:#fff}
.certificate h3{font-family:var(--font-head);font-size:var(--fs-2xl);text-align:center}
.certificate .cert-name{font-family:var(--font-head);font-size:var(--fs-3xl);text-align:center;color:var(--brand-800);margin:var(--sp-4) 0}
.certificate .cert-meta{display:flex;justify-content:space-between;margin-top:var(--sp-7);font-size:var(--fs-xs);color:var(--slate-600);border-top:1px solid var(--slate-200);padding-top:var(--sp-4)}

/* ==========================================================================
   Dashboard
   ========================================================================== */
.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-5)}
.stat-card .stat-num{font-family:var(--font-head);font-size:var(--fs-2xl);font-weight:700;color:var(--brand-strong)}
.stat-card .stat-label{font-size:var(--fs-xs);color:var(--fg-subtle);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.progress-track{height:8px;background:var(--border);border-radius:var(--r-pill);overflow:hidden}
.progress-fill{height:100%;background:var(--brand-600);border-radius:var(--r-pill);transition:width .6s var(--ease-out)}
.dash-list-item{
  display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4);border:1px solid var(--border);
  border-radius:var(--r-md);background:var(--surface);flex-wrap:wrap;
}
.dash-list-item>div{min-width:0}
.dash-list-item strong,.dash-list-item p{overflow-wrap:break-word}
.avatar{
  width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--brand-500),var(--brand-800));
  color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;flex:none;
}

/* ==========================================================================
   Theme toggle
   ========================================================================== */
.theme-toggle{
  width:40px;height:40px;border-radius:50%;border:1.5px solid var(--border-strong);background:var(--surface);
  color:var(--fg);display:flex;align-items:center;justify-content:center;transition:all var(--dur-fast) var(--ease-out);
}
.theme-toggle:hover{border-color:var(--brand);color:var(--brand-strong)}
.theme-toggle svg{width:19px;height:19px}
.theme-toggle .sun{display:none}
:root[data-theme="dark"] .theme-toggle .moon{display:none}
:root[data-theme="dark"] .theme-toggle .sun{display:block}

/* ==========================================================================
   Breadcrumbs / back-to-top
   ========================================================================== */
.breadcrumbs{display:flex;align-items:center;gap:.5rem;font-size:var(--fs-xs);color:var(--fg-subtle);flex-wrap:wrap}
.breadcrumbs a:hover{color:var(--brand-strong)}
.breadcrumbs svg{width:13px;height:13px}
.back-to-top{
  position:fixed;right:var(--sp-5);bottom:var(--sp-5);width:48px;height:48px;border-radius:50%;
  background:var(--brand-800);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow-lg);opacity:0;transform:translateY(12px);pointer-events:none;
  transition:all var(--dur-base) var(--ease-out);z-index:90;border:none;
}
.back-to-top.is-visible{opacity:1;transform:translateY(0);pointer-events:auto}
.back-to-top:hover{background:var(--brand-700);transform:translateY(-3px)}
.back-to-top svg{width:20px;height:20px}

/* ==========================================================================
   Misc: testimonial, banner
   ========================================================================== */
.cta-banner{
  background:linear-gradient(135deg,var(--brand-900),var(--brand-700));color:#fff;border-radius:var(--r-lg);
  padding:var(--sp-9);position:relative;overflow:hidden;
}
.cta-banner h2{color:#fff}
.cta-banner p{color:#cfe6dc}
.testimonial{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-6);
}
.testimonial .stars{display:flex;gap:.15rem;color:var(--accent-500);margin-bottom:var(--sp-3)}
.testimonial .stars svg{width:16px;height:16px}
.testimonial p{font-size:var(--fs-md);color:var(--fg);margin-bottom:var(--sp-4);font-family:var(--font-head);font-weight:500;line-height:1.5}
.testimonial .person{display:flex;align-items:center;gap:var(--sp-3)}
.testimonial .person-name{font-weight:700;font-size:var(--fs-sm)}
.testimonial .person-role{font-size:var(--fs-xs);color:var(--fg-subtle)}

/* ==========================================================================
   Course lesson navigation
   ========================================================================== */
.lesson-nav{display:grid;gap:.4rem}
.lesson-nav-item{
  display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:var(--r-sm);
  border:1px solid transparent;background:none;text-align:left;width:100%;
  transition:all var(--dur-fast) var(--ease-out);color:var(--fg-muted);
}
.lesson-nav-item .num{
  width:26px;height:26px;border-radius:50%;border:1.5px solid var(--border-strong);flex:none;
  display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-size:var(--fs-xs);font-weight:700;
  transition:all var(--dur-fast) var(--ease-out);
}
.lesson-nav-item span.label{font-size:var(--fs-sm)}
.lesson-nav-item:hover{background:var(--bg-alt)}
.lesson-nav-item.is-active{background:var(--brand-soft);border-color:var(--brand-500);color:var(--brand-strong)}
.lesson-nav-item.is-active .num{background:var(--brand-700);border-color:var(--brand-700);color:#fff}
.lesson-nav-item.is-done .num{background:var(--brand-500);border-color:var(--brand-500);color:#fff}
.lesson-nav-item.is-done .num::before{content:"\2713"}
.lesson-nav-item.is-done.is-active .num::before{content:"\2713"}

/* ==========================================================================
   Print (certificate only)
   ========================================================================== */
@media print{
  body *{visibility:hidden}
  .certificate,.certificate *{visibility:visible}
  .certificate{position:absolute;top:0;left:0;width:100%;box-shadow:none;border-width:1px}
}

/* Editorial homepage */
.hub-hero{position:relative;overflow:hidden;padding:clamp(4.5rem,8vw,7.5rem) 0;background:linear-gradient(90deg,rgba(6,40,33,.98) 0%,rgba(6,40,33,.94) 42%,rgba(6,40,33,.54) 68%,rgba(6,40,33,.18) 100%),url('../images/hse-field-inspection-hero.jpg') center/cover no-repeat;color:#fff}
.hub-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 55%,rgba(62,192,144,.1) 55% 56%,transparent 56% 100%)}
.hub-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.72fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.hub-hero-copy h1{max-width:780px;margin-top:1.15rem;color:#fff;font-size:clamp(2.65rem,5.3vw,5.2rem);line-height:1.02;letter-spacing:-.045em}
.hub-hero-copy>p{max-width:670px;margin-top:1.5rem;color:#c9d9d3;font-size:clamp(1.08rem,1.5vw,1.3rem);line-height:1.65}
.eyebrow-light{color:#a9dac7}.eyebrow-light .dot{background:var(--accent-400)}
.hub-hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem}
.btn-hero-secondary{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.06);color:#fff}.btn-hero-secondary:hover{background:rgba(255,255,255,.13);border-color:#fff}
.trust-row{display:flex;gap:1.4rem;flex-wrap:wrap;margin-top:2rem;color:#c9d9d3;font-size:var(--fs-sm);font-weight:600}.trust-row li{display:flex;align-items:center;gap:.55rem}.trust-row li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brand-400);box-shadow:0 0 0 4px rgba(62,192,144,.13)}
.field-brief{background:#fff;color:var(--slate-900);border-radius:2px;box-shadow:0 28px 70px rgba(0,0,0,.32);overflow:hidden;transform:rotate(1deg)}
.field-brief-top{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 1.25rem;background:var(--accent-500);color:#2d1b00;text-transform:uppercase;letter-spacing:.09em;font-size:.72rem;font-weight:800}
.field-brief-main{padding:clamp(1.6rem,3vw,2.5rem)}.field-brief-main h2{margin:.55rem 0 .9rem;font-size:clamp(1.55rem,2.5vw,2.2rem);line-height:1.12}.field-brief-main p{color:var(--slate-600);font-size:var(--fs-sm)}
.brief-kicker{color:var(--brand-700);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.field-brief-main a{display:inline-flex;margin-top:1.25rem;color:var(--brand-800);font-weight:800;font-size:var(--fs-sm)}
.brief-regions{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--slate-200)}.brief-regions div{padding:1rem 1.25rem}.brief-regions div+div{border-left:1px solid var(--slate-200)}.brief-regions span,.brief-regions strong{display:block}.brief-regions span{color:var(--slate-500);font-size:.7rem;text-transform:uppercase;letter-spacing:.09em}.brief-regions strong{margin-top:.2rem;font-size:.82rem}
.quick-access{border-bottom:1px solid var(--border);background:var(--surface)}.quick-access-inner{display:flex;align-items:center;overflow-x:auto}.quick-access-inner>*{white-space:nowrap;padding:1rem 1.4rem;border-right:1px solid var(--border)}.quick-access-inner a{font-size:var(--fs-sm);font-weight:700}.quick-access-inner a:hover{color:var(--brand-strong);background:var(--brand-soft)}.quick-label{padding-left:0;color:var(--fg-subtle);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.09em}
.section-intro{display:flex;justify-content:space-between;gap:2rem;align-items:end;margin-bottom:2.5rem}.section-intro>p{max-width:420px;color:var(--fg-muted)}
.audience-section{background:var(--bg-alt)}.audience-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.audience-card{position:relative;min-height:370px;padding:2rem;background:var(--surface);display:flex;flex-direction:column;align-items:flex-start;transition:background var(--dur-base),transform var(--dur-base)}.audience-card:hover{z-index:1;transform:translateY(-5px);box-shadow:var(--shadow-lg)}.audience-card h3{margin-top:3rem;font-size:var(--fs-xl)}.audience-card p{margin-top:1rem;color:var(--fg-muted)}.audience-card strong{margin-top:auto;padding-top:2rem;color:var(--brand-strong);font-size:var(--fs-sm)}
.audience-card-primary{background:var(--brand-800);color:#fff}.audience-card-primary p{color:#cfe6dc}.audience-card-primary strong{color:var(--accent-400)}.audience-number{position:absolute;right:1.5rem;top:1.2rem;color:var(--border-strong);font:700 3.5rem/1 var(--font-head);opacity:.65}.audience-card-primary .audience-number{color:rgba(255,255,255,.15)}
.critical-risk-section{background:#8c1d24;color:#fff}.critical-risk-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,6vw,6rem);align-items:center}.critical-risk-grid h2{color:#fff;font-size:clamp(2rem,4vw,3.35rem)}.critical-risk-grid p{color:#f3d9da;max-width:580px}.risk-list{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.25)}.risk-list span{padding:1rem 1.15rem;border-bottom:1px solid rgba(255,255,255,.17);font-size:var(--fs-sm);font-weight:700}.risk-list span:nth-child(odd){border-right:1px solid rgba(255,255,255,.17)}
@media(max-width:900px){.hub-hero{background-position:62% center}.hub-hero-grid,.critical-risk-grid{grid-template-columns:1fr}.field-brief{transform:none;max-width:620px}.audience-grid{grid-template-columns:1fr}.audience-card{min-height:300px}.section-intro{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.hub-hero{padding:3.5rem 0}.hub-hero-copy h1{font-size:2.55rem}.hub-hero-actions .btn{width:100%}.trust-row{display:grid}.field-brief-top{font-size:.62rem}.brief-regions,.risk-list{grid-template-columns:1fr}.brief-regions div+div,.risk-list span:nth-child(odd){border-left:0;border-right:0}.quick-access-inner>*{padding:.9rem 1rem}}

/* Industrial editorial direction, adapted from the supplied reference */
.hub-hero{isolation:isolate;min-height:720px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(247,247,244,.99) 0%,rgba(247,247,244,.97) 38%,rgba(247,247,244,.72) 57%,rgba(247,247,244,.12) 84%),url('../images/hse-field-inspection-hero.jpg') 70% center/cover no-repeat;color:var(--slate-900)}
.hub-hero::before{z-index:-1;background:radial-gradient(circle at 67% 48%,transparent 0 18%,rgba(15,90,69,.10) 18.2% 18.6%,transparent 18.8% 25%,rgba(15,90,69,.06) 25.2% 25.6%,transparent 25.8%),repeating-conic-gradient(from 45deg at 67% 48%,rgba(15,90,69,.08) 0 1deg,transparent 1deg 14deg);mask-image:radial-gradient(circle at 67% 48%,#000 0 32%,transparent 32.2%)}
.hub-hero::after{content:"";position:absolute;z-index:0;left:0;right:0;bottom:0;height:14px;background:repeating-linear-gradient(135deg,var(--accent-500) 0 12px,transparent 12px 22px)}
.hub-hero-grid{width:100%;grid-template-columns:minmax(0,1.05fr) minmax(310px,.55fr);gap:clamp(2rem,5vw,5rem)}
.hub-hero-copy{position:relative;z-index:2;max-width:780px}.hub-hero-copy::before{content:"HSE / KNOWLEDGE / PRACTICE";display:block;width:max-content;max-width:100%;margin-bottom:1rem;padding:.35rem .7rem;border-left:34px solid var(--accent-500);background:rgba(255,255,255,.76);color:var(--slate-500);font:700 .67rem/1 var(--font-head);letter-spacing:.12em}
.hub-hero-copy h1{color:var(--slate-900);font-family:'Barlow Condensed',var(--font-head);font-size:clamp(4rem,7vw,7.4rem);font-weight:800;line-height:.84;letter-spacing:-.025em;text-transform:uppercase;text-wrap:balance}.hub-hero-copy h1 span{display:block;color:var(--brand-700)}
.hub-hero-copy>p{max-width:620px;color:var(--slate-700);font-size:1.16rem;background:rgba(247,247,244,.88);border-left:3px solid var(--accent-500);padding:.65rem 1rem}
.hub-hero .eyebrow-light{color:var(--slate-600);font-size:.7rem;letter-spacing:.14em}.hub-hero .eyebrow-light .dot{border-radius:0;background:var(--accent-500)}
.hub-hero .btn-accent{border-radius:0;box-shadow:8px 8px 0 rgba(15,23,42,.12);text-transform:uppercase;letter-spacing:.04em}.hub-hero .btn-hero-secondary{border-radius:0;border-color:var(--slate-400);background:rgba(255,255,255,.72);color:var(--slate-900)}.hub-hero .btn-hero-secondary:hover{background:#fff;border-color:var(--slate-900)}
.hub-hero .trust-row{color:var(--slate-600);text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}.hub-hero .trust-row li::before{border-radius:0;background:var(--accent-500);box-shadow:none;transform:rotate(45deg)}
.field-brief{position:relative;z-index:2;align-self:end;margin-bottom:1rem;border:1px solid rgba(15,23,42,.25);border-radius:0;background:rgba(255,255,255,.91);box-shadow:14px 14px 0 rgba(15,23,42,.11);transform:none}.field-brief::before,.field-brief::after{content:"";position:absolute;width:20px;height:20px;border-color:var(--brand-700)}.field-brief::before{left:-5px;top:-5px;border-left:2px solid;border-top:2px solid}.field-brief::after{right:-5px;bottom:-5px;border-right:2px solid;border-bottom:2px solid}
.field-brief-top{background:var(--slate-900);color:#fff}.brief-kicker{display:inline-block;background:var(--accent-500);color:#2d1b00;padding:.25rem .45rem}.field-brief-main h2{font-family:'Barlow Condensed',var(--font-head);font-size:2.25rem;text-transform:uppercase}.field-brief-main a{text-transform:uppercase;letter-spacing:.05em}.brief-regions strong{text-transform:uppercase;font-family:'Barlow Condensed',var(--font-head);font-size:1rem;letter-spacing:.03em}
.quick-access{border-top:0}.quick-access::before{content:"";display:block;height:6px;background:repeating-linear-gradient(135deg,var(--accent-500) 0 8px,transparent 8px 15px)}
.quick-access-inner a{text-transform:uppercase;letter-spacing:.04em}.quick-label{color:var(--brand-700)}
@media(max-width:900px){.hub-hero{min-height:auto;background:linear-gradient(90deg,rgba(247,247,244,.98),rgba(247,247,244,.86)),url('../images/hse-field-inspection-hero.jpg') center/cover no-repeat}.hub-hero::before{opacity:.45}.hub-hero-grid{grid-template-columns:1fr}.field-brief{max-width:560px;align-self:auto}.hub-hero-copy h1{font-size:clamp(3.8rem,12vw,6.5rem)}}
@media(max-width:560px){.hub-hero-copy h1{font-size:3.65rem}.hub-hero-copy::before{border-left-width:20px}.field-brief-main h2{font-size:1.8rem}}

/* Learning catalogue */
.course-catalogue-hero{position:relative;padding:var(--sp-9) 0 var(--sp-10);overflow:hidden;background:#f5f5f1;border-bottom:1px solid var(--border)}
.course-catalogue-hero::after{content:"";position:absolute;right:-4rem;bottom:-7rem;width:390px;height:390px;border:1px solid rgba(15,90,69,.13);border-radius:50%;box-shadow:0 0 0 45px rgba(15,90,69,.03),0 0 0 90px rgba(15,90,69,.025)}
.course-catalogue-hero .container{position:relative;z-index:1}.catalogue-heading{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.65fr);gap:2rem;align-items:end}.catalogue-heading .eyebrow{grid-column:1/-1}.catalogue-heading h1{font-family:'Barlow Condensed',var(--font-head);font-size:clamp(3.7rem,7vw,7rem);line-height:.9;text-transform:uppercase;max-width:800px}.catalogue-heading p{margin:0;border-left:3px solid var(--accent-500);padding-left:1.2rem;color:var(--slate-600)}
.course-catalogue{background:var(--bg)}.catalogue-tools{display:flex;align-items:center;justify-content:space-between;gap:2rem;margin-bottom:2.6rem}.catalogue-tabs{display:flex;gap:.35rem;flex-wrap:wrap}.catalogue-tabs .tag-pill{border:0;border-radius:0;border-bottom:2px solid transparent;background:transparent;padding:.7rem .75rem;color:var(--fg-subtle)}.catalogue-tabs .tag-pill:hover{color:var(--fg);border-bottom-color:var(--border-strong)}.catalogue-tabs .tag-pill.is-active{background:transparent;border-bottom-color:var(--accent-500);color:var(--fg)}
.catalogue-search{position:relative;display:block;width:min(360px,100%)}.catalogue-search input{border-radius:0;padding-right:3rem;background:var(--bg-alt)}.catalogue-search svg{position:absolute;right:1rem;top:50%;width:20px;height:20px;transform:translateY(-50%);color:var(--fg-subtle)}
.learning-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}.learning-card{min-width:0;background:var(--surface);border:1px solid var(--border);display:flex;flex-direction:column;transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),border-color var(--dur-base)}a.learning-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--border-strong)}
.learning-card-image{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--slate-100)}.learning-card-image img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.03);transition:transform .55s var(--ease-out),filter .4s}.learning-card:hover .learning-card-image img{transform:scale(1.035);filter:saturate(.95) contrast(1.03)}.course-state{position:absolute;left:0;bottom:0;padding:.45rem .7rem;background:var(--accent-500);color:#291900;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.course-state-upcoming{background:rgba(15,23,42,.9);color:#fff}
.learning-card-body{display:flex;flex:1;flex-direction:column;padding:1.5rem}.learning-type{display:flex;justify-content:space-between;gap:1rem;color:var(--fg-subtle);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.learning-card h2{margin-top:1.25rem;font-size:1.35rem;line-height:1.22}.learning-card p{margin-top:.8rem;color:var(--fg-muted);font-size:var(--fs-sm)}.learning-meta{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:1.15rem;color:var(--fg-subtle);font-size:.72rem}.learning-meta span+span::before{content:"·";margin-right:.55rem}.learning-action{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:1.5rem;color:var(--brand-strong);font-size:var(--fs-sm);font-weight:800;text-transform:uppercase;letter-spacing:.04em}.learning-action-muted{color:var(--fg-subtle)}
.upcoming-cover{position:relative;aspect-ratio:3/2;overflow:hidden;padding:1.5rem;background:linear-gradient(135deg,#e9ece8,#f8f8f5);color:var(--brand-800)}.upcoming-cover::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 18px,rgba(15,90,69,.07) 18px 19px)}.upcoming-cover span{position:relative;font:800 clamp(4rem,8vw,7rem)/1 'Barlow Condensed',sans-serif;color:rgba(15,90,69,.13)}.upcoming-cover strong{position:absolute;left:1.5rem;right:1.5rem;bottom:1.4rem;font:800 1rem/1 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.08em}.upcoming-cover-alt{background:linear-gradient(135deg,#f4ead8,#faf8f4);color:#7b4d09}.upcoming-cover-alt::before{background:repeating-linear-gradient(135deg,transparent 0 18px,rgba(194,118,10,.09) 18px 19px)}.upcoming-cover-alt span{color:rgba(194,118,10,.16)}
@media(max-width:900px){.catalogue-heading{grid-template-columns:1fr}.catalogue-tools{align-items:stretch;flex-direction:column}.learning-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalogue-search{width:100%}}
@media(max-width:620px){.course-catalogue-hero{padding-top:var(--sp-7)}.catalogue-heading h1{font-size:3.65rem}.learning-grid{grid-template-columns:1fr}.catalogue-tabs{flex-wrap:nowrap;overflow-x:auto}.catalogue-tabs .tag-pill{white-space:nowrap}.learning-card h2{font-size:1.5rem}}

/* Evidence library and long-form editorial */
.library-hero{padding:clamp(4.5rem,8vw,8rem) 0;background:linear-gradient(125deg,#071f1a 0%,#0b4c3b 72%,#0d6a50 100%);color:#fff;border-bottom:10px solid var(--accent-500)}
.library-hero h1{max-width:980px;color:#fff;font-family:'Barlow Condensed',var(--font-head);font-size:clamp(3.5rem,7vw,7rem);line-height:.9;text-transform:uppercase}
.library-hero>div>p:last-child{max-width:760px;margin-top:1.5rem;color:#cfe3dc;font-size:1.15rem}.library-intro{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:end;margin-bottom:3rem}.library-intro h2{max-width:650px}.library-intro>p{color:var(--fg-muted)}
.evidence-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}.evidence-card{display:flex;min-width:0;flex-direction:column;background:var(--surface);border:1px solid var(--border);transition:transform .25s,box-shadow .25s}.evidence-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.evidence-card-image{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--slate-100)}.evidence-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .45s}.evidence-card:hover img{transform:scale(1.03)}.evidence-card-copy{display:flex;flex:1;flex-direction:column;padding:1.4rem}.evidence-card-copy h2{margin-top:1rem;font-size:1.45rem;line-height:1.18}.evidence-card-copy p{margin:1rem 0;color:var(--fg-muted);font-size:.92rem}.evidence-card-copy .text-link{margin-top:auto;color:var(--brand-strong);font-weight:800}
.tag-row{display:flex;gap:.45rem;flex-wrap:wrap}.badge{display:inline-flex;padding:.3rem .55rem;background:var(--brand-soft);color:var(--brand-800);font-size:.66rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.evidence-header{padding:clamp(3.5rem,7vw,7rem) 0 3rem;background:#f1f3ef;border-bottom:1px solid var(--border)}.evidence-header h1{margin-top:1rem;font-family:'Barlow Condensed',var(--font-head);font-size:clamp(3.2rem,6vw,6.25rem);line-height:.92;text-transform:uppercase}.evidence-header .lede{max-width:780px;margin-top:1.4rem;color:var(--slate-600);font-size:clamp(1.08rem,1.8vw,1.3rem)}.breadcrumbs{display:flex;gap:.5rem;margin-bottom:1.4rem;color:var(--fg-subtle);font-size:.78rem}.article-byline{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.5rem;color:var(--fg-subtle);font-size:.78rem}.article-byline span+span::before{content:'·';margin-right:1rem}
.evidence-hero{margin:3rem 0 0;aspect-ratio:16/9;overflow:hidden;background:var(--slate-100)}.evidence-hero img{width:100%;height:100%;object-fit:cover}.article-layout{display:grid;grid-template-columns:minmax(0,760px) minmax(210px,280px);gap:clamp(3rem,7vw,7rem);justify-content:center;padding-top:4rem;padding-bottom:5rem}.evidence-body section+section{margin-top:2.7rem}.evidence-body h2{font-size:clamp(1.6rem,2.6vw,2.2rem)}.evidence-body p{margin-top:.9rem;color:var(--slate-700);font-size:1.06rem;line-height:1.82}.toc{position:sticky;top:110px;align-self:start;border-left:2px solid var(--accent-500);padding-left:1.25rem}.toc strong{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}.toc ol{margin-top:.8rem;display:grid;gap:.65rem}.toc a{color:var(--fg-muted);font-size:.78rem}.leader-actions{padding:1.5rem;border-left:5px solid var(--accent-500);background:#f4f6f2}.sources{padding-top:2rem;border-top:1px solid var(--border)}.sources ol{margin:1rem 0 0 1.2rem;display:grid;gap:.8rem}.sources a{color:var(--brand-700);text-decoration:underline}.article-review{padding:1.4rem;background:var(--slate-900);color:#fff}.article-review p{color:#d8e0dd;font-size:.86rem}.related-strip{padding:3rem 0;background:var(--brand-800);color:#fff}.related-strip h2{color:#fff}.related-strip a{color:#a8e2cc;font-weight:800}
@media(max-width:960px){.evidence-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout{grid-template-columns:minmax(0,760px)}.toc{position:static;grid-row:1;border-left:0;border-top:2px solid var(--accent-500);padding:1rem 0 0}.toc ol{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.library-intro,.evidence-grid{grid-template-columns:1fr}.library-hero h1,.evidence-header h1{font-size:3.4rem}.article-byline{display:grid;gap:.35rem}.article-byline span+span::before{content:none}.article-layout{padding-top:2.5rem}.toc ol{grid-template-columns:1fr}.evidence-body p{font-size:1rem}.evidence-hero{margin-top:1.5rem}}

/* Comparative safety-law course */
.law-course-hero{padding:clamp(3.5rem,7vw,6.5rem) 0;background:#071f1a;color:#fff;border-bottom:9px solid var(--accent-500)}.law-course-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}.law-course-hero h1{margin-top:1.25rem;color:#fff;font-family:'Barlow Condensed',var(--font-head);font-size:clamp(3.3rem,6vw,6rem);line-height:.9;text-transform:uppercase}.law-course-hero p{max-width:680px;margin-top:1.25rem;color:#cde1da;font-size:1.15rem}.law-course-hero img{width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid rgba(255,255,255,.25);box-shadow:14px 14px 0 rgba(255,255,255,.08)}.law-course-meta{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.5rem;color:#a8c8bc;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}.law-course-meta span+span::before{content:'·';margin-right:1rem}.legal-boundary{padding:1.4rem 1.6rem;border-left:5px solid var(--accent-500);background:#f5f0df}.legal-boundary strong{color:#5f4200;text-transform:uppercase;letter-spacing:.05em;font-size:.8rem}.legal-boundary p{margin-top:.55rem;color:#4b4537}.legal-boundary.caution{margin-top:2rem;border-color:#a52b32;background:#fbefef}.legal-boundary.caution strong{color:#8c1d24}.law-learning-layout{display:grid;grid-template-columns:230px minmax(0,780px);gap:clamp(3rem,7vw,7rem);justify-content:center}.law-module-nav{position:sticky;top:100px;align-self:start;display:grid;border-left:2px solid var(--accent-500);padding-left:1rem}.law-module-nav strong{margin-bottom:.8rem;text-transform:uppercase;letter-spacing:.08em;font-size:.75rem}.law-module-nav a{padding:.55rem 0;color:var(--fg-muted);font-size:.82rem}.law-module-nav a:hover{color:var(--brand-700)}.law-course-body>section{scroll-margin-top:110px}.module-kicker{display:block;margin-bottom:.7rem;color:var(--brand-700);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.comparison-table{overflow-x:auto;margin-top:1.5rem}.comparison-table table{width:100%;min-width:650px;border-collapse:collapse;font-size:.88rem}.comparison-table th,.comparison-table td{padding:.85rem;text-align:left;vertical-align:top;border:1px solid var(--border)}.comparison-table th{background:var(--brand-800);color:#fff}.comparison-table td:first-child{font-weight:700;background:var(--bg-alt)}.knowledge-check{display:grid;gap:.75rem;margin-top:1.5rem}.knowledge-check details{border:1px solid var(--border);background:var(--surface)}.knowledge-check summary{cursor:pointer;padding:1rem 1.1rem;font-weight:700}.knowledge-check details p{margin:0;padding:0 1.1rem 1rem;font-size:.95rem}.assessment-note{padding:1rem;border:1px solid var(--border);font-size:.9rem!important}.law-course-body ol{margin:1rem 0 0 1.3rem;display:grid;gap:.8rem}.law-course-body ol li{padding-left:.3rem;line-height:1.7}
@media(max-width:900px){.law-course-hero-grid,.law-learning-layout{grid-template-columns:1fr}.law-course-hero img{max-width:720px}.law-module-nav{position:static;grid-template-columns:1fr 1fr;border-left:0;border-top:2px solid var(--accent-500);padding:1rem 0 0}.law-module-nav strong{grid-column:1/-1}}
@media(max-width:560px){.law-course-hero h1{font-size:3.4rem}.law-course-meta{display:grid;gap:.35rem}.law-course-meta span+span::before{content:none}.law-module-nav{grid-template-columns:1fr}.law-module-nav strong{grid-column:auto}}

/* Source-grounded HSE assistant */
.assistant-page{background:#edf1ee}.assistant-main{min-height:calc(100vh - 80px)}.assistant-intro{padding:clamp(3rem,6vw,5.5rem) 0 8rem;background:#071f1a;color:#fff;border-bottom:8px solid var(--accent-500)}.assistant-intro h1{max-width:1000px;color:#fff;font-family:'Barlow Condensed',var(--font-head);font-size:clamp(3.4rem,7vw,6.6rem);line-height:.9;text-transform:uppercase}.assistant-intro p:last-child{max-width:760px;margin-top:1.25rem;color:#c9ded6;font-size:1.12rem}.assistant-shell{display:grid;grid-template-columns:280px minmax(0,1fr);gap:1.5rem;margin-top:-5rem;padding-bottom:5rem}.assistant-controls,.assistant-chat{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-lg)}.assistant-controls{align-self:start;padding:1.5rem}.assistant-controls h2{font-size:1.25rem}.assistant-controls label{display:grid;gap:.45rem;margin-top:1.1rem;color:var(--fg-muted);font-size:.78rem;font-weight:700}.assistant-controls input,.assistant-controls select,.assistant-composer textarea{width:100%;border:1px solid var(--border-strong);background:var(--bg);padding:.8rem;color:var(--fg);font:inherit}.assistant-boundary{margin:1.4rem 0;padding:1rem;border-left:4px solid #a52b32;background:#fbefef}.assistant-boundary strong{color:#8c1d24;font-size:.75rem;text-transform:uppercase}.assistant-boundary p{margin-top:.5rem;color:#534143;font-size:.8rem}.assistant-chat{display:flex;min-height:720px;flex-direction:column}.assistant-emergency{padding:.9rem 1.2rem;background:#8c1d24;color:#fff;font-size:.82rem}.assistant-messages{display:flex;flex:1;flex-direction:column;gap:1rem;overflow-y:auto;padding:1.5rem}.chat-message{max-width:85%;padding:1rem 1.1rem;background:var(--bg-alt);border-left:3px solid var(--brand-500)}.chat-message.user{align-self:flex-end;background:var(--brand-800);color:#fff;border:0}.chat-message>span{display:block;margin-bottom:.4rem;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.chat-message p{white-space:pre-wrap;line-height:1.65}.assistant-starters{display:flex;gap:.5rem;overflow-x:auto;padding:0 1.5rem 1rem}.assistant-starters button{flex:none;border:1px solid var(--border);background:var(--surface);padding:.65rem .8rem;color:var(--brand-700);font-size:.75rem}.assistant-composer{border-top:1px solid var(--border);padding:1.25rem}.assistant-composer textarea{resize:vertical;min-height:100px}.assistant-composer>div{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin-top:.75rem}.assistant-composer p{max-width:520px;color:var(--fg-subtle);font-size:.72rem}.hse-guide-launcher{position:fixed;z-index:90;right:1.2rem;bottom:1.2rem;display:grid;min-width:118px;padding:.7rem 1rem;background:var(--accent-500);color:#221600;box-shadow:0 10px 32px rgba(0,0,0,.25);text-transform:uppercase}.hse-guide-launcher span{font-size:.58rem;letter-spacing:.13em}.hse-guide-launcher strong{font-size:.85rem}.hse-guide-launcher:hover{transform:translateY(-2px);background:var(--accent-400)}
@media(max-width:850px){.assistant-shell{grid-template-columns:1fr;margin-top:-4rem}.assistant-controls{position:static}.assistant-chat{min-height:650px}}
@media(max-width:560px){.assistant-intro h1{font-size:3.55rem}.assistant-shell{padding-left:.75rem;padding-right:.75rem}.chat-message{max-width:94%}.assistant-composer>div{align-items:stretch;flex-direction:column}.assistant-composer button{width:100%}.hse-guide-launcher{right:.75rem;bottom:.75rem}}
.chat-sources{display:grid;gap:.35rem;margin-top:.8rem;padding-top:.8rem;border-top:1px solid var(--border);font-size:.74rem}.chat-sources a{color:var(--brand-700);text-decoration:underline}
.assistant-authorities{display:grid;gap:.35rem;margin:0 0 1.25rem;padding-top:1rem;border-top:1px solid var(--border)}.assistant-authorities strong{margin-bottom:.25rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}.assistant-authorities a{color:var(--brand-700);font-size:.76rem;text-decoration:underline}
.chat-message.assistant:has(.chat-answer){width:100%;max-width:100%;padding:0;background:transparent;border:0}.chat-message.assistant:has(.chat-answer)>span{margin:0 0 .65rem .15rem;color:var(--brand-700)}.chat-answer{display:grid;gap:.85rem;line-height:1.55}.chat-answer-section{display:grid;gap:.65rem;padding:1rem 1.1rem;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--brand-500);box-shadow:0 4px 14px rgba(7,31,26,.05)}.chat-answer-section h3{margin:0;padding-bottom:.55rem;border-bottom:1px solid var(--border);color:var(--brand-900);font-size:1rem;line-height:1.3}.chat-answer p{margin:0;color:var(--fg-muted);white-space:normal}.chat-answer ul,.chat-answer ol{display:grid;gap:.5rem;margin:0;padding-left:1.3rem;color:var(--fg-muted)}.chat-answer li{padding-left:.2rem}.chat-answer strong{font-weight:800;color:var(--brand-900)}.chat-answer a{color:var(--brand-700);font-weight:750;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.chat-answer a:hover{color:var(--brand-900);text-decoration-thickness:2px}

/* Evolution of industrial safety */
.evolution-hero{position:relative;overflow:hidden;padding:clamp(4rem,8vw,8rem) 0;background:#071f1a;color:#fff;border-bottom:12px solid var(--accent-500)}.evolution-hero::after{content:"";position:absolute;right:-12rem;top:-14rem;width:650px;height:650px;border:1px solid rgba(255,255,255,.1);border-radius:50%;box-shadow:0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.02)}.evolution-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.25fr .55fr;gap:clamp(3rem,8vw,8rem);align-items:end}.evolution-hero h1{max-width:950px;color:#fff;font-family:'Barlow Condensed',var(--font-head);font-size:clamp(4rem,7.5vw,7.6rem);line-height:.86;text-transform:uppercase}.evolution-hero p{max-width:760px;margin:1.5rem 0 2rem;color:#cce0d8;font-size:1.12rem}.evolution-era-stack{display:grid;border:1px solid rgba(255,255,255,.2)}.evolution-era-stack span{padding:1.2rem;border-bottom:1px solid rgba(255,255,255,.15);font-family:'Barlow Condensed',var(--font-head);font-size:1.15rem;text-transform:uppercase}.evolution-era-stack span:last-child{border:0;background:var(--accent-500);color:#251800}.evolution-thesis{background:#f5f5f1}.evolution-shifts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}.evolution-shifts article{min-height:250px;padding:1.5rem;background:var(--surface)}.evolution-shifts span{color:var(--accent-600);font:800 2.8rem/1 'Barlow Condensed',sans-serif}.evolution-shifts h3{margin-top:2.4rem;font-size:1.25rem}.evolution-shifts p{margin-top:.8rem;color:var(--fg-muted);font-size:.88rem}.archive-feature{padding:clamp(4rem,8vw,8rem) 0;background:#8c1d24;color:#fff}.archive-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,8vw,7rem);align-items:center}.archive-images{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:center}.archive-images img{width:100%;box-shadow:12px 14px 0 rgba(0,0,0,.16)}.archive-images img+img{transform:translateY(2rem) rotate(1.5deg)}.archive-feature h2{color:#fff;font-size:clamp(2.5rem,5vw,4.8rem)}.archive-feature p{margin-top:1.2rem;color:#f2d8da}.archive-feature .eyebrow{color:#ffd584}.archive-note{display:grid;gap:.35rem;margin-top:2rem;padding:1rem;border-left:4px solid var(--accent-400);background:rgba(0,0,0,.15)}.archive-note strong{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}.archive-note span{color:#f3e3e4;font-size:.83rem}.timeline-section{background:#eef1ed}.timeline-heading{display:flex;justify-content:space-between;gap:2rem;align-items:end;margin-bottom:2.5rem}.timeline-heading h2{max-width:760px}.timeline-filters{display:flex;gap:.35rem;flex-wrap:wrap;justify-content:flex-end}.timeline-filters button{border:1px solid var(--border-strong);background:transparent;padding:.55rem .75rem;color:var(--fg-muted);font-size:.72rem;font-weight:800;text-transform:uppercase}.timeline-filters button.is-active{background:var(--brand-800);border-color:var(--brand-800);color:#fff}.timeline-explorer{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.62fr);gap:2rem;align-items:start}.timeline-list{position:relative;display:grid;gap:.65rem;padding-left:2rem}.timeline-list::before{content:"";position:absolute;left:.55rem;top:0;bottom:0;width:2px;background:linear-gradient(var(--accent-500),var(--brand-700))}.timeline-event{position:relative;display:grid;grid-template-columns:95px 1fr auto;gap:1rem;align-items:center;width:100%;padding:1rem;text-align:left;border:1px solid var(--border);background:var(--surface);transition:transform .2s,border-color .2s,box-shadow .2s}.timeline-event::before{content:"";position:absolute;left:-1.82rem;width:12px;height:12px;border:3px solid #eef1ed;background:var(--brand-600);transform:rotate(45deg)}.timeline-event:hover,.timeline-event.is-active{transform:translateX(5px);border-color:var(--brand-500);box-shadow:var(--shadow-md)}.timeline-event.is-active{background:var(--brand-800);color:#fff}.timeline-event span{color:var(--brand-700);font:800 1.2rem/1 'Barlow Condensed',sans-serif}.timeline-event.is-active span{color:var(--accent-400)}.timeline-event strong{font-size:.92rem}.timeline-event small{color:var(--fg-subtle);font-size:.62rem;text-transform:uppercase;letter-spacing:.08em}.timeline-event.is-active small{color:#c8ddd5}.timeline-detail{position:sticky;top:100px;padding:2rem;background:#071f1a;color:#fff;border-top:7px solid var(--accent-500);box-shadow:var(--shadow-lg)}.timeline-detail>span{color:var(--accent-400);font:800 2.8rem/1 'Barlow Condensed',sans-serif}.timeline-detail h3{margin-top:.8rem;color:#fff;font-size:2rem}.timeline-detail>p{margin-top:1rem;color:#c7dbd4}.timeline-detail>div{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.18)}.timeline-detail>div strong{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}.timeline-detail>div p{margin-top:.6rem;color:#e2ebe8}.timeline-detail a{display:inline-flex;margin-top:1.5rem;color:var(--accent-400);font-weight:800}.timeline-detail [data-detail-source]{font-size:.7rem;color:#98b4aa}.evolution-models{background:#fff}.model-compare{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.model-compare article{padding:1.8rem;border-top:5px solid var(--brand-600);background:var(--bg-alt)}.model-compare article:nth-child(2){border-color:var(--accent-500)}.model-compare article:nth-child(3){border-color:#8c1d24}.model-compare p{margin-top:1rem;color:var(--fg-muted)}
@media(max-width:950px){.evolution-hero-grid,.archive-grid,.timeline-explorer{grid-template-columns:1fr}.evolution-era-stack{max-width:620px}.evolution-shifts{grid-template-columns:repeat(2,1fr)}.timeline-detail{position:static;grid-row:1}.timeline-heading{align-items:flex-start;flex-direction:column}.timeline-filters{justify-content:flex-start}.model-compare{grid-template-columns:1fr}}
@media(max-width:600px){.evolution-hero h1{font-size:4rem}.evolution-shifts,.archive-images{grid-template-columns:1fr}.archive-images img+img{display:none}.timeline-event{grid-template-columns:72px 1fr}.timeline-event small{display:none}.timeline-list{padding-left:1.4rem}.timeline-event::before{left:-1.25rem}.timeline-list::before{left:.35rem}.timeline-filters{flex-wrap:nowrap;max-width:100%;overflow-x:auto}.timeline-filters button{white-space:nowrap}.timeline-detail{padding:1.5rem}}
.archive-image img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;box-shadow:12px 14px 0 rgba(0,0,0,.16)}

/* Production learner accounts */
.auth-page{min-height:72vh;padding-top:clamp(3rem,7vw,7rem);background:linear-gradient(145deg,#edf4f0,#f8f7f1)}.auth-card{padding:clamp(1.4rem,4vw,2.4rem)}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin-bottom:1.6rem;padding:.35rem;background:var(--bg-alt)}.auth-tabs .btn{width:100%}.auth-card .checkbox-row a,.auth-card .text-link{color:var(--brand-700);text-decoration:underline}.account-hero{padding:clamp(3rem,7vw,6rem) 0;background:#071f1a;color:#fff;border-bottom:7px solid var(--accent-500)}.account-hero h1{color:#fff;font-size:clamp(2.8rem,6vw,5.2rem)}.account-hero p:last-child{margin-top:.8rem;color:#c9ded6}.account-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(290px,.65fr);gap:2rem;align-items:start}.account-panel{margin-bottom:1.5rem;padding:1.5rem;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm)}.account-panel h2{margin-bottom:1.2rem;font-size:1.35rem}.account-list{display:grid;gap:.75rem}.account-list-copy{min-width:0;flex:1}.account-list-copy strong{font-size:.9rem}.account-list-copy p{margin-top:.35rem;font-size:.75rem}.cert-avatar{background:var(--accent-500);color:#281b00;font-weight:900}.danger-panel{border-color:#d9a9ad}.danger-panel h2{color:#8c1d24}.danger-panel p{color:var(--fg-muted);font-size:.85rem}.verification-result{padding:1.6rem;border:1px solid var(--border);background:var(--surface)}.verification-result.is-valid{border-top:7px solid var(--brand-600)}.verification-result.is-invalid{border-top:7px solid #a52b32}.verification-result dl{display:grid;grid-template-columns:150px 1fr;gap:.65rem 1rem;margin-top:1.2rem}.verification-result dt{color:var(--fg-subtle);font-size:.75rem;text-transform:uppercase}.verification-result dd{font-weight:700}
@media(max-width:850px){.account-layout{grid-template-columns:1fr}.account-stats{grid-template-columns:1fr 1fr 1fr}.dash-list-item{align-items:flex-start;flex-wrap:wrap}}
@media(max-width:580px){.auth-card .grid-2,.account-stats{grid-template-columns:1fr}.verification-result dl{grid-template-columns:1fr}.verification-result dd{margin-bottom:.6rem}}
