/* Penthertz page styles, on top of nocturne.css (tokens and base components).
   Templates use the classes below; keep values in tokens, not inline styles. */

*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-body)}

.wrap{max-width:1180px;margin:0 auto;padding:0 var(--space-8)}
.section{padding:calc(var(--space-8) * 3) 0}
.section-top{padding:calc(var(--space-8) * 2.6) 0 var(--space-8)}
.section-tight{padding:0 0 calc(var(--space-8) * 2)}
/* Page tops start where the home hero does, so the kicker and title sit at the same
   height below the header on every page. Also keeps that space on phones, where the
   narrow-screen .wrap shorthand would otherwise zero it (kicker glued to the header). */
main > .section-top:first-child{padding-top:calc(var(--space-8) * 3.5)}
.rule{height:1px;border:0;margin:0 0 calc(var(--space-8) * 2);
  background:linear-gradient(to right,transparent,var(--color-divider) 48px,
    var(--color-divider) calc(100% - 48px),transparent)}

/* header */
.hdr{position:sticky;top:0;z-index:20;
  background:color-mix(in srgb,var(--color-bg) 92%,transparent);backdrop-filter:blur(10px)}
.hdr .nav{padding:var(--space-4) 0}
.brand{display:flex;align-items:center;gap:var(--space-3);text-decoration:none;color:inherit;
  margin-right:auto;font-family:var(--font-heading);font-weight:var(--font-heading-weight)}
.brand img{display:block}
.brand-mark{height:40px;width:auto}
.brand-word{height:21px;width:auto}
.brand-tag{font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  padding-left:var(--space-2);border-left:1px solid var(--color-divider);
  color:var(--color-text-muted)}
.lang{display:flex;align-items:center;gap:var(--space-2);margin-left:var(--space-4);font-size:12px}
.lang a{color:var(--color-text-muted);text-decoration:none}
.lang .on{color:var(--color-accent)}
.hdr .btn{margin-left:var(--space-3)}

/* type */
/* Section labels: quiet sentence-case marks in the body face (no all-caps,
   no tracking, no mono - the mono face is kept for real data only). */
.kicker{margin-bottom:var(--space-4);font-family:var(--font-body);font-size:13px;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--color-accent-300)}
.kicker-plain{font-family:var(--font-body);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;
  color:var(--color-accent-300);margin-bottom:var(--space-4)}
/* Frequencies, part numbers, spec values */
.mono{font-family:var(--font-mono);font-size:.92em;letter-spacing:0}
.lede{font-size:18px;margin:0;max-width:62ch;
  color:var(--color-text-muted)}
.hero h1{margin:0 0 var(--space-6);max-width:26ch}
.hero-xl h1{font-size:52px}
/* Brand signature: a short magenta-to-cyan bar under the page headline, the one
   place the full logo gradient (not just cyan) shows up in the layout. */
.hero h1::after,.hero-xl h1::after,.detail-title::after{content:"";display:block;
  width:72px;height:4px;margin-top:var(--space-6);border-radius:2px;background:var(--gradient-brand)}
.detail-title::after{margin-top:var(--space-4)}
.eyebrow{font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:0;text-transform:none;
  margin-bottom:var(--space-4);color:var(--color-text-muted)}
.crumbs{font-size:12px;display:flex;gap:var(--space-2);align-items:center;
  color:var(--color-text-muted)}
.crumbs a{color:inherit;text-decoration:none}
.crumbs .here{color:var(--color-text)}

/* layout */
.btn-row{display:flex;gap:var(--space-3);flex-wrap:wrap}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-6)}
.split{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:calc(var(--space-8) * 2)}
.split-even{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:calc(var(--space-8) * 2)}
.split-lead{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:calc(var(--space-8) * 2);align-items:start}
.middle{align-items:center}
.row-end{display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--space-8);margin-bottom:var(--space-8)}
.row-end h2{margin:0}
.sticky-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:var(--space-4)}

/* bands */
/* Bands: a quiet neutral step above the page, no colour glow */
.band{background:var(--color-band);border-top:1px solid var(--color-divider);border-bottom:1px solid var(--color-divider)}
.band .wrap{padding-top:calc(var(--space-8) * 2.2);padding-bottom:calc(var(--space-8) * 2.2)}
.band .panel{border:1px solid var(--color-divider);border-radius:var(--radius-md);
  padding:var(--space-8);display:flex;flex-direction:column;gap:var(--space-4)}
.band .kv-row{border-bottom-color:var(--color-divider)}
.stat{font-size:34px;line-height:1.1;margin-bottom:var(--space-2)}
.stat-note{font-size:13px;line-height:1.5;color:var(--color-text-muted)}

/* key/value lists */
.kv{display:flex;flex-direction:column;gap:var(--space-3)}
.kv-row{display:flex;gap:var(--space-4);align-items:baseline;
  padding-bottom:var(--space-3);border-bottom:1px solid var(--color-divider)}
.kv-row dt,.kv-row .k{font-size:14px;flex:none;min-width:130px;color:var(--color-accent-300);margin:0}
.kv-row dd,.kv-row .v{font-size:15px;margin:0;
  color:var(--color-text-muted)}

/* plain bordered list */
.stack{display:flex;flex-direction:column;gap:var(--space-3)}
.stack > li,.stack > .item{list-style:none;font-size:15px;
  padding-bottom:var(--space-3);border-bottom:1px solid var(--color-divider)}
.stack{padding:0;margin:0}

/* numbered steps */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-6)}
.step{padding-top:var(--space-4);border-top:1px solid var(--color-divider)}
.band .step{border-top-color:var(--color-divider)}
.step-num{font-size:12px;color:var(--color-accent);margin-bottom:var(--space-3)}
.step h4{margin:0 0 var(--space-2)}
.step p{font-size:15px;margin:0;color:var(--color-text-muted)}

/* cards */
.card{height:100%}
/* A card under a heading in a split/grid column fills the rest of the column rather
   than 100% of it (which pushed it out by the heading's height, over the next section
   or the footer). Cards side by side in the row still end level. */
:is(.split,.split-even,.split-lead,.grid-2,.grid-3,.grid-4) > div:has(> .card:not(:first-child)){display:flex;flex-direction:column}
:is(.split,.split-even,.split-lead,.grid-2,.grid-3,.grid-4) > div > .card:not(:first-child){height:auto;flex:1 1 auto}
.card-flush{padding:0;overflow:hidden;gap:0}
.card-flush .card-inner{padding:var(--space-6);display:flex;flex-direction:column;
  gap:var(--space-3);flex:1}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);
  padding-top:var(--space-3);border-top:1px solid var(--color-divider);
  font-size:13px;color:var(--color-text-faint)}

/* tiles (link boxes) */
.tile{display:block;padding:var(--space-4) var(--space-6);border:1px solid var(--color-divider);
  border-radius:var(--radius-md);text-decoration:none;color:inherit}
.tile:hover{border-color:var(--color-accent)}
.tile-name{font-size:15px;display:block;margin-bottom:var(--space-1)}
.tile-note{font-size:14px;color:var(--color-text-muted)}

/* media */
.media{position:relative;border-radius:var(--radius-md);overflow:hidden;
  background:var(--color-neutral-900);box-shadow:var(--shadow-sm)}
.media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media-4x3{aspect-ratio:4/3}
.media-5x4{aspect-ratio:5/4}
.media-16x10{aspect-ratio:16/10}
.media-21x9{aspect-ratio:21/9}
.media-square{aspect-ratio:1/1}
.avatar{width:112px;height:112px;flex:none;border-radius:50%;overflow:hidden;
  background:var(--color-neutral-900)}
.avatar img{width:100%;height:100%;object-fit:cover}
figcaption{font-size:12px;margin-top:var(--space-2)}

/* tag + filter rows */
.tag-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.filter-row{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;
  padding-bottom:var(--space-4);border-bottom:1px solid var(--color-divider)}
.filter-count{font-size:12px;margin-left:auto;
  color:var(--color-text-muted)}
.filter-row a.seg-opt{text-decoration:none;color:inherit;
  border:1px solid var(--color-divider);border-radius:var(--radius-md)}
.filter-row a.seg-opt[aria-current="page"]{color:var(--color-accent);
  box-shadow:inset 0 0 0 1px var(--color-accent)}

/* cta band */
.cta{border:1px solid var(--color-accent-800);border-radius:var(--radius-lg);
  padding:calc(var(--space-8) * 1.6);display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:calc(var(--space-8) * 2);
  align-items:center;
  background-image:linear-gradient(180deg,color-mix(in srgb,var(--color-accent) 6%,transparent),transparent)}
.cta h2{margin:0 0 var(--space-4);max-width:26ch}
.cta p{margin:0;font-size:15px;max-width:52ch;
  color:var(--color-text-muted)}
.cta-actions{display:flex;flex-direction:column;gap:var(--space-3)}
.cta-actions .btn{margin-top:0}
.cta-line{font-size:12px;text-align:center;
  color:var(--color-text-muted)}

/* article */
.article{max-width:66ch}
/* Legal pages (terms, legal notice, privacy) */
.legal-updated{font-size:13px;color:var(--color-text-faint);margin-top:var(--space-4)}
.legal-article{max-width:76ch}
.legal-article h2{font-size:22px;margin:calc(var(--space-8) * 1.5) 0 var(--space-4);scroll-margin-top:90px}
.legal-article h2:first-child{margin-top:0}
.legal-article h3{font-size:17px;margin:var(--space-8) 0 var(--space-3)}
.legal-article p,.legal-article li{font-size:15px;line-height:1.65;color:var(--color-text-muted)}
.legal-article ul,.legal-article ol{padding-left:var(--space-8);display:flex;flex-direction:column;gap:var(--space-2)}
.legal-article strong{color:var(--color-text)}
.legal-article a{color:var(--color-accent)}
.legal-article hr{border:0;border-top:1px solid var(--color-divider);margin:var(--space-8) 0}
.article p{font-size:16px;line-height:1.65;margin:0 0 var(--space-8);color:var(--color-neutral-200)}
.article h3{margin:0 0 var(--space-3)}
.pull{margin:calc(var(--space-8) * 1.5) 0;padding:var(--space-6);
  border-left:2px solid var(--color-accent);background:var(--color-surface);
  border-radius:0 var(--radius-md) var(--radius-md) 0}
.pull p{margin:0;font-size:16px;color:var(--color-text)}
.toc{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-8)}
.toc a{font-size:13px;color:var(--color-neutral-300);text-decoration:none}

/* footer */
.site-footer{border-top:1px solid var(--color-divider)}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,minmax(0,1fr));
  gap:var(--space-8);padding:calc(var(--space-8) * 2) 0 var(--space-8)}
.footer-grid p{font-size:13px;margin:0 0 var(--space-3);max-width:36ch;
  color:var(--color-text-muted)}
