/* Studio page only. The shared header, templates and interaction scripts stay intact. */
body.jvds-about-framed {
  --about-paper: #f3f1eb;
  --about-line: #d9d7cf;
  --about-ink: #282821;
  --about-muted: #6e6e65;
  background: var(--about-paper);
  color: var(--about-ink);
}
.jvds-about-framed .main,
.jvds-about-framed .row-about01,
.jvds-about-framed .row-about-faq,
.jvds-about-framed .about-partners { background: var(--about-paper); }
body.jvds-about-framed .header,
body.jvds-about-framed .header.fixed,
body.jvds-about-framed .header.hd-bg,
body.jvds-about-framed .header > .wp3 { background-color: var(--about-paper); }
.jvds-about-framed .service-cta.site-cta {
  background-image: linear-gradient(180deg, var(--about-paper) 0%, #f6ffdc 34%, #e4f794 66%, #e0f94c 100%);
}
.jvds-about-framed .row-about01 { padding-top: 72px; padding-bottom: 0; }
/* Keep services and statistics on the same content edges as the intro/homepage. */
.jvds-about-framed .row-about01 > .wp2.wp3,
.jvds-about-framed .row-about03.wp3 {
  width: 100%; max-width: 1920px; margin-left: auto; margin-right: auto;
  padding-left: 60px; padding-right: 60px;
}
@media (max-width: 1280px) {
  .jvds-about-framed .row-about01 > .wp2.wp3,
  .jvds-about-framed .row-about03.wp3 {
    max-width: none; padding-left: 32px; padding-right: 32px;
  }
}
@media (max-width: 800px) {
  .jvds-about-framed .row-about01 > .wp2.wp3,
  .jvds-about-framed .row-about03.wp3 { padding-left: 18px; padding-right: 18px; }
}
@media (max-width: 390px) {
  .jvds-about-framed .row-about01 > .wp2.wp3,
  .jvds-about-framed .row-about03.wp3 { padding-left: 16px; padding-right: 16px; }
}
.jvds-about-framed .m-about01 {
  /* Limit the title/intro row to the header rail; leave the photo on the wider content rail. */
  --about-header-inset: max(0px, calc((min(100vw, var(--jvds-content-max, 1920px)) - var(--jvds-page-header-max, 1600px)) / 2));
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: 48px 64px;
  margin-bottom: 100px;
}
.jvds-about-framed .m-about01 > .g-tit01 {
  min-width: 0; width: auto; margin: 0 0 0 var(--about-header-inset); text-align: left;
}
.jvds-about-framed .m-about01 .g-code-title { margin-left: 0; padding-left: 0; }
.jvds-about-framed .m-about01 .g-code-title :is(.g-code-cn, .g-code-en) { white-space: normal; }
.jvds-about-framed .m-about01 > .desc {
  min-width: 0; width: auto; max-width: none; margin: 0 var(--about-header-inset) 0 0; color: var(--about-muted);
  text-align: left; text-align-last: auto; font-size: 15px; line-height: 1.95;
}
.jvds-about-framed .m-about01 > .desc p { text-align: left; text-align-last: auto; }
.jvds-about-framed .m-about01 > .pic { grid-column: 1 / -1; min-width: 0; overflow: visible; }
.jvds-about-framed .m-about01 > .pic,
.jvds-about-framed .m-about01 > .pic > img { border-radius: 0; }
.jvds-about-framed .ul-listb1 {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0; margin: 0 0 56px; overflow: visible; border: 1px solid var(--about-line);
}
.jvds-about-framed .ul-listb1 > li { float: none; min-width: 0; width: auto; padding: 0; }
.jvds-about-framed .ul-listb1 .con {
  display: flex; flex-direction: column; min-height: 292px; height: 100%;
  box-sizing: border-box; margin: 0; padding: 30px;
  background: transparent; border-radius: 0; transition: background-color .25s;
}
.jvds-about-framed .ul-listb1 .con:is(:hover, :focus-visible) { background: #e0f94c; }
.jvds-about-framed .ul-listb1 .icon { flex: none; margin-bottom: 46px; }
.jvds-about-framed .ul-listb1 .icon img { width: 75%; height: auto; }
.jvds-about-framed .ul-listb1 .txt { min-width: 0; margin-top: auto; }
.jvds-about-framed .ul-listb1 .txt h3 { margin-bottom: 14px; color: var(--about-ink); font-size: 22px; }
.jvds-about-framed .ul-listb1 .desc { color: var(--about-muted); font-size: 14px; line-height: 1.8; }
.jvds-about-framed .ul-listb2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; margin: 0; overflow: visible; }
.jvds-about-framed .ul-listb2 > li { float: none; min-width: 0; width: auto; padding: 0; }
.jvds-about-framed .ul-listb2 .con { height: 100%; padding: 24px; box-sizing: border-box; border-radius: 0; overflow: visible; }
.jvds-about-framed .ul-listb2 .pic,
.jvds-about-framed .ul-listb2 .pic .img { border-radius: 0; }
.jvds-about-framed .ul-listb2 .txt .dib h3 { height: auto; white-space: normal; color: var(--about-ink); }
.jvds-about-framed .ul-listb2 .txt .dib .desc { color: var(--about-muted); }
.jvds-about-framed .m-about02 { margin-bottom: 80px; }
.jvds-about-framed .m-about02 > .g-tit01 { text-align: left; margin-bottom: 48px; }
.jvds-about-framed .row-about03 { margin-bottom: 72px; }
.jvds-about-framed .m-about03 { display: block; height: auto; padding: 0; line-height: normal; background: transparent; border-radius: 0; overflow: visible; }
.jvds-about-framed .ul-about03 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; margin: 0; gap: 0; align-items: stretch; }
/* Keep each desktop statistic 300px tall and center the number/label group. */
.jvds-about-framed .ul-about03 > li {
  display: flex; align-items: center; justify-content: center;
  box-sizing: border-box; width: auto; min-width: 0; height: 300px; padding: 42px 20px;
}
.jvds-about-framed .ul-about03 > li + li { border-left: 1px solid var(--about-line); }
.jvds-about-framed .ul-about03 .num { color: var(--about-ink); font-size: clamp(44px, 4vw, 68px); font-weight: 500; }
.jvds-about-framed .ul-about03 .stat-label { color: var(--about-muted); font-size: 14px; }
.jvds-about-framed .jvds-testimonial-hanger { --hanger-stage-background: var(--about-paper); }
.jvds-about-framed .jvds-testimonial-hanger__card { background: var(--about-paper); border-color: var(--about-line); border-radius: 0; }
.jvds-about-framed .jvds-testimonial-hanger__item.is-active .jvds-testimonial-hanger__card { background: #e0f94c; }
.jvds-about-framed .about-partners { padding-bottom: 80px; }
.jvds-about-framed .about-partners .home-partner-grid { gap: 0; border-top: 1px solid var(--about-line); border-left: 1px solid var(--about-line); }
.jvds-about-framed .about-partners .home-partner-logo {
  background: transparent; border-right: 1px solid var(--about-line); border-bottom: 1px solid var(--about-line); border-radius: 0;
}
.jvds-about-framed .about-partners .home-partner-logo:hover { background: #eae8df; }
.jvds-about-framed .row-about-faq { padding-top: 60px; padding-bottom: 80px; }
.jvds-about-framed .about-faq-item,
.jvds-about-framed .about-faq-surface,
.jvds-about-framed .about-faq-question { border-radius: 0; }
.jvds-about-framed .about-faq-item { box-sizing: border-box; border: 1px solid var(--about-line); }
.jvds-about-framed .about-faq-surface { background: var(--about-paper); }
.jvds-about-framed .about-faq-item.is-open .about-faq-surface { background: #e0f94c; }
.jvds-about-framed .m-about01 > .pic,
.jvds-about-framed .ul-listb1 > li,
.jvds-about-framed .ul-listb2 .con,
.jvds-about-framed .m-about03 { position: relative; border: 1px solid var(--about-line); }
.jvds-about-framed .ul-listb1 > li { border: 0; }
.jvds-about-framed .ul-listb1 > li + li { border-left: 1px solid var(--about-line); }
.jvds-about-framed .m-about01 > .pic::after,
.jvds-about-framed .ul-listb1 > li::after,
.jvds-about-framed .ul-listb2 .con::after,
.jvds-about-framed .m-about03::after,
.jvds-about-framed .about-faq-item::after {
  content: ""; position: absolute; z-index: 4; inset: -3.5px; pointer-events: none;
  background:
    linear-gradient(var(--about-ink),var(--about-ink)) left top / 6px 6px no-repeat,
    linear-gradient(var(--about-ink),var(--about-ink)) right top / 6px 6px no-repeat,
    linear-gradient(var(--about-ink),var(--about-ink)) left bottom / 6px 6px no-repeat,
    linear-gradient(var(--about-ink),var(--about-ink)) right bottom / 6px 6px no-repeat;
}
@media (max-width: 1200px) {
  .jvds-about-framed .ul-listb1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .jvds-about-framed .ul-listb1 > li:nth-child(odd) { border-left: 0; }
  .jvds-about-framed .ul-listb1 > li:nth-child(n+3) { border-top: 1px solid var(--about-line); }
  .jvds-about-framed .ul-listb1 .con { min-height: 250px; }
}
@media (max-width: 800px) {
  .jvds-about-framed .row-about01 { padding-top: 40px; }
  .jvds-about-framed .m-about01 { --about-header-inset: 0px; grid-template-columns: 1fr; gap: 28px; margin-bottom: 56px; }
  .jvds-about-framed .m-about01 > .pic { height: 240px; min-height: 0; }
  .jvds-about-framed .m-about01 > .pic > img { width: 100%; min-height: 0; height: 100%; object-fit: cover; }
  .jvds-about-framed .ul-listb1 { grid-template-columns: 1fr; margin-bottom: 36px; }
  .jvds-about-framed .ul-listb1 > li + li { border-left: 0; border-top: 1px solid var(--about-line); }
  .jvds-about-framed .ul-listb1 .con { min-height: 224px; padding: 24px; }
  .jvds-about-framed .ul-listb1 .icon { margin-bottom: 28px; }
  .jvds-about-framed .ul-listb2 { grid-template-columns: 1fr; gap: 28px; }
  .jvds-about-framed .ul-listb2 .con { padding: 20px; }
  .jvds-about-framed .ul-listb2 .txt { padding-left: 0; padding-right: 0; }
  .jvds-about-framed .ul-about03 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .jvds-about-framed .ul-about03 > li { height: auto; padding: 30px 16px; }
  .jvds-about-framed .ul-about03 > li:nth-child(3) { border-left: 0; }
  .jvds-about-framed .ul-about03 > li:nth-child(n+3) { border-top: 1px solid var(--about-line); }
  .jvds-about-framed .m-about02,
  .jvds-about-framed .row-about03 { margin-bottom: 48px; }
  .jvds-about-framed .about-partners { padding-bottom: 40px; }
  .jvds-about-framed .row-about-faq { padding-top: 40px; padding-bottom: 48px; }
}

/* Page-local rectangular actions: black/white at rest, brand color on hover/focus. */
body.jvds-about-framed .service-hero-action {
  --framed-action-bg: #000;
  --framed-action-ink: #fff;
  box-sizing: border-box;
  border: 1px solid #000;
  border-radius: 0;
  background: var(--framed-action-bg);
  color: var(--framed-action-ink) !important;
  -webkit-text-fill-color: var(--framed-action-ink);
}
body.jvds-about-framed .jvds-growth-resource-actions .service-hero-action {
  border-color: #000;
  background: var(--framed-action-bg);
}
body.jvds-about-framed .service-hero-action:is(:hover, :focus-visible),
body.jvds-about-framed .jvds-growth-feature-card:is(:hover, :focus-visible) .jvds-growth-feature-action {
  --framed-action-bg: #e0f94c;
  --framed-action-ink: #000;
}
body.jvds-about-framed .service-hero-action .service-hero-action-arrow,
body.jvds-about-framed .service-hero-action .service-hero-action-text {
  height: 100%;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--framed-action-ink) !important;
  -webkit-text-fill-color: var(--framed-action-ink);
}
body.jvds-about-framed .jvds-growth-feature-card:is(:hover, :focus-visible) .jvds-growth-feature-action :is(.service-hero-action-arrow, .service-hero-action-text) {
  color: #000 !important;
  -webkit-text-fill-color: #000;
}
body.jvds-about-framed .service-hero-action:focus-visible { outline: 2px solid #000; outline-offset: 3px; }
body.jvds-about-framed .about-faq-action { border-radius: 0; }