[data-sl-page] blockquote{margin:0;padding:0;border:0;background:none;font-size:inherit;line-height:inherit;font-style:normal;text-align:inherit;width:auto} /* the shell also centres a bare blockquote at width:70% (measured 16 Sep 2026) */
[data-sl-page] figure{margin:0}
[data-sl-page] figcaption{display:block;text-align:left;margin-top:0;padding:0} /* the site sheet centres figcaption, makes it a table-caption and pads it 0 7px 5px */
[data-sl-page] p,[data-sl-page] a{white-space:normal} /* the site sheet sets p,a{white-space:pre-wrap} under 768px, which keeps source line breaks */
[data-sl-page] a{font-size:inherit} /* the shell's bare a{font-size:19px} reached every small link in a list (the evidence links on the homepage and this page, measured 16 Sep 2026) */

/* ============================================================
   Structural Learning CPD page. Design canon: ~/.claude/design/DESIGN.md
   Ground: white (rule 3, website medium). Accent: teal (brand).
   No decorative edge rails (G8). Teal text under 24px uses --brand-hover (rule 6).
   The five Thinking Framework colours appear ONLY in the section where
   the framework itself is the subject (G12).
   ============================================================ */
/* GENERATED from ~/.claude/design/tokens.json v1.1.0. Do not hand-edit. */
[data-sl-page] {
  --sl-brand: #128770;
  --sl-brand-hover: #0E6B58;
  --sl-brand-deep: #0C5E4E;
  --sl-build: #128770;        /* same value as brand, deliberately. Paul G5 */
  --sl-say: #D35400;
  --sl-map: #3098DA;
  --sl-say-wash: #FBEDE4;
  --sl-map-wash: #E6F1FA;
  --sl-build-wash: #E4F0EC;
  --sl-say-text: #A5430B;
  --sl-map-text: #1C6EA4;
  --sl-build-text: #0C5E4E;
  --sl-tf-green: #128770;
  --sl-tf-blue: #3098DA;
  --sl-tf-yellow: #F1C206;
  --sl-tf-orange: #D35400;
  --sl-tf-red: #C0392B;
  --sl-ink: #24262D;
  --sl-muted: #565E73;
  --sl-faint: #8A8FA0;
  --sl-border: #DFE1E6;
  --sl-border-strong: #D7DAE0;
  --sl-surface: #FFFFFF;
  --sl-ground: #FAF8F5;    /* warm paper. Paul G1. ONE ground, not four */
  --sl-radius-sm: 4px;
  --sl-radius-md: 10px;
  --sl-radius-lg: 14px;
  --sl-radius-pill: 999px;
  --sl-shadow-hover: 0 8px 18px rgba(36, 38, 45, 0.04);
  --sl-font-display: 'Lexend', Inter, ui-sans-serif, system-ui, sans-serif;
  --sl-font-body: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --sl-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* ---- extensions. Each carries the measurement that justifies it. ---------- */
[data-sl-page]{
  /* WHY: the canonical faint grey measures 3.22:1 on white and 3.04:1 on warm
     paper. AA needs 4.5 for text under 24px, and every use of it on this page IS
     small text. This shade measures 4.85 on white and 4.58 on paper. The token
     itself needs raising estate-wide; that is a proposal, not done here. */
  --sl-faint-aa:#6B7185;

  --sl-gut: clamp(20px, 5vw, 72px);
  --sl-maxw: 1240px;
  color-scheme: light;
}
[data-sl-page] *{box-sizing:border-box}
[data-sl-page]{
  margin:0; background:var(--sl-surface); color:var(--sl-ink);
  font-family:var(--sl-font-body) !important; font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
[data-sl-page] img{max-width:100%; display:block; height:auto} /* width and height attributes reserve space before load; the CSS box still decides the height */
[data-sl-page] a{color:inherit}
[data-sl-page] h1,[data-sl-page] h2,[data-sl-page] h3,[data-sl-page] h4{font-family:var(--sl-font-display) !important; font-weight:600; letter-spacing:-.02em; margin:0}
[data-sl-page] p{margin:0 0 1em}
[data-sl-page] p:last-child{margin-bottom:0}

[data-sl-page] .wrap{max-width:var(--sl-maxw); margin:0 auto; padding-inline:var(--sl-gut)}
[data-sl-page] .eyebrow{
  font-family:var(--sl-font-mono) !important; font-size:11.5px; letter-spacing:.14em;
  text-transform:uppercase; font-weight:600; color:var(--sl-brand-hover);
  margin:0 0 14px;
}
[data-sl-page] .accent{color:var(--sl-brand)}
[data-sl-page] .lede{font-size:19px; line-height:1.62; color:var(--sl-muted); max-width:56ch}
[data-sl-page] .rule{border:0; border-top:1px solid var(--sl-border); margin:0}

/* buttons ---------------------------------------------------- */
[data-sl-page] .btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--sl-font-body) !important; font-weight:600; font-size:16px;
  padding:15px 26px; border-radius:8px; text-decoration:none;
  border:1px solid transparent; cursor:pointer; transition:background .16s, border-color .16s, transform .16s;
}
[data-sl-page] .btn-primary{background:var(--sl-brand-hover); color:var(--sl-surface)}   /* white on the base brand teal is 4.44:1, under AA for a 16px label */
[data-sl-page] .btn-primary:hover{background:var(--sl-brand-deep)}
[data-sl-page] .btn-ghost{background:var(--sl-surface); color:var(--sl-brand-hover); border-color:var(--sl-border-strong)}
[data-sl-page] .btn-ghost:hover{border-color:var(--sl-brand); }
[data-sl-page] .btn .arw{transition:transform .16s}
[data-sl-page] .btn:hover .arw{transform:translateX(3px)}

