

:root { color-scheme: light; }
body.design-refresh { font-family: 'Helvena', Arial, sans-serif; font-weight: 400; }
body.design-refresh :is(button, input, select, textarea) { font-family: inherit; }
body.design-refresh h1 { font-family: 'Helvena', Arial, sans-serif; font-weight:600; }
/* All headings use the shared SemiBold weight; paragraphs remain Regular. */
body.design-refresh :is(h2, h3, h4, h5, h6) {
  font-family: 'Helvena', Arial, sans-serif;
  font-weight: 600 !important;
  letter-spacing: -.025em;
}
body.design-refresh p { font-family: 'Helvena', Arial, sans-serif; font-weight: 400; }
body.design-refresh .landing-hero .hero-copy h1 { letter-spacing: -.05em; line-height: 1.02; }
body.design-refresh.content-page h1, body.design-refresh .page-intro h1 { letter-spacing: -.045em; line-height: 1.03; }
/* These are specimens of the downloadable sample brand, rather than interface text. */
body.design-refresh :is(.mini-type, .type-a, .alphabet, .type-output, .type-scale strong) { font-family: 'Helvena', Arial, sans-serif; }

/* About cards: full-color surfaces, confident outlines, equal-height content, and lift. */
body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) { gap: 28px; align-items: stretch; }
body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) > * {
  --about-card: var(--citrus);
  --text: #000;
  --muted: #000;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: clamp(24px, 2.7vw, 38px);
  border: 2px solid #171717;
  border-radius: 18px;
  background: var(--about-card);
  color: #000;
  box-shadow: 6px 6px 0 #171717;
  transform: none;
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) > :nth-child(3n+2) { --about-card: var(--lilac); }
body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) > :nth-child(3n) { --about-card: var(--peach); }
body.design-refresh.about-page .services-grid > :nth-child(4) { --about-card: var(--pink); }
body.design-refresh.about-page .services-grid > :nth-child(5) { --about-card: var(--yellow); }
body.design-refresh.about-page .services-grid > :nth-child(6) { --about-card: var(--blue); }
body.design-refresh.about-page .ecosystem-grid > :nth-child(4) { --about-card: var(--pink); }
body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) > * > span {
  align-self: flex-start;
  display: inline-block;
  padding: 7px 11px;
  border: 1px solid #171717;
  border-radius: 100px;
  font-size: .875rem;
  line-height: 1.4;
  letter-spacing: .035em;
  background: #fff6;
}
body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) h3 {
  font-size: clamp(1.65rem, 2.3vw, 2.1rem);
  line-height: 1.15;
  letter-spacing: -.025em;
  margin: 32px 0 18px;
  overflow-wrap: anywhere;
}
body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) p { font-size: 1.125rem; line-height: 1.65; margin: 0; }
body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) > :is(:hover, :focus-within) {
  transform: translate(-2px, -4px);
  box-shadow: 9px 10px 0 #171717;
  background: #fffefa;
  border-color: #171717;
}
@media (max-width: 800px) {
  body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) { gap: 24px; }
}
@media (max-width: 600px) {
  body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) > * { box-shadow: 4px 4px 0 #171717; padding: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  body.design-refresh.about-page :is(.purpose-principles, .services-grid, .ecosystem-grid) > :is(:hover, :focus-within) { transform: none; transition: none; }
}

/* Native scrolling stays responsive to the mouse, keyboard, and touch. */
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
.design-refresh .site-header nav > .nav-demo { margin-left: auto; }
.design-refresh .footer-policies { display: flex; flex-wrap: wrap; gap: 14px 28px; margin-bottom: 24px; }
.design-refresh .footer-policies a { font-size: .875rem; text-decoration: underline; text-underline-offset: 4px; }

