.folio-block { margin: 3.35rem 0; }
.folio-landing-content > .folio-block:first-child { margin-top: 0; }
.folio-landing-content > h2 + p, .folio-section > h2 + p, .folio-split-content > h2 + p { max-width: 52rem; color: #425873; font-size: 1.12rem; line-height: 1.65; }
.folio-callout, .folio-notice, .folio-kpi { border: 1px solid var(--folio-colour-border); border-left: .45rem solid var(--folio-colour-accent); border-radius: var(--folio-radius); padding: var(--folio-space-md); background: var(--folio-colour-canvas); box-shadow: var(--folio-shadow-sm); }
.folio-callout-warning, .folio-notice-warning, .folio-kpi-warning { border-left-color: var(--folio-colour-warning); }
.folio-callout-danger, .folio-notice-danger, .folio-kpi-danger { border-left-color: var(--folio-colour-danger); }
.folio-callout-success, .folio-notice-success, .folio-kpi-success { border-left-color: var(--folio-colour-success); }
.folio-pullquote { font-size: 1.45rem; border-left: .35rem solid var(--folio-colour-accent); padding-left: var(--folio-space-md); color: var(--folio-colour-text); }
.folio-article img { max-width: 100%; height: auto; }
.folio-article p > .folio-lightbox-trigger:only-child { display: block; max-width: var(--folio-reading-width); }
.folio-article p > .folio-lightbox-trigger:only-child img { display: block; max-width: 100%; height: auto; border-radius: var(--folio-radius); }
.folio-figure img, .folio-split img, .folio-breakout img, .folio-before-after img, .folio-gallery img, .folio-listing img { max-width: 100%; height: auto; border-radius: var(--folio-radius); }
.folio-figure img, .folio-split-media img { box-shadow: var(--folio-shadow-sm); border: 1px solid rgb(255 255 255 / 74%); background: #f5f9fd; }
.folio-figure a, .folio-split-media a, .folio-breakout-media a, .folio-before-after a, .folio-listing-media a.folio-lightbox-trigger, .folio-gallery-item a { cursor: zoom-in; }
.folio-figure figcaption, .folio-gallery-caption { color: var(--folio-colour-muted); font-size: var(--folio-type-caption-size); letter-spacing: var(--folio-type-caption-letter-spacing); margin-top: var(--folio-space-xs); }
.folio-figure-wide { width: 100%; max-width: var(--folio-container-width); margin-left: 0; margin-right: 0; transform: none; }
.folio-figure-wide img { display: block; width: 100%; }
.folio-figure-wide figcaption { max-width: var(--folio-reading-width); }
.folio-document a { display: flex; gap: var(--folio-space-sm); align-items: center; border: 1px solid var(--folio-colour-border); padding: var(--folio-space-sm); border-radius: var(--folio-radius); text-decoration: none; }
.folio-document-type { background: var(--folio-colour-accent); color: var(--folio-colour-accent-text); padding: .25rem .5rem; border-radius: var(--folio-radius-sm); font-weight: 800; }
.folio-contact-card { display: grid; gap: .4rem; border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius); padding: var(--folio-space-md); font-style: normal; }
.folio-columns { display: grid; gap: var(--folio-space-md); }
.folio-columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.folio-columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.folio-gap-small { gap: var(--folio-space-xs); }
.folio-gap-medium { gap: var(--folio-space-md); }
.folio-gap-large { gap: var(--folio-space-lg); }
.folio-cards { display: grid; gap: var(--folio-space-md); grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.folio-cards-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.folio-cards-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.folio-cards-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.folio-cards-auto { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.folio-card { display: block; position: relative; border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius); padding: 1.45rem; text-decoration: none; color: inherit; background: linear-gradient(180deg, #fff 0%, #fbfdff 100%); box-shadow: var(--folio-shadow-sm); transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; overflow: hidden; }
.folio-card::before { content: ""; position: absolute; inset: 0 0 auto; height: .18rem; background: linear-gradient(90deg, var(--folio-colour-accent), var(--folio-colour-teal), var(--folio-colour-green)); opacity: .7; }
.folio-card:hover { border-color: color-mix(in srgb, var(--folio-colour-accent) 38%, var(--folio-colour-border)); box-shadow: 0 18px 38px rgba(16,35,63,.13); transform: translateY(-2px); }
.folio-card h2 { font-size: 1.2rem; line-height: 1.2; margin: 0 0 .6rem; color: #10233f; }
.folio-card p { color: var(--folio-colour-muted); font-size: 1rem; line-height: 1.58; margin: 0; }
.folio-split, .folio-breakout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 30rem); gap: var(--folio-space-lg); align-items: center; }
.folio-split { padding-block: .5rem; }
.folio-split-image-left .folio-split-media { order: -1; }
.folio-breakout { width: min(100%, var(--folio-container-width)); max-width: calc(100vw - 2.5rem); margin-inline: auto; padding: var(--folio-space-lg); background: linear-gradient(135deg, var(--folio-colour-canvas-alt), #f7fbf8); border: 1px solid #dfeaf4; border-radius: var(--folio-radius-lg); transform: none; box-shadow: 0 18px 38px rgba(16,35,63,.08); }
.folio-breakout-content { min-width: 0; }
.folio-breakout-media { min-width: 0; }
.folio-breakout-media img { display: block; width: 100%; box-shadow: var(--folio-shadow-sm); }
.folio-breakout-sticky { align-self: start; position: sticky; top: 6rem; }
.folio-section { padding: var(--folio-space-lg); border-radius: var(--folio-radius-lg); }
.folio-section-wide { width: 100%; }
.folio-section-reading > :where(p, ul, ol, blockquote, pre, table, h2, h3, h4, h5, h6) { max-width: var(--folio-reading-width); }
.folio-section-muted { background: linear-gradient(180deg, var(--folio-colour-canvas-alt), #f8fbfd); border: 1px solid #dfeaf4; }
.folio-section-accent { background: linear-gradient(135deg, #eaf5fb 0%, #eef8f2 100%); border: 1px solid #cfe2ef; }
.folio-section-dark { background: #0b213d; color: #fff; }
.folio-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--folio-space-sm); }
.folio-stat { background: var(--folio-colour-canvas-alt); padding: var(--folio-space-md); border-radius: var(--folio-radius); }
.folio-stat strong { font-size: 2.5rem; font-family: var(--folio-font-heading); }
.folio-timeline ol, .folio-steps ol { list-style: none; display: grid; gap: var(--folio-space-md); padding: 0; margin: 0; counter-reset: folio-step; }
.folio-steps li { counter-increment: folio-step; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--folio-space-xs) var(--folio-space-sm); align-items: start; padding: var(--folio-space-md); border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius); background: var(--folio-colour-canvas); }
.folio-steps li::before { content: counter(folio-step); display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: var(--folio-radius-full); background: var(--folio-colour-accent); color: var(--folio-colour-accent-text); font-family: var(--folio-font-heading); font-weight: 800; }
.folio-steps h2 { margin: 0; align-self: center; font-size: 1.35rem; text-align: left; }
.folio-steps p { grid-column: 2; margin: .35rem 0 0; text-align: left; }
.folio-timeline li { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: var(--folio-space-md); padding: var(--folio-space-md); border-left: .25rem solid var(--folio-colour-accent); background: var(--folio-colour-canvas-alt); border-radius: 0 var(--folio-radius) var(--folio-radius) 0; }
.folio-timeline time { color: var(--folio-colour-accent); font-family: var(--folio-font-heading); font-weight: 800; }
.folio-timeline h2 { margin: 0; font-size: 1.25rem; }
.folio-timeline p { margin: .35rem 0 0; }
.folio-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--folio-space-sm); }
.folio-comparison > div { border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius); padding: var(--folio-space-sm); }
.folio-logos { padding: var(--folio-space-md); border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius-lg); background: var(--folio-colour-canvas-alt); }
.folio-logos h2 { margin-top: 0; }
.folio-logos ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--folio-space-sm); align-items: stretch; list-style: none; padding: 0; margin: 0; }
.folio-logos li { display: grid; place-items: center; min-height: 5rem; padding: var(--folio-space-sm); border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius); background: var(--folio-colour-canvas); }
.folio-logos img { display: block; width: 100%; max-width: 12rem; max-height: 4rem; object-fit: contain; }
.folio-testimonial { background: linear-gradient(180deg, #fff, var(--folio-colour-canvas-alt)); padding: var(--folio-space-md); border-radius: var(--folio-radius); border: 1px solid var(--folio-colour-border); box-shadow: var(--folio-shadow-sm); }
.folio-testimonial blockquote { margin: 0; font-size: 1.18rem; color: #10233f; }
.folio-testimonial figcaption { margin-top: 1rem; display: grid; gap: .1rem; color: var(--folio-colour-muted); }
.folio-accordion details { border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius); padding: var(--folio-space-sm); margin: .75rem 0; }
.folio-tabs [role="tablist"] { display: flex; gap: .5rem; flex-wrap: wrap; }
.folio-tabs [role="tab"] { border: 1px solid var(--folio-colour-border); background: var(--folio-colour-canvas); padding: .6rem 1rem; border-radius: var(--folio-radius); }
.folio-tabs [aria-selected="true"] { background: var(--folio-colour-accent); color: var(--folio-colour-accent-text); }
.folio-before-after div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.folio-align-left { text-align: left; justify-content: flex-start; }
.folio-align-center { text-align: center; justify-content: center; }
.folio-align-right { text-align: right; justify-content: flex-end; }
.folio-button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.75rem; padding: .72rem 1.05rem; border: 1px solid transparent; border-radius: var(--folio-radius); text-decoration: none; font-family: var(--folio-font-heading); font-weight: 750; line-height: 1.1; transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease; }
.folio-button:hover { transform: translateY(-1px); box-shadow: 0 12px 24px rgba(16,35,63,.12); }
.folio-button-primary { background: linear-gradient(135deg, var(--folio-colour-accent), #0d7896); color: var(--folio-colour-accent-text); }
.folio-button-secondary { background: var(--folio-colour-canvas); color: var(--folio-colour-accent-dark); border-color: color-mix(in srgb, var(--folio-colour-accent) 24%, var(--folio-colour-border)); }
.folio-button-ghost { background: transparent; color: var(--folio-colour-accent); border-color: currentColor; }
.folio-button-link { min-height: 0; padding-inline: 0; color: var(--folio-colour-accent); background: transparent; border: 0; text-decoration: underline; }
.folio-buttons, .folio-cta-actions { display: flex; flex-wrap: wrap; gap: var(--folio-space-sm); align-items: center; }
.folio-buttons-small .folio-button { min-height: 2.25rem; padding: .5rem .75rem; font-size: .9rem; }
.folio-buttons-large .folio-button { min-height: 3.25rem; padding: .9rem 1.25rem; font-size: 1.1rem; }
.folio-cta { padding: 3.5rem; border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius-lg); background: linear-gradient(135deg, var(--folio-colour-canvas-alt), #f7fbf8); box-shadow: 0 18px 40px rgba(16,35,63,.08); }
.folio-cta-content { max-width: 56rem; }
.folio-cta h2 { margin: 0 0 .75rem; font-size: 2.2rem; line-height: 1.12; }
.folio-cta p { color: var(--folio-colour-muted); font-size: 1.18rem; line-height: 1.62; }
.folio-cta-accent { background: linear-gradient(135deg, #1267b1 0%, #0d7896 55%, #0a3a69 100%); color: var(--folio-colour-accent-text); border-color: transparent; }
.folio-cta-accent p, .folio-cta-dark p { color: inherit; }
.folio-cta-accent .folio-button-primary, .folio-cta-dark .folio-button-primary { background: var(--folio-colour-canvas); color: var(--folio-colour-accent-dark); }
.folio-cta-dark { background: linear-gradient(135deg, #0b213d 0%, #0d315a 62%, #12394d 100%); color: #fff; border-color: transparent; box-shadow: 0 22px 52px rgba(11,33,61,.22); }
.folio-cta-dark .folio-button-secondary { background: transparent; color: #fff; border-color: rgb(255 255 255 / 42%); }
.folio-cta-success { border-left: .45rem solid var(--folio-colour-success); }
.folio-cta-warning { border-left: .45rem solid var(--folio-colour-warning); }
.folio-cta-compact { position: relative; padding: 1.35rem 1.5rem; min-height: 0; background: linear-gradient(135deg, #fff 0%, #f3f8fb 100%); border-color: color-mix(in srgb, var(--folio-colour-accent) 22%, var(--folio-colour-border)); box-shadow: 0 12px 28px rgba(16,35,63,.07); overflow: hidden; }
.folio-cta-compact::after { content: ""; position: absolute; right: 1.35rem; top: 50%; width: 3.25rem; height: 3.25rem; border-radius: var(--folio-radius-full); transform: translateY(-50%); background: radial-gradient(circle at 50% 50%, #fff 0 39%, transparent 40%), linear-gradient(135deg, var(--folio-colour-accent), var(--folio-colour-teal)); opacity: .92; pointer-events: none; }
.folio-cta-compact::before { content: ""; position: absolute; z-index: 1; right: 2.38rem; top: 50%; width: 0; height: 0; border-block: .45rem solid transparent; border-left: .68rem solid var(--folio-colour-accent-dark); transform: translateY(-50%); pointer-events: none; }
.folio-cta-compact .folio-cta-content { max-width: calc(100% - 5rem); }
.folio-cta-compact h2 { font-size: 1.35rem; margin-bottom: .45rem; }
.folio-cta-compact p { max-width: 48rem; margin: 0 0 .85rem; font-size: 1rem; line-height: 1.5; }
.folio-badges { display: flex; flex-wrap: wrap; gap: .5rem; max-width: 100%; list-style: none; padding: 0; }
.folio-badge { display: inline-flex; align-items: center; max-width: 100%; border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius-full); padding: .38rem .75rem; background: var(--folio-colour-canvas); color: var(--folio-colour-text); font-family: var(--folio-font-heading); font-size: var(--folio-type-caption-size); font-weight: 800; letter-spacing: 0; overflow-wrap: anywhere; }
.folio-badge-muted { background: var(--folio-colour-canvas-alt); color: var(--folio-colour-muted); }
.folio-badge-accent { background: var(--folio-colour-accent); color: var(--folio-colour-accent-text); border-color: var(--folio-colour-accent); }
.folio-badge-success { background: var(--folio-colour-success); color: #fff; border-color: var(--folio-colour-success); }
.folio-badge-warning { background: var(--folio-colour-warning); color: #fff; border-color: var(--folio-colour-warning); }
.folio-badge-danger { background: var(--folio-colour-danger); color: #fff; border-color: var(--folio-colour-danger); }
.folio-badge-dark { background: #111827; color: #fff; border-color: #111827; }
.folio-gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: var(--folio-space-md); }
.folio-gallery-columns-2 .folio-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.folio-gallery-columns-3 .folio-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.folio-gallery-columns-4 .folio-gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.folio-gallery-masonry-ish .folio-gallery-grid { align-items: start; }
.folio-gallery-item { margin: 0; }
.folio-gallery-item img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--folio-colour-canvas-alt); }
.folio-gallery-credit { display: block; margin-top: .15rem; }
.folio-gallery-showcase { margin-top: 1.1rem; margin-bottom: 3rem; }
.folio-gallery-showcase .folio-gallery-grid { gap: .85rem; }
.folio-gallery-showcase .folio-gallery-item { position: relative; overflow: hidden; border-radius: var(--folio-radius); background: #0b213d; box-shadow: var(--folio-shadow-sm); }
.folio-gallery-showcase .folio-gallery-item a { display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 10; background: #f5f9fd; }
.folio-gallery-showcase .folio-gallery-item img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; border-radius: 0; transition: transform .18s ease; }
.folio-gallery-showcase .folio-gallery-item:hover img { transform: scale(1.01); }
.folio-gallery-showcase .folio-gallery-caption { position: absolute; left: .75rem; bottom: .75rem; max-width: calc(100% - 1.5rem); margin: 0; padding: .34rem .56rem; border: 1px solid rgb(255 255 255 / 32%); border-radius: var(--folio-radius-sm); background: rgb(11 33 61 / 84%); color: #fff; font-family: var(--folio-font-heading); font-size: .82rem; font-weight: 800; line-height: 1.15; box-shadow: 0 10px 24px rgba(11,33,61,.18); }
.folio-lightbox { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; padding: 0; border: 0; background: transparent; }
.folio-lightbox[open] { display: grid; place-items: center; }
.folio-lightbox::backdrop { background: rgb(15 23 42 / 72%); }
.folio-lightbox button { position: fixed; top: 1rem; right: 1rem; z-index: 1; display: flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; padding: 0; border: 0; border-radius: var(--folio-radius-full); background: var(--folio-colour-canvas); color: var(--folio-colour-text); font-size: 0; box-shadow: var(--folio-shadow-md); cursor: pointer; }
.folio-lightbox button::before, .folio-lightbox button::after { content: ""; position: absolute; width: 1rem; height: 2px; border-radius: var(--folio-radius-full); background: currentColor; }
.folio-lightbox button::before { transform: rotate(45deg); }
.folio-lightbox button::after { transform: rotate(-45deg); }
.folio-lightbox img { display: block; max-width: calc(100vw - 2rem); max-height: calc(100vh - 2rem); margin: auto; border-radius: var(--folio-radius); background: var(--folio-colour-canvas); box-shadow: var(--folio-shadow-md); }
.folio-listing ul { display: grid; gap: 1.45rem; list-style: none; margin: 0; padding: 0; }
.folio-listing-columns-2 ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.folio-listing-columns-3 ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.folio-listing-columns-auto ul { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.folio-listing-item article { display: grid; height: 100%; border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius); background: linear-gradient(180deg, #fff, #fbfdff); overflow: clip; box-shadow: var(--folio-shadow-sm); transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.folio-listing-item article:hover { border-color: color-mix(in srgb, var(--folio-colour-accent) 38%, var(--folio-colour-border)); box-shadow: 0 18px 38px rgba(16,35,63,.13); transform: translateY(-2px); }
.folio-listing-media img { display: block; width: 100%; height: 13rem; object-fit: cover; border-radius: 0; background: #f5f9fd; }
.folio-listing-solutions .folio-listing-media img { height: 13.75rem; }
.folio-listing-media-screenshot { background: #f5f9fd; }
.folio-listing-media-screenshot a { display: flex; align-items: center; justify-content: center; height: 13rem; }
.folio-listing-solutions .folio-listing-media-screenshot a { height: 13.75rem; }
.folio-listing-media-screenshot img, .folio-listing-solutions .folio-listing-media-screenshot img { width: 100%; height: 100%; object-fit: contain; }
.folio-listing-content { padding: 1.35rem; }
.folio-listing-title { margin: .3rem 0 .65rem; font-size: 1.24rem; line-height: 1.2; }
.folio-listing-title a { color: inherit; text-decoration: none; }
.folio-listing-title a:hover { color: var(--folio-colour-accent); text-decoration: underline; }
.folio-listing-content p { color: var(--folio-colour-muted); font-size: 1rem; line-height: 1.58; margin-bottom: 0; }
.folio-listing-tag, .folio-listing-meta { color: var(--folio-colour-accent-dark); font-family: var(--folio-font-heading); font-size: var(--folio-type-caption-size); letter-spacing: 0; text-transform: uppercase; font-weight: 800; }
.folio-listing-rows ul, .folio-listing-compact ul { grid-template-columns: 1fr; }
.folio-listing-rows .folio-listing-item article { grid-template-columns: minmax(12rem, 18rem) 1fr; }
.folio-listing-compact .folio-listing-media { display: none; }
.folio-listing-editorial .folio-listing-item article { border: 0; border-top: 1px solid var(--folio-colour-border); border-radius: 0; box-shadow: none; }
.folio-listing-videos .folio-listing-media { position: relative; background: #10233f; }
.folio-listing-videos .folio-listing-media::after { content: ""; position: absolute; left: 50%; top: 50%; width: 3.35rem; height: 3.35rem; border-radius: var(--folio-radius-full); transform: translate(-50%, -50%); background: rgb(255 255 255 / 92%); box-shadow: 0 14px 30px rgb(16 35 63 / 28%); pointer-events: none; }
.folio-listing-videos .folio-listing-media::before { content: ""; position: absolute; z-index: 1; left: calc(50% + .13rem); top: 50%; width: 0; height: 0; border-block: .58rem solid transparent; border-left: .86rem solid #10233f; transform: translate(-50%, -50%); pointer-events: none; }
.folio-listing-videos .folio-listing-media img { aspect-ratio: 16 / 9; height: auto; filter: saturate(1.03); }
.folio-listing-videos .folio-listing-item article:hover .folio-listing-media::after { background: #fff; }
.folio-video-actions { display: flex; flex-wrap: wrap; gap: .65rem .85rem; align-items: center; margin-top: 1rem; font-family: var(--folio-font-heading); font-weight: 800; }
.folio-video-action, .folio-video-product { text-decoration: none; }
.folio-video-action { color: var(--folio-colour-accent); }
.folio-video-action::after { content: " ->"; }
.folio-video-product { color: var(--folio-colour-muted); font-size: var(--folio-type-caption-size); }
.folio-video-action:hover, .folio-video-product:hover { text-decoration: underline; }
.folio-specs dl { display: grid; gap: var(--folio-space-sm); margin: 0; }
.folio-specs-columns-2 dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.folio-specs-columns-3 dl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.folio-specs-columns-4 dl { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.folio-specs-columns-auto dl { grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }
.folio-spec { border: 1px solid var(--folio-colour-border); border-radius: var(--folio-radius); padding: var(--folio-space-md); background: linear-gradient(180deg, #fff, #fbfdff); box-shadow: var(--folio-shadow-sm); }
.folio-spec-label { color: var(--folio-colour-accent-dark); font-family: var(--folio-font-heading); font-size: var(--folio-type-caption-size); letter-spacing: 0; text-transform: uppercase; font-weight: 800; }
.folio-spec-value { margin: .25rem 0 0; font-family: var(--folio-font-heading); font-size: 1.15rem; font-weight: 700; }
.folio-spec-description { margin: .35rem 0 0; color: var(--folio-colour-muted); }
.folio-specs-muted .folio-spec { background: var(--folio-colour-canvas-alt); }
.folio-specs-accent .folio-spec { border-top: .25rem solid var(--folio-colour-accent); }
.folio-specs-dark { background: #0b213d; color: #fff; padding: var(--folio-space-md); border-radius: var(--folio-radius-lg); }
.folio-specs-dark .folio-spec { background: transparent; border-color: rgb(255 255 255 / 24%); }
.folio-specs-dark .folio-spec-label, .folio-specs-dark .folio-spec-description { color: rgb(255 255 255 / 72%); }
.folio-prev-next { display: flex; justify-content: space-between; gap: var(--folio-space-sm); margin-top: var(--folio-space-lg); border-top: 1px solid var(--folio-colour-border); padding-top: var(--folio-space-sm); }
.folio-prev-next a { display: grid; text-decoration: none; }
.folio-prev-next span { color: var(--folio-colour-muted); font-size: .9rem; }
@media (max-width: 980px) { .folio-cards-3, .folio-cards-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .folio-listing-columns-3 ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .folio-block { margin: 2.35rem 0; } .folio-columns-2, .folio-columns-3, .folio-split, .folio-breakout, .folio-comparison, .folio-before-after div, .folio-gallery-columns-2 .folio-gallery-grid, .folio-gallery-columns-3 .folio-gallery-grid, .folio-gallery-columns-4 .folio-gallery-grid, .folio-cards-2, .folio-cards-3, .folio-cards-4, .folio-listing-columns-2 ul, .folio-listing-columns-3 ul, .folio-listing-rows .folio-listing-item article, .folio-specs-columns-2 dl, .folio-specs-columns-3 dl, .folio-specs-columns-4 dl, .folio-timeline li { grid-template-columns: 1fr; } .folio-breakout, .folio-cta, .folio-section { padding: var(--folio-space-md); } .folio-listing-media img, .folio-listing-solutions .folio-listing-media img { height: 11.25rem; } .folio-cta h2 { font-size: 1.65rem; } .folio-buttons, .folio-cta-actions { align-items: stretch; } .folio-buttons .folio-button, .folio-cta-actions .folio-button { width: 100%; text-align: center; } }
@media (max-width: 760px) { .folio-cta-compact::before, .folio-cta-compact::after { display: none; } .folio-cta-compact .folio-cta-content { max-width: none; } .folio-cta-compact h2 { font-size: 1.35rem; } }
@media (max-width: 480px) { .folio-badges { display: grid; grid-template-columns: 1fr; } .folio-badge { width: 100%; justify-content: center; text-align: center; border-radius: var(--folio-radius); } }
@media (max-width: 760px) { .folio-listing-media-screenshot a, .folio-listing-solutions .folio-listing-media-screenshot a { height: 11.25rem; } .folio-listing-media-screenshot img, .folio-listing-solutions .folio-listing-media-screenshot img { height: 100%; } }