html[data-sb-language] {
  --sb-phone-title: clamp(24px, 6.2vw, 30px);
  --sb-phone-section: 22px;
  --sb-phone-subheading: 16px;
  --sb-phone-body: 13px;
  --sb-phone-leading: 1.32;
  --sb-phone-title-gap: 7px;
  --sb-phone-radius: 8px;
  --sb-phone-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Microsoft YaHei", sans-serif;
}

html[data-sb-language] body #sanbo-header.sb-header[data-sb-chrome] :is(.sb-mobile-menu,.sb-mobile-menu-label,.sb-mobile-menu-close) {
  font-family: var(--sb-nav-font);
}

html[data-sb-language] body #sanbo-header.sb-header[data-sb-chrome] .sb-mobile-menu-bar p {
  display: flex;
  align-items: center;
  gap: 8px;
  font: 650 23px/1.12 var(--sb-nav-font);
}

.sb-mobile-menu-logo {
  display: block;
  width: 2.25em;
  height: auto;
  object-fit: contain;
  flex: none;
}

@media (prefers-reduced-motion: no-preference) {
  #sanbo-header .sb-mobile-menu[open] {
    animation: sb-phone-menu-drop .72s cubic-bezier(.22,.7,.28,1) both;
  }

  #sanbo-header .sb-mobile-menu[open]::backdrop {
    animation-duration: .55s;
  }
}

@keyframes sb-phone-menu-drop {
  from { opacity: 0; transform: translateY(-24px); }
  to { opacity: 1; transform: none; }
}

html[data-sb-language] body #sanbo-header.sb-header[data-sb-chrome] .sb-mobile-menu nav {
  width: 100%;
  margin-inline: 0;
  justify-content: stretch;
}

html[data-sb-language] body #sanbo-header.sb-header[data-sb-chrome] .sb-mobile-menu section {
  padding-block: 9px 6px;
}

html[data-sb-language] body #sanbo-header.sb-header[data-sb-chrome] .sb-mobile-menu h2 {
  margin: 0 0 7px;
  font: 700 10px/1.18 var(--sb-nav-font);
}

html[data-sb-language] body #sanbo-header.sb-header[data-sb-chrome] .sb-mobile-menu li a {
  min-height: 28px;
  padding-block: 1px;
  font: 500 16px/1.18 var(--sb-nav-font);
  overflow-wrap: anywhere;
}

html[data-sb-language] body #sanbo-header.sb-header[data-sb-chrome] .sb-mobile-menu .sb-mobile-menu-quote {
  min-height: 38px;
  padding: 6px 13px;
  border-radius: var(--sb-phone-radius);
  font: 650 14px/1.2 var(--sb-nav-font);
}

html[data-sb-language] body :is(#sanbo-site[data-page]:not([data-page="products"],[data-page="product"]),.sb-about-hero) h1:where(:not(.hero h1,.sb-mobile-hero h1)) {
  font-size: var(--sb-phone-title) !important;
  line-height: 1.12 !important;
}

html[data-sb-language] body :is(#sanbo-site[data-page]:not([data-page="products"],[data-page="product"]),.ab) h2:where(
  :not(.hero h2,.ab-eyebrow,.sb-blog-card h2,.sb-blog-body h2,.guide-section h2,.guide-sidebar h2,.policy-body h2,.contact-form-heading h2,.contact-guide h2)
) {
  font-size: var(--sb-phone-section) !important;
  line-height: 1.15 !important;
}

html[data-sb-language] body :is(#sanbo-site[data-page]:not([data-page="products"],[data-page="product"]),.ab) :is(
  h3:where(:not(.sb-featured-label h3)),.sb-blog-card h2,.sb-blog-body h2,.guide-section h2,.guide-sidebar h2,.policy-body h2,
  .contact-form-heading h2,.contact-guide h2
) {
  font-size: var(--sb-phone-subheading) !important;
  line-height: 1.2 !important;
}