.footer-col-head{font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:var(--space-4);color:var(--color-text-muted)}
.footer-links{display:flex;flex-direction:column;gap:var(--space-2)}
.footer-links a{font-size:14px;color:var(--color-neutral-300);text-decoration:none}
.footer-links a:hover{color:var(--color-text)}
/* Social profile links: footer line and the contact card row */
.social-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--space-2) var(--space-4)}
.footer-social{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:var(--space-2) 0 0 calc(var(--space-2) * -1)}
.footer-social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;
  border-radius:var(--radius-md);color:var(--color-neutral-300);transition:color .15s,background-color .15s}
.footer-social a:hover,.footer-social a:focus-visible{color:var(--color-text);background:color-mix(in srgb,var(--color-text) 8%,transparent)}
/* Phones: the footer's brand column is ~170px wide, keep the five icons on one row
   (30px targets, above the 24px WCAG minimum) */
@media (max-width:900px){
  .footer-social{gap:0;margin-left:-6px}
  .footer-social a{width:30px;height:30px}
  .footer-social svg{width:18px;height:18px}
}
.footer-contact{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);font-size:13px}
.footer-contact a{color:var(--color-neutral-300);text-decoration:none}
.footer-contact a:hover{color:var(--color-text)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
  gap:var(--space-4);padding:var(--space-6) 0 var(--space-8);
  border-top:1px solid var(--color-divider)}
.footer-legal{font-size:12px;color:var(--color-text-faint)}
.footer-legal-links{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);font-size:12px}
.footer-legal-links a{color:var(--color-text-faint)}
.footer-legal-links a:hover,.footer-legal-links a:focus-visible{color:var(--color-text)}
.footer-cookie-prefs{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-size:12px;color:var(--color-text-faint)}
.footer-cookie-prefs:hover,.footer-cookie-prefs:focus-visible{color:var(--color-text);text-decoration:underline}

/* Cookie consent (opt-in for analytics) */
.phz-consent{position:fixed;left:0;right:0;bottom:0;z-index:1000;display:none;
  background:var(--color-surface);border-top:1px solid var(--color-divider);box-shadow:0 -8px 30px rgba(0,0,0,.4)}
.phz-consent.is-open{display:block}
.phz-consent-inner{max-width:1180px;margin:0 auto;padding:var(--space-6) var(--space-8);
  display:flex;gap:var(--space-8);align-items:center;justify-content:space-between;flex-wrap:wrap}
.phz-consent-text{max-width:72ch}
.phz-consent-text strong{display:block;font-family:var(--font-heading);font-size:15px;margin-bottom:var(--space-2)}
.phz-consent-text p{margin:0;font-size:13px;line-height:1.55;color:var(--color-text-muted)}
.phz-consent-text a{color:var(--color-accent)}
.phz-consent-actions{display:flex;gap:var(--space-4);flex:none}
.phz-consent-btn{white-space:nowrap}
@media (max-width:700px){
  .phz-consent-inner{flex-direction:column;align-items:stretch;gap:var(--space-4);padding:var(--space-6)}
  .phz-consent-actions .phz-consent-btn{flex:1}
}

/* centred utility pages (404, thanks) */
.utility{min-height:60vh;display:flex;align-items:center}
.utility .split-lead{width:100%}

@media (max-width:900px){
  .grid-2,.grid-3,.grid-4,.steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split,.split-even,.split-lead,.cta,.footer-grid{grid-template-columns:minmax(0,1fr)}
  .row-end,.kv-row{flex-direction:column;align-items:flex-start}
  .wrap{padding:0 var(--space-6)}
  .hdr .nav{flex-wrap:wrap;row-gap:var(--space-3)}
  .brand-tag,.hide-sm{display:none}
  .sticky-side,.toc-side{position:static}
  h1{font-size:34px}
  h2{font-size:24px}
  .hero-xl h1{font-size:34px}
}
@media (max-width:560px){
  .grid-2,.grid-3,.grid-4,.steps{grid-template-columns:minmax(0,1fr)}
}
/* Below the content width (1180px + gutters) nothing else keeps text off the
   screen edge: sections and the header set "padding:<top> 0 <bottom>", which is
   right on desktop (content flush with the 1180px column) but leaves no margin on
   phones and tablets. Same approach as the design's [data-pad] hook. */
@media (max-width:1240px){
  .wrap{padding-left:var(--space-6) !important;padding-right:var(--space-6) !important}
  .wrap .wrap,.nav-search-panel .wrap{padding-left:0 !important;padding-right:0 !important}
  .nav-search-panel{padding-left:var(--space-6);padding-right:var(--space-6)}
}
/* Responsive hooks from the design (Theme/*.dc.html). !important because the
   templates set grid columns inline, which would otherwise win on phones. */
@media (max-width:900px){
  [data-grid]{grid-template-columns:minmax(0,1fr) !important}
  [data-grid-2]{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  [data-stack]{flex-direction:column !important;align-items:flex-start !important}
  [data-hide-sm]{display:none !important}
  [data-pad]{padding-left:var(--space-6) !important;padding-right:var(--space-6) !important}
}
/* Embedded players in articles never wider than the column */
.article iframe{max-width:100%}
.article iframe[src*="youtube"],.article iframe[src*="vimeo"],.article iframe[src*="ubicast"]{width:100%;height:auto;aspect-ratio:16/9}
/* Long URLs used as link text break instead of widening the page; wide tables scroll in place */
.article a{overflow-wrap:anywhere}
.article table{display:block;max-width:100%;overflow-x:auto}

/* Home hero field: an eye diagram, as on a scope during radio measurements
   (GFSK, BT 0.5, simulated; generated by import/redesign/eye-diagram.py). */
.hero-wrap{position:relative;overflow:hidden}
.hero-wrap::before{content:"";position:absolute;right:0;top:16%;width:56%;height:66%;pointer-events:none;
  background:url(../images/eye-gfsk.svg) no-repeat center / 100% 100%;opacity:.8;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%)}
@media (max-width:900px){.hero-wrap::before{top:auto;bottom:0;width:100%;height:36%;opacity:.4}}

/* ═══════════════════════════════════════════════════════════════════════════
   WordPress additions on top of the design-source stylesheet.
   Everything below resolves from Nocturne tokens.
   ═══════════════════════════════════════════════════════════════════════ */

/* Skip link */
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--color-surface);
  color:var(--color-text);padding:var(--space-3) var(--space-6);border-radius:0 0 var(--radius-md) 0}
.skip-link:focus{left:0}

/* Header: active state + mobile toggle */
.nav a[aria-current="page"]{color:var(--color-accent)}
.nav-toggle{display:none;background:transparent;border:1px solid var(--color-divider);
  border-radius:var(--radius-md);color:var(--color-text);width:40px;height:36px;cursor:pointer;
  align-items:center;justify-content:center;margin-left:auto}
.nav-toggle svg{width:20px;height:20px}
.nav-links{display:contents}


@media (max-width:900px){
  .nav-toggle{display:inline-flex}
  .nav-links{display:none;flex-basis:100%;flex-direction:column;align-items:flex-start;
    gap:var(--space-2);padding-top:var(--space-3);order:5}
  .nav-links.is-open{display:flex}
  .nav-links .btn{margin-left:0}
  .brand{margin-right:0}
  .lang{margin-left:0}
}

/* Language switch spacing */
.lang{display:flex;align-items:center;gap:var(--space-2);margin-left:var(--space-4);font-size:12px}
.lang a{color:var(--color-text-muted);text-decoration:none}
.lang .on{color:var(--color-accent)}
.lang .sep{color:var(--color-divider)}

/* Card links cover their card */
.card{position:relative}
.card a.stretched{position:absolute;inset:0;z-index:1;text-indent:-9999px;overflow:hidden}
.card .btn,.card a:not(.stretched){position:relative;z-index:2}

/* Block content inside articles */
.article :is(h2,h3){margin:calc(var(--space-8) * 1.2) 0 var(--space-3)}
.article ul,.article ol{margin:0 0 var(--space-8);padding-left:1.3em}
.article li{margin-bottom:var(--space-2);color:var(--color-neutral-200)}
.article a{color:var(--color-accent-300)}
.article img{border-radius:var(--radius-md);margin:var(--space-6) 0}
.article blockquote{margin:calc(var(--space-8) * 1.2) 0;padding:var(--space-6);
  border-left:2px solid var(--color-accent);background:var(--color-surface);
  border-radius:0 var(--radius-md) var(--radius-md) 0}
.article blockquote p{margin:0;font-size:16px;color:var(--color-text)}
.article figure{margin:var(--space-6) 0}
.article code{background:var(--color-surface);padding:1px 6px;border-radius:var(--radius-sm);font-size:.9em}
.article pre{background:var(--color-surface);padding:var(--space-6);border-radius:var(--radius-md);
  overflow:auto;border:1px solid var(--color-divider)}

/* Photos inside .media frames keep their own colours */
.media > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media-contain > img{object-fit:contain}

/* Pagination */
.phz-pager{display:flex;gap:var(--space-3);justify-content:center;margin-top:calc(var(--space-8) * 2)}
.phz-pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:38px;
  height:38px;padding:0 var(--space-3);border:1px solid var(--color-divider);border-radius:var(--radius-md);
  text-decoration:none;color:var(--color-text);font-size:14px}
.phz-pager .page-numbers:hover{border-color:var(--color-accent)}
.phz-pager .page-numbers.current{color:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-accent)}

/* Notices (quote form result) */
.phz-notice{padding:var(--space-4) var(--space-6);border-radius:var(--radius-md);margin-bottom:var(--space-6);
  border:1px solid var(--color-divider);font-size:14px}
.phz-notice.ok{border-color:var(--color-accent);background:color-mix(in srgb,var(--color-accent) 8%,transparent)}
.phz-notice.err{border-color:var(--color-neutral-600);background:color-mix(in srgb,var(--color-text) 5%,transparent)}

/* Post meta row */
.post-meta{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;font-size:12px;
  color:var(--color-text-muted);margin-bottom:var(--space-4)}

/* ── LearnDash, themed to Nocturne ─────────────────────────────────────────
   LearnDash ld30 ships a light theme driven by CSS variables plus light
   surfaces. We remap the variables and restyle the surfaces so the course
   content sits inside the dark page. */