/* Plans are a simple comparison, without illustrations, color blocks, or tilted cards. */
body.design-refresh.pricing-page { background: #fffefa; }
body.design-refresh.pricing-page .pricing-intro h1 { font-size: clamp(2.8rem, 5vw, 4.5rem); text-transform: none; }
body.design-refresh.pricing-page .page-title-row { align-items: flex-start; gap: 32px; }
body.design-refresh.pricing-page .page-title-row > p { max-width: 460px; }
body.design-refresh.pricing-page .pricing-card,
body.design-refresh.pricing-page .pricing-card:is(:hover, :focus-within),
body.design-refresh.pricing-page .pricing-card.recommended {
  background: #fffefa; border: 1px solid #b6b6ae; border-radius: 8px; box-shadow: none; transform: none; padding: 28px;
}
body.design-refresh.pricing-page .pricing-card :is(h2,h3) { font-size: 2rem; text-transform: none; }
body.design-refresh.pricing-page .pricing-card li::before { content: '•'; }
body.design-refresh.pricing-page :is(.btn, .billing-toggle, .table-scroll, .text-cta) { box-shadow: none; }
body.design-refresh.pricing-page .billing-toggle button.chosen { background: #111; color: #fff; }
body.design-refresh.pricing-page .plan-comparison :is(thead th, td:nth-child(3)) { background: #f4f3ef; }
body.design-refresh.pricing-page .comparison-section .table-scroll { border: 1px solid #b6b6ae; border-radius: 8px; }
body.design-refresh.pricing-page .section-kicker { letter-spacing: .025em; }
body.design-refresh.pricing-page .faqs details[open] { background: #f4f3ef; }

/* Clear policy reading layouts, shared navigation and footer. */
.policy-page .policy-hero { padding-block: 60px 32px; border-bottom: 1px solid #b6b6ae; }
.policy-page .policy-hero h1 { font-size: clamp(2.6rem, 5.5vw, 5rem); margin: 22px 0; }
.policy-page .policy-hero > p { max-width: 780px; }
.policy-page .policy-status { font-size: .875rem; padding: 12px 16px; background: #eeece4; border: 1px solid #b6b6ae; border-radius: 8px; margin-top: 24px; }
.policy-page .policy-layout { display: grid; grid-template-columns: 240px minmax(0, 840px); gap: clamp(32px, 6vw, 96px); padding-top: 40px; align-items: start; }
.policy-page .policy-toc { position: sticky; top: 32px; display: flex; flex-direction: column; gap: 12px; }
.policy-page .policy-toc a { font-size: 1rem; line-height: 1.5; text-decoration: underline; text-underline-offset: 4px; }
.policy-page .policy-copy section { padding-bottom: 32px; margin-bottom: 30px; border-bottom: 1px solid #d0cec6; scroll-margin-top: 28px; }
.policy-page .policy-copy h2 { font-size: 1.75rem; margin-bottom: 18px; line-height: 1.2; }
.policy-page .policy-copy p { margin-bottom: 16px; }
.policy-page .policy-copy a { text-decoration: underline; text-underline-offset: 4px; }
.policy-page .policy-copy li { margin-bottom: 10px; font-size: 1.125rem; line-height: 1.6; }
.policy-page .policy-copy ul { padding-left: 22px; }
@media (max-width: 1000px) { .design-refresh .site-header nav > .nav-demo { margin-left: 0; } }
@media (max-width: 800px) {
  .policy-page .policy-layout { grid-template-columns: minmax(0,1fr); }
  .policy-page .policy-toc { position: static; padding-bottom: 28px; border-bottom: 1px solid #b6b6ae; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
.design-refresh .portal-account-context { align-items: center; border: 1px solid #171717; background: #e6f590; color: #000; padding: 16px 20px; }
.design-refresh .portal-account-context > span { font-size: 1rem; }
.design-refresh .portal-account-context > a { color: #fff; min-height: 44px; padding: 10px 18px; }
.design-refresh .portal-account-context > a:hover { color: #000; }
.design-refresh .plan-dialog { width: min(560px, calc(100% - 32px)); padding: 28px; }
.design-refresh .plan-dialog h2 { font-size: 2rem; line-height: 1.1; margin: 24px 0 20px; }
.design-refresh .plan-dialog p { font-size: 1.125rem; line-height: 1.65; }
.design-refresh .plan-dialog .dialog-actions { margin-top: 28px; }
.design-refresh .save-asset { background: #fffefa; border: 1px solid #171717; }
@media (max-width: 600px) {
  .design-refresh .portal-account-context { display: flex; align-items: flex-start; }
  .design-refresh .portal-account-context > a { margin: 0; }
  .design-refresh .plan-dialog .dialog-actions { flex-direction: column; align-items: stretch; }
}

/* Compact header actions, ordered demo / returning users / get started. */
.design-refresh .site-header .header-actions { display:flex; align-items:center; gap:8px; margin-left:16px; }
.design-refresh .site-header .header-actions .btn { margin:0; white-space:nowrap; padding:12px 17px; gap:10px; }
.design-refresh .site-header .header-actions .nav-login,
.design-refresh .marketing-story .paragraph-actions .btn.line { background:transparent; border-color:#171717; }
.design-refresh .site-header .header-actions .nav-login:hover,
.design-refresh .marketing-story .paragraph-actions .btn.line:hover { background:var(--lilac); }

/* White cards with a colorful patterned upper panel, inspired by the supplied tiers. */
body.design-refresh .pricing-card,
body.design-refresh.pricing-page .pricing-card,
body.design-refresh.pricing-page .pricing-card.recommended,
body.design-refresh .home-features .value-grid article {
  --card-accent:#a8cdff; --pattern-ink:#568fe8;
  background:#fff; color:#000; border:1px solid #c5c7ca; border-radius:26px;
  padding:10px 24px 28px; box-shadow:0 6px 18px #17171708; transform:none;
  overflow:hidden; transition:border-color .2s,box-shadow .2s,transform .2s;
}
body.design-refresh .pricing-card:nth-child(2),
body.design-refresh .home-features .value-grid article:nth-child(3n+2) { --card-accent:#b9b0ff; --pattern-ink:#806bee; }
body.design-refresh .pricing-card:nth-child(3),
body.design-refresh .home-features .value-grid article:nth-child(3n) { --card-accent:#d9ee97; --pattern-ink:#99bd48; }
body.design-refresh .home-features .value-grid article:nth-child(4) { --card-accent:#ffd1a3; --pattern-ink:#ec9245; }
body.design-refresh .home-features .value-grid article:nth-child(5) { --card-accent:#f7bfe8; --pattern-ink:#d480bf; }
body.design-refresh .pricing-card:is(:hover,:focus-within),
body.design-refresh.pricing-page .pricing-card:is(:hover,:focus-within),
body.design-refresh .home-features .value-grid article:is(:hover,:focus-within) {
  background:#fff; border-color:var(--pattern-ink); transform:translateY(-4px); box-shadow:0 12px 24px #17171715;
}
.design-refresh .plan-card-top,
.design-refresh .home-features .feature-card-top {
  position:relative; isolation:isolate; background:var(--card-accent); margin:0 -14px 26px;
  padding:22px 18px; min-height:158px; border-radius:18px; overflow:hidden;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; gap:26px;
}
.design-refresh .plan-card-top::before,
.design-refresh .home-features .feature-card-top::before {
  content:''; position:absolute; z-index:-1; inset:0; opacity:.24;
  background:repeating-linear-gradient(115deg,transparent 0 35px,var(--pattern-ink) 36px 70px,transparent 71px 100px);
  mask-image:linear-gradient(to left,#000,transparent);
}
.design-refresh .pattern-studio::before,
.design-refresh .home-features article:nth-child(3n+2) .feature-card-top::before {
  background:repeating-radial-gradient(circle at 90% 15%,transparent 0 21px,var(--pattern-ink) 22px 42px,transparent 43px 62px);
}
.design-refresh .pattern-agency::before,
.design-refresh .home-features article:nth-child(3n) .feature-card-top::before {
  background:conic-gradient(from 90deg at 50% 50%,var(--pattern-ink) 25%,transparent 0 50%,var(--pattern-ink) 0 75%,transparent 0) 100% 0 / 100px 100px;
}
.design-refresh .plan-caption,.design-refresh .feature-number { font-size:.875rem; letter-spacing:.06em; color:#000; }
body.design-refresh .pricing-card .plan-card-top :is(h2,h3) { font-size:2rem; line-height:1.1; margin:0; text-transform:none; }
.design-refresh .home-features .feature-specimen { position:absolute; bottom:14px; right:22px; font-size:3.6rem; line-height:1; color:#000; transform:none; }
.design-refresh .home-features .feature-number { background:#ffffff75; border-radius:100px; padding:7px 10px; }
.design-refresh .pricing-card > p { min-height:3.3em; }
.design-refresh .pricing-card .plan-price { border-top:1px solid #e5e5e5; padding-top:22px; margin-top:20px; }
.design-refresh .pricing-card ul { flex:1; }

/* A continuous fan of brand cards. Equal-width groups preserve the loop seam. */
.design-refresh .brand-viewport { padding-block:48px 58px; }
.design-refresh .brand-group { gap:0; padding-right:0; }
.design-refresh .brand-slide { --overlap:44px; position:relative; margin-right:calc(-1 * var(--overlap)); width:clamp(280px,26vw,370px); border-radius:15px; padding:8px; box-shadow:-8px 8px 22px #17171720; transform:rotate(-6deg); overflow:hidden; }
.design-refresh .brand-slide:nth-child(3n+2) { transform:translateY(-12px) rotate(5deg); }
.design-refresh .brand-slide:nth-child(3n) { transform:translateY(8px) rotate(-3deg); }
.design-refresh .brand-slide img { aspect-ratio:1; }
.design-refresh .brand-slide figcaption { padding:18px 44px 18px 12px; }
.design-refresh .brand-slide figcaption > span { font-size:1.2rem; }
.design-refresh .brand-slide figcaption > small { font-size:.875rem; }
body.design-refresh .brand-slide:hover { z-index:3; transform:translateY(-14px) rotate(0); }
.design-refresh .brand-track { isolation:isolate; }

/* Returning-user page: a bright editorial mosaic beside a calm, focused form. */
.login-main { max-width:1440px; margin:50px auto 90px; padding:0 32px; }
.login-shell { display:grid; grid-template-columns:1.08fr 1fr; padding:16px; border:1px solid #d5d5d5; border-radius:32px; background:#fff; box-shadow:0 18px 50px #00000008; }
.login-art { min-width:0; background:#e2ee96; border-radius:22px; padding:30px; overflow:hidden; }
.login-chip { display:inline-block; padding:8px 12px; border:1px solid #171717; border-radius:100px; font-size:.875rem; }
.login-art h2 { font-size:clamp(2.8rem,4.6vw,5rem); line-height:1.02; letter-spacing:-.045em; margin:24px 0 30px; }
.login-mosaic { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.login-mosaic img { width:100%; height:100%; object-fit:cover; min-height:0; border-radius:16px; }
.login-image-one { grid-row:span 2; aspect-ratio:3/4; }
.login-message { background:#fff8aa; min-height:132px; padding:20px; border-radius:16px; }
.login-message span { font-size:.875rem; }
.login-message p { font-size:clamp(1.2rem,2vw,1.75rem); line-height:1.15; margin-top:22px; }
.login-message.lilac { background:#b7a9f3; }
.login-image-two { grid-column:span 2; max-height:170px; aspect-ratio:3/1; }
.login-art-foot { display:block; font-size:1rem; margin-top:22px; }
.login-content { align-self:center; padding:40px clamp(24px,4vw,70px); min-width:0; }
.login-logo { display:block; margin-bottom:52px; }
.login-logo img { width:220px; height:auto; }
.login-content h1 { font-size:clamp(2.6rem,4vw,4.1rem); line-height:1.05; letter-spacing:-.04em; margin:15px 0 18px; }
.login-intro { font-size:1.125rem; margin-bottom:30px; }
.login-preview-note { font-size:.875rem; line-height:1.6; border-left:3px solid #b7a9f3; padding:4px 0 4px 15px; margin-bottom:30px; }
.returning-workspace { display:flex; gap:12px; align-items:center; padding:18px 0; border-block:1px solid #d7d7d7; margin-bottom:26px; }
.returning-avatar { width:45px; height:45px; background:#b7a9f3; border-radius:12px; display:grid; place-items:center; flex-shrink:0; }
.returning-workspace strong,.returning-workspace div>span { display:block; overflow-wrap:anywhere; }
.returning-workspace div { min-width:0; }
.returning-workspace strong { font-size:1.125rem; }
.returning-workspace div>span { font-size:1rem; margin-top:3px; }
.login-local { margin-left:auto; flex-shrink:0; font-size:.875rem; }
.login-submit { width:100%; margin-top:12px; min-height:52px; }
#login-empty p { font-size:1.125rem; line-height:1.6; margin-bottom:18px; }
.login-help { display:block; text-align:center; font-size:.875rem; margin:22px 0; text-decoration:underline; text-underline-offset:4px; }
.login-separator { display:flex; align-items:center; gap:12px; font-size:.75rem; letter-spacing:.035em; margin:28px 0 8px; }
.login-separator::before,.login-separator::after { content:''; height:1px; background:#ddd; flex:1; }
.login-fineprint { text-align:center; font-size:.875rem; margin-top:20px; }
.design-refresh .workspace-icon { font-size:1.1rem; letter-spacing:-.04em; }
.design-refresh .hero-wordmark img { height:auto; }
@media(max-width:1100px) {
  .design-refresh .site-header { gap:18px; }
  .design-refresh .site-header nav { gap:18px; }
  .design-refresh .site-header .header-actions { margin-left:0; gap:6px; }
  .design-refresh .site-header .header-actions .btn { padding:12px; font-size:.875rem; }
  .login-content { padding:32px 24px; }
  .login-art { padding:24px; }
}
@media(max-width:800px) {
  .login-shell { grid-template-columns:1fr; }
  .login-content { grid-row:1; padding:32px 22px; }
  .login-art { margin-top:12px; }
  .login-art h2 { font-size:3.2rem; }
  .login-logo { margin-bottom:32px; }
  .login-mosaic { grid-template-columns:1fr 1fr; }
  .login-image-one { max-height:310px; }
  .design-refresh .site-header .header-actions { flex-wrap:wrap; justify-content:flex-start; width:100%; }
  .design-refresh .brand-slide { width:290px; --overlap:34px; }
}
@media(max-width:480px) {
  .login-main { padding:0 14px; margin-top:24px; }
  .login-shell { padding:8px; border-radius:24px; }
  .login-content { padding:28px 16px; }
  .login-art { padding:18px; }
  .login-message { padding:15px; }
  .login-local { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  body.design-refresh .pricing-card:is(:hover,:focus-within),body.design-refresh.pricing-page .pricing-card:is(:hover,:focus-within),body.design-refresh .home-features .value-grid article:is(:hover,:focus-within),body.design-refresh .brand-slide:hover { transform:none; transition:none; }
  .design-refresh .brand-slide { --overlap:0px; margin-right:16px; transform:none!important; }
}

/* Shared neutral hover surface matches an expanded pricing FAQ. */
body.design-refresh { --faq-open-surface: #f4f3ef; }
body.design-refresh.pricing-page .faqs details[open] { background:var(--faq-open-surface); }
body.design-refresh .brand-slide { background:#fff; box-shadow:none; }
body.design-refresh .brand-slide:is(:hover,:focus-within) { background:var(--faq-open-surface); box-shadow:none; }
body.design-refresh .pricing-card,
body.design-refresh.pricing-page .pricing-card,
body.design-refresh.pricing-page .pricing-card.recommended { background:#fff; }
body.design-refresh .pricing-card:is(:hover,:focus-within),
body.design-refresh.pricing-page .pricing-card:is(:hover,:focus-within) { background:var(--faq-open-surface); }
.design-refresh .brand-footer .footer-top nav a,
.design-refresh .brand-footer .footer-reach > a { font-size:.875rem; }
.design-refresh .billing-toggle button[data-billing="annual"] span { border-radius:100px; }

/* Standalone login with one uninterrupted Certivo Africa image. */
.login-page .login-main { width:100%; min-height:100svh; display:flex; align-items:center; margin:0 auto; padding:32px; }
.login-page .login-shell { width:100%; }
.login-page .login-certivo { position:relative; padding:0; background:#073675; min-height:560px; }
.login-page .login-certivo > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.login-page .login-logo { font-size:1.75rem; font-weight:600; letter-spacing:-.055em; line-height:1.2; }
@media(max-width:800px) {
  .login-page .login-main { padding:20px; }
  .login-page .login-certivo { min-height:0; aspect-ratio:5/4; }
}
@media(max-width:480px) { .login-page .login-main { padding:12px; } }

.currency-picker{margin:16px 0 28px}.currency-picker .billing-toggle{display:inline-flex;gap:6px}.currency-picker button{border-radius:100px!important}.currency-note{max-width:750px;margin:12px auto;font-size:16px;line-height:1.5;color:#111}.signup-page .currency-note{margin-left:0}.subscription-box{border:1px solid #222;border-radius:24px;padding:24px;margin:20px 0;background:#fff}.subscription-box label{display:block;margin:12px 0}.subscription-box select{width:100%;padding:12px;border:1px solid #333;border-radius:12px;background:#fff;color:#111;font:inherit}.subscription-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.subscription-status{font-size:18px;line-height:1.5}.subscription-box button:disabled{opacity:.55;cursor:not-allowed}.billing-consent{display:flex!important;gap:10px;align-items:flex-start}.billing-consent input{margin-top:5px;flex:0 0 auto}.checkout-total{font-size:32px;font-weight:600}

/* Demo enquiries are a quiet text action alongside account buttons. */
.design-refresh .site-header .header-actions .nav-demo-request{display:inline-block;padding:10px 8px;margin:0;background:transparent;border:0;box-shadow:none;color:inherit;font-size:14px;font-weight:400;line-height:1.4;white-space:nowrap;text-decoration:none}
.design-refresh .site-header .header-actions .nav-demo-request:hover{text-decoration:underline;text-underline-offset:4px;background:transparent}
.design-refresh .site-header .header-actions .nav-demo-request:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:4px}

/* A quiet, two-row company strip directly beneath the demo call to action. */
.trusted-companies{width:100%;max-width:1180px;margin:46px auto 8px;padding:18px 24px 30px;text-align:center}
body.design-refresh .trusted-companies h2{font-size:14px!important;line-height:1.5;letter-spacing:0;margin:0 0 30px;color:#686963;font-weight:600!important}
.trusted-logo-grid{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;column-gap:40px;row-gap:30px}
.trusted-logo-grid img{flex:0 0 calc((100% - 200px)/6);width:calc((100% - 200px)/6);height:56px;min-width:0;object-fit:contain}
@media(max-width:900px){.trusted-logo-grid{gap:28px}.trusted-logo-grid img{flex-basis:calc((100% - 56px)/3);width:calc((100% - 56px)/3);height:50px}}
@media(max-width:500px){.trusted-companies{padding:10px 12px 24px;margin-top:34px}.trusted-logo-grid{gap:24px 28px}.trusted-logo-grid img{flex-basis:calc((100% - 28px)/2);width:calc((100% - 28px)/2);height:44px}body.design-refresh .trusted-companies h2{font-size:13px!important;margin-bottom:24px}}

/* Slightly quieter client marks, preserving the centered layout. */
.trusted-logo-grid img{padding:7px 10px;box-sizing:border-box}
/* Full-bleed header paint at every viewport size, without moving its contents.
   Clip only the decorative layer so menus can still open outside the header.
   A shadow extends the paint without adding horizontal scrollable width. */
body.design-refresh :is(.site-header,.account-header){isolation:isolate}
body.design-refresh :is(.site-header,.account-header)::before{
  content:"";
  position:absolute;
  inset:0;
  background:inherit;
  box-shadow:0 0 0 100vmax #faf9f5;
  clip-path:inset(0 -100vmax);
  z-index:-1;
  pointer-events:none;
}
body.design-refresh.account-page .account-header::before{
  box-shadow:0 0 0 100vmax var(--dashboard-canvas,#faf9f5);
}

/* Transparent hamburger interaction states; retain a keyboard focus outline. */
body.design-refresh .mobile-nav-toggle,body.design-refresh .mobile-nav-toggle:is(:hover,:active,:focus,[aria-expanded=true]){background:transparent!important;box-shadow:none!important;color:inherit!important;-webkit-tap-highlight-color:transparent}
.trusted-logo-viewport{overflow:hidden;width:100%;padding:8px 0}.trusted-logo-track{display:flex;width:max-content;animation:trusted-logo-loop 32s linear infinite}.trusted-logo-track .trusted-logo-grid{display:flex;flex-wrap:nowrap;align-items:center;gap:48px;padding-right:48px;flex:0 0 auto}.trusted-logo-track .trusted-logo-grid img{flex:none;width:auto;height:30px;max-width:none;object-fit:contain;padding:0;filter:brightness(0);display:block}@keyframes trusted-logo-loop{from{transform:translateX(0)}to{transform:translateX(-50%)}}@media(max-width:600px){.trusted-logo-track .trusted-logo-grid{gap:32px;padding-right:32px}.trusted-logo-track .trusted-logo-grid img{height:24px}}@media(prefers-reduced-motion:reduce){.trusted-logo-track{animation:none}.trusted-logo-viewport{overflow-x:auto}.trusted-logo-grid[aria-hidden=true]{display:none}}

/* Soften the entry and exit of the continuously moving client logos. */
.trusted-logo-viewport{-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}

/* Dialogs use a clean black outline, without offset or drop shadows. */
html body.design-refresh dialog,html body.design-refresh dialog:is(:hover,:focus-within){border:1px solid #111;box-shadow:none!important;filter:none}

/* The expanded mobile dropdown has no hard or soft shadow. */
html body.design-refresh .site-header #site-nav{box-shadow:none!important}