/* header ----------------------------------------------------- */

/* hero ------------------------------------------------------- */
[data-sl-page] .hero{padding-block:clamp(44px,7vw,86px) clamp(40px,6vw,72px)}
[data-sl-page] .hero-grid{display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(32px,5vw,68px); align-items:center}
[data-sl-page] .hero h1{font-size:clamp(38px,5.1vw,66px); line-height:1.04; margin:0 0 22px}
[data-sl-page] .hero .lede{font-size:clamp(17px,1.5vw,20px)}
[data-sl-page] .hero-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:30px}
[data-sl-page] .hero-note{margin-top:20px; font-size:14.5px; color:var(--sl-faint-aa); display:flex; align-items:center; gap:9px}
[data-sl-page] .dot{width:7px; height:7px; border-radius:50%; background:var(--sl-brand); flex:none}

[data-sl-page] .portrait{position:relative; border-radius:14px; overflow:hidden; background:var(--sl-build-wash); aspect-ratio:5/6}
[data-sl-page] .portrait img{width:100%; height:100%; object-fit:cover; object-position:50% 28%}

@media (max-width:900px){ [data-sl-page] .hero-grid{grid-template-columns:1fr; gap:32px} [data-sl-page] .portrait{aspect-ratio:5/4; max-height:430px} }

/* proof strip ------------------------------------------------ */

/* generic section -------------------------------------------- */
[data-sl-page] section{padding-block:clamp(52px,7vw,96px)}
[data-sl-page] .sec-head{max-width:62ch; margin-bottom:clamp(30px,4vw,50px)}
[data-sl-page] .sec-head h2{font-size:clamp(29px,3.5vw,44px); line-height:1.12; margin:0 0 16px}


/* motion ----------------------------------------------------- */
[data-sl-page] .rise{opacity:1; transform:none; transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1)}
[data-sl-page] .rise.rise-armed{opacity:0; transform:translateY(16px)}
[data-sl-page] .rise.rise-armed.from-l{transform:translateX(-24px)}
[data-sl-page] .rise.rise-armed.from-r{transform:translateX(24px)}
[data-sl-page] .rise.rise-armed.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){
  [data-sl-page] .rise{opacity:1; transform:none; transition:none}
  [data-sl-page] .btn,[data-sl-page] .lead{transition:none}
}
[data-sl-page] section{overflow-x:clip}   /* a sideways entrance (translateX 24px, armed and not yet revealed) widened the page to 324 at 320. clip, not hidden: sticky still works inside it */