.phz-ld{margin-top:calc(var(--space-8) * 1.5)}
.learndash-wrapper{
  --ld-primary-color:var(--color-accent);
  --ld-primary-color-hover:var(--color-accent-400);
  --ld-secondary-color:var(--color-accent-300);
  --ld-color-primary:var(--color-accent);
  --ld-background-color:var(--color-surface);
  --color-ld-primary:var(--color-accent);
  --color-ld-primary-hover:var(--color-accent-400);
  color:var(--color-text);
}
/* Progress bar */
.learndash-wrapper .ld-progress{color:var(--color-text)}
.learndash-wrapper .ld-progress .ld-progress-bar{background:var(--color-neutral-900);border-radius:99px}
/* LearnDash ships light panels (#f0f3f6, #e2e7ed) that flash white on the dark theme. */
.learndash-wrapper .ld-topic-status,.learndash-wrapper .ld-lesson-status,.learndash-wrapper .ld-quiz-status{background:var(--color-surface)!important;border:1px solid var(--color-divider);border-radius:var(--radius-lg);transition:none}
.learndash-wrapper .ld-item-list .ld-section-heading .ld-item-list-actions .ld-progress .ld-progress-bar{background:var(--color-neutral-900)!important}
.learndash-wrapper .ld-table-list .ld-table-list-items{border-color:var(--color-divider)!important}
.learndash-wrapper .ld-table-list .ld-table-list-item-expanded .ld-table-list .ld-table-list-items{background:transparent!important}
.learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage{background:var(--color-accent)!important;border-radius:99px}
.learndash-wrapper .ld-progress-stats,.learndash-wrapper .ld-progress-steps{color:var(--color-text-muted)}
/* Lesson / topic rows */
.learndash-wrapper .ld-item-list-items,.learndash-wrapper .ld-lesson-item{background:transparent}
.learndash-wrapper .ld-item-list-item{
  background:var(--color-surface)!important;border:1px solid var(--color-divider)!important;
  border-radius:var(--radius-md)!important;margin-bottom:var(--space-3)!important}
.learndash-wrapper .ld-item-list-item .ld-item-list-item-preview{background:transparent!important;border:0!important}
.learndash-wrapper .ld-item-list-item a,.learndash-wrapper .ld-item-title,.learndash-wrapper .ld-item-name{color:var(--color-text)!important}
.learndash-wrapper .ld-item-list-item:hover .ld-item-title{color:var(--color-accent)!important}
.learndash-wrapper .ld-item-details,.learndash-wrapper .ld-item-component{color:var(--color-text-muted)!important}
/* Status circles */
.learndash-wrapper .ld-status-icon{background:var(--color-neutral-900);border:1px solid var(--color-divider)}
.learndash-wrapper .ld-status-icon.ld-status-complete,.learndash-wrapper .ld-status-complete{background:var(--color-accent)!important;color:var(--color-on-accent)!important}
.learndash-wrapper .ld-icon{color:inherit}
/* LearnDash buttons, drawn like the site's .btn (nocturne.css): body face, 14px/600.
   Default = secondary (neutral outline); Mark Complete = primary; Back / Expand = ghost. */
.learndash-wrapper .ld-button,.learndash-wrapper .ld-content-action a,.learndash-wrapper .ld-content-action button,
.learndash-wrapper .learndash_mark_complete_button,.learndash-wrapper #learndash_mark_complete_button,.wpProQuiz_button{
  display:inline-flex!important;align-items:center;justify-content:center;gap:6px;
  font-family:var(--font-body)!important;font-weight:600!important;font-size:14px!important;line-height:1.2!important;
  padding:var(--space-3) var(--space-6)!important;min-height:40px;border-radius:var(--radius-md)!important;
  background:transparent!important;color:var(--color-text)!important;
  border:1px solid color-mix(in srgb,var(--color-text) 32%,transparent)!important;
  box-shadow:none!important;text-shadow:none!important;text-transform:none!important;text-decoration:none!important}
.learndash-wrapper .ld-button *,.learndash-wrapper .ld-content-action .ld-icon{color:inherit!important}
/* That display wins over inline styles: keep the buttons LearnDash hides (Back on the
   first question, Check when feedback is at the end, ...) hidden. */
.learndash-wrapper .ld-button[style*="display: none"],.learndash-wrapper .ld-button[style*="display:none"],
.wpProQuiz_button[style*="display: none"],.wpProQuiz_button[style*="display:none"]{display:none!important}
.learndash-wrapper .ld-button:hover,.learndash-wrapper .ld-content-action a:hover,.wpProQuiz_button:hover{
  background:color-mix(in srgb,var(--color-text) 7%,transparent)!important;color:var(--color-text)!important}
.learndash-wrapper .learndash_mark_complete_button,.learndash-wrapper #learndash_mark_complete_button{
  background:var(--color-accent)!important;border-color:var(--color-accent)!important;color:var(--color-on-accent)!important;cursor:pointer}
.learndash-wrapper .learndash_mark_complete_button:hover,.learndash-wrapper #learndash_mark_complete_button:hover{
  background:var(--color-accent-400)!important;border-color:var(--color-accent-400)!important}
.learndash-wrapper .sfwd-mark-complete::after,.learndash-wrapper .sfwd-mark-complete .ld-icon{color:var(--color-on-accent)!important}
/* LearnDash draws the check at right:.5em over the button: leave it room. */
.learndash-wrapper .sfwd-mark-complete{position:relative}
.learndash-wrapper .learndash_mark_complete_button,.learndash-wrapper #learndash_mark_complete_button{padding-right:calc(var(--space-6) + 22px)!important}
.learndash-wrapper .sfwd-mark-complete::after{right:var(--space-4)!important}
/* Expand: no blue disc behind the arrow, as on "Expand All". */
.learndash-wrapper .ld-expand-button.ld-button-alternate .ld-icon{background:transparent!important;color:var(--color-accent)!important}
.learndash-wrapper .ld-content-action a.ld-course-step-back,.learndash-wrapper .ld-expand-button{
  display:inline-flex!important;align-items:center;gap:6px;border:0!important;background:transparent!important;
  color:var(--color-accent)!important;font-family:var(--font-body)!important;font-weight:600!important;font-size:14px!important;
  padding:var(--space-2) var(--space-3)!important;min-height:0;border-radius:var(--radius-md)!important;
  box-shadow:none!important;text-transform:none!important;text-decoration:none!important}
.learndash-wrapper .ld-expand-button *{color:var(--color-accent)!important}
.learndash-wrapper .ld-content-action a.ld-course-step-back:hover,.learndash-wrapper .ld-expand-button:hover{
  background:color-mix(in srgb,var(--color-accent) 10%,transparent)!important;color:var(--color-accent)!important}
.learndash-wrapper .ld-expand-button .ld-icon-arrow-down{border-color:var(--color-accent)}
/* Section headings + tables */
.learndash-wrapper .ld-table-list-header,.learndash-wrapper .ld-lesson-item-preview-heading,
.learndash-wrapper .ld-item-list-section-heading{background:transparent!important;color:var(--color-text)!important;border-color:var(--color-divider)!important}
.learndash-wrapper h1,.learndash-wrapper h2,.learndash-wrapper h3,.learndash-wrapper h4{color:var(--color-text)}
/* Alerts / notices */
.learndash-wrapper .ld-alert{background:var(--color-surface)!important;color:var(--color-text)!important;
  border:1px solid var(--color-divider)!important;border-radius:var(--radius-md)!important}
.learndash-wrapper .ld-alert-warning{border-left:3px solid var(--color-accent)!important}
.learndash-wrapper .ld-alert .ld-alert-icon{color:var(--color-accent)!important}
/* Course/lesson content boxes */
.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab{color:var(--color-text-muted)!important}
.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab.ld-active{color:var(--color-accent)!important;border-bottom-color:var(--color-accent)!important}
.learndash-wrapper .ld-focus-content,.learndash-wrapper .ld-content{color:var(--color-text)}
/* Quizzes (WpProQuiz): answers drawn as dark cards, feedback tinted green/red in place
   of LearnDash's light fills, which left the light text unreadable. */
.learndash-wrapper .wpProQuiz_content{--quiz-ok:#4cc38a;--quiz-bad:#f0616d}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item) label{
  background:var(--color-surface);border:1px solid var(--color-divider);border-radius:var(--radius-md);color:var(--color-text);cursor:pointer}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item) label:hover{border-color:color-mix(in srgb,var(--color-text) 40%,transparent)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item) label.is-selected,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item) label:focus-within{border-color:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-accent)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionInput{accent-color:var(--color-accent)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item).wpProQuiz_answerCorrect label,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item).wpProQuiz_answerCorrectIncomplete label{
  background:color-mix(in srgb,var(--quiz-ok) 12%,var(--color-surface));border-color:var(--quiz-ok);box-shadow:none}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item).wpProQuiz_answerIncorrect label{
  background:color-mix(in srgb,var(--quiz-bad) 12%,var(--color-surface));border-color:var(--quiz-bad);box-shadow:none}
