/* Vapovor theme — skruptcustomcontent components (moved from vapovor-components.css, 19/10/2026). */
body #main :is(.scc-illustrated-card) { border: 1px solid var(--vvp-ui-info-line); border-radius: var(--vvp-ui-info-radius); background: var(--vvp-ui-info-bg); }
body #main .scc-illustrated-grid { grid-auto-rows: 1fr; gap: 16px; }
body #main .scc-illustrated-card { aspect-ratio: auto; min-height: 160px; padding: 20px 16px; border: 1px solid var(--vvp-confort-line); border-radius: 12px; background: var(--vvp-confort-soft); }
body #main .scc-illustrated-heading { order: 2; padding: 16px 0 0; text-align: center; }
body #main .scc-illustrated-heading>strong { font-size: 15px; font-weight: 600; }
body #main .scc-illustrated-art { order: 1; display: grid; place-items: center; flex: 0 0 104px; margin: 0; overflow: visible; }
body #main .scc-illustrated-art>:is(svg,img) { grid-area: 1 / 1; position: static; width: 104px; height: 104px; max-width: 100%; object-fit: contain; overflow: visible; }
body #main .scc-illustrated-art>svg[hidden] { display: none; }
body #main .scc-illustrated-card--large { grid-column: span 2; grid-row: span 2; }
body #main .scc-illustrated-card--large .scc-illustrated-art { flex: 1 1 auto; min-height: 208px; }
body #main .scc-illustrated-card--large .scc-illustrated-art>:is(svg,img) { width: 208px; height: 208px; }
body #main .scc-illustrated-card--large .scc-illustrated-heading>strong { font-size: 18px; }
@media (max-width: 767.98px) {
  /* Phones: the large card stays full width but one row high, with a smaller icon. */
body #main .scc-illustrated-card--large { grid-row: span 1; }
body #main .scc-illustrated-card--large .scc-illustrated-art { min-height: 0; flex-basis: 96px; }
  body #main .scc-illustrated-card--large .scc-illustrated-art>:is(svg,img) { width: 96px; height: 96px; }
  body #main .scc-illustrated-card--large .scc-illustrated-heading>strong { font-size: 16px; }
  body #main .scc-illustrated-grid { gap: var(--vvp-ui-control-gap); }
  body #main .scc-illustrated-card { min-height: 132px; padding: 16px 12px; }
  body #main .scc-illustrated-art { flex-basis: 80px; }
  body #main .scc-illustrated-art>:is(svg,img) { width: 80px; height: 80px; }
}
body.page-category #wrapper #main > .scc-content { position: relative; isolation: isolate; margin-block: 0; padding: var(--vvp-band-padding,var(--vvp-ui-band-space) 0); border: 0; border-radius: 0; background: transparent; box-shadow: none; }
body.page-category #wrapper #main > .scc-content::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: var(--vvp-band-bg,var(--vvp-ui-band-gray)); box-shadow: 0 0 0 100vmax var(--vvp-band-bg,var(--vvp-ui-band-gray)); clip-path: inset(0 -100vmax); }
body.page-category #main > .scc-content > .scc-text:has(> h2:first-child) { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.8fr); gap: 20px clamp(32px,5vw,80px); align-items: start; }
body.page-category #main > .scc-content > .scc-text > * { grid-column: 2; min-width: 0; max-width: 72ch; margin: 0; }
body.page-category #main > .scc-content > .scc-text > h2:first-child { grid-column: 1; grid-row: 1 / span 2; max-width: 20ch; font-size: clamp(26px,2.1vw,32px); font-weight: 500; line-height: 1.25; letter-spacing: 0; text-transform: none; text-wrap: balance; color: var(--vvp-ds-action); }
body.page-category #main > .scc-content > .scc-text > h2::before { content: none; display: none; }
body.page-category #main > .scc-content > .scc-text > p { font-size: 15px; line-height: 1.75; color: var(--vvp-ds-muted); }
body.page-category #main > .scc-content > .scc-text a { color: var(--vvp-ds-action); text-decoration: underline; text-underline-offset: 3px; }
body.page-category #main > .scc-content > .scc-text a:hover { color: var(--vvp-ds-accentText,#bd3e68); }
body.page-category #main > .scc-content > .scc-text a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
@media (max-width: 991.98px) {
  body.page-category #main > .scc-content > .scc-text:has(> h2:first-child) { display: block; }
  body.page-category #main > .scc-content > .scc-text > h2:first-child { max-width: none; margin-bottom: 20px; }
  body.page-category #main > .scc-content > .scc-text > * + * { margin-top: 16px; }
}
@media (max-width: 767.98px) {
  body.page-category #main > .scc-content > .scc-text > p { font-size: 14px; }
}
body.page-category #wrapper #main > .scc-content { --vvp-band-bg: var(--vvp-ui-panel-bg,#fff); }