/* CD Who We Help — `body`-prefixed like every CD section. */ body .cd-audience { --nx-h2: clamp(1.7rem, 3.2vw, 2.3rem); padding: 5.5rem 0; background: var(--buildpress-color-cd-wash); } body .cd-audience .nx-container { width: 100%; max-width: 81.25rem; margin: 0 auto; padding: 0 1.5rem; } body .cd-audience .nx-head { max-width: 44rem; margin: 0 auto 3rem; text-align: center; } body .cd-audience .nx-head--left { margin: 0 0 2rem; text-align: left; } body .cd-audience .cd-eyebrow { display: inline-flex; align-items: center; gap: 0.5625rem; padding: 0.375rem 0.8125rem; border-radius: 62.4375rem; background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); border: 0.0625rem solid var(--buildpress-color-cd-line); font-size: 0.74rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy))); } body .cd-audience .cd-eyebrow__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--buildpress-color-cd-red); ;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-audience .nx-title { margin: 1rem 0 0; font-size: var(--nx-h2); font-weight: 800; letter-spacing: -0.02em; line-height: 1.18; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); text-wrap: balance; } body .cd-audience .nx-text { margin: 0.875rem 0 0; font-size: 1rem; line-height: 1.7; color: var(--buildpress-color-cd-muted); } body .cd-audience .nx-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.9375rem 1.625rem; border-radius: 62.4375rem; background: var(--buildpress-color-cd-red); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))); font-size: 0.95rem; font-weight: 700; line-height: 1.2; text-decoration: none; white-space: nowrap; transition: background 0.2s ease; ;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-audience .nx-btn:hover { background: var(--buildpress-color-cd-red-700); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))); } body .cd-audience .nx-btn--ghost { background: transparent; border: 0.125rem solid var(--buildpress-color-cd-line); color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } body .cd-audience .nx-btn--ghost:hover { background: var(--buildpress-color-cd-wash); color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } @media (max-width: 40rem) { body .cd-audience { padding: 4rem 0; } body .cd-audience .nx-container { padding: 0 1.25rem; } } /* Cards (default) */ body .cd-audience .cd-audience__sr { position: absolute; width: 0.0625rem; height: 0.0625rem; margin: -0.0625rem; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } body .cd-audience .cd-audience__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1.25rem; } body .cd-audience .cd-audience__card { display: flex; flex-direction: column; align-items: flex-start; padding: 2rem; border-radius: 1.25rem; background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); border: 0.0625rem solid var(--buildpress-color-cd-line); transition: transform 0.2s ease, box-shadow 0.2s ease; } body .cd-audience .cd-audience__card:hover { transform: translateY(-0.1875rem); box-shadow: 0 1rem 2.25rem color-mix(in srgb, var(--buildpress-color-cd-navy-800) 10%, transparent); } body .cd-audience .cd-audience__badge { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 0.875rem; background: var(--buildpress-color-cd-navy-800); color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); font-size: 1.25rem; font-weight: 800; line-height: 1; } body .cd-audience .cd-audience__title { margin: 1.25rem 0 0; font-size: 1.2rem; font-weight: 800; line-height: 1.3; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } body .cd-audience .cd-audience__text { margin: 0.5rem 0 0; font-size: 0.95rem; line-height: 1.65; color: var(--buildpress-color-cd-muted); } body .cd-audience .cd-audience__link { display: inline-flex; align-items: center; gap: 0.375rem; margin-top: auto; padding-top: 1.25rem; font-weight: 800; color: var(--buildpress-color-cd-red); text-decoration: none; } body .cd-audience .cd-audience__link:hover { color: var(--buildpress-color-cd-red-700); text-decoration: underline; text-underline-offset: 0.2em; } body .cd-audience .cd-audience__link svg { width: 1.125rem; height: 1.125rem; } /* ---------------- Designs ---------------- */ /* Tabs */ body .cd-audience.cd-audience--tabs { background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); } body .cd-audience.cd-audience--tabs .cd-eyebrow { background: var(--buildpress-color-cd-wash); } body .cd-audience.cd-audience--tabs .cd-audience__tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; margin: 0 auto 2rem; } body .cd-audience.cd-audience--tabs .cd-audience__tabs[hidden] { display: none; } body .cd-audience.cd-audience--tabs .cd-audience__tab { padding: 0.75rem 1.375rem; border: 0.0625rem solid var(--buildpress-color-cd-line); border-radius: 62.4375rem; background: var(--buildpress-color-cd-wash); color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); font: inherit; font-size: 0.95rem; font-weight: 700; line-height: 1.2; cursor: pointer; transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease; } body .cd-audience.cd-audience--tabs .cd-audience__tab:hover { border-color: var(--buildpress-color-cd-red); } body .cd-audience.cd-audience--tabs .cd-audience__tab[aria-selected="true"] { background: var(--buildpress-color-cd-red); border-color: var(--buildpress-color-cd-red); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-audience.cd-audience--tabs .cd-audience__tab:focus-visible { outline: 0.125rem solid var(--buildpress-color-cd-red); outline-offset: 0.1875rem; } body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__grid { display: block; max-width: 52rem; margin: 0 auto; } body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__card { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 1.5rem; padding: 2.5rem; background: var(--buildpress-color-cd-wash); } body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__card[hidden] { display: none; } body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__card:hover { transform: none; box-shadow: none; } body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__badge { grid-row: span 3; width: 4rem; height: 4rem; font-size: 1.6rem; background: var(--buildpress-color-cd-red);--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__title { margin-top: 0; font-size: 1.45rem; } body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__text { font-size: 1.02rem; } body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__link { margin-top: 0; } @media (max-width: 40rem) { body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__card { grid-template-columns: 1fr; padding: 1.75rem 1.25rem; } body .cd-audience.cd-audience--tabs.is-tabbed .cd-audience__badge { grid-row: auto; width: 3rem; height: 3rem; font-size: 1.25rem; margin-bottom: 1rem; } } /* Dark */ body .cd-audience.cd-audience--dark { background: var(--buildpress-color-cd-navy-800); } body .cd-audience.cd-audience--dark .nx-title { color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } body .cd-audience.cd-audience--dark .nx-text { color: var(--site-tone-soft,var(--buildpress-color-cd-navy-50)); } body .cd-audience.cd-audience--dark .cd-eyebrow { background: color-mix(in srgb, var(--buildpress-color-cd-white) 10%, transparent); border-color: color-mix(in srgb, var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 18%, transparent); color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } body .cd-audience.cd-audience--dark .cd-audience__card { background: var(--buildpress-color-cd-navy-700); border-color: color-mix(in srgb, var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 10%, transparent); } body .cd-audience.cd-audience--dark .cd-audience__badge { background: var(--buildpress-color-cd-red);--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-audience.cd-audience--dark .cd-audience__title { color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } body .cd-audience.cd-audience--dark .cd-audience__text { color: var(--site-tone-soft,var(--buildpress-color-cd-navy-50)); } body .cd-audience.cd-audience--dark .cd-audience__link { color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } body .cd-audience.cd-audience--dark .cd-audience__link:hover { color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } /* === ReadySite library redesign === */ body .rsx *,body .rsx *::before,body .rsx *::after{box-sizing:border-box} body .rsx :is(h2,h3,p,figure,blockquote,dl,dd){margin:0} body .rsx img{max-width:100%} body .rsx :where(ul,ol){list-style:none;margin:0;padding:0} body .rsx :where(figcaption,small,cite){font-style:normal} body .rsx{--x-bg:var(--buildpress-color-cd-white);--x-ink:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));--x-ink-raw:var(--buildpress-color-cd-navy);--x-text:var(--buildpress-color-cd-text);--x-soft:var(--buildpress-color-cd-wash);--x-line:var(--buildpress-color-cd-line);--x-action:var(--buildpress-color-cd-red);--x-action-hover:var(--buildpress-color-cd-red-700);--x-dark:var(--buildpress-color-cd-navy-800);--x-dark-2:var(--buildpress-color-cd-navy-700);--x-tint:var(--buildpress-color-cd-navy-50);position:relative;isolation:isolate;overflow:hidden;background:var(--x-bg);color:var(--x-ink);font:400 16px/1.65 var(--buildpress-font-family-body)} body .rsx .rsx-wrap{max-width:1240px;margin:0 auto;padding:clamp(48px,7vw,104px) clamp(20px,5vw,64px)} body .rsx .rsx-eyebrow{display:flex;align-items:center;gap:10px;font:600 11px/1.5 var(--buildpress-font-family-body);letter-spacing:.15em;text-transform:uppercase;color:var(--x-text)} body .rsx .rsx-eyebrow::before{content:"";width:24px;height:2px;background:currentColor;flex:none} body .rsx .rsx-title{font:500 clamp(30px,4.2vw,52px)/1.08 var(--buildpress-font-family-heading);letter-spacing:-.045em;color:var(--x-ink);text-wrap:balance;max-width:20ch;margin-top:16px} body .rsx .rsx-title em{font-style:normal;color:var(--x-action)} body .rsx .rsx-lead{font-size:var(--buildpress-font-size-17,17px);line-height:1.7;color:var(--x-text);max-width:58ch;margin-top:18px} body .rsx .rsx-small{font-size:var(--buildpress-font-size-13,13px);line-height:1.6;color:var(--x-text)} body .rsx .rsx-sample{display:inline-block;font:600 10px/1.4 var(--buildpress-font-family-body);letter-spacing:.12em;text-transform:uppercase;color:var(--x-text);background:var(--x-soft);border:1px dashed var(--x-line);border-radius:999px;padding:4px 10px} body .rsx .rsx-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:28px} body .rsx .rsx-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 22px;border:1px solid var(--x-action);border-radius:8px;background:var(--x-action);color:var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));font:600 14px/1.3 var(--buildpress-font-family-body);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .rsx .rsx-btn:hover{background:var(--x-action-hover);border-color:var(--x-action-hover);color:var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)))} body .rsx .rsx-btn--quiet{background:transparent;color:var(--x-ink);border-color:var(--x-line)} body .rsx .rsx-btn--quiet:hover{background:var(--x-soft);color:var(--x-ink);border-color:var(--x-text)} body .rsx .rsx-btn--light{background:var(--buildpress-color-cd-white);border-color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white));color:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy))} body .rsx .rsx-btn--light:hover{background:var(--buildpress-color-cd-navy-50);border-color:var(--buildpress-color-cd-navy-50);color:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy))} body .rsx .rsx-btn svg{width:16px;height:16px;flex:none} body .rsx .rsx-link{display:inline-flex;align-items:center;gap:8px;font:600 14px/1.4 var(--buildpress-font-family-body);color:var(--x-action);text-decoration:none} body .rsx .rsx-link:hover{text-decoration:underline;text-underline-offset:4px} body .rsx .rsx-link svg{width:15px;height:15px} body .rsx .rsx-media{position:relative;overflow:hidden;background:var(--x-soft);min-width:0} body .rsx .rsx-photo{display:block;width:100%;height:100%;object-fit:cover} body .rsx .rsx-field{display:grid;gap:7px;font:500 13px/1.5 var(--buildpress-font-family-body);color:var(--x-ink);min-width:0} body .rsx .rsx-field :is(input,select,textarea){width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--buildpress-color-cd-line);border-radius:6px;background:var(--buildpress-color-cd-white);color:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));font:400 15px/1.5 var(--buildpress-font-family-body)} body .rsx .rsx-field textarea{min-height:110px;resize:vertical} body .rsx.rsx-dark{--x-bg:var(--buildpress-color-cd-navy-800);--x-ink:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));--x-ink-raw:var(--buildpress-color-cd-white);--x-text:var(--buildpress-color-cd-navy-50);--x-soft:var(--buildpress-color-cd-navy-700);--x-line:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 20%,transparent)} body .rsx.rsx-dark{--x-accent-on-dark:color-mix(in srgb,var(--buildpress-color-cd-red) 58%,var(--buildpress-color-cd-white))} body .rsx.rsx-dark .rsx-title em{color:var(--site-tone-soft,var(--buildpress-color-cd-navy-50));color:var(--x-accent-on-dark)} body .rsx.rsx-soft{--x-bg:var(--buildpress-color-cd-wash);--x-soft:var(--buildpress-color-cd-white)} body .rsx .rsx-light{--x-bg:var(--buildpress-color-cd-white);--x-ink:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));--x-ink-raw:var(--buildpress-color-cd-navy);--x-text:var(--buildpress-color-cd-text);--x-soft:var(--buildpress-color-cd-wash);--x-line:var(--buildpress-color-cd-line);background:var(--x-bg);color:var(--x-ink)} html body .rsx-fx-audience .fx-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} html body .rsx-fx-audience .fx-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:clamp(28px,4vw,40px);padding-top:18px;border-top:1px solid var(--x-line);font-size:var(--buildpress-font-size-13,13px);color:var(--x-text)} html body .rsx-fx-audience .fx-price{display:flex;align-items:baseline;gap:6px;margin:0;color:var(--x-ink)} html body .rsx-fx-audience .fx-price small{font:500 12px/1 var(--buildpress-font-family-body);color:var(--x-text);text-transform:uppercase;letter-spacing:.08em} html body .rsx-fx-audience .fx-price strong{font:600 17px/1.2 var(--buildpress-font-family-heading);letter-spacing:-.01em} html body .rsx-fx-audience .fx-chip{position:absolute;left:14px;top:14px;z-index:2;font:600 10px/1 var(--buildpress-font-family-body);letter-spacing:.1em;text-transform:uppercase;padding:6px 9px;border-radius:999px;background:color-mix(in srgb,var(--buildpress-color-cd-white) 82%,transparent);color:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));border:1px dashed color-mix(in srgb,var(--buildpress-color-cd-navy-800) 28%,transparent)} html body .rsx-fx-audience .au-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(32px,5.5vw,80px);align-items:stretch} html body .rsx-fx-audience .au-media{border-radius:22px;min-height:560px;height:100%} html body .rsx-fx-audience .au-media .rsx-photo{position:absolute;inset:0} html body .rsx-fx-audience .au-note{font-style:normal;position:absolute;left:20px;right:20px;bottom:20px;display:flex;gap:14px;align-items:flex-start;max-width:360px;padding:18px 20px;border-radius:16px;background:var(--buildpress-color-cd-white);color:var(--buildpress-color-cd-text);font-size:var(--buildpress-font-size-14,14px);line-height:1.55;box-shadow:0 18px 40px color-mix(in srgb,var(--buildpress-color-cd-navy-800) 18%,transparent)} html body .rsx-fx-audience .au-note b{display:block;color:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));font:600 15px/1.35 var(--buildpress-font-family-heading);margin-bottom:3px} html body .rsx-fx-audience .au-note__ic{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:10px;background:var(--x-action);color:var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} html body .rsx-fx-audience .au-note__ic .rsx-ic{width:19px;height:19px} html body .rsx-fx-audience .au-body{display:flex;flex-direction:column;justify-content:center;min-width:0} html body .rsx-fx-audience .au-list{margin-top:32px;border-top:1px solid var(--x-line)} html body .rsx-fx-audience .au-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center;padding:22px 0;border-bottom:1px solid var(--x-line)} html body .rsx-fx-audience .au-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--x-action) 10%,var(--x-bg));color:var(--x-action)} html body .rsx-fx-audience .au-ic .rsx-ic{width:22px;height:22px} html body .rsx-fx-audience .au-txt p{margin-top:5px;font-size:var(--buildpress-font-size-15,15px);line-height:1.6} html body .rsx-fx-audience .au-go{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--x-line);color:var(--x-ink);transition:background .2s,border-color .2s,color .2s} html body .rsx-fx-audience .au-go svg{width:17px;height:17px} html body .rsx-fx-audience .au-go:hover{background:var(--x-action);border-color:var(--x-action);color:var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} @media (max-width:800px){ html body .rsx-fx-audience .au-grid{grid-template-columns:1fr} html body .rsx-fx-audience .au-media{min-height:0;aspect-ratio:4/3;height:auto} } @media (max-width:500px){ html body .rsx-fx-audience .au-media{aspect-ratio:4/5} html body .rsx-fx-audience .au-note{left:12px;right:12px;bottom:12px;padding:14px 16px} html body .rsx-fx-audience .au-item{grid-template-columns:minmax(0,1fr) auto;gap:14px} html body .rsx-fx-audience .au-ic{display:none} html body .rsx-fx-audience .au-go{width:40px;height:40px} } /* Who We Help 1-4 (redesigned) */ html body .rsx-wh h3{margin:0} /* 1 photo cards */ html body .rsx-wh-cards .w1-head{display:grid;grid-template-columns:1.2fr 1fr;gap:16px 48px;align-items:end;margin-bottom:clamp(26px,3.6vw,40px)} html body .rsx-wh-cards .w1-intro{font-size:var(--buildpress-font-size-16,16px);line-height:1.65;color:var(--x-text)} html body .rsx-wh-cards .w1-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,22px);margin:0;padding:0;list-style:none} html body .rsx-wh-cards .w1-link{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:460px;padding:20px;border-radius:24px;overflow:hidden;background:var(--x-dark);color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white));text-decoration:none;isolation:isolate} html body .rsx-wh-cards .w1-link img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .7s} html body .rsx-wh-cards .w1-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,color-mix(in srgb,var(--buildpress-color-cd-navy-800) 25%,transparent),color-mix(in srgb,var(--buildpress-color-cd-navy-800) 5%,transparent) 35%,color-mix(in srgb,var(--buildpress-color-cd-navy-800) 88%,transparent));transition:background .3s} html body .rsx-wh-cards .w1-top{display:flex;justify-content:space-between;align-items:center} html body .rsx-wh-cards .w1-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:color-mix(in srgb,var(--buildpress-color-cd-white) 16%,transparent);backdrop-filter:blur(8px);border:1px solid color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 30%,transparent)} html body .rsx-wh-cards .w1-ic .rsx-ic{width:21px;height:21px} html body .rsx-wh-cards .w1-n{font:600 13px/1 var(--buildpress-font-family-heading);color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 80%,transparent)} html body .rsx-wh-cards .w1-body{display:grid;gap:8px} html body .rsx-wh-cards .w1-tag{justify-self:start;padding:5px 10px;border-radius:999px;background:var(--x-action);font:600 11px/1.2 var(--buildpress-font-family-body);--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} html body .rsx-wh-cards .w1-body h3{color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white));font-size:var(--rsx-fs,clamp(22px,2.4vw,26px))} html body .rsx-wh-cards .w1-p{font-size:var(--buildpress-font-size-145,14.5px);line-height:1.55;color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 85%,transparent);max-height:0;opacity:0;overflow:hidden;transition:max-height .4s,opacity .3s} html body .rsx-wh-cards .w1-more{display:inline-flex;align-items:center;gap:8px;margin-top:4px;font:600 14px var(--buildpress-font-family-body)} html body .rsx-wh-cards .w1-more svg{width:16px;height:16px;transition:transform .2s} html body .rsx-wh-cards .w1-link:hover img,html body .rsx-wh-cards .w1-link:focus-visible img{transform:scale(1.06)} html body .rsx-wh-cards .w1-link:hover .w1-shade,html body .rsx-wh-cards .w1-link:focus-visible .w1-shade{background:linear-gradient(180deg,color-mix(in srgb,var(--buildpress-color-cd-navy-800) 35%,transparent),color-mix(in srgb,var(--buildpress-color-cd-navy-800) 92%,transparent) 60%)} html body .rsx-wh-cards .w1-link:hover .w1-p,html body .rsx-wh-cards .w1-link:focus-visible .w1-p{max-height:120px;opacity:1} html body .rsx-wh-cards .w1-link:hover .w1-more svg{transform:translateX(4px)} html body .rsx-wh-cards .w1-link:focus-visible{outline:3px solid var(--x-action);outline-offset:3px} @media (hover:none){ html body .rsx-wh-cards .w1-p{max-height:120px;opacity:1} } /* 2 switcher */ html body .rsx-wh-switch .w2-head{margin-inline:auto;text-align:center;justify-items:center} html body .rsx-wh-switch .w2-seg{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;max-width:640px;margin:clamp(22px,3vw,30px) auto 0;padding:6px;border-radius:999px;background:var(--x-bg);border:1px solid var(--x-line);box-shadow:0 10px 26px color-mix(in srgb,var(--buildpress-color-cd-navy-800) 6%,transparent)} html body .rsx-wh-switch .w2-seg button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:8px 12px;border:0;border-radius:999px;background:none;color:var(--x-text);font:600 14.5px/1.2 var(--buildpress-font-family-body);cursor:pointer;transition:color .25s} html body .rsx-wh-switch .w2-seg .rsx-ic{width:18px;height:18px} html body .rsx-wh-switch .w2-seg [aria-selected="true"]{color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))} html body .rsx-wh-switch .w2-seg button:focus-visible{outline:3px solid var(--x-action);outline-offset:2px} html body .rsx-wh-switch .w2-glide{position:absolute;top:6px;bottom:6px;left:6px;width:calc((100% - 12px)/3);border-radius:999px;background:var(--x-dark);transition:transform .35s cubic-bezier(.3,.8,.3,1)} html body .rsx-wh-switch .w2-card{margin-top:clamp(18px,2.6vw,26px);padding:clamp(12px,1.6vw,16px);border-radius:28px;background:var(--x-bg);border:1px solid var(--x-line);box-shadow:0 26px 60px color-mix(in srgb,var(--buildpress-color-cd-navy-800) 8%,transparent)} html body .rsx-wh-switch .w2-panel{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(20px,3.4vw,44px);align-items:center;animation:rsx-w2-in .45s ease} html body .rsx-wh-switch .w2-ph{min-height:400px;height:100%;border-radius:20px} html body .rsx-wh-switch .w2-q{position:absolute;left:16px;right:16px;bottom:16px;padding:14px 16px;border-radius:14px;background:color-mix(in srgb,var(--buildpress-color-cd-white) 94%,transparent);backdrop-filter:blur(8px);color:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy))} html body .rsx-wh-switch .w2-q p{font:500 15px/1.45 var(--buildpress-font-family-heading)} html body .rsx-wh-switch .w2-q span{display:block;margin-top:4px;font-size:var(--buildpress-font-size-12,12px);color:var(--buildpress-color-cd-muted)} html body .rsx-wh-switch .w2-txt{padding:clamp(8px,2vw,20px) clamp(8px,2vw,20px) clamp(8px,2vw,20px) 0} html body .rsx-wh-switch .w2-k{font:600 11px/1.4 var(--buildpress-font-family-body);letter-spacing:.14em;text-transform:uppercase;color:var(--x-action)} html body .rsx-wh-switch .w2-txt h3{margin-top:8px;font:500 clamp(22px,2.6vw,28px)/1.25 var(--buildpress-font-family-heading);letter-spacing:-.02em;color:var(--x-ink)} html body .rsx-wh-switch .w2-list{display:grid;gap:10px;margin:20px 0 0;padding:0;list-style:none} html body .rsx-wh-switch .w2-list li{display:flex;gap:10px;align-items:center;font:500 15px/1.4 var(--buildpress-font-family-body);color:var(--x-ink)} html body .rsx-wh-switch .w2-list .rsx-ic{flex:none;width:22px;height:22px;padding:4px;border-radius:50%;background:var(--x-action);color:var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} html body .rsx-wh-switch .w2-best{margin:18px 0 22px;padding:12px 14px;border-radius:12px;background:var(--x-soft);font-size:var(--buildpress-font-size-14,14px);color:var(--x-text)} html body .rsx-wh-switch .w2-best b{color:var(--x-ink)} /* 3 dark glass */ html body .rsx-wh-dark{background-image:linear-gradient(color-mix(in srgb,var(--buildpress-color-cd-white) 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--buildpress-color-cd-white) 4%,transparent) 1px,transparent 1px);background-size:44px 44px} html body .rsx-wh-dark .w3-head{margin-inline:auto;max-width:640px;text-align:center;justify-items:center} html body .rsx-wh-dark .w3-head .rsx-lead{color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 78%,transparent)} html body .rsx-wh-dark .w3-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,22px);margin:clamp(28px,4vw,44px) 0 0;padding:0;list-style:none;align-items:stretch} html body .rsx-wh-dark .w3-card{position:relative;display:flex;flex-direction:column;padding:clamp(22px,2.8vw,28px);border-radius:24px;background:linear-gradient(160deg,color-mix(in srgb,var(--buildpress-color-cd-white) 9%,transparent),color-mix(in srgb,var(--buildpress-color-cd-white) 2%,transparent));border:1px solid color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 12%,transparent);backdrop-filter:blur(8px);transition:transform .25s,border-color .25s} html body .rsx-wh-dark .w3-card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 30%,transparent)} html body .rsx-wh-dark .w3-card--hi{background:linear-gradient(160deg,color-mix(in srgb,var(--x-action) 35%,transparent),color-mix(in srgb,var(--buildpress-color-cd-white) 3%,transparent));border-color:color-mix(in srgb,var(--x-action) 60%,transparent)} html body .rsx-wh-dark .w3-pop{position:absolute;top:-11px;left:24px;padding:5px 10px;border-radius:999px;background:var(--x-action);color:var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));font:600 10.5px/1 var(--buildpress-font-family-body);letter-spacing:.1em;text-transform:uppercase;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} html body .rsx-wh-dark .w3-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:26px} html body .rsx-wh-dark .w3-ic{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:color-mix(in srgb,var(--buildpress-color-cd-white) 10%,transparent);color:color-mix(in srgb,var(--x-action) 58%,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)))} html body .rsx-wh-dark .w3-card--hi .w3-ic{background:var(--x-action);color:var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} html body .rsx-wh-dark .w3-ic .rsx-ic{width:24px;height:24px} html body .rsx-wh-dark .w3-n{font:600 44px/1 var(--buildpress-font-family-heading);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--buildpress-color-cd-white) 25%,transparent)} html body .rsx-wh-dark .w3-card h3{color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white));font-size:var(--rsx-fs,clamp(20px,2.2vw,23px))} html body .rsx-wh-dark .w3-card>p{margin-top:8px;font-size:var(--buildpress-font-size-145,14.5px);line-height:1.6;color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 78%,transparent)} html body .rsx-wh-dark .w3-list{display:grid;gap:9px;margin:18px 0 22px;padding:16px 0 0;border-top:1px solid color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 12%,transparent);list-style:none} html body .rsx-wh-dark .w3-list li{display:flex;gap:10px;align-items:flex-start;font-size:var(--buildpress-font-size-14,14px);line-height:1.45;color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 90%,transparent)} html body .rsx-wh-dark .w3-list .rsx-ic{flex:none;width:17px;height:17px;margin-top:1px;color:color-mix(in srgb,var(--x-action) 58%,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)))} html body .rsx-wh-dark .w3-cta{margin-top:auto;display:inline-flex;align-items:center;gap:8px;color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white));font:600 14.5px var(--buildpress-font-family-body);text-decoration:none} html body .rsx-wh-dark .w3-cta svg{width:16px;height:16px;transition:transform .2s} html body .rsx-wh-dark .w3-cta:hover svg{transform:translateX(4px)} html body .rsx-wh-dark .w3-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)} html body .rsx-wh-dark :focus-visible{outline:3px solid var(--buildpress-color-cd-white);outline-offset:3px} /* 4 expanding panels */ html body .rsx-wh-panels .w4-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:clamp(28px,4.4vw,56px);align-items:center} html body .rsx-wh-panels .w4-side .rsx-lead{margin-top:14px} html body .rsx-wh-panels .w4-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0 24px} html body .rsx-wh-panels .w4-stats div{padding:14px 16px;border-radius:14px;background:var(--x-soft);border:1px solid var(--x-line)} html body .rsx-wh-panels .w4-stats dt{font:600 10.5px/1.4 var(--buildpress-font-family-body);letter-spacing:.12em;text-transform:uppercase;color:var(--x-text)} html body .rsx-wh-panels .w4-stats dd{margin:4px 0 0;font:600 22px/1.1 var(--buildpress-font-family-heading);color:var(--x-ink)} html body .rsx-wh-panels .w4-panels{display:flex;gap:12px;height:480px;margin:0;padding:0;list-style:none} html body .rsx-wh-panels .w4-p{position:relative;flex:1;min-width:0;border-radius:24px;overflow:hidden;background:var(--x-dark);transition:flex .6s cubic-bezier(.3,.8,.3,1)} html body .rsx-wh-panels .w4-p.is-open{flex:3.2} html body .rsx-wh-panels .w4-p>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s} html body .rsx-wh-panels .w4-p.is-open>img{transform:scale(1.04)} html body .rsx-wh-panels .w4-shade{position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--buildpress-color-cd-navy-800) 20%,transparent),color-mix(in srgb,var(--buildpress-color-cd-navy-800) 85%,transparent))} html body .rsx-wh-panels .w4-btn{position:absolute;left:0;right:0;top:0;bottom:0;z-index:1;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:20px;border:0;background:none;color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white));text-align:left;cursor:pointer} html body .rsx-wh-panels .w4-p.is-open .w4-btn{bottom:auto;flex-direction:row;align-items:center;gap:12px} html body .rsx-wh-panels .w4-n{font:600 13px/1 var(--buildpress-font-family-heading);color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 80%,transparent)} html body .rsx-wh-panels .w4-name{font:600 18px/1.25 var(--buildpress-font-family-heading);writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap} html body .rsx-wh-panels .w4-p.is-open .w4-name{writing-mode:horizontal-tb;transform:none;font-size:var(--rsx-fs,clamp(22px,2.4vw,26px))} html body .rsx-wh-panels .w4-plus{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:color-mix(in srgb,var(--buildpress-color-cd-white) 18%,transparent);backdrop-filter:blur(6px)} html body .rsx-wh-panels .w4-plus .rsx-ic{width:18px;height:18px} html body .rsx-wh-panels .w4-p.is-open .w4-plus{display:none} html body .rsx-wh-panels .w4-btn:focus-visible{outline:3px solid var(--buildpress-color-cd-white);outline-offset:-6px;border-radius:24px} html body .rsx-wh-panels .w4-d{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px;color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white));opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .35s .2s,transform .35s .2s,visibility 0s .55s} html body .rsx-wh-panels .w4-p.is-open .w4-d{opacity:1;visibility:visible;transform:none;transition:opacity .35s .25s,transform .35s .25s} html body .rsx-wh-panels .w4-d p{max-width:44ch;font-size:var(--buildpress-font-size-15,15px);line-height:1.55;color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 90%,transparent)} html body .rsx-wh-panels .w4-d ul{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 16px;padding:0;list-style:none} html body .rsx-wh-panels .w4-d li{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:color-mix(in srgb,var(--buildpress-color-cd-white) 14%,transparent);backdrop-filter:blur(6px);font:600 12.5px/1.2 var(--buildpress-font-family-body)} html body .rsx-wh-panels .w4-d li .rsx-ic{width:14px;height:14px} html body .rsx-wh-panels .w4-cta{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--buildpress-color-cd-white);color:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));font:600 14px var(--buildpress-font-family-body);text-decoration:none} html body .rsx-wh-panels .w4-cta svg{width:15px;height:15px} @media (prefers-reduced-motion:reduce){ html body .rsx-wh *{transition:none!important;animation:none!important} } @media (max-width:940px){ html body .rsx-wh-cards .w1-head,html body .rsx-wh-panels .w4-grid{grid-template-columns:1fr} html body .rsx-wh-cards .w1-grid,html body .rsx-wh-dark .w3-grid{grid-template-columns:1fr;max-width:560px;margin-inline:auto} html body .rsx-wh-cards .w1-link{min-height:360px} html body .rsx-wh-cards .w1-p{max-height:120px;opacity:1} html body .rsx-wh-switch .w2-panel{grid-template-columns:1fr} html body .rsx-wh-switch .w2-ph{min-height:280px} html body .rsx-wh-switch .w2-txt{padding:4px 8px 8px} html body .rsx-wh-panels .w4-panels{flex-direction:column;height:auto} html body .rsx-wh-panels .w4-p{flex:none;height:84px;transition:height .5s} html body .rsx-wh-panels .w4-p.is-open{height:400px} html body .rsx-wh-panels .w4-btn{flex-direction:row;align-items:center;justify-content:flex-start;gap:12px} html body .rsx-wh-panels .w4-name{writing-mode:horizontal-tb;transform:none} html body .rsx-wh-panels .w4-plus{margin-left:auto} } @media (max-width:600px){ html body .rsx-wh-switch .w2-seg button span{font-size:var(--buildpress-font-size-125,12.5px)} html body .rsx-wh-switch .w2-seg .rsx-ic{display:none} } @keyframes rsx-w2-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} html body .rsx [hidden]{display:none!important} html body .rsx .rsx-head .rsx-title em,html body .rsx .rsx-title em{font-style:normal} html body .rsx-wh-cards .w1-grid--n1{grid-template-columns:minmax(0,1fr)} html body .rsx-wh-cards .w1-grid--n2{grid-template-columns:repeat(2,minmax(0,1fr))} html body .rsx-wh-cards .w1-grid--n4{grid-template-columns:repeat(4,minmax(0,1fr))} html body .rsx-wh-dark .w3-grid--n1{grid-template-columns:minmax(0,1fr);max-width:560px;margin-inline:auto} html body .rsx-wh-dark .w3-grid--n2{grid-template-columns:repeat(2,minmax(0,1fr))} html body .rsx-wh-dark .w3-grid--n4{grid-template-columns:repeat(4,minmax(0,1fr))} html body .rsx-wh-dark .w3-card>p{margin-bottom:22px} html body .rsx-wh-switch .w2-seg{grid-template-columns:repeat(var(--w2n,3),minmax(0,1fr))} html body .rsx-wh-switch .w2-glide{width:calc((100% - 12px) / var(--w2n,3))} html body .rsx-wh-switch .w2-seg button:hover,html body .rsx-wh-switch .w2-seg button:focus{background:none;color:var(--x-text)} html body .rsx-wh-switch .w2-seg button[aria-selected="true"]{color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))} html body .rsx-wh-switch .w2-txt h3{margin-bottom:24px} html body .rsx-wh-switch .w2-panel--nophoto{grid-template-columns:1fr} html body .rsx-wh-switch .w2-panel--nophoto .w2-txt{padding:clamp(16px,3vw,32px)} html body .rsx-wh-panels .w4-btn:hover,html body .rsx-wh-panels .w4-btn:focus{background:none;color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))} html body .rsx-wh-panels .w4-side .rsx-actions{margin-top:24px} html body .rsx-fx-audience .au-grid--nophoto{grid-template-columns:1fr} html body .rsx-fx-audience .au-body .rsx-actions{margin-top:28px} html body .rsx-fx-audience .rsx-btn--quiet{color:var(--x-ink)} @media (max-width:940px){ html body .rsx-wh-cards .w1-grid--n2,html body .rsx-wh-cards .w1-grid--n4,html body .rsx-wh-dark .w3-grid--n2,html body .rsx-wh-dark .w3-grid--n4{grid-template-columns:1fr;max-width:560px;margin-inline:auto} } @media (max-width:600px){ html body .rsx-wh-switch .w2-seg{border-radius:22px} html body .rsx-wh-switch .w2-seg button{min-height:52px;padding:6px 6px;border-radius:18px} html body .rsx-wh-switch .w2-glide{border-radius:18px} } html body .rsx-fx-audience .au-txt h3{font-size:var(--rsx-fs,19px);line-height:1.3} html body .rsx-wh-panels .w4-p.is-open .w4-btn{justify-content:flex-start} @media (max-width:940px){ html body .rsx-wh-panels .w4-p.is-open{flex:none;height:400px} } @media (max-width:600px){ html body .rsx-wh-switch .w2-seg{display:flex;flex-direction:column;gap:4px;border-radius:22px} html body .rsx-wh-switch .w2-glide{display:none} html body .rsx-wh-switch .w2-seg button{justify-content:flex-start;min-height:46px;padding:10px 16px;border-radius:16px} html body .rsx-wh-switch .w2-seg button span{font-size:var(--buildpress-font-size-14,14px);white-space:normal;text-align:left} html body .rsx-wh-switch .w2-seg .rsx-ic{display:block} html body .rsx-wh-switch .w2-seg button[aria-selected="true"],html body .rsx-wh-switch .w2-seg button[aria-selected="true"]:hover,html body .rsx-wh-switch .w2-seg button[aria-selected="true"]:focus{background:var(--x-dark);color:var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))} } /* === Who We Help: 5 designs 2026-09-28 (x06 Number tiles, x07 Photo cards, x08 Hover rows, x09 Accordion + photo, x10 Dark panel) === */ body .ax{--a-bg:var(--buildpress-color-cd-white);--a-ink:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));--a-ink-raw:var(--buildpress-color-cd-navy);--a-text:var(--buildpress-color-cd-text);--a-soft:var(--buildpress-color-cd-wash);--a-line:var(--buildpress-color-cd-line);--a-acc:var(--buildpress-color-cd-red);--a-dark:var(--buildpress-color-cd-navy-800);--a-white:var(--buildpress-color-cd-white);position:relative;isolation:isolate;overflow:clip;background:var(--a-bg);color:var(--a-text);font:400 16px/1.65 var(--buildpress-font-family-body)} body .ax *{box-sizing:border-box} body .ax :is(h2,h3,p,ul,ol,figure){margin:0} body .ax :is(ul,ol){list-style:none;padding:0} body .ax a{text-decoration:none} body .ax .ax-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} body .ax .ax-wrap{position:relative;z-index:2;max-width:1344px;margin:0 auto;padding:clamp(56px,8vw,112px) clamp(20px,5vw,64px)} body .ax .ax-head{margin-bottom:clamp(36px,5vw,56px)} body .ax .ax-eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 11px/1.5 var(--buildpress-font-family-body);letter-spacing:.16em;text-transform:uppercase;color:var(--a-text)} body .ax .ax-eyebrow::before{content:"";width:24px;height:2px;background:var(--a-acc);flex:none;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .ax .ax-title{margin-top:16px;max-width:18ch;font:500 clamp(30px,4vw,50px)/1.08 var(--buildpress-font-family-heading);letter-spacing:-.04em;color:var(--a-ink);text-wrap:balance} body .ax .ax-title em{font-style:normal;color:var(--a-acc)} body .ax .ax-lead{margin-top:16px;max-width:56ch;font-size:17px;line-height:1.7} body .ax h3{font:500 21px/1.25 var(--buildpress-font-family-heading);letter-spacing:-.02em;color:var(--a-ink)} body .ax li p,body .ax .ax-acc-body p{font-size:15.5px;line-height:1.65} body .ax .ax-num{font:500 13px/1 var(--buildpress-font-family-heading);color:var(--a-acc);font-variant-numeric:tabular-nums} body .ax .ax-stretch::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:3} body .ax .ax-stretch:focus-visible{outline:none} body .ax li:has(.ax-stretch:focus-visible){outline:2px solid var(--a-acc);outline-offset:3px} body .ax .ax-link{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:18px;color:var(--a-ink);font:600 14px/1.3 var(--buildpress-font-family-body)} body .ax .ax-link svg{width:16px;height:16px;color:var(--a-acc);transition:transform .25s} body .ax .ax-nopic{display:block;background:radial-gradient(ellipse 70% 60% at 80% 10%,color-mix(in srgb,var(--a-acc) 40%,transparent),transparent 70%),var(--a-dark)} body .ax .ax-split .ax-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-areas:"eye eye" "title lead";column-gap:6%;align-items:end} body .ax .ax-split .ax-eyebrow{grid-area:eye} body .ax .ax-split .ax-title{grid-area:title} body .ax .ax-split .ax-lead{grid-area:lead;margin-top:0} body .ax .ax-badge{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:14px;background:color-mix(in srgb,var(--a-acc) 10%,transparent);color:var(--a-acc);font:500 19px/1 var(--buildpress-font-family-heading)} body .ax .ax-go{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;border:1px solid var(--a-line);color:var(--a-ink);transition:background .3s,border-color .3s,color .3s,transform .3s} body .ax .ax-go svg{width:18px;height:18px} /* x06 Number tiles */ body .ax .ax-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px} body .ax .ax-tile{position:relative;display:flex;flex-direction:column;gap:10px;min-height:320px;padding:30px;border-radius:24px;background:var(--a-soft);overflow:hidden;isolation:isolate;transition:background .35s,transform .35s cubic-bezier(.2,.8,.2,1)} body .ax .ax-letter{position:absolute;right:-6px;bottom:-40px;z-index:-1;font:500 220px/1 var(--buildpress-font-family-heading);letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--a-ink) 12%,transparent);transition:-webkit-text-stroke-color .35s} body .ax .ax-tile .ax-num{margin-bottom:auto} body .ax .ax-tile h3{margin-top:40px;font-size:24px} body .ax .ax-tile:hover{background:var(--a-dark);transform:translateY(-4px)} body .ax .ax-tile:hover h3,body .ax .ax-tile:hover .ax-link{color:var(--site-tone-on,var(--a-white))} body .ax .ax-tile:hover p{color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 75%,transparent)} body .ax .ax-tile:hover .ax-letter{-webkit-text-stroke-color:color-mix(in srgb,var(--buildpress-color-cd-white) 20%,transparent)} body .ax .ax-tile:hover .ax-link svg{transform:translateX(4px)} /* x07 Photo cards */ body .ax .ax-photos{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px} body .ax .ax-photo{position:relative;display:flex;align-items:flex-end;min-height:440px;border-radius:24px;overflow:hidden;isolation:isolate;background:var(--a-dark)} body .ax .ax-photo-img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)} body .ax .ax-photo:hover .ax-photo-img{transform:scale(1.06)} body .ax .ax-photo-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 25%,color-mix(in srgb,var(--a-dark) 92%,transparent))} body .ax .ax-photo-copy{display:flex;flex-direction:column;gap:10px;padding:28px} body .ax .ax-photo h3{font-size:26px;color:var(--site-tone-on,var(--a-white))} body .ax .ax-photo p{color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 82%,transparent)} body .ax .ax-pill{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin-top:8px;padding:10px 16px;border-radius:999px;background:color-mix(in srgb,var(--a-white) 14%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--site-tone-on,var(--a-white));font:600 13.5px/1 var(--buildpress-font-family-body);transition:background .25s} body .ax .ax-pill svg{width:15px;height:15px} body .ax .ax-photo:hover .ax-pill{background:var(--a-acc);--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} /* x08 Hover rows */ body .ax .ax-rows{border-top:1px solid var(--a-line)} body .ax .ax-rows li{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr) minmax(0,1.1fr) auto;gap:24px;align-items:center;padding:clamp(24px,3vw,36px) clamp(12px,2vw,28px);border-bottom:1px solid var(--a-line);border-radius:18px;transition:background .35s,color .35s} body .ax .ax-rows h3{font-size:clamp(22px,2.4vw,32px);letter-spacing:-.03em;transition:color .35s} body .ax .ax-rows p{transition:color .35s} body .ax .ax-rows li:hover{background:var(--a-dark)} body .ax .ax-rows li:hover h3{color:var(--site-tone-on,var(--a-white))} body .ax .ax-rows li:hover p{color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 75%,transparent)} body .ax .ax-rows li:hover .ax-go{background:var(--a-acc);border-color:var(--a-acc);color:var(--buildpress-color-cd-on-brand,var(--a-white));transform:rotate(-45deg);--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} /* x09 Accordion + photo */ body .ax .ax-accg{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,6vw,96px);align-items:center} body .ax .ax-accg-pic{aspect-ratio:4/5;border-radius:28px;overflow:hidden} body .ax .ax-accg-img{display:block;width:100%;height:100%;object-fit:cover} body .ax .ax-acc{border-top:1px solid var(--a-line)} body .ax .ax-acc details{border-bottom:1px solid var(--a-line)} body .ax .ax-acc summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:20px 4px;cursor:pointer;list-style:none} body .ax .ax-acc summary::-webkit-details-marker{display:none} body .ax .ax-acc summary:focus-visible{outline:2px solid var(--a-acc);outline-offset:2px;border-radius:8px} body .ax .ax-acc details[open] .ax-badge{background:var(--a-acc);color:var(--buildpress-color-cd-on-brand,var(--a-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .ax .ax-plus{position:relative;width:34px;height:34px;border-radius:50%;border:1px solid var(--a-line)} body .ax .ax-plus::before,body .ax .ax-plus::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.6px;background:var(--a-ink-raw,var(--a-ink));transform:translate(-50%,-50%);transition:transform .25s} body .ax .ax-plus::after{transform:translate(-50%,-50%) rotate(90deg)} body .ax .ax-acc details[open] .ax-plus::after{transform:translate(-50%,-50%) rotate(0)} body .ax .ax-acc-body{display:flex;flex-direction:column;align-items:flex-start;padding:0 4px 22px 66px} body .ax .ax-acc-body .ax-link{padding-top:12px} /* x10 Dark panel */ body .ax .ax-panel{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center} body .ax .ax-panel-side{position:relative;align-self:stretch;display:flex;align-items:center;padding:clamp(32px,4.5vw,64px) clamp(60px,7vw,110px) clamp(32px,4.5vw,64px) clamp(28px,4vw,56px);border-radius:28px;background:var(--a-dark);overflow:hidden} body .ax .ax-panel-side::after{content:"";position:absolute;left:-80px;top:-80px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--a-acc) 38%,transparent),transparent 70%)} body .ax .ax-panel-side .ax-head{position:relative;z-index:1;margin-bottom:0} body .ax .ax-panel-side .ax-eyebrow{color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 75%,transparent)} body .ax .ax-panel-side .ax-title{color:var(--site-tone-on,var(--a-white))} body .ax .ax-panel-side .ax-title em{color:color-mix(in srgb,var(--buildpress-color-cd-red) 60%,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)))} body .ax .ax-panel-side .ax-lead{color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 75%,transparent)} body .ax .ax-panel-list{position:relative;z-index:2;display:grid;gap:12px;margin-left:clamp(-72px,-5vw,-40px)} body .ax .ax-panel-list li{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center;padding:22px 24px;border-radius:20px;background:var(--a-bg);border:1px solid var(--a-line);box-shadow:0 26px 50px -30px color-mix(in srgb,var(--a-dark) 40%,transparent);transition:transform .3s cubic-bezier(.2,.8,.2,1)} body .ax .ax-panel-list p{margin-top:4px;font-size:15px} body .ax .ax-panel-list li:hover{transform:translateX(-6px)} body .ax .ax-panel-list li:hover .ax-go{background:var(--a-acc);border-color:var(--a-acc);color:var(--buildpress-color-cd-on-brand,var(--a-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} @media (max-width:1023px){ body .ax .ax-split .ax-head{grid-template-columns:1fr;grid-template-areas:"eye" "title" "lead"} body .ax .ax-split .ax-lead{margin-top:16px} body .ax .ax-rows li{grid-template-columns:40px minmax(0,1fr) auto;row-gap:8px} body .ax .ax-rows p{grid-column:2/3} body .ax .ax-rows .ax-go{grid-column:3;grid-row:1/span 2} body .ax .ax-accg,body .ax .ax-panel{grid-template-columns:1fr} body .ax .ax-accg-pic{aspect-ratio:16/10} body .ax .ax-panel-side{padding:clamp(28px,5vw,48px);padding-bottom:80px} body .ax .ax-panel-list{margin:-48px 16px 0} } @media (max-width:640px){ body .ax .ax-photo{min-height:360px} body .ax .ax-tile{min-height:260px} body .ax .ax-acc-body{padding-left:4px} body .ax .ax-panel-list{margin:-40px 0 0} body .ax .ax-panel-list li{grid-template-columns:auto minmax(0,1fr);padding:18px} body .ax .ax-panel-list .ax-go{display:none} } @media (prefers-reduced-motion:reduce){body .ax *{transition:none!important}} /* == Merged from bp-cd-industries (Industries We Serve), 2026-10-10 == */ /* CD Industries — `body`-prefixed like every CD section. */ body .cd-industries { --nx-h2: clamp(1.7rem, 3.2vw, 2.3rem); padding: 5.5rem 0; background: var(--buildpress-color-cd-wash); } body .cd-industries .nx-container { width: 100%; max-width: 81.25rem; margin: 0 auto; padding: 0 1.5rem; } body .cd-industries .nx-head { max-width: 44rem; margin: 0 auto 3rem; text-align: center; } body .cd-industries .nx-head--left { margin: 0 0 2rem; text-align: left; } body .cd-industries .cd-eyebrow { display: inline-flex; align-items: center; gap: 0.5625rem; padding: 0.375rem 0.8125rem; border-radius: 62.4375rem; background: var(--buildpress-color-cd-wash); border: 0.0625rem solid var(--buildpress-color-cd-line); font-size: 0.74rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy))); } body .cd-industries .cd-eyebrow__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--buildpress-color-cd-red);--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-industries .nx-title { margin: 1rem 0 0; font-size: var(--nx-h2); font-weight: 800; letter-spacing: -0.02em; line-height: 1.18; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); text-wrap: balance; } body .cd-industries .nx-text { margin: 0.875rem 0 0; font-size: 1rem; line-height: 1.7; color: var(--buildpress-color-cd-muted); } body .cd-industries .nx-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.9375rem 1.625rem; border-radius: 62.4375rem; background: var(--buildpress-color-cd-red); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))); font-size: 0.95rem; font-weight: 700; line-height: 1.2; text-decoration: none; white-space: nowrap; transition: background 0.2s ease;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-industries .nx-btn:hover { background: var(--buildpress-color-cd-red-700); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))); } body .cd-industries .nx-btn svg { width: 1.125rem; height: 1.125rem; } body .cd-industries .nx-btn--ghost { background: transparent; border: 0.125rem solid var(--buildpress-color-cd-line); color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } body .cd-industries .nx-btn--ghost:hover { background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } @media (max-width: 40rem) { body .cd-industries { padding: 4rem 0; } body .cd-industries .nx-container { padding: 0 1.25rem; } } body .cd-industries .cd-industries__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; margin: 0; padding: 0; list-style: none; } body .cd-industries .cd-industries__item { display: flex; margin: 0; padding: 0; } body .cd-industries .cd-industries__card { position: relative; display: flex; flex-direction: column; gap: 1rem; width: 100%; padding: 1.75rem; border-radius: 1.25rem; background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); border: 0.0625rem solid var(--buildpress-color-cd-line); color: inherit; text-decoration: none; transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; } body .cd-industries a.cd-industries__card:hover { border-color: var(--buildpress-color-cd-red); transform: translateY(-0.125rem); box-shadow: 0 0.75rem 2rem color-mix(in srgb, var(--buildpress-color-cd-navy-800) 10%, transparent); } body .cd-industries .cd-industries__ic { display: grid; place-items: center; flex-shrink: 0; width: 3rem; height: 3rem; border-radius: 0.875rem; background: color-mix(in srgb, var(--buildpress-color-cd-red) 10%, transparent); color: var(--buildpress-color-cd-red); } body .cd-industries .cd-industries__ic svg { width: 1.5rem; height: 1.5rem; } body .cd-industries .cd-industries__name { margin: 0; font-size: 1.125rem; font-weight: 800; line-height: 1.3; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } body .cd-industries .cd-industries__text { margin: 0.375rem 0 0; font-size: 0.95rem; line-height: 1.6; color: var(--buildpress-color-cd-muted); } body .cd-industries .cd-industries__go { position: absolute; top: 1.75rem; right: 1.75rem; display: flex; color: var(--buildpress-color-cd-muted); transition: color 0.2s ease, transform 0.2s ease; } body .cd-industries .cd-industries__go svg { width: 1.25rem; height: 1.25rem; } body .cd-industries a.cd-industries__card:hover .cd-industries__go { color: var(--buildpress-color-cd-red); transform: translateX(0.1875rem); } body .cd-industries .cd-industries__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem 1.5rem; margin-top: 2.75rem; text-align: center; } body .cd-industries .cd-industries__foot p { margin: 0; font-size: 1rem; line-height: 1.6; color: var(--buildpress-color-cd-muted); } @media (max-width: 56rem) { body .cd-industries .cd-industries__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 40rem) { body .cd-industries .cd-industries__grid { grid-template-columns: minmax(0, 1fr); } body .cd-industries .cd-industries__card { padding: 1.5rem; } } /* ---------------- Designs ---------------- */ /* Pill list: compact chips, names only */ body .cd-industries.cd-industries--pills { background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); } body .cd-industries.cd-industries--pills .cd-industries__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; max-width: 62rem; margin: 0 auto; } body .cd-industries.cd-industries--pills .cd-industries__card { flex-direction: row; align-items: center; gap: 0.625rem; padding: 0.5rem 1.125rem 0.5rem 0.5rem; border-radius: 62.4375rem; background: var(--buildpress-color-cd-wash); } body .cd-industries.cd-industries--pills .cd-industries__ic { width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); } body .cd-industries.cd-industries--pills .cd-industries__ic svg { width: 1.125rem; height: 1.125rem; } body .cd-industries.cd-industries--pills .cd-industries__name { font-size: 0.975rem; font-weight: 700; } body .cd-industries.cd-industries--pills .cd-industries__text { display: none; } body .cd-industries.cd-industries--pills .cd-industries__go { position: static; } body .cd-industries.cd-industries--pills .cd-industries__go svg { width: 1rem; height: 1rem; } body .cd-industries.cd-industries--pills .nx-btn--ghost:hover { background: var(--buildpress-color-cd-wash); } /* Dark */ body .cd-industries.cd-industries--dark { background: var(--buildpress-color-cd-navy-800); } body .cd-industries.cd-industries--dark .nx-title { color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } body .cd-industries.cd-industries--dark .nx-text, body .cd-industries.cd-industries--dark .cd-industries__foot p { color: var(--site-tone-soft,var(--buildpress-color-cd-navy-50)); } body .cd-industries.cd-industries--dark .cd-eyebrow { background: color-mix(in srgb, var(--buildpress-color-cd-white) 10%, transparent); border-color: color-mix(in srgb, var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 18%, transparent); color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } body .cd-industries.cd-industries--dark .cd-industries__card { background: var(--buildpress-color-cd-navy-700); border-color: color-mix(in srgb, var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 10%, transparent); } body .cd-industries.cd-industries--dark a.cd-industries__card:hover { border-color: var(--buildpress-color-cd-red); } body .cd-industries.cd-industries--dark .cd-industries__ic { background: var(--buildpress-color-cd-red); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-industries.cd-industries--dark .cd-industries__name { color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } body .cd-industries.cd-industries--dark .cd-industries__text, body .cd-industries.cd-industries--dark .cd-industries__go { color: var(--site-tone-soft,var(--buildpress-color-cd-navy-50)); } body .cd-industries.cd-industries--dark .nx-btn--ghost { border-color: color-mix(in srgb, var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 30%, transparent); color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } body .cd-industries.cd-industries--dark .nx-btn--ghost:hover { background: color-mix(in srgb, var(--buildpress-color-cd-white) 10%, transparent); color: var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)); } /* === Industries We Serve redesign 2026-09-28: Grid, Pill list, Dark + Scrolling rows (x04), Split list (x05) === */ body .inx{--n-bg:var(--buildpress-color-cd-white);--n-ink:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));--n-ink-raw:var(--buildpress-color-cd-navy);--n-text:var(--buildpress-color-cd-text);--n-soft:var(--buildpress-color-cd-wash);--n-line:var(--buildpress-color-cd-line);--n-acc:var(--buildpress-color-cd-red);--n-acc-h:var(--buildpress-color-cd-red-700);--n-dark:var(--buildpress-color-cd-navy-800);--n-white:var(--buildpress-color-cd-white);position:relative;isolation:isolate;overflow:clip;background:var(--n-bg);color:var(--n-text);font:400 16px/1.65 var(--buildpress-font-family-body)} body .inx *{box-sizing:border-box} body .inx :is(h2,h3,p,ul){margin:0} body .inx ul{list-style:none;padding:0} body .inx a{text-decoration:none} body .inx svg{display:block} body .inx .inx-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} body .inx .inx-wrap{position:relative;z-index:2;max-width:1344px;margin:0 auto;padding:clamp(56px,8vw,112px) clamp(20px,5vw,64px)} body .inx .inx-head{margin-bottom:clamp(36px,5vw,56px)} body .inx .inx-eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 11px/1.5 var(--buildpress-font-family-body);letter-spacing:.16em;text-transform:uppercase;color:var(--n-text)} body .inx .inx-eyebrow::before{content:"";width:24px;height:2px;background:var(--n-acc);flex:none;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .inx .inx-title{margin-top:16px;max-width:18ch;font:500 clamp(30px,4vw,50px)/1.08 var(--buildpress-font-family-heading);letter-spacing:-.04em;color:var(--n-ink);text-wrap:balance} body .inx .inx-title em{font-style:normal;color:var(--n-acc)} body .inx .inx-lead{margin-top:16px;max-width:56ch;font-size:17px;line-height:1.7} body .inx h3{font:500 20px/1.3 var(--buildpress-font-family-heading);letter-spacing:-.02em;color:var(--n-ink)} body .inx li p{margin-top:8px;font-size:15.5px;line-height:1.65} body .inx .inx-head--center{display:flex;flex-direction:column;align-items:center;text-align:center} body .inx .inx-head--center .inx-eyebrow::after{content:"";width:24px;height:2px;background:var(--n-acc);flex:none;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .inx .inx-head--center .inx-title{margin-inline:auto} body .inx .inx-head--center .inx-lead{margin-inline:auto} body .inx .inx-split .inx-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-areas:"eye eye" "title lead";column-gap:6%;align-items:end} body .inx .inx-split .inx-eyebrow{grid-area:eye} body .inx .inx-split .inx-title{grid-area:title} body .inx .inx-split .inx-lead{grid-area:lead;margin-top:0} body .inx .inx-stretch{position:absolute;inset:0;z-index:3;border-radius:inherit} body .inx .inx-stretch:focus-visible{outline:2px solid var(--n-acc);outline-offset:3px} body .inx .inx-btn{display:inline-flex;align-items:center;gap:12px;min-height:50px;padding:0 24px;border-radius:999px;background:var(--n-acc);color:var(--buildpress-color-cd-on-brand,var(--n-white));font:600 15px/1 var(--buildpress-font-family-body);white-space:nowrap;transition:background .2s;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .inx .inx-btn svg{width:17px;height:17px;transition:transform .2s} body .inx .inx-btn:hover{background:var(--n-acc-h);color:var(--buildpress-color-cd-on-brand,var(--n-white))} body .inx .inx-btn:hover svg{transform:translateX(3px)} body .inx .inx-btn:focus-visible{outline:2px solid var(--n-acc);outline-offset:3px} body .inx .inx-btn--light{background:var(--n-white);color:var(--n-dark)} body .inx .inx-btn--light:hover{background:var(--n-acc);color:var(--buildpress-color-cd-on-brand,var(--n-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .inx .inx-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;margin-top:clamp(32px,4vw,48px)} body .inx .inx-foot p{font:500 clamp(18px,1.8vw,22px)/1.35 var(--buildpress-font-family-heading);letter-spacing:-.02em;color:var(--n-ink)} body .inx .inx-foot--card{padding:22px 22px 22px 30px;border-radius:20px;background:var(--n-soft)} body .inx .inx-foot--center{flex-direction:column;justify-content:center;text-align:center} /* Grid */ body .inx .inx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} body .inx .inx-card{position:relative;display:flex;flex-direction:column;padding:28px;border-radius:22px;background:var(--n-soft);border:1px solid transparent;transition:background .35s,border-color .35s,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s} body .inx .inx-card:hover{background:var(--n-bg);border-color:var(--n-line);transform:translateY(-4px);box-shadow:0 26px 50px -30px color-mix(in srgb,var(--n-dark) 40%,transparent)} body .inx .inx-card-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:26px} body .inx .inx-tile{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:linear-gradient(145deg,color-mix(in srgb,var(--n-acc) 16%,var(--n-bg)),var(--n-bg));color:var(--n-acc);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--n-acc) 18%,transparent);transition:background .3s,color .3s} body .inx .inx-tile svg{width:24px;height:24px} body .inx .inx-card:hover .inx-tile{background:var(--n-acc);color:var(--buildpress-color-cd-on-brand,var(--n-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .inx .inx-go{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--n-line);color:var(--n-ink);transition:background .3s,color .3s,border-color .3s,transform .3s} body .inx .inx-go svg{width:16px;height:16px} body .inx .inx-card:hover .inx-go{background:var(--n-acc);border-color:var(--n-acc);color:var(--buildpress-color-cd-on-brand,var(--n-white));transform:rotate(-45deg);--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} /* Pill list */ body .inx--pills{background:var(--n-soft)} body .inx .inx-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:1040px;margin:0 auto} body .inx .inx-pill{position:relative;display:inline-flex;align-items:center;gap:12px;padding:10px 22px 10px 10px;border-radius:999px;background:var(--n-bg);border:1px solid var(--n-line);box-shadow:0 10px 24px -18px color-mix(in srgb,var(--n-dark) 40%,transparent);transition:background .3s,border-color .3s,transform .3s} body .inx .inx-pill-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:color-mix(in srgb,var(--n-acc) 10%,transparent);color:var(--n-acc);transition:background .3s,color .3s} body .inx .inx-pill-ic svg{width:20px;height:20px} body .inx .inx-pill-name{font:500 17px/1.2 var(--buildpress-font-family-heading);letter-spacing:-.015em;color:var(--n-ink);transition:color .3s} body .inx .inx-pill:hover{background:var(--n-dark);border-color:var(--n-dark);transform:translateY(-3px)} body .inx .inx-pill:hover .inx-pill-ic{background:var(--n-acc);color:var(--buildpress-color-cd-on-brand,var(--n-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .inx .inx-pill:hover .inx-pill-name{color:var(--site-tone-on,var(--n-white))} body .inx .inx-pill-tip{position:absolute;left:50%;bottom:calc(100% + 12px);z-index:5;width:max-content;max-width:260px;padding:12px 14px;border-radius:12px;background:var(--n-dark);color:var(--site-tone-on,var(--n-white));font-size:13.5px;line-height:1.5;text-align:center;opacity:0;visibility:hidden;transform:translate(-50%,6px);transition:opacity .2s,transform .2s,visibility 0s linear .2s;pointer-events:none} body .inx .inx-pill-tip::after{content:"";position:absolute;left:50%;top:100%;border:6px solid transparent;border-top-color:var(--n-dark);transform:translateX(-50%)} body .inx .inx-pill:hover .inx-pill-tip,body .inx .inx-pill:focus-within .inx-pill-tip{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .2s,transform .2s} /* Dark */ body .inx--dark{--n-bg:var(--n-dark);--n-ink:var(--n-white);--n-ink-raw:var(--n-white);--n-text:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 72%,transparent);--n-line:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 12%,transparent);--n-soft:color-mix(in srgb,var(--buildpress-color-cd-white) 6%,transparent)} body .inx--dark .inx-title em{color:color-mix(in srgb,var(--buildpress-color-cd-red) 60%,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)))} body .inx .inx-glow{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 45% 55% at 0% 0%,color-mix(in srgb,var(--n-acc) 24%,transparent),transparent 70%),linear-gradient(color-mix(in srgb,var(--n-white) 4%,transparent) 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,color-mix(in srgb,var(--n-white) 4%,transparent) 1px,transparent 1px) 0 0/64px 64px} body .inx .inx-glass{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} body .inx .inx-gcard{position:relative;padding:28px;border-radius:22px;border:1px solid var(--n-line);background:linear-gradient(180deg,color-mix(in srgb,var(--n-white) 7%,transparent),color-mix(in srgb,var(--n-white) 2%,transparent));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow:hidden;transition:border-color .3s,transform .3s} body .inx .inx-gcard::after{content:"";position:absolute;left:24px;right:24px;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--n-acc),transparent);opacity:0;transition:opacity .3s} body .inx .inx-gcard:hover{border-color:color-mix(in srgb,var(--n-acc) 45%,transparent);transform:translateY(-4px)} body .inx .inx-gcard:hover::after{opacity:1} body .inx .inx-gtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px} body .inx .inx-gic{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:linear-gradient(145deg,var(--n-acc),color-mix(in srgb,var(--n-acc) 55%,var(--n-dark)));color:var(--site-tone-on,var(--n-white));box-shadow:0 14px 30px -12px color-mix(in srgb,var(--n-acc) 70%,transparent)} body .inx .inx-gic svg{width:23px;height:23px} body .inx .inx-idx{font:500 13px/1 var(--buildpress-font-family-heading);color:color-mix(in srgb,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)) 45%,transparent);font-variant-numeric:tabular-nums} body .inx .inx-foot--glass{padding:22px 22px 22px 30px;border-radius:20px;border:1px solid var(--n-line);background:var(--n-soft)} /* x04 Scrolling rows */ body .inx .inx-mq-head{display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:20px 48px;align-items:end;margin-bottom:clamp(36px,5vw,56px)} body .inx .inx-mq-head .inx-head{margin-bottom:0} body .inx .inx-mq{display:grid;gap:14px;margin-inline:calc(-1 * clamp(20px,5vw,64px));-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)} body .inx .inx-mq-row{overflow:hidden} body .inx .inx-mq-track{display:flex;gap:14px;width:max-content;animation:inxmq 50s linear infinite} body .inx .inx-mq-row.is-rev .inx-mq-track{animation-direction:reverse} body .inx .inx-mq:hover .inx-mq-track{animation-play-state:paused} body .inx .inx-chip{display:inline-flex;align-items:center;gap:12px;padding:12px 24px 12px 12px;border-radius:999px;border:1px solid var(--n-line);background:var(--n-bg);font:500 clamp(18px,1.8vw,24px)/1 var(--buildpress-font-family-heading);letter-spacing:-.02em;color:var(--n-ink);white-space:nowrap} body .inx .inx-mq-row.is-rev .inx-chip{background:var(--n-soft);border-color:transparent} body .inx .inx-chip-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--n-acc);color:var(--buildpress-color-cd-on-brand,var(--n-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .inx .inx-chip-ic svg{width:21px;height:21px} body .inx .inx-note{margin-top:clamp(28px,4vw,44px);text-align:center;font:500 18px/1.4 var(--buildpress-font-family-heading);color:var(--n-ink)} @keyframes inxmq{to{transform:translateX(-50%)}} /* x05 Split list */ body .inx .inx-sl{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,6vw,96px);align-items:start} body .inx .inx-sl-side{position:sticky;top:110px} body .inx .inx-sl-side .inx-head{margin-bottom:28px} body .inx .inx-sl-card{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:28px;border-radius:22px;background:var(--n-dark)} body .inx .inx-sl-card p{font:500 19px/1.35 var(--buildpress-font-family-heading);letter-spacing:-.02em;color:var(--site-tone-on,var(--n-white))} body .inx .inx-sl-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(20px,3vw,40px);border-top:1px solid var(--n-line)} body .inx .inx-sl-item{position:relative;display:flex;gap:16px;align-items:flex-start;padding:24px 8px;border-bottom:1px solid var(--n-line);transition:background .25s} body .inx .inx-sl-item:hover{background:var(--n-soft)} body .inx .inx-ring{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;border:1px solid var(--n-line);color:var(--n-acc);transition:background .25s,color .25s,border-color .25s} body .inx .inx-ring svg{width:21px;height:21px} body .inx .inx-sl-item:hover .inx-ring{background:var(--n-acc);border-color:var(--n-acc);color:var(--buildpress-color-cd-on-brand,var(--n-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .inx .inx-sl-item p{margin-top:4px;font-size:15px} @media (max-width:1023px){ body .inx .inx-split .inx-head{grid-template-columns:1fr;grid-template-areas:"eye" "title" "lead"} body .inx .inx-split .inx-lead{margin-top:16px} body .inx :is(.inx-grid,.inx-glass){grid-template-columns:repeat(2,minmax(0,1fr))} body .inx .inx-mq-head{grid-template-columns:1fr} body .inx .inx-mq-head .inx-btn{justify-self:start} body .inx .inx-sl{grid-template-columns:1fr} body .inx .inx-sl-side{position:static} } @media (max-width:640px){ body .inx :is(.inx-grid,.inx-glass,.inx-sl-list){grid-template-columns:1fr} body .inx :is(.inx-card,.inx-gcard){padding:24px} body .inx .inx-foot--card,body .inx .inx-foot--glass{padding:20px} body .inx .inx-pill-tip{display:none} } @media (prefers-reduced-motion:reduce){body .inx *{transition:none!important}body .inx .inx-mq-track{animation:none}} /* == Merged from bp-cd-usecases (Use Cases), 2026-10-10 == */ /* CD Use Cases — `body`-prefixed like every CD section. */ body .cd-usecases { --nx-h2: clamp(1.7rem, 3.2vw, 2.3rem); padding: 5.5rem 0; background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); } body .cd-usecases .nx-container { width: 100%; max-width: 81.25rem; margin: 0 auto; padding: 0 1.5rem; } body .cd-usecases .nx-head { max-width: 44rem; margin: 0 auto 3rem; text-align: center; } body .cd-usecases .nx-head--left { margin: 0 0 2rem; text-align: left; } body .cd-usecases .cd-eyebrow { display: inline-flex; align-items: center; gap: 0.5625rem; padding: 0.375rem 0.8125rem; border-radius: 62.4375rem; background: var(--buildpress-color-cd-wash); border: 0.0625rem solid var(--buildpress-color-cd-line); font-size: 0.74rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy))); } body .cd-usecases .cd-eyebrow__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--buildpress-color-cd-red);--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-usecases .nx-title { margin: 1rem 0 0; font-size: var(--nx-h2); font-weight: 800; letter-spacing: -0.02em; line-height: 1.18; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); text-wrap: balance; } body .cd-usecases .nx-text { margin: 0.875rem 0 0; font-size: 1rem; line-height: 1.7; color: var(--buildpress-color-cd-muted); } body .cd-usecases .nx-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.9375rem 1.625rem; border-radius: 62.4375rem; background: var(--buildpress-color-cd-red); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))); font-size: 0.95rem; font-weight: 700; line-height: 1.2; text-decoration: none; white-space: nowrap; transition: background 0.2s ease;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-usecases .nx-btn:hover { background: var(--buildpress-color-cd-red-700); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))); } body .cd-usecases .nx-btn svg { width: 1.125rem; height: 1.125rem; } body .cd-usecases .nx-btn--ghost { background: transparent; border: 0.125rem solid var(--buildpress-color-cd-line); color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } body .cd-usecases .nx-btn--ghost:hover { background: var(--buildpress-color-cd-wash); color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } @media (max-width: 40rem) { body .cd-usecases { padding: 4rem 0; } body .cd-usecases .nx-container { padding: 0 1.25rem; } } /* Cards (default) */ body .cd-usecases .cd-usecases__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; } body .cd-usecases .cd-usecases__item { position: relative; display: flex; flex-direction: column; padding: 2rem; border-radius: 1.25rem; background: var(--buildpress-color-cd-wash); border: 0.0625rem solid var(--buildpress-color-cd-line); } body .cd-usecases .cd-usecases__num { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; margin-bottom: 1.125rem; border-radius: 0.75rem; background: var(--buildpress-color-cd-red); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white))); font-size: 0.85rem; font-weight: 800; letter-spacing: 0.04em;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-usecases .cd-usecases__title { margin: 0 0 1.125rem; font-size: 1.2rem; font-weight: 800; line-height: 1.3; letter-spacing: -0.01em; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); } body .cd-usecases .cd-usecases__panel { display: grid; gap: 1rem; } body .cd-usecases .cd-usecases__panel[hidden] { display: none; } body .cd-usecases .cd-usecases__block p { margin: 0.25rem 0 0; font-size: 0.975rem; line-height: 1.65; color: var(--buildpress-color-cd-text); } body .cd-usecases .cd-usecases__label { display: block; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--buildpress-color-cd-muted); } body .cd-usecases .cd-usecases__block--help { padding-left: 1rem; border-left: 0.1875rem solid var(--buildpress-color-cd-red); } body .cd-usecases .cd-usecases__block--help .cd-usecases__label { color: var(--buildpress-color-cd-red); } body .cd-usecases .cd-usecases__link { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.95rem; font-weight: 700; color: var(--buildpress-color-cd-red); text-decoration: none; } body .cd-usecases .cd-usecases__link:hover { color: var(--buildpress-color-cd-red-700); } body .cd-usecases .cd-usecases__link svg { width: 1rem; height: 1rem; } body .cd-usecases .cd-usecases__foot { display: flex; justify-content: center; margin-top: 2.75rem; } @media (max-width: 48rem) { body .cd-usecases .cd-usecases__list { grid-template-columns: minmax(0, 1fr); } body .cd-usecases .cd-usecases__item { padding: 1.5rem; } } /* ---------------- Designs ---------------- */ /* Accordion */ body .cd-usecases.cd-usecases--accordion { background: var(--buildpress-color-cd-wash); } body .cd-usecases.cd-usecases--accordion .cd-usecases__list { display: block; max-width: 52rem; margin: 0 auto; border-radius: 1.25rem; background: var(--buildpress-color-cd-surface, var(--buildpress-color-cd-white)); border: 0.0625rem solid var(--buildpress-color-cd-line); overflow: hidden; } body .cd-usecases.cd-usecases--accordion .cd-usecases__item { padding: 0; border: 0; border-radius: 0; background: transparent; } body .cd-usecases.cd-usecases--accordion .cd-usecases__item + .cd-usecases__item { border-top: 0.0625rem solid var(--buildpress-color-cd-line); } body .cd-usecases.cd-usecases--accordion .cd-usecases__title { margin: 0; } body .cd-usecases.cd-usecases--accordion .cd-usecases__toggle { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; padding: 1.375rem 1.75rem; margin: 0; appearance: none; background: none; border: 0; border-radius: 0; font: inherit; font-size: 1.1rem; font-weight: 800; line-height: 1.35; text-align: left; color: var(--buildpress-color-cd-heading, var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy-800))); cursor: pointer; } body .cd-usecases.cd-usecases--accordion .cd-usecases__toggle:hover { background: var(--buildpress-color-cd-wash); } body .cd-usecases.cd-usecases--accordion .cd-usecases__toggle:focus-visible { outline: 0.125rem solid var(--buildpress-color-cd-red); outline-offset: -0.125rem; } body .cd-usecases.cd-usecases--accordion .cd-usecases__chev { display: grid; place-items: center; flex-shrink: 0; width: 2rem; height: 2rem; border-radius: 50%; background: var(--buildpress-color-cd-wash); color: var(--buildpress-color-cd-red); transition: transform 0.25s ease; } body .cd-usecases.cd-usecases--accordion .cd-usecases__chev svg { width: 1rem; height: 1rem; } body .cd-usecases.cd-usecases--accordion .cd-usecases__toggle[aria-expanded="true"] .cd-usecases__chev { transform: rotate(180deg); background: var(--buildpress-color-cd-red); color: var(--buildpress-color-cd-on-brand,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .cd-usecases.cd-usecases--accordion .cd-usecases__panel { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 2rem; padding: 0 1.75rem 1.75rem; } body .cd-usecases.cd-usecases--accordion .cd-usecases__link { grid-column: 1 / -1; } @media (max-width: 40rem) { body .cd-usecases.cd-usecases--accordion .cd-usecases__toggle { padding: 1.125rem 1.25rem; font-size: 1rem; } body .cd-usecases.cd-usecases--accordion .cd-usecases__panel { grid-template-columns: minmax(0, 1fr); padding: 0 1.25rem 1.5rem; } } /* Split list: sticky intro, numbered rows */ body .cd-usecases.cd-usecases--split .cd-usecases__layout { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr); gap: 4rem; align-items: start; } body .cd-usecases.cd-usecases--split .cd-usecases__intro { position: sticky; top: 6rem; } body .cd-usecases.cd-usecases--split .cd-usecases__list { display: block; } body .cd-usecases.cd-usecases--split .cd-usecases__item { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); column-gap: 1.25rem; padding: 2rem 0; border: 0; border-top: 0.0625rem solid var(--buildpress-color-cd-line); border-radius: 0; background: transparent; } body .cd-usecases.cd-usecases--split .cd-usecases__item:last-child { border-bottom: 0.0625rem solid var(--buildpress-color-cd-line); } body .cd-usecases.cd-usecases--split .cd-usecases__num { grid-row: span 2; width: auto; height: auto; margin: 0; place-items: start; background: none; font-size: 1.6rem; letter-spacing: -0.02em; color: var(--buildpress-color-cd-red); } body .cd-usecases.cd-usecases--split .cd-usecases__title { margin-bottom: 0.875rem; } body .cd-usecases.cd-usecases--split .cd-usecases__panel { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.75rem; } body .cd-usecases.cd-usecases--split .cd-usecases__link { grid-column: 1 / -1; } @media (max-width: 56rem) { body .cd-usecases.cd-usecases--split .cd-usecases__layout { grid-template-columns: minmax(0, 1fr); gap: 2rem; } body .cd-usecases.cd-usecases--split .cd-usecases__intro { position: static; } } @media (max-width: 40rem) { body .cd-usecases.cd-usecases--split .cd-usecases__item { grid-template-columns: minmax(0, 1fr); } body .cd-usecases.cd-usecases--split .cd-usecases__num { grid-row: auto; margin-bottom: 0.5rem; font-size: 1.25rem; } body .cd-usecases.cd-usecases--split .cd-usecases__panel { grid-template-columns: minmax(0, 1fr); } } /* === Use Cases: Scenario tabs (x04), Path (x05) — 2026-09-28 === */ body .ux{--u-bg:var(--buildpress-color-cd-white);--u-ink:var(--buildpress-color-cd-heading,var(--buildpress-color-cd-navy));--u-ink-raw:var(--buildpress-color-cd-navy);--u-text:var(--buildpress-color-cd-text);--u-soft:var(--buildpress-color-cd-wash);--u-line:var(--buildpress-color-cd-line);--u-acc:var(--buildpress-color-cd-red);--u-acc-h:var(--buildpress-color-cd-red-700);--u-dark:var(--buildpress-color-cd-navy-800);--u-white:var(--buildpress-color-cd-white);position:relative;isolation:isolate;overflow:clip;background:var(--u-bg);color:var(--u-text);font:400 16px/1.65 var(--buildpress-font-family-body)} body .ux *{box-sizing:border-box} body .ux :is(h2,h3,p,ol){margin:0} body .ux ol{list-style:none;padding:0} body .ux a{text-decoration:none} body .ux button{font:inherit;text-transform:none;letter-spacing:inherit;box-shadow:none;min-height:0;white-space:normal} body .ux svg{display:block} body .ux .ux-wrap{position:relative;z-index:2;max-width:1344px;margin:0 auto;padding:clamp(56px,8vw,112px) clamp(20px,5vw,64px)} body .ux .ux-eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 11px/1.5 var(--buildpress-font-family-body);letter-spacing:.16em;text-transform:uppercase;color:var(--u-text)} body .ux .ux-eyebrow::before{content:"";width:24px;height:2px;background:var(--u-acc);flex:none;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .ux .ux-title{margin-top:16px;max-width:18ch;font:500 clamp(30px,4vw,50px)/1.08 var(--buildpress-font-family-heading);letter-spacing:-.04em;color:var(--u-ink);text-wrap:balance} body .ux .ux-title em{font-style:normal;color:var(--u-acc)} body .ux .ux-lead{margin-top:16px;max-width:56ch;font-size:17px;line-height:1.7} body .ux .ux-head--center{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:clamp(40px,5vw,64px)} body .ux .ux-head--center .ux-eyebrow::after{content:"";width:24px;height:2px;background:var(--u-acc);flex:none;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .ux .ux-head--center .ux-title,body .ux .ux-head--center .ux-lead{margin-inline:auto} body .ux h3{font:500 20px/1.25 var(--buildpress-font-family-heading);letter-spacing:-.02em;color:var(--u-ink)} body .ux .ux-label{display:block;margin-bottom:6px;font:600 10.5px/1.4 var(--buildpress-font-family-body);letter-spacing:.14em;text-transform:uppercase;color:var(--u-text)} body .ux .ux-btn{display:inline-flex;align-items:center;gap:12px;min-height:50px;padding:0 24px;border-radius:999px;background:var(--u-acc);color:var(--buildpress-color-cd-on-brand,var(--u-white));font:600 15px/1 var(--buildpress-font-family-body);white-space:nowrap;transition:background .2s;--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .ux .ux-btn svg{width:17px;height:17px;transition:transform .2s} body .ux .ux-btn:hover{background:var(--u-acc-h);color:var(--buildpress-color-cd-on-brand,var(--u-white))} body .ux .ux-btn:hover svg{transform:translateX(3px)} body .ux .ux-btn:focus-visible{outline:2px solid var(--u-acc);outline-offset:3px} body .ux .ux-link{display:inline-flex;align-items:center;gap:8px;margin-top:20px;color:var(--u-ink);font:600 14px/1.3 var(--buildpress-font-family-body)} body .ux .ux-link svg{width:16px;height:16px;color:var(--u-acc)} /* x04 Scenario tabs */ body .ux .ux-top{display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:20px 48px;align-items:end;margin-bottom:clamp(36px,5vw,56px)} body .ux .ux-tabs{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(20px,3vw,40px);align-items:stretch} body .ux .ux-tablist{display:flex;flex-direction:column;gap:8px} body .ux .ux-tab{display:flex;align-items:center;gap:14px;width:100%;margin:0;padding:18px 20px;border:1px solid var(--u-line);border-radius:18px;background:var(--u-bg);color:color-mix(in srgb,var(--u-ink) 75%,transparent);font:500 17px/1.3 var(--buildpress-font-family-heading);letter-spacing:-.015em;text-align:left;cursor:pointer;transition:background .25s,border-color .25s,color .25s} body .ux .ux-n{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--u-soft);color:var(--u-acc);font-size:13px;transition:background .25s,color .25s} body .ux .ux-tab:hover{border-color:color-mix(in srgb,var(--u-acc) 35%,var(--u-line));background:var(--u-bg);color:var(--u-ink)} body .ux .ux-tab[aria-selected="true"]{background:var(--u-dark);border-color:var(--u-dark);color:var(--site-tone-on,var(--u-white))} body .ux .ux-tab[aria-selected="true"] .ux-n{background:var(--u-acc);color:var(--buildpress-color-cd-on-brand,var(--u-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .ux .ux-tab:focus-visible{outline:2px solid var(--u-acc);outline-offset:2px} body .ux .ux-panels{border-radius:26px;background:var(--u-soft);overflow:hidden} body .ux .ux-panel{display:flex;flex-direction:column;align-items:flex-start;height:100%;padding:clamp(26px,3.4vw,44px);animation:uxfade .4s ease} body .ux .ux-panel[hidden]{display:none} body .ux .ux-panel h3{font-size:clamp(24px,2.4vw,32px);line-height:1.15;letter-spacing:-.03em} body .ux .ux-flow{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:14px;align-items:stretch;width:100%;margin-top:26px} body .ux .ux-box{padding:22px;border-radius:18px;background:var(--u-bg);border:1px solid var(--u-line)} body .ux .ux-box p{font-size:15.5px;line-height:1.65;color:var(--u-ink)} body .ux .ux-box--help{background:var(--u-dark);border-color:var(--u-dark)} body .ux .ux-box--help .ux-label{color:color-mix(in srgb,var(--buildpress-color-cd-red) 60%,var(--buildpress-color-cd-on-dark,var(--buildpress-color-cd-white)))} body .ux .ux-box--help p{color:var(--site-tone-on,var(--u-white))} body .ux .ux-flow-arrow{display:grid;place-items:center;align-self:center;width:40px;height:40px;border-radius:50%;background:var(--u-acc);color:var(--buildpress-color-cd-on-brand,var(--u-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .ux .ux-flow-arrow svg{width:17px;height:17px} @keyframes uxfade{from{opacity:0}to{opacity:1}} /* x05 Path */ body .ux--x05{background:var(--u-soft)} body .ux .ux-path{position:relative;max-width:1100px;margin:0 auto} body .ux .ux-path::before{content:"";position:absolute;left:50%;top:10px;bottom:10px;width:2px;background:linear-gradient(var(--u-acc),color-mix(in srgb,var(--u-acc) 20%,var(--u-line)));transform:translateX(-50%)} body .ux .ux-step{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:88px;padding-bottom:clamp(24px,3vw,40px)} body .ux .ux-step:last-child{padding-bottom:0} body .ux .ux-node{position:absolute;left:50%;top:22px;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--u-bg);border:2px solid var(--u-acc);color:var(--u-acc);font:500 15px/1 var(--buildpress-font-family-heading);transform:translateX(-50%);box-shadow:0 0 0 8px var(--u-soft);z-index:1;transition:background .3s,color .3s} body .ux .ux-step:hover .ux-node{background:var(--u-acc);color:var(--buildpress-color-cd-on-brand,var(--u-white));--buildpress-color-cd-on-dark:var(--buildpress-color-cd-on-brand,#FFFFFF)} body .ux .ux-card{grid-column:1;position:relative;padding:28px;border-radius:24px;background:var(--u-bg);border:1px solid var(--u-line);box-shadow:0 24px 48px -32px color-mix(in srgb,var(--u-dark) 35%,transparent);transition:transform .35s cubic-bezier(.2,.8,.2,1)} body .ux .ux-step:nth-child(even) .ux-card{grid-column:2} body .ux .ux-step:hover .ux-card{transform:translateY(-4px)} body .ux .ux-card::after{content:"";position:absolute;top:44px;right:-44px;width:44px;border-top:2px dashed color-mix(in srgb,var(--u-acc) 40%,transparent)} body .ux .ux-step:nth-child(even) .ux-card::after{right:auto;left:-44px} body .ux .ux-card h3{font-size:22px} body .ux .ux-sit{margin-top:16px;padding-top:14px;border-top:1px solid var(--u-line);font-size:15px;line-height:1.6} body .ux .ux-help{margin-top:12px;padding:14px 16px;border-radius:14px;background:color-mix(in srgb,var(--u-acc) 7%,var(--u-bg));font-size:15px;line-height:1.6;color:var(--u-ink)} body .ux .ux-help .ux-label{color:var(--u-acc)} body .ux .ux-foot{display:flex;justify-content:center;margin-top:clamp(36px,5vw,56px)} @media (max-width:1023px){ body .ux .ux-top{grid-template-columns:1fr} body .ux .ux-top .ux-btn{justify-self:start} body .ux .ux-tabs{grid-template-columns:1fr} body .ux .ux-tablist{flex-direction:row;overflow-x:auto;scrollbar-width:none} body .ux .ux-tab{flex:0 0 min(80%,300px)} body .ux .ux-path::before{left:26px} body .ux .ux-step{grid-template-columns:1fr;gap:0;padding-left:76px} body .ux .ux-node{left:26px;top:18px} body .ux .ux-card,body .ux .ux-step:nth-child(even) .ux-card{grid-column:1} body .ux .ux-card::after,body .ux .ux-step:nth-child(even) .ux-card::after{left:-24px;right:auto;width:24px;top:44px} } @media (max-width:640px){ body .ux .ux-flow{grid-template-columns:1fr} body .ux .ux-flow-arrow{transform:rotate(90deg);justify-self:center} body .ux .ux-card{padding:22px} body .ux .ux-step{padding-left:64px} } @media (prefers-reduced-motion:reduce){body .ux *{transition:none!important;animation:none!important}} /* Path: left and right cards interlock instead of one per row. */ @media (min-width:1024px){body .ux .ux-step+.ux-step{margin-top:clamp(-150px,-11vw,-90px)}} /* Tabs: room for longer audience names on one line (2026-10-14). */ @media (min-width:900px){html body .rsx-wh-switch .w2-seg{max-width:min(920px,100%);width:max-content;min-width:min(640px,100%);grid-template-columns:repeat(var(--w2n,3),minmax(max-content,1fr))}html body .rsx-wh-switch .w2-seg button{white-space:nowrap;padding:8px 22px}} /* tone-split */ /* tone-split-2 */ /* ink-raw */ /* ink-raw-uses */