.learndash-wrapper .wpProQuiz_content .ld-quiz-question-item__status--correct,
.learndash-wrapper .wpProQuiz_content .ld-quiz-question-item__status--missed{color:var(--quiz-ok)}
.learndash-wrapper .wpProQuiz_content .ld-quiz-question-item__status--incorrect{color:var(--quiz-bad)}
/* The status sits in the card's top-right corner: keep the answer text clear of it
   (beside it on wide screens, under it on phones). */
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item):is(.wpProQuiz_answerCorrect,.wpProQuiz_answerCorrectIncomplete,.wpProQuiz_answerIncorrect) label{padding-right:136px}
@media (max-width:600px){
  .learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item):is(.wpProQuiz_answerCorrect,.wpProQuiz_answerCorrectIncomplete,.wpProQuiz_answerIncorrect) label{padding-top:40px;padding-right:14px}
}
/* Typed answers: the site's input on the card (LearnDash's is light, and its locked
   state after Check is grey on grey). Monospace: answers here are bits, hex, codes. */
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionInput[type=text]{
  width:100%;max-width:32rem;min-height:40px;padding:var(--space-2) var(--space-3);font-family:var(--font-mono);font-size:15px;
  color:var(--color-text);-webkit-text-fill-color:var(--color-text);caret-color:var(--color-accent);opacity:1;
  background:var(--color-bg);border:1px solid var(--color-divider);border-radius:var(--radius-md)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionInput[type=text]:focus{outline:none!important;border-color:var(--color-accent)!important;box-shadow:0 0 0 1px var(--color-accent)!important}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_response,
.learndash-wrapper .wpProQuiz_points,.learndash-wrapper .wpProQuiz_graded_points,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_time_limit{background:var(--color-surface);border:1px solid var(--color-divider);border-radius:var(--radius-lg);color:var(--color-text)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_response{text-align:left}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_response .wpProQuiz_correct>span,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_response .wpProQuiz_incorrect>span{display:block;font-weight:600;margin-bottom:var(--space-2)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_response .wpProQuiz_correct>span{color:var(--quiz-ok)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_response .wpProQuiz_incorrect>span{color:var(--quiz-bad)}
.learndash-wrapper .wpProQuiz_points--message{color:var(--color-text)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_resultTable{border-color:var(--color-divider)}
.learndash-wrapper .ld-quiz-actions{border-top:1px solid var(--color-divider)}
.learndash-wrapper .ld-table-list .ld-table-list-footer{background:transparent;padding:0}
@media (min-width:601px){
  .learndash-wrapper .wpProQuiz_content .wpProQuiz_QuestionButton[name=check],
  .learndash-wrapper .wpProQuiz_content .wpProQuiz_QuestionButton[name=next]{margin-left:var(--space-3)!important}
}
/* Start and Check are the main action on their screen, like Mark Complete. */
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button[name=startQuiz],
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button[name=check]{background:var(--color-accent)!important;border-color:var(--color-accent)!important;color:var(--color-on-accent)!important;cursor:pointer}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button[name=startQuiz]:hover,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button[name=check]:hover{background:var(--color-accent-400)!important;border-color:var(--color-accent-400)!important}
.learndash-wrapper .wpProQuiz_content a#quiz_continue_link{background:var(--color-accent);color:var(--color-on-accent);border:1px solid var(--color-accent);
  border-radius:var(--radius-md);font-family:var(--font-body);font-size:14px;font-weight:600;line-height:1.2;min-height:40px;padding:var(--space-3) var(--space-6);text-decoration:none}
.learndash-wrapper .wpProQuiz_content a#quiz_continue_link:hover{background:var(--color-accent-400);border-color:var(--color-accent-400);color:var(--color-on-accent)}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button:focus{outline:none}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button:focus-visible,.learndash-wrapper .wpProQuiz_content a#quiz_continue_link:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}
@media (max-width:600px){
  .learndash-wrapper .wpProQuiz_content .wpProQuiz_QuestionButton{float:none!important;width:100%;margin:0 0 var(--space-2)!important}
}

/* MemberDash buy button inherits our button */
.phz-ms-buy .ms-membership-form-wrapper{margin:0}
.phz-ms-buy a.ms-pay-button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;
  font-size:14px;line-height:1.2;padding:var(--space-2) calc(var(--space-3) * 1.2)}
.phz-ms-buy a.ms-pay-button,.phz-ms-buy button,.phz-ms-buy input[type=submit]{background:var(--color-accent);
  color:var(--color-on-accent);border:1px solid var(--color-accent);border-radius:var(--radius-md);
  padding:var(--space-2) var(--space-4);font-family:var(--font-body);font-weight:600;cursor:pointer}
.phz-ms-buy button,.phz-ms-buy input[type=submit]{width:100%}
.phz-ms-buy a.ms-pay-button:hover,.phz-ms-buy button:hover,.phz-ms-buy input[type=submit]:hover{background:var(--color-accent-400);border-color:var(--color-accent-400)}

/* Utility to hide visually but keep for screen readers */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

/* Featured/blog list image ratio wrappers reuse .media */
.post-card .media{margin-bottom:0}

/* ── Header dropdowns ──────────────────────────────────────────────────────
   A top-level item with children is a .nav-item.has-sub; its .nav-sub panel
   opens on hover and on keyboard focus. Accent stays a line, per Nocturne. */
.nav-item{position:relative;display:inline-flex;align-items:center}
.nav-item > a{display:inline-flex;align-items:center;gap:4px}
.nav-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid currentColor;opacity:.6;transition:transform .15s ease}
.nav-item.has-sub:hover .nav-caret,
.nav-item.has-sub:focus-within .nav-caret{transform:rotate(180deg);opacity:1}

.nav-sub{position:absolute;top:100%;left:0;min-width:210px;z-index:30;
  display:flex;flex-direction:column;gap:2px;
  padding:var(--space-3);margin-top:var(--space-2);
  background:var(--color-surface);border:1px solid var(--color-divider);
  border-radius:var(--radius-md);box-shadow:var(--shadow-md);
  opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .14s ease,transform .14s ease,visibility .14s}
/* a hover bridge so the pointer can travel from label to panel */
.nav-item.has-sub::after{content:"";position:absolute;top:100%;left:0;right:0;height:var(--space-3)}
.nav-item.has-sub:hover .nav-sub,
.nav-item.has-sub:focus-within .nav-sub{opacity:1;visibility:visible;transform:translateY(0)}
.nav-sub a{display:block;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);
  font-size:14px;color:var(--color-neutral-200);text-decoration:none;white-space:nowrap}
.nav-sub a:hover,.nav-sub a[aria-current="page"]{
  color:var(--color-accent);background:color-mix(in srgb,var(--color-accent) 10%,transparent)}
/* The Trainings dropdown lists every course, so it opens as a wider two-column
   panel, anchored to the item's right edge so it never runs off screen. */
.nav-item.nav-mega .nav-sub{left:auto;right:0;display:grid;
  grid-template-columns:repeat(2,minmax(258px,1fr));gap:2px var(--space-6);min-width:560px}
.nav-item.nav-mega .nav-sub a{white-space:normal;line-height:1.3}
/* Grouped dropdowns (Trainings): each column has a small heading link. A column
   with the nav-span class fills the second column, the others stack in the first. */
.nav-col{display:flex;flex-direction:column;gap:2px;min-width:0}
.nav-col + .nav-col{margin-top:var(--space-4)}
.nav-mega .nav-sub .nav-col.nav-span{grid-column:2;grid-row:1 / span 9;margin-top:0}
.nav-sub a.nav-col-head{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--color-text-muted);padding-bottom:var(--space-1);margin-bottom:var(--space-1);
  border-bottom:1px solid var(--color-divider);border-radius:0;background:transparent}
.nav-sub a.nav-col-head:hover{color:var(--color-accent);background:transparent}
.nav-col-links{display:flex;flex-direction:column;gap:2px}

@media (max-width:900px){
  /* In the stacked mobile menu the dropdown sits inline, always visible. */
  .nav-item{display:flex;flex-direction:column;align-items:flex-start;width:100%}
  .nav-caret{display:none}
  .nav-sub{position:static;opacity:1;visibility:visible;transform:none;
    margin:var(--space-2) 0 var(--space-2) var(--space-4);padding:0;
    background:transparent;border:0;box-shadow:none;min-width:0}
  .nav-item.nav-mega .nav-sub{display:flex;min-width:0;right:auto}
  .nav-item.has-sub::after{display:none}
  .nav-sub a{padding:var(--space-1) 0;font-size:13px}
  .nav-mega .nav-sub .nav-col.nav-span{grid-column:auto;grid-row:auto;margin-top:var(--space-4)}
  .nav-col{width:100%}
}

/* ── Header search ─────────────────────────────────────────────────────────
   A magnifier button in the nav opens a full-width search bar under the header. */
.nav-search-toggle{display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;padding:0;margin-left:var(--space-2);
  background:transparent;border:1px solid var(--color-divider);border-radius:var(--radius-md);
  color:var(--color-text);cursor:pointer}
.nav-search-toggle:hover{border-color:var(--color-accent);color:var(--color-accent)}
.nav-search-toggle svg{width:18px;height:18px}
.nav-search-panel{border-top:1px solid var(--color-divider);
  background:color-mix(in srgb,var(--color-bg) 96%,transparent)}
.nav-search-panel[hidden]{display:none}
.nav-search-panel .wrap{padding-top:var(--space-4);padding-bottom:var(--space-4)}
.nav-search-panel form{max-width:640px}
.nav-search-panel .input{flex:1}

/* Search results list */
.search-hit{display:flex;align-items:center;gap:var(--space-6);
  padding:var(--space-6) 0;border-bottom:1px solid var(--color-divider);
  text-decoration:none;color:inherit}
.search-hit:hover{background:linear-gradient(to right,color-mix(in srgb,var(--color-text) 3%,transparent),transparent)}
.search-hit-main{flex:1;min-width:0}
.search-hit-title{font-family:var(--font-heading);font-weight:var(--font-heading-weight);
  font-size:19px;line-height:1.2;margin-bottom:var(--space-2)}
.search-hit:hover .search-hit-title{color:var(--color-accent)}
.search-hit-body{margin:0;font-size:14px;
  color:var(--color-text-muted)}
.search-hit-go{flex:none;color:var(--color-accent);font-size:20px;opacity:.6}
.search-hit:hover .search-hit-go{opacity:1}

@media (max-width:900px){
  /* On mobile the search sits inside the open menu, always visible. */
  .nav-search-toggle{display:none}
  .nav-search-panel,.nav-search-panel[hidden]{display:block;order:6;flex-basis:100%;
    border-top:0;background:transparent;margin-top:var(--space-2)}
  .nav-search-panel .wrap{padding:0}
  .search-hit{gap:var(--space-4)}
}

/* LearnDash course-status infobar (Current status / Price / Get started) */
.ld-course-status,.learndash-wrapper .ld-course-status{
  background:var(--color-surface)!important;border:1px solid var(--color-divider)!important;
  border-radius:var(--radius-lg)!important;color:var(--color-text)!important}
.ld-course-status .ld-course-status-segment{background:transparent!important;border-color:var(--color-divider)!important}
.ld-course-status .ld-course-status-label{color:var(--color-text-muted)!important}
.ld-course-status .ld-course-status-price,.ld-course-status .ld-course-status-content{color:var(--color-text)!important}
.ld-course-status .ld-course-status-price *{color:var(--color-text)!important}
/* status badge (Not Enrolled / In Progress / Complete) */
.ld-course-status .ld-status,.ld-course-status .ld-tertiary-background{
  background:var(--color-neutral-800)!important;color:var(--color-neutral-100)!important;border-radius:99px!important}
.ld-course-status .ld-status-complete{background:var(--color-accent)!important;color:var(--color-on-accent)!important}
.ld-course-status .ld-status-progress{background:var(--color-accent-800)!important;color:var(--color-accent-100)!important}
/* enrol / take-this-course button (also WordPress .wp-element-button) */
.ld-course-status .btn-join,.phz-ld .btn-join,
.ld-course-status .button-primary,.phz-ld .learndash-wrapper .button-primary,
.ld-course-status .wp-element-button,.phz-ld .wp-element-button,.phz-ld .learndash-button-closed{
  background:var(--color-accent)!important;color:var(--color-on-accent)!important;
  border:1px solid var(--color-accent)!important;border-radius:var(--radius-md)!important;
  box-shadow:none!important;text-shadow:none!important;text-transform:none!important;
  font-family:var(--font-heading)!important;font-weight:var(--font-heading-weight)!important}
.ld-course-status .btn-join:hover,.phz-ld .wp-element-button:hover,.phz-ld .learndash-button-closed:hover{
  background:var(--color-accent-400)!important;border-color:var(--color-accent-400)!important;color:var(--color-on-accent)!important}
/* tooltip bubble */
.ld-course-status .ld-tooltip__text{background:var(--color-neutral-900)!important;color:var(--color-text)!important;
  border:1px solid var(--color-divider)!important}

/* ── LearnDash lesson / topic step pages ───────────────────────────────────
   Everything here sits on the dark ground; force readable colours. */
.phz-ld-step,.phz-ld-step p,.phz-ld-step li,
.learndash-wrapper--lesson,.learndash-wrapper .ld-tab-content,
.learndash-wrapper .ld-tabs-content,.learndash-wrapper .ld-tabs-content *{color:var(--color-text)}
.phz-ld-step .article p{color:var(--color-neutral-200)}
/* Links written in lesson/topic text (not LearnDash's own buttons): accent and
   underlined like article links, with a mark on links that leave the site. */
