.vformate-service-detail {
--vf-container: 1320px; --vf-gutter: 24px; --vf-gutter-mobile: 16px; --vf-text-column: 900px;
--vf-brand: #4B5EAA; --vf-accent: #FAA633; --vf-text: #151515; --vf-text-muted: #686868;
--vf-border: #DEDEDE; --vf-surface: #FFFFFF; --vf-surface-soft: #F6F6F3;
--vf-radius-card: 10px; --vf-radius-image: 10px; --vf-radius-button: 6px;
--vf-section-gap: 80px; --vf-section-gap-mobile: 48px; --vf-heading-gap: 36px; --vf-heading-gap-mobile: 24px;
--vf-content-gap: 20px; --vf-content-gap-mobile: 16px; --vf-card-padding: 28px; --vf-card-padding-mobile: 20px;
--vf-h1: 56px; --vf-h1-mobile: 32px; --vf-h2: 38px; --vf-h2-mobile: 28px; --vf-h3: 24px; --vf-h3-mobile: 20px;
--vf-header-offset-desktop: 127px; --vf-header-offset-tablet: 78px; --vf-header-offset-mobile: 80px;
display: flex; flex-direction: column; width: calc(100% - (var(--vf-gutter) * 2)); max-width: var(--vf-container); margin-inline: auto; padding-top: var(--vf-header-offset-desktop); gap: 40px; color: var(--vf-text);
}
.vformate-service-detail *, .vformate-service-detail *::before, .vformate-service-detail *::after { box-sizing: border-box; }
.vformate-service-detail > * + *,
.vformate-service-cta--top + .vformate-service-section--description { margin-top: 0; }
.vformate-service-detail h2 { margin: 0 0 var(--vf-heading-gap); color: var(--vf-text); font-size: var(--vf-h2); line-height: 1.12; }
.vformate-service-detail h3 { margin: 0 0 10px; color: var(--vf-text); font-size: var(--vf-h3); line-height: 1.2; }
.vformate-service-detail p { line-height: 1.7; }
.vformate-service-hero { position: relative; display: grid; min-height: 480px; margin-top: 0; overflow: hidden; border-radius: var(--vf-radius-image); background: #202020; }
.vformate-service-hero::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,.48) 50%, rgba(0,0,0,.82)); }
.vformate-service-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.vformate-service-hero__content { position: relative; z-index: 1; display: flex; min-width: 0; align-self: stretch; flex-direction: column; padding: clamp(18px, 5vw, 36px); color: #fff; }
.vformate-service-hero__title { max-width: 1000px; margin: auto 0 0; overflow-wrap: anywhere; color: inherit; font-size: var(--vf-h1); line-height: 1.05; }
.vformate-service-hero__excerpt { max-width: 820px; margin-top: 20px; overflow-wrap: anywhere; font-size: 20px; line-height: 1.6; }
.vformate-service-hero__excerpt p { margin: 0; }
.vformate-service-hero__usps { display: grid; max-width: 1080px; gap: 16px 28px; margin: 28px 0 0; padding: 0; list-style: none; }
.vformate-service-hero__usps--count-1 { grid-template-columns: 1fr; }
.vformate-service-hero__usps--count-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vformate-service-hero__usps--count-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vformate-service-hero__usps--count-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.vformate-service-hero__usps li { display: flex; align-items: center; min-width: 0; gap: 10px; font-size: 14px; font-weight: 700; line-height: 1.4; }
.vformate-service-hero__usp-icon { position: relative; flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%; background: var(--vf-brand); }
.vformate-service-hero__usp-icon::before { position: absolute; top: 5px; left: 8px; width: 6px; height: 10px; border: solid var(--vf-accent); border-width: 0 2px 2px 0; content: ""; transform: rotate(45deg); }
.vformate-service-hero--plain { background: #191c25; }
.vformate-service-hero--plain::after { background: linear-gradient(135deg, rgba(75,94,170,.22), transparent 58%, rgba(0,0,0,.28)); }
.vformate-service-breadcrumbs { margin-bottom: 28px; }
.vformate-service-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.vformate-service-breadcrumbs li { display: flex; min-width: 0; align-items: center; gap: 8px; overflow-wrap: anywhere; font-size: 13px; }
.vformate-service-breadcrumbs li:not(:last-child)::after { content: "/"; opacity: .55; }
.vformate-service-breadcrumbs a { color: inherit; text-decoration: none; opacity: .82; }
.vformate-service-breadcrumbs a:hover, .vformate-service-breadcrumbs a:focus-visible { opacity: 1; }
.vformate-service-breadcrumbs [aria-current="page"] { opacity: .68; }
.vformate-service-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; padding: 26px 28px; border: 1px solid var(--vf-border); border-radius: var(--vf-radius-card); background: var(--vf-surface); }
.vformate-service-cta__copy { max-width: 680px; }
.vformate-service-cta__copy strong { display: block; margin-bottom: 6px; font-size: 26px; line-height: 1.2; }
.vformate-service-cta__copy p { margin: 0; color: var(--vf-text-muted); }
.vformate-service-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
.vformate-button { display: inline-flex; min-height: 50px; gap: 12px; align-items: center; justify-content: center; padding: 12px 24px; border: 1px solid var(--vf-brand); border-radius: var(--vf-radius-button); background: var(--vf-brand); color: #fff; font-weight: 700; line-height: 1.2; text-decoration: none; }
.vformate-button:hover, .vformate-button:focus-visible { background: #3f519b; color: #fff; }
.vformate-service-cta__button--mobile { display: none; }
.vformate-service-cta__button--secondary { background: var(--vf-surface); color: var(--vf-brand); }
.vformate-service-tabs { display: none; gap: 10px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
.vformate-service-detail--tabs.is-tabs-ready .vformate-service-tabs { display: flex; }
.vformate-service-tabs button { flex: 0 0 auto; min-height: 52px; padding: 12px 22px; border: 1px solid var(--vf-border); border-radius: var(--vf-radius-button); background: var(--vf-surface); color: var(--vf-text); font-weight: 700; cursor: pointer; }
.vformate-service-tabs button[aria-selected="true"] { border-color: var(--vf-brand); box-shadow: inset 0 3px var(--vf-accent); color: var(--vf-brand); }
.vformate-service-detail--tabs > .vformate-service-section { margin-top: 0; }
.vformate-service-section[hidden] { display: none; }
.vformate-service-prose { width: 100%; max-width: none; color: #151515; font-size: 17px; line-height: 1.7; overflow-wrap: break-word; }
.vformate-service-prose > * { margin-top: 0; }
.vformate-service-prose > * + * { margin-top: 1.25em; }
.vformate-service-prose > :last-child { margin-bottom: 0; }
.vformate-service-prose h2, .vformate-service-prose h3, .vformate-service-prose h4 { max-width: 100%; font-weight: 700; overflow-wrap: anywhere; }
.vformate-service-prose h2 { margin-bottom: 24px; color: #4B5EAA; font-size: var(--vf-h2); line-height: 1.15; }
.vformate-service-prose h2:not(:first-child) { margin-top: 1.8em; }
.vformate-service-prose h2::after { display: inline-block; width: 9px; height: 9px; margin-left: .24em; border-radius: 50%; background: #FAA633; content: ""; vertical-align: .05em; }
.vformate-service-prose h3 { margin-bottom: 14px; color: #151515; font-size: var(--vf-h3); line-height: 1.25; }
.vformate-service-prose h3:not(:first-child) { margin-top: 1.65em; }
.vformate-service-prose h4 { margin-bottom: 10px; color: #151515; font-size: 20px; line-height: 1.3; }
.vformate-service-prose h4:not(:first-child) { margin-top: 1.5em; }
.vformate-service-prose p { margin-bottom: 0; color: #151515; line-height: 1.7; }
.vformate-service-prose strong, .vformate-service-prose b { color: #151515; font-weight: 700; }
.vformate-service-prose em, .vformate-service-prose i { font-style: italic; }
.vformate-service-prose a { color: #4B5EAA; text-decoration-color: rgba(75,94,170,.45); text-decoration-thickness: 1px; text-underline-offset: .18em; transition: color .2s ease, text-decoration-color .2s ease; }
.vformate-service-prose a:hover { color: #35488f; text-decoration-color: currentColor; }
.vformate-service-prose ul, .vformate-service-prose ol { margin-bottom: 0; padding-left: 0; list-style: none; }
.vformate-service-prose li { position: relative; }
.vformate-service-prose ul > li { padding-left: 27px; }
.vformate-service-prose ol > li { padding-left: 38px; }
.vformate-service-prose li + li { margin-top: 9px; }
.vformate-service-prose li > ul, .vformate-service-prose li > ol { margin-top: 9px; padding-left: 18px; }
.vformate-service-prose ul > li::before { position: absolute; top: .72em; left: 5px; width: 7px; height: 7px; border-radius: 50%; background: #4B5EAA; content: ""; }
.vformate-service-prose ul ul > li::before { width: 6px; height: 6px; border: 1px solid #4B5EAA; background: transparent; }
.vformate-service-prose ol { counter-reset: vf-prose-list; }
.vformate-service-prose ol > li { counter-increment: vf-prose-list; }
.vformate-service-prose ol > li::before { position: absolute; top: 0; left: 0; width: 27px; color: #4B5EAA; content: counter(vf-prose-list, decimal-leading-zero); font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; }
.vformate-service-prose ol ol { counter-reset: vf-prose-sublist; }
.vformate-service-prose ol ol > li { counter-increment: vf-prose-sublist; }
.vformate-service-prose ol ol > li::before { color: #4B5EAA; content: counter(vf-prose-sublist, decimal-leading-zero); }
.vformate-service-prose blockquote { margin-right: 0; margin-bottom: 0; margin-left: 0; padding: 20px 24px; border-left: 4px solid #4B5EAA; border-radius: 10px; background: #F6F6F3; color: #151515; }
.vformate-service-prose blockquote > :first-child { margin-top: 0; }
.vformate-service-prose blockquote > :last-child { margin-bottom: 0; }
.vformate-service-prose hr { height: 1px; margin-bottom: 0; border: 0; background: #DEDEDE; }
.vformate-service-prose table { display: block; width: 100%; max-width: 100%; margin-bottom: 0; overflow-x: auto; border: 1px solid #DEDEDE; border-collapse: separate; border-spacing: 0; border-radius: 10px; background: #fff; -webkit-overflow-scrolling: touch; }
.vformate-service-prose thead, .vformate-service-prose tbody { vertical-align: top; }
.vformate-service-prose th, .vformate-service-prose td { min-width: 140px; padding: 13px 16px; border: 0; border-right: 1px solid #DEDEDE; border-bottom: 1px solid #DEDEDE; text-align: left; line-height: 1.5; }
.vformate-service-prose th { background: #F1F3F8; color: #4B5EAA; font-weight: 700; }
.vformate-service-prose td { background: #fff; color: #151515; transition: background-color .18s ease; }
.vformate-service-prose tbody tr:hover > td { background: #FAFAFC; }
.vformate-service-prose tr > :last-child { border-right: 0; }
.vformate-service-prose tbody tr:last-child > td { border-bottom: 0; }
.vformate-service-prose img { display: block; max-width: 100%; height: auto; border-radius: 10px; }
.vformate-service-prose figure { max-width: 100%; margin-right: 0; margin-bottom: 0; margin-left: 0; }
.vformate-service-prose figure img { width: auto; }
.vformate-service-prose figcaption { margin-top: 9px; color: #686868; font-size: 14px; line-height: 1.5; }
.vformate-service-prose code { padding: .15em .38em; border: 1px solid #DEDEDE; border-radius: 4px; background: #F6F6F3; font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: .9em; }
.vformate-service-prose pre { max-width: 100%; margin-bottom: 0; overflow-x: auto; padding: 18px 20px; border: 1px solid #DEDEDE; border-radius: 10px; background: #F6F6F3; color: #151515; line-height: 1.55; tab-size: 4; -webkit-overflow-scrolling: touch; }
.vformate-service-prose pre code { padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font-size: .9em; white-space: pre; }
.vformate-service-content-gallery { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-top: var(--vf-heading-gap); }
.vformate-service-content-gallery__item { min-width: 0; margin: 0; }
.vformate-service-content-gallery__item a { display: block; overflow: hidden; aspect-ratio: 16 / 10; border-radius: var(--vf-radius-image); background: var(--vf-surface-soft); }
.vformate-service-content-gallery__item img { display: block; width: 100%; max-width: none; height: 100%; object-fit: cover; object-position: center; transition: transform .25s ease; }
.vformate-service-content-gallery__item a:hover img { transform: scale(1.025); }
.vformate-service-content-gallery__item figcaption, .vformate-service-content-video figcaption { padding-top: 10px; color: var(--vf-text-muted); font-size: 14px; line-height: 1.5; }
.vformate-service-content-video { width: 100%; margin: var(--vf-heading-gap) 0 0; }
.vformate-service-content-video__embed { position: relative; width: 100%; overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--vf-radius-image); background: #111; }
.vformate-service-content-video__embed iframe, .vformate-service-content-video__embed video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; }
.vformate-service-projects, .vformate-work-photos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--vf-content-gap); }
.vformate-service-projects.vformate-count-1, .vformate-work-photos.vformate-count-1 { grid-template-columns: 1fr; }
.vformate-service-projects.vformate-count-2, .vformate-work-photos.vformate-count-2, .vformate-service-projects.vformate-count-4, .vformate-work-photos.vformate-count-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vformate-service-project { position: relative; overflow: hidden; border: 1px solid var(--vf-border); border-radius: var(--vf-radius-card); background: var(--vf-surface); }
.vformate-service-project__image { display: block; overflow: hidden; aspect-ratio: 4 / 3; background: var(--vf-surface-soft); }
.vformate-service-project__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.vformate-service-project__body { position: relative; min-width: 0; padding: 22px 54px 22px 22px; }
.vformate-service-project__meta { display: flex; min-width: 0; gap: 12px; justify-content: space-between; margin-bottom: 12px; color: var(--vf-text-muted); font-size: 13px; line-height: 1.35; }
.vformate-service-project__meta span { min-width: 0; overflow-wrap: anywhere; }
.vformate-service-project h3 { margin: 0; }
.vformate-service-project h3 a { color: var(--vf-text); text-decoration: none; }
.vformate-service-project__link { position: absolute; right: 22px; bottom: 23px; color: var(--vf-brand); font-size: 20px; text-decoration: none; }
.vformate-service-projects.vformate-count-1 .vformate-service-project { display: grid; grid-template-columns: minmax(0, 3fr) minmax(280px, 2fr); }
.vformate-service-projects.vformate-count-1 .vformate-service-project__image { aspect-ratio: 16 / 10; }
.vformate-service-project:hover .vformate-service-project__image img { transform: scale(1.025); }
.vformate-work-photos figure { margin: 0; }
.vformate-work-photos img { display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: var(--vf-radius-image); object-fit: cover; }
.vformate-work-photos figcaption { padding-top: 10px; color: var(--vf-text-muted); line-height: 1.5; }
.vformate-work-photos.vformate-count-1 img { aspect-ratio: 16 / 7; }
.vformate-service-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--vf-content-gap); }
.vformate-service-benefits.vformate-count-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vformate-service-benefits article { padding: var(--vf-card-padding); border: 1px solid var(--vf-border); border-radius: var(--vf-radius-card); background: var(--vf-surface); }
.vformate-service-benefits article > span { display: grid; width: 42px; height: 42px; margin-bottom: 28px; place-items: center; border-radius: 50%; background: var(--vf-surface-soft); color: var(--vf-accent); font-size: 18px; font-weight: 800; }
.vformate-service-benefits article p { margin: 0; color: var(--vf-text-muted); }
.vformate-service-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--vf-content-gap); align-items: stretch; margin: 0; padding: 0; list-style: none; }
.vformate-service-steps li { position: relative; min-width: 0; overflow: hidden; padding: 13px 24px 22px; border: 1px solid #B8D7FF; border-radius: 20px; background: linear-gradient(135deg, #FFFFFF 18%, #F3F7FD 100%); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.vformate-service-steps li > span { position: absolute; top: -1px; left: -1px; display: flex; width: 48px; height: 44px; align-items: flex-start; justify-content: center; padding-top: 19px; border-radius: 20px 0 24px 0; background: var(--vf-brand); color: #FFFFFF; font-size: 15px; font-weight: 700; line-height: 1; transition: background-color .2s ease, color .2s ease; }
.vformate-service-steps h3 { min-height: 53px; margin-bottom: 8px; padding-left: 44px; color: #0B1E48; font-size: 21px; line-height: 1.25; overflow-wrap: anywhere; }
.vformate-service-steps p { max-width: none; margin: 0; color: #68738A; font-size: 17px; line-height: 1.55; }
.vformate-service-steps li:hover { border-color: var(--vf-brand); box-shadow: 0 10px 24px rgba(75,94,170,.12); transform: translateY(-2px); }
.vformate-service-steps li:hover > span { background: var(--vf-accent); color: var(--vf-brand); }
.vformate-service-manager { display: grid; grid-template-columns: minmax(0, 35fr) minmax(0, 65fr); gap: 0; align-items: center; padding: clamp(28px, 3.5vw, 44px); border: 1px solid #B8D7FF; border-radius: 10px; background: linear-gradient(135deg, #FFFFFF 18%, #F3F7FD 100%); color: #0B1E48; }
.vformate-service-manager__intro { width: 100%; max-width: 430px; padding-right: clamp(24px, 3vw, 40px); }
.vformate-service-manager__intro-eyebrow { display: block; color: #4B5EAA; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.vformate-service-manager__intro h2 { max-width: 390px; margin: 12px 0 16px; font-size: 21px; line-height: 1.14; }
.vformate-service-manager__intro p { margin: 0; color: #59657A; font-size: 17px; line-height: 1.65; }
.vformate-service-manager__card { position: relative; display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: 22px; align-items: center; min-width: 0; padding: 4px 0 4px clamp(28px, 3.5vw, 48px); border: 0; border-left: 1px solid #D7DDEA; border-radius: 0; background: transparent; }
.vformate-service-manager__card--no-photo { grid-template-columns: minmax(0, 1fr); }
.vformate-service-manager__photo { display: block; width: 116px; height: 116px; overflow: hidden; border-radius: 10px; background: var(--vf-surface-soft); }
.vformate-service-manager__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.vformate-service-manager__content { display: grid; min-width: 0; gap: 16px; }
.vformate-service-eyebrow { display: block; margin-bottom: 5px; color: #59657A; font-size: 13px; font-weight: 600; line-height: 1.35; }
.vformate-service-manager__content h3 { margin: 0; color: #4B5EAA; font-size: 22px; font-weight: 700; line-height: 1.2; }
.vformate-service-manager__content h3 a { color: inherit; text-decoration: none; }
.vformate-service-manager__contacts { display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content; gap: 10px 20px; align-items: start; margin: 0; }
.vformate-service-manager__contacts div { min-width: 0; }
.vformate-service-manager__contacts dt { margin: 0 0 3px; color: #59657A; font-size: 12px; font-weight: 600; line-height: 1.35; }
.vformate-service-manager__contacts dd { margin: 0; }
.vformate-service-manager__contacts a { color: #33415C; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.vformate-service-manager__contacts a:hover { color: #4B5EAA; }
.vformate-service-manager__contacts div:last-child a { white-space: nowrap; }
.vformate-service-manager__contacts .vformate-service-manager__whatsapp { display: inline-flex; gap: 7px; align-items: center; }
.vformate-service-manager__whatsapp .fa-whatsapp { flex: 0 0 auto; color: #25D366; font-size: 18px; line-height: 1; }
.vformate-service-faq { display: grid; gap: 12px; }
.vformate-service-faq details { padding: 0 22px; border: 1px solid var(--vf-border); border-radius: var(--vf-radius-card); background: var(--vf-surface); }
.vformate-service-faq summary { display: flex; gap: 24px; align-items: center; justify-content: space-between; padding: 21px 0; font-size: 21px; font-weight: 700; cursor: pointer; list-style: none; }
.vformate-service-faq summary::-webkit-details-marker { display: none; }
.vformate-service-faq summary span { position: relative; flex: 0 0 24px; width: 24px; height: 24px; }
.vformate-service-faq summary span::before, .vformate-service-faq summary span::after { position: absolute; top: 11px; left: 3px; width: 18px; height: 2px; content: ""; background: currentColor; }
.vformate-service-faq summary span::after { transform: rotate(90deg); transition: transform .2s ease; }
.vformate-service-faq details[open] summary span::after { transform: rotate(0); }
.vformate-service-faq details > div { max-width: var(--vf-text-column); padding: 0 0 22px; color: var(--vf-text-muted); }
.vformate-related-services { margin-bottom: 40px; }
.vformate-related-services__heading { display: flex; gap: 24px; align-items: center; justify-content: space-between; margin-bottom: var(--vf-heading-gap); }
.vformate-related-services__heading h2 { margin: 0; }
.vformate-related-services__navigation { display: none; gap: 10px; flex: 0 0 auto; }
.vformate-related-services__navigation button { display: grid; width: 46px; height: 46px; padding: 0; place-items: center; border: 1px solid var(--vf-border); border-radius: 50%; background: var(--vf-surface); color: var(--vf-brand); font-size: 20px; line-height: 1; cursor: pointer; transition: border-color .2s ease, background-color .2s ease, color .2s ease; }
.vformate-related-services__navigation button:hover { border-color: var(--vf-brand); background: var(--vf-brand); color: #fff; }
.vformate-related-services__navigation button.swiper-button-disabled { opacity: .35; cursor: default; }
.vformate-related-services__navigation button.swiper-button-disabled:hover { border-color: var(--vf-border); background: var(--vf-surface); color: var(--vf-brand); }
.vformate-related-services__slider { overflow: hidden; }
.vformate-related-services__slider .swiper-wrapper { align-items: stretch; }
.vformate-related-services__slider .swiper-slide { height: auto; }
.vformate-related-services__pagination { position: static; display: none; align-items: center; justify-content: center; min-height: 20px; margin-top: 16px; }
.vformate-related-services__pagination .swiper-pagination-bullet { width: 8px; height: 8px; margin: 0 5px; background: var(--vf-brand); opacity: .3; }
.vformate-related-services__pagination .swiper-pagination-bullet-active { width: 22px; border-radius: 999px; opacity: 1; }
.vformate-related-services__pagination.swiper-pagination-lock { display: none; }
.vformate-related-service-card { display: flex; height: 100%; min-width: 0; overflow: hidden; flex-direction: column; border: 1px solid #DEDEDE; border-radius: 10px; background: #fff; transition: border-color .2s ease, box-shadow .2s ease; }
.vformate-related-service-card__media { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-bottom: 1px solid #DEDEDE; background: #f1f3f9; }
.vformate-related-service-card .vformate-related-service-card__image { position: absolute; inset: 0; display: block; width: 100%; max-width: none; height: 100%; object-fit: cover; object-position: center; }
.vformate-related-service-card__placeholder { position: absolute; inset: 0; display: grid; width: 100%; height: 100%; place-items: center; background: linear-gradient(135deg, rgba(75,94,170,.08), rgba(75,94,170,.2)), repeating-linear-gradient(45deg, transparent 0 12px, rgba(255,255,255,.38) 12px 24px); color: #4B5EAA; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.vformate-related-service-card__body { display: flex; padding: 24px; flex: 1 1 auto; flex-direction: column; }
.vformate-related-service-card h3 { display: -webkit-box; margin: 0; overflow: hidden; font-size: 22px; line-height: 1.25; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.vformate-related-service-card h3 a { color: #151515; text-decoration: none; }
.vformate-related-service-card__link { display: flex; gap: 14px; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 24px; color: #4B5EAA; font-weight: 700; text-decoration: none; }
.vformate-related-service-card__link i { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 50%; background: #FAA633; color: #151515; font-style: normal; line-height: 1; }
.vformate-related-service-card:hover { border-color: #4B5EAA; box-shadow: 0 8px 20px rgba(75,94,170,.10); }
.vformate-service-detail a:focus-visible, .vformate-service-detail button:focus-visible, .vformate-service-detail summary:focus-visible { outline: 3px solid rgba(75,94,170,.38); outline-offset: 3px; }
@media (max-width: 1199px) {
.vformate-service-content-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.vformate-service-detail { padding-top: var(--vf-header-offset-tablet); }
.vformate-service-hero { margin-top: 0; }
.vformate-service-hero__usps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vformate-service-hero__usps--count-1 { grid-template-columns: 1fr; }
.vformate-service-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vformate-service-manager { grid-template-columns: minmax(0, 1fr); gap: 28px; }
.vformate-service-manager__intro { max-width: 620px; padding-right: 0; }
.vformate-service-manager__card { padding: 28px 0 0; border-left: 0; border-top: 1px solid #D7DDEA; }
}
@media (max-width: 991px) {
.vformate-service-content-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vformate-service-projects, .vformate-work-photos, .vformate-service-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vformate-service-projects.vformate-count-1, .vformate-work-photos.vformate-count-1 { grid-template-columns: 1fr; }
.vformate-service-projects.vformate-count-1 .vformate-service-project { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
.vformate-service-detail { width: 100%; }
.vformate-service-detail > * + * { margin-top: 0; }
.vformate-service-detail h2 { margin-bottom: var(--vf-heading-gap-mobile); font-size: var(--vf-h2-mobile); }
.vformate-service-detail h3 { font-size: var(--vf-h3-mobile); }
.vformate-service-prose { font-size: 16px; }
.vformate-service-prose h2 { margin-bottom: 20px; font-size: var(--vf-h2-mobile); line-height: 1.18; }
.vformate-service-prose h2:not(:first-child) { margin-top: 1.6em; }
.vformate-service-prose h2::after { width: 7px; height: 7px; }
.vformate-service-prose h3 { font-size: var(--vf-h3-mobile); }
.vformate-service-prose h4 { font-size: 18px; }
.vformate-service-prose ul > li { padding-left: 25px; }
.vformate-service-prose ol > li { padding-left: 36px; }
.vformate-service-prose li > ul, .vformate-service-prose li > ol { padding-left: 10px; }
.vformate-service-prose blockquote { padding: 18px 18px 18px 20px; }
.vformate-service-prose th, .vformate-service-prose td { min-width: 132px; padding: 11px 13px; }
.vformate-service-prose pre { padding: 16px; }
.vformate-service-detail { padding-top: var(--vf-header-offset-mobile); }
.vformate-service-hero, .vformate-service-hero--plain { display: grid; grid-template-areas: "breadcrumbs" "image" "title" "excerpt" "usps"; min-height: 0; margin-top: 0; overflow: visible; border: 0; border-radius: 0; background: transparent; color: var(--vf-text); }
.vformate-service-hero::after { display: none; }
.vformate-service-hero > img { position: relative; grid-area: image; inset: auto; display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border-radius: var(--vf-radius-image); object-fit: cover; }
.vformate-service-hero__content { display: contents; }
.vformate-service-breadcrumbs { grid-area: breadcrumbs; margin: 0; padding: 0 0 16px; color: var(--vf-text); }
.vformate-service-hero__title { grid-area: title; margin: 0; padding: 24px 0 0; color: var(--vf-text); font-size: var(--vf-h1-mobile); line-height: 1.05; }
.vformate-service-hero__excerpt { grid-area: excerpt; margin: 14px 0 0; padding: 0; color: var(--vf-text-muted); font-size: 16px; line-height: 1.65; }
.vformate-service-hero__usps { grid-area: usps; grid-template-columns: 1fr; gap: 12px 16px; margin: 20px 0 0; padding: 0; color: var(--vf-text); }
.vformate-service-hero__usps--count-2, .vformate-service-hero__usps--count-3, .vformate-service-hero__usps--count-4 { grid-template-columns: 1fr; }
.vformate-service-hero--plain .vformate-service-hero__title { padding-top: 0; }
.vformate-service-cta { grid-template-columns: 1fr; gap: 18px; padding: var(--vf-card-padding-mobile); }
.vformate-service-cta__copy strong { font-size: 23px; }
.vformate-service-cta__actions { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr); gap: 12px; justify-content: stretch; }
.vformate-service-cta__button--desktop { display: none; }
.vformate-service-cta__button--mobile { display: inline-flex; width: 100%; min-height: 52px; justify-self: stretch; }
.vformate-service-content-gallery, .vformate-service-content-video { margin-top: var(--vf-heading-gap-mobile); }
.vformate-service-content-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.vformate-work-photos.vformate-count-1 img { aspect-ratio: 16 / 9; }
.vformate-service-projects, .vformate-service-projects.vformate-count-1, .vformate-service-projects.vformate-count-2, .vformate-service-projects.vformate-count-4,
.vformate-work-photos, .vformate-work-photos.vformate-count-1, .vformate-work-photos.vformate-count-2, .vformate-work-photos.vformate-count-4,
.vformate-service-benefits, .vformate-service-benefits.vformate-count-4 { grid-template-columns: minmax(0, 1fr); gap: var(--vf-content-gap-mobile); }
.vformate-service-benefits article { padding: var(--vf-card-padding-mobile); }
.vformate-service-steps { grid-template-columns: minmax(0, 1fr); gap: var(--vf-content-gap-mobile); }
.vformate-service-steps li { padding: 13px 22px 22px; }
.vformate-service-steps h3 { font-size: 21px; }
.vformate-service-manager { gap: 20px; padding: var(--vf-card-padding-mobile); }
.vformate-service-manager__intro h2 { margin: 10px 0 12px; font-size: 21px; }
.vformate-service-manager__intro p { font-size: 16px; line-height: 1.6; }
.vformate-service-manager__card { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; align-items: start; padding: 20px 0 0; }
.vformate-service-manager__card--no-photo { grid-template-columns: minmax(0, 1fr); }
.vformate-service-manager__photo { width: 80px; height: 80px; }
.vformate-service-manager__card:not(.vformate-service-manager__card--no-photo) .vformate-service-manager__content { display: contents; }
.vformate-service-manager__identity { align-self: center; padding-right: 0; }
.vformate-service-manager__content h3 { margin: 0; font-size: 21px; }
.vformate-service-manager__card:not(.vformate-service-manager__card--no-photo) .vformate-service-manager__contacts { grid-column: 1 / -1; }
.vformate-service-manager__contacts { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 2px; }
.vformate-service-faq details { padding: 0 var(--vf-card-padding-mobile); }
.vformate-service-faq summary { padding: 19px 0; font-size: 19px; }
.vformate-related-services__heading { margin-bottom: var(--vf-heading-gap-mobile); }
.vformate-related-services__heading h2 { margin: 0; }
.vformate-related-services__pagination { display: flex; }
.vformate-related-service-card__body { padding: var(--vf-card-padding-mobile); }
.vformate-related-service-card h3 { margin: 0; font-size: 20px; }
}
@media (min-width: 1200px) {
.vformate-related-services__navigation { display: flex; }
}
@media (prefers-reduced-motion: reduce) {
.vformate-service-detail *, .vformate-service-detail *::before, .vformate-service-detail *::after { scroll-behavior: auto; transition-duration: .01ms; animation-duration: .01ms; animation-iteration-count: 1; }
.vformate-service-steps li:hover, .vformate-related-service-card:hover { transform: none; }
}
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-hero { order: var(--vf-service-order-hero, 0); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-cta--top { order: var(--vf-service-order-cta, 1); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-tabs { order: var(--vf-service-order-tabs, 1); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-section--description { order: var(--vf-service-order-description, 2); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-section--benefits { order: var(--vf-service-order-benefits, 3); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-section--steps { order: var(--vf-service-order-steps, 4); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-section--projects { order: var(--vf-service-order-projects, 5); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-section--work-photos { order: var(--vf-service-order-work-photos, 6); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-section--faq { order: var(--vf-service-order-faq, 7); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-service-manager { order: var(--vf-service-order-manager, 8); }
.vformate-service-detail:not(.vformate-project-detail) > .vformate-related-services { order: var(--vf-service-order-related, 9); }
.vformate-project-detail > .vformate-service-hero { order: var(--vf-portfolio-order-hero, 0); }
.vformate-project-detail > .vformate-service-cta--top { order: var(--vf-portfolio-order-cta, 1); }
.vformate-project-detail > .vformate-project-data { order: var(--vf-portfolio-order-project-data, 2); }
.vformate-project-detail > .vformate-project-overview { order: var(--vf-portfolio-order-overview, 3); }
.vformate-project-detail > .vformate-project-features { order: var(--vf-portfolio-order-features, 4); }
.vformate-project-detail > .vformate-project-videos { order: var(--vf-portfolio-order-videos, 5); }
.vformate-project-detail > .vformate-project-steps { order: var(--vf-portfolio-order-steps, 6); }
.vformate-project-detail > .vformate-project-result { order: var(--vf-portfolio-order-result, 7); }
.vformate-project-detail > .vformate-project-gallery { order: var(--vf-portfolio-order-gallery, 8); }
.vformate-project-detail > .vformate-service-manager { order: var(--vf-portfolio-order-manager, 9); }
.vformate-project-detail > .vformate-related-projects { order: var(--vf-portfolio-order-related, 10); }
.vformate-project-detail > .vformate-project-navigation { order: var(--vf-portfolio-order-navigation, 11); }