/* Page-local preview skin. Shared components and production assets stay intact. */
body.jvds-growth-framed {
  --solution-paper: #f3f1eb;
  --solution-line: #d9d7cf;
  --solution-ink: #282821;
  --solution-muted: #6e6e65;
  --solution-node: 6px;
  background: var(--solution-paper);
  color: var(--solution-ink);
}

.jvds-growth-framed .header,
.jvds-growth-framed .header.hd-bg,
.jvds-growth-framed .header.fixed,
.jvds-growth-framed .header > .wp3 { background-color: var(--solution-paper); }

.jvds-growth-framed .service-cta.site-cta {
  background-image: linear-gradient(180deg, var(--solution-paper) 0%, #f6ffdc 34%, #e4f794 66%, #e0f94c 100%);
}

/* Scope, related work and cooperation sections use this page's paper color. */
body.jvds-growth-framed .jvds-growth {
  --growth-ink: var(--solution-ink);
  --growth-muted: var(--solution-muted);
  --growth-line: var(--solution-line);
  --growth-card-radius: 0px;
  background: var(--solution-paper);
  color: var(--solution-ink);
}

.jvds-growth-framed .jvds-growth-scope-rows,
.jvds-growth-framed .jvds-growth-links .jvds-growth-cooperation-grid { gap: 0; }

.jvds-growth-framed .jvds-growth-scope-rows .jvds-growth-row,
.jvds-growth-framed .jvds-growth-links .jvds-growth-cooperation-grid > a,
.jvds-growth-framed .jvds-growth-links .jvds-growth-feature-grid > a {
  position: relative;
  border: 1px solid var(--solution-line);
  border-radius: 0;
  background: var(--solution-paper);
  box-shadow: none;
}

.jvds-growth-framed .jvds-growth-scope-rows .jvds-growth-row + .jvds-growth-row { margin-top: -1px; }
.jvds-growth-framed .jvds-growth-links .jvds-growth-cooperation-grid > a { margin: 0 -1px -1px 0; }
.jvds-growth-framed .jvds-growth-links .jvds-growth-cooperation-grid > a.is-selected {
  background: var(--scope-accent);
  border-color: var(--solution-line);
  box-shadow: none;
}

.jvds-growth-framed .jvds-growth-feature-media,
.jvds-growth-framed .jvds-growth-image img { border-radius: 0; }

/* Frames on related cards surround the existing picture and its copy as one cell. */
.jvds-growth-framed .jvds-growth-related .news-related-grid { gap: 0; }
.jvds-growth-framed .jvds-growth-related .news-related-card {
  position: relative;
  min-width: 0;
  margin: 0 -1px -1px 0;
  padding: 24px;
  border: 1px solid var(--solution-line);
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.jvds-growth-framed .jvds-growth-related .news-related-card .pic { border-radius: 0; }

/* Corner markers never intercept card links, FAQ buttons or media gestures. */
.jvds-growth-framed .growth-frame-corners,
.jvds-growth-framed .jvds-growth-scope-rows .jvds-growth-row::after,
.jvds-growth-framed .jvds-growth-links .jvds-growth-cooperation-grid > a::after,
.jvds-growth-framed .jvds-growth-links .jvds-growth-feature-grid > a::after,
.jvds-growth-framed .jvds-growth-related .news-related-card::after,
.jvds-growth-framed .about-faq-item::after {
  content: "";
  display: block;
  position: absolute;
  z-index: 7;
  inset: -3.5px;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  border-radius: 0;
  pointer-events: none;
  background:
    linear-gradient(var(--solution-ink), var(--solution-ink)) left top / var(--solution-node) var(--solution-node) no-repeat,
    linear-gradient(var(--solution-ink), var(--solution-ink)) right top / var(--solution-node) var(--solution-node) no-repeat,
    linear-gradient(var(--solution-ink), var(--solution-ink)) left bottom / var(--solution-node) var(--solution-node) no-repeat,
    linear-gradient(var(--solution-ink), var(--solution-ink)) right bottom / var(--solution-node) var(--solution-node) no-repeat;
}

/* The existing FAQ reveal interaction keeps its flexible rows and open state. */
.jvds-growth-framed .about-faq-row { gap: 0; margin-bottom: 0; }
.jvds-growth-framed .about-faq-item {
  border: 1px solid var(--solution-line);
  border-radius: 0;
  margin: 0 -1px -1px 0;
  background: var(--solution-paper);
}
.jvds-growth-framed .about-faq-surface,
.jvds-growth-framed .about-faq-question { border-radius: 0; }
.jvds-growth-framed .about-faq-surface { background: var(--solution-paper); }
.jvds-growth-framed .about-faq-item.is-open .about-faq-surface { background: #e0f94c; }

@media (hover: hover) and (pointer: fine) {
  .jvds-growth-framed .about-faq-item:hover .about-faq-surface { background: #e0f94c; }
  .jvds-growth-framed .jvds-growth-scope-rows .jvds-growth-row:hover { background: #e0f94c; border-color: var(--solution-line); }
}

@media (max-width: 800px) {
  .jvds-growth-framed .jvds-growth-related .news-related-card { padding: 20px; }
  .jvds-growth-framed .jvds-growth-related .news-related-grid { grid-template-columns: minmax(0, 1fr); }
  .jvds-growth-framed .jvds-growth-links .jvds-growth-cooperation-grid { grid-template-columns: minmax(0, 1fr); }
  .jvds-growth-framed .jvds-growth-links .jvds-growth-cooperation-grid > a { grid-column: auto; }
  .jvds-growth-framed .about-faq-row { gap: 0; }
}

/* The heading keeps the original green title circle and bilingual hierarchy. */
.jvds-growth-framed #app,
.jvds-growth-framed main { background: var(--solution-paper); }
.jvds-growth-framed .jvds-growth-hero { padding-top: 72px; }
.jvds-growth-framed .jvds-growth-hero .g-code-title { color: var(--solution-ink); }
.jvds-growth-framed .jvds-growth-hero .jvds-news-tools { margin-top: 48px; }
.jvds-growth-framed .jvds-growth-hero .jvds-growth-category-intro { margin-top: 0; }

/* Frame the original interactive rocks without recoloring either image. */
.jvds-growth-framed .jvds-growth-hero > .jvds-growth-delivery-shell {
  position: relative;
  width: calc(100% - 120px);
  max-width: 1800px;
  margin: 64px auto 0;
  border: 1px solid var(--solution-line);
}
.jvds-growth-framed .jvds-growth-delivery-wrap { border-radius: 0; }
.jvds-growth-framed .jvds-growth-approaches { padding-top: 80px; }
.jvds-growth-framed .jvds-growth-links .jvds-growth-feature-grid > a { overflow: visible; }
.jvds-growth-framed .jvds-growth-links .jvds-growth-feature-grid > a:hover,
.jvds-growth-framed .jvds-growth-links .jvds-growth-feature-grid > a:focus-visible { border-color: var(--solution-line); }
.jvds-growth-framed .jvds-growth-scope-layout { min-width: 0; }
.jvds-growth-framed .jvds-growth-faq { overflow: visible; }

@media (max-width: 1200px) {
  .jvds-growth-framed .jvds-growth-hero > .jvds-growth-delivery-shell { width: calc(100% - 64px); }
}
@media (max-width: 800px) {
  .jvds-growth-framed .jvds-growth-hero { padding-top: 40px; }
  .jvds-growth-framed .jvds-growth-hero .jvds-news-tools { margin-top: 32px; }
  .jvds-growth-framed .jvds-growth-hero > .jvds-growth-delivery-shell { width: calc(100% - 40px); margin-top: 40px; }
  .jvds-growth-framed .jvds-growth-links .jvds-growth-feature-grid > a { padding: 24px; }
  .jvds-growth-framed .jvds-growth-approaches { padding-top: 52px; }
}

/* Page-local rectangular actions: black/white at rest, brand color on hover/focus. */
body.jvds-growth-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-growth-framed .jvds-growth-resource-actions .service-hero-action {
  border-color: #000;
  background: var(--framed-action-bg);
}
body.jvds-growth-framed .service-hero-action:is(:hover, :focus-visible),
body.jvds-growth-framed .jvds-growth-feature-card:is(:hover, :focus-visible) .jvds-growth-feature-action {
  --framed-action-bg: #e0f94c;
  --framed-action-ink: #000;
}
body.jvds-growth-framed .service-hero-action .service-hero-action-arrow,
body.jvds-growth-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-growth-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-growth-framed .service-hero-action:focus-visible { outline: 2px solid #000; outline-offset: 3px; }
body.jvds-growth-framed .about-faq-action { border-radius: 0; }
