:root {
  --paper:#fbfaf6;
  --ink:#191a18;
  --muted:#676962;
  --rule:#deded7;
  --panel:#f0efec;
  --purple:#8d89f7;
  --purple-soft:#e8dcfb;
  --lime:#d3f783;
  --pink:#eb9af5;
  --orange:#f78e56;
  --green:#8ace99;
  --ease:cubic-bezier(.22,1,.36,1);
  --quick:160ms;
  --arrive:220ms}

* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth;
  scroll-padding-top:110px}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.6 'DM Sans',sans-serif;
  -webkit-font-smoothing:antialiased}
a {
  color:inherit;
  text-decoration:none}
button,input,select,textarea {
  font:inherit;
  color:inherit}
button,a,input,textarea,select {
  -webkit-tap-highlight-color:transparent}
button {
  cursor:pointer}
img {
  display:block;
  max-width:100%;
  height:auto}
svg {
  display:block}
button svg,.btn svg,.text-link svg,.round-arrow svg {
  width:20px;
  height:20px;
  flex-shrink:0}
p {
  margin:0 0 1.2em}
h1,h2,h3 {
  font-weight:500;
  letter-spacing:-.045em;
  line-height:1.08;
  margin:0}
h1 {
  font-size:clamp(52px,5.6vw,82px)}
h2 {
  font-size:clamp(35px,3.8vw,54px)}
h3 {
  font-size:26px;
  letter-spacing:-.035em}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible {
  outline:3px solid #5f55be;
  outline-offset:5px}
::selection {
  background:var(--lime)}
[hidden] {
  display:none!important}
.wrap {
  width:min(1200px,calc(100% - 80px));
  margin:0 auto}
.section {
  padding:100px 0}
.label {
  text-transform:uppercase;
  font-size:11px;
  letter-spacing:.12em;
  font-weight:650;
  margin-bottom:20px}
.section-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:60px;
  margin-bottom:48px}
.section-heading>div:first-child {
  max-width:660px}
.section-lead {
  font-size:17px;
  color:var(--muted);
  max-width:385px;
  margin-bottom:0}
.section-heading .text-link {
  margin-top:22px}
.section-heading>p {
  flex:0 1 385px}
.intro,.hero-copy {
  color:var(--muted);
  font-size:19px;
  line-height:1.65;
  max-width:540px;
  margin:28px 0}
.actions {
  display:flex;
  gap:24px;
  align-items:center;
  flex-wrap:wrap}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:26px;
  min-height:49px;
  padding:12px 22px;
  background:var(--ink);
  color:var(--paper);
  border:1.5px solid var(--ink);
  border-radius:99px;
  line-height:1.4;
  font-size:14px;
  font-weight:550;
  transition:transform var(--quick) var(--ease),box-shadow var(--quick) var(--ease),background-color var(--quick) var(--ease);
  white-space:nowrap}
.btn.light {
  color:var(--ink);
  background:var(--paper);
  box-shadow:0 3px 0 var(--ink)}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:16px;
  font-size:14px;
  font-weight:550;
  min-height:44px}
.text-link span {
  border-bottom:1px solid var(--ink);
  line-height:1.8}
.text-link svg {
  transition:transform var(--quick) var(--ease)}
.text-button {
  border:0;
  border-bottom:1px solid;
  padding:4px 0;
  background:none;
  font-size:14px}
.btn:active {
  transform:translateY(2px) scale(.98);
  box-shadow:none}
.skip {
  position:fixed;
  top:10px;
  left:10px;
  transform:translateY(-160%);
  z-index:100;
  background:var(--lime);
  padding:12px}
.skip:focus {
  transform:translateY(0)}

.header {
  position:sticky;
  top:0;
  z-index:30;
  background:rgba(251,250,246,.97);
  border-bottom:1px solid var(--rule)}
.header-inner {
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:88px;
  gap:25px}
.brand {
  display:inline-flex;
  align-items:center;
  gap:10px;
  line-height:1}
.brand img {
  width:43px;
  height:43px}