/* ---- the motion layer, v22. html.sl-m is set in the head ONLY when the Motion library loaded and the reader has not
   asked for reduced motion, so nothing below can hide content the library will not reveal. Without it the page keeps
   the CSS reveals above. ---- */
html.sl-m [data-sl-page] .rise{transition:none}                       /* Motion drives these with a spring; the CSS transition would fight it */
html.sl-m [data-sl-page] .hero .arr{opacity:0}                        /* the arrival: eyebrow, headline, lede, buttons, note, portrait, hidden until the script raises them */
html.sl-m [data-sl-page] .hero .arr.arrived{opacity:1}
[data-sl-page] .hero h1 .hw{display:inline-block}                     /* a word can only move if it is a box */
[data-sl-page] .case figure{overflow:hidden; border-radius:10px}      /* the tile's photograph zooms on hover and must stay inside its corners */
[data-sl-page] .case-link{will-change:transform}
/* the cards article pins for most of a screen at desktop while the scroll scrubs its three beats; phones keep the flow.
   The travel is CONTENT height (a spacer after the sticky block), never padding: a sticky child is held inside its
   parent's content box, so padding-bottom gave it nowhere to go and it never stuck (measured 14 Sep 2026). */


/* ===== shared site header (sl-sales-pages/shared/sitenav) ===== */
[data-sl-page] .sn .row{gap:20px}
[data-sl-page] .sn-burger{display:none; margin-left:8px; width:40px; height:40px; border:1px solid var(--sl-border); border-radius:8px; background:var(--sl-surface); cursor:pointer; flex-direction:column; justify-content:center; align-items:center; gap:4px}
[data-sl-page] .sn-burger span{display:block; width:16px; height:1.5px; background:var(--sl-ink)}
@media (max-width:980px){
  [data-sl-page] .sn .row{gap:10px}
  [data-sl-page] .sn-burger{display:flex}
}

/* ============================================================
   /store v2. One accent: Build It teal (--sl-build for marks and large type, --sl-build-text / --sl-brand-hover for text
   under 24px, rule 6). One wash: --sl-build-wash on the buy section. No rails (G8): hairlines only underline or divide,
   never outline a coloured box. Cards and controls are white. Buy, invoice and FAQ rules adapted from the Build It page
   (sl-build-it-page/src/wb.extra.css, 28 Sep 2026) so the two pages buy the same way.
   ============================================================ */
[data-sl-page] .accent{color:var(--sl-build)}
[data-sl-page] .eyebrow{color:var(--sl-build-text)}
[data-sl-page] img{max-width:100%; height:auto}
[data-sl-page] figure{margin:0}
[data-sl-page] .dot{display:inline-block; flex:none; width:8px; height:8px; border-radius:50%; background:var(--sl-build)}

/* hero: short. The photograph is real, cropped to 4:3 so the page starts compact */
[data-sl-page] section.st-hero{padding-block:clamp(36px,5vw,64px) clamp(36px,5vw,60px)}
[data-sl-page] .st-hero h1{font-size:clamp(36px,4.6vw,58px)}
[data-sl-page] .st-hero-fig{aspect-ratio:4/3; margin:0}
[data-sl-page] .st-hero-fig img{object-position:50% 60%}
[data-sl-page] .st-hero-fig figcaption{position:absolute; left:14px; bottom:14px; background:var(--sl-surface); border-radius:8px; padding:7px 11px; font-size:13px; line-height:1.4; color:var(--sl-muted)}
[data-sl-page] .hero-note .dot{margin-right:2px}