.phz-ld-step p a,.phz-ld-step li a,.phz-ld-step td a,.phz-ld-step a:not([class]):not(#quiz_continue_link){
  color:var(--color-accent-300)!important;text-decoration:underline!important;text-decoration-thickness:1px;
  text-underline-offset:3px;font-weight:600}
.phz-ld-step p a:hover,.phz-ld-step li a:hover,.phz-ld-step td a:hover,.phz-ld-step a:not([class]):not(#quiz_continue_link):hover{
  color:var(--color-accent)!important;text-decoration-thickness:2px}
.phz-ld-step p a[href^="http"]:not([href*="penthertz.com"])::after,
.phz-ld-step li a[href^="http"]:not([href*="penthertz.com"])::after{content:"\2009\2197";font-weight:400}
.learndash-wrapper .ld-tabs-content{background:transparent!important}

/* Lesson progress bar (was white) */
.learndash-wrapper .ld-lesson-status,.learndash-wrapper .ld-progress{
  background:transparent!important;color:var(--color-text)!important}
.learndash-wrapper .ld-progress .ld-progress-bar,
.learndash-wrapper .ld-lesson-status .ld-progress-bar{
  background:var(--color-neutral-900)!important;border:1px solid var(--color-divider)!important;border-radius:99px!important}
.learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage,
.learndash-wrapper .ld-lesson-status .ld-progress-bar-percentage{background:var(--color-accent)!important}
.learndash-wrapper .ld-progress-stats,.learndash-wrapper .ld-progress-percentage,
.learndash-wrapper .ld-progress-label,.learndash-wrapper .ld-lesson-status *{color:var(--color-text-muted)!important}

/* Step navigation (Back to Course / Next Topic / Mark Complete) */
.learndash-wrapper .ld-content-actions{border-color:var(--color-divider)!important}
/* (button styles: see "LearnDash buttons" above) */
.learndash-wrapper .ld-content-action{display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}
.learndash-wrapper .ld-content-action:first-child{align-items:flex-start}
.learndash-wrapper .ld-content-action:last-child{align-items:flex-end}
.learndash-wrapper .ld-content-action.ld-empty{opacity:.4}

/* Lesson / topic list on the step and course pages */
.learndash-wrapper .ld-table-list,.learndash-wrapper .ld-lesson-topic-list{background:transparent!important;border:0!important}
.learndash-wrapper .ld-table-list-header{background:transparent!important;color:var(--color-text-muted)!important;border-bottom:1px solid var(--color-divider)!important}
.learndash-wrapper .ld-table-list-items .ld-table-list-item{
  background:var(--color-surface)!important;border:1px solid var(--color-divider)!important;
  border-radius:var(--radius-md)!important;margin-bottom:var(--space-2)!important}
.learndash-wrapper .ld-table-list-item a,.learndash-wrapper .ld-topic-title,.learndash-wrapper .ld-table-list-title{color:var(--color-text)!important}
.learndash-wrapper .ld-table-list-item:hover .ld-topic-title{color:var(--color-accent)!important}
.learndash-wrapper .ld-table-list-item-preview{background:transparent!important}

/* Tabs (Materials, etc.) */
.learndash-wrapper .ld-tabs .ld-tabs-navigation{border-bottom:1px solid var(--color-divider)!important}
.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab{background:transparent!important;color:var(--color-text-muted)!important;border:0!important}
.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab.ld-active{color:var(--color-accent)!important;box-shadow:inset 0 -2px 0 var(--color-accent)!important}

/* Breadcrumbs / labels LearnDash prints */
.learndash-wrapper .ld-breadcrumbs,.learndash-wrapper .ld-breadcrumbs *{color:var(--color-text-muted)!important}
.learndash-wrapper .ld-breadcrumbs a:hover{color:var(--color-accent)!important}

/* LearnDash infobar on step pages: drop the white plate and the duplicate
   breadcrumb (the theme prints its own crumbs above). */
.phz-ld-step .learndash-shortcode-wrap-ld_infobar,
.phz-ld-step .ld-lesson-status{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0 0 var(--space-6)!important}
.phz-ld-step .ld-breadcrumbs{display:none!important}
.phz-ld-step .ld-lesson-status .ld-status{margin:0}

/* Article figures (imported posts): show the full image, never cropped, with a
   caption below. Diagrams and screenshots must stay legible. */
.article figure{margin:calc(var(--space-8) * 1.2) 0}
.article figure.phz-fig{display:block}
.article figure.phz-fig img,.article figure > img{
  width:100%;height:auto;display:block;border-radius:var(--radius-md);
  background:var(--color-neutral-100)}
.article figure figcaption,.article figcaption{
  margin-top:var(--space-3);font-size:12px;line-height:1.5;text-align:center;
  color:var(--color-text-muted)}

/* ── Blog article layout ───────────────────────────────────────────────────
   A single post is a reading page: tighten the content column so the article
   fills its width (no empty third column) and reads at a comfortable ~76ch
   instead of being capped narrow inside a wide grid. Scoped to posts, so the
   section index/split layouts elsewhere are untouched. Header/footer keep the
   full site width because their .wrap sits outside <main>. */
body.single-post main .wrap{max-width:1040px}
body.single-post .split{grid-template-columns:minmax(0,220px) minmax(0,1fr);align-items:start}
body.single-post .article{max-width:none}
body.single-post .article p,body.single-post .article li{font-size:16.5px}
@media (max-width:900px){
  body.single-post .split{grid-template-columns:minmax(0,1fr)}
  body.single-post .sticky-side{position:static;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--space-4)}
  body.single-post .sticky-side .btn{width:auto}
}

/* ── Building blocks used by the templates (instead of inline styles) ───── */
.section-crumbs{padding:var(--space-8) 0 0}
.section-bar{padding:var(--space-8) 0 0}
.section-pad-top{padding-top:calc(var(--space-8) * 2.6)}
.section-end{padding-bottom:calc(var(--space-8) * 3)}
.h-side{margin:0 0 var(--space-4);max-width:18ch}
.h-col{margin:0 0 var(--space-6);max-width:20ch}
.lede-sm{font-size:16px}
.lede + .btn-row,.lede-gap{margin-top:var(--space-8)}
.band-copy{margin:0;font-size:16px;max-width:52ch;color:var(--color-text-muted)}
.band-copy + .btn-row,.band-copy + .btn{margin-top:var(--space-6)}
.gap-md{gap:var(--space-6)}
.gap-lg{gap:var(--space-8)}
.btn-block{margin-top:0}
.btn-row-mt{margin-top:var(--space-8)}

/* cards */
.card-pad{padding:var(--space-6);gap:var(--space-3)}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.card > .btn-ghost,.card-inner > .btn-ghost,.panel > .btn{align-self:flex-start}

/* question/answer and note lists (FAQ, rules, prerequisites, order notes) */
.qa{padding-bottom:var(--space-4);border-bottom:1px solid var(--color-divider);margin-bottom:var(--space-4)}
.qa h4{margin:0 0 var(--space-2)}
.qa p{font-size:15px;margin:0;color:var(--color-text-muted)}
.pointlist{display:grid;gap:var(--space-8)}
.pointlist h4{margin:0 0 var(--space-2)}
.pointlist p{font-size:15px;margin:0;color:var(--color-text-muted)}

/* numbered phases (service process, course days) */
.phase{padding:var(--space-6) 0;border-top:1px solid var(--color-divider)}
.phase:last-child{border-bottom:1px solid var(--color-divider)}
.phase-row{display:flex;gap:var(--space-6)}
.phase-row + .phase-row{margin-top:var(--space-3)}
.phase .step-num{min-width:64px;margin:0;font-family:var(--font-mono)}
.phase h4{margin:0 0 var(--space-2)}
.phase p{font-size:15px;margin:0;max-width:60ch;color:var(--color-text-muted)}
.phase-pad{flex:none;min-width:64px}

/* Collapsible course-outline modules (<details>) */
.modules{display:flex;flex-direction:column}
.module{border-top:1px solid var(--color-divider)}
.module:last-child{border-bottom:1px solid var(--color-divider)}
.module-head{display:flex;align-items:center;gap:var(--space-6);padding:var(--space-6) 0;cursor:pointer;
  list-style:none;user-select:none}
.module-head::-webkit-details-marker{display:none}
.module-head .step-num{min-width:64px;margin:0;font-family:var(--font-mono)}
.module-title{font-family:var(--font-heading);font-weight:600;font-stretch:var(--font-heading-stretch);
  font-size:18px;flex:1}
.module-caret{flex:none;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;
  border-top:6px solid var(--color-text-faint);transition:transform .15s}
.module[open] .module-caret{transform:rotate(180deg)}
.module-head:hover .module-title{color:var(--color-accent)}
.module-items{list-style:none;margin:0 0 var(--space-6);padding:0 0 0 calc(64px + var(--space-6));
  display:flex;flex-direction:column;gap:var(--space-2)}
.module-items li{position:relative;padding-left:var(--space-4);font-size:15px;color:var(--color-text-muted)}
.module-items li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:50%;
  background:var(--color-accent);opacity:.7}
/* Full-program extras: day intro, sub-section headings, nested bullets */
.module-intro{margin:0 0 var(--space-4) calc(64px + var(--space-6));font-size:15px;color:var(--color-text-muted);max-width:60ch}
.module-sub-title{margin:var(--space-3) 0 var(--space-2) calc(64px + var(--space-6));font-family:var(--font-body);
  font-weight:600;font-size:14px;color:var(--color-accent-300)}
.module-sub-title + .module-items{margin-top:0}
.module-items .module-items{padding-left:var(--space-6);margin:var(--space-2) 0 var(--space-2)}
.module-items .module-items li::before{background:var(--color-text-faint)}
.module-items .module-items .module-items li::before{background:transparent;width:6px;height:1.5px;border-radius:0;top:11px}
@media (max-width:900px){
  .module-intro,.module-sub-title{margin-left:calc(40px + var(--space-4))}
  .module-head{gap:var(--space-4)}
  .module-head .step-num{min-width:40px}
  .module-items{padding-left:calc(40px + var(--space-4))}
}

/* LearnDash course infobar: hide the "Get Started / Current Status / Price"
   enrol widget - these pages sell through the contact flow, not self-enrolment. */
body.single-sfwd-courses .ld-course-status,
body.single-sfwd-courses .learndash_join_button,
body.single-sfwd-courses .ld-course-status-content,
body.single-sfwd-courses .btn-join,
body.single-sfwd-courses #learndash_mark_complete_button,
body.single-sfwd-courses .ld-status.ld-status-incomplete{display:none !important}