html[data-sb-language] body :is(#sanbo-site[data-page]:not([data-page="products"],[data-page="product"]),.ab,.sb-about-hero) :is(
  .tm-kicker,.quality-kicker,.sx-kicker,.tp-kicker,.section-label,.ab-eyebrow,.sb-blog-kicker,.sb-featured > header > p:first-child
):has(+ :is(h1,h2,h3)) {
  margin-block: 0 3px !important;
  font-size: 11px !important;
  line-height: 1.18 !important;
}

html[data-sb-language] body :is(#sanbo-site[data-page]:not([data-page="products"],[data-page="product"]),.ab,.sb-about-hero) :is(
  h1,h2,h3
):where(:not(.hero *,.sb-mobile-hero *,.ab-eyebrow)):has(+ p:not(.ab-eyebrow,.tp-kicker)) {
  margin-block-end: var(--sb-phone-title-gap) !important;
  overflow-wrap: anywhere;
}

html[data-sb-language] body :is(#sanbo-site[data-page]:not([data-page="products"],[data-page="product"]),.ab,.sb-about-hero) p:where(
  :not(.hero *,.sb-mobile-hero *,.tm-kicker,.tm-mono,.quality-kicker,.sx-kicker,.tp-kicker,.section-label,
    .ab-eyebrow,.ab-note,.ab-statement,.sb-blog-kicker,.sb-blog-body p,.guide-content p,.policy-body p)
) {
  font-size: var(--sb-phone-body) !important;
  line-height: var(--sb-phone-leading) !important;
}

html[data-sb-language] body #sanbo-site[data-page]:not([data-page="products"],[data-page="product"]) :is(.sb-blog-body,.guide-content,.policy-body) p {
  font-size: 14px !important;
  line-height: 1.38 !important;
}

html[data-sb-language] body :is(#sanbo-site[data-page]:not([data-page="products"],[data-page="product"]),.ab,.sb-about-hero) :is(
  h1,h2,h3
):where(:not(.hero *,.sb-mobile-hero *,.ab-eyebrow)) + p {
  margin-block-start: 0 !important;
}

html[data-sb-language] body #sanbo-site[data-page]:not([data-page="products"],[data-page="product"]) :is(
  .sb-mobile-hero-copy > a,.sb-mobile-featured-toggle,.solid-button,.tm-button,.quality-button,.catalog-purchase,.catalog-button,
  .detail-button,.sx-button,.sx-batch-submit,.tp-button,.circle-cta
),
html[data-sb-language] body .ab :is(.ab-card-copy > a,.ab-contact article > a,.ab-pause,.ab-controls button) {
  border-radius: var(--sb-phone-radius) !important;
}

html[data-sb-language] body .ab :is(.ab-card-copy > a,.ab-contact article > a) {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 5px 10px;
  border: 1px solid #737d80;
  font-size: 12px;
  line-height: 1.2;
  text-decoration: none;
}

html[data-sb-language] body :is(#sanbo-site[data-page]:not([data-page="products"],[data-page="product"]),.ab,.sb-about-hero) :is(
  h1,h2,h3,h4,p,dt,dd,summary,label,.tm-mono,.tp-kicker,.ab-pause,.ab-card-copy > a,.ab-contact article > a
) {
  font-family: var(--sb-phone-font) !important;
}

html[data-sb-language] body .ab h2.ab-eyebrow {
  font-size: 11px;
  line-height: 1.18;
}

html[data-sb-language] body .ab .ab-statement {
  margin-block-start: 5px;
  font-size: var(--sb-phone-subheading);
  line-height: var(--sb-phone-leading);
}

html[data-sb-language] body #sanbo-site[data-page="project"] main .closing .circle-cta {
  width: fit-content;
  height: auto;
  min-height: 34px;
  padding: 5px 11px;
  aspect-ratio: auto;
}

html[data-sb-language] body #sanbo-site[data-page="projects"] .project-card-body .project-spec > div {
  padding-block: 5px;
}