/* three routes: numbered, white cards with a hairline on white (rule 3), no coloured edge */
[data-sl-page] section.st-routes{padding-top:clamp(20px,3vw,36px)}
[data-sl-page] .st-routes .sec-head{margin-bottom:clamp(22px,3vw,34px)}
[data-sl-page] .st-cards{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(14px,2vw,22px)}
[data-sl-page] .st-card{display:flex; flex-direction:column; background:var(--sl-surface); border:1px solid var(--sl-border); border-radius:14px; padding:clamp(20px,2.4vw,28px)}
[data-sl-page] .st-n{font:600 30px/1 var(--sl-font-display); color:var(--sl-build); letter-spacing:-.02em; margin:0 0 14px}
[data-sl-page] .st-kind{font-family:var(--sl-font-mono) !important; font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:600; color:var(--sl-muted); margin:0 0 6px}
[data-sl-page] .st-card h3{font-size:22px; line-height:1.2; margin:0 0 10px}
[data-sl-page] .st-card > p:not(.st-n):not(.st-kind):not(.st-go){font-size:15.5px; line-height:1.58; color:var(--sl-muted); margin:0 0 18px}
[data-sl-page] .st-card b{color:var(--sl-ink); font-weight:600}
[data-sl-page] .st-go{margin:auto 0 0; display:flex; flex-direction:column; gap:8px; padding-top:14px; border-top:1px solid var(--sl-border)}
[data-sl-page] .st-go a{font-size:15.5px; font-weight:600; color:var(--sl-brand-hover); text-decoration:none}
[data-sl-page] .st-go a:hover{text-decoration:underline}
[data-sl-page] .st-go .st-go2{font-size:14.5px; font-weight:500; color:var(--sl-muted); text-decoration:underline}

/* buy by card: the one wash on the page */
[data-sl-page] .st-buy{background:var(--sl-build-wash)}
[data-sl-page] .st-buy .lede a, [data-sl-page] .st-pt-note a, [data-sl-page] .st-tpl a, [data-sl-page] .sbb-fallback a{color:var(--sl-brand-hover); font-weight:600}
[data-sl-page] .st-buy-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(16px,2vw,24px); align-items:stretch}
[data-sl-page] .st-kit, [data-sl-page] .st-card-pay{background:var(--sl-surface); border-radius:14px; padding:clamp(20px,2.6vw,30px)}
[data-sl-page] .st-kit-fig img{display:block; width:100%; border-radius:10px}
[data-sl-page] .st-kit-fig figcaption{margin:8px 0 14px; font-size:13px; line-height:1.45; color:var(--sl-muted)}
[data-sl-page] .kit-list{list-style:none; margin:0; padding:0}
[data-sl-page] .kit-list li{display:grid; grid-template-columns:8px minmax(0,1fr); gap:12px; align-items:baseline; padding:10px 0; border-bottom:1px solid var(--sl-border); font-size:15.5px; line-height:1.55; color:var(--sl-muted)}
[data-sl-page] .kit-list li:first-child{border-top:1px solid var(--sl-border)}
[data-sl-page] .kit-list li b{color:var(--sl-ink); font-weight:600}
[data-sl-page] .kit-list .dot{transform:translateY(-1px)}
[data-sl-page] .st-card-pay h3{font-size:21px; margin:0 0 4px}
[data-sl-page] .sbb-l{font-size:16px; font-weight:600; color:var(--sl-ink); margin:18px 0 6px}
[data-sl-page] .sbb-l span{display:block; font-weight:400; font-size:14px; color:var(--sl-muted)}
[data-sl-page] .sbb{min-height:52px; margin-bottom:10px}
[data-sl-page] .sbb-fallback{font-size:14px; line-height:1.5; color:var(--sl-muted); margin:10px 0 0}
html.sbb-on [data-sl-page] .sbb-fallback{display:none}
[data-sl-page] .st-del{display:flex; align-items:baseline; gap:10px; margin:18px 0 0; padding-top:16px; border-top:1px solid var(--sl-border); font-size:15px; color:var(--sl-ink)}
[data-sl-page] .st-tpl{margin:10px 0 0; font-size:14.5px; line-height:1.55; color:var(--sl-muted)}

