/* ==========================================================================
   Sequenzo v13 — Professional design
   Loaded only when Settings → Header → Site design = Professional.
   Colours come from the theme tokens (Settings → Branding), so every preset
   and custom colour still applies. --hp-navy is the band colour used by the
   top bar, method, teams and footer; set it in Settings → Header or it is
   mixed from the primary and text colours.
   ========================================================================== */

body.bp{
  --hp-navy:var(--navy-band,color-mix(in srgb,var(--bp-brand) 55%,var(--bp-ink)));
  --hp-navy-2:color-mix(in srgb,var(--hp-navy) 82%,#000);
  --hp-amber:var(--bp-accent);
  --hp-hi:var(--bp-hi);
  --hp-line:var(--bp-rule);
  --hp-muted:color-mix(in srgb,var(--bp-ink) 62%,#fff);
  --hp-r:4px;
}
body.design-pro{--bp-rad:6px;--bp-btn-r:3px}

/* ------------------------------------------------------------- shared bits */
body.bp .hp-eyebrow{font:500 .78rem/1 var(--bp-mono-font);letter-spacing:.16em;color:var(--hp-muted);margin-bottom:14px}
body.bp .hp-eyebrow span{color:color-mix(in srgb,var(--hp-muted) 60%,#fff);letter-spacing:0;margin-right:4px}
body.bp .hp-eyebrow--dark{color:color-mix(in srgb,var(--hp-hi) 80%,#fff)}
body.bp .hp-eyebrow--dark span{color:color-mix(in srgb,var(--hp-hi) 55%,transparent)}
body.design-pro .bp-eyebrow{font:500 .78rem/1 var(--bp-mono-font);letter-spacing:.16em;color:var(--hp-muted);margin-bottom:14px}
body.design-pro .bp-head h2,body.bp .hp-why h2,body.bp .hp-voices h2,body.bp .hp-faq h2{font-size:clamp(1.7rem,2.6vw,2.15rem);letter-spacing:-.02em;line-height:1.15}
body.bp .hp-lead{max-width:560px;margin:10px 0 0;color:color-mix(in srgb,#fff 72%,var(--hp-navy));font-size:1rem;line-height:1.6}

body.bp .hp-actions{display:flex;flex-wrap:wrap;gap:12px}
body.bp .hp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:1px solid transparent;border-radius:var(--bp-btn-r);font:600 .95rem/1.2 var(--body);text-decoration:none!important;cursor:pointer;white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s}
body.bp .hp-btn--amber{background:var(--hp-amber);border-color:var(--hp-amber);color:var(--bp-on-accent)!important}
body.bp .hp-btn--amber:hover{background:color-mix(in srgb,var(--hp-amber) 88%,#000);box-shadow:0 10px 24px -12px color-mix(in srgb,var(--hp-amber) 90%,transparent)}
body.bp .hp-btn--glass{background:transparent;border-color:rgba(255,255,255,.55);color:#fff!important}
body.bp .hp-btn--glass:hover{background:rgba(255,255,255,.1);border-color:#fff}
body.bp .hp-btn--brand{background:var(--bp-brand);border-color:var(--bp-brand);color:var(--bp-on-brand)!important}
body.bp .hp-btn--brand:hover{background:color-mix(in srgb,var(--bp-brand) 84%,#000)}
body.bp .hp-btn--outline{background:var(--bp-surface);border-color:var(--hp-line);color:var(--bp-ink)!important}
body.bp .hp-btn--outline:hover{border-color:var(--bp-ink)}
body.bp .hp-btn--block{width:100%}

/* ------------------------------------------------------------------ header */
body.design-pro .bp-topbar{background:var(--hp-navy);color:rgba(255,255,255,.82);font-size:.78rem}
body.design-pro.topbar-light .bp-topbar{background:var(--bp-soft);color:var(--bp-muted)}
body.design-pro.topbar-brand .bp-topbar{background:var(--bp-brand)}
body.design-pro .bp-topbar__inner{min-height:38px}
body.design-pro .bp-topbar__msg{display:inline-flex;align-items:center;gap:8px;letter-spacing:.08em;text-transform:uppercase;font-size:.74rem;color:inherit;text-decoration:none}
body.design-pro a.bp-topbar__msg:hover{color:#fff}
body.design-pro .bp-topbar__dot{width:7px;height:7px;border-radius:50%;background:#2ecc71;box-shadow:0 0 0 0 rgba(46,204,113,.6);animation:hp-pulse 2.2s infinite;flex:none}
@keyframes hp-pulse{0%{box-shadow:0 0 0 0 rgba(46,204,113,.55)}70%{box-shadow:0 0 0 7px rgba(46,204,113,0)}100%{box-shadow:0 0 0 0 rgba(46,204,113,0)}}
body.no-motion .bp-topbar__dot{animation:none}
body.design-pro .bp-topbar__right{gap:0}
body.design-pro .bp-topbar__right a{color:color-mix(in srgb,var(--hp-hi) 55%,#fff);font-size:.8rem}
body.design-pro .bp-topbar__right a:hover{color:#fff}
body.design-pro .bp-topbar__right a+a::before{content:"·";margin:0 16px;color:rgba(255,255,255,.4)}

body.design-pro .bp-bar{background:var(--bp-surface);border-bottom:1px solid var(--hp-line)}
body.design-pro .bp-bar__inner{min-height:68px;align-items:center}
body.design-pro .bp-brand{border-right:0;padding-right:24px}
body.design-pro .pb-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
body.design-pro .pb-brand__badge{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:3px;background:linear-gradient(135deg,var(--bp-brand),var(--hp-navy));color:#fff;font:700 .82rem/1 var(--display);letter-spacing:.02em}
body.design-pro .pb-brand__text{display:flex;flex-direction:column;gap:3px;line-height:1}
body.design-pro .pb-brand__name{font:700 1.18rem/1 var(--display);letter-spacing:-.01em;color:var(--bp-ink)}
body.design-pro .pb-brand__hl{color:var(--bp-brand)}
body.design-pro .pb-brand__tag{font:500 .58rem/1 var(--bp-mono-font);letter-spacing:.2em;color:var(--hp-muted)}

body.design-pro .bp-nav{justify-content:flex-end;font-family:var(--body);font-size:.93rem;gap:4px;margin-right:14px}
body.design-pro .bp-nav__item{border:0!important}
body.design-pro .bp-nav__link{padding:0 12px;min-height:44px;border-radius:3px;text-transform:none;letter-spacing:0;font-weight:500;color:var(--bp-ink)}
body.design-pro .bp-nav__link:hover{background:transparent;color:var(--bp-brand)}
body.design-pro .bp-nav__link.is-active{box-shadow:none;background:transparent;color:var(--bp-brand)}
body.design-pro .bp-nav__chev{display:inline-flex;margin-left:2px}
body.design-pro .bp-bar__actions{align-items:center;gap:10px}
body.design-pro .bp-header .bp-search-link{width:38px;height:38px;padding:0;justify-content:center;border:1px solid var(--hp-line)!important;border-radius:3px;color:var(--bp-ink)}
body.design-pro .bp-search-link:hover{border-color:var(--bp-ink);background:transparent}
body.design-pro .bp-link2{font-size:.92rem;font-weight:500;color:var(--bp-ink);text-decoration:none;padding:0 6px}
body.design-pro .bp-cta,body.design-pro .bp-cta--accent{min-height:38px;padding:0 16px;border-radius:3px;background:var(--hp-amber);color:var(--bp-on-accent)!important;font:600 .9rem/1 var(--body);letter-spacing:0}
body.design-pro .bp-cta:hover{background:color-mix(in srgb,var(--hp-amber) 88%,#000)!important;color:var(--bp-on-accent)!important}
body.design-pro .bp-cta--primary{background:var(--bp-brand);color:var(--bp-on-brand)!important}
body.design-pro .bp-cta--outline{background:transparent;border:1px solid var(--bp-ink);color:var(--bp-ink)!important}
body.design-pro .bp-burger{border:1px solid var(--hp-line);border-radius:3px;width:42px;height:38px;background:var(--bp-surface)}
body.design-pro .bp-header.has-shadow.is-scrolled .bp-bar,body.design-pro.is-scrolled .bp-bar{box-shadow:0 8px 24px -18px rgba(11,37,64,.4)}

/* -------------------------------------------------------------------- hero */
body.bp .hp-hero{
  --hp-bg1:var(--hp-navy);
  --hp-bg2:color-mix(in srgb,var(--bp-brand) 78%,var(--hp-navy));
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(60% 90% at 0% 100%,color-mix(in srgb,var(--hp-amber) 16%,transparent),transparent 60%),
    radial-gradient(55% 80% at 100% 0%,color-mix(in srgb,var(--hp-bg2) 90%,transparent),transparent 70%),
    linear-gradient(110deg,var(--hp-bg1) 0%,var(--hp-bg1) 45%,var(--hp-bg2) 100%);
}
body.bp .hp-hero.has-grid::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.35));mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.35))}
body.bp .hp-hero__grid{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:40px;align-items:end;padding-top:clamp(48px,6vw,84px)}
body.bp .hp-hero.no-art .hp-hero__grid{grid-template-columns:1fr}
body.bp .hp-hero__copy{padding-bottom:clamp(48px,6vw,70px);min-width:0}
body.bp .hp-hero__title{color:#fff;font-size:clamp(2.3rem,4.4vw,3.6rem);line-height:1.08;letter-spacing:-.025em;font-weight:700;max-width:16ch}
body.bp .hp-hero__title .hl{color:var(--hp-hi)}
body.bp .hp-hero__lede{margin:22px 0 28px;max-width:540px;font-size:1.08rem;line-height:1.65;color:rgba(255,255,255,.78)}
body.bp .hp-hero__lede strong{color:#fff;font-weight:600}
body.bp .hp-search{margin-top:34px;max-width:540px}
body.bp .hp-search__label{display:block;font-size:.72rem;letter-spacing:.16em;color:rgba(255,255,255,.62);margin-bottom:10px}
body.bp .hp-search__form{position:relative;display:flex;align-items:stretch;background:#fff;border-radius:3px;overflow:visible;box-shadow:0 18px 40px -22px rgba(0,0,0,.55)}
body.bp .hp-search__form>span{display:flex;align-items:center;padding:0 6px 0 14px;color:var(--bp-ink);font-size:.9rem}
body.bp .hp-search__form input{flex:1;min-width:0;border:0;outline:none;padding:15px 8px;font:inherit;font-size:.98rem;color:var(--bp-ink);background:transparent}
body.bp .hp-search__form button{border:0;padding:0 22px;background:var(--hp-amber);color:var(--bp-on-accent);font-weight:600;font-size:.86rem;letter-spacing:.06em;cursor:pointer;border-radius:0 3px 3px 0}
body.bp .hp-search__form button:hover{background:color-mix(in srgb,var(--hp-amber) 88%,#000)}
body.bp .hp-search__form .sg{top:calc(100% + 6px);left:0;right:0;color:var(--bp-ink)}
body.bp .hp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
body.bp .hp-chip{padding:5px 11px;border:1px solid rgba(255,255,255,.28);border-radius:999px;font-size:.74rem;color:rgba(255,255,255,.78);text-decoration:none;background:rgba(255,255,255,.04)}
body.bp .hp-chip:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.1)}
body.bp .hp-hero__art{display:flex;justify-content:center;align-self:end;min-width:0}
body.bp .hp-hero__art img{display:block;max-width:100%;height:auto}
body.bp .hp-hero__art.is-faded img{-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 72%,transparent 100%)}

/* ------------------------------------------------------------- stats band */
body.bp .hp-stats{background:linear-gradient(90deg,color-mix(in srgb,var(--hp-navy) 70%,#4a5a3a) 0%,var(--hp-navy-2) 45%,var(--hp-navy-2) 100%);border-top:1px solid rgba(255,255,255,.08);color:#fff}
body.bp .hp-hero+.hp-stats{margin-top:0}
body.bp .hp-stats__grid{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:24px;padding-block:30px}
body.bp .hp-stat b{display:block;font:700 1.55rem/1.1 var(--display);letter-spacing:-.01em;color:#fff}
body.bp .hp-stat span{display:block;margin-top:12px;font-size:.72rem;letter-spacing:.14em;color:color-mix(in srgb,var(--hp-hi) 50%,#fff)}

/* ----------------------------------------------------------------- vendors */
body.bp .hp-vendors{background:var(--bp-surface);border-bottom:1px solid var(--hp-line)}
body.bp .hp-vendors__inner{display:flex;align-items:center;gap:36px;padding-block:18px;flex-wrap:wrap}
body.bp .hp-vendors__label{font-size:.7rem;letter-spacing:.14em;color:var(--hp-muted);line-height:1.5;max-width:180px}
body.bp .hp-vendors__list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
body.bp .hp-vendors__list li{display:flex;align-items:center;min-height:38px;padding:0 13px;border:1px solid var(--hp-line);border-radius:3px;background:var(--bp-paper);font-weight:600;font-size:.86rem;color:var(--bp-ink)}
body.bp .hp-vendors__list img{max-height:22px;width:auto}

/* -------------------------------------------------------------- categories */
body.bp .hp-cats{padding-top:44px}
body.bp .hp-cats__row{display:grid;grid-template-columns:repeat(var(--n,6),minmax(0,1fr));background:var(--bp-surface);border:1px solid var(--hp-line);border-radius:var(--hp-r)}
body.bp .hp-cat{display:flex;flex-direction:column;gap:6px;padding:22px 16px 20px;text-decoration:none;color:var(--bp-ink);border-right:1px solid var(--hp-line);transition:background-color .15s}
body.bp .hp-cat:last-child{border-right:0}
body.bp .hp-cat:hover{background:var(--bp-soft)}
body.bp .hp-cat:hover strong{color:var(--bp-brand)}
body.bp .hp-cat svg{color:var(--bp-brand);margin-bottom:4px}
body.bp .hp-cat__code{font-size:.72rem;color:var(--hp-muted);letter-spacing:.04em}
body.bp .hp-cat__code em{font-style:normal;color:color-mix(in srgb,var(--hp-amber) 80%,#000)}
body.bp .hp-cat strong{font:600 1rem/1.3 var(--display);margin-top:6px}
body.bp .hp-cat small{font-size:.74rem;color:var(--hp-muted)}

/* ------------------------------------------------ featured courses (kept) */
body.bp .hp-courses .bp-head{margin-bottom:26px}

/* ------------------------------------------------------------------ navy */
body.bp .hp-navy{background:var(--hp-navy);color:#fff}
body.bp .hp-navy h2{color:#fff}

/* ----------------------------------------------------------------- method */
body.bp .hp-method{padding:clamp(64px,7vw,96px) 0;scroll-margin-top:var(--bp-hdr,80px)}
body.bp .hp-method h2{font-size:clamp(1.7rem,2.6vw,2.15rem);letter-spacing:-.02em}
body.bp .hp-steps{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));list-style:none;margin:36px 0 0;padding:0;border:1px solid rgba(255,255,255,.16);border-radius:var(--hp-r);background:rgba(255,255,255,.14)}
body.bp .hp-steps li{position:relative;padding:32px 20px 30px;border-right:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column}
body.bp .hp-steps li:last-child{border-right:0}
body.bp .hp-steps .bp-mono{font-size:.8rem;letter-spacing:.14em;color:rgba(255,255,255,.62)}
body.bp .hp-steps strong{display:block;margin-top:14px;font:700 1.2rem/1.2 var(--display);color:#fff}
body.bp .hp-steps p{margin:8px 0 20px;font-size:.9rem;line-height:1.6;color:rgba(255,255,255,.66)}
body.bp .hp-steps__bar{display:block;margin-top:auto;height:2px;background:rgba(255,255,255,.18);position:relative}
body.bp .hp-steps__bar::after{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--p,25%);background:var(--hp-amber)}

/* -------------------------------------------------------------------- why */
body.bp .hp-why{padding:clamp(64px,7vw,96px) 0}
body.bp .hp-why__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,4vw,56px);align-items:start}
body.bp .hp-why__grid.is-single{grid-template-columns:minmax(0,760px)}
body.bp .hp-why .hp-eyebrow{color:color-mix(in srgb,var(--bp-brand) 85%,#000)}
body.bp .hp-why__list{list-style:none;margin:22px 0 0;padding:0}
body.bp .hp-why__list li{display:flex;gap:14px;padding:18px 0;border-bottom:1px solid var(--hp-line)}
body.bp .hp-why__list li:first-child{padding-top:4px}
body.bp .hp-why__list li:last-child{border-bottom:0}
body.bp .hp-why__list .bp-mono{flex:none;width:30px;height:30px;display:grid;place-items:center;border-radius:3px;background:color-mix(in srgb,var(--hp-hi) 14%,#fff);color:var(--bp-brand);font-size:.76rem;font-weight:600}
body.bp .hp-why__list strong{display:block;font:600 1.02rem/1.35 var(--display);color:var(--bp-ink)}
body.bp .hp-why__list p{margin:5px 0 0;font-size:.92rem;line-height:1.6;color:var(--hp-muted)}
body.bp .hp-compare-wrap{min-width:0}
body.bp .hp-compare{width:100%;border-collapse:separate;border-spacing:0;background:var(--bp-surface);border:1px solid var(--hp-line);border-radius:var(--hp-r);overflow:hidden;font-size:.92rem}
body.bp .hp-compare thead th{background:var(--hp-navy);color:#fff;font-size:.72rem;letter-spacing:.12em;font-weight:600;padding:15px 16px;text-align:center}
body.bp .hp-compare thead th:first-child{text-align:left}
body.bp .hp-compare tbody th{font-weight:500;color:var(--bp-ink);text-align:center;padding:14px 16px}
body.bp .hp-compare td{text-align:center;padding:14px 12px;color:var(--bp-brand);width:22%}
body.bp .hp-compare tbody tr+tr>*{border-top:1px solid var(--hp-line)}
body.bp .hp-compare svg{display:inline-block;vertical-align:middle;color:color-mix(in srgb,var(--bp-brand) 70%,#0a8f6a)}
body.bp .hp-dash{color:color-mix(in srgb,var(--hp-muted) 60%,#fff)}
body.bp .hp-compare__note{margin:12px 0 0;font-size:.8rem;line-height:1.6;color:var(--hp-muted)}

/* ----------------------------------------------------------------- voices */
body.bp .hp-voices{padding:clamp(56px,6vw,84px) 0;background:var(--bp-surface);border-top:1px solid var(--hp-line)}
body.bp .hp-voices__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
body.bp .hp-voice{margin:0;display:flex;flex-direction:column;padding:22px 20px;border:1px solid var(--hp-line);border-radius:var(--hp-r);background:var(--bp-surface)}
body.bp .hp-voice__tag{align-self:flex-start;padding:4px 7px;border:1px dashed var(--hp-line);font-size:.64rem;letter-spacing:.1em;color:var(--hp-muted)}
body.bp .hp-voice blockquote{margin:16px 0 20px;font-size:.98rem;line-height:1.65;color:color-mix(in srgb,var(--bp-ink) 88%,#fff);flex:1}
body.bp .hp-voice figcaption{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px solid var(--hp-line)}
body.bp .hp-voice strong{display:block;font-size:.95rem;color:var(--bp-ink)}
body.bp .hp-voice small{display:block;margin-top:3px;font-size:.74rem;color:var(--hp-muted)}
body.bp .hp-avatar{width:36px;height:36px;flex:none;border-radius:50%;display:inline-grid;place-items:center;object-fit:cover;background:color-mix(in srgb,var(--hp-hi) 16%,#fff);color:var(--bp-brand);font:600 .72rem/1 var(--bp-mono-font)}
body.bp .hp-avatar--sm{width:24px;height:24px;font-size:.6rem}

/* ------------------------------------------------------------------ teams */
body.bp .hp-teams{padding:clamp(64px,7vw,96px) 0;background:radial-gradient(50% 80% at 100% 0%,color-mix(in srgb,var(--hp-amber) 12%,transparent),transparent 70%),var(--hp-navy)}
body.bp .hp-teams__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:clamp(32px,5vw,72px);align-items:center}
body.bp .hp-teams h2{font-size:clamp(1.8rem,2.8vw,2.3rem);line-height:1.15;letter-spacing:-.02em}
body.bp .hp-teams__points{list-style:none;margin:26px 0 0;padding:0}
body.bp .hp-teams__points li{position:relative;padding:6px 0 6px 22px;font-size:.93rem;color:rgba(255,255,255,.78)}
body.bp .hp-teams__points li::before{content:"→";position:absolute;left:0;color:var(--hp-amber)}
body.bp .hp-teams__form{background:var(--bp-surface);color:var(--bp-ink);border-radius:var(--hp-r);padding:26px 24px;box-shadow:0 30px 60px -30px rgba(0,0,0,.5);display:flex;flex-direction:column;gap:14px}
body.bp .hp-teams__form h3{font-size:1.1rem;margin:0 0 4px;color:var(--bp-ink)}
body.bp .hp-teams__form label{display:flex;flex-direction:column;gap:7px;min-width:0}
body.bp .hp-teams__form label>span{font-size:.68rem;letter-spacing:.12em;color:var(--hp-muted)}
body.bp .hp-teams__form input,body.bp .hp-teams__form select{width:100%;min-height:42px;padding:0 12px;border:1px solid var(--hp-line);border-radius:3px;background:var(--bp-paper);font:inherit;font-size:.93rem;color:var(--bp-ink)}
body.bp .hp-teams__form input:focus,body.bp .hp-teams__form select:focus{outline:2px solid color-mix(in srgb,var(--bp-brand) 40%,transparent);outline-offset:0;border-color:var(--bp-brand)}
body.bp .hp-form__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
body.bp .hp-teams__form .hp-btn{margin-top:4px}
body.bp .hp-teams__note{margin:0;font-size:.82rem;line-height:1.55;color:var(--hp-muted)}
body.bp .hp-teamband-wrap{padding-block:48px}
body.bp .hp-teamband{background:var(--hp-navy);border-radius:var(--hp-r)}
body.bp .hp-teamband h2{color:#fff}

/* ------------------------------------------------------------------- blog */
body.bp .hp-posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
body.bp .hp-post{display:flex;flex-direction:column;background:var(--bp-surface);border:1px solid var(--hp-line);border-radius:var(--hp-r);overflow:hidden;transition:box-shadow .2s,border-color .2s}
body.bp .hp-post:hover{box-shadow:0 18px 40px -26px rgba(11,37,64,.45);border-color:color-mix(in srgb,var(--bp-ink) 18%,#fff)}
body.bp .hp-post__media{position:relative;display:block;aspect-ratio:16/9;background-color:var(--hp-navy);background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:22px 22px;overflow:hidden}
body.bp .hp-post__media img{width:100%;height:100%;object-fit:cover;display:block}
body.bp .hp-post__media b{position:absolute;right:12px;top:6px;font-size:2.1rem;color:rgba(255,255,255,.16);font-weight:700}
body.bp .hp-post__badge{position:absolute;left:12px;bottom:12px;padding:5px 8px;background:var(--hp-amber);color:var(--bp-on-accent);font-style:normal;font-size:.66rem;letter-spacing:.1em;border-radius:2px}
body.bp .hp-post__body{display:flex;flex-direction:column;flex:1;padding:18px 16px 16px}
body.bp .hp-post__meta{font-size:.78rem;color:var(--hp-muted);letter-spacing:.02em}
body.bp .hp-post__title{margin-top:10px;font-size:1.02rem;line-height:1.3;letter-spacing:-.005em}
body.bp .hp-post__title a{text-decoration:none;color:var(--bp-ink)}
body.bp .hp-post__title a:hover{color:var(--bp-brand)}
body.bp .hp-post__desc{margin:8px 0 16px;font-size:.88rem;line-height:1.6;color:var(--hp-muted);flex:1}
body.bp .hp-post__foot{display:flex;align-items:center;gap:8px;padding-top:12px;border-top:1px solid var(--hp-line);font-size:.72rem;color:var(--hp-muted)}

/* -------------------------------------------------------------------- faq */
body.bp .hp-faq{padding:clamp(56px,6vw,88px) 0;background:var(--bp-surface);border-top:1px solid var(--hp-line)}
body.bp .hp-faq__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2.2fr);gap:clamp(32px,5vw,56px);align-items:start}
body.bp .hp-faq__side p{margin:14px 0 20px;font-size:.93rem;line-height:1.65;color:var(--hp-muted);max-width:320px}
body.bp .hp-faq__side .hp-faq__contact{margin:18px 0 0;font-size:.88rem}
body.bp .hp-faq .bp-faq{border:0;border-top:1px solid var(--hp-line);border-radius:0;background:transparent;box-shadow:none}
body.bp .hp-faq .bp-faq__item{border:0;border-bottom:1px solid var(--hp-line);background:transparent}
body.bp .hp-faq .bp-faq__item summary{padding:18px 40px 18px 0;font:600 1rem/1.4 var(--display);color:var(--bp-ink);position:relative;list-style:none}
body.bp .hp-faq .bp-faq__item summary::-webkit-details-marker{display:none}
body.bp .hp-faq .bp-faq__item summary .bp-mono{color:color-mix(in srgb,var(--hp-amber) 80%,#000);font-size:.74rem;margin-right:12px}
body.bp .hp-faq .bp-faq__item summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font:300 1.6rem/1 var(--body);color:var(--bp-brand)}
body.bp .hp-faq .bp-faq__item[open] summary::after{content:"−"}
body.bp .hp-faq .bp-faq__a{padding:0 0 20px 34px;color:var(--hp-muted);font-size:.93rem}

/* -------------------------------------------------------------------- cta */
body.bp .hp-cta{background:var(--bp-surface);border-top:1px solid var(--hp-line)}
body.bp .hp-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:28px;padding-block:44px;flex-wrap:wrap}
body.bp .hp-cta h2{font-size:clamp(1.5rem,2.3vw,1.95rem);letter-spacing:-.02em}
body.bp .hp-cta p{margin:8px 0 0;color:var(--hp-muted)}

/* ----------------------------------------------------------------- footer */
body.design-pro .bp-footer{background:var(--hp-navy)!important;color:rgba(255,255,255,.78)}
body.design-pro.bp-foot-light .bp-footer{background:var(--bp-surface)!important;color:var(--bp-ink)}
body.design-pro .pb-brand--footer .pb-brand__name{color:#fff}
body.design-pro .pb-brand--footer .pb-brand__hl{color:var(--hp-hi)}
body.design-pro .pb-brand--footer .pb-brand__tag{color:rgba(255,255,255,.45)}
body.design-pro.bp-foot-light .pb-brand--footer .pb-brand__name{color:var(--bp-ink)}
body.design-pro .bp-footer h4{color:#fff;letter-spacing:.14em}
body.design-pro .bp-footer__email{font-family:var(--bp-mono-font);font-weight:600;color:#fff!important}
/* ------------------------------------------------------------- responsive */
@media (max-width:1100px){
  body.design-pro .bp-nav{display:none}
  body.bp .hp-cats__row{grid-template-columns:repeat(3,minmax(0,1fr))}
  body.bp .hp-cat:nth-child(3n){border-right:0}
  body.bp .hp-cat:nth-child(n+4){border-top:1px solid var(--hp-line)}
  body.bp .hp-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.bp .hp-steps li:nth-child(2n){border-right:0}
  body.bp .hp-steps li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.08)}
}
@media (max-width:900px){
  body.bp .hp-hero__grid{grid-template-columns:1fr;gap:0}
  body.bp .hp-hero__art{display:none}
  body.bp .hp-hero__art.on-mobile{display:flex;margin-top:-10px}
  body.bp .hp-hero__art.on-mobile img{width:min(300px,80vw)!important}
  body.bp .hp-hero__copy{padding-bottom:48px}
  body.bp .hp-stats__grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px}
  body.bp .hp-why__grid,body.bp .hp-teams__grid,body.bp .hp-faq__grid{grid-template-columns:1fr}
  body.bp .hp-voices__grid,body.bp .hp-posts{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body.design-pro .bp-topbar__right{display:none}
  body.design-pro .bp-topbar__msg{font-size:.66rem;letter-spacing:.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  body.design-pro .pb-brand__tag{display:none}
  body.design-pro .bp-cta{display:none}
  body.bp .hp-hero__title{font-size:2.1rem}
  body.bp .hp-actions .hp-btn{flex:1 1 auto}
  body.bp .hp-search__form button{padding:0 14px}
  body.bp .hp-cats__row{grid-template-columns:1fr 1fr}
  body.bp .hp-cat{border-right:1px solid var(--hp-line)!important;border-top:1px solid var(--hp-line)}
  body.bp .hp-cat:nth-child(2n){border-right:0!important}
  body.bp .hp-cat:nth-child(-n+2){border-top:0}
  body.bp .hp-vendors__inner{gap:12px}
  body.bp .hp-steps{grid-template-columns:1fr}
  body.bp .hp-steps li{border-right:0;border-top:1px solid rgba(255,255,255,.08)}
  body.bp .hp-steps li:first-child{border-top:0}
  body.bp .hp-voices__grid,body.bp .hp-posts{grid-template-columns:1fr}
  body.bp .hp-form__row{grid-template-columns:1fr}
  body.bp .hp-compare{font-size:.84rem}
  body.bp .hp-compare tbody th{text-align:left;padding:12px}
  body.bp .hp-cta__inner .hp-actions{width:100%}
}

/* v13 polish */
body.bp .hp-hero__title{max-width:none}
@media (min-width:901px){body.bp .hp-hero__copy{min-width:600px}}
body.design-pro .bp-head h2{max-width:none}
body.design-pro .bp-link{color:var(--bp-brand)}
body.design-pro .bp-link:hover{color:color-mix(in srgb,var(--bp-brand) 80%,#000)}
body.bp:has(.hp-cta) .bp-footer{margin-top:0}
body.design-pro .bp-search-link svg{width:17px;height:17px}

/* ==========================================================================
   v14 — hero size controls (Settings → Homepage → Hero: size) and section
   tones that follow Branding (dark / primary colour / light) or an override.
   ========================================================================== */
body.bp .hp-hero__grid{padding-top:var(--hp-pt,56px);min-height:var(--hp-minh,0px);align-items:var(--hp-align,end)}
body.bp .hp-hero__copy{padding-bottom:var(--hp-pb,52px);align-self:center}
body.bp .hp-hero[style*="--hp-align:center"] .hp-hero__art,body.bp .hp-hero.is-centred .hp-hero__art{align-self:center;padding-bottom:var(--hp-pb,52px)}
body.bp .hp-hero__title{font-size:clamp(2rem,4.2vw,var(--hp-title,52px))}
body.bp .hp-hero__art img{width:auto;height:var(--hp-img-h,460px);max-width:var(--hp-img-w,420px);object-fit:contain;object-position:bottom center}
@media (max-width:900px){
  body.bp .hp-hero__grid{padding-top:calc(var(--hp-pt,56px)*.7);min-height:0}
  body.bp .hp-hero__copy{padding-bottom:calc(var(--hp-pb,52px)*.8)}
  body.bp .hp-hero__art.on-mobile img{height:auto;max-height:340px}
}

/* ---- brand tone: your primary colour ---- */
body.bp .hp-hero.hp-tone-brand{--hp-bg1:color-mix(in srgb,var(--bp-brand) 88%,#000);--hp-bg2:var(--bp-brand)}
body.bp .hp-stats.hp-tone-brand{background:color-mix(in srgb,var(--bp-brand) 72%,#000)}
body.bp .hp-navy.hp-tone-brand{background:var(--bp-brand)}
body.bp .hp-tone-brand .hp-compare thead th{background:var(--bp-brand)}

/* ---- light tone: pale page colours, dark text ---- */
body.bp .hp-hero.hp-tone-light{color:var(--bp-ink);background:
    radial-gradient(55% 80% at 100% 0%,color-mix(in srgb,var(--bp-brand) 14%,transparent),transparent 70%),
    radial-gradient(50% 70% at 0% 100%,color-mix(in srgb,var(--hp-amber) 8%,transparent),transparent 65%),
    linear-gradient(180deg,color-mix(in srgb,var(--bp-brand) 5%,var(--bp-paper)),var(--bp-paper));border-bottom:1px solid var(--hp-line)}
body.bp .hp-hero.hp-tone-light.has-grid::before{background-image:linear-gradient(color-mix(in srgb,var(--bp-ink) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--bp-ink) 5%,transparent) 1px,transparent 1px)}
body.bp .hp-tone-light .hp-hero__title{color:var(--bp-ink)}
body.bp .hp-tone-light .hp-hero__title .hl{color:var(--bp-brand)}
body.bp .hp-tone-light .hp-hero__lede{color:color-mix(in srgb,var(--bp-ink) 72%,#fff)}
body.bp .hp-tone-light .hp-hero__lede strong{color:var(--bp-ink)}
body.bp .hp-tone-light .hp-eyebrow--dark{color:var(--bp-brand)}
body.bp .hp-tone-light .hp-eyebrow--dark span{color:color-mix(in srgb,var(--bp-brand) 50%,#fff)}
body.bp .hp-tone-light .hp-btn--glass{border-color:color-mix(in srgb,var(--bp-ink) 30%,#fff);color:var(--bp-ink)!important;background:var(--bp-surface)}
body.bp .hp-tone-light .hp-btn--glass:hover{border-color:var(--bp-ink);background:var(--bp-surface)}
body.bp .hp-tone-light .hp-search__label{color:var(--hp-muted)}
body.bp .hp-tone-light .hp-search__form{border:1px solid var(--hp-line);box-shadow:0 14px 34px -24px rgba(11,37,64,.45)}
body.bp .hp-tone-light .hp-chip{border-color:var(--hp-line);color:color-mix(in srgb,var(--bp-ink) 75%,#fff);background:var(--bp-surface)}
body.bp .hp-tone-light .hp-chip:hover{border-color:var(--bp-brand);color:var(--bp-brand);background:var(--bp-surface)}
body.bp .hp-stats.hp-tone-light{background:var(--bp-surface);color:var(--bp-ink);border-top:1px solid var(--hp-line);border-bottom:1px solid var(--hp-line)}
body.bp .hp-tone-light .hp-stat b{color:var(--bp-ink)}
body.bp .hp-tone-light .hp-stat span{color:var(--bp-brand)}
body.bp .hp-navy.hp-tone-light{background:color-mix(in srgb,var(--bp-brand) 6%,var(--bp-paper));color:var(--bp-ink);border-block:1px solid var(--hp-line)}
body.bp .hp-navy.hp-tone-light h2{color:var(--bp-ink)}
body.bp .hp-navy.hp-tone-light .hp-lead{color:var(--hp-muted)}
body.bp .hp-navy.hp-tone-light .hp-eyebrow--dark{color:var(--bp-brand)}
body.bp .hp-tone-light .hp-steps{background:var(--bp-surface);border-color:var(--hp-line)}
body.bp .hp-tone-light .hp-steps li{border-color:var(--hp-line)!important}
body.bp .hp-tone-light .hp-steps .bp-mono{color:var(--hp-muted)}
body.bp .hp-tone-light .hp-steps strong{color:var(--bp-ink)}
body.bp .hp-tone-light .hp-steps p{color:var(--hp-muted)}
body.bp .hp-tone-light .hp-steps__bar{background:var(--hp-line)}
body.bp .hp-tone-light .hp-teams__points li{color:color-mix(in srgb,var(--bp-ink) 78%,#fff)}
body.bp .hp-tone-light .hp-teams__form{border:1px solid var(--hp-line);box-shadow:0 24px 50px -32px rgba(11,37,64,.4)}
body.bp .hp-tone-light .hp-compare thead th{background:var(--bp-brand)}
body.bp.hp-why-tone-light .hp-compare thead th{background:var(--bp-brand)}

/* ---- topbar follows Branding → Top bar in the Professional design ---- */
body.design-pro.topbar-dark .bp-topbar{background:var(--hp-navy)}
body.design-pro.topbar-light .bp-topbar__right a{color:var(--bp-brand)}
body.design-pro.topbar-light .bp-topbar__right a+a::before{color:var(--hp-line)}
body.design-pro.topbar-brand .bp-topbar__right a{color:color-mix(in srgb,var(--bp-on-brand) 85%,transparent)}
body.bp .hp-courses .bp-head h2,body.bp .hp-blog .bp-head h2{max-width:none}

/* v14: plain hero background (default) — one clean colour, no glow, no grid */
body.bp .hp-hero.hp-bg-plain{background:var(--hp-bg1)}
body.bp .hp-hero.hp-bg-plain.hp-tone-light{background:color-mix(in srgb,var(--bp-brand) 5%,var(--bp-paper))}
body.bp .hp-hero.hp-bg-plain.hp-tone-brand{background:var(--bp-brand)}
body.bp .hp-stats.hp-tone-dark{background:var(--hp-navy-2)}
body.bp .hp-tone-dark .hp-hero__title .hl,body.bp .hp-tone-brand .hp-hero__title .hl{color:color-mix(in srgb,var(--hp-hi) 70%,#fff)}

/* v15: search suggestions open over the sections below instead of being cut off */
body.bp .hp-hero{overflow:visible;z-index:6}
body.bp .hp-hero.has-grid::before{overflow:hidden}
body.bp .hp-search,body.bp .hp-search__form{position:relative;z-index:7}
body.bp .hp-search__form .sg{position:absolute;z-index:80;top:calc(100% + 6px);left:0;right:0;max-height:min(460px,60vh);overflow-y:auto;box-shadow:0 24px 50px -20px rgba(11,37,64,.45);border-radius:6px;background:var(--bp-surface)}
body.bp .hp-hero__art img{height:var(--hp-img-h,560px)}
@media (max-width:1200px){body.bp .hp-hero__art img{height:min(var(--hp-img-h,560px),480px)}}
body.bp .hp-hero__title{font-weight:var(--h-weight,700)}