html[data-sb-language] body #sanbo-site[data-page="projects"] .project-card-body .project-spec :is(dt,dd) {
  font-size: var(--sb-phone-body);
  line-height: var(--sb-phone-leading);
}

html[data-sb-language] body #sanbo-site[data-page="projects"] .project-card-body .project-spec dd {
  margin: 2px 0 0;
}

html[data-sb-language] body #sanbo-site[data-page] .quality-shell .quality-faq {
  padding-block: 4px;
}

html[data-sb-language] body #sanbo-site[data-page] .quality-shell .quality-faq details {
  padding-block: 0;
}

html[data-sb-language] body #sanbo-site[data-page] .quality-shell .quality-faq summary {
  min-height: 40px;
  padding-block: 5px;
}

html[data-sb-language] body #sanbo-site[data-page] .quality-shell .quality-faq p {
  margin-block: 0;
  padding: 0 18px 8px 0;
}

html[data-sb-language] body .ab .ab-card-copy {
  text-align: center;
}

html[data-sb-language] body .ab .ab-controls {
  top: calc(var(--ab-photo-height) / 2);
  inset-inline: 4px;
}

html[data-sb-language] body .ab .ab-controls button {
  position: relative;
  border: 0;
  background: none;
  isolation: isolate;
}

html[data-sb-language] body .ab .ab-controls button::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 6px;
  border: 1px solid #b0bac57a;
  border-radius: 7px;
  background: #141a20c9;
}

html[data-sb-language] body .ab .ab-controls button svg {
  width: 15px;
  height: 15px;
}

html[data-sb-language] body .ab .ab-contact-grid {
  gap: 8px;
}

html[data-sb-language] body .ab .ab-contact article {
  padding: 13px 14px;
  border: 1px solid #343c42;
  border-radius: 14px;
}

html[data-sb-language] body .ab .ab-contact article h3:has(+ p) {
  margin: 0 4px 5px !important;
}

html[data-sb-language] body .ab .ab-contact article > a {
  margin-top: 8px;
}

html[data-sb-language] body #sanbo-site[data-page]:not([data-page="product"],[data-page="products"]) :is(#corp-inquiry,#sx-batch-form) :is(input,textarea)::placeholder {
  opacity: 0;
}

html[data-sb-language] body #sanbo-site[data-page="contact"] #corp-inquiry :is(.contact-form-heading > p,#inquiry-product-help) {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

html[data-sb-language] body:has(#sanbo-header) #sanbo-footer.sb-footer[data-sb-chrome] .sb-footer-brand {
  align-self: center;
  padding: 0;
}

html[data-sb-language] body:has(#sanbo-header) #sanbo-footer.sb-footer[data-sb-chrome] .sb-footer-brand h2 {
  margin: 0;
  font-family: var(--sb-phone-font);
}

#sanbo-footer[data-sb-chrome] .sb-footer-brand p {
  display: none;
}

/* Legacy interior styles paint the shared footer light, while its text stays light. */
html[data-sb-language] body:has(#sanbo-site.corp-site.inner-site) #sanbo-footer.sb-footer[data-sb-chrome] {
  background: #272b2f;
  color: #d2d8dd;
  --sb-line: #ffffff25;
}

html[data-sb-language] body:has(#sanbo-site.corp-site.inner-site) #sanbo-footer.sb-footer[data-sb-chrome] .sb-logo-light {
  display: none;
}

html[data-sb-language] body:has(#sanbo-site.corp-site.inner-site) #sanbo-footer.sb-footer[data-sb-chrome] .sb-logo-dark {
  display: block;
}

html[data-sb-language] body:has(#sanbo-site.corp-site.inner-site) #sanbo-footer.sb-footer[data-sb-chrome] a:focus-visible {
  outline-color: #b6d4e4;
}