/* General FAQ page: an accordion of questions (<details>). */
.faq-list{max-width:820px;margin:0 auto}
.faq-item{border-top:1px solid var(--color-divider)}
.faq-item:last-child{border-bottom:1px solid var(--color-divider)}
.faq-q{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-6);
  padding:var(--space-6) 0;cursor:pointer;list-style:none;user-select:none;
  font-family:var(--font-heading);font-weight:600;font-stretch:var(--font-heading-stretch);
  font-size:19px;line-height:1.3}
.faq-q::-webkit-details-marker{display:none}
.faq-caret{flex:none;margin-top:6px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;
  border-top:6px solid var(--color-text-faint);transition:transform .15s}
.faq-item[open] .faq-caret{transform:rotate(180deg)}
.faq-q:hover{color:var(--color-accent)}
.faq-a{margin:0 0 var(--space-6);max-width:70ch;font-size:16px;line-height:1.6;color:var(--color-text-muted)}

/* compact key/value in side cards */
.kv-compact{gap:var(--space-2)}
.kv-compact .kv-row{padding-bottom:var(--space-2)}
.kv-compact dt{min-width:96px;font-size:12px}
.kv-compact dd,.kv-strong dd{color:var(--color-text)}
.kv-wide dt{min-width:124px}
.kv-deliver dt{min-width:150px}

.band-actions{max-width:340px;width:100%}

/* publication rows, search hits */
.pub{padding:var(--space-6) 0;border-bottom:1px solid var(--color-divider)}
.pub .card-meta,.search-hit .card-meta{margin-bottom:var(--space-2)}
.pub h4{margin:0 0 var(--space-2)}
.pub p{font-size:14px;margin:0 0 var(--space-3);color:var(--color-text-muted)}
.pub p.pub-original{font-size:13px;margin-top:calc(-1 * var(--space-1))}

/* author / trainer identity */
.person{display:flex;gap:var(--space-4);align-items:center}
.person .avatar{flex:none}
.avatar-sm{width:64px;height:64px}
.person-role{font-size:12px;color:var(--color-text-muted)}
.post-end{margin-top:calc(var(--space-8) * 1.5);padding-top:var(--space-6);border-top:1px solid var(--color-divider);
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap}
.post-end p{margin:0;font-size:14px;color:var(--color-text-muted)}

/* forms */
.form-stack{gap:var(--space-6)}
.seg-box{border:1px solid var(--color-divider);border-radius:var(--radius-md)}
.hp{position:absolute;left:-9999px}
.form-actions{align-items:center;gap:var(--space-6)}
.form-actions .tile-note{max-width:38ch}
.radio-row{gap:var(--space-6)}
.phz-search-form{display:flex;gap:var(--space-2);align-items:center}
.phz-search-form .input{flex:1;min-width:0}
.phz-search-form .btn{flex:none}
.blog-search{margin-top:var(--space-8);max-width:560px}
.search-intro{margin-top:var(--space-6);max-width:520px}
.tips{gap:var(--space-2)}
.tips .tile-note{font-size:14px}

/* thanks page next steps */
.next-steps{gap:var(--space-4)}
.next-step{display:flex;gap:var(--space-4);align-items:baseline}
.next-step .step-num{min-width:32px;margin:0}
.next-step-head{margin-bottom:var(--space-1)}
.next-step p{margin:0;font-size:14px;color:var(--color-text-muted)}

/* public dates table */
.events .ev-date{width:140px;white-space:nowrap;font-family:var(--font-mono);font-size:13px;
  color:var(--color-text-muted)}
.events .ev-name{display:block}
.events .ev-what{font-size:13px;color:var(--color-text-muted)}
.events .ev-act{width:120px;text-align:right}

/* page shell and footer brand */
.site{background:var(--color-bg);color:var(--color-text);min-height:100vh;display:flex;flex-direction:column}
.brand-footer{margin-bottom:var(--space-4)}
.brand-footer .brand-mark{height:44px}
.brand-footer .brand-word{height:23px}
/* a thin brand-gradient line under the header */
.hdr::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gradient-brand);opacity:.55}

/* services index */
.service-tiles{gap:var(--space-3)}
.service-list{padding-bottom:calc(var(--space-8) * 2)}
.service-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;
  padding:calc(var(--space-8) * 1.6) 0;border-top:1px solid var(--color-divider)}
/* alternate the panel to the left on even rows */
.service-row.is-reverse .service-copy{order:2}
.service-row.is-reverse .service-does{order:1}
.service-copy{max-width:46ch}
.service-ico{display:inline-flex;width:52px;height:52px;align-items:center;justify-content:center;
  border-radius:var(--radius-md);color:var(--color-accent);margin-bottom:var(--space-4);
  background:color-mix(in srgb,var(--color-accent) 12%,transparent)}
.service-ico .phz-icon{width:28px;height:28px}
.service-does{padding:var(--space-8)}
.service-does .eyebrow{margin-bottom:var(--space-4)}
.service-who{font-size:14px;color:var(--color-accent-300);margin:var(--space-4) 0 var(--space-6)}
/* a check-marked list for "what we do" */
.check-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-3)}
.check-list li{position:relative;padding-left:calc(var(--space-6) + 2px);font-size:15px;line-height:1.5;color:var(--color-text-muted)}
.check-list li::before{content:"";position:absolute;left:0;top:7px;width:14px;height:8px;
  border-left:2px solid var(--color-accent);border-bottom:2px solid var(--color-accent);transform:rotate(-45deg)}
@media (max-width:900px){
  .service-row{grid-template-columns:minmax(0,1fr)}
  .service-row.is-reverse .service-copy{order:1}
  .service-row.is-reverse .service-does{order:2}
}
.tag-row-mt{margin-top:var(--space-6)}
.step .kicker-plain{margin-bottom:var(--space-3)}
.step p{font-size:15px}
.side-note{margin-bottom:var(--space-6)}
.td-key{width:32%}
.lede-gap-b{margin-bottom:var(--space-8)}
.side-text{font-size:14px;color:var(--color-text-muted)}
.h1-tight{margin:0 0 var(--space-4)}
.contact-side{gap:var(--space-4)}
/* Contact reassurance column (what happens next, figures, logos) */
.contact-steps{margin:0;padding:0;list-style:none;counter-reset:step;display:flex;flex-direction:column;gap:var(--space-4)}
.contact-steps li{position:relative;padding-left:calc(26px + var(--space-4));font-size:14px;line-height:1.5;color:var(--color-text-muted)}
.contact-steps li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:-1px;
  width:26px;height:26px;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--color-accent);
  border-radius:50%;background:color-mix(in srgb,var(--color-accent) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--color-accent) 35%,transparent)}
.contact-figures{display:flex;flex-direction:column;gap:var(--space-4)}
.contact-figure{display:flex;align-items:baseline;gap:var(--space-3)}
.contact-figure-big{font-family:var(--font-heading);font-weight:600;font-stretch:var(--font-heading-stretch);
  font-size:30px;line-height:1;color:var(--color-text);flex:none}
.contact-figure-note{font-size:13px;color:var(--color-text-muted)}
/* Contact: the home page logo band (phz_venue_marquee), sized for the column. */
.contact-marquee{margin-top:var(--space-1)}
.contact-marquee .logo-track .venue-logo{width:112px;margin-right:var(--space-3)}

/* ── About page ─────────────────────────────────────────────────────────── */
.founder-head{margin-bottom:var(--space-8)}
.founder{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:calc(var(--space-8) * 1.5);align-items:start}
.founder-photo{margin:0;border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface)}
.founder-photo img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.founder-name{margin:0}
.founder-role{display:block;font-size:14px;color:var(--color-accent-300);margin:var(--space-2) 0 var(--space-6)}
.founder-bio{font-size:16px;line-height:1.6;color:var(--color-text-muted);max-width:62ch;margin:0 0 var(--space-6)}
@media (max-width:760px){.founder{grid-template-columns:minmax(0,1fr)}.founder-photo{max-width:260px}}
.timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.timeline-item{display:grid;grid-template-columns:minmax(0,110px) minmax(0,1fr);gap:var(--space-6);
  padding:var(--space-6) 0;border-top:1px solid var(--color-divider)}
.timeline-item:last-child{border-bottom:1px solid var(--color-divider)}
.timeline-year{font-family:var(--font-heading);font-weight:700;color:var(--color-accent)}
.timeline-body{color:var(--color-text-muted)}
.about-figures{display:flex;flex-wrap:wrap;gap:calc(var(--space-8) * 1.5);margin-top:calc(var(--space-8) * 1.5)}
.about-nda{margin-top:var(--space-8);font-size:15px;color:var(--color-text-muted);max-width:70ch}
.about-nda a{color:var(--color-accent)}