/* the price list: a real table, stacked into labelled rows on phones (skill rule 5, no sideways scroll) */
[data-sl-page] .st-prices{margin-top:clamp(16px,2vw,24px); background:var(--sl-surface); border-radius:14px; padding:clamp(18px,2.6vw,28px) clamp(20px,2.6vw,30px)}
[data-sl-page] .st-pt{width:100%; border-collapse:collapse; font-size:15.5px}
[data-sl-page] .st-pt caption{text-align:left; font:600 19px/1.3 var(--sl-font-display); color:var(--sl-ink); padding-bottom:10px}
[data-sl-page] .st-pt th, [data-sl-page] .st-pt td{text-align:left; padding:12px 12px 12px 0; border-bottom:1px solid var(--sl-border); vertical-align:baseline}
[data-sl-page] .st-pt thead th{font-family:var(--sl-font-mono) !important; font-size:11px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; color:var(--sl-muted)}
[data-sl-page] .st-pt tbody th{font-weight:600; color:var(--sl-ink)}
[data-sl-page] .st-pt td{color:var(--sl-muted)}
[data-sl-page] .st-pt td b{font:600 19px/1.2 var(--sl-font-display); color:var(--sl-ink)}
[data-sl-page] .st-off{font-size:13.5px; font-weight:600; color:var(--sl-build-text); margin-left:6px; white-space:nowrap}
[data-sl-page] .st-pt-note{margin:14px 0 0; font-size:14.5px; line-height:1.55; color:var(--sl-muted)}

/* invoice or purchase order */
[data-sl-page] .st-inv{background:var(--sl-surface)}
[data-sl-page] .st-inv-grid{display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(24px,4vw,56px); align-items:start}
[data-sl-page] .st-inv h2{font-size:clamp(29px,3.5vw,44px); line-height:1.12; margin:0 0 16px; text-wrap:balance}
[data-sl-page] .st-inv-list{margin-top:22px}
[data-sl-page] .route{background:var(--sl-surface); border:1px solid var(--sl-border); border-radius:14px; padding:clamp(20px,3vw,30px)}
[data-sl-page] .route h3{font-size:21px; margin:0 0 16px}
[data-sl-page] .inv{display:grid; grid-template-columns:1fr 1fr; gap:12px 14px}
[data-sl-page] .inv-f{display:flex; flex-direction:column; gap:5px; font-size:13.5px; font-weight:600; color:var(--sl-ink); min-width:0}
[data-sl-page] .inv-f i{font-style:normal; font-weight:400; color:var(--sl-faint-aa)}
[data-sl-page] .inv-f input, [data-sl-page] .inv-f select, [data-sl-page] .inv-f textarea{font:400 16px/1.3 var(--sl-font-body); color:var(--sl-ink); background:var(--sl-surface); border:1px solid var(--sl-border-strong); border-radius:10px; padding:10px 12px; min-height:44px; width:100%}
[data-sl-page] .inv-f textarea{resize:vertical}
[data-sl-page] .inv-f input:focus, [data-sl-page] .inv-f select:focus, [data-sl-page] .inv-f textarea:focus{outline:2px solid var(--sl-build); outline-offset:-2px}
[data-sl-page] .inv-f input[aria-invalid="true"]{border-color:var(--sl-ink)}
[data-sl-page] .inv-wide, [data-sl-page] .inv-go, [data-sl-page] .inv-err{grid-column:1 / -1}
[data-sl-page] .inv-check{display:flex; align-items:center; gap:10px; font-size:14.5px; color:var(--sl-ink); min-height:32px}
[data-sl-page] .inv-check input{width:18px; height:18px; accent-color:var(--sl-build-text)}
[data-sl-page] .inv-go{margin-top:4px; justify-content:center}
[data-sl-page] .inv-err{margin:0; font-size:14px; color:var(--sl-ink)}
[data-sl-page] .inv-err a{color:var(--sl-brand-hover); font-weight:600}
[data-sl-page] .inv-done h4{font-size:19px; margin:0 0 6px}
[data-sl-page] .inv-done p{margin:0; font-size:15px; line-height:1.55; color:var(--sl-muted)}
[data-sl-page] .wiz-hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}
[data-sl-page] .bursar{margin-top:clamp(22px,3vw,34px); display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px 28px; background:var(--sl-ground); border-radius:14px; padding:18px clamp(20px,3vw,28px)}
[data-sl-page] .bursar p{margin:0; font-size:15.5px; line-height:1.55; color:var(--sl-muted); max-width:62ch}
[data-sl-page] .bursar p b{color:var(--sl-ink)}
[data-sl-page] .bursar-go{display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px}
[data-sl-page] .bursar-mail{font-size:15px; font-weight:600; color:var(--sl-brand-hover)}
[data-sl-page] .copied{font-size:14px; color:var(--sl-build-text); min-width:1ch}