html[data-sb-language] body:has(#sanbo-site[data-page="certifications"]) #sanbo-footer .sb-enter,
html[data-sb-language] body #sanbo-site[data-page="certifications"] .sb-enter {
  opacity: 1 !important;
  translate: none !important;
  transition: none !important;
}

html[data-sb-language]:has(#sanbo-site[data-page="certifications"]) {
  scroll-behavior: auto;
}

html[data-sb-language] body #sanbo-site.corp-site.inner-site.tp-site.tc-site[data-page="certifications"] {
  color: #23282c;
  background: #f3f3f5;
  font-family: var(--sb-phone-font);

  & main {
    padding: calc(var(--sb-language-header, 49px) + 16px) 14px 20px;
  }

  & :is(.tp-hero,.tc-download,.tp-heading,.tc-doc-grid,.tc-faq,.tc-newsletter) {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }

  & :is(.tp-grid,.tc-paper) {
    display: none;
  }

  & :is(.tp-in,.tc-reveal) {
    opacity: 1;
    transform: none;
    transition: none;
  }

  & .tp-hero {
    display: block;
    height: auto;
    min-height: 0;
    margin: 0 0 12px;
    padding: 0;
    background: none;
    text-align: start;
  }

  & .tp-hero-copy {
    position: static;
    width: auto;
    padding: 0;
    transform: none;
    text-align: inherit;
  }

  & .tp-hero h1 {
    margin: 0 0 7px;
    color: inherit;
    font-weight: 650;
    text-wrap: balance;
  }

  & .tp-hero .tp-lead {
    margin: 0;
  }

  & :is(.tc-download,.tc-doc-grid article,.tc-faq > div:last-child,.tc-newsletter) {
    border: 0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 3px 10px #171c2510;
  }

  & :is(.tc-download,.tc-newsletter) {
    display: block;
    min-height: 0;
    margin-block: 0;
    padding: 13px;
    color: inherit;
    clip-path: none;
  }

  & :is(.tp-hero .tp-lead,.tc-download p,.tc-doc-grid p,.tc-faq p,.tc-newsletter p) {
    color: #4d5c67;
  }

  & :is(.tc-download h3,.tc-faq h2,.tc-newsletter h2) {
    margin: 0 0 7px;
    color: inherit;
  }

  & :is(.tc-download p:not(.tp-kicker),.tc-newsletter p:not(.tp-kicker)) {
    margin: 0 0 9px;
  }

  & .tp-heading {
    margin-block: 17px 8px;
    padding: 0;
    text-align: start;
  }

  & .tp-heading h2 {
    max-width: none;
    margin: 0;
  }

  & .tc-doc-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    padding: 0;
  }

  & .tc-doc-grid article {
    min-width: 0;
    min-height: 0;
    padding: 11px;
  }

  & .tc-doc-grid article > span {
    margin-bottom: 5px;
    color: #536570;
    font: 650 11px/1.2 var(--sb-phone-font);
  }

  & .tc-doc-grid small {
    margin: auto 0 0;
    padding-block: 7px;
    color: #52616d;
    font-size: 11px;
  }

  & :is(.tp-button,.tc-doc-grid .tp-link) {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    max-width: 100%;
    margin: 0;
    padding: 4px 8px;
    border: 1px solid #39444c;
    border-radius: var(--sb-phone-radius);
    background: #343c43;
    color: #fff;
    font: 650 12px/1.2 var(--sb-phone-font);
    text-decoration: none;
    white-space: normal;
  }

  & .tc-doc-grid .tp-link {
    border-color: #c7cdd2;
    background: #f3f4f5;
    color: #28333b;
  }

  & .tc-faq {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 7px;
    margin-block: 17px;
    padding: 0;
  }

  & .tc-faq > div:last-child {
    padding: 0 11px;
  }

  & .tc-faq details:last-child {
    border-bottom: 0;
  }

  & .tc-faq summary {
    min-height: 40px;
    padding: 5px 0;
  }

  & .tc-faq details p {
    padding: 0 15px 8px 0;
  }
}