.brand .brand-mark-light { display:none; }
.brand-ai { color:#756ce0; }
.brand>span {
  display:inline-flex;
  flex-direction:column;
  font-size:27px;
  font-weight:650;
  letter-spacing:-1.3px}
.brand small {
  display:flex;
  justify-content:space-between;
  width:100%;
  font-size:9px;
  letter-spacing:0;
  margin-top:5px;
  font-weight:500}
.nav {
  display:flex;
  align-items:center;
  gap:30px;
  font-size:13px;
  font-weight:500}
.nav>a:not(.btn) {
  position:relative;
  padding:10px 0}
.nav>a[aria-current]:after {
  content:'';
  position:absolute;
  bottom:3px;
  left:0;
  width:100%;
  height:2px;
  background:var(--purple)}
.nav .btn {
  font-size:13px;
  min-height:43px;
  padding:10px 18px;
  gap:18px}
.menu-toggle {
  display:none}

.hero {
  padding:75px 0 65px}
.hero-grid {
  display:grid;
  grid-template-columns:1.04fr 1fr;
  align-items:center;
  gap:40px;
  min-height:510px}
.hero-text {
  position:relative;
  z-index:2}
.hero h1 {
  line-height:1.12}
.highlight-word {
  position:relative;
  isolation:isolate;
  white-space:nowrap}
.highlight-word:before {
  content:'';
  position:absolute;
  z-index:-1;
  inset:8% -7px 0;
  background:var(--purple-soft);
  border-radius:7px;
  transform:rotate(-2deg)}
.hero-copy {
  max-width:470px}
.hero .actions {
  gap:20px}
.hero-reassurance {
  display:flex;
  gap:9px;
  font-size:11px;
  color:var(--muted);
  max-width:390px;
  line-height:1.5;
  margin:22px 0 0}
.hero-reassurance svg {
  width:17px;
  flex-shrink:0}
.hero-people {
  position:relative;
  height:500px}
.hero-grid-lines {
  position:absolute;
  inset:25px 0 35px 5%;
  background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(ellipse,#000 15%,transparent 70%);
  opacity:.8}
.hero-person {
  position:absolute;
  display:block;
  isolation:isolate;
  transition:transform var(--arrive) var(--ease)}
.hero-harry {
  width:70%;
  height:360px;
  left:0;
  bottom:18px;
  z-index:2;
  transform:rotate(-4deg)}
.hero-andrew {
  width:54%;
  height:290px;
  right:-3%;
  top:4px;
  transform:rotate(6deg)}
.person-backdrop {
  position:absolute;
  inset:0;
  border:1.5px solid var(--ink);
  border-radius:150px 150px 20px 20px;
  background:var(--purple-soft);
  box-shadow:0 4px 0 var(--ink);
  z-index:-1}
.hero-andrew .person-backdrop {
  background:#f4c29f;
  border-radius:150px 150px 20px 20px}
.portrait-picture { display:block; width:100%; height:100%; }
.portrait {
  height:100%;
  width:100%;
  object-fit:cover}
.portrait.original {
  mix-blend-mode:multiply;
  filter:grayscale(1)}
.hero-person>.portrait {
  position:absolute;
  inset:0;
  object-fit:contain;
  object-position:bottom;
  border-radius:150px 150px 20px 20px}
.person-label {
  position:absolute;
  left:16px;
  bottom:14px;
  background:var(--paper);
  border:1px solid var(--ink);
  border-radius:9px;
  padding:8px 39px 8px 12px;
  box-shadow:0 2px 0 var(--ink);
  font-size:11px;
  line-height:1.4}
.person-label strong {
  font-size:13px;
  font-weight:600;
  display:block}
.person-label>span {
  color:var(--muted)}
.person-label svg {
  position:absolute;
  right:10px;
  top:15px;
  width:18px}
.hero-andrew .person-label {
  left:auto;
  right:12px;
  padding-right:14px}
.hero-stamp {
  position:absolute;
  left:0;
  top:2px;
  width:150px;
  height:128px;
  z-index:3;
  transform:rotate(-10deg)}
.hero-stamp>svg {
  width:100%;
  height:100%;
  fill:var(--lime)}
.hero-stamp span {
  position:absolute;
  inset:0;
  display:grid;
  place-content:center;
  text-align:center;
  font-size:18px;
  line-height:1.2;
  font-weight:550;
  letter-spacing:-.04em}
.hero-handnote {
  position:absolute;
  bottom:12px;
  right:0;
  font-size:13px;
  line-height:1.4;
  transform:rotate(5deg)}
.hero-handnote>svg {
  width:85px;
  height:45px;
  margin:8px 0 0 -40px;
  transform:rotate(160deg)}
.promise-strip {
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule)}
.promise-strip .wrap {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:20px;
  padding-bottom:20px;
  gap:24px;
  font-size:13px}
.promise-strip p {
  margin:0;
  font-weight:550}
.promise-strip span {
  display:flex;
  gap:9px;
  align-items:center;
  color:var(--muted)}
.promise-strip svg {
  width:18px;
  height:18px}

.topic-tabs {
  position:relative;
  display:inline-flex;
  border:1px solid var(--ink);
  background:#f0efec;
  border-radius:99px;
  padding:5px;
  gap:2px;
  margin-bottom:28px;
  isolation:isolate}
.topic-tabs button {
  position:relative;
  border:0;
  background:transparent;
  border-radius:99px;
  padding:12px 23px;
  font-size:14px;
  white-space:nowrap;
  min-height:46px}
.topic-tabs button[aria-selected=true] {
  font-weight:600}
.tab-highlight {
  position:absolute;
  top:5px;
  bottom:5px;
  left:0;
  background:var(--lime);
  border:1px solid var(--ink);
  border-radius:99px;
  z-index:-1;
  transition:transform var(--arrive) var(--ease),width var(--arrive) var(--ease)}
.example-panels {
  background:var(--panel);
  border-radius:22px;
  border:1px solid var(--ink);
  padding:48px;
  box-shadow:0 4px 0 var(--ink)}
.example-panel {
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:70px;
  min-height:425px;
  align-items:center}
.example-story h3 {
  font-size:34px;
  max-width:440px;
  margin:15px 0}
.example-story>p {
  color:var(--muted);
  max-width:435px}
.mini-steps {
  list-style:none;
  margin:26px 0 18px;
  padding:0;
  font-size:14px;
  display:grid;
  gap:18px}
.mini-steps li {
  display:grid;
  grid-template-columns:48px 1fr;
  gap:12px}
.mini-steps li>span {
  text-transform:uppercase;
  font-size:10px;
  letter-spacing:.08em;
  font-weight:650;
  padding-top:3px}
.prompt-sheet {
  position:relative;
  background:var(--purple-soft);
  border:1px solid var(--ink);
  border-radius:3px 26px 3px 3px;
  padding:28px;
  transform:rotate(3deg);
  box-shadow:5px 6px 0 #ded4eb}
.prompt-label {
  display:flex;
  align-items:center;
  gap:8px;
  text-transform:uppercase;
  font-size:10px;
  letter-spacing:.1em}
.small-dot {
  height:7px;
  width:7px;
  border-radius:50%;
  background:var(--ink)}
.prompt-text {
  font-size:23px;
  letter-spacing:-.03em;
  line-height:1.45;
  margin:27px 0 30px}
.prompt-bottom {
  border-top:1px solid #bfb3cf;
  padding-top:18px;
  font-size:14px;
  line-height:1.4;
  display:flex;
  justify-content:space-between}
.prompt-bottom>span {
  display:grid;
  place-items:center;
  border:1px solid var(--ink);
  background:var(--lime);
  border-radius:50%;
  width:36px;
  height:36px;
  transform:rotate(-12deg)}
.prompt-bottom svg {
  width:21px;
  height:21px}
.prompt-note {
  font-size:9px;
  color:#56504c;
  line-height:1.5;
  margin:17px 0 0}

.journey-section {
  background:var(--lime);
  border-block:1px solid var(--ink)}
.journey-section .section-lead {
  color:#454b39}
.journey-steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:55px;
  list-style:none;
  padding:0;
  margin:56px 0 0}
.journey-steps li {
  position:relative}
.journey-steps li:not(:last-child):after {
  content:'';
  position:absolute;
  top:42px;
  left:115px;
  right:-25px;
  border-top:1px dashed #75845e}
.journey-number {
  position:relative;
  display:block;
  width:95px;
  height:85px;
  margin-bottom:26px}
.journey-number svg {
  width:100%;
  height:100%;
  fill:var(--paper)}
.journey-number>span {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-size:25px;
  letter-spacing:-.06em}
.journey-steps li:nth-child(2) svg {
  fill:var(--purple-soft)}
.journey-steps li:nth-child(3) svg {
  fill:#f5be98}
.journey-steps h3 {
  max-width:260px;
  margin-bottom:15px}
.journey-steps p {
  font-size:15px;
  max-width:310px;
  color:#454b39;
  margin:0}
.people-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:85px;
  align-items:center}
.people-photo {
  position:relative;
  transform:rotate(-2deg)}
.people-photo>img {
  aspect-ratio:1.03;
  object-fit:cover;
  border-radius:18px;
  border:1px solid var(--ink)}
.photo-note {
  position:absolute;
  bottom:-20px;
  right:-15px;
  background:var(--paper);
  border:1px solid var(--ink);
  padding:16px 23px;
  box-shadow:0 3px 0 var(--ink);
  font-size:14px;
  line-height:1.4;
  transform:rotate(5deg)}
.people-copy h2 {
  font-size:43px;
  margin-bottom:25px}
.people-copy>p:not(.label) {
  color:var(--muted)}
.team-signoff {
  display:flex;
  gap:14px;
  align-items:center;
  margin:28px 0 20px;
  font-size:13px}
.team-signoff strong {
  display:block;
  font-weight:550}
.team-signoff span:not(.avatar-pair) {
  color:var(--muted);
  font-size:11px}
.avatar-pair {
  display:inline-flex;
  flex-shrink:0}
.avatar-pair>span {
  display:block;
  width:56px;
  height:56px;
  overflow:hidden;
  border:1px solid var(--ink);
  border-radius:50%;
  background:var(--purple-soft)}
.avatar-pair>span+span {
  margin-left:-12px;
  background:#f4c29f}
.proof-section {
  background:#f0efec}
.work-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:38px}
.work-card {
  display:block}
.work-image {
  overflow:hidden;
  border:1px solid var(--ink);
  border-radius:17px;
  background:#eee9e0;
  aspect-ratio:1.7}
.work-image img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 250ms var(--ease)}
.work-info {
  display:flex;
  align-items:center;
  gap:25px;
  justify-content:space-between;
  padding:24px 0 0}
.work-info .label {
  margin-bottom:10px;
  font-size:10px}
.work-info h3 {
  font-size:30px;
  margin-bottom:10px}
.work-info p:not(.label) {
  font-size:14px;
  color:var(--muted);
  margin:0;
  max-width:390px}
.round-arrow {
  display:grid;
  place-items:center;
  border:1px solid var(--ink);
  border-radius:50%;
  width:45px;
  height:45px;
  flex-shrink:0;
  transition:transform var(--quick) var(--ease),background-color var(--quick) var(--ease)}

.faq-layout {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:80px}
.faq-layout .section-lead {
  margin:24px 0 10px}
.t-acc {
  border-bottom:1px solid var(--rule)}
.t-acc:first-child {
  border-top:1px solid var(--rule)}
.t-acc h3 {
  font-size:17px;
  letter-spacing:-.015em}
.t-acc-head {
  display:flex;
  width:100%;
  justify-content:space-between;
  align-items:center;
  gap:30px;
  background:none;
  border:0;
  text-align:left;
  padding:25px 0;
  line-height:1.5;
  font-weight:500}
.t-acc-chevron {
  width:16px;
  height:16px;
  flex-shrink:0;
  transition:transform 250ms var(--ease)}
.t-acc[data-open=true] .t-acc-chevron {
  transform:rotate(180deg)}
.t-acc-panel {
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transition:grid-template-rows 250ms var(--ease),opacity 250ms var(--ease)}
.t-acc-panel-inner {
  min-height:0;
  overflow:hidden}
.t-acc-panel p {
  padding:0 30px 24px 0;
  margin:0;
  font-size:15px;
  color:var(--muted)}
.t-acc[data-open=true] .t-acc-panel {
  grid-template-rows:1fr;
  opacity:1}
.cta-section {
  padding-top:0}
.callout {
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:80px;
  align-items:center;
  background:var(--purple-soft);
  border:1px solid var(--ink);
  border-radius:22px;
  padding:60px;
  box-shadow:0 4px 0 var(--ink)}
.callout h2 {
  font-size:52px}
.callout-copy>p:not(.label) {
  max-width:465px;
  margin:24px 0;
  font-size:16px}
.callout-human .avatar-pair>span {
  width:90px;
  height:90px}
.callout-human p {
  font-size:18px;
  line-height:1.5;
  letter-spacing:-.02em;
  margin:25px 0 15px}
.callout-human>a {
  font-size:13px;
  text-decoration:underline;
  text-underline-offset:5px}
.footer {
  background:var(--ink);
  color:var(--paper);
  padding:65px 0 25px}
.footer .brand .brand-mark { display:none; }
.footer .brand .brand-mark-light { display:block; }
.footer-top {
  display:flex;
  justify-content:space-between;
  gap:55px}
.footer-copy {
  font-size:28px;
  letter-spacing:-.035em;
  line-height:1.25;
  margin:28px 0 17px}
.footer-location {
  font-size:11px;
  color:#b8bbb1;
  max-width:300px}
.footer-links {
  display:flex;
  gap:75px}
.footer-links>div {
  display:flex;
  flex-direction:column;
  gap:11px;
  font-size:12px}
.footer-links strong {
  color:#abaea6;
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-bottom:10px}
.footer-bottom {
  border-top:1px solid #3c3d38;
  display:flex;
  justify-content:space-between;
  margin-top:55px;
  padding-top:24px;
  color:#b8bbb1;
  font-size:10px}
.footer-bottom>span:last-child {
  display:flex;
  gap:24px}

.page-hero {
  padding:75px 0 30px}
.page-title {
  max-width:1000px}
.page-section {
  padding:40px 0 90px}
.page-hero .intro {
  max-width:610px}
.workshop-hero {
  padding:80px 0 100px}
.workshop-hero-grid {
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:80px;
  align-items:center}
.workshop-hero h1 {
  font-size:clamp(50px,5.3vw,75px);
  line-height:1.15}
.workshop-note {
  position:relative;
  padding:38px;
  background:var(--purple-soft);
  border:1px solid var(--ink);
  border-radius:18px;
  transform:rotate(2deg);
  box-shadow:0 4px 0 var(--ink)}
.workshop-note h2 {
  font-size:32px;
  margin-bottom:28px}
.note-tab {
  display:block;
  font-size:9px;
  letter-spacing:.1em;
  margin-bottom:25px}
.workshop-note ul {
  list-style:none;
  padding:0;
  margin:0 0 25px}
.workshop-note li {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:13px;
  margin:15px 0}
.workshop-note li svg {
  width:18px;
  flex-shrink:0}
.workshop-note>p {
  font-size:12px;
  border-top:1px solid #c5b8d5;
  padding-top:23px}
.note-signoff {
  display:flex;
  align-items:center;
  gap:15px;
  font-size:12px}
.takeaways-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px}
.takeaway-list>div {
  display:flex;
  gap:25px;
  padding:25px 0;
  border-bottom:1px solid var(--rule)}
.takeaway-list>div:first-child {
  padding-top:0}
.takeaway-list>div>span {
  font-size:12px}
.takeaway-list h3 {
  margin-bottom:12px}
.takeaway-list p {
  font-size:15px;
  color:var(--muted);
  margin:0}
.about-story {
  padding-top:20px}
.about-photo img {
  width:100%;
  max-height:600px;
  object-fit:cover;
  object-position:center 40%;
  border-radius:20px;
  border:1px solid var(--ink)}
.about-copy {
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:60px;
  padding-top:70px}
.about-copy h2 {
  margin-bottom:28px}
.about-copy p:not(.label) {
  color:var(--muted);
  max-width:680px}
.team-section {
  background:var(--panel);
  padding-top:80px;
  margin-bottom:100px}
.team-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:40px 28px}
.member-photo {
  aspect-ratio:1;
  border:1px solid var(--ink);
  border-radius:130px 130px 16px 16px;
  background:var(--purple-soft);
  overflow:hidden}
.tone-1 {
  background:#f4c29f}
.tone-2 {
  background:var(--lime)}
.tone-3 {
  background:#e8cbea}
.team-member h3 {
  font-size:21px;
  margin:18px 0 6px}
.team-member p {
  font-size:12px;
  color:var(--muted);
  margin:0}

/* About: the people, what they believe and how they work. */
.ab-hero { padding:72px 0 96px; }
.ab-hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:64px; align-items:center; }
.ab-hero h1 { font-size:clamp(46px,5.2vw,76px); line-height:1.06; letter-spacing:-.06em; }
.ab-hero-description { font-size:19px; line-height:1.65; color:var(--muted); max-width:470px; margin:34px 0 40px; }
.ab-facts { list-style:none; margin:0; padding:24px 0 0; border-top:1px solid var(--rule); display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.ab-facts li { display:grid; gap:4px; }
.ab-facts strong { font-size:clamp(22px,2.1vw,30px); font-weight:500; letter-spacing:-.04em; line-height:1.1; }
.ab-facts span { font-size:12px; color:var(--muted); }
.ab-collage { position:relative; aspect-ratio:1/1.04; }
.ab-collage figure { position:absolute; margin:0; overflow:hidden; border:1px solid var(--ink); background:var(--purple-soft); }
.ab-collage img { width:100%; height:100%; object-fit:cover; }
.ab-photo-main { inset:0 14% 18% 0; border-radius:220px 220px 22px 22px; box-shadow:0 5px 0 var(--ink); }
.ab-photo-main img { object-position:62% 40%; }
.ab-photo-small { right:0; bottom:0; width:50%; aspect-ratio:1.2; border-radius:18px; box-shadow:0 4px 0 var(--ink); transform:rotate(3deg); }
.ab-photo-small img { object-position:40% 30%; }
.ab-badge { position:absolute; left:-5%; bottom:7%; width:clamp(104px,11vw,136px); height:auto; overflow:visible; }
.ab-ring { transform-box:view-box; transform-origin:center; animation:ab-spin-in 1.6s var(--ease) both; }
@keyframes ab-spin-in { from { transform:rotate(-140deg); opacity:0; } to { transform:none; opacity:1; } }
.ab-mission { background:var(--ink); color:var(--paper); padding:110px 0; }
.ab-mission-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.ab-mission .ws-eyebrow { color:var(--lime); }
.ab-mission h2 { font-size:clamp(40px,4.6vw,64px); margin-bottom:34px; }
.ab-mission .ws-underlined>svg { color:var(--lime); }
.ab-mission-copy>p:not(.ws-eyebrow) { color:#c4c5bd; font-size:17px; max-width:470px; }
.ab-week { margin:0; padding:30px 28px 22px; border:1px solid #50514a; border-radius:22px; background:#22231f; }
.ab-week svg { width:100%; height:auto; overflow:visible; }
.ab-week text { fill:#b7b9ad; font-size:12px; }
.ab-cell rect, .ab-key-manual { fill:#f5be98; }
.ab-back rect, .ab-key-back { fill:var(--lime); }
.ab-cell path { fill:none; stroke:var(--ink); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.js .ab-week:not(.is-in) .ab-back rect { fill:#f5be98; }
.js .ab-week:not(.is-in) .ab-back path { opacity:0; }
.ab-week.is-in .ab-back rect { transition:fill 420ms var(--ease) var(--d,0ms); }
.ab-week.is-in .ab-back path { transition:opacity 300ms var(--ease) calc(var(--d,0ms) + 220ms); }
.ab-week figcaption { color:#8f9187; font-size:11px; margin-top:14px; }
.ab-principle-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.ab-principle { border:1px solid var(--ink); border-radius:20px; padding:26px 24px 30px; background:var(--lime); transition:transform var(--arrive) var(--ease), box-shadow var(--arrive) var(--ease); }
.ab-principle.tone-1 { background:var(--purple-soft); }
.ab-principle.tone-2 { background:#e8cbea; }
.ab-principle.tone-3 { background:#f4c29f; }
.ab-principle-icon { display:grid; place-items:center; width:76px; height:76px; border-radius:50%; background:var(--paper); border:1px solid var(--ink); margin-bottom:34px; }
.ab-principle-icon svg { width:46px; height:46px; }
.ab-principle-number { display:block; font-size:11px; margin-bottom:10px; }
.ab-principle h3 { font-size:clamp(21px,1.9vw,25px); line-height:1.15; margin-bottom:12px; }
.ab-principle p { font-size:14px; line-height:1.6; color:#3f403b; margin:0; }
@media(hover:hover) { .ab-principle:hover { transform:translateY(-4px); box-shadow:0 5px 0 var(--ink); } }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.ab-services { padding-top:20px; }
.ab-svc { display:grid; grid-template-columns:.85fr 1.15fr; gap:28px; align-items:stretch; }
.ab-svc-side { display:flex; flex-direction:column; gap:22px; min-width:0; }
.ab-svc-tabs { display:flex; flex-direction:column; gap:10px; }
.ab-svc-tabs [role=tab] { position:relative; display:grid; grid-template-columns:36px 1fr 40px; grid-template-areas:"num title arrow" "num lead arrow"; column-gap:14px; row-gap:6px; align-items:center; text-align:left; padding:22px 22px 22px 20px; border:1px solid var(--rule); border-radius:18px; background:var(--paper); transition:background-color var(--arrive) var(--ease), border-color var(--arrive) var(--ease), box-shadow var(--arrive) var(--ease), transform var(--quick) var(--ease); }
.ab-svc-number { grid-area:num; align-self:start; padding-top:6px; font-size:12px; color:var(--muted); }
.ab-svc-title { grid-area:title; font-size:clamp(22px,2.2vw,30px); font-weight:500; letter-spacing:-.045em; line-height:1.1; }
.ab-svc-lead { grid-area:lead; font-size:13px; line-height:1.5; color:var(--muted); }
.ab-svc-arrow { grid-area:arrow; display:grid; place-items:center; width:40px; height:40px; border:1px solid var(--ink); border-radius:50%; opacity:0; transform:translateX(-6px); transition:opacity var(--arrive) var(--ease), transform var(--arrive) var(--ease); }
.ab-svc-arrow svg { width:18px; height:18px; }
.ab-svc-tabs [role=tab][aria-selected=true] { background:var(--lime); border-color:var(--ink); box-shadow:0 4px 0 var(--ink); }
.ab-svc-tabs [role=tab][aria-selected=true] .ab-svc-lead { color:#3f403b; }
.ab-svc-tabs [role=tab][aria-selected=true] .ab-svc-arrow { opacity:1; transform:none; background:var(--paper); }
.ab-svc-tabs [role=tab]:active { transform:scale(.985); }
@media(hover:hover) { .ab-svc-tabs [role=tab]:not([aria-selected=true]):hover { border-color:var(--ink); } .ab-svc-tabs [role=tab]:not([aria-selected=true]):hover .ab-svc-arrow { opacity:.5; transform:none; } }
.ab-svc-panels { display:grid; }
.ab-svc-panel { grid-area:1/1; display:grid; grid-template-rows:auto 1fr; border:1px solid var(--ink); border-radius:22px; overflow:hidden; background:var(--purple-soft); }
.ab-svc-panel[hidden] { display:grid!important; visibility:hidden; pointer-events:none; }
.ab-svc-panel.tone-1 { background:#e8cbea; }
.ab-svc-panel.tone-2 { background:#f4c29f; }
.ab-svc-art { width:100%; height:auto; max-height:300px; padding:22px 26px 4px; overflow:visible; }
.ab-svc-art text { fill:var(--ink); font-size:14px; font-weight:500; }
.ab-svc-art .ab-svg-small { font-size:12px; }
.ab-svc-detail { display:flex; flex-direction:column; align-items:flex-start; padding:26px 30px 30px; background:var(--paper); border-top:1px solid var(--ink); }
.ab-svc-detail h3 { font-size:26px; margin-bottom:16px; }
.ab-svc-detail ul { list-style:none; margin:0 0 18px; padding:0; display:grid; gap:10px; }
.ab-svc-detail li { display:flex; gap:10px; align-items:flex-start; font-size:15px; line-height:1.5; }
.ab-svc-detail li svg { width:19px; height:19px; flex:none; margin-top:2px; }
.ab-svc-detail .text-link { margin-top:auto; }
.ab-service-help { margin-top:auto; padding:22px 24px; border-radius:18px; background:var(--panel); }
.ab-service-help p { margin:0 0 4px; font-size:14px; }
.team-member { position:relative; }
.team-member-open { padding:0; border:0; background:none; font:inherit; letter-spacing:inherit; text-align:left; color:inherit; }
.team-member-open::after { content:''; position:absolute; inset:0; z-index:3; border-radius:16px; }
.team-member-open:focus-visible { outline:none; }
.team-member-open:focus-visible::after { outline:3px solid #5f55be; outline-offset:6px; }
.member-more { position:absolute; z-index:2; right:12px; bottom:12px; display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--ink); border-radius:50%; background:var(--paper); font-size:22px; line-height:1; transform:scale(.85); opacity:.85; transition:transform var(--arrive) var(--ease), background-color var(--arrive) var(--ease), opacity var(--arrive) var(--ease); }
@media(hover:hover) { .team-member:hover .member-more { transform:rotate(90deg); background:var(--lime); opacity:1; } }
.team-hint { margin:34px 0 0; font-size:13px; color:var(--muted); }
.tm-dialog { position:fixed; inset:0; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:24px; border:0; background:transparent; overflow:auto; display:none; place-items:center; }
.tm-dialog[open] { display:grid; }
.tm-dialog::backdrop { background:transparent; }
.tm-scrim { position:fixed; inset:0; background:rgba(25,26,24,.62); backdrop-filter:blur(3px); }
.tm-panel { position:relative; width:min(900px,100%); background:var(--paper); border:1px solid var(--ink); border-radius:26px; box-shadow:0 6px 0 var(--ink); padding:34px; }
.tm-profiles { display:grid; }
.tm-profile { position:relative; grid-area:1/1; display:grid; grid-template-columns:.95fr 1.05fr; gap:44px; align-items:center; pointer-events:none; }
.tm-profile[hidden] { display:grid!important; visibility:hidden; }
.tm-profile.is-active { z-index:1; pointer-events:auto; }
.tm-visual { position:relative; aspect-ratio:200/230; --tone:var(--purple-soft); }
.tm-tone-1 .tm-visual { --tone:#f4c29f; }
.tm-tone-2 .tm-visual { --tone:var(--lime); }
.tm-tone-3 .tm-visual { --tone:#e8cbea; }
.tm-art { display:block; width:100%; height:100%; }
.tm-artwork { transform-box:view-box; transform-origin:50% 60%; }
.tm-shape { fill:var(--tone); stroke:var(--ink); stroke-width:1.5; }
.tm-shape * { vector-effect:non-scaling-stroke; }
.tm-person { transform-box:fill-box; transform-origin:50% 100%; }
.tm-cutout { opacity:0; transition:opacity 220ms var(--ease); }
.tm-cutout.is-loaded { opacity:1; }
.tm-copy { padding-right:20px; }
.tm-role { font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:600; margin:0 0 14px; }
.tm-copy h2 { font-size:clamp(38px,4.4vw,58px); margin-bottom:20px; }
.tm-sentence { font-size:18px; line-height:1.6; color:#45463f; margin:0 0 28px; max-width:400px; }
.tm-model { display:inline-flex; align-items:center; gap:14px; padding:10px 18px 10px 10px; border:1px solid var(--ink); border-radius:99px; background:var(--paper); box-shadow:0 3px 0 var(--ink); }
.tm-model-logo { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:var(--ink); color:var(--paper); }
.tm-model-logo svg { width:24px; height:24px; }
.tm-model small { display:block; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.tm-model strong { display:block; font-size:17px; font-weight:550; letter-spacing:-.02em; line-height:1.3; }
.tm-close { position:absolute; z-index:4; top:18px; right:18px; display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--ink); border-radius:50%; background:var(--paper); transition:transform var(--quick) var(--ease), background-color var(--quick) var(--ease); }
.tm-close svg { width:20px; height:20px; }
.tm-nav { position:absolute; z-index:2; right:34px; bottom:30px; display:flex; align-items:center; gap:12px; }
.tm-nav button { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--ink); border-radius:50%; background:var(--paper); transition:transform var(--quick) var(--ease), background-color var(--quick) var(--ease); }
.tm-nav button svg { width:19px; height:19px; }
.tm-count { min-width:52px; text-align:center; font-size:12px; font-variant-numeric:tabular-nums; }
@media(hover:hover) { .tm-close:hover, .tm-nav button:hover { background:var(--lime); transform:translateY(-2px); } }
.tm-close:active, .tm-nav button:active { transform:scale(.95); }
html.tm-locked { overflow:hidden; scrollbar-gutter:stable; }
.tm-nav[hidden] { display:none; }
.ab-page .team-section { margin-bottom:90px; }
.ab-page .cta-section .callout-actions .text-link { font-size:14px; }
@media(max-width:1050px) {
 .ab-hero-grid, .ab-mission-grid { gap:44px; }
 .ab-svc { gap:18px; }
 .tm-profile { gap:28px; }
 .ab-principle-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:800px) {
 .ab-hero { padding:44px 0 64px; }
 .ab-hero-grid, .ab-mission-grid, .ab-svc { grid-template-columns:1fr; }
 .ab-hero-description { font-size:17px; margin:28px 0 32px; }
 .ab-collage { max-width:520px; width:100%; margin:0 auto; }
 .ab-badge { left:0; }
 .ab-mission { padding:70px 0; }
 .ab-svc-tabs { flex-direction:row; flex-wrap:wrap; gap:8px; }
 .ab-svc-tabs [role=tab] { flex:0 0 auto; grid-template-columns:auto auto; grid-template-areas:"num title"; column-gap:8px; padding:11px 15px; border-radius:99px; }
 .ab-svc-tabs [role=tab][aria-selected=true] { box-shadow:0 3px 0 var(--ink); }
 .ab-svc-number { padding-top:0; font-size:11px; }
 .ab-svc-title { font-size:15px; letter-spacing:-.02em; }
 .ab-svc-lead, .ab-svc-arrow { display:none; }
 .ab-service-help { display:none; }
 .tm-dialog { padding:12px; place-items:end center; }
 .tm-panel { padding:22px 20px 84px; border-radius:22px; }
 .tm-profile { grid-template-columns:1fr; gap:18px; }
 .tm-visual { width:min(240px,64%); margin:6px auto 0; }
 .tm-copy { padding-right:0; text-align:center; }
 .tm-copy h2 { font-size:36px; margin-bottom:12px; }
 .tm-sentence { font-size:15px; margin:0 auto 20px; }
 .tm-nav { left:20px; right:20px; bottom:20px; justify-content:space-between; }
}
@media(max-width:800px) and (max-height:700px) {
 .tm-profile { gap:12px; }
 .tm-visual { width:min(190px,50%); margin:0 auto; }
}
@media(max-width:560px) {
 .ab-hero h1 { font-size:clamp(40px,11.5vw,56px); }
 .ab-facts { grid-template-columns:1fr; gap:14px; }
 .ab-facts li { grid-template-columns:110px 1fr; align-items:baseline; }
 .ab-facts strong { font-size:21px; }
 .ab-principle-grid { grid-template-columns:1fr; }
 .ab-principle-icon { margin-bottom:24px; }
 .ab-week { padding:22px 16px 16px; }
 .ab-svc-art { padding:16px 12px 0; }
 .ab-svc-detail { padding:22px 20px 24px; }
 .ab-svc-detail li { font-size:14px; }
 .member-more { width:32px; height:32px; font-size:19px; right:8px; bottom:8px; }
}
@media(prefers-reduced-motion:reduce) {
 .ab-page *, .ab-page *::before, .ab-page *::after { animation:none!important; transition:none!important; }
}
.implementation-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:center}
.implementation-note {
  position:relative;
  background:var(--lime);
  padding:45px;
  border-radius:20px;
  border:1px solid var(--ink);
  min-height:400px}
.implementation-note h2 {
  font-size:58px;
  margin-top:25px}
.implementation-note>svg {
  position:absolute;
  bottom:20px;
  right:20px;
  width:100px;
  height:100px;
  fill:var(--purple-soft)}
.project-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-block:1px solid var(--rule);
  margin-top:60px;
  padding:35px 0}
.project-row h2 {
  font-size:32px;
  margin:10px 0}
.project-row p {
  margin:0;
  color:var(--muted)}

.contact-section {
  padding:65px 0 100px}
.contact-layout {
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:95px;
  align-items:start}
.contact-copy h1 {
  font-size:70px}
.contact-copy .hero-copy {
  font-size:17px;
  margin:23px 0}
.contact-people {
  display:flex;
  align-items:center;
  gap:15px;
  font-size:12px;
  line-height:1.5;
  margin:30px 0}
.contact-next {
  list-style:none;
  margin:35px 0;
  padding:0}
.contact-next li {
  display:flex;
  gap:16px;
  margin-bottom:20px}
.contact-next li>span {
  font-size:10px;
  padding-top:4px}
.contact-next strong {
  font-size:14px;
  font-weight:550}
.contact-next p {
  font-size:13px;
  color:var(--muted);
  margin:5px 0 0;
  max-width:300px}
.contact-direct {
  display:flex;
  align-items:flex-start;
  flex-direction:column;
  font-size:13px;
  gap:5px}
.contact-direct p {
  margin:0;
  font-size:11px;
  color:var(--muted)}
.contact-direct>.text-link {
  margin-bottom:10px}
.contact-form-wrap {
  background:#f0efec;
  border:1px solid var(--ink);
  padding:35px;
  border-radius:20px;
  box-shadow:0 4px 0 var(--ink)}
.form h2,.draft-result h2 {
  font-size:30px;
  margin-bottom:12px}
.hint {
  font-size:12px;
  color:var(--muted);
  line-height:1.6}
.form label {
  font-size:12px;
  display:block;
  font-weight:550;
  margin:20px 0 7px}
.form label .hint {
  font-weight:400;
  font-size:10px}
.form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px}
input,select,textarea {
  display:block;
  background:var(--paper);
  border:1px solid #b2b3aa;
  border-radius:8px;
  padding:11px 12px;
  width:100%;
  font-size:14px;
  line-height:1.5;
  transition:border-color var(--quick) var(--ease),box-shadow var(--quick) var(--ease)}
input:focus,select:focus,textarea:focus {
  border-color:#635bc4;
  box-shadow:0 0 0 2px #8d89f720}
textarea {
  min-height:135px;
  resize:vertical}
textarea::placeholder {
  color:#787a71;
  font-size:12px}
.form #message-hint {
  font-size:10px;
  margin:8px 0 0}
.field-error {
  display:block;
  color:#a32625;
  font-size:12px;
  margin-top:5px}
.field-error:empty {
  display:none}
[aria-invalid=true] {
  border-color:#a32625}
.form .btn {
  width:100%;
  margin-top:25px}
.form .btn:disabled {
  cursor:wait;
  opacity:.65}
.form-trap {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden}
.form-status {
  color:#a32625;
  font-size:13px;
  line-height:1.5;
  margin:12px 0 0}
.form-status:empty {
  display:none}
.form-status a {
  text-decoration:underline}
.form-privacy {
  font-size:10px;
  color:var(--muted);
  text-align:center;
  margin:17px 0 0}
.form-privacy a {
  text-decoration:underline}
.draft-check {
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  background:var(--lime);
  border:1px solid var(--ink);
  border-radius:50%;
  margin-bottom:25px}
.draft-check svg {
  width:24px}
.draft-result>p {
  font-size:14px;
  color:var(--muted)}
#draft-preview {
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font:13px/1.7 'DM Sans',sans-serif;
  padding:22px;
  background:var(--paper);
  border:1px solid var(--rule);
  border-radius:10px;
  max-height:360px;
  overflow:auto;
  margin:25px 0}
.draft-result .actions {
  gap:14px}
.draft-result .btn {
  font-size:12px;
  padding:11px 16px;
  gap:12px}
.draft-result #copy-status {
  font-size:12px;
  min-height:20px;
  margin:15px 0}

.library-section {
  padding-top:25px}
.library-tools {
  display:flex;
  align-items:flex-end;
  gap:40px;
  justify-content:space-between;
  margin-bottom:35px}
.library-tools>div {
  max-width:600px;
  width:100%}
.library-tools label {
  font-size:12px;
  display:block;
  margin-bottom:8px}
.library-tools input {
  padding:16px;
  border-radius:99px}
.library-tools>p {
  font-size:12px;
  color:var(--muted);
  white-space:nowrap;
  margin:0 0 16px}
.article-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:40px;
  padding:32px 0;
  border-top:1px solid var(--rule)}
.article-row h2 {
  font-size:26px;
  letter-spacing:-.03em;
  line-height:1.25;
  max-width:850px}
.article-row p {
  font-size:14px;
  color:var(--muted);
  max-width:850px;
  margin:10px 0 0}
.empty-state {
  padding:70px 0}
.empty-state h2 {
  font-size:34px;
  margin-bottom:15px}
.breadcrumbs {
  font-size:12px;
  color:var(--muted);
  margin-bottom:25px}
.breadcrumbs a {
  text-decoration:underline;
  text-underline-offset:4px}
.article-hero .page-title {
  font-size:clamp(40px,4.5vw,64px);
  max-width:1030px}
.article-layout {
  display:grid;
  grid-template-columns:240px minmax(0,740px);
  gap:80px}
.article-toc {
  position:sticky;
  top:120px;
  align-self:start;
  border-top:1px solid var(--rule);
  padding-top:18px}
.article-toc .label {
  margin-bottom:13px}
.article-toc a {
  font-size:12px;
  display:block;
  color:var(--muted);
  margin-bottom:12px;
  line-height:1.5}
.prose {
  max-width:740px;
  font-size:17px;
  line-height:1.85}
.prose h2 {
  font-size:32px;
  line-height:1.2;
  margin:45px 0 20px}
.prose h2:first-child {
  margin-top:0}
.prose h3 {
  font-size:24px;
  line-height:1.3;
  margin:30px 0 16px}
.prose p,.prose li {
  color:#565951}
.prose p {
  margin-bottom:24px}
.prose ul,.prose ol {
  padding-left:24px;
  margin:22px 0}
.prose li {
  margin-bottom:10px}
.prose a {
  text-decoration:underline;
  text-underline-offset:4px}
.prose .btn {
  text-decoration:none;
  color:var(--paper)}
.prose strong {
  color:var(--ink)}

@media(hover:hover) {
  .btn:hover {
  transform:translateY(-2px);
  box-shadow:0 4px 0 #aaa6c2}
.btn.light:hover {
  box-shadow:0 5px 0 var(--ink)}
.text-link:hover svg {
  transform:translateX(4px)}
.hero-harry:hover {
  transform:rotate(-2deg) translateY(-5px)}
.hero-andrew:hover {
  transform:rotate(4deg) translateY(-5px)}
.work-card:hover .work-image img {
  transform:scale(1.025)}
.work-card:hover .round-arrow,.article-row:hover .round-arrow,.project-row:hover .round-arrow {
  background:var(--lime);
  transform:rotate(-35deg)}
.nav>a:not(.btn):hover,.footer a:hover {
  text-decoration:underline;
  text-underline-offset:5px}
.article-toc a:hover {
  color:var(--ink)}
.t-acc-head:hover {
  color:#5d52a0}
}

@media(min-width:1500px) {
  .wrap {
  width:min(1280px,calc(100% - 120px))}
.hero-people {
  height:540px}
.hero-harry {
  height:400px}
.hero-andrew {
  height:330px}
}

@media(max-width:1100px) {
  .wrap {
  width:calc(100% - 56px)}
.nav {
  gap:20px}
.hero-grid {
  gap:20px}
.hero h1 {
  font-size:64px}
.hero-people {
  height:430px}
.hero-harry {
  height:300px}
.hero-andrew {
  height:245px}
.hero-stamp {
  width:125px;
  height:110px}
.hero-stamp span {
  font-size:16px}
.hero-handnote {
  font-size:11px}
.hero .actions {
  gap:10px}
.hero .text-link {
  font-size:12px}
.example-panel {
  gap:45px;
  min-height:460px}
.example-panels {
  padding:35px}
.prompt-text {
  font-size:21px}
.people-layout,.contact-layout {
  gap:50px}
.people-copy h2 {
  font-size:37px}
.callout {
  gap:50px;
  padding:45px}
.callout h2 {
  font-size:45px}
.workshop-hero-grid {
  gap:45px}
.workshop-note {
  padding:28px}
.workshop-note h2 {
  font-size:28px}
.contact-copy h1 {
  font-size:60px}
.contact-form-wrap {
  padding:28px}
.article-layout {
  gap:45px;
  grid-template-columns:200px minmax(0,1fr)}
}

@media(max-width:850px) {
  .section {
  padding:70px 0}
.header-inner {
  min-height:76px}
.nav {
  gap:17px}
.nav .btn {
  display:none}
.hero {
  padding:50px 0}
.hero h1 {
  font-size:54px}
.hero-copy {
  font-size:17px}
.hero-people {
  height:370px}
.hero-harry {
  height:260px;
  width:75%;
  bottom:25px}
.hero-andrew {
  height:210px;
  width:58%;
  top:10px}
.hero-stamp {
  width:105px;
  height:92px;
  left:-8px}
.hero-stamp span {
  font-size:13px}
.hero-handnote {
  right:-8px;
  bottom:0}
.person-label {
  left:10px;
  bottom:10px;
  padding:6px 25px 6px 8px;
  font-size:8px}
.person-label strong {
  font-size:10px}
.person-label svg {
  width:13px;
  right:6px;
  top:12px}
.promise-strip .wrap {
  font-size:11px;
  gap:15px}
.promise-strip p {
  display:none}
.section-heading {
  gap:35px}
.section-heading>div {
  flex:1}
.section-lead {
  font-size:15px;
  max-width:330px}
.example-panels {
  padding:30px}
.example-panel {
  gap:35px;
  min-height:490px}
.example-story h3 {
  font-size:28px}
.example-story>p {
  font-size:14px}
.mini-steps {
  font-size:12px}
.prompt-sheet {
  padding:22px}
.prompt-text {
  font-size:20px}
.journey-steps {
  gap:30px}
.journey-steps h3 {
  font-size:23px}
.journey-steps p {
  font-size:13px}
.people-layout {
  gap:40px}
.people-copy h2 {
  font-size:32px}
.people-copy>p:not(.label) {
  font-size:14px}
.photo-note {
  font-size:11px;
  padding:12px}
.team-signoff {
  gap:10px}
.team-signoff strong {
  font-size:11px}
.team-signoff .avatar-pair>span {
  width:42px;
  height:42px}
.faq-layout {
  gap:40px;
  grid-template-columns:.7fr 1.3fr}
.callout {
  padding:35px;
  gap:30px}
.callout h2 {
  font-size:38px}
.callout-human p {
  font-size:15px}
.callout-human .avatar-pair>span {
  width:70px;
  height:70px}
.footer-links {
  gap:35px}
.footer-copy {
  font-size:25px}
.footer-top {
  gap:35px}
.workshop-hero-grid {
  grid-template-columns:1fr;
  gap:45px}
.workshop-hero h1 {
  font-size:65px}
.workshop-note {
  max-width:550px;
  transform:rotate(1deg)}
.takeaways-layout {
  gap:40px}
.team-grid {
  grid-template-columns:repeat(3,1fr)}
.implementation-layout {
  gap:40px}
.implementation-note {
  padding:30px;
  min-height:350px}
.implementation-note h2 {
  font-size:42px}
.contact-layout {
  grid-template-columns:.8fr 1.2fr;
  gap:35px}
.contact-copy h1 {
  font-size:48px}
.form-row {
  grid-template-columns:1fr;
  gap:0}
.contact-form-wrap {
  padding:25px}
.contact-people {
  align-items:flex-start;
  flex-direction:column}
.contact-copy .hero-copy {
  font-size:15px}
.article-layout {
  grid-template-columns:1fr;
  gap:30px}
.article-toc {
  position:static;
  display:none}
}

@media(max-width:620px) {
  html {
  scroll-padding-top:90px}
.wrap {
  width:calc(100% - 40px)}
h1 {
  font-size:49px}
h2 {
  font-size:36px}
.section {
  padding:60px 0}
.label {
  font-size:9px;
  margin-bottom:16px}
.header-inner {
  min-height:72px}
.brand img {
  width:35px;
  height:35px}
.brand>span {
  font-size:24px}
.brand small {
  font-size:8px}
.menu-toggle {
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:5px;
  width:44px;
  height:44px;
  border:1px solid var(--ink);
  background:var(--paper);
  border-radius:50%}
.menu-toggle span {
  display:block;
  width:17px;
  height:1.5px;
  background:var(--ink);
  transition:transform var(--quick) var(--ease)}
.nav {
  position:absolute;
  top:72px;
  left:0;
  right:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  padding:16px 20px 24px;
  background:var(--paper);
  border-bottom:1px solid var(--ink);
  box-shadow:0 8px 12px #191a1809;
  visibility:hidden;
  opacity:0;
  transform:translateY(-7px);
  transition:opacity var(--quick) var(--ease),transform var(--quick) var(--ease),visibility var(--quick);
  pointer-events:none}
.nav.open {
  visibility:visible;
  opacity:1;
  transform:translateY(0);
  pointer-events:auto}
.nav>a:not(.btn) {
  padding:14px 6px;
  font-size:16px}
.nav>a[aria-current]:after {
  display:none}
.nav>a[aria-current] {
  font-weight:650}
.nav .btn {
  display:inline-flex;
  margin-top:15px;
  align-self:flex-start}
.hero {
  padding:38px 0 30px}
.hero-grid {
  grid-template-columns:1fr;
  gap:30px}
.hero h1 {
  font-size:52px;
  line-height:1.1;
  letter-spacing:-.055em}
.hero-copy {
  font-size:16px;
  margin:23px 0;
  max-width:420px}
.hero .actions {
  gap:9px 20px}
.btn {
  padding:12px 19px;
  font-size:13px;
  gap:18px}
.hero .text-link {
  font-size:12px}
.hero-reassurance {
  font-size:10px;
  max-width:300px;
  margin-top:18px}
.hero-people {
  height:345px;
  max-width:400px;
  width:100%;
  margin:auto}
.hero-harry {
  width:66%;
  height:262px;
  left:7px;
  bottom:15px}
.hero-andrew {
  width:54%;
  height:220px;
  right:0;
  top:7px}
.hero-stamp {
  left:0;
  top:0;
  width:116px;
  height:100px}
.hero-stamp span {
  font-size:14px}
.hero-handnote {
  right:1px;
  bottom:5px;
  font-size:11px}
.hero-handnote svg {
  width:65px}
.person-label {
  font-size:9px;
  padding:7px 28px 7px 10px}
.person-label strong {
  font-size:11px}
.promise-strip .wrap {
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
  padding:17px 0;
  font-size:10px}
.promise-strip span {
  gap:5px}
.promise-strip svg {
  width:14px}
.section-heading {
  display:block;
  margin-bottom:30px}
.section-heading h2 {
  font-size:35px}
.section-heading .section-lead {
  margin-top:22px;
  max-width:100%}
.section-heading .text-link {
  margin-top:12px}
.topic-tabs {
  display:flex;
  width:100%;
  padding:4px;
  gap:0;
  margin-bottom:22px}
.topic-tabs button {
  flex:1;
  padding:10px 5px;
  font-size:10px;
  min-height:44px}
.tab-highlight {
  top:4px;
  bottom:4px}
.example-panels {
  padding:25px 22px;
  border-radius:16px}
.example-panel {
  grid-template-columns:1fr;
  gap:28px;
  min-height:720px;
  align-content:start}
.example-story h3 {
  font-size:29px;
  max-width:300px}
.example-story>p {
  font-size:14px;
  margin-bottom:0}
.mini-steps {
  font-size:13px;
  gap:16px;
  margin:23px 0 12px}
.mini-steps li {
  grid-template-columns:37px 1fr;
  gap:9px}
.example-story .text-link {
  font-size:12px}
.prompt-sheet {
  padding:22px;
  transform:rotate(2deg);
  margin:0 3px 7px}
.prompt-text {
  font-size:20px;
  margin:20px 0}
.prompt-bottom {
  font-size:12px}
.prompt-note {
  font-size:8px}
.journey-steps {
  grid-template-columns:1fr;
  gap:35px;
  margin-top:38px}
.journey-steps li {
  padding-left:85px;
  min-height:95px}
.journey-number {
  position:absolute;
  left:0;
  top:0;
  width:64px;
  height:61px;
  margin:0}
.journey-number>span {
  font-size:20px}
.journey-steps li:not(:last-child):after {
  top:74px;
  bottom:-22px;
  left:32px;
  right:auto;
  width:1px;
  border-left:1px dashed #75845e;
  border-top:0}
.journey-steps h3 {
  font-size:23px;
  max-width:240px;
  margin:0 0 11px}
.journey-steps p {
  font-size:13px;
  max-width:none}
.people-layout {
  grid-template-columns:1fr;
  gap:52px}
.people-photo {
  margin:0 10px 0 3px}
.people-photo>img {
  aspect-ratio:1.16}
.people-copy h2 {
  font-size:36px}
.people-copy>p:not(.label) {
  font-size:15px}
.team-signoff strong {
  font-size:13px}
.team-signoff .avatar-pair>span {
  width:50px;
  height:50px}
.photo-note {
  right:-8px;
  font-size:12px}
.work-grid {
  grid-template-columns:1fr;
  gap:38px}
.work-image {
  aspect-ratio:1.65}
.work-info {
  padding-top:20px;
  gap:15px}
.work-info h3 {
  font-size:28px}
.work-info p:not(.label) {
  font-size:13px}
.faq-layout {
  grid-template-columns:1fr;
  gap:28px}
.faq-layout h2 br {
  display:none}
.faq-layout .section-lead {
  margin:18px 0 4px}
.t-acc-head {
  padding:21px 0;
  font-size:16px;
  gap:25px}
.t-acc-panel p {
  font-size:14px;
  padding-right:10px}
.cta-section {
  padding-top:0}
.callout {
  grid-template-columns:1fr;
  padding:30px 25px;
  gap:35px;
  border-radius:18px}
.callout h2 {
  font-size:36px}
.callout-copy>p:not(.label) {
  font-size:14px;
  margin:22px 0}
.callout-human {
  border-top:1px solid #c5b8d5;
  padding-top:25px}
.callout-human .avatar-pair>span {
  width:56px;
  height:56px}
.callout-human p {
  font-size:14px;
  margin:15px 0 10px}
.footer {
  padding:45px 0 25px}
.footer-top {
  flex-direction:column;
  gap:32px}
.footer-copy {
  font-size:29px;
  margin-top:25px}
.footer-location {
  max-width:none}
.footer-links {
  gap:36px;
  justify-content:space-between}
.footer-links>div {
  font-size:11px}
.footer-bottom {
  margin-top:35px;
  gap:20px;
  font-size:9px}
.page-hero {
  padding:45px 0 15px}
.page-title {
  font-size:46px}
.intro {
  font-size:16px;
  margin:24px 0}
.page-section {
  padding:25px 0 60px}
.workshop-hero {
  padding:40px 0 60px}
.workshop-hero h1 {
  font-size:49px}
.workshop-hero-grid {
  gap:40px}
.workshop-hero .actions {
  gap:10px}
.workshop-note {
  padding:28px 23px}
.workshop-note h2 {
  font-size:30px}
.workshop-note li {
  font-size:12px}
.takeaways-layout {
  grid-template-columns:1fr;
  gap:32px}
.takeaway-list h3 {
  font-size:23px}
.takeaway-list p {
  font-size:14px}
.about-story {
  padding-top:10px}
.about-photo img {
  aspect-ratio:1;
  object-fit:cover}
.about-copy {
  grid-template-columns:1fr;
  gap:8px;
  padding-top:40px}
.about-copy h2 {
  font-size:33px}
.about-copy p:not(.label) {
  font-size:15px}
.team-section {
  margin-bottom:60px}
.team-grid {
  grid-template-columns:1fr 1fr;
  gap:30px 18px}
.team-member h3 {
  font-size:19px;
  line-height:1.2}
.team-member p {
  font-size:11px}
.member-photo {
  border-radius:90px 90px 12px 12px}
.implementation-layout {
  grid-template-columns:1fr;
  gap:35px}
.implementation-note {
  min-height:320px}
.implementation-note h2 {
  font-size:46px}
.project-row {
  margin-top:35px;
  gap:15px}
.project-row p {
  font-size:14px}
.contact-section {
  padding:40px 0 60px}
.contact-layout {
  grid-template-columns:1fr;
  gap:35px}
.contact-copy h1 {
  font-size:52px}
.contact-copy h1 br {
  display:none}
.contact-copy .hero-copy {
  font-size:16px}
.contact-people {
  flex-direction:row;
  align-items:center;
  margin:23px 0}
.contact-next {
  display:none}
.contact-direct {
  margin-top:24px}
.contact-direct>a:not(.text-link) {
  display:none}
.contact-direct .text-link {
  margin-bottom:0}
.contact-form-wrap {
  padding:25px 20px}
.form h2,.draft-result h2 {
  font-size:28px}
.form-row {
  grid-template-columns:1fr}
.form label {
  font-size:13px}
input,select,textarea {
  font-size:16px}
.form .hint {
  font-size:12px}
.form-privacy {
  font-size:10px}
.library-section {
  padding-top:10px}
.library-tools {
  display:block;
  margin-bottom:10px}
.library-tools input {
  font-size:13px;
  padding:14px}
.library-tools>p {
  margin:16px 0}
.article-row {
  padding:25px 0;
  gap:18px;
  align-items:flex-start}
.article-row h2 {
  font-size:22px}
.article-row p {
  font-size:13px}
.round-arrow {
  width:36px;
  height:36px}
.round-arrow svg {
  width:17px}
.article-hero .page-title {
  font-size:37px;
  line-height:1.12}
.prose {
  font-size:16px;
  line-height:1.8}
.prose h2 {
  font-size:29px;
  margin-top:35px}
.prose h3 {
  font-size:23px}
}

@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto}
*,*:before,*:after {
  animation:none!important;
  transition:none!important}
.btn:hover,.btn:active,.hero-person:hover,.work-card:hover img,.round-arrow,.text-link:hover svg {
  transform:none}
.hero-harry,.hero-andrew {
  transform:none}
}

/* Stack example panels in one grid cell so a selection never moves the next section. */
.example-panels { display: grid; }
.example-panel { grid-area: 1 / 1; }
.example-panel[hidden] { display: grid !important; visibility: hidden; pointer-events: none; }
@media(max-width:620px) {
  .hero h1 { font-size:clamp(42px,13.3vw,52px); }
  .workshop-hero h1 { font-size:clamp(40px,12.6vw,49px); }
}
/* Real photo cutouts: monochrome foreground with no recolouring of the background. */
.portrait.cutout { filter: grayscale(1); }
.member-photo .portrait.cutout { object-fit:contain; object-position:center bottom; }
.avatar-pair .portrait.cutout { object-position:center top; }
@media(max-width:620px) {
  .hero-stamp { width:100px; height:86px; }
  .hero-stamp span { font-size:12px; }
}

/* A playful but usable team explorer. */
.team-controls { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px 24px; margin:-12px 0 24px; }
.team-filters { display:flex; flex-wrap:wrap; gap:8px; }
.team-filter, .team-shuffle { min-height:44px; border:1px solid var(--ink); border-radius:99px; padding:9px 17px; background:transparent; font-size:13px; font-weight:550; transition:background-color 160ms var(--ease), transform 160ms var(--ease), box-shadow 160ms var(--ease); }
.team-filter[aria-pressed=true] { background:var(--ink); color:var(--paper); }
.team-shuffle { display:inline-flex; align-items:center; gap:9px; background:var(--paper); }
.team-shuffle svg { width:18px; height:18px; }
.team-shuffle:disabled { opacity:.48; cursor:not-allowed; }
.team-filter:active, .team-shuffle:not(:disabled):active { transform:scale(.97); }
.team-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.team-member .member-photo { position:relative; isolation:isolate; transition:transform 220ms var(--ease), box-shadow 220ms var(--ease); }
.team-member .member-photo .portrait { position:relative; z-index:1; transition:transform 220ms var(--ease); }
.member-sparkle { position:absolute; z-index:2; top:13%; right:12%; font-size:34px; line-height:1; color:var(--ink); opacity:0; transform:scale(.7) rotate(-25deg); transition:opacity 180ms var(--ease), transform 220ms var(--ease); pointer-events:none; }
@media(hover:hover) {
  .team-filter:not([aria-pressed=true]):hover, .team-shuffle:not(:disabled):hover { background:var(--lime); box-shadow:0 3px 0 var(--ink); transform:translateY(-2px); }
  .team-member:hover .member-photo { transform:translateY(-4px) rotate(-1deg); box-shadow:0 5px 0 var(--ink); }
  .team-member:hover .member-photo .portrait { transform:scale(1.035); }
  .team-member:hover .member-sparkle { opacity:1; transform:scale(1) rotate(0); }
}
@media(max-width:620px) {
  .team-controls { margin:0 0 26px; gap:16px; }
  .team-filters { gap:7px; }
  .team-filter, .team-shuffle { padding:9px 14px; font-size:12px; }
  .member-sparkle { font-size:25px; }
}
@media(prefers-reduced-motion:reduce) {
  .team-filter, .team-shuffle, .team-member .member-photo, .team-member .member-photo .portrait, .member-sparkle { transition:none; }
  .team-filter:hover, .team-shuffle:hover, .team-member:hover .member-photo, .team-member:hover .member-photo .portrait, .team-member:hover .member-sparkle { transform:none; }
}
@media(max-width:620px) {
  .team-filter { padding-inline:10px; }
}

/* Bring the full team into the introduction and shared sign-offs. */
.hero-team { position:absolute; inset:8px 0; display:flex; align-items:center; padding:12px; border-radius:24px; background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px); background-size:32px 32px; }
.hero-team-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; width:100%; }
.hero-team-person { position:relative; display:block; overflow:hidden; aspect-ratio:.82; border:1px solid var(--ink); border-radius:90px 90px 14px 14px; background:var(--purple-soft); box-shadow:0 3px 0 var(--ink); transition:transform 220ms var(--ease),box-shadow 220ms var(--ease); }
.hero-team-person.tone-1 { background:#f4c29f; }
.hero-team-person.tone-2 { background:var(--lime); }
.hero-team-person.tone-3 { background:#e8cbea; }
.hero-team-person:nth-child(even) { transform:translateY(13px); }
.portrait-thumb { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; }
.portrait-thumb.original { mix-blend-mode:multiply; filter:grayscale(1); }
.portrait-thumb.cutout { filter:grayscale(1); object-fit:contain; object-position:center bottom; }
.hero-team-name { position:absolute; left:7px; right:7px; bottom:7px; padding:4px 5px; border-radius:5px; background:var(--paper); font-size:11px; line-height:1.3; text-align:center; font-weight:600; }
.hero-team-invite { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:13px; align-self:center; aspect-ratio:1; border:1px solid var(--ink); border-radius:50%; background:var(--lime); text-align:center; font-size:16px; line-height:1.15; letter-spacing:-.03em; font-weight:600; transition:transform 220ms var(--ease); }
.hero-team-invite svg { width:21px; height:21px; }
.avatar-pair>span:nth-child(4n+3) { background:var(--lime); }
.avatar-pair>span:nth-child(4n) { background:#e8cbea; }
.avatar-pair>span:nth-child(4n+1) { background:var(--purple-soft); }
.avatar-pair>span:nth-child(4n+2) { background:#f4c29f; }
.callout-human .avatar-pair>span { width:60px; height:60px; }
@media(hover:hover) {
  .hero-team:hover .hero-team-person:nth-child(odd) { transform:translateY(-3px); }
  .hero-team:hover .hero-team-person:nth-child(even) { transform:translateY(9px); }
  .hero-team:hover .hero-team-invite { transform:rotate(-7deg); }
}
@media(max-width:850px) {
  .hero-team { padding:8px; }
  .hero-team-grid { gap:8px; }
  .hero-team-name { font-size:9px; left:4px; right:4px; bottom:4px; }
  .hero-team-invite { font-size:12px; gap:7px; }
  .hero-team-invite svg { width:16px; height:16px; }
  .callout-human .avatar-pair>span { width:48px; height:48px; }
}
@media(max-width:620px) {
  .hero-people { height:330px; }
  .hero-team { inset:0; }
  .hero-team-person { border-radius:60px 60px 10px 10px; }
  .hero-team-name { font-size:10px; }
  .hero-team-invite { font-size:13px; }
  .avatar-pair>span { width:45px; height:45px; }
  .team-signoff .avatar-pair>span, .callout-human .avatar-pair>span { width:45px; height:45px; }
}
@media(prefers-reduced-motion:reduce) {
  .hero-team-person, .hero-team-invite { transition:none; }
  .hero-team-person:nth-child(even), .hero-team:hover .hero-team-person:nth-child(even) { transform:translateY(13px); }
  .hero-team:hover .hero-team-person:nth-child(odd), .hero-team:hover .hero-team-invite { transform:none; }
}
@media(max-width:620px) {
  .hero-people { height:auto; }
  .hero-team { position:relative; inset:auto; display:block; padding:12px 10px 24px; }
  .hero-team-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  .hero-team-name { font-size:11px; }
  .team-signoff, .note-signoff, .contact-people { flex-wrap:wrap; }
}

/* Brainwave-inspired site navigation. */
.header { background:rgba(251,250,246,.97); }
.header-inner { min-height:92px; gap:24px; }
.header .brand { flex-shrink:0; }
.nav { gap:14px; }
.nav-links { display:flex; align-items:center; gap:2px; padding:5px; border:1px solid var(--rule); border-radius:999px; background:#f1f0eb; }
.nav-links>a { display:flex; align-items:center; justify-content:center; min-height:40px; padding:9px 14px; border:1px solid transparent; border-radius:999px; font-size:13px; font-weight:550; white-space:nowrap; transition:background-color 160ms var(--ease),border-color 160ms var(--ease),transform 160ms var(--ease); }
.nav-links>a[aria-current=page] { background:var(--pink); border-color:var(--ink); }
.nav .nav-cta { display:inline-flex; background:var(--lime); color:var(--ink); border:1.5px solid var(--ink); box-shadow:0 3px 0 var(--ink); min-height:48px; padding:6px 7px 6px 18px; gap:14px; }
.nav-cta-arrow { display:grid; place-items:center; flex-shrink:0; width:32px; height:32px; border-radius:50%; background:var(--ink); color:var(--paper); }
.nav-cta-arrow svg { width:17px; height:17px; }
@media(hover:hover) {
  .nav-links>a:not([aria-current=page]):hover { background:var(--paper); border-color:var(--rule); text-decoration:none; }
  .nav .nav-cta:hover { background:#dff9a7; box-shadow:0 5px 0 var(--ink); }
}
@media(min-width:901px) and (max-width:1100px) {
  .nav-links>a { padding-inline:10px; font-size:12px; }
  .nav { gap:8px; }
  .nav .nav-cta { gap:8px; padding-left:13px; font-size:12px; }
}
@media(max-width:900px) {
  .header-inner { min-height:76px; }
  .menu-toggle { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:46px; height:46px; border:1.5px solid var(--ink); background:var(--lime); border-radius:50%; box-shadow:0 3px 0 var(--ink); }
  .menu-toggle span { display:block; width:18px; height:1.5px; background:var(--ink); transition:transform 160ms var(--ease); }
  .menu-toggle[aria-expanded=true] { background:var(--pink); }
  .js .nav { position:absolute; top:calc(100% + 9px); left:28px; right:28px; display:flex; flex-direction:column; align-items:stretch; gap:16px; max-height:calc(100dvh - 100px); overflow-y:auto; padding:18px; background:var(--paper); border:1px solid var(--ink); border-radius:20px; box-shadow:0 4px 0 var(--ink); visibility:hidden; opacity:0; transform:translateY(-7px); transition:opacity 160ms var(--ease),transform 160ms var(--ease),visibility 160ms; pointer-events:none; }
  .js .nav.open { visibility:visible; opacity:1; transform:translateY(0); pointer-events:auto; }
  .nav-links { flex-direction:column; align-items:stretch; gap:3px; padding:0; background:none; border:0; border-radius:0; }
  .nav-links>a { justify-content:flex-start; min-height:48px; padding:11px 16px; font-size:15px; }
  .nav .nav-cta { display:flex; align-self:stretch; justify-content:space-between; min-height:50px; margin:0; padding-left:18px; font-size:14px; }
  html:not(.js) .header-inner { flex-wrap:wrap; padding-block:14px; }
  html:not(.js) .menu-toggle { display:none; }
  html:not(.js) .nav { position:static; display:flex; flex-direction:column; align-items:stretch; gap:12px; flex-basis:100%; visibility:visible; opacity:1; transform:none; pointer-events:auto; padding:0; border:0; box-shadow:none; }
}
@media(max-width:620px) {
  .header-inner { min-height:72px; }
  .js .nav { left:20px; right:20px; }
}
@media(prefers-reduced-motion:reduce) {
  .nav-links>a, .nav .nav-cta, .menu-toggle, .menu-toggle span, .js .nav { transition:none; }
  .nav .nav-cta:hover { transform:none; }
}
@media(max-width:900px) {
  html:not(.js) .header { position:relative; }
}

/* Editorial image direction: portraits belong in the team roster. */
.editorial-image { margin:0; }
.editorial-image img { display:block; width:100%; height:auto; object-fit:cover; border-radius:20px; }
.editorial-image figcaption { font-size:13px; color:var(--muted); margin-top:14px; }
.hero-editorial { position:relative; min-width:0; padding:20px 0 35px; }
.hero-editorial .editorial-image img { aspect-ratio:1.12; object-fit:cover; border-radius:90px 20px 20px 20px; }
.hero-editorial .editorial-image figcaption { padding-left:4px; }
.editorial-tag { display:flex; align-items:center; gap:20px; position:absolute; right:16px; bottom:69px; padding:13px 18px; background:var(--lime); border:1px solid var(--ink); border-radius:999px; font-size:10px; letter-spacing:.07em; box-shadow:0 3px 0 var(--ink); }
.workshop-note { transform:none; overflow:hidden; }
.workshop-note .editorial-image { margin:-34px -34px 25px; }
.workshop-note .editorial-image img { border-radius:0; aspect-ratio:2; object-fit:cover; }
.workshop-note .note-tab { position:static; display:inline-block; margin-bottom:16px; transform:none; }
.workshop-note h2 { font-size:clamp(25px,2.4vw,34px); }
.people-photo>img { filter:none; }
.team-signoff { margin:24px 0; }
.callout-human { display:flex; flex-direction:column; justify-content:center; }
.callout-human .label { font-size:11px; }
.implementation-art { min-width:0; }
.implementation-art img { aspect-ratio:1.12; }
@media(max-width:900px) {
 .hero-editorial { max-width:650px; width:100%; margin:auto; }
 .hero-editorial .editorial-image img { aspect-ratio:1.5; border-radius:50px 18px 18px 18px; }
 .workshop-note .editorial-image { margin:-28px -28px 24px; }
}
@media(max-width:540px) {
 .hero-editorial { padding-top:0; padding-bottom:10px; }
 .editorial-tag { position:static; width:fit-content; margin-top:14px; font-size:9px; padding:10px 14px; }
 .workshop-note .editorial-image { margin:-24px -24px 22px; }
 .editorial-image figcaption { font-size:12px; }
}
.editorial-tag .icon { width:18px; height:18px; flex:0 0 18px; }
.editorial-tag { white-space:nowrap; }
.office-story { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.office-story figure { margin:0; min-width:0; }
.office-story .office-wide { grid-column:1/-1; }
.office-story img { display:block; width:100%; aspect-ratio:1.7; object-fit:cover; border-radius:18px; }
.office-story .office-wide img { aspect-ratio:2.4; object-position:center 42%; }
.office-story figcaption,.work-detail figcaption { margin-top:12px; color:var(--muted); font-size:13px; }
.work-detail { margin:32px 0 0; max-width:430px; }
.work-detail img { width:100%; display:block; aspect-ratio:1.65; object-fit:cover; border-radius:18px 60px 18px 18px; }
@media(max-width:600px) {
 .office-story { gap:18px; }
 .office-story .office-wide img { aspect-ratio:1.5; }
 .office-story img { aspect-ratio:1.1; }
 .office-story figcaption { font-size:11px; }
 .work-detail { max-width:none; }
}

/* Workshop opening: let the promise lead, with supporting detail below. */
.workshop-opening { padding:72px 0 56px; }
.workshop-opening h1 { max-width:1200px; margin:28px 0 34px; font-size:clamp(42px,6.2vw,88px); line-height:1.12; letter-spacing:-.055em; }
.workshop-question,.workshop-answer { display:block; }
.workshop-answer { margin-top:10px; }
.workshop-opening .highlight-word { display:inline-block; }
.workshop-introduction { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.workshop-introduction .hero-copy { max-width:570px; margin:0; }
.workshop-introduction .actions { margin:0; flex-shrink:0; flex-direction:column; align-items:flex-start; gap:16px; }
.workshop-grounding { margin-top:48px; padding-top:25px; border-top:1px solid var(--rule); display:grid; grid-template-columns:1fr 1.35fr 1fr; gap:32px; align-items:center; }
.workshop-invitation { font-size:18px; line-height:1.45; margin:0; }
.workshop-invitation strong { font-weight:500; }
.workshop-grounding ul { margin:0; padding:0; list-style:none; display:grid; gap:10px; }
.workshop-grounding li { display:flex; align-items:center; gap:9px; font-size:12px; }
.workshop-grounding .icon { width:16px; height:16px; flex:0 0 16px; }
.workshop-agreement { color:var(--muted); font-size:12px; line-height:1.6; margin:0; justify-self:end; }
@media(max-width:900px) {
 .workshop-opening { padding-top:50px; }
 .workshop-introduction { align-items:flex-start; gap:25px; }
 .workshop-grounding { grid-template-columns:1fr 1.4fr; }
 .workshop-agreement { grid-column:1/-1; justify-self:start; }
 .workshop-agreement br { display:none; }
}
@media(max-width:600px) {
 .workshop-opening { padding:38px 0 38px; }
 .workshop-opening h1 { font-size:clamp(38px,10.7vw,58px); margin:24px 0; }
 .workshop-answer { margin-top:14px; }
 .workshop-introduction { display:block; }
 .workshop-introduction .actions { margin-top:26px; gap:20px; }
 .workshop-grounding { margin-top:36px; padding-top:23px; grid-template-columns:1fr; gap:20px; }
 .workshop-agreement { grid-column:auto; }
}

/* Spacing after copy cleanup. */
.copy-callout { display:flex; align-items:center; justify-content:space-between; gap:32px; }
.callout-actions { display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.callout-actions>a:not(.btn) { font-size:13px; text-decoration:underline; text-underline-offset:4px; }
.workshop-grounding { grid-template-columns:1fr 1fr; }
.workshop-grounding .workshop-invitation { display:flex; align-items:center; gap:9px; font-size:13px; }
.workshop-grounding .workshop-agreement { grid-column:auto; }
.contact-direct { margin-top:32px; }
@media(max-width:620px) {
 .contact-section .contact-direct>a[href^="mailto:"],
 .contact-section .contact-direct>a[href^="tel:"] { display:flex; align-items:center; min-height:44px; font-size:14px; text-decoration:underline; text-underline-offset:3px; }
}
@media(max-width:600px) {
 .copy-callout { flex-direction:column; align-items:flex-start; gap:25px; }
 .workshop-grounding { grid-template-columns:1fr; gap:12px; }
}

/* Implementation: promise, connected workflow, capabilities, delivery, evidence. */
.implementation-opening { padding:72px 0 60px; }
.implementation-opening h1 { font-size:clamp(44px,6.1vw,86px); max-width:1200px; line-height:1.12; margin:26px 0 36px; letter-spacing:-.055em; }
.implementation-opening-bottom { display:flex; justify-content:space-between; align-items:center; gap:30px; }
.implementation-opening-bottom p { max-width:550px; font-size:20px; color:var(--muted); margin:0; }
.implementation-jump { margin-top:24px; }
.system-section { background:var(--panel); padding:55px 0; border-block:1px solid var(--rule); }
.system-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:30px; }
.system-heading>p { color:var(--muted); font-size:14px; }
.system-options { display:flex; gap:8px; flex-wrap:wrap; }
.system-options button { font:inherit; font-size:13px; background:var(--paper); color:var(--ink); border:1px solid var(--rule); border-radius:999px; padding:12px 20px; cursor:pointer; transition:background 160ms ease-out,transform 160ms ease-out; }
.system-options button[aria-pressed=true] { background:var(--purple-soft); border-color:var(--ink); }
.system-options button:active { transform:scale(.98); }
.system-map { width:100%; display:block; margin:25px 0 0; overflow:visible; }
.system-map rect { stroke:var(--ink); stroke-width:1.3; }
.system-map text { font:500 20px 'DM Sans',sans-serif; fill:var(--ink); text-anchor:middle; }
.system-map .map-small { font-size:15px; }
.system-track { stroke:var(--ink); stroke-width:2; stroke-dasharray:5 6; }
.system-progress { stroke:var(--purple); stroke-width:5; stroke-dasharray:1; }
.system-caption { font-size:17px; margin:4px 0 12px; min-height:2.8em; max-width:650px; }
.system-disclaimer { color:var(--muted); font-size:11px; margin:0; }
.implementation-service { display:grid; grid-template-columns:60px 1fr 280px; align-items:center; gap:30px; border-top:1px solid var(--rule); padding:35px 0; }
.service-index { align-self:start; padding-top:8px; font-size:13px; color:var(--muted); }
.implementation-service h3 { font-size:clamp(26px,3vw,42px); margin:0 0 16px; }
.implementation-service p { max-width:520px; margin:8px 0; }
.implementation-service .service-detail { color:var(--muted); font-size:13px; }
.service-sketch { width:100%; stroke:var(--ink); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.delivery-section { background:var(--lime); }
.judgement-layout { display:grid; grid-template-columns:1.1fr 1fr; gap:80px; align-items:center; }
.judgement-note { background:var(--purple-soft); padding:45px; border-radius:18px 70px 18px 18px; }
.judgement-note h2 { font-size:clamp(30px,3vw,44px); margin:20px 0; }
.judgement-note p { margin:0; max-width:360px; }
.judgement-checks>div { border-bottom:1px solid var(--rule); padding:22px 0 22px 38px; position:relative; }
.judgement-checks span { position:absolute; left:0; top:27px; color:var(--muted); font-size:11px; }
.judgement-checks h3 { font-size:21px; margin:0 0 8px; }
.judgement-checks p { font-size:14px; color:var(--muted); margin:0; }
@media(max-width:900px) {
 .implementation-service { grid-template-columns:35px 1fr 180px; gap:18px; }
 .judgement-layout { gap:30px; }
 .judgement-note { padding:28px; }
}
@media(max-width:600px) {
 .implementation-opening { padding:38px 0; }
 .implementation-opening h1 { font-size:clamp(36px,10vw,56px); }
 .implementation-opening-bottom,.system-heading { display:block; }
 .implementation-opening-bottom p { font-size:17px; margin-bottom:24px; }
 .system-section { padding:36px 0; }
 .system-options { gap:6px; }
 .system-options button { padding:10px 12px; font-size:11px; }
 .system-map { min-height:140px; }
 .system-map text { font-size:24px; }
 .system-map .map-small { font-size:19px; }
 .system-caption { font-size:15px; min-height:4.4em; }
 .implementation-service { grid-template-columns:25px 1fr; gap:12px; padding:28px 0; }
 .implementation-service .service-sketch { grid-column:2; width:min(190px,100%); justify-self:start; margin-block:-6px -12px; }
 .implementation-service h3 { font-size:29px; }
 .implementation-service p { font-size:15px; }
 .implementation-service .service-detail { font-size:12px; }
 .judgement-layout { grid-template-columns:1fr; gap:18px; }
}
@media (min-width:560px) and (max-width:600px) {
 .implementation-service { grid-template-columns:25px minmax(0,1fr) 150px; }
 .implementation-service .service-sketch { grid-column:3; grid-row:1; width:100%; margin:0; }
}
.system-mobile { display:none; }
@media(max-width:600px) {
 .system-map { display:none; }
 .system-mobile { display:grid; grid-template-columns:1fr; list-style:none; padding:0; margin:25px 0; gap:19px; }
 .system-mobile li { border:1px solid var(--ink); border-radius:14px; padding:15px 20px; text-align:center; position:relative; background:var(--paper); font-size:14px; }
 .system-mobile li:nth-child(2) { background:var(--purple-soft); }
 .system-mobile li:nth-child(3) { background:var(--lime); border-radius:999px; }
 .system-mobile li:nth-child(4) { background:var(--pink); }
 .system-mobile li:not(:last-child)::after { content:'↓'; position:absolute; top:100%; left:calc(50% - 5px); line-height:19px; }
}

/* Headings stand on their own without introductory labels. */
.workshop-opening h1, .implementation-opening h1 { margin-top:0; }
.judgement-note h2 { margin-top:0; }
.about-copy { grid-template-columns:1fr; gap:0; }

/* Hands-on implementation story. Keep all motion finite and interruptible. */
.implementation-hero-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:70px; align-items:center; }
.implementation-interactive { padding:70px 0 80px; }
.implementation-interactive h1 { font-size:clamp(46px,5.3vw,76px); line-height:1.07; margin:0 0 30px; }
.implementation-hero-copy>p { max-width:490px; color:var(--muted); font-size:19px; line-height:1.65; }
.implementation-hero-copy .actions { gap:20px; flex-wrap:wrap; }
.implementation-hero-copy .implementation-reassurance { display:flex; align-items:center; gap:8px; font-size:13px; margin:25px 0 0; }
.implementation-reassurance svg { width:18px; height:18px; flex-shrink:0; }
.connection-playground { background:var(--purple-soft); border:1px solid var(--ink); border-radius:24px; padding:24px 30px 20px; box-shadow:0 6px 0 var(--ink); position:relative; }
.connection-toolbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.connection-demo-label { font-size:14px; font-weight:550; }
.connection-spark { font-size:34px; line-height:1; }
.connection-switch { display:flex; background:rgba(251,250,246,.55); border:1px solid rgba(25,26,24,.16); padding:4px; border-radius:999px; gap:4px; }
.connection-switch button { display:flex; gap:6px; justify-content:center; align-items:center; flex:1; border:1px solid transparent; background:transparent; border-radius:999px; padding:9px 10px; font-size:12px; transition:background var(--quick) var(--ease),transform var(--quick) var(--ease); }
.connection-switch button[aria-pressed=true] { background:var(--paper); border-color:var(--ink); box-shadow:0 2px 0 var(--ink); }
.connection-switch button[data-connection-mode=connected][aria-pressed=true] { background:var(--lime); }
.connection-switch button:hover { background:var(--paper); }
.connection-switch button:active,.flow-tabs button:active { transform:scale(.98); }
.connection-switch svg { width:16px; height:16px; }
.connection-scene { position:relative; display:grid; gap:14px; padding:30px 24px 25px; }
.connection-spine { position:absolute; width:2px; top:52px; bottom:52px; left:50%; background:var(--ink); transform:scaleY(0); transform-origin:top; transition:transform 280ms var(--ease); }
.connection-card { position:relative; display:flex; align-items:center; gap:13px; padding:12px 14px; min-height:67px; border:1px solid var(--ink); border-radius:12px; background:var(--paper); box-shadow:0 3px 0 rgba(25,26,24,.12); font-size:13px; font-weight:550; transition:transform 280ms var(--ease),box-shadow 220ms var(--ease); }
.connection-card small { display:block; font-size:11px; font-weight:400; color:var(--muted); margin-top:2px; }
.connection-card-0 { transform:translateX(-15px) rotate(-4deg); }
.connection-card-1 { transform:translateX(15px) rotate(3deg); }
.connection-card-2 { transform:translateX(-13px) rotate(-2deg); }
.connection-card-3 { transform:translateX(10px) rotate(3deg); }
.connection-logo { width:38px; height:38px; flex-shrink:0; display:grid; place-items:center; border-radius:9px; background:var(--panel); }
.connection-logo img { width:23px; height:23px; object-fit:contain; }
.logo-gmail { background:#fce1de; }
.logo-googlesheets { background:#def0d5; }
.logo-googlecalendar { background:#dee8fb; }
.logo-databrain { background:var(--lime); }
.connection-check { opacity:0; transform:scale(.95); margin-left:auto; background:var(--lime); border-radius:50%; padding:3px; transition:opacity 220ms var(--ease),transform 220ms var(--ease); }
.connection-check svg { width:16px; height:16px; }
[data-mode=connected] .connection-card { transform:none; box-shadow:0 3px 0 rgba(25,26,24,.18); }
[data-mode=connected] .connection-spine { transform:scaleY(1); }
[data-mode=connected] .connection-check { opacity:1; transform:none; }
[data-mode=connected] .connection-spark { transform:rotate(90deg); }
.connection-spark { transition:transform 280ms var(--ease); }
.connection-caption { min-height:76px; text-align:center; }
.connection-caption strong { font-weight:550; font-size:17px; letter-spacing:-.025em; }
.connection-caption p { font-size:12px; margin:6px auto 0; max-width:320px; }
.connection-footnote { font-size:10px; text-align:center; margin:10px 0 0; color:var(--muted); }
.flow-section { background:var(--panel); border-block:1px solid var(--rule); padding:64px 0; }
.flow-section h2 { margin-bottom:28px; }
.flow-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px; }
.flow-tabs button { background:transparent; border:1px solid var(--rule); border-radius:999px; padding:10px 20px; min-height:44px; font-size:14px; transition:background var(--quick) var(--ease),transform var(--quick) var(--ease); }
.flow-tabs button:hover { border-color:var(--ink); }
.flow-tabs button[aria-selected=true] { background:var(--ink); border-color:var(--ink); color:var(--paper); }
/* Share a grid cell to keep the page steady when switching examples. */
.flow-panels { display:grid; }
.flow-panels>[role=tabpanel] { grid-area:1/1; min-width:0; }
.flow-panels>[hidden] { display:block!important; visibility:hidden; pointer-events:none; }
.flow-outcome { font-size:clamp(23px,2.4vw,32px); line-height:1.2; max-width:750px; margin:0 0 24px; }
.flow-overview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; padding:0; margin:0; border:1px solid var(--rule); border-radius:20px; background:var(--paper); }
.flow-stage { position:relative; padding:28px 30px 32px; }
.flow-stage+ .flow-stage { border-left:1px solid var(--rule); }
.flow-stage:nth-child(2) { background:var(--purple-soft); }
.flow-stage-number { display:block; margin-bottom:24px; font-size:12px; color:var(--muted); }
.flow-stage:not(:last-child) .flow-stage-arrow { position:absolute; right:-16px; top:24px; z-index:1; display:grid; place-items:center; width:32px; height:32px; border:1px solid var(--rule); border-radius:50%; background:var(--paper); font-size:18px; }
.flow-stage-arrow::after { content:'→'; }
.flow-stage:last-child .flow-stage-arrow { display:none; }
.flow-stage h4 { margin:0 0 12px; font-weight:500; font-size:21px; line-height:1.25; letter-spacing:-.025em; }
.flow-stage p { margin:0; font-size:16px; line-height:1.55; max-width:32ch; }
.flow-footer { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:24px; }
.flow-approval { display:flex; gap:9px; align-items:center; margin:0; font-size:14px; }
.flow-approval svg { width:18px; height:18px; flex-shrink:0; }
.flow-footer .text-link { font-size:14px; }
.flow-disclaimer { margin:20px 0 0; font-size:12px; color:var(--muted); }
/* Without scripting, show every complete example and omit inactive controls. */
html:not(.js) .flow-tabs { display:none; }
html:not(.js) .flow-panels { display:block; }
html:not(.js) .flow-panels>[hidden] { visibility:visible; pointer-events:auto; }
html:not(.js) .flow-panels>[role=tabpanel]+[role=tabpanel] { margin-top:40px; }
.service-example { margin-top:18px; max-width:520px; }
.service-example summary { display:flex; align-items:center; justify-content:space-between; width:max-content; gap:20px; cursor:pointer; list-style:none; font-size:13px; border-bottom:1px solid var(--rule); padding-bottom:5px; }
.service-example summary::-webkit-details-marker { display:none; }
.service-example summary:focus-visible { outline:3px solid #5f55be; outline-offset:5px; }
.service-example summary span { font-size:20px; line-height:1; transition:transform 220ms var(--ease); }
.service-example[open] summary span { transform:rotate(45deg); }
.service-example p { font-size:14px; color:var(--muted); padding-top:10px; }
.implementation-judgement + .proof-section { padding-top:0; }
.copy-callout>div>p { font-size:16px; margin:20px 0 0; }
@media(max-width:1100px) {
 .implementation-hero-grid { gap:35px; }
 .connection-playground { padding:22px; }
}
@media(max-width:900px) {
 .implementation-hero-grid { grid-template-columns:1fr 1fr; gap:28px; }
 .implementation-interactive h1 { font-size:clamp(40px,5.5vw,60px); }
 .implementation-hero-copy>p { font-size:16px; }
 .implementation-hero-copy .implementation-reassurance { font-size:12px; align-items:flex-start; }
 .connection-playground { padding:18px 15px; }
 .connection-scene { padding-inline:18px; }
 .connection-card { padding:10px; gap:9px; font-size:12px; }
 .connection-logo { width:30px; height:30px; }
 .connection-caption strong { font-size:15px; }
 .connection-switch button { font-size:11px; padding:9px 5px; }
}
@media(max-width:650px) {
 .implementation-interactive { padding:42px 0 60px; }
 .implementation-hero-grid { grid-template-columns:1fr; gap:38px; }
 .implementation-interactive h1 { font-size:clamp(43px,10vw,62px); margin-bottom:23px; }
 .implementation-hero-copy>p { max-width:440px; font-size:17px; }
 .implementation-hero-copy .actions { gap:18px; }
 .implementation-hero-copy .implementation-reassurance { margin-top:22px; }
 .connection-playground { width:100%; max-width:470px; justify-self:center; padding:22px; }
 .connection-switch button { font-size:12px; min-height:42px; }
 .connection-card { min-height:62px; font-size:13px; }
 .connection-scene { padding:26px 18px; gap:13px; }
 .connection-caption { min-height:74px; }
 .connection-caption strong { font-size:17px; }
 .flow-section { padding:52px 0; }
 .flow-tabs { gap:7px; margin-bottom:24px; }
 .flow-overview { grid-template-columns:1fr; }
 .flow-stage { padding:22px 22px 24px 60px; }
 .flow-stage+ .flow-stage { border-left:0; border-top:1px solid var(--rule); }
 .flow-stage-number { position:absolute; left:22px; top:25px; margin:0; }
 .flow-stage:not(:last-child) .flow-stage-arrow { top:auto; bottom:-16px; left:16px; right:auto; }
 .flow-stage-arrow::after { content:'↓'; }
 .flow-stage h4 { font-size:20px; margin-bottom:8px; }
 .flow-stage p { font-size:15px; }
 .flow-outcome { margin-bottom:20px; }
 .flow-footer { align-items:flex-start; flex-direction:column; gap:16px; }
 .flow-approval { font-size:13px; }
 .flow-tabs button { padding:10px 14px; font-size:12px; min-height:44px; }
 .flow-disclaimer { font-size:11px; }
 .service-example summary { min-height:44px; }
 .service-example p { font-size:14px; }
}
@media(prefers-reduced-motion:reduce) {
 .connection-playground *, .flow-explorer *, .service-example summary span { transition:none!important; animation:none!important; }
}

/* Delivery process: the page scrolls normally while the job board sticks and a marker travels the steps. */
.process-layout { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:clamp(40px,6vw,90px); align-items:start; }
.process-steps { position:relative; }
.process-list { list-style:none; margin:0; padding:0; }
.process-step { position:relative; min-height:56vh; padding:0 0 60px 82px; }
.process-step:last-child { min-height:44vh; padding-bottom:0; }
.js .process-step { opacity:.38; transition:opacity var(--arrive) var(--ease); }
.js .process-step[data-passed=true] { opacity:.6; }
.js .process-step[aria-current=step] { opacity:1; }
.process-number { display:inline-flex; align-items:center; height:28px; padding:0 12px; border:1px solid var(--ink); border-radius:999px; background:var(--paper); font-size:12px; font-variant-numeric:tabular-nums; }
.process-step h3 { font-size:clamp(30px,3.2vw,44px); margin:24px 0 14px; }
.process-step p { font-size:17px; max-width:360px; margin:0; }
.process-node { position:absolute; z-index:1; left:15px; top:7px; width:14px; height:14px; border:1.5px solid var(--ink); border-radius:50%; background:var(--lime); transition:background var(--arrive) var(--ease); }
.process-step[data-reached=true] .process-node { background:var(--ink); }
.process-rail, .process-token-track { display:none; position:absolute; left:21px; top:14px; width:2px; pointer-events:none; }
.js .process-rail, .js .process-token-track { display:block; }
.process-rail { background:repeating-linear-gradient(to bottom,rgba(25,26,24,.35) 0 5px,transparent 5px 11px); }
.process-rail-fill { position:absolute; inset:0; background:var(--ink); transform:scaleY(var(--process-progress,0)); transform-origin:top; }
.process-token-track { z-index:2; }
/* Negative block margins let the sticky marker centre on the first and last nodes. */
.process-token { position:sticky; top:calc(var(--process-line,50vh) - 22px); display:grid; place-items:center; width:44px; height:44px; margin:-22px 0 -22px -21px; border:1.5px solid var(--ink); border-radius:50%; background:var(--pink); box-shadow:0 3px 0 var(--ink); font-size:24px; line-height:1; }
.process-token>span { rotate:calc(var(--process-progress,0) * 540deg); }
.process-visual { position:sticky; top:clamp(112px,calc(50vh - 260px),220px); }
.process-stage { background:var(--paper); border:1px solid var(--ink); border-radius:24px; padding:22px 26px 20px; box-shadow:0 6px 0 var(--ink); }
.process-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; font-size:14px; font-weight:550; }
.process-count { font-size:12px; font-weight:450; color:var(--muted); font-variant-numeric:tabular-nums; }
.process-meter { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin:14px 0 0; }
.process-meter span { height:4px; border-radius:4px; background:var(--panel); transition:background var(--arrive) var(--ease); }
[data-process-step="0"] .process-meter span:nth-child(-n+1), [data-process-step="1"] .process-meter span:nth-child(-n+2), [data-process-step="2"] .process-meter span:nth-child(-n+3), [data-process-step="3"] .process-meter span { background:var(--ink); }

.process-board { --piece-h:60px; --px:9cqw; --pw:82cqw; --spread:1; --spine-x:18px; --y0:10px; --gap:14px; --head-top:24px; --head-h:45px; --foot-top:322px; position:relative; height:380px; margin-top:12px; container-type:size; }
[data-process-step="2"] .process-board { --gap:24px; }
[data-process-step="3"] .process-board { --y0:calc(var(--head-top) + var(--head-h) - 1px); --gap:-1px; }
.process-piece { --i:0; position:absolute; top:0; left:0; z-index:1; display:flex; align-items:center; gap:12px; width:var(--pw); height:var(--piece-h); padding:0 12px; border:1px solid var(--ink); border-radius:12px; background:var(--paper); box-shadow:0 3px 0 rgba(25,26,24,.12); font-size:13px; font-weight:550; transform:translate(var(--px),calc(var(--y0) + var(--i) * (var(--piece-h) + var(--gap)))) rotate(0) scale(1); transition:transform 700ms var(--ease) calc(var(--i) * 45ms),border-radius 300ms var(--ease),box-shadow 300ms var(--ease); }
.piece-0 { --sx:1cqw; --sy:3cqh; --sr:-5deg; }
.piece-1 { --i:1; --sx:17cqw; --sy:26cqh; --sr:4deg; }
.piece-2 { --i:2; --sx:3cqw; --sy:50cqh; --sr:-2.5deg; }
.piece-3 { --i:3; --sx:15cqw; --sy:72cqh; --sr:5deg; }
[data-process-step="0"] .process-piece { transform:translate(calc(var(--sx) * var(--spread)),var(--sy)) rotate(var(--sr)) scale(.94); }
[data-process-step="3"] .process-piece { border-radius:0; box-shadow:none; }
[data-process-step="3"] .piece-3 { border-radius:0 0 14px 14px; box-shadow:0 4px 0 var(--ink); }
.piece-name { flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.piece-tags { display:grid; justify-items:end; flex-shrink:0; }
.piece-tags span { grid-area:1/1; padding:4px 10px; border:1px solid transparent; border-radius:999px; font-size:11px; font-weight:500; white-space:nowrap; opacity:0; transform:translateY(4px); transition:opacity var(--arrive) var(--ease),transform var(--arrive) var(--ease); }
.piece-tags span:nth-child(1) { background:color-mix(in srgb,var(--pink) 38%,var(--paper)); }
.piece-tags span:nth-child(2) { background:var(--purple-soft); }
.piece-tags span:nth-child(3) { border-color:var(--ink); background:var(--paper); }
.piece-1 .piece-tags span:nth-child(3), .piece-tags span:nth-child(4) { background:var(--lime); }
[data-process-step="0"] .piece-tags span:nth-child(1), [data-process-step="1"] .piece-tags span:nth-child(2), [data-process-step="3"] .piece-tags span:nth-child(4) { opacity:1; transform:none; }
/* Each test result appears as the pulse reaches its card. */
[data-process-step="2"] .piece-tags span:nth-child(3) { opacity:clamp(0,calc((var(--process-local,1) * 3 - var(--i)) * 4 + 1),1); transform:none; }

.process-spine { position:absolute; left:calc(var(--px) - var(--spine-x)); top:calc(var(--y0) + var(--piece-h) / 2); width:2px; height:calc(3 * (var(--piece-h) + var(--gap))); background:var(--ink); opacity:0; transform:scaleY(0); transform-origin:top; transition:opacity var(--arrive) var(--ease),transform 500ms var(--ease); }
[data-process-step="2"] .process-spine { opacity:1; transform:none; transition-delay:150ms; }
.process-pulse { position:absolute; left:-6px; top:-7px; width:14px; height:14px; border:1.5px solid var(--ink); border-radius:50%; background:var(--pink); translate:0 calc(var(--process-local,0) * 3 * (var(--piece-h) + var(--gap))); }
.process-plan { position:absolute; left:var(--px); width:var(--pw); bottom:4px; display:flex; flex-wrap:wrap; gap:6px; opacity:0; translate:0 10px; transition:opacity var(--arrive) var(--ease),translate 400ms var(--ease); }
.process-plan span { --k:0; display:inline-flex; align-items:center; gap:6px; padding:5px 11px 5px 7px; border:1px dashed var(--ink); border-radius:999px; background:var(--paper); font-size:11px; }
.process-plan span:nth-child(2) { --k:1; }
.process-plan span:nth-child(3) { --k:2; }
.process-plan svg { width:14px; height:14px; padding:1px; border-radius:50%; background:var(--lime); opacity:clamp(.15,calc((var(--process-local,1) * 4 - var(--k)) * 3),1); }
[data-process-step="1"] .process-plan { opacity:1; translate:none; transition-delay:200ms; }
.process-live-head, .process-live-foot { position:absolute; left:var(--px); display:flex; align-items:center; gap:10px; opacity:0; transition:opacity var(--arrive) var(--ease),translate 500ms var(--ease); }
.process-live-head { top:var(--head-top); width:var(--pw); height:var(--head-h); padding:0 14px; border:1px solid var(--ink); border-radius:14px 14px 0 0; background:var(--lime); font-size:14px; font-weight:550; translate:0 12px; }
.process-live-head .connection-spark { font-size:20px; }
.process-live-foot { top:var(--foot-top); padding:6px 14px 6px 8px; border:1px solid var(--ink); border-radius:999px; background:var(--paper); font-size:12px; translate:0 -10px; }
.process-live-foot svg { width:18px; height:18px; padding:2px; border-radius:50%; background:var(--lime); }
[data-process-step="3"] .process-live-head, [data-process-step="3"] .process-live-foot { opacity:1; translate:none; transition-delay:250ms; }
.process-captions { display:grid; margin-top:16px; }
.process-captions p { grid-area:1/1; margin:0; font-size:15px; font-weight:550; letter-spacing:-.02em; opacity:0; transition:opacity var(--arrive) var(--ease); }
[data-process-step="0"] .process-captions p:nth-child(1), [data-process-step="1"] .process-captions p:nth-child(2), [data-process-step="2"] .process-captions p:nth-child(3), [data-process-step="3"] .process-captions p:nth-child(4) { opacity:1; }
.process-disclaimer { margin:48px 0 0; font-size:12px; color:var(--muted); }

@media(min-width:901px) and (max-height:760px) {
 .process-visual { top:104px; }
 .process-board { --piece-h:52px; --y0:8px; --gap:10px; --head-top:14px; --head-h:40px; --foot-top:272px; height:330px; }
 [data-process-step="2"] .process-board { --gap:18px; }
}
@media(max-width:900px) {
 .process-layout { grid-template-columns:1fr; gap:24px; }
 .process-visual { order:-1; z-index:3; top:76px; padding:10px 0 14px; background:var(--lime); }
 .process-stage { padding:14px 16px; border-radius:20px; box-shadow:0 4px 0 var(--ink); }
 .process-toolbar>span:first-child, .process-captions { display:none; }
 .process-toolbar { justify-content:flex-end; margin-top:-4px; }
 .process-meter { margin-top:6px; }
 .process-board { --piece-h:44px; --px:4cqw; --pw:92cqw; --spread:.3; --spine-x:12px; --y0:2px; --gap:6px; --head-top:4px; --head-h:34px; --foot-top:222px; height:262px; }
 [data-process-step="2"] .process-board { --gap:16px; --px:8cqw; }
 .process-piece { gap:9px; padding:0 9px; border-radius:10px; font-size:12px; }
 .process-piece .connection-logo { width:28px; height:28px; border-radius:7px; }
 .process-piece .connection-logo img { width:18px; height:18px; }
 .piece-tags span { padding:3px 8px; font-size:10px; }
 .process-plan { justify-content:center; gap:5px; }
 .process-plan span { font-size:10px; padding:4px 9px 4px 6px; }
 .process-live-head { font-size:13px; }
 .process-live-foot { font-size:11px; }
 .process-step { min-height:52vh; padding:0 0 48px 58px; }
 .process-step:last-child { min-height:0; }
 .process-step h3 { font-size:clamp(28px,6vw,36px); margin:18px 0 10px; }
 .process-step p { font-size:16px; }
 .process-node { left:9px; }
 .process-rail, .process-token-track { left:15px; }
 .process-token { width:34px; height:34px; margin:-17px 0 -17px -16px; top:calc(var(--process-line,50vh) - 17px); font-size:19px; }
 .process-disclaimer { margin-top:36px; }
}
@media(max-width:620px) {
 .process-visual { top:72px; }
}
/* Too short to keep the board in view next to readable steps. */
@media(max-height:599px) {
 .process-visual { position:relative; top:auto; }
}
@media(prefers-reduced-motion:reduce) {
 .process-steps *, .process-stage * { transition:none!important; }
 .process-token>span { rotate:none; }
}

/* Everyday learning: choose, try and check, without pretending to run AI. */
.home-task-art { padding-bottom:0; }
.home-task-art .editorial-image img { aspect-ratio:1.08; }
.home-task-picks { position:relative; margin:-185px 28px 20px; padding:20px; border:1px solid var(--ink); border-radius:18px; background:var(--paper); box-shadow:0 5px 0 var(--ink); }
.home-task-picks>p { font-size:13px; margin:0 0 12px; color:var(--muted); }
.home-task-picks>a { display:flex; align-items:center; gap:12px; font-size:14px; padding:13px 0; border-top:1px solid var(--rule); transition:transform var(--quick) var(--ease); }
.home-task-picks>a>span { font-size:10px; color:var(--muted); }
.home-task-picks>a>svg { width:18px; height:18px; margin-left:auto; transition:transform var(--quick) var(--ease); }
.home-task-picks>a:hover>svg { transform:translateX(4px); }
.home-task-picks>a:active { transform:scale(.98); }
.practice-explorer .example-panels { padding:36px; }
.practice-explorer .example-panel { min-height:0; gap:50px; grid-template-columns:.9fr 1.1fr; }
.practice-explorer .example-story h3 { font-size:clamp(29px,3vw,42px); margin:0 0 20px; }
.practice-explorer .example-story>p { font-size:17px; }
.practice-explorer .example-story .practice-explanation { font-size:14px; margin:22px 0; }
.practice-controls { display:flex; gap:6px; margin:0 0 18px; }
.practice-controls button { display:flex; align-items:center; justify-content:center; gap:8px; flex:1; font-size:12px; min-height:46px; padding:10px 8px; background:transparent; border:1px solid var(--rule); border-radius:10px; transition:background var(--quick) var(--ease),transform var(--quick) var(--ease); }
.practice-controls button>span { font-size:10px; color:var(--muted); }
.practice-controls button[aria-pressed=true] { border-color:var(--ink); background:var(--paper); box-shadow:0 2px 0 var(--ink); }
.practice-controls button:hover { border-color:var(--ink); }
.practice-controls button:active { transform:scale(.98); }
.practice-book { display:grid; margin:0 5px; }
.practice-page { grid-area:1/1; padding:28px; border:1px solid var(--ink); border-radius:3px 24px 3px 3px; background:var(--paper); box-shadow:5px 6px 0 var(--purple-soft); min-height:365px; }
.practice-page[hidden] { display:block!important; visibility:hidden; pointer-events:none; }
.practice-request { background:var(--purple-soft); box-shadow:5px 6px 0 #d4c7e5; }
.practice-review { background:var(--lime); box-shadow:5px 6px 0 #bfdc7b; }
.practice-label { display:block; font-size:10px; letter-spacing:.1em; }
.practice-page h4 { font-size:27px; font-weight:500; line-height:1.15; letter-spacing:-.04em; margin:0 0 22px; }
.practice-page ul { list-style:none; margin:0; padding:0; display:grid; gap:13px; }
.practice-page li { display:flex; gap:10px; align-items:flex-start; font-size:14px; }
.practice-page li>svg { width:18px; height:18px; flex-shrink:0; margin-top:2px; }
.practice-page li>span[aria-hidden] { color:var(--muted); }
.practice-page blockquote { margin:0; font-size:19px; letter-spacing:-.025em; line-height:1.5; }
.practice-caption { border-top:1px solid rgba(25,26,24,.18); padding-top:17px; margin:22px 0 0; font-size:12px; }
.practice-progress { margin:20px 5px 7px; font-size:11px; color:var(--muted); }
.practice-disclaimer { margin:0 5px; color:var(--muted); font-size:11px; max-width:450px; }
.workshop-start-section { padding:20px 0 76px; }
.workshop-start { display:grid; grid-template-columns:1fr 1.1fr; gap:75px; align-items:center; }
.starting-choices h2 { font-size:36px; line-height:1.12; }
.starting-choices>p { margin:16px 0 22px; color:var(--muted); font-size:14px; }
.starting-buttons { display:flex; gap:8px; flex-wrap:wrap; }
.starting-buttons button { display:flex; align-items:center; gap:7px; font-size:12px; padding:11px 15px; min-height:44px; border:1px solid var(--rule); border-radius:999px; background:var(--paper); transition:background var(--quick) var(--ease),transform var(--quick) var(--ease); }
.starting-buttons button svg { width:16px; height:16px; }
.starting-buttons button[aria-pressed=true] { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.starting-buttons button:hover { border-color:var(--ink); }
.starting-buttons button:active { transform:scale(.98); }
.starting-results { display:grid; background:var(--purple-soft); border:1px solid var(--ink); padding:28px; border-radius:18px; box-shadow:0 4px 0 var(--ink); }
.starting-detail { grid-area:1/1; display:flex; gap:22px; align-items:flex-start; min-height:190px; }
.starting-detail[hidden] { display:flex!important; visibility:hidden; pointer-events:none; }
.starting-detail h3 { margin:5px 0 15px; font-size:28px; }
.starting-detail p { font-size:14px; }
.starting-mark { display:grid; place-items:center; flex-shrink:0; width:44px; height:44px; border-radius:50%; background:var(--paper); border:1px solid var(--ink); font-size:27px; }
.starting-outcome { display:flex; gap:8px; font-size:12px; align-items:flex-start; }
.starting-outcome svg { width:17px; height:17px; flex-shrink:0; margin-top:2px; }
.starting-footer { border-top:1px solid rgba(25,26,24,.18); padding-top:16px; }
.starting-footer .text-link { font-size:13px; }
.session-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-bottom:32px; }
.session-tabs button { display:flex; align-items:center; gap:14px; padding:17px 20px; border:1px solid rgba(25,26,24,.3); border-radius:14px; background:transparent; font-size:16px; text-align:left; transition:background var(--quick) var(--ease),transform var(--quick) var(--ease); }
.session-tabs button[aria-selected=true] { background:var(--paper); border-color:var(--ink); box-shadow:0 3px 0 var(--ink); }
.session-tabs button:hover { border-color:var(--ink); }
.session-tabs button:active { transform:scale(.98); }
.session-number { font-size:12px; }
.session-arrow { margin-left:auto; }
.session-panels { display:grid; }
.session-panel { grid-area:1/1; display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:85px; min-height:275px; padding:15px 20px 0; }
.session-panel[hidden] { display:grid!important; visibility:hidden; pointer-events:none; }
.session-copy h3 { font-size:clamp(28px,3vw,40px); margin:0 0 20px; max-width:490px; }
.session-copy>p { font-size:16px; max-width:480px; margin:0; }
.session-note { background:var(--paper); border:1px solid var(--ink); padding:28px; border-radius:3px; box-shadow:5px 6px 0 rgba(25,26,24,.14); transform:rotate(2deg); }
.session-note-1 { background:var(--purple-soft); }
.session-note-2 { background:#f5be98; }
.session-note-title { display:block; font-size:20px; letter-spacing:-.03em; border-bottom:1px solid rgba(25,26,24,.2); padding-bottom:17px; margin-bottom:20px; }
.session-note ul { padding:0; margin:0; list-style:none; display:grid; gap:16px; }
.session-note li { display:flex; align-items:center; gap:12px; font-size:14px; }
.session-note li svg { width:19px; height:19px; flex-shrink:0; }
@media(max-width:1000px) {
 .practice-explorer .example-panels { padding:28px; }
 .practice-explorer .example-panel { gap:30px; }
 .practice-controls button { flex-direction:column; gap:1px; font-size:11px; }
 .practice-page { padding:23px; }
 .workshop-start { gap:35px; }
 .starting-detail { gap:15px; }
 .session-panel { gap:35px; }
 .session-tabs button { gap:10px; font-size:14px; padding:15px; }
}
@media(max-width:700px) {
 .home-task-art .editorial-image img { aspect-ratio:1.3; }
 .home-task-picks { margin:-100px 18px 8px; padding:18px; }
 .practice-explorer .example-panel { grid-template-columns:1fr; gap:26px; }
 .practice-explorer .example-story .practice-explanation { margin:15px 0; }
 .practice-explorer .example-story>p { font-size:15px; }
 .practice-explorer .example-story h3 { max-width:none; margin:0 0 16px; }
 .practice-explorer .example-panels { padding:26px 20px; }
 .practice-controls button { flex-direction:row; gap:7px; font-size:11px; }
 .practice-page { min-height:355px; padding:23px; }
 .workshop-start { grid-template-columns:1fr; gap:26px; }
 .workshop-start-section { padding:10px 0 55px; }
 .starting-choices h2 { font-size:32px; }
 .starting-detail { min-height:210px; }
 .session-tabs { gap:8px; margin-bottom:25px; }
 .session-tabs button { display:block; font-size:12px; line-height:1.4; padding:12px; }
 .session-number { display:block; margin-bottom:9px; font-size:10px; }
 .session-arrow { display:none; }
 .session-panel { grid-template-columns:1fr; gap:26px; padding:10px 4px 0; align-content:start; }
 .session-copy { min-height:210px; }
 .session-copy h3 { font-size:30px; }
 .session-copy>p { font-size:15px; }
 .session-note { padding:25px; margin:0 6px; }
}
@media(max-width:380px) {
 .home-task-picks { margin-inline:9px; padding:15px; }
 .home-task-picks>a { font-size:12px; }
 .practice-explorer .example-panels { padding:23px 15px; }
 .practice-controls button { font-size:10px; flex-direction:column; }
 .practice-page { padding:20px; }
 .practice-page h4 { font-size:25px; }
 .practice-page li { font-size:13px; }
 .starting-results { padding:22px; }
 .starting-detail { display:block; min-height:280px; }
 .starting-detail[hidden] { display:block!important; }
 .starting-mark { margin-bottom:18px; }
 .session-tabs button { padding:10px; font-size:11px; }
 .session-copy { min-height:250px; }
}
@media(prefers-reduced-motion:reduce) {
 .home-task-picks *, .practice-explorer *, .workshop-start *, .session-journey * { animation:none!important; transition:none!important; }
}

[data-starting-status] { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }

/* Workshops: connected work, practical teaching, one action at a time. */
.ws-page { --ws-line:rgba(25,26,24,.24); }
.ws-eyebrow { font-size:11px; letter-spacing:.12em; font-weight:600; margin:0 0 24px; line-height:1.5; }
.ws-hero { padding:76px 0 0; }
.ws-hero-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.ws-hero h1 { font-size:clamp(55px,6.2vw,86px); line-height:1.04; letter-spacing:-.065em; }
.ws-underlined { position:relative; display:inline-block; z-index:0; }
.ws-underlined>svg { position:absolute; left:0; width:100%; height:18px; bottom:-13px; color:var(--purple); z-index:-1; }
.ws-hero-description { font-size:19px; max-width:420px; color:var(--muted); line-height:1.65; margin:35px 0 27px; }
.ws-hero .actions { margin:0; }
.ws-reassurance { display:flex; align-items:center; gap:8px; font-size:12px; margin:19px 0 0; }
.ws-reassurance svg { width:17px; height:17px; }
.ws-hero-bottom { display:flex; justify-content:space-between; gap:24px; border-bottom:1px solid var(--rule); padding:38px 0 27px; margin-top:35px; font-size:12px; color:var(--muted); }
.ws-workspace { margin:0; padding:24px 20px 20px; background:var(--purple-soft); border:1px solid var(--ink); border-radius:22px; box-shadow:0 5px 0 var(--ink); transform:rotate(1deg); }
.ws-art-header { display:flex; justify-content:space-between; align-items:center; margin:0 8px 8px; font-size:10px; letter-spacing:.12em; }
.ws-art-dot { width:10px; height:10px; border-radius:50%; background:var(--ink); }
.ws-workspace-svg { width:100%; height:auto; overflow:visible; }
.ws-workspace-svg text { fill:var(--ink); font-size:14px; font-weight:500; letter-spacing:-.02em; }
.ws-workspace-svg .ws-svg-small { fill:var(--muted); font-size:11px; font-weight:400; }
.ws-svg-card rect { fill:var(--paper); stroke:var(--ink); stroke-width:1; }
.ws-hub-shadow { fill:var(--ink); }
.ws-hub { fill:var(--lime); stroke:var(--ink); stroke-width:1.25; }
.ws-workspace-svg .ws-hub-title { font-size:23px; }
.ws-workspace-svg .ws-hub-sub { font-size:15px; font-weight:400; }
.ws-agent rect { fill:var(--paper); stroke:var(--ink); stroke-width:1; }
.ws-agent-review rect { fill:var(--pink); }
.ws-workspace figcaption { border-top:1px solid var(--ws-line); padding-top:15px; margin:8px 8px 0; font-size:12px; display:flex; justify-content:space-between; gap:12px; }
.ws-workspace figcaption span { color:#565064; font-size:10px; }
.ws-section-intro { display:grid; grid-template-columns:1.1fr 1fr; column-gap:100px; align-items:end; margin-bottom:44px; }
.ws-section-intro .ws-eyebrow { grid-column:1/-1; }
.ws-section-intro h2 { font-size:clamp(36px,4vw,54px); }
.ws-section-intro>p:last-child { color:var(--muted); max-width:425px; font-size:17px; margin:0; }
.ws-comparison { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.ws-comparison article { border-radius:18px; padding:28px 30px 32px; background:var(--panel); }
.ws-comparison .ws-adapt { background:var(--purple-soft); }
.ws-diagram-label { font-size:10px; letter-spacing:.09em; }
.ws-comparison svg { width:100%; height:auto; margin:16px 0 22px; overflow:visible; }
.ws-comparison svg rect { fill:var(--paper); stroke:var(--ink); stroke-width:1; }
.ws-comparison svg text { text-anchor:middle; font-size:15px; fill:var(--ink); }
.ws-comparison .ws-brief rect { fill:var(--lime); }
.ws-comparison .ws-brief text { font-size:12px; }
.ws-comparison h3 { font-size:29px; margin-bottom:15px; }
.ws-comparison article>p { margin:0; color:#51534c; font-size:15px; max-width:430px; }
.ws-learning { background:var(--ink); color:var(--paper); }
.ws-learning-layout { display:grid; grid-template-columns:1fr 1.25fr; gap:100px; }
.ws-learning-intro .ws-eyebrow { color:var(--lime); }
.ws-learning-intro h2 { font-size:clamp(40px,4.2vw,58px); }
.ws-learning-intro>p:not(.ws-eyebrow) { color:#c4c5bd; font-size:16px; max-width:360px; margin:28px 0; }
.ws-learning-note { display:flex; align-items:center; gap:15px; margin-top:42px; color:var(--lime); }
.ws-learning-note svg { width:75px; height:75px; flex-shrink:0; }
.ws-learning-note span { font-size:14px; line-height:1.6; }
.ws-lesson { border-top:1px solid #50514a; }
.ws-lesson:last-of-type { border-bottom:1px solid #50514a; }
.ws-lesson summary { display:flex; align-items:center; gap:21px; padding:26px 0; cursor:pointer; list-style:none; }
.ws-lesson summary::-webkit-details-marker { display:none; }
.ws-lesson summary>span:first-child { font-size:11px; color:var(--lime); }
.ws-lesson summary h3 { font-size:clamp(21px,2.1vw,28px); line-height:1.25; }
.ws-lesson-plus { font-size:25px; font-weight:400; margin-left:auto; transition:transform var(--arrive) var(--ease); }
.ws-lesson[open] .ws-lesson-plus { transform:rotate(45deg); }
.ws-lesson summary:hover h3 { color:var(--lime); }
.ws-lesson summary:focus-visible { outline:2px solid var(--lime); outline-offset:5px; }
.ws-lesson>p { color:#d2d3cb; margin:0 20px 28px 37px; max-width:480px; font-size:15px; }
.ws-curriculum-note { color:#b7b9ad; font-size:12px; margin:24px 0 0; max-width:450px; }
.ws-belief-layout { display:grid; grid-template-columns:1fr 1fr; gap:85px; align-items:center; }
.ws-belief-photo { margin:0; }
.ws-belief-photo img { width:100%; aspect-ratio:1.08; object-fit:cover; border-radius:140px 140px 18px 18px; }
.ws-belief-photo figcaption { font-size:12px; color:var(--muted); margin-top:15px; }
.ws-belief-copy h2 { font-size:clamp(36px,3.8vw,52px); margin-bottom:27px; }
.ws-belief-copy>p:not(.ws-eyebrow) { color:var(--muted); font-size:16px; max-width:465px; }
.ws-belief-copy .text-link { margin-top:9px; }
.ws-page .workshop-start-section { padding:50px 0 90px; }
.ws-page .faq-layout { border-top:1px solid var(--rule); padding-top:65px; }
.ws-page .faq-layout .text-link { display:none; }
.ws-page .faq-layout h2 { font-size:40px; }
.ws-page .cta-section { padding-top:10px; }
.ws-page .copy-callout .ws-eyebrow { margin-bottom:22px; }
@media (max-width:1050px) {
 .ws-hero-grid { gap:35px; }
 .ws-hero h1 { font-size:clamp(50px,6.4vw,72px); }
 .ws-workspace { padding:22px 12px 18px; }
 .ws-workspace figcaption { flex-direction:column; gap:2px; }
 .ws-section-intro, .ws-learning-layout { column-gap:50px; }
 .ws-belief-layout { gap:45px; }
}
@media (max-width:700px) {
 .ws-hero { padding-top:45px; }
 .ws-hero-grid, .ws-section-intro, .ws-comparison, .ws-learning-layout, .ws-belief-layout { grid-template-columns:1fr; }
 .ws-hero-grid { gap:42px; }
 .ws-hero h1 { font-size:clamp(52px,11vw,76px); }
 .ws-eyebrow { font-size:10px; margin-bottom:20px; }
 .ws-hero-description { font-size:17px; max-width:440px; margin-top:30px; }
 .ws-workspace { transform:none; padding:22px 12px 18px; }
 .ws-workspace figcaption { flex-direction:row; font-size:11px; }
 .ws-workspace figcaption span { font-size:9px; max-width:120px; }
 .ws-hero-bottom { flex-direction:column; gap:5px; margin-top:25px; padding:16px 0 23px; font-size:11px; }
 .ws-page .section { padding-block:60px; }
 .ws-section-intro { gap:0; margin-bottom:30px; }
 .ws-section-intro>p:last-child { margin-top:24px; font-size:16px; }
 .ws-comparison { gap:18px; }
 .ws-comparison article { padding:24px; }
 .ws-comparison h3 { font-size:27px; }
 .ws-comparison article>p { font-size:14px; }
 .ws-learning-layout { gap:35px; }
 .ws-learning-intro>p:not(.ws-eyebrow) { max-width:none; margin-bottom:0; }
 .ws-learning-note { margin-top:22px; }
 .ws-lesson summary { gap:15px; padding:23px 0; }
 .ws-lesson summary h3 { font-size:22px; }
 .ws-lesson>p { margin-left:29px; margin-right:0; font-size:14px; }
 .ws-belief-layout { gap:30px; }
 .ws-belief-photo img { aspect-ratio:1.3; border-radius:90px 90px 16px 16px; }
 .ws-page .workshop-start-section { padding:15px 0 10px; }
 .ws-page .faq-layout { padding-top:35px; }
 .ws-page .cta-section { padding-top:0; }
}
@media(prefers-reduced-motion:reduce) {
 .ws-page *, .ws-page *::before, .ws-page *::after { animation:none!important; transition:none!important; }
}
@media(max-width:700px) {
 .ws-workspace-svg text { font-size:19px; }
 .ws-workspace-svg .ws-svg-small { display:none; }
 .ws-workspace-svg .ws-svg-card { --ws-content-x:-2.5px; --ws-icon-y:6px; --ws-label-y:14px; }
 .ws-workspace-svg .ws-svg-card-tools { --ws-content-x:-7px; --ws-icon-y:7.5px; --ws-label-y:15.5px; }
 .ws-workspace-svg .ws-svg-card-team { --ws-content-x:-3.5px; --ws-icon-y:4.5px; }
 .ws-workspace-svg .ws-svg-card>g { transform:translate(var(--ws-content-x),var(--ws-icon-y)); }
 .ws-workspace-svg .ws-svg-card>text:not(.ws-svg-small) { transform:translate(var(--ws-content-x),var(--ws-label-y)); }
 .ws-workspace-svg .ws-agent:not(.ws-agent-review)>path { transform:translateY(4px); }
 .ws-workspace-svg .ws-hub-sub { font-size:17px; }
 .ws-comparison svg text { font-size:21px; }
 .ws-comparison .ws-brief text { font-size:17px; }
}
.ws-context { padding-top:0; }
.ws-context .ws-context-with { background:var(--lime); }
.ws-comparison .ws-vague rect { fill:none; stroke-dasharray:5 5; }
.ws-comparison .ws-vague text { fill:var(--muted); }
.ws-comparison .ws-unknowns text { font-size:19px; font-weight:500; fill:var(--muted); }
.ws-comparison .ws-app text { font-size:13px; }
.ws-comparison .ws-ai-lit rect { fill:var(--ink); }
.ws-comparison .ws-ai-lit text { fill:var(--lime); }
.ws-mindset { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; align-items:center; margin-top:24px; padding:44px 46px; background:var(--paper); border:1px solid var(--ink); border-radius:22px; box-shadow:0 5px 0 var(--ink); }
.ws-mindset h3 { font-size:clamp(32px,3.4vw,46px); margin:18px 0 20px; }
.ws-mindset-copy p { color:var(--muted); font-size:16px; max-width:430px; margin:0; }
.ws-shifts { list-style:none; margin:0; padding:0; }
.ws-shifts li { display:grid; grid-template-columns:1fr 60px 1.15fr; align-items:center; gap:18px; padding:17px 0; border-top:1px solid var(--rule); }
.ws-shifts li:last-child { border-bottom:1px solid var(--rule); }
.ws-shifts svg { width:60px; height:12px; overflow:visible; }
.ws-shift-from { color:var(--muted); font-size:15px; line-height:1.4; }
.ws-shift-to { justify-self:start; font-size:15px; font-weight:550; line-height:1.4; letter-spacing:-.01em; padding:7px 14px; background:var(--lime); border:1px solid var(--ink); border-radius:12px; }
.ws-shifts li:nth-child(2) .ws-shift-to { background:var(--purple-soft); }
.ws-shifts li:nth-child(3) .ws-shift-to { background:var(--pink); }
.ws-shifts li:nth-child(4) .ws-shift-to { background:#f5be98; }
@media (max-width:1050px) {
 .ws-mindset { gap:40px; padding:36px 32px; }
 .ws-shifts li { grid-template-columns:1fr 40px 1.2fr; gap:12px; }
 .ws-shifts svg { width:40px; }
}
@media (max-width:700px) {
 .ws-comparison .ws-app text { font-size:17px; }
 .ws-comparison .ws-unknowns text { font-size:24px; }
 .ws-mindset { grid-template-columns:1fr; gap:26px; padding:26px 22px; margin-top:18px; }
 .ws-mindset h3 { font-size:30px; margin:14px 0 16px; }
 .ws-mindset-copy p { font-size:14px; }
 .ws-shifts li { grid-template-columns:1fr; gap:8px; padding:15px 0; }
 .ws-shifts svg { width:36px; height:12px; transform:rotate(90deg); margin:12px 0 12px -6px; }
 .ws-shift-from { font-size:14px; }
 .ws-shift-to { font-size:14px; }
}

/* AI-first: our experience in numbers. */
.ws-proof { background:#e8dcfb; }
.ws-proof-heading { display:grid; grid-template-columns:1fr 1fr; gap:85px; align-items:end; margin-bottom:46px; }
.ws-proof-heading h2 { font-size:clamp(38px,4.1vw,58px); }
.ws-proof-heading>p { max-width:475px; margin:0; font-size:17px; color:#52504f; }
.ws-proof-body { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; border-top:1px solid rgba(25,26,24,.24); padding-top:36px; }
.ws-proof-statement { margin:0; font-size:clamp(30px,3vw,43px); line-height:1.12; letter-spacing:-.045em; }
.ws-proof-statement span { color:#5f55be; }
.ws-proof-comparison { display:flex; align-items:center; gap:25px; }
.ws-proof-comparison>div { display:flex; flex-direction:column; gap:8px; max-width:190px; }
.ws-proof-comparison strong { font-size:clamp(45px,5.2vw,70px); line-height:1; letter-spacing:-.06em; font-weight:500; }
.ws-proof-comparison span:not(.ws-proof-arrow) { font-size:12px; line-height:1.4; }
.ws-proof-arrow { font-size:27px; color:#5f55be; }
.ws-proof-comparison strong { white-space:nowrap; }
.ws-proof-admin-stat { display:flex; flex-wrap:wrap; gap:9px 16px; align-items:baseline; max-width:440px; margin:30px 0 0; padding-top:26px; border-top:1px solid rgba(25,26,24,.2); }
.ws-proof-admin-stat strong { font-size:clamp(45px,5.2vw,70px); line-height:1; letter-spacing:-.06em; font-weight:500; white-space:nowrap; }
.ws-proof-admin-stat span { font-size:12px; line-height:1.4; }
.ws-proof-note { color:#5c5864; font-size:12px; line-height:1.6; margin:22px 0 0; }
@media(max-width:700px) {
 .ws-proof-heading, .ws-proof-body { grid-template-columns:1fr; gap:26px; }
 .ws-proof-heading { margin-bottom:30px; }
 .ws-proof-heading>p { font-size:15px; }
 .ws-proof-body { padding-top:28px; gap:32px; }
 .ws-proof-comparison { gap:18px; }
 .ws-proof-comparison strong, .ws-proof-admin-stat strong { font-size:54px; }
 .ws-proof-comparison>div:last-child { max-width:155px; }
}

/* Homepage: an animated desk of everyday tasks, then one job per section. */
.hm-hero { padding:64px 0 0; }
.hm-hero-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:64px; align-items:center; }
.hm-hero h1 { font-size:clamp(52px,6vw,88px); line-height:1.06; letter-spacing:-.06em; }
.hm-hero .hero-copy { max-width:440px; margin:30px 0 28px; }
.hm-hero .highlight-word:before { transform-origin:left center; animation:hm-highlight 700ms 150ms var(--ease) both; }
@keyframes hm-highlight { from { transform:rotate(-2deg) scaleX(0); } to { transform:rotate(-2deg) scaleX(1); } }
.hm-hero-art { position:relative; min-width:0; padding-bottom:56px; }
.hm-scene { position:relative; margin:0; overflow:hidden; container-type:inline-size; border:1px solid var(--ink); border-radius:64px 22px 22px 22px; background:radial-gradient(circle,rgba(25,26,24,.16) 1px,transparent 1.5px) 0 0/22px 22px,var(--panel); box-shadow:0 5px 0 var(--ink); }
.hm-scene-header { display:flex; justify-content:space-between; align-items:center; padding:22px 26px 0 36px; font-size:10px; letter-spacing:.12em; }
.hm-scene-svg { width:100%; height:auto; overflow:visible; }
.hm-scene-svg text { fill:var(--ink); font-size:18px; font-weight:550; letter-spacing:-.02em; }
.hm-scene-svg .hm-small { fill:var(--muted); font-size:12px; font-weight:400; letter-spacing:0; }
.hm-scene-svg .hm-hub-title { font-size:21px; font-weight:500; }
.hm-scene-svg .hm-pill-text { font-size:17px; font-weight:500; }
.hm-ribbon-edge, .hm-ribbon { fill:none; stroke-linecap:round; stroke-linejoin:round; }
.hm-ribbon-edge { stroke:var(--ink); stroke-width:21; }
.hm-ribbon { stroke:var(--purple); stroke-width:18; }
.hm-src-shadow, .hm-hub-shadow, .hm-hub-mark { fill:var(--ink); }
.hm-src { transition:transform var(--arrive) var(--ease); }
.hm-src>rect { fill:var(--paper); stroke:var(--ink); stroke-width:1.25; transition:fill var(--arrive) var(--ease); }
.hm-icon, .hm-link, .hm-tick { fill:none; stroke:var(--ink); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.hm-tick { stroke-width:1.9; }
.hm-hub { fill:var(--lime); stroke:var(--ink); stroke-width:1.25; }
.hm-hub-spark { fill:none; stroke:var(--lime); stroke-width:2.4; stroke-linecap:round; }
.hm-pill { fill:var(--pink); stroke:var(--ink); stroke-width:1.25; }
.hm-sticker { fill:#f5be98; stroke:var(--ink); stroke-width:1.25; }
.hm-sticker-spark { fill:none; stroke:var(--ink); stroke-width:2.6; stroke-linecap:round; }
[data-hm-node], [data-hm-pop] { transform-box:fill-box; transform-origin:center; }
.hm-hero-art:has([data-topic-start=writing]:is(:hover,:focus-visible)) .hm-src-writing,
.hm-hero-art:has([data-topic-start=meetings]:is(:hover,:focus-visible)) .hm-src-meetings,
.hm-hero-art:has([data-topic-start=processes]:is(:hover,:focus-visible)) .hm-src-processes { transform:translateY(-5px); }
.hm-hero-art:has([data-topic-start=writing]:is(:hover,:focus-visible)) .hm-src-writing>rect,
.hm-hero-art:has([data-topic-start=meetings]:is(:hover,:focus-visible)) .hm-src-meetings>rect,
.hm-hero-art:has([data-topic-start=processes]:is(:hover,:focus-visible)) .hm-src-processes>rect { fill:var(--lime); }
.hm-hero-art .home-task-picks { position:absolute; z-index:2; left:-36px; bottom:0; width:min(340px,60%); margin:0; }
.hm-facts { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:72px 0 0; padding:24px 0; border-block:1px solid var(--rule); }
.hm-facts li { display:flex; align-items:center; gap:14px; font-size:14px; line-height:1.4; }
.hm-facts svg { width:30px; height:30px; flex-shrink:0; }
.hm-track { --hm-gap:18px; position:relative; height:24px; margin:0 calc((100% - 2 * var(--hm-gap)) / 6) 16px; }
.hm-track svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.hm-track-base { stroke:rgba(25,26,24,.35); stroke-width:1.5; stroke-dasharray:5 6; vector-effect:non-scaling-stroke; }
.hm-track-fill { stroke:var(--ink); stroke-width:2.5; stroke-dasharray:1 1; stroke-dashoffset:1; transition:stroke-dashoffset 600ms var(--ease); }
.hm-track span { position:absolute; top:50%; left:0; width:16px; height:16px; margin:-8px 0 0 -8px; border:1.5px solid var(--ink); border-radius:50%; background:var(--paper); transition:background-color var(--arrive) var(--ease),box-shadow var(--arrive) var(--ease); }
.hm-track span:nth-of-type(2) { left:50%; }
.hm-track span:nth-of-type(3) { left:100%; }
.hm-track span[data-reached=true] { background:var(--ink); box-shadow:inset 0 0 0 3px var(--lime); }
.hm-people-layout { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; }
.hm-people-photo { position:relative; margin:0; }
.hm-people-photo>picture { display:block; width:100%; }
.hm-people-photo>img,
.hm-people-photo>picture>img { width:100%; aspect-ratio:1.08; object-fit:cover; border:1px solid var(--ink); border-radius:140px 140px 18px 18px; }
.hm-people-sticker { position:absolute; right:-26px; bottom:-30px; width:clamp(92px,10vw,124px); height:auto; overflow:visible; }
.hm-people-copy h2 { font-size:clamp(38px,4vw,54px); margin-bottom:26px; }
.hm-people-copy>p:not(.ws-eyebrow) { color:var(--muted); font-size:17px; max-width:430px; }
.hm-people-copy .ab-facts { margin:30px 0 24px; }
.hm-build { padding-top:0; }
.hm-build .ws-section-intro { border-top:1px solid var(--rule); padding-top:70px; }
.hm-build-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:24px; }
.hm-build-photo { grid-row:1/3; min-height:0; }
.hm-build-photo .editorial-image, .hm-build-photo img { height:100%; }
.hm-build-photo img { border-radius:90px 20px 20px 20px; }
.hm-build-card { display:grid; grid-template-columns:1fr 1.05fr; gap:24px; align-items:center; padding:30px 30px 30px 34px; border:1px solid var(--ink); border-radius:20px; box-shadow:0 4px 0 var(--ink); }
.hm-build-automation { background:var(--purple-soft); }
.hm-build-tools { background:#f5be98; }
.hm-build-number { font-size:11px; }
.hm-build-copy h3 { font-size:clamp(26px,2.4vw,32px); margin:12px 0; }
.hm-build-copy p { font-size:15px; color:#4d4f48; max-width:300px; margin:0 0 8px; }
.hm-build-art { width:100%; height:auto; overflow:visible; }
.hm-build-art text { font-size:14px; font-weight:550; letter-spacing:-.01em; }
.hm-build-art .hm-d-small { font-size:12px; }
.hm-page .proof-section .project-row h3 { margin:0 0 8px; }
.hm-callout { position:relative; }
.hm-callout .callout-actions { position:relative; }
.hm-cta-arrow { position:absolute; right:calc(100% - 22px); bottom:calc(100% - 6px); width:84px; height:auto; color:var(--ink); }
.hm-cta-badge { position:absolute; top:-44px; right:52px; width:104px; height:auto; overflow:visible; }
.hm-lift, .hm-spin, .hm-hub-spark, .hm-facts svg, .hm-track span, .hm-people-sticker, .hm-build-card, .hm-d-tile, .hm-d-ready, .hm-d-check, .hm-d-slot, .hm-d-cursor, .hm-cta-arrow, .hm-cta-badge { transform-box:fill-box; transform-origin:center; transition:transform var(--arrive) var(--ease),fill var(--arrive) var(--ease),box-shadow var(--arrive) var(--ease); }
.hm-d-tile:nth-of-type(2), .hm-d-check { transition-delay:40ms; }
@media(hover:hover) {
 .hm-src-group:hover .hm-src { transform:translateY(-4px); }
 .hm-src-group:hover .hm-src>rect { fill:var(--lime); }
 .hm-lift-group:hover .hm-lift { transform:translateY(-3px); }
 .hm-lift-group:hover .hm-hub-spark { transform:rotate(45deg); }
 .hm-spin:hover { transform:rotate(22deg) scale(1.05); }
 .hm-facts li:hover svg { transform:translateY(-2px) rotate(-6deg); }
 .session-journey:has(#session-tab-0:hover) .hm-track span:nth-of-type(1),
 .session-journey:has(#session-tab-1:hover) .hm-track span:nth-of-type(2),
 .session-journey:has(#session-tab-2:hover) .hm-track span:nth-of-type(3) { transform:scale(1.3); }
 .hm-people-photo:hover .hm-people-sticker { transform:rotate(24deg) scale(1.04); }
 .hm-build-card:hover { transform:translateY(-3px); box-shadow:0 6px 0 var(--ink); }
 .hm-build-card:hover .hm-d-tile, .hm-build-card:hover .hm-d-check { transform:scale(1.06); }
 .hm-build-card:hover .hm-d-ready { transform:scale(1.04) rotate(-2deg); }
 .hm-build-card:hover .hm-d-slot { fill:var(--lime); }
 .hm-build-card:hover .hm-d-cursor { transform:translate(-5px,-4px); }
 .hm-callout:hover .hm-cta-badge { transform:rotate(18deg); }
 .hm-callout:has(.btn:hover) .hm-cta-arrow { transform:translate(3px,3px) rotate(4deg); }
}
@container (max-width:500px) {
 .hm-scene-svg .hm-small { display:none; }
 .hm-scene-svg text { font-size:23px; }
 .hm-scene-svg .hm-hub-title { font-size:22px; }
 .hm-scene-svg .hm-pill-text { font-size:21px; }
}
@media(max-width:1050px) {
 .hm-hero-grid { gap:40px; }
 .hm-people-layout { gap:50px; }
 .hm-build-grid { grid-template-columns:.7fr 1.3fr; }
 .hm-build-card { padding:26px; }
}
@media(max-width:900px) {
 .hm-hero { padding-top:44px; }
 .hm-hero-grid { grid-template-columns:1fr; gap:44px; }
 .hm-hero-art { max-width:640px; width:100%; padding:0; }
 .hm-hero-art .home-task-picks { position:relative; left:auto; bottom:auto; width:auto; margin:-20px 16px 0; }
 .hm-facts { grid-template-columns:1fr; gap:14px; margin-top:52px; padding:22px 0; }
 .hm-people-layout { grid-template-columns:1fr; gap:44px; }
 .hm-people-photo { margin-right:22px; }
 .hm-build-grid { grid-template-columns:1fr; }
 .hm-build-photo { grid-row:auto; }
 .hm-build-photo img { aspect-ratio:1.7; border-radius:60px 18px 18px 18px; }
}
@media(max-width:700px) {
 .hm-track { --hm-gap:8px; margin-bottom:12px; }
 .hm-build .ws-section-intro { padding-top:50px; }
}
@media(max-width:600px) {
 .hm-hero h1 { font-size:clamp(46px,13vw,64px); }
 .hm-scene { border-radius:44px 18px 18px 18px; }
 .hm-scene-header { padding:18px 18px 0 26px; font-size:9px; }
 .hm-hero-art .home-task-picks { margin:-10px 10px 0; }
 .hm-people-sticker { right:-14px; bottom:-26px; }
 .hm-people-copy h2 { font-size:38px; }
 .hm-build-card { grid-template-columns:1fr; gap:20px; padding:24px; }
 .hm-build-art { max-width:300px; }
 .hm-cta-arrow { display:none; }
 .hm-cta-badge { top:-34px; right:22px; width:76px; }
}
@media(prefers-reduced-motion:reduce) {
 .hm-page *, .hm-page *::before, .hm-page *::after { animation:none!important; transition:none!important; }
}

/* Insights: an editorial reading room with searchable, illustrated articles. */
.insights-hero { padding:72px 0 70px; }
.insights-hero-grid { display:grid; grid-template-columns:1fr .9fr; gap:75px; align-items:center; }
.insights-kicker { margin:0 0 26px; font-size:11px; letter-spacing:.13em; font-weight:650; }
.insights-kicker span { margin-left:9px; font-size:16px; }
.insights-hero h1 { font-size:clamp(48px,5.6vw,80px); line-height:1.08; margin:0 0 28px; }
.insights-hero-grid>div:first-child>p:last-child { color:var(--muted); font-size:19px; max-width:475px; margin:0; }
.insights-hero-art { position:relative; min-width:0; }
.insights-hero-art>img { aspect-ratio:1.3; object-fit:cover; width:100%; border-radius:85px 18px 18px 18px; }
.insights-art-note { position:absolute; left:-20px; bottom:24px; background:var(--lime); padding:17px 20px; border:1px solid var(--ink); border-radius:4px; transform:rotate(-4deg); box-shadow:3px 4px 0 var(--ink); font-size:15px; line-height:1.35; }
.insights-art-note span { display:inline-block; margin-left:16px; font-size:21px; }
.insights-library { background:var(--panel); border-block:1px solid var(--rule); padding:82px 0 95px; }
.insights-library-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:38px; }
.insights-library-heading .insights-kicker { margin-bottom:15px; }
.insights-library-heading h2 { font-size:clamp(34px,3.6vw,48px); }
.insights-library-heading>p { max-width:315px; color:var(--muted); font-size:15px; margin:0; }
.insights-search { max-width:640px; }
.insights-search label { display:block; font-size:12px; font-weight:600; margin:0 0 8px; }
.insights-search-input { position:relative; }
.insights-search-input svg { position:absolute; left:19px; top:50%; transform:translateY(-50%); width:21px; height:21px; pointer-events:none; }
.insights-search-input input { display:block; width:100%; border:1px solid var(--ink); border-radius:999px; background:var(--paper); padding:15px 18px 15px 52px; font-size:16px; min-height:54px; }
.insight-filters { display:flex; flex-wrap:wrap; gap:8px; margin:24px 0 0; }
.insight-filters button { border:1px solid #d5d5cd; border-radius:999px; background:var(--paper); padding:10px 17px; min-height:44px; font-size:12px; transition:background var(--quick) var(--ease), transform var(--quick) var(--ease); }
.insight-filters button:hover { border-color:var(--ink); }
.insight-filters button[aria-pressed=true] { background:var(--ink); border-color:var(--ink); color:var(--paper); }
.insight-filters button:active,.insight-more button:active { transform:scale(.98); }
.insights-results { display:flex; justify-content:space-between; align-items:baseline; margin:48px 0 20px; border-bottom:1px solid #c9cac2; padding-bottom:14px; }
.insights-results h2 { font-size:21px; }
.insights-results p { font-size:12px; color:var(--muted); margin:0; }
.insight-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:45px 24px; }
.insight-card { min-width:0; }
.insight-card-link { display:block; height:100%; }
.insight-thumb { overflow:hidden; border-radius:16px; border:1px solid var(--ink); background:var(--purple-soft); }
.article-hero .article-cover { margin-top: 2rem; }
.article-hero .article-cover img { display:block; width:100%; max-height:440px; object-fit:cover; border:1px solid var(--ink); border-radius:18px; }
.insight-thumb img { width:100%; aspect-ratio:16/9; object-fit:cover; transition:transform 280ms var(--ease); }
.insight-card-link:hover .insight-thumb img { transform:scale(1.025); }
.insight-card-content { padding:18px 2px 0; }
.insight-card-meta { display:flex; justify-content:space-between; gap:15px; align-items:center; color:var(--muted); font-size:11px; }
.insight-card-meta span:last-child:not(:first-child) { font-size:10px; letter-spacing:.1em; color:var(--ink); }
.insight-card h2 { font-size:24px; line-height:1.16; margin:12px 0; max-width:430px; }
.insight-card p { font-size:14px; line-height:1.55; color:var(--muted); margin:0; }
.insight-read { display:inline-flex; align-items:center; gap:12px; margin-top:18px; font-size:12px; font-weight:600; }
.insight-read svg { width:17px; height:17px; transition:transform var(--quick) var(--ease); }
.insight-card-link:hover .insight-read svg { transform:translateX(4px); }
.insight-featured { grid-column:1/-1; margin-bottom:10px; }
.insight-featured .insight-card-link { display:grid; grid-template-columns:1.1fr 1fr; background:var(--paper); border:1px solid var(--ink); border-radius:20px; overflow:hidden; box-shadow:0 4px 0 var(--ink); }
.insight-featured .insight-thumb { border:0; border-right:1px solid var(--ink); border-radius:0; }
.insight-featured .insight-thumb img { height:100%; min-height:300px; }
.insight-featured .insight-card-content { display:flex; flex-direction:column; justify-content:center; padding:42px; }
.insight-featured h2 { font-size:clamp(28px,3vw,40px); max-width:500px; margin:18px 0; }
.insight-featured p { font-size:16px; max-width:470px; }
.insight-featured .insight-read { margin-top:26px; }
.insight-more { margin:55px 0 0; text-align:center; }
.insight-more .btn { margin:0 auto; }
.insight-more p { color:var(--muted); font-size:12px; margin:13px 0 0; }
.insight-empty { background:var(--paper); border-radius:18px; border:1px solid var(--rule); padding:42px; }
.insight-empty h2 { font-size:28px; }
@media(max-width:900px) {
 .insights-hero-grid { gap:35px; }
 .insights-hero h1 { font-size:clamp(43px,6vw,64px); }
 .insight-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .insight-featured .insight-card-content { padding:28px; }
 .insight-featured .insight-thumb img { min-height:270px; }
}
@media(max-width:600px) {
 .insights-hero { padding:42px 0 50px; }
 .insights-hero-grid { grid-template-columns:1fr; gap:35px; }
 .insights-hero h1 { font-size:clamp(42px,10vw,58px); }
 .insights-hero-grid>div:first-child>p:last-child { font-size:16px; }
 .insights-hero-art { margin-left:12px; }
 .insights-hero-art>img { aspect-ratio:1.45; border-radius:55px 14px 14px 14px; }
 .insights-art-note { left:-12px; bottom:12px; padding:12px 14px; font-size:12px; }
 .insights-library { padding:55px 0 70px; }
 .insights-library-heading { display:block; margin-bottom:28px; }
 .insights-library-heading>p { margin-top:16px; }
 .insight-filters { gap:7px; }
 .insight-filters button { padding:9px 12px; font-size:11px; }
 .insights-results { margin-top:38px; }
 .insight-grid { grid-template-columns:1fr; gap:36px; }
 .insight-featured { grid-column:auto; }
 .insight-featured .insight-card-link { grid-template-columns:1fr; }
 .insight-featured .insight-thumb { border-right:0; border-bottom:1px solid var(--ink); }
 .insight-featured .insight-thumb img { min-height:0; height:auto; }
 .insight-featured .insight-card-content { padding:24px; }
 .insight-featured h2 { font-size:29px; }
 .insight-featured p { font-size:14px; }
 .insight-card h2 { font-size:23px; }
 .insight-empty { padding:30px 24px; }
}
@media(prefers-reduced-motion:reduce) {
 .insights-hero *, .insights-library * { transition:none!important; animation:none!important; }
}

/* Products: Databrain context with Multideck's own visual identity. */
.products-hero { padding:66px 0 70px; }
.products-heading { margin-bottom:42px; text-align:center; }
.products-heading .ws-eyebrow span { padding:0 9px; color:var(--muted); }
.products-heading h1 { font-size:clamp(45px,6vw,82px); line-height:1.08; margin:0 0 25px; }
.products-heading>p:last-child { color:var(--muted); font-size:19px; max-width:650px; margin:0 auto; }
.multideck-showcase { display:grid; grid-template-columns:.9fr 1.1fr; background:#e3ede7; border:1px solid var(--ink); border-radius:22px; overflow:hidden; box-shadow:0 5px 0 var(--ink); }
.multideck-showcase-copy { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:54px; }
.multideck-label { font-size:11px; letter-spacing:.12em; font-weight:650; color:#335e55; }
.multideck-showcase-copy>img { width:min(310px,100%); height:auto; margin:27px 0 18px; }
.multideck-showcase-copy>p { font-size:18px; line-height:1.55; max-width:360px; margin:0 0 28px; }
.multideck-site-link { display:inline-flex; align-items:center; gap:12px; font-size:14px; font-weight:600; border-bottom:1px solid currentColor; padding-bottom:5px; }
.multideck-site-link span { font-size:19px; line-height:1; transition:transform var(--quick) var(--ease); }
.multideck-site-link:hover span { transform:translate(3px,-3px); }
.multideck-showcase-image { position:relative; min-height:370px; }
.multideck-showcase-image img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:center; }
.multideck-image-caption { position:absolute; bottom:18px; right:18px; padding:8px 12px; border:1px solid var(--ink); border-radius:999px; background:var(--paper); font-size:11px; }
.product-workflow { padding:90px 0; }
.product-workflow-heading { display:grid; grid-template-columns:1.15fr .85fr; gap:70px; align-items:end; margin-bottom:60px; }
.product-workflow-heading h2 { font-size:clamp(35px,3.8vw,54px); }
.product-workflow-heading>p { color:var(--muted); font-size:16px; max-width:430px; margin:0; }
.product-features { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:30px; }
.product-feature { border-top:1px solid var(--ink); padding-top:18px; }
.product-feature>span { color:#0e7d74; font-size:12px; font-weight:650; }
.product-feature h3 { margin:22px 0 12px; font-size:24px; }
.product-feature p { margin:0; max-width:250px; color:var(--muted); font-size:14px; }
.product-details { background:#102c28; color:#fbfaf6; padding:92px 0; }
.product-details-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:75px; align-items:center; }
.product-details-intro .ws-eyebrow { color:#a9d5be; }
.product-details-intro h2 { font-size:clamp(35px,4vw,52px); margin:18px 0 22px; }
.product-details-intro>p:last-child { max-width:400px; color:#cfdfd8; font-size:16px; margin:0; }
.product-shipment { border:1px solid rgba(255,255,255,.3); border-radius:18px; padding:28px; background:#183c35; }
.product-shipment-head { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid rgba(255,255,255,.22); padding-bottom:16px; margin-bottom:23px; font-size:10px; letter-spacing:.12em; }
.product-shipment-head span:last-child { color:var(--lime); font-size:27px; line-height:1; }
.product-shipment-route { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.product-shipment-route>div { background:#f7f9f2; color:var(--ink); border-radius:12px; padding:17px; min-height:110px; }
.product-shipment-route>div:nth-child(2) { background:#d8f29a; }
.product-shipment-route>div:nth-child(3) { background:#dbe9df; }
.product-shipment-route>div:nth-child(4) { background:#e8dcfb; }
.product-shipment-route span { display:block; color:#477268; font-size:10px; margin-bottom:10px; }
.product-shipment-route strong { display:block; font-size:17px; font-weight:550; line-height:1.2; }
.product-shipment-route small { display:block; color:#52655e; font-size:11px; margin-top:6px; }
.product-shipment>p { color:#bbd2c8; font-size:11px; margin:17px 0 0; }
.products-next { padding:100px 0 80px; }
.products-upcoming { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.upcoming-product { min-height:230px; border:1px solid var(--ink); border-radius:18px; padding:30px; display:flex; justify-content:space-between; gap:15px; overflow:hidden; }
.upcoming-suite { background:#e8dcfb; }
.upcoming-advent { background:#f6e7d8; }
.upcoming-tag { display:inline-block; border:1px solid var(--ink); border-radius:999px; padding:6px 10px; background:var(--paper); font-size:10px; letter-spacing:.07em; }
.upcoming-product h3 { margin:24px 0 10px; font-size:32px; }
.upcoming-product p { color:#535852; font-size:14px; max-width:310px; margin:0; }
.upcoming-suite-mark { width:110px; align-self:center; transform:rotate(-10deg); display:grid; gap:8px; flex-shrink:0; }
.upcoming-suite-mark span { height:25px; border:1px solid var(--ink); border-radius:7px; background:var(--paper); }
.upcoming-suite-mark span:nth-child(2) { margin-left:12px; background:var(--lime); }
.upcoming-suite-mark span:nth-child(3) { margin-left:24px; background:var(--pink); }
.upcoming-advent-mark { align-self:center; display:grid; grid-template-columns:repeat(2,42px); gap:7px; transform:rotate(8deg); flex-shrink:0; }
.upcoming-advent-mark span { height:42px; display:grid; place-items:center; background:var(--paper); border:1px solid var(--ink); border-radius:7px; font-size:10px; }
.upcoming-advent-mark span:nth-child(2) { background:var(--pink); }
.upcoming-advent-mark span:nth-child(3) { background:var(--lime); }
@media(min-width:901px) and (max-width:1200px) {
 .nav-links>a { padding-inline:9px; font-size:12px; }
 .header-inner { gap:14px; }
}
@media(max-width:900px) {
 .multideck-showcase-copy { padding:35px; }
 .product-workflow-heading,.product-details-layout { gap:35px; }
 .product-features { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
 .upcoming-suite-mark { width:80px; }
 .upcoming-advent-mark { grid-template-columns:repeat(2,34px); }
 .upcoming-advent-mark span { height:34px; }
}
@media(max-width:650px) {
 .products-hero { padding:42px 0 55px; }
 .products-heading { margin-bottom:30px; }
 .products-heading h1 { font-size:clamp(40px,10vw,60px); }
 .products-heading>p:last-child { font-size:16px; }
 .multideck-showcase { grid-template-columns:1fr; }
 .multideck-showcase-copy { padding:28px; }
 .multideck-showcase-copy>img { width:235px; margin:22px 0 14px; }
 .multideck-showcase-copy>p { font-size:16px; margin-bottom:22px; }
 .multideck-showcase-image { min-height:220px; }
 .product-workflow { padding:60px 0; }
 .product-workflow-heading { grid-template-columns:1fr; gap:18px; margin-bottom:35px; }
 .product-workflow-heading>p { font-size:15px; }
 .product-features { gap:28px 18px; }
 .product-feature h3 { font-size:21px; margin:16px 0 10px; }
 .product-feature p { font-size:13px; }
 .product-details { padding:60px 0; }
 .product-details-layout { grid-template-columns:1fr; gap:30px; }
 .product-shipment { padding:20px; }
 .products-next { padding:65px 0 45px; }
 .products-upcoming { grid-template-columns:1fr; }
 .upcoming-product { min-height:200px; padding:24px; }
 .upcoming-product h3 { font-size:27px; }
}
@media(max-width:380px) {
 .product-features { grid-template-columns:1fr; }
 .upcoming-product { gap:8px; }
 .upcoming-suite-mark { width:65px; }
 .upcoming-advent-mark { grid-template-columns:repeat(2,29px); gap:5px; }
 .upcoming-advent-mark span { height:29px; }
}
@media(prefers-reduced-motion:reduce) { .multideck-site-link span { transition:none; } }
@media(min-width:901px) and (max-width:1040px) {
 .nav { gap:10px; }
 .nav-links>a { padding-inline:6px; font-size:12px; }
}
@media(max-width:380px) {
 .products-heading h1 { font-size:35px; }
}

/* Multideck's reason for being and an explorable freight journey. */
.product-why { padding:65px 0 90px; }
.product-why-layout { display:grid; grid-template-columns:1fr 1fr; gap:85px; border-top:1px solid var(--rule); padding-top:48px; }
.product-why h2 { font-size:clamp(35px,4vw,54px); }
.product-why-copy>p { color:var(--muted); font-size:17px; max-width:515px; }
.product-why-copy .product-why-emphasis { color:#0e6159; font-size:23px; line-height:1.3; letter-spacing:-.03em; margin:30px 0 0; }
.product-details-heading { display:flex; justify-content:space-between; align-items:end; gap:35px; margin-bottom:36px; }
.product-details-heading .ws-eyebrow { color:#b8dfcc; }
.product-details-heading h2 { font-size:clamp(35px,4vw,52px); }
.product-details-heading>p { color:#d1e1d9; max-width:330px; margin:0; font-size:15px; }
.freight-journey { border:1px solid rgba(255,255,255,.3); border-radius:20px; background:#183c35; padding:0 28px 28px; }
.freight-waypoints { position:sticky; top:95px; z-index:2; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:22px 0 14px; background:#183c35; }
.freight-waypoints a { display:flex; align-items:center; gap:9px; min-height:52px; border:1px solid rgba(255,255,255,.25); border-radius:11px; padding:10px 16px; color:#e8f4eb; font-size:14px; transition:background 160ms var(--ease),transform 160ms var(--ease),border-color 160ms var(--ease); }
.freight-waypoints a span { font-size:10px; }
.freight-waypoints a:hover { border-color:#e8f4eb; }
.freight-waypoints a[aria-current=step] { background:var(--lime); border-color:var(--lime); color:var(--ink); font-weight:650; }
.freight-waypoints a:active { transform:scale(.98); }
.freight-waypoints a:focus-visible { outline:3px solid var(--lime); outline-offset:3px; }
.freight-track { grid-column:1/-1; height:3px; background:rgba(255,255,255,.2); border-radius:3px; overflow:hidden; margin:6px 2px 0; visibility:hidden; }
.freight-journey.is-enhanced .freight-track { visibility:visible; }
.freight-track span { display:block; background:var(--lime); height:100%; width:25%; transition:width 260ms var(--ease); }
.freight-story-step { padding:52px 12px; scroll-margin-top:70px; }
.freight-story-step + .freight-story-step { border-top:1px solid rgba(255,255,255,.2); }
.freight-inline-paper { max-width:480px; margin-top:30px; }
.freight-step { color:#bfddcd; font-size:10px; letter-spacing:.12em; }
.freight-copy h3 { color:var(--paper); font-size:clamp(29px,3vw,40px); max-width:440px; margin:18px 0; }
.freight-copy p { color:#d1e1d9; font-size:15px; max-width:470px; margin:0; }
.freight-paper { color:var(--ink); background:var(--paper); border:1px solid var(--ink); border-radius:15px; padding:24px; box-shadow:5px 5px 0 rgba(0,0,0,.22); }
.freight-paper-1 { background:#e8dcfb; }
.freight-paper-2 { background:#dcf2a9; }
.freight-paper-3 { background:#e2eee5; }
.freight-paper-top { display:flex; justify-content:space-between; align-items:center; font-size:10px; letter-spacing:.1em; border-bottom:1px solid rgba(25,26,24,.2); padding-bottom:15px; }
.freight-paper-top span:last-child { font-size:23px; line-height:1; }
.freight-paper ul { list-style:none; display:grid; gap:13px; padding:0; margin:21px 0; }
.freight-paper li { display:flex; align-items:center; gap:10px; font-size:14px; }
.freight-paper li svg { width:16px; height:16px; }
.freight-paper-bottom { display:flex; align-items:center; justify-content:space-between; border-top:1px solid rgba(25,26,24,.2); padding-top:14px; font-size:11px; }
.freight-paper-bottom span { font-size:18px; }
.freight-visual { display:none; }
.freight-visual-stage { position:relative; overflow:hidden; min-height:390px; display:flex; flex-direction:column; justify-content:space-between; padding:26px; border:1px solid rgba(255,255,255,.23); border-radius:18px; background:#24574c; }
.freight-visual-stage::before { content:''; position:absolute; width:290px; height:290px; right:-80px; top:-110px; border:1px solid rgba(211,247,131,.35); border-radius:50%; }
.freight-visual-orbit { position:absolute; width:320px; height:320px; left:-100px; bottom:-150px; border:1px dashed rgba(211,247,131,.4); border-radius:50%; transform:translateY(var(--freight-drift,0px)); }
.freight-visual-spark { position:absolute; right:30px; top:64px; color:var(--lime); font-size:31px; line-height:1; transform:translateY(var(--freight-counter-drift,0px)); }
.freight-visual-header,.freight-visual-footer { position:relative; display:flex; justify-content:space-between; align-items:center; color:#d6e9dc; font-size:10px; font-weight:600; letter-spacing:.12em; }
.freight-visual-footer span:last-child { color:var(--lime); font-size:23px; line-height:1; }
.freight-visual-cards { position:relative; display:grid; align-items:center; min-height:250px; margin:24px 4px; }
.freight-visual-card { grid-area:1/1; opacity:0; visibility:hidden; transform:translateY(14px) rotate(2deg) scale(.98); transition:opacity 220ms var(--ease),transform 220ms var(--ease),visibility 220ms; }
.freight-visual-card.is-active { opacity:1; visibility:visible; transform:translateY(0) rotate(0) scale(1); }
.freight-visual-card .freight-paper { position:relative; }
.freight-disclaimer { color:#bdd3c7; font-size:11px; margin:24px 12px 0; }
@media(min-width:901px) {
 .freight-journey.is-enhanced .freight-story-grid { display:grid; grid-template-columns:1fr .88fr; gap:55px; }
 .freight-journey.is-enhanced .freight-story-step { min-height:min(68vh,560px); display:flex; flex-direction:column; justify-content:center; }
 .freight-journey.is-enhanced .freight-inline-paper { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
 .freight-journey.is-enhanced .freight-visual { display:block; position:sticky; top:clamp(155px,calc(50vh - 185px),210px); align-self:start; padding:26px 0; }
}
.product-reassurance { background:#edf2ea; padding:70px 0; }
.product-reassurance .wrap { display:grid; grid-template-columns:1fr 1fr; gap:85px; align-items:end; }
.product-reassurance h2 { font-size:clamp(32px,3.5vw,46px); }
.product-reassurance .wrap>p { color:var(--muted); max-width:490px; font-size:16px; margin:0; }
.multideck-showcase-image { overflow:hidden; }
.multideck-showcase-image img { transition:transform 280ms var(--ease); }
@media(hover:hover) { .multideck-showcase:hover .multideck-showcase-image img { transform:scale(1.025); } }
@media(max-width:900px) {
 .product-why-layout,.product-reassurance .wrap { gap:40px; }
 .freight-waypoints { position:static; }
 .freight-story-step { scroll-margin-top:0; }
}
@media(max-width:650px) {
 .product-why { padding:45px 0 65px; }
 .product-why-layout,.product-reassurance .wrap { grid-template-columns:1fr; gap:20px; }
 .product-why-copy>p { font-size:15px; }
 .product-why-copy .product-why-emphasis { font-size:21px; }
 .product-details-heading { display:block; margin-bottom:25px; }
 .product-details-heading>p { margin-top:18px; }
 .freight-journey { padding:0 18px 18px; }
 .freight-waypoints { gap:5px; padding-top:18px; }
 .freight-waypoints a { min-height:46px; justify-content:center; padding:8px 4px; font-size:12px; }
 .freight-waypoints a span { display:none; }
 .freight-story-step { padding:38px 2px; }
 .freight-copy h3 { font-size:30px; margin:15px 0; }
 .freight-copy p { font-size:14px; }
 .freight-paper { padding:20px; }
 .freight-disclaimer { margin-inline:2px; }
 .product-reassurance { padding:55px 0; }
 .product-reassurance .wrap>p { font-size:15px; }
}
@media(prefers-reduced-motion:reduce) {
 .products-page *, .products-page *::before, .products-page *::after { transition:none!important; animation:none!important; }
 .freight-visual-orbit, .freight-visual-spark { transform:none!important; }
}

/* Staggered navigation, adapted from React Bits for Databrain's touch-sized screens. */
.nav-backdrop, .nav-layers, .nav-curtain, .nav-number, .nav-meta { display:none; }

@media (max-width:900px), (max-width:1366px) and (pointer:coarse) {
  /* Avoid showing the no-JavaScript navigation while the menu script starts. */
  html.nav-preparing:not(.js) .nav { display:none!important; }
  html.nav-preparing:not(.js) .header-inner { flex-wrap:nowrap; padding-block:0; }
  html.menu-is-open, html.menu-is-open body { overflow:hidden; }
  html.menu-is-open body { padding-top:77px; }
  .header-inner { min-height:76px; }
  .js .header.menu-open { position:fixed; inset:0 0 auto; }
  .js .header .brand, .js .menu-toggle { position:relative; z-index:4; }
  .js .header.menu-open::after {
    content:''; position:fixed; inset:0 0 auto; z-index:3; height:76px;
    background:var(--paper); border-bottom:1px solid var(--rule); pointer-events:none;
  }
  .menu-toggle {
    display:inline-flex; flex-direction:row; align-items:center; justify-content:center;
    gap:10px; width:auto; height:46px; padding:0; border:0; border-radius:0;
    background:transparent; box-shadow:none;
  }
  .menu-toggle[aria-expanded=true] { background:transparent; }
  .menu-toggle .menu-toggle-label {
    display:block; width:auto; height:auto; background:none; font-size:14px;
    font-weight:600; line-height:1; transform:none;
  }
  .menu-toggle .menu-toggle-icon {
    display:flex; flex:0 0 46px; flex-direction:column; align-items:center;
    justify-content:center; gap:5px; width:46px; height:46px;
    border:1.5px solid var(--ink); border-radius:50%; background:var(--lime);
    box-shadow:0 3px 0 var(--ink); transform:none;
    transition:background-color 160ms var(--ease);
  }
  .menu-toggle .menu-toggle-icon span {
    display:block; width:18px; height:1.5px; background:var(--ink);
    transition:transform 240ms var(--ease);
  }
  .menu-toggle[aria-expanded=true] .menu-toggle-label,
  .menu-toggle[aria-expanded=true] .menu-toggle-icon { transform:none; }
  .menu-toggle[aria-expanded=true] .menu-toggle-label { font-weight:700; }
  .menu-toggle[aria-expanded=true] .menu-toggle-icon { background:var(--pink); }
  .menu-toggle[aria-expanded=true] .menu-toggle-icon span:first-child { transform:translateY(3.25px) rotate(45deg); }
  .menu-toggle[aria-expanded=true] .menu-toggle-icon span:last-child { transform:translateY(-3.25px) rotate(-45deg); }

  .js .nav-backdrop {
    display:block; position:fixed; inset:0; z-index:1; background:rgba(25,26,24,.28);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity 300ms ease, visibility 0s linear 300ms;
  }
  .js .header.menu-open .nav-backdrop {
    opacity:1; visibility:visible; pointer-events:auto;
    transition:opacity 300ms ease, visibility 0s;
  }
  .js .nav-layers {
    display:block; position:fixed; inset:0 0 0 auto; z-index:2; width:min(560px,100%);
    overflow:hidden; visibility:hidden; pointer-events:none; transition:visibility 0s linear 460ms;
  }
  .js .header.menu-open .nav-layers { visibility:visible; transition-delay:0s; }
  .nav-layers span {
    position:absolute; inset:0; display:block; background:var(--purple-soft);
    transform:translateX(102%); transition:transform 380ms cubic-bezier(.4,0,1,1);
  }
  .nav-layers span:last-child { background:var(--lime); }
  .header.menu-open .nav-layers span { transform:translateX(0); transition:transform 560ms var(--ease); }
  .header.menu-open .nav-layers span:last-child { transition-delay:55ms; }

  /* Fill the space to the left of the open drawer before leaving this page. */
  .js .nav-curtain {
    display:block; position:fixed; inset:0 min(560px,100%) 0 0; z-index:2;
    background:var(--lime); pointer-events:none; visibility:hidden;
    transform:scaleX(0); transform-origin:right center;
    transition:transform 420ms var(--ease), visibility 0s;
  }
  .js .header.menu-cover .nav-curtain {
    visibility:visible; transform:scaleX(1); transition:transform 420ms var(--ease), visibility 0s;
  }

  .js .nav {
    position:fixed; inset:0 0 0 auto; z-index:3; display:flex; flex-direction:column;
    align-items:stretch; gap:22px; width:min(560px,100%); height:100dvh; max-height:none;
    overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain;
    padding:104px 32px calc(28px + env(safe-area-inset-bottom));
    background:var(--paper); border:0; border-radius:0; box-shadow:none;
    visibility:hidden; opacity:1; transform:translateX(102%); pointer-events:none;
    transition:transform 380ms cubic-bezier(.4,0,1,1), visibility 0s linear 380ms;
  }
  .js .nav.open {
    visibility:visible; opacity:1; transform:translateX(0); pointer-events:auto;
    transition:transform 600ms var(--ease) 110ms, visibility 0s;
  }
  .nav-links {
    display:flex; flex:0 0 auto; flex-direction:column; align-items:stretch; gap:0;
    padding:0; border:0; border-radius:0; background:none;
  }
  .nav-links>a, .nav-links>a[aria-current=page] {
    display:flex; justify-content:flex-start; align-items:baseline; gap:10px;
    min-height:51px; padding:5px 0; overflow:hidden; border:0; border-radius:0;
    background:none; color:var(--ink); font-size:clamp(28px,4.7vw,40px);
    font-weight:550; letter-spacing:-.045em; line-height:1.16; white-space:normal;
  }
  .nav-links>a[aria-current=page] .nav-item-label {
    text-decoration:underline; text-decoration-color:var(--purple);
    text-decoration-thickness:3px; text-underline-offset:6px;
  }
  .nav-number {
    display:block; flex:0 0 auto; margin-top:.15em; color:#655dc9;
    font-size:12px; font-weight:600; letter-spacing:0; line-height:1;
  }
  .js .nav-item-label, .js .nav-number {
    opacity:0; transform:translateY(100%);
    transition:transform 360ms var(--ease), opacity 200ms ease;
  }
  .js .nav.open .nav-item-label, .js .nav.open .nav-number {
    opacity:1; transform:translateY(0);
    transition:transform 600ms var(--ease), opacity 320ms ease;
    transition-delay:calc(160ms + var(--nav-index) * 55ms);
  }
  .nav .nav-cta {
    display:flex; flex:0 0 auto; align-self:stretch; justify-content:space-between;
    min-height:52px; margin: auto 0 0; padding-left:18px; font-size:14px;
  }
  .nav-meta { display:flex; flex:0 0 auto; flex-wrap:wrap; gap:5px 20px; padding-top:17px; border-top:1px solid var(--rule); font-size:13px; }
  .nav-meta>span { flex-basis:100%; color:var(--muted); font-size:11px; font-weight:650; letter-spacing:.07em; text-transform:uppercase; }
  .nav-meta a { min-height:30px; }
  .nav-meta a:hover { text-decoration:underline; }

  /* Carry the full curtain across the document load, then pull it off to the right. */
  html.js.menu-arrival, html.js.menu-arrival body { overflow:hidden; }
  html.js.menu-arrival body { padding-top:77px; }
  html.js.menu-arrival .header { position:fixed; inset:0 0 auto; }
  html.js.menu-arrival .header::after {
    content:''; position:fixed; inset:0 0 auto; z-index:3; height:76px;
    background:var(--paper); border-bottom:1px solid var(--rule); pointer-events:none;
  }
  html.js.menu-arrival .nav-backdrop, html.js.menu-entering .nav-backdrop,
  html.js.menu-entering .header.menu-open .nav-backdrop {
    opacity:0; visibility:hidden; transition:none;
  }
  html.js.menu-arrival .nav-layers, html.js.menu-entering .nav-layers,
  html.js.menu-entering .header.menu-open .nav-layers { visibility:hidden; transition:none; }
  html.js.menu-arrival .nav { visibility:visible; opacity:1; transform:translateX(0); pointer-events:none; transition:none; }
  html.js.menu-arrival .nav-curtain, html.js.menu-entering .nav-curtain {
    inset:0; visibility:visible; transform:translateX(0); transition:none;
  }
  html.js.menu-entering.menu-revealing .nav-curtain {
    transform:translateX(102%); transition:transform 420ms var(--ease);
  }
  html.js.menu-entering .nav:not(.open) {
    transition:transform 420ms var(--ease), visibility 0s linear 420ms;
  }
  html.js.menu-arrival .nav-item-label, html.js.menu-arrival .nav-number,
  html.js.menu-entering .nav-item-label, html.js.menu-entering .nav-number { opacity:1; transform:none; transition:none; }
  html.js.menu-arrival .menu-toggle-label { font-size:0; }
  html.js.menu-arrival .menu-toggle-label::after { content:'Close'; font-size:14px; font-weight:700; }
  html.js.menu-arrival .menu-toggle-icon { background:var(--pink); }
  html.js.menu-arrival .menu-toggle-icon span:first-child { transform:translateY(3.25px) rotate(45deg); }
  html.js.menu-arrival .menu-toggle-icon span:last-child { transform:translateY(-3.25px) rotate(-45deg); }
  html.menu-restoring .nav, html.menu-restoring .nav-backdrop, html.menu-restoring .nav-layers, html.menu-restoring .nav-curtain,
  html.menu-restoring .nav-layers span, html.menu-restoring .nav-item-label, html.menu-restoring .nav-number,
  html.menu-restoring .menu-toggle-icon, html.menu-restoring .menu-toggle-icon span { transition:none!important; }

  html:not(.js) .header { position:relative; }
  html:not(.js) .header-inner { flex-wrap:wrap; padding-block:14px; }
  html:not(.js) .menu-toggle { display:none; }
  html:not(.js) .nav {
    position:static; display:flex; flex-direction:column; align-items:stretch;
    flex-basis:100%; gap:16px; max-height:none; overflow:visible; padding:0;
    visibility:visible; opacity:1; transform:none; pointer-events:auto; border:0; box-shadow:none;
  }
}

@media (max-width:620px) {
  .header-inner { min-height:72px; }
  html.menu-is-open body { padding-top:73px; }
  .js .header.menu-open::after { height:72px; }
  html.js.menu-arrival body { padding-top:73px; }
  html.js.menu-arrival .header::after { height:72px; }
  .js .nav { width:100%; padding:96px 24px calc(24px + env(safe-area-inset-bottom)); }
  .js .nav-layers { width:100%; }
}

@media (prefers-reduced-motion:reduce) {
  .js .nav, .js .nav.open, .js .nav-backdrop, .js .nav-layers, .js .nav-curtain,
  .js .header.menu-open .nav-backdrop, .js .header.menu-open .nav-layers,
  .nav-layers span, .js .header.menu-open .nav-layers span,
  .js .nav-item-label, .js .nav-number, .js .nav.open .nav-item-label, .js .nav.open .nav-number,
  .menu-toggle .menu-toggle-icon, .menu-toggle .menu-toggle-icon span { transition:none; }
}

/* Company navigation: the desktop menu groups related pages; the mobile drawer
   keeps the same pages directly reachable. */
.nav-links > .nav-company-mobile { display:none; }
.nav-company { position:relative; }
.nav-company summary {
  display:flex; align-items:center; justify-content:center; gap:7px;
  min-height:40px; padding:9px 14px; border:1px solid transparent;
  border-radius:999px; font-size:13px; font-weight:550; white-space:nowrap;
  list-style:none; cursor:pointer; transition:background-color 160ms var(--ease),border-color 160ms var(--ease);
}
.nav-company summary::-webkit-details-marker { display:none; }
.nav-company summary svg { width:15px; height:15px; transition:transform 180ms var(--ease); }
.nav-company[open]:not([data-state=closing]) summary svg { transform:rotate(180deg); }
.nav-company[open]:not([data-state=closing]) summary, .nav-company[data-current=true] summary { background:var(--pink); border-color:var(--ink); }
.nav-company summary:focus-visible, .nav-company-panel a:focus-visible { outline:3px solid #5c4fc0; outline-offset:3px; }
.nav-company-panel {
  position:absolute; top:calc(100% + 12px); right:0; z-index:10;
  width:240px; padding:8px; background:var(--paper); border:1px solid var(--ink);
  border-radius:18px; box-shadow:0 4px 0 var(--ink);
}
.nav-company-panel a { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:48px; padding:11px 14px; border-radius:11px; font-size:14px; }
.nav-company-panel a:hover, .nav-company-panel a[aria-current=page] { background:var(--purple-soft); text-decoration:none; }
.nav-company-panel a span:last-child { color:var(--muted); font-size:18px; transition:transform 160ms var(--ease); }
.nav-company-panel a:hover span:last-child, .nav-company-panel a:focus-visible span:last-child { transform:translateX(4px); }
.nav-company[data-state] .nav-company-panel {
  opacity:0; transform:translateY(-8px) scale(.97); transform-origin:top right;
  pointer-events:none; transition:opacity 140ms ease, transform 160ms var(--ease);
}
.nav-company[data-state=open] .nav-company-panel {
  opacity:1; transform:translateY(0) scale(1); pointer-events:auto;
  transition:opacity 180ms ease, transform 220ms var(--ease);
}
.nav-company[data-state] .nav-company-panel a {
  opacity:0; transform:translateY(-4px);
  transition:opacity 120ms ease, transform 140ms var(--ease), background-color 160ms var(--ease);
}
.nav-company[data-state=open] .nav-company-panel a {
  opacity:1; transform:translateY(0);
  transition:opacity 180ms ease, transform 220ms var(--ease), background-color 160ms var(--ease);
}
.nav-company[data-state=open] .nav-company-panel a:nth-child(2) { transition-delay:35ms, 35ms, 0ms; }
.nav-company[data-state=open] .nav-company-panel a:nth-child(3) { transition-delay:70ms, 70ms, 0ms; }
@media (max-width:900px), (max-width:1366px) and (pointer:coarse) {
  .nav-links > .nav-company-mobile { display:flex; }
  .nav-company { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .nav-company summary, .nav-company summary svg, .nav-company-panel,
  .nav-company-panel a, .nav-company-panel a span:last-child { transition:none!important; }
}

/* Public workshop dates use the Brainwave list composition and full prices. */
.public-workshops { background:#f0efec; }
.public-workshops-heading { display:flex; justify-content:space-between; align-items:end; gap:38px; margin-bottom:36px; }
.public-workshops-heading h2 { font-size:clamp(36px,4.2vw,56px); }
.public-workshops-heading > p { max-width:350px; margin:0; color:var(--muted); font-size:16px; }
.public-workshop-status { min-height:110px; padding:28px; border:1px solid var(--rule); border-radius:18px; background:var(--paper); color:var(--muted); }
.public-workshop-status p { margin:0; }
.public-workshop-status h3 { color:var(--ink); font-size:25px; margin:0 0 8px; }
.public-workshop-status .text-link { margin-top:18px; }
.public-workshop-status.is-empty { min-height:0; padding:0; overflow:hidden; border-color:var(--ink); background:var(--purple-soft); box-shadow:0 4px 0 var(--ink); }
.public-workshop-empty { display:grid; grid-template-columns:minmax(0,1fr) minmax(240px, .85fr); gap:24px; align-items:center; padding:clamp(28px,4.5vw,64px); }
.public-workshop-empty-copy { max-width:500px; }
.public-workshop-empty-label { display:block; margin-bottom:18px; color:var(--ink); font-size:11px; font-weight:600; letter-spacing:.13em; }
.public-workshop-empty-copy h3 { margin:0 0 16px; font-size:clamp(30px,3vw,40px); line-height:1.13; letter-spacing:-.045em; }
.public-workshop-empty-copy p { max-width:430px; color:var(--ink); line-height:1.6; }
.public-workshop-status .public-workshop-empty-copy .btn { margin-top:24px; color:var(--ink); text-decoration:none; }
.public-workshop-empty-art { display:block; width:100%; max-width:390px; justify-self:center; overflow:visible; }
.public-workshop-empty-calendar, .public-workshop-empty-spark { transform-box:fill-box; transform-origin:center; animation-play-state:paused; }
.public-workshop-empty-calendar { animation:workshop-calendar-sway 6s ease-in-out infinite; animation-play-state:paused; }
.public-workshop-empty-spark { animation:workshop-calendar-spark 6s ease-in-out infinite; animation-play-state:paused; }
.is-animating .public-workshop-empty-calendar, .is-animating .public-workshop-empty-spark { animation-play-state:running; }
@keyframes workshop-calendar-sway {
  0%, 62%, 100% { transform:translateY(0) rotate(0); }
  20% { transform:translateY(-5px) rotate(-3deg); }
  42% { transform:translateY(-2px) rotate(2deg); }
}
@keyframes workshop-calendar-spark {
  0%, 16%, 65%, 100% { transform:scale(1) rotate(0); }
  38% { transform:scale(1.12) rotate(20deg); }
}
.public-workshop-list { display:grid; gap:16px; }
.public-workshop-list:not(:empty) + .public-workshop-retry { margin-top:16px; }
.public-workshop-status:empty { display:none; }
.public-workshop-retry { margin-top:16px; }
.public-workshop-card { display:grid; grid-template-columns:100px minmax(0,1fr) 190px; gap:26px; align-items:center; padding:26px; border:1px solid var(--ink); border-radius:20px; background:var(--paper); }
.public-workshop-date { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-height:128px; border:1px solid var(--ink); border-radius:16px; background:var(--purple-soft); box-shadow:0 3px 0 var(--ink); }
.public-workshop-date[data-colour=lime] { background:var(--lime); }
.public-workshop-date[data-colour=peach] { background:#f4c39f; }
.public-workshop-date[data-colour=pink] { background:#f0c3df; }
.public-workshop-date span { font-size:11px; letter-spacing:.13em; text-transform:uppercase; }
.public-workshop-date strong { font-size:43px; line-height:1.2; font-weight:500; letter-spacing:-.06em; }
.public-workshop-date small { font-size:12px; }
.public-workshop-copy .public-workshop-category { margin:0 0 8px; color:var(--muted); font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.public-workshop-copy h3 { margin:0 0 10px; font-size:24px; letter-spacing:-.04em; }
.public-workshop-copy > p:not(.public-workshop-category) { max-width:560px; margin:0 0 15px; color:var(--muted); font-size:14px; }
.public-workshop-facts { display:flex; flex-wrap:wrap; gap:8px 18px; color:var(--muted); font-size:12px; }
.public-workshop-details { margin-top:14px; font-size:13px; }
.public-workshop-details summary { width:fit-content; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.public-workshop-details ul { margin:10px 0 0; padding-left:18px; color:var(--muted); }
.public-workshop-price { display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding-left:22px; border-left:1px solid var(--rule); }
.public-workshop-price strong { font-size:30px; font-weight:500; letter-spacing:-.05em; }
.public-workshop-price span { color:var(--muted); font-size:12px; }
.public-workshop-price .btn { width:100%; justify-content:space-between; margin-top:8px; font-size:13px; }
@media (max-width:700px) {
  .public-workshops-heading { display:block; }
  .public-workshops-heading > p { margin-top:20px; }
  .public-workshop-empty { grid-template-columns:1fr; gap:12px; }
  .public-workshop-empty-art { max-width:260px; }
  .public-workshop-card { grid-template-columns:72px minmax(0,1fr); gap:18px; padding:20px; }
  .public-workshop-date { min-height:98px; }
  .public-workshop-date strong { font-size:34px; }
  .public-workshop-price { grid-column:1 / -1; padding:16px 0 0; border-left:0; border-top:1px solid var(--rule); }
  .public-workshop-price .btn { width:auto; min-width:185px; }
}
@media (prefers-reduced-motion:reduce) {
  .public-workshop-empty-calendar, .public-workshop-empty-spark { animation:none; }
}
.public-workshop-status.has-results { min-height:0; margin-bottom:16px; padding:0; border:0; background:transparent; font-size:13px; }
.public-workshop-status a { color:var(--ink); text-decoration:underline; text-underline-offset:4px; }

/* Case studies: bespoke project pages with finite SVG arrivals (data-hm-scene). */
.cs-page { --wine:#7c2c40; }
.cs-page .ws-eyebrow { color:var(--muted); }
.cs-hero { padding:60px 0 20px; }
.cs-hero-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:70px; align-items:center; }
.cs-hero h1 { font-size:clamp(46px,5vw,74px); }
.cs-lede { color:var(--muted); font-size:19px; line-height:1.65; max-width:520px; margin:28px 0 0; }
.cs-hero-media { position:relative; margin:0; }
.cs-hero-photo { overflow:hidden; border:1px solid var(--ink); border-radius:22px; box-shadow:0 4px 0 var(--ink); aspect-ratio:16/10; }
.cs-hero-photo img { width:100%; height:100%; object-fit:cover; }
.cs-hero-media figcaption { margin-top:16px; padding-left:118px; color:var(--muted); font-size:13px; }
.cs-sticker { position:absolute; left:-34px; bottom:-34px; width:138px; height:138px; transition:transform var(--arrive) var(--ease); }
@media(hover:hover) { .cs-hero-media:hover .cs-sticker { transform:rotate(-8deg) scale(1.03); } }
.cs-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; margin:70px 0 0; padding:24px 0 0; border-top:1px solid var(--rule); }
.cs-facts dt { margin-bottom:6px; color:var(--muted); font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.cs-facts dd { margin:0; font-size:17px; font-weight:550; letter-spacing:-.02em; line-height:1.35; }

.cs-head { max-width:640px; margin-bottom:44px; }
.cs-head h2 { font-size:clamp(36px,4vw,54px); }
.cs-head>p:last-child:not(.ws-eyebrow) { margin:22px 0 0; color:var(--muted); font-size:17px; max-width:560px; }
.cs-copy { max-width:500px; color:#565951; font-size:17px; line-height:1.75; }
.cs-split { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:80px; align-items:center; }
.cs-split .cs-head { margin-bottom:28px; }

.cs-figure { margin:0; }
.cs-figure>svg { width:100%; height:auto; overflow:visible; }
.cs-figure figcaption { margin-top:18px; color:var(--muted); font-size:13px; }
.cs-figure text { font-size:16px; font-weight:500; fill:var(--ink); letter-spacing:-.01em; }
.cs-figure .cs-svg-label text { font-size:13px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.cs-figure text.cs-svg-strong, .cs-figure text.cs-svg-bold { font-weight:650; }
.cs-figure text.cs-svg-strong { font-size:17px; }
.cs-figure text.cs-svg-muted { fill:var(--muted); font-size:14px; }
.cs-figure text.cs-svg-small { font-size:14px; }
.cs-figure text.cs-svg-num { font-size:14px; font-weight:700; }
.cs-figure text.cs-svg-stat { font-size:60px; font-weight:550; letter-spacing:-.05em; }
.cs-checks, .cs-share { padding:32px; border:1px solid var(--ink); border-radius:22px; background:var(--panel); }

.cs-how { background:linear-gradient(var(--paper),var(--panel) 30%,var(--panel) 70%,var(--paper)); }
.cs-how-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:70px; align-items:center; }
.cs-engine, .cs-pistes { padding:34px; border:1px solid var(--ink); border-radius:22px; background:var(--paper); box-shadow:0 4px 0 var(--ink); }
.cs-steps { list-style:none; margin:0; padding:0; }
.cs-steps li { display:grid; grid-template-columns:44px 1fr; gap:16px; padding:22px 0; border-top:1px solid var(--rule); }
.cs-steps li:last-child { border-bottom:1px solid var(--rule); }
.cs-steps li>span { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--ink); border-radius:50%; background:var(--paper); font-size:12px; font-weight:650; }
.cs-steps h3, .cs-route h3, .cs-phases h3 { margin:4px 0 8px; font-size:21px; letter-spacing:-.03em; }
.cs-steps p { margin:0; color:var(--muted); font-size:15px; }

.cs-result { background:var(--ink); color:var(--paper); }
.cs-result .ws-eyebrow { color:var(--lime); }
.cs-result-grid { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:80px; align-items:center; }
.cs-result h2 { font-size:clamp(38px,4.2vw,58px); margin-bottom:26px; }
.cs-result-copy>p:not(.ws-eyebrow):not(.cs-big-stat) { color:#c4c5bd; font-size:17px; max-width:440px; }
.cs-big-stat { display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin:34px 0 0; padding-top:26px; border-top:1px solid #3c3d38; }
.cs-big-stat strong { color:var(--lime); font-size:clamp(56px,6vw,84px); font-weight:500; letter-spacing:-.06em; line-height:1; }
.cs-big-stat span { color:#c4c5bd; font-size:15px; max-width:190px; line-height:1.4; }
.cs-time { color:var(--paper); padding:34px; border:1px solid #3c3d38; border-radius:22px; background:#22231f; }
.cs-time text { fill:var(--paper); }
.cs-time text.cs-svg-ink { fill:var(--ink); }
.cs-time text.cs-svg-muted, .cs-time figcaption { fill:#abaea6; color:#abaea6; }

.cs-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.cs-card { padding:28px 26px 30px; border:1px solid var(--ink); border-radius:20px; background:var(--lime); transition:transform var(--arrive) var(--ease),box-shadow var(--arrive) var(--ease); }
.cs-card.tone-1 { background:var(--pink); }
.cs-card.tone-2 { background:var(--purple-soft); }
.cs-card h3 { margin:26px 0 10px; font-size:24px; }
.cs-card p { margin:0; font-size:15px; }
.cs-card-icon { display:grid; place-items:center; width:54px; height:54px; border:1px solid var(--ink); border-radius:50%; background:var(--paper); }
.cs-card-icon svg { width:30px; height:30px; }
@media(hover:hover) { .cs-card:hover { transform:translateY(-4px); box-shadow:0 5px 0 var(--ink); } }

.cs-routes { display:grid; gap:18px; }
.cs-route { padding:22px 24px; border:1px solid var(--ink); border-radius:18px; background:var(--paper); }
.cs-route h3 { display:flex; align-items:center; gap:12px; margin-top:0; }
.cs-route h3>span { width:14px; height:14px; border:1.3px solid var(--ink); border-radius:50%; background:var(--purple); flex-shrink:0; }
.cs-route-offer h3>span { background:var(--orange); }
.cs-route ol { margin:12px 0 0; padding-left:22px; color:#565951; font-size:15px; }
.cs-route li { margin-bottom:6px; padding-left:4px; }
.cs-route li::marker { font-weight:650; color:var(--ink); }
.cs-route-note { margin:4px 0 0; color:var(--muted); font-size:14px; }

.cs-split-reverse { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.cs-timeline { padding:26px; border:1px solid var(--ink); border-radius:22px; background:var(--paper); box-shadow:0 4px 0 var(--ink); }
.cs-tl-head { display:flex; justify-content:space-between; align-items:center; padding-bottom:16px; margin-bottom:6px; border-bottom:1px solid var(--rule); font-size:11px; font-weight:650; letter-spacing:.12em; }
.cs-tl-lang { display:flex; gap:6px; }
.cs-tl-lang b { padding:3px 9px; border:1px solid var(--ink); border-radius:99px; font-size:10px; letter-spacing:.08em; }
.cs-tl-lang b:first-child { background:var(--lime); }
.cs-timeline ol { position:relative; list-style:none; margin:0; padding:0; }
.cs-timeline ol::before { content:''; position:absolute; left:17px; top:24px; bottom:24px; width:1.5px; background:var(--rule); }
.cs-timeline li { position:relative; display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:14px; align-items:center; padding:11px 0; }
.cs-tl-dot { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--ink); border-radius:50%; background:var(--lime); }
.cs-tl-dot .icon { width:18px; height:18px; }
.cs-tl-scheduled .cs-tl-dot { background:var(--paper); border-style:dashed; }
.cs-tl-manual .cs-tl-dot { background:var(--purple-soft); }
.cs-tl-error .cs-tl-dot { background:var(--orange); }
.cs-tl-text { display:flex; flex-direction:column; min-width:0; }
.cs-tl-text strong { font-size:15px; font-weight:600; letter-spacing:-.01em; }
.cs-tl-text small { color:var(--muted); font-size:13px; }
.cs-timeline em { padding:4px 10px; border-radius:99px; background:var(--panel); font-size:11px; font-style:normal; font-weight:600; white-space:nowrap; }
.cs-tl-error em { background:#fbd9c6; }
.cs-tl-manual em { background:var(--purple-soft); }
.cs-checklist { list-style:none; margin:26px 0 0; padding:0; }
.cs-checklist li { display:flex; gap:14px; padding:16px 0; border-top:1px solid var(--rule); }
.cs-checklist .icon { width:22px; height:22px; margin-top:2px; padding:3px; border-radius:50%; background:var(--lime); flex-shrink:0; }
.cs-checklist strong { display:block; font-weight:600; }
.cs-checklist span { color:var(--muted); font-size:15px; }

.cs-progress-card { padding:60px; border:1px solid var(--ink); border-radius:22px; background:var(--purple-soft); box-shadow:0 4px 0 var(--ink); }
.cs-progress-card .cs-head { max-width:760px; }
.cs-progress-card .cs-head>p:last-child { color:#4e5049; }
.cs-season { padding:30px; border:1px solid var(--ink); border-radius:18px; background:var(--paper); }
.cs-season-list { display:none; list-style:none; margin:0; padding:0; }
.cs-season-list li, .cs-milestones li { position:relative; display:flex; flex-direction:column; padding:0 0 22px 34px; }
.cs-season-list li::before, .cs-milestones li::before { content:''; position:absolute; left:0; top:4px; width:16px; height:16px; border:1.3px solid var(--ink); border-radius:50%; background:var(--orange); }
.cs-season-list li:not(:last-child)::after, .cs-milestones li:not(:last-child)::after { content:''; position:absolute; left:8px; top:24px; bottom:2px; width:1.3px; background:var(--ink); }
.cs-season-list .cs-ms-live::before { background:var(--lime); }
.cs-season-list .cs-ms-season::before { background:var(--purple-soft); }
.cs-season-list strong, .cs-milestones strong { font-weight:650; }
.cs-season-list span, .cs-milestones span { color:var(--muted); font-size:15px; }
.cs-progress-notes { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:26px; }
.cs-progress-notes>div { padding:22px 24px; border:1px solid var(--ink); border-radius:18px; background:var(--paper); }
.cs-progress-notes p { margin:12px 0 0; font-size:15px; }
.cs-note-tag { display:inline-block; padding:4px 11px; border:1px solid var(--ink); border-radius:99px; background:var(--lime); font-size:10px; font-weight:650; letter-spacing:.1em; }
.cs-note-honest { background:var(--orange); }

.cs-phases { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:26px; align-items:center; }
.cs-phases article { height:100%; padding:28px; border:1px solid var(--ink); border-radius:20px; background:var(--paper); }
.cs-phases article:first-child { background:var(--lime); }
.cs-phase-label { font-size:11px; font-weight:650; letter-spacing:.12em; }
.cs-phases h3 { margin-top:12px; }
.cs-phases ul { margin:14px 0 0; padding-left:20px; font-size:15px; }
.cs-phases li { margin-bottom:8px; }
.cs-phases article>p { margin:16px 0 0; color:var(--muted); font-size:13px; }
.cs-phase-arrow { display:grid; place-items:center; width:48px; height:48px; border:1px solid var(--ink); border-radius:50%; background:var(--paper); }
.cs-next-project { padding-bottom:40px; }
.cs-next-project .project-row { margin-top:0; }
.cs-next-project .ws-eyebrow { margin-bottom:0; }

.cs-figure text.cs-hull-text { fill:var(--paper); font-weight:550; }
.cs-figure text.cs-svg-lime { fill:var(--lime); }
.cs-photo { margin:0; }
.cs-photo img { width:100%; aspect-ratio:16/10; object-fit:cover; border:1px solid var(--ink); border-radius:22px; }
.cs-photo figcaption { margin-top:14px; color:var(--muted); font-size:13px; }
.cs-rollout-intro { margin-bottom:60px; }
.cs-route-map>svg { width:100%; height:auto; overflow:visible; }
.cs-milestones { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; list-style:none; margin:26px 0 0; padding:0; text-align:center; }
.cs-milestones li { padding:0; }
.cs-milestones li::before, .cs-milestones li::after { display:none; }
.cs-milestones strong { font-size:20px; letter-spacing:-.03em; }
.cs-milestones span { display:block; max-width:270px; margin:6px auto 0; }
.cs-jenkar .cs-milestones li:nth-child(1)::before { background:var(--lime); }
.cs-jenkar .cs-milestones li:nth-child(2)::before { background:var(--pink); }
.cs-jenkar .cs-milestones li:nth-child(3)::before { background:var(--purple-soft); }
.cs-quote { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:70px; align-items:center; margin:0; padding:50px; border:1px solid var(--ink); border-radius:22px; background:var(--lime); box-shadow:0 4px 0 var(--ink); }
.cs-quote-photo { overflow:hidden; border:1px solid var(--ink); border-radius:18px; aspect-ratio:4/3; }
.cs-quote-photo img { width:100%; height:100%; object-fit:cover; object-position:55% 30%; }
.cs-quote blockquote { margin:0; }
.cs-quote blockquote p { margin:0; font-size:clamp(23px,2.3vw,32px); line-height:1.3; letter-spacing:-.03em; font-weight:500; }
.cs-quote figcaption { display:flex; flex-direction:column; margin-top:28px; padding-top:20px; border-top:1px solid var(--ink); }
.cs-quote figcaption strong { font-weight:650; }
.cs-quote figcaption span { font-size:14px; }
.cs-quote .ws-eyebrow { color:var(--ink); }
.cs-quote-section { padding-top:0; }
.work-featured { grid-column:1/-1; }
.work-featured .work-image { aspect-ratio:2.5; }
.case-index .work-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(20px,2.7vw,38px); }
.case-index .work-featured { grid-column:auto; }
.case-index .work-featured .work-image { aspect-ratio:1.7; }

@media(max-width:850px) {
  .case-index .work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:620px) {
  .case-index .work-grid { grid-template-columns:1fr; }
  .case-index .work-featured .work-image { aspect-ratio:1.65; }
}

.cs-multideck { --md:#1f6b58; --md-soft:#e3ede7; }
.cs-figure text.cs-svg-label-sm { font-size:14.5px; font-weight:550; }
.cs-figure text.cs-svg-tiny { font-size:12px; font-weight:650; }
.cs-gallery-head { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; }
.cs-gallery-head .text-link { margin-bottom:44px; }
.cs-shots { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.cs-shot { margin:0; }
.cs-shot img { width:100%; aspect-ratio:1; object-fit:cover; border:1px solid var(--ink); border-radius:20px; box-shadow:0 4px 0 var(--ink); background:var(--md-soft); }
.cs-shot figcaption { margin-top:18px; color:var(--muted); font-size:14px; }
.cs-shot figcaption strong { display:block; margin-bottom:2px; color:var(--ink); font-size:18px; font-weight:600; letter-spacing:-.02em; }
.cs-gallery-note { margin:26px 0 0; color:var(--muted); font-size:13px; }
.cs-figure text.cs-svg-paper { fill:var(--paper); }
.cs-time text.cs-svg-dim { fill:var(--muted); font-size:14px; }
.cs-figure text.cs-svg-link { fill:var(--md); text-decoration:underline; }
.cs-md-route .cs-milestones { gap:0; }
.cs-md-route .cs-milestones li { padding:0 14px; }
.cs-asks { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.cs-ask { padding:30px; border:1px solid var(--ink); border-radius:22px; background:var(--paper); box-shadow:0 4px 0 var(--ink); }
.cs-ask h3 { display:flex; align-items:center; gap:10px; margin:0 0 22px; font-size:24px; letter-spacing:-.03em; }
.cs-ask h3 svg { width:22px; height:22px; flex-shrink:0; }
.cs-ask.tone-1 h3 svg path { fill:var(--pink); }
.cs-ask.tone-2 h3 svg path { fill:var(--purple-soft); }
.cs-ask ul { list-style:none; margin:0; padding:0; }
.cs-ask li+li { margin-top:22px; padding-top:22px; border-top:1px solid var(--rule); }
.cs-ask-q { margin:0; padding:14px 16px; border-radius:16px 16px 16px 4px; background:var(--md-soft); font-size:16px; font-weight:500; line-height:1.45; letter-spacing:-.01em; }
.cs-ask.tone-1 .cs-ask-q { background:#fbe3fb; }
.cs-ask.tone-2 .cs-ask-q { background:var(--purple-soft); }
.cs-ask-a { margin:10px 0 0 4px; color:var(--muted); font-size:14px; }
.cs-md-flow .cs-head { max-width:720px; }
.cs-md-flow .cs-head>p:last-child { color:#c4c5bd; }
.cs-md-flow .cs-season-list strong { color:var(--paper); }
.cs-md-flow .cs-season-list span { color:#c4c5bd; }
.cs-md-flow .cs-season-list li::after { background:#abaea6; }
.cs-md-card { background:var(--md-soft); }
.cs-md-card .cs-route-map { padding:30px; border:1px solid var(--ink); border-radius:18px; background:var(--paper); }
.cs-multideck .cs-milestones li:nth-child(1)::before { background:var(--lime); }
.cs-multideck .cs-milestones li:nth-child(2)::before { background:var(--pink); }
.cs-multideck .cs-milestones li:nth-child(3)::before { background:#a9d5be; }

@media(max-width:1000px) {
  .cs-hero-grid, .cs-split, .cs-split-reverse, .cs-how-grid, .cs-result-grid { grid-template-columns:1fr; gap:48px; }
  .cs-hero-media { max-width:640px; margin-left:30px; }
  .cs-split-reverse>.cs-timeline { order:2; }
  .cs-quote { grid-template-columns:1fr; gap:36px; padding:36px; }
  .cs-gallery-head { display:block; }
  .cs-gallery-head .text-link { margin:-20px 0 30px; }
  .cs-copy, .cs-head { max-width:640px; }
  .cs-cards { grid-template-columns:1fr; max-width:560px; }
  .cs-asks { grid-template-columns:1fr; max-width:620px; }
  .cs-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cs-progress-card { padding:40px; }
}
@media(max-width:700px) {
  .cs-hero { padding-top:36px; }
  .cs-hero h1 { font-size:44px; }
  .cs-wines .cs-hero h1 { font-size:clamp(32px,11vw,44px); }
  .cs-lede { font-size:17px; }
  .cs-hero-media { margin-left:0; }
  .cs-sticker { left:auto; right:-8px; bottom:-48px; width:104px; height:104px; }
  .cs-hero-media figcaption { padding:0 110px 0 0; }
  .cs-facts { margin-top:50px; gap:20px 16px; }
  .cs-facts dd { font-size:15px; }
  .cs-checks, .cs-share, .cs-engine, .cs-pistes, .cs-time, .cs-season { padding:16px; border-radius:18px; }
  .cs-progress-card { padding:24px 18px; }
  .cs-season { padding:22px 20px 18px; }
  .cs-season>svg { display:none; }
  .cs-season-list { display:block; }
  .cs-route-map>svg { display:none; }
  .cs-milestones { display:block; margin:0; text-align:left; }
  .cs-milestones li { padding:0 0 22px 34px; }
  .cs-md-route .cs-milestones li { padding:0 0 22px 34px; }
  .cs-milestones li::before, .cs-milestones li:not(:last-child)::after { display:block; }
  .cs-milestones strong { font-size:17px; }
  .cs-milestones span { margin:2px 0 0; }
  .cs-rollout-intro { margin-bottom:40px; }
  .cs-shots { grid-template-columns:1fr; gap:34px; }
  .cs-asks { grid-template-columns:1fr; max-width:560px; }
  .cs-md-flow-figure>svg { display:none; }
  .cs-ask { padding:24px; }
  .cs-md-card .cs-route-map { padding:22px 20px 2px; }
  .cs-quote { padding:20px 20px 28px; }
  .work-featured .work-image { aspect-ratio:1.65; }
  .cs-progress-notes, .cs-phases { grid-template-columns:1fr; }
  .cs-phase-arrow { transform:rotate(90deg); margin:-8px auto; }
  .cs-timeline { padding:18px; }
  .cs-timeline li { grid-template-columns:36px minmax(0,1fr); }
  .cs-timeline em { grid-column:2; justify-self:start; margin-top:-4px; }
}
@media(prefers-reduced-motion:reduce) {
  .cs-sticker, .cs-card { transition:none; }
}
.research-section { overflow:hidden; }
.research-workshops { background:#f1f0ec; }
.research-implementation { background:var(--purple-soft); }
.research-layout { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(48px,8vw,130px); align-items:center; }
.research-copy { max-width:490px; }
.research-eyebrow { display:block; margin-bottom:19px; font-size:11px; font-weight:700; letter-spacing:.14em; }
.research-copy h2 { margin:0; font-size:clamp(38px,4vw,58px); line-height:1.05; letter-spacing:-.05em; }
.research-copy>p { max-width:420px; margin:24px 0 0; color:#53564f; font-size:17px; line-height:1.65; }
.research-figure { margin:0; padding:clamp(25px,3.5vw,45px); border:1px solid var(--ink); border-radius:20px; background:var(--paper); box-shadow:0 5px 0 var(--ink); }
.research-figure figcaption { font-size:clamp(20px,2vw,25px); font-weight:600; line-height:1.2; letter-spacing:-.025em; }
.research-context, .research-base { margin:10px 0 0; color:#676962; font-size:12px; line-height:1.5; }
.research-bar-row { margin-top:30px; }
.research-bar-label { display:flex; justify-content:space-between; align-items:baseline; gap:15px; margin-bottom:10px; font-size:14px; }
.research-bar-label strong { font-size:25px; line-height:1; font-weight:600; letter-spacing:-.04em; }
.research-bar-track { height:22px; border-radius:99px; background:#e8e7e2; overflow:hidden; }
.research-bar-fill { display:block; width:var(--bar-width); height:100%; border-radius:inherit; transform-origin:left center; }
.research-bar-purple { background:var(--purple); }
.research-bar-green { background:var(--green); }
.research-axis { display:flex; justify-content:space-between; margin-top:9px; color:#777a72; font-size:11px; }
.research-bars .research-base { margin-top:22px; }
.research-grid-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.research-grid-caption { display:block; }
.research-grid-caption .research-context { display:block; font-weight:400; letter-spacing:normal; }
.research-big-number { flex:none; font-size:clamp(48px,5vw,70px); font-weight:500; line-height:.9; letter-spacing:-.06em; }
.research-grid-layout { display:grid; grid-template-columns:minmax(130px,200px) minmax(0,1fr); gap:clamp(25px,3vw,40px); align-items:center; margin-top:28px; }
.research-square-grid { display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:5px; width:100%; aspect-ratio:1; }
.research-square { display:block; border-radius:2px; background:#e2e2dc; }
.research-square.is-filled { background:#8580ef; }
.research-figure-copy { margin:0; max-width:270px; font-size:17px; line-height:1.5; }
.research-grid-layout .research-base { margin-top:18px; }
@media (max-width:760px) {
 .research-layout { grid-template-columns:1fr; gap:34px; }
 .research-copy>p { font-size:16px; margin-top:18px; }
 .research-figure { padding:26px; }
 .research-grid-layout { grid-template-columns:minmax(110px,165px) minmax(0,1fr); gap:22px; }
 .research-square-grid { gap:4px; }
 .research-figure-copy { font-size:15px; }
}
@media (max-width:390px) {
 .research-grid-layout { grid-template-columns:1fr; }
 .research-square-grid { width:min(100%,180px); }
 .research-grid-heading { gap:12px; }
 .research-big-number { font-size:48px; }
}

/* Tablet layouts: keep diagrams readable and avoid oversized scroll gaps. */
@media (min-width:701px) and (max-width:900px) {
  .ws-hero-grid, .ws-learning-layout, .ws-mindset { grid-template-columns:1fr; }
  .ws-hero-grid, .ws-learning-layout { gap:36px; }
  .ws-workspace { width:100%; max-width:620px; }
  .ws-mindset { gap:28px; }
  .ws-shifts li { grid-template-columns:1fr 40px 1.15fr; }
  .ab-hero-grid, .ab-mission-grid, .ab-svc { grid-template-columns:1fr; }
  .ab-collage { width:100%; max-width:520px; margin-inline:auto; }
  .ab-svc-tabs { flex-direction:row; flex-wrap:wrap; gap:8px; }
  .ab-svc-tabs [role=tab] { flex:0 0 auto; grid-template-columns:auto auto; grid-template-areas:"num title"; column-gap:8px; padding:11px 15px; border-radius:99px; }
  .ab-svc-number { padding-top:0; font-size:11px; }
  .ab-svc-title { font-size:15px; letter-spacing:-.02em; }
  .ab-svc-lead, .ab-svc-arrow, .ab-service-help { display:none; }
  .process-visual { position:relative; top:auto; }
  .process-step, .process-step:last-child { min-height:0; padding-bottom:36px; }
  .process-step:last-child { padding-bottom:0; }
  .js .process-step, .js .process-step[data-passed=true] { opacity:1; }
  .process-token-track { display:none!important; }
}
@media (min-width:761px) and (max-width:1000px) {
  .research-layout { grid-template-columns:1fr; gap:34px; }
  .research-figure { width:100%; max-width:620px; }
}

/* A quiet, hand-drawn ticker for the homepage credentials. */
.hm-page .hm-credentials { padding-top:22px; }
.hm-page .hm-credentials-field { display:flex; justify-content:center; align-items:center; gap:12px; padding:8px 0; }
.hm-page .hm-credentials-window { flex:0 1 700px; min-width:0; }
.hm-page .hm-credentials-list { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:18px 30px; list-style:none; margin:0; padding:0; }
.hm-page .hm-credentials-list li { display:flex; flex:0 0 auto; justify-content:center; align-items:center; }
.hm-page .hm-credentials-list img { width:auto; height:auto; max-width:112px; max-height:50px; object-fit:contain; }
.hm-page .hm-credentials-repeat { display:none; }
.hm-page .hm-credentials-spark, .hm-page .hm-credentials-squiggle { flex:none; width:22px; height:22px; }
.hm-page .hm-credentials-spark { color:var(--purple); }
.hm-page .hm-credentials-squiggle { color:#77ad65; }
.hm-page .hm-credentials-field.is-enhanced .hm-credentials-window { overflow:hidden; -webkit-mask-image:linear-gradient(to right,transparent,black 9%,black 91%,transparent); mask-image:linear-gradient(to right,transparent,black 9%,black 91%,transparent); }
.hm-page .hm-credentials-field.is-enhanced .hm-credentials-track { display:flex; width:max-content; animation:hm-credentials-ticker 52s linear infinite paused; }
.hm-page .hm-credentials-field.is-enhanced .hm-credentials-list { flex-wrap:nowrap; justify-content:flex-start; gap:48px; padding:0 28px 0 20px; }
.hm-page .hm-credentials-field.is-enhanced .hm-credentials-repeat { display:flex; }
.hm-page .hm-credentials-field.is-enhanced.is-ready.is-in-view:not(.is-page-hidden) .hm-credentials-track { animation-play-state:running; }
.hm-page .hm-credentials-field.is-enhanced:focus-within .hm-credentials-track { animation-play-state:paused!important; }
@keyframes hm-credentials-ticker { to { transform:translateX(-50%); } }
@media (hover:hover) {
 .hm-page .hm-credentials-field.is-enhanced:hover .hm-credentials-track { animation-play-state:paused!important; }
}
@media (max-width:600px) {
 .hm-page .hm-credentials-field { gap:8px; }
 .hm-page .hm-credentials-list img { max-width:80px; max-height:40px; }
 .hm-page .hm-credentials-spark, .hm-page .hm-credentials-squiggle { display:none; }
 .hm-page .hm-credentials-field.is-enhanced .hm-credentials-list { gap:24px; padding:0 14px 0 10px; }
}
@media (prefers-reduced-motion:reduce) {
 .hm-page .hm-credentials-field.is-enhanced .hm-credentials-window { overflow:visible; -webkit-mask-image:none; mask-image:none; }
 .hm-page .hm-credentials-field.is-enhanced .hm-credentials-track { display:block; width:auto; animation:none; }
 .hm-page .hm-credentials-field.is-enhanced .hm-credentials-list { flex-wrap:wrap; justify-content:center; gap:18px 25px; padding:0; }
 .hm-page .hm-credentials-field.is-enhanced .hm-credentials-repeat { display:none; }
}

/* Homepage tablet composition: keep photography and the hero in proportion. */
@media (min-width:701px) and (max-width:900px) {
  .hm-page .hm-hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(26px,4vw,38px); }
  .hm-page .hm-hero h1 { font-size:clamp(40px,5.6vw,52px); }
  .hm-page .hm-hero .hero-copy { font-size:16px; line-height:1.6; margin:22px 0; }
  .hm-page .hm-hero-art { max-width:none; }
  .hm-page .hm-hero-art .home-task-picks { margin:-12px 10px 0; padding:16px; }
  .hm-page .hm-facts { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:42px; }
  .hm-page .hm-facts li { font-size:13px; }
  .hm-page .hm-people-layout { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,4vw,42px); }
  .hm-page .hm-people-photo { margin-right:0; }
}
@media (min-width:621px) and (max-width:700px) {
  .hm-page .hm-hero-art { max-width:560px; justify-self:center; }
  .hm-page .hm-people-photo { width:100%; max-width:500px; margin-inline:auto; }
  .hm-page .hm-people-photo>img,
  .hm-page .hm-people-photo>picture>img { aspect-ratio:1.25; }
}
@media (min-width:621px) and (max-width:900px) {
  .hm-page .hm-build-photo img { height:auto; aspect-ratio:2.1; }
}

/* Case-study tablet layouts: balance the photos and keep diagrams readable. */
@media (min-width:701px) and (max-width:1000px) {
  .cs-page .cs-hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(30px,4vw,42px); }
  .cs-page .cs-hero-media { max-width:none; margin:0; }
  .cs-page .cs-hero h1 { font-size:clamp(40px,4.8vw,48px); }
  .cs-page .cs-lede { font-size:16px; margin-top:22px; }
  .cs-page .cs-sticker { width:96px; height:96px; left:-18px; bottom:-24px; }
  .cs-page .cs-hero-media figcaption { padding-left:90px; }
  .cs-page .cs-facts { margin-top:50px; }
  .cs-page .cs-rollout-intro { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:36px; }
  .cs-page .cs-quote { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:30px; padding:30px; }
}
@media (min-width:621px) and (max-width:1000px) {
  .cs-page .cs-split>.cs-figure,
  .cs-page .cs-how-grid>.cs-figure,
  .cs-page .cs-result-grid>.cs-figure { width:100%; max-width:600px; margin-inline:auto; }
}
@media (min-width:621px) and (max-width:700px) {
  .cs-page .cs-hero-media, .cs-page .cs-photo { width:100%; max-width:560px; margin-inline:auto; }
  .cs-page .cs-quote-photo { width:100%; max-width:500px; margin-inline:auto; }
}

/* Keep the other stacked tablet illustrations in scale with their copy. */
@media (min-width:621px) and (max-width:900px) {
  .ab-page .ab-week { width:100%; max-width:560px; justify-self:center; }
  .ws-page .ws-workspace { width:100%; max-width:540px; justify-self:center; }
}