/* FAQ */
[data-sl-page] .faq{background:var(--sl-ground)}
[data-sl-page] .faq-grid{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(28px,4vw,60px); align-items:start}
[data-sl-page] .faq .sec-head a, [data-sl-page] .fq a{color:var(--sl-brand-hover); font-weight:600}
[data-sl-page] .fqs{background:var(--sl-surface); border-radius:14px; padding:6px clamp(18px,3vw,28px)}
[data-sl-page] .fq{border-bottom:1px solid var(--sl-border)}
[data-sl-page] .fq:last-child{border-bottom:0}
[data-sl-page] .fq summary{list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:16px; align-items:center; padding:17px 0; font:600 16.5px/1.4 var(--sl-font-display); color:var(--sl-ink)}
[data-sl-page] .fq summary::-webkit-details-marker{display:none}
[data-sl-page] .fq summary::after{content:"+"; flex:none; font:400 22px/1 var(--sl-font-body); color:var(--sl-build-text); transition:transform .2s}
[data-sl-page] .fq[open] summary::after{transform:rotate(45deg)}
[data-sl-page] .fq summary:focus-visible{outline:2px solid var(--sl-build); outline-offset:2px; border-radius:4px}
[data-sl-page] .fq p{margin:0 0 18px; font-size:15.5px; line-height:1.62; color:var(--sl-muted); max-width:64ch}
@media (prefers-reduced-motion:reduce){ [data-sl-page] .fq summary::after{transition:none} }

/* footer */

@media (max-width:980px){
  [data-sl-page] .st-cards{grid-template-columns:1fr}
  [data-sl-page] .st-buy-grid, [data-sl-page] .st-inv-grid, [data-sl-page] .faq-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  [data-sl-page] .st-pt thead{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
  [data-sl-page] .st-pt, [data-sl-page] .st-pt tbody, [data-sl-page] .st-pt tr, [data-sl-page] .st-pt th, [data-sl-page] .st-pt td{display:block}
  [data-sl-page] .st-pt caption{display:block; width:auto}
  [data-sl-page] .st-pt tr{padding:12px 0; border-bottom:1px solid var(--sl-border)}
  [data-sl-page] .st-pt th, [data-sl-page] .st-pt td{border:0; padding:3px 0}
  [data-sl-page] .st-pt tbody th{font-size:17px; padding-bottom:6px}
  [data-sl-page] .st-pt td{display:grid; grid-template-columns:110px minmax(0,1fr); gap:10px}
  [data-sl-page] .st-pt td::before{content:attr(data-l); font-size:13px; color:var(--sl-faint-aa)}
  [data-sl-page] .inv{grid-template-columns:1fr}
  [data-sl-page] .st-hero-fig{aspect-ratio:4/3; max-height:none}
}



/* d5 (Paul, 29 Sep): booking link first, email printed as plain text (a mailto does nothing on a webmail-only laptop) */
[data-sl-page] .mail-text{font-weight:600; user-select:all; overflow-wrap:anywhere; color:var(--sl-ink)}
[data-sl-page] .hero-note .hn a{color:inherit; font-weight:600; text-decoration:underline; text-underline-offset:3px}
[data-sl-page] .hero-note .hn b{color:var(--sl-ink); font-weight:600}

/* seams where the build split a section into more than one embed */
[data-sl-page] [data-sl-cut~="top"]{padding-top:0}
[data-sl-page] [data-sl-cut~="bottom"]{padding-bottom:0}

/* SPEED 3: the hero lede is the mobile LCP element; it stays painted and Motion only slides it */
html.sl-m [data-sl-page] .hero .lede.arr{opacity:1 !important}