/* Shifting Business design system. Palette from shiftingschools.com. */
:root{
  --navy:#0A1620; --cyan:#1DCDFE; --blue:#00A4CC; --blue-d:#00708F; --coral:#F15A29; --coral-h:#FF7345;
  --band:#F1F2F3; --ink:#14232B; --ink-2:#465863; --rule:#D5DBDF; --rule-d:#2A4250; --on-dark:#D5E4EA; --on-dark-2:#B5CBD4;
  --mono:var(--wp--preset--font-family--mono,"IBM Plex Mono",ui-monospace,Menlo,monospace);
  --r:4px;
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-variant-numeric:tabular-nums}
a:hover{color:var(--ink)}
h1,h2,h3{margin:0;font-weight:600}
p,ol,ul,dl,dd{margin:0}
h1,.wp-block-post-title{font-size:clamp(36px,4.5vw,54px);line-height:1.1;letter-spacing:-.02em;text-wrap:balance}
h2{font-size:clamp(27px,3vw,36px);line-height:1.18;letter-spacing:-.015em;text-wrap:balance}
h3{font-size:20px;line-height:1.3}
code{font:500 15px var(--mono);overflow-wrap:anywhere}
.wrap{max-width:1180px;margin-inline:auto;padding-inline:32px;box-sizing:border-box}
.wrap *,.sb-article *{box-sizing:border-box}
:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.skip-link.screen-reader-text:focus{background:#fff;color:var(--navy);padding:8px 14px;z-index:99;font-weight:600}

/* header */
.sb-head{background:#fff;color:var(--ink);border-bottom:1px solid var(--rule)}
.sb-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:80px}
.brand{display:block;line-height:0}
.brand img{display:block;height:48px;width:auto}
.sb-head .wp-block-navigation{font-size:15px;gap:28px;font-weight:500}
.sb-head .wp-block-navigation a{color:var(--ink);text-decoration:none}
.sb-head .wp-block-navigation a:hover{text-decoration:underline}
.sb-head .wp-block-navigation .nav-cta a{background:var(--navy);color:#fff;border-radius:var(--r);padding:8px 14px;white-space:nowrap}
.sb-head .wp-block-navigation .nav-cta a:hover{background:#153F4B;text-decoration:none}
.sb-head .wp-block-navigation__responsive-container.is-menu-open{background:#fff;color:var(--ink);padding:24px}
.sb-head .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{font-size:20px;gap:20px}

/* buttons */
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px}
.wp-block-button__link{transition:background .12s,border-color .12s;border:1px solid transparent}
.sb-btn-primary .wp-block-button__link,.sb-btn{background:var(--coral);color:var(--navy);border:1px solid transparent;border-radius:var(--r);padding:13px 22px;font:600 17px/1.3 inherit;font-family:inherit;cursor:pointer;text-decoration:none}
.sb-btn-primary .wp-block-button__link:hover,.sb-btn:hover{background:var(--coral-h);color:var(--navy)}
.sb-btn-line .wp-block-button__link{background:none;color:#fff;border-color:#5A7682}
.sb-btn-line .wp-block-button__link:hover{color:#fff;border-color:#fff}

/* hero */
.sb-hero{background:var(--navy);color:#fff;padding-top:72px}
.sb-hero a:not(.wp-block-button__link),.sb-pagehead a:not(.wp-block-button__link){color:#fff}
/* White text on coral fails contrast, so coral buttons keep navy text in dark sections. */
.sb-hero a.sb-btn,.sb-pagehead a.sb-btn,.sb-dark a.sb-btn{color:var(--navy)}
.sb-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:72px;align-items:center;padding-bottom:72px}
.lede{font-size:20px;line-height:1.5;color:var(--on-dark);max-width:33em;margin:22px 0 32px}
.sb-hero .facts,.sb-pagehead .facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule-d);list-style:none;padding:0}
.facts li{padding:22px 28px 26px 0;font-size:15px;color:var(--on-dark-2);line-height:1.45}
.facts li+li{padding-left:28px;border-left:1px solid var(--rule-d)}
.facts strong{display:block;color:#fff;font-weight:600;font-size:17px;margin-bottom:2px}

/* sample document */
.doc{background:#fff;color:var(--ink);border-radius:var(--r);overflow:hidden;font-size:15px;line-height:1.55}
.doc-head{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:13px 22px;background:var(--band);border-bottom:1px solid var(--rule)}
.doc-head b{font-weight:600}
.doc-head span{color:var(--ink-2);white-space:nowrap}
.doc dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:15px 22px;border-bottom:1px solid var(--rule)}
.doc dt{font-size:13px;color:var(--ink-2)}
.doc dd{font-weight:600}
.doc-body{padding:18px 22px}
.doc-body p+p{margin-top:10px}
.doc-flag{margin:0 22px 20px;padding:10px 14px;background:var(--band);border-left:4px solid var(--blue);font-weight:500}
.caption{font-size:13px;color:var(--on-dark-2);margin-top:10px}
figure.sb-sample{margin:0}

/* sections */
.sb-section{padding:88px 0}
.sb-band{background:var(--band)}
.sb-dark{background:var(--navy);color:#fff}
.sb-dark a{color:#fff}
.kicker{font-size:15px;font-weight:600;color:var(--blue-d);margin-bottom:10px}
.sb-dark .kicker{color:var(--cyan)}
.sb-sechead{max-width:700px;margin-bottom:40px}
.sb-sechead p:not(.kicker){margin-top:12px;color:var(--ink-2);font-size:17px}
.sb-dark .sb-sechead p:not(.kicker){color:var(--on-dark)}
.below{margin-top:24px}

/* the gap: survey figures */
.sb-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.sb-stats>.wp-block-group{border-top:2px solid var(--ink);padding-top:14px;font-size:15px;line-height:1.45;color:var(--ink-2)}
.sb-stats .stat{font-size:46px;font-weight:600;line-height:1.1;letter-spacing:-.02em;color:var(--ink);margin-bottom:6px}
.sb-stats-lede{font-size:20px;line-height:1.5;max-width:38em;margin:36px 0 16px}

/* jobs table */
.spec{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45;border-top:2px solid var(--ink)}
.spec thead th{font-weight:600;color:var(--ink-2);text-align:left;padding:12px 20px 12px 0;border-bottom:1px solid var(--rule)}
.spec tbody th,.spec td{padding:18px 20px 18px 0;border-bottom:1px solid var(--rule);vertical-align:top;text-align:left;font-weight:400}
.spec tbody th a{font-weight:600;font-size:17px;color:var(--ink);text-decoration:none}
.spec tbody th a:hover{color:var(--blue-d);text-decoration:underline}
.spec td:last-child{font-weight:500}

/* steps and grids */
.sb-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;counter-reset:s}
.sb-steps>.wp-block-group{counter-increment:s;border-top:2px solid var(--ink);padding-top:16px}
.sb-steps>.wp-block-group::before{content:"Step " counter(s);display:block;font-size:15px;font-weight:600;color:var(--blue-d);margin-bottom:6px}
.sb-steps p{margin-top:8px;color:var(--ink-2);font-size:15px}
.sb-standards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.sb-standards>.wp-block-group{border-top:1px solid var(--rule-d);padding-top:16px}
.sb-standards p{margin-top:8px;color:var(--on-dark);font-size:15px;line-height:1.5}
.sb-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:start}
.sb-prose p+p{margin-top:14px}
.sb-prose{max-width:40em}
.sb-person{margin-bottom:28px}
.sb-person .role{color:var(--ink-2);font-size:15px}
.sb-person .role+p{margin-top:8px}
.small{font-size:15px;color:var(--ink-2)}

/* faq */
.wp-block-details{border-top:1px solid var(--rule);margin:0}
.wp-block-details:last-child{border-bottom:1px solid var(--rule)}
.wp-block-details summary{cursor:pointer;font-weight:600;padding:16px 0}
.wp-block-details p{padding:0 0 18px;color:var(--ink-2);max-width:42em}

/* signup */
.sb-signup-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.sb-signup-grid .sub{margin-top:12px;color:var(--on-dark)}
form.sb-update{display:flex;gap:10px;flex-wrap:wrap}
form.sb-update label{flex-basis:100%;font-size:15px;font-weight:500}
form.sb-update input{flex:1 1 240px;min-width:0;border:1px solid #5A7682;border-radius:var(--r);background:#fff;color:var(--ink);padding:12px 14px;font:400 17px inherit;font-family:inherit}
.sb-promise{font-size:15px;color:var(--on-dark-2);margin-top:12px}
.notice{display:none;margin-top:12px;padding:10px 14px;background:#FFF1E9;color:#7A2C0A;font-size:15px;border-radius:var(--r)}
.notice.show{display:block}

/* footer */
.sb-foot{background:var(--navy);color:var(--on-dark-2);font-size:15px;border-top:1px solid var(--rule-d);padding:40px 0}
.sb-foot .wrap{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap}
.sb-foot a{color:#fff}
.sb-foot ul{list-style:none;padding:0;display:flex;gap:8px 24px;flex-wrap:wrap}
.sb-foot .brand{margin-bottom:14px}
.sb-foot .brand img{height:42px}

/* inner pages */
.sb-pagehead{background:var(--navy);color:#fff;padding:48px 0 64px}
.crumbs{font-size:15px;color:var(--on-dark-2);margin-bottom:20px}
.crumbs ol{list-style:none;padding:0;display:flex;gap:8px;flex-wrap:wrap}
.crumbs li+li::before{content:"/";margin-right:8px;color:#5A7682}
.sb-product{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:64px;align-items:start}
.tagline{font-size:20px;color:var(--cyan);font-weight:500;margin-top:10px}
.sb-pagehead .lede{margin-bottom:28px}
.buybox{background:#fff;color:var(--ink);border-radius:var(--r);padding:26px}
.status{display:inline-block;font-size:13px;font-weight:600;background:var(--band);padding:4px 9px;border-radius:var(--r)}
.price{font-weight:600;font-size:46px;line-height:1.1;letter-spacing:-.02em;margin-top:14px}
.price-note{color:var(--ink-2);font-size:15px;margin-bottom:16px}
.buybox a.sb-btn{display:block;text-align:center}
.buy-note{color:var(--ink-2);font-size:14px;text-align:center;margin-top:10px}
.buybox ul{list-style:none;padding:0;margin-top:18px;font-size:15px}
.buybox li{padding:8px 0;border-top:1px solid var(--rule)}

/* tools list */
.sb-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
.sb-tools>.wp-block-group{border-top:1px solid var(--rule);padding:20px 0 24px}
.sb-tools p{color:var(--ink-2);font-size:15px;margin-top:6px}
.sb-tools .cmd{font:500 15px var(--mono);color:var(--blue-d);margin-top:4px;overflow-wrap:anywhere}

/* samples */
.samples{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:32px;align-items:start}
.tablist{display:grid;border-top:2px solid var(--ink)}
.tablist button{background:none;border:0;border-bottom:1px solid var(--rule);padding:14px 12px;text-align:left;font:500 15px/1.3 inherit;font-family:inherit;color:var(--ink);cursor:pointer}
.tablist button:hover{background:#fff}
.tablist button[aria-selected="true"]{background:var(--navy);color:#fff}
.panel{display:grid;gap:12px;min-width:0;margin-bottom:24px}
.js .panel:not(.is-active),.panel[hidden]{display:none}
.panel h3{font-size:17px}
.io{border-radius:var(--r);padding:20px 22px;min-width:0}
.io .io-label{font-size:13px;font-weight:600;margin-bottom:8px}
.io-in{background:var(--navy);color:#EAF6FA}
.io-in .io-label{color:var(--cyan)}
.io-in p:not(.io-label){font:400 15px/1.6 var(--mono);overflow-wrap:anywhere}
.io-out{background:#fff;border:1px solid var(--rule)}
.io-out .io-label{color:var(--blue-d)}
.io-out p{margin-bottom:10px;font-size:15px}
.io-out ul,.io-out ol{margin:0 0 10px;padding-left:20px;font-size:15px}
.io-out .flag{margin:0;padding:10px 14px;background:var(--band);border-left:4px solid var(--blue);font-weight:500}
.num{width:100%;border-collapse:collapse;font-size:15px;margin-bottom:12px}
.num th,.num td{padding:7px 8px;text-align:right;border-bottom:1px solid var(--rule)}
.num th:first-child,.num td:first-child{text-align:left}
.num th{font-weight:600}
.num .tight td{font-weight:600;color:#A8380C}
.req{margin-top:32px;padding:20px 24px;border:1px solid var(--rule);border-radius:var(--r)}
.req ul{margin:8px 0 0;padding-left:20px}
.req li+li{margin-top:6px}

/* the editor shows pages at their real width */
.editor-styles-wrapper .is-root-container>.wp-block{max-width:none}

/* posts, guides and standard pages */
.sb-article{max-width:760px;margin-inline:auto;padding:64px 32px 88px;box-sizing:border-box}
.sb-article>*+*,.sb-article .wp-block-post-content>*+*{margin-top:18px}
.sb-article .wp-block-post-content h2{margin-top:40px}
.sb-article .wp-block-post-title a{color:var(--ink);text-decoration:none}
.sb-article h2.wp-block-post-title{font-size:27px;margin-top:32px}
.sb-byline{display:flex;gap:12px;flex-wrap:wrap;color:var(--ink-2);font-size:15px}

@media (max-width:980px){
  .sb-section{padding:64px 0}
  .sb-hero{padding-top:48px}
  .sb-hero-grid,.sb-split,.sb-product,.samples,.sb-signup-grid{grid-template-columns:minmax(0,1fr);gap:40px}
  .sb-standards,.sb-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .wrap{padding-inline:16px}
  .sb-article{padding:40px 16px 64px}
  .brand img{height:42px}
  .sb-head .wrap{min-height:68px;gap:12px}
  .wp-block-buttons .wp-block-button{flex:1 1 100%}
  .wp-block-buttons .wp-block-button__link{display:block;width:100%}
  .sb-hero .facts{grid-template-columns:minmax(0,1fr)}
  .facts li,.facts li+li{padding:16px 0;border-left:0}
  .facts li+li{border-top:1px solid var(--rule-d)}
  .doc dl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .doc-head,.doc dl,.doc-body{padding-left:16px;padding-right:16px}
  .doc-flag{margin:0 16px 16px}
  .sb-steps,.sb-standards,.sb-tools{grid-template-columns:minmax(0,1fr)}
  .sb-steps{gap:28px}
  .sb-standards{gap:24px}
  .spec thead{position:absolute;left:-9999px}
  .spec,.spec tbody,.spec tr,.spec tbody th,.spec td{display:block}
  .spec tr{padding:16px 0;border-bottom:1px solid var(--rule)}
  .spec tbody th,.spec td{border:0;padding:0 0 8px}
  .spec td::before{content:attr(data-label);display:block;font-size:13px;font-weight:600;color:var(--ink-2)}
  form.sb-update .sb-btn{flex:1 1 100%}
  .io{padding:18px 16px}
  .num th,.num td{padding:6px 4px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .wp-block-button__link{transition:none}
}