/* detail pages (service, training, product) */
.detail-hero{padding:calc(var(--space-8) * 1.6) 0 calc(var(--space-8) * 2)}
.detail-split{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.detail-title{margin:0 0 var(--space-6);max-width:22ch}
.tag-row-mb{margin-bottom:var(--space-6)}
.th-key{width:36%}
.tile-list{gap:var(--space-3)}
.tile-kicker{margin:0 0 var(--space-1)}
.phase-title{margin:0}

/* posts, search, course steps, course cards */
.post-title{max-width:28ch}
.author-cta{margin-top:var(--space-6)}
.search-hits{gap:0}
.step-head{padding:var(--space-6) 0 0}
.step-body{padding-top:var(--space-8)}
.course-card .card-meta{gap:var(--space-3)}
.course-card .card-title{font-size:19px}
.course-kit{color:var(--color-accent-300);font-size:12px}
/* Course price in the Book it card */
.course-price{font-family:var(--font-heading);font-weight:700;font-size:22px;line-height:1.1;color:var(--color-text);margin:0 0 var(--space-4)}
.course-ask{margin:var(--space-4) 0 0}
.course-enrolled{margin:0 0 var(--space-4);color:var(--color-text)}
.course-enrolled-progress{margin:0 0 var(--space-6)}
.course-howto{margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--color-divider)}
.course-howto-title{font-size:13px;font-weight:600;color:var(--color-text);margin-bottom:var(--space-3)}
.course-howto ol{margin:0 0 var(--space-4);padding-left:1.2em;color:var(--color-text-muted);font-size:14px;line-height:1.5}
.course-howto li{margin:0 0 var(--space-2)}
.course-oneuser{margin:var(--space-4) 0 var(--space-6);padding:var(--space-3) var(--space-4);border-left:2px solid var(--color-accent);background:color-mix(in srgb,var(--color-accent) 8%,transparent);border-radius:var(--radius-sm);font-size:13px;line-height:1.45;color:var(--color-text)}
/* On-demand: our heading sits beside the LearnDash list, so drop its own title. */
.course-od-content .ld-section-heading>h2{display:none}
.course-od-content .ld-section-heading{justify-content:flex-end}
.course-od-content .article{max-width:none}
#enrol,#course-content,#dates{scroll-margin-top:96px}
.phz-video{position:relative;aspect-ratio:16/9;margin:0 0 var(--space-8);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-neutral-900)}
.phz-video iframe,.phz-video video{position:absolute;inset:0;width:100%;height:100%;border:0}
.phz-video video{background:#000}
/* [download] buttons in lessons and topics */
.phz-download{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-4);margin:var(--space-6) 0}
.phz-download .btn{gap:8px}
.phz-download-size{font-size:13px;color:var(--color-text-muted)}
.phz-download-note{flex-basis:100%;font-size:12px;color:var(--color-text-muted)}
/* Lesson / topic pages: course menu on the left, the step (and its video) wide on the right. */
.step-layout,.step-crumbs{max-width:1440px}
.step-crumbs{margin-bottom:var(--space-6);padding-left:var(--space-8);padding-right:var(--space-8)}
@media (max-width:960px){.step-crumbs{padding-left:var(--space-6);padding-right:var(--space-6)}}
.step-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:calc(var(--space-8) * 1.5);align-items:start;padding-bottom:calc(var(--space-8) * 2)}
.step-layout-single{grid-template-columns:minmax(0,1fr)}
.step-title{margin:0 0 var(--space-8)}
.step-main .article{max-width:none}
.step-main .article>p,.step-main .article>ul,.step-main .article>ol{max-width:75ch}
.step-nav{position:sticky;top:96px;max-height:calc(100vh - 120px);overflow:auto;background:var(--color-surface);border:1px solid var(--color-divider);border-radius:var(--radius-lg);padding:var(--space-6)}
.step-nav-toggle{display:none;cursor:pointer;font-weight:600;color:var(--color-text);list-style:none}
.step-nav-toggle::-webkit-details-marker{display:none}
.step-nav-course{display:block;font-family:var(--font-heading);font-weight:700;color:var(--color-text);text-decoration:none;line-height:1.25;margin:0 0 var(--space-4)}
.step-nav-course:hover{color:var(--color-accent)}
.step-nav-progress{margin:0 0 var(--space-6)}
.step-nav-bar{height:6px;border-radius:99px;background:var(--color-neutral-900);overflow:hidden}
.step-nav-bar span{display:block;height:100%;background:var(--color-accent);border-radius:99px}
.step-nav-count{display:block;margin-top:var(--space-2);font-size:13px;color:var(--color-text-muted)}
.step-nav ol{list-style:none;margin:0;padding:0}
.step-nav-lessons>li{border-top:1px solid var(--color-divider)}
.step-nav-lessons summary,.step-nav-lesson{display:flex;gap:var(--space-3);align-items:baseline;padding:var(--space-4) 0;cursor:pointer;list-style:none}
.step-nav-lessons summary::-webkit-details-marker{display:none}
.step-nav-lessons summary::after{content:"";margin-left:auto;flex:none;width:7px;height:7px;border-right:2px solid var(--color-text-muted);border-bottom:2px solid var(--color-text-muted);transform:rotate(45deg) translateY(-3px)}
.step-nav-lessons details[open]>summary::after{transform:rotate(-135deg) translateY(-1px)}
.step-nav-num{font-family:var(--font-mono,monospace);font-size:12px;color:var(--color-accent);flex:none}
.step-nav a{color:var(--color-text);text-decoration:none;font-size:14px;line-height:1.35}
.step-nav a:hover,.step-nav a[aria-current="page"]{color:var(--color-accent)}
.step-nav-topics{padding:0 0 var(--space-4) calc(var(--space-6) + 4px)!important}
.step-nav-topics li{position:relative;padding:var(--space-2) 0 var(--space-2) var(--space-6)}
.step-nav-topics li::before{content:"";position:absolute;left:0;top:calc(var(--space-2) + 6px);width:8px;height:8px;border-radius:50%;border:1.5px solid var(--color-text-muted)}
.step-nav-topics li.is-done::before{background:var(--color-accent);border-color:var(--color-accent)}
.step-nav-topics li.is-current::before{border-color:var(--color-accent)}
.step-nav-topics a{color:var(--color-text-muted)}
.step-nav-lessons>li.is-done>details>summary a::after,.step-nav-lessons>li.is-done .step-nav-lesson a::after{content:" \2713";color:var(--color-accent)}
@media (max-width:960px){
.step-layout{grid-template-columns:minmax(0,1fr);gap:var(--space-8)}
.step-nav{position:static;max-height:none;padding:var(--space-4) var(--space-6)}
.step-nav-toggle{display:block}
.step-nav-box[open] .step-nav-toggle{margin-bottom:var(--space-4)}
}
/* Course price on the grid card (comparison stage) */
.course-card-price{font-family:var(--font-heading);font-weight:700;font-size:15px;color:var(--color-accent-300);margin-top:var(--space-1)}
/* Course modalities (how it's taught / assessed / access / accessibility) */
.modalities-title{margin-bottom:var(--space-8)}
.modalities .panel-title{font-size:16px;margin-bottom:var(--space-2)}
.modalities .panel-body{font-size:15px;line-height:1.55}
/* Trainings index: registered training-organisation strip */
.of-strip{border-top:1px solid var(--color-divider);padding-top:var(--space-8)}
.of-item h4{margin:0 0 var(--space-3);font-size:15px;color:var(--color-accent-300)}
.of-item p{margin:0;font-size:14px;color:var(--color-text-muted);line-height:1.55}
/* Trainings colour code: a theme accent (--ct) on the card top edge + a label. */
.course-card{border-top:3px solid var(--ct,var(--color-accent))}
.course-card .card-inner{padding-top:var(--space-8)}
.course-theme{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-body);
  font-size:12px;font-weight:600;letter-spacing:0;color:var(--ct,var(--color-accent))}
.course-theme-dot{width:8px;height:8px;border-radius:50%;background:var(--ct,var(--color-accent));flex:none}

/* ── Products index ──────────────────────────────────────────────────────── */
.price-note{margin:var(--space-6) 0 0;font-size:14px;color:var(--color-accent-300)}
/* Products: "Training included" as a tag rather than a throwaway line. */
.kit-tag{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-3);margin:var(--space-6) 0 0;font-size:14px}
.kit-tag-badge{display:inline-flex;align-items:center;gap:6px;flex:none;
  padding:6px 12px 6px 9px;border-radius:999px;font-weight:600;font-size:13px;
  color:var(--color-accent);background:color-mix(in srgb,var(--color-accent) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--color-accent) 35%,transparent)}
.kit-tag-badge .phz-icon{width:16px;height:16px}
.kit-tag-text{color:var(--color-text-muted);max-width:46ch}
.jump{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-6);margin-top:var(--space-8);
  padding-top:var(--space-4);border-top:1px solid var(--color-divider)}
.jump a{font-size:14px;color:var(--color-neutral-300);text-decoration:none}
.jump a:hover{color:var(--color-accent)}
.product-group{padding:calc(var(--space-8) * 2) 0 0;scroll-margin-top:80px}
.product-group.is-last{padding-bottom:calc(var(--space-8) * 3)}
.group-head{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:calc(var(--space-8) * 2);
  align-items:baseline;padding-bottom:var(--space-6);margin-bottom:var(--space-8);border-bottom:1px solid var(--color-divider)}
.group-head h2{margin:0;font-size:26px}
.group-head p{margin:0;max-width:62ch;font-size:15px;color:var(--color-text-muted)}
.product-badge{font-family:var(--font-mono);font-size:12px;color:var(--color-accent-300)}
.product-badge:empty{display:none}
.spec-list{list-style:none;margin:0;padding:var(--space-4) 0 0;border-top:1px solid var(--color-divider);
  display:flex;flex-direction:column;gap:var(--space-2);font-family:var(--font-mono);font-size:13px;
  color:var(--color-neutral-300)}
.spec-list li::before{content:"· ";color:var(--color-accent)}
/* software: one wide feature */
.product-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:calc(var(--space-8) * 2);align-items:center}
.product-feature.no-media{grid-template-columns:minmax(0,1fr)}
.product-feature.no-media .product-feature-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-4) calc(var(--space-8) * 2);align-items:start}
.product-feature.no-media .product-feature-body > .spec-list{grid-column:2;grid-row:1 / span 4;border-top:0;padding-top:0}
.product-feature-body{display:flex;flex-direction:column;gap:var(--space-4);align-items:flex-start}
.product-feature-body > .btn{justify-self:start;margin-top:var(--space-2)}
.product-feature h3{margin:0;font-size:30px}
.product-feature h3 a,.product-row h3 a{color:inherit;text-decoration:none}
.product-feature h3 a:hover,.product-row h3 a:hover{color:var(--color-accent)}
.product-feature p{margin:0;max-width:56ch;font-size:16px;color:var(--color-text-muted)}
.product-feature .spec-list{align-self:stretch}
/* kits: photo cards */
.product-cards{gap:var(--space-8)}
.product-card .card-inner{gap:var(--space-4)}
.product-card .card-title{margin:0;font-size:22px}
.product-card .card-body{flex:0 0 auto}
.product-card .spec-list{flex:1}
/* benches: rows */
.product-rows{border-top:1px solid var(--color-divider)}
.product-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;gap:calc(var(--space-8) * 1.5);
  align-items:start;padding:var(--space-8) 0;border-bottom:1px solid var(--color-divider)}
.product-row h3{margin:0 0 var(--space-3);font-size:22px}
.product-row p{margin:0;font-size:15px;max-width:52ch;color:var(--color-text-muted)}
.product-row .spec-list{border-top:0;padding-top:0}
@media (max-width:900px){
  .group-head,.product-feature,.product-row,
  .product-feature.no-media .product-feature-body{grid-template-columns:minmax(0,1fr)}
  .product-feature.no-media .product-feature-body > .spec-list{grid-column:auto;grid-row:auto}
  .product-row{gap:var(--space-4)}
  .product-cards{grid-template-columns:minmax(0,1fr)}
}

/* product detail */
.h1-flush{margin:0}
.lede-aside{font-size:16px;max-width:46ch}
.facts{padding:var(--space-4) 0;border-top:1px solid var(--color-divider);border-bottom:1px solid var(--color-divider)}
.facts .kv-row{border:0;padding:0}
.facts dt{min-width:110px;font-size:12px}
.facts dd{font-size:14px;color:var(--color-text)}
.th-item{width:38%}
.th-qty,.td-qty{width:64px;text-align:right}
.td-qty{font-family:var(--font-mono)}
.table.specs td:first-child{width:44%}
.table.specs td:last-child{font-family:var(--font-mono);font-size:13px;color:var(--color-neutral-200)}

/* ── Home ───────────────────────────────────────────────────────────────── */
.hero-home{padding:calc(var(--space-8) * 3.5) 0 calc(var(--space-8) * 2)}
.hero-home .lede{margin-bottom:0}
.hero-home .btn-row{margin-top:var(--space-8)}
.has-photo::before{display:none}
.has-photo .hero-home{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:calc(var(--space-8) * 2);align-items:center}
.has-photo .hero-home h1{font-size:44px}
.hero-photo{margin:0}
.hero-photo figcaption{font-size:12px;color:var(--color-text-muted)}
.th-tech{width:34%}
.band-title{margin:0 0 var(--space-8);max-width:26ch}
.panel-title{margin:0}
.panel-body{margin:0;font-size:15px}
.panel-lines{list-style:none;margin:0;padding:var(--space-3) 0 0;border-top:1px solid var(--color-divider);
  display:flex;flex-direction:column;gap:var(--space-2);font-size:15px;color:var(--color-text-muted)}
/* evidence: figures and conferences */
.figures{display:flex;flex-direction:column;gap:var(--space-4);margin:var(--space-8) 0 0}
.figures div{display:flex;align-items:baseline;gap:var(--space-4)}
.figures dt{font-family:var(--font-mono);font-size:30px;line-height:1;min-width:3.2ch;color:var(--color-text)}
.figures dt a{color:inherit;text-decoration:none}
.figures dt a:hover{color:var(--color-accent)}
.figures dd{margin:0;font-size:14px;color:var(--color-text-muted)}
.venues{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-6)}
.venue{display:flex;flex-direction:column;gap:var(--space-2);text-decoration:none;color:inherit}
/* Logo wall. The source logos ship with mixed backgrounds (some transparent,
   some solid), so a uniform invert can't be used; instead each logo keeps a
   calm light tile, dark for the white logos, with a subtle border to lift the
   wall off the flat ground. */
.venue-logo{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;
  background:#f4f5f7;border-radius:var(--radius-md);box-shadow:inset 0 0 0 1px var(--color-divider);
  transition:transform .15s}
a.venue:hover .venue-logo{transform:translateY(-2px)}
.venue-logo img{position:absolute;inset:20% 14%;width:72%;height:60%;object-fit:contain}
.venue-logo-text{font-family:var(--font-heading);font-weight:600;color:#161826;text-align:center}
a.venue:hover .venue-name{color:var(--color-accent)}
.venue-name{font-size:14px}
.venue-meta{font-family:var(--font-mono);font-size:12px;color:var(--color-text-muted)}
.why-text{max-width:760px}
.why-body{margin-bottom:var(--space-6);max-width:52ch}
.why-creds{margin:0 0 var(--space-6)}
@media (max-width:1100px){.venues{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){
  .has-photo .hero-home{grid-template-columns:minmax(0,1fr)}
  .has-photo .hero-home h1{font-size:34px}
  .venues{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
}
.venues-section{padding-bottom:calc(var(--space-8) * 2)}
.venue-logo.is-dark{background:#0f1016;box-shadow:inset 0 0 0 1px var(--color-divider)}

/* Home logo band: the venues scroll past continuously, full-bleed, with the
   edges faded out. Pauses on hover; falls back to a manual scroller when the
   viewer prefers reduced motion. */
.proof-head{margin-bottom:var(--space-8);max-width:48ch}
.logo-marquee{position:relative;overflow:hidden;width:100%;padding:var(--space-2) 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.logo-track{display:flex;width:max-content;animation:phz-marquee linear infinite;will-change:transform}
.logo-marquee:hover .logo-track,.logo-marquee:focus-within .logo-track{animation-play-state:paused}
.logo-track .venue-logo{flex:0 0 auto;width:148px;margin-right:var(--space-4);aspect-ratio:16/9}
@keyframes phz-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .logo-track{animation:none;width:auto}
  .logo-marquee{overflow-x:auto;scrollbar-width:thin}
}
@media (max-width:900px){.logo-track .venue-logo{width:120px}}
/* page intro with a photo (products) */
.hero-split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:calc(var(--space-8) * 2);align-items:center}
@media (max-width:900px){.hero-split{grid-template-columns:minmax(0,1fr)}}
.product-group.is-last{padding-bottom:calc(var(--space-8) * 2)}
.hero-split .jump{grid-column:1 / -1}
.figures-row{flex-direction:row;flex-wrap:wrap;justify-content:space-between;gap:var(--space-8);margin:0}
.figures-row div{flex-direction:column;gap:var(--space-2)}
.fit-list{max-width:560px}
/* Bands and the footer line up with the other sections on wide screens (the
   page sections drop the side padding of .wrap; these kept 24px). */
@media (min-width:1241px){.band > .wrap,.site-footer > .wrap{padding-left:0;padding-right:0}}
/* A post's cover on its own page: the whole picture, no crop, in its colours */
.media-natural{aspect-ratio:auto;display:flex;justify-content:center;background:#f3f4f7}
.media-natural > img{position:static;width:auto;max-width:100%;height:auto;max-height:560px;object-fit:contain}
/* logo-only conference tiles */
.venues{gap:20px}
.venues-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.venues > li{display:flex}
.venues .venue-logo{flex:1}
@media (max-width:900px){.venues-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* services index: the four tiles as a numbered index */
.service-tiles .tile{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6) var(--space-8)}
.service-tiles .step-num{display:block;margin:0;font-family:var(--font-mono);font-size:32px;line-height:1;color:var(--color-accent)}
.service-tiles .tile-name{margin:0;font-size:17px}
.service-tiles .tile:hover .step-num{color:var(--color-accent-400)}
/* Big bold numbers: the services index (tiles and rows), each service's number,
   the "How it runs" steps, course days and the thank-you steps */
.service-tiles .step-num{font-weight:600}
.phase .step-num{font-size:24px;line-height:1.1;font-weight:600;color:var(--color-accent)}
.phase-row{align-items:baseline}
.next-step .step-num{font-family:var(--font-mono);font-size:24px;line-height:1.1;font-weight:600}
.phase .step-num,.phase-pad{min-width:96px}
@media (max-width:560px){.phase .step-num,.phase-pad{min-width:72px}.phase .step-num{font-size:20px}}
@media (min-width:1241px){.service-list{padding-left:0;padding-right:0}}
/* Training covers (16:9, like the Hackademy posters) on cards and course pages */
.media-16x9{aspect-ratio:16/9}
.course-card .card-inner{gap:var(--space-3)}
.course-card .card-body{flex:1}
/* logo tiles in centred rows, so an incomplete last row sits in the middle */
.venues,.venues-3{display:flex;flex-wrap:wrap;justify-content:center}
.venues > li{flex:0 0 calc((100% - 3 * 20px) / 4)}
.venues-3 > li{flex-basis:calc((100% - 2 * 20px) / 3)}
@media (max-width:900px){.venues > li,.venues-3 > li{flex-basis:calc((100% - 20px) / 2)}}
/* Home "What we test": domain tiles, a name and a few keywords, read at a glance */
.domains{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4)}
.domains li{display:flex}
.domains li > a,.domains li > div{flex:1;display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-6);
  background:var(--color-surface);border-radius:var(--radius-md);border:1px solid var(--color-divider);
  color:inherit;text-decoration:none;transition:border-color .15s,background-color .15s,transform .15s}
.domains li > a:hover,.domains li > a:focus-visible{border-color:color-mix(in srgb,var(--color-accent) 55%,transparent);
  background:color-mix(in srgb,var(--color-accent) 7%,var(--color-surface));transform:translateY(-2px)}
.domains li > a:hover .domain-name{color:var(--color-accent)}
.domain-icon{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;
  border-radius:var(--radius-md);color:var(--color-accent);margin-bottom:var(--space-1);
  background:color-mix(in srgb,var(--color-accent) 12%,transparent)}
.domain-icon .phz-icon{width:22px;height:22px}
.domain-name{font-family:var(--font-heading);font-weight:600;font-stretch:var(--font-heading-stretch);font-size:18px;line-height:1.2}
.domain-keys{font-size:15px;line-height:1.45;color:var(--color-text-muted)}
@media (max-width:1100px){.domains{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* generic inline line-icon */
.phz-icon{display:block;width:24px;height:24px;flex:none}

/* Home "Next up" highlight - used when only a date or two are public, so a lone
   table row is replaced by one confident card. */
.event-next{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-8);
  border:1px solid var(--color-divider);border-radius:var(--radius-md);background:var(--color-surface);
  text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.event-next:hover,.event-next:focus-visible{border-color:color-mix(in srgb,var(--color-accent) 55%,transparent);transform:translateY(-2px)}
.event-next-tag{font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:0;color:var(--color-accent)}
.event-next-date{font-family:var(--font-heading);font-weight:600;font-stretch:var(--font-heading-stretch);font-size:26px;line-height:1.1}
.event-next-name{font-size:17px;font-weight:600}
.event-next-what{font-size:15px;color:var(--color-text-muted)}
.event-next-cta{margin-top:var(--space-2);font-size:14px;font-weight:600;color:var(--color-accent)}

/* Home "Where to start": one row per buyer situation, the whole row is the link */
.routes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.route{display:flex;flex-direction:column;gap:var(--space-2);height:100%;padding:var(--space-6) var(--space-8);
  border:1px solid var(--color-divider);border-radius:var(--radius-md);text-decoration:none;color:inherit;background:var(--color-bg)}
.route:hover,.route:focus-visible{border-color:var(--color-accent)}
.route-who{font-family:var(--font-heading);font-weight:600;font-stretch:var(--font-heading-stretch);font-size:19px;line-height:1.25}
.route-what{font-size:15px;color:var(--color-text-muted);flex:1}
.route-cta{font-size:14px;font-weight:600;color:var(--color-accent);margin-top:var(--space-2)}
@media (max-width:900px){.routes{grid-template-columns:minmax(0,1fr)}.route{padding:var(--space-6)}}

/* technology pages */
.attack-list .qa h4{font-size:19px}
.pub-link{display:block;text-decoration:none;color:inherit}
.pub-link:hover h4{color:var(--color-accent)}
.pub-link h4{margin:0}
/* five services in the index row */
.service-tiles{grid-template-columns:repeat(5,minmax(0,1fr))}

/* Top menu: a little more separation between the horizontal links, medium
   weight, and a bold accent on the current page. */
.hdr .nav-links{gap:var(--space-2)}
.hdr .nav-item > a{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);text-align:center}
.hdr .nav-cta{text-align:center}
.hdr .nav-item:not(.has-sub) > a:hover,
.hdr .nav-item.has-sub:hover > a{background:color-mix(in srgb,var(--color-text) 7%,transparent);color:var(--color-text)}
.hdr .nav-item > a[aria-current="page"]{color:var(--color-accent);font-weight:600}
@media (max-width:900px){
  /* stacked mobile menu keeps its own spacing */
  .hdr .nav-item > a{padding:var(--space-1) 0}
  .hdr .nav-item > a:hover,.hdr .nav-item.has-sub:hover > a{background:transparent}
}

/* "Originally posted on the community" line at the end of imported posts */
.article .phz-source{margin-top:calc(var(--space-8) * 1.5);padding-top:var(--space-6);
  border-top:1px solid var(--color-divider);font-size:14px;color:var(--color-text-muted)}

/* Live and tailored trainings: no LearnDash enrol box (booked on quote) */
.course-ld-nobox .ld-course-status { display: none; }
