/* Shared service modules. Homepage supplies type, header, buttons and footer. */
.service-page { --service-muted: #b7b2bd; --service-emphasis: #cbb6f0; background: #101013; }
.service-page.is-scrolled .header { background: #101013eb; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.service-page h1, .service-page h2, .service-page h3 { font-family: var(--body); font-weight: 400; letter-spacing: -.012em; }
.service-page h2 { font-size: clamp(34px, 4.2vw, 60px); line-height: 1.12; }
.service-page h2 span { color: #a59bab; }
.service-page h3 { font-size: 25px; line-height: 1.25; }
.service-page figure { margin: 0; }
.service-page .section-label { margin-bottom: 58px; }
.service-page .section-label > span:last-child { color: #aaa2b2; }
.service-page .reveal { opacity: 1; transform: none; }
.service-page.has-reveals .reveal { opacity: 0; transform: translateY(24px); }
.service-page.has-reveals .reveal.is-visible { opacity: 1; transform: none; }
.service-hero { padding: 0 0 64px; }
.service-hero-visual { margin-top: -88px !important; }
.service-image-frame { height: clamp(360px, 44vw, 670px); overflow: hidden; background: #17131d; }
.service-image-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 44%; }
.hosting-page .service-image-frame img { object-position: 50% 68%; }
.service-page figcaption { margin-top: 13px; font-size: 10px; line-height: 1.6; color: #a49bac; }
.service-hero-copy { padding-top: 48px; }
.service-hero .eyebrow { color: #c5bdcf; font-size: 10px; }
.service-hero h1 { max-width: 1100px; font-size: clamp(48px, 6.5vw, 94px); line-height: 1.04; margin-top: 26px; }
.service-hero h1 span { color: var(--service-emphasis); }
.service-lede { max-width: 1020px; margin-top: 36px; font-size: clamp(19px, 2vw, 28px); line-height: 1.5; color: var(--service-muted); }
.service-actions { display: flex; flex-wrap: wrap; gap: 18px 32px; align-items: center; margin-top: 36px; }
.service-actions .text-link { margin-top: 0; font-size: 12px; gap: 16px; }
.service-actions .button { gap: 28px; font-size: 13px; padding: 15px 21px; }
.service-section { padding-block: 120px; }
.service-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 60px; }
.service-section-heading > p { font-size: 16px; line-height: 1.8; color: var(--service-muted); max-width: 350px; }
.service-light { background: #f3f3f1; color: #221f20; --service-muted: #625b69; }
.service-page .service-light h2 span { color: #78707e; }
.service-page .service-light .section-label > span:last-child { color: #706878; }
.service-light a:hover { color: #5d00c5; }
.service-light figcaption { color: #706878; }
.service-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 64px; }
.service-value-image { width: 100%; aspect-ratio: 1; height: auto; object-fit: cover; border-radius: 8px; margin-bottom: 28px; }
.service-value-label { display: block; font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: #c6a2ed; margin-bottom: 14px; }
.service-benefits p { font-size: 15px; line-height: 1.75; color: var(--service-muted); margin-top: 17px; max-width: 345px; }
.service-imagery-note { margin-top: 30px; font-size: 10px; color: #a49bac; }
.service-values { border-block: 1px solid #ffffff12; }
.service-split { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; align-items: start; }
.service-prose > p { max-width: 440px; margin-top: 26px; font-size: 16px; line-height: 1.75; color: var(--service-muted); }
.service-prose .service-note { font-size: 12px; line-height: 1.8; }
.service-prose .text-link { font-size: 13px; gap: 26px; }
.service-story-section { position: relative; isolation: isolate; overflow: clip; background: #111014; }
.service-story-ambient { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.service-story-ambient::before, .service-story-ambient::after { content: ""; position: absolute; width: 72%; height: 62%; border-radius: 50%; filter: blur(92px); opacity: .9; will-change: transform; }
.service-story-ambient::before { top: 2%; right: -28%; background: radial-gradient(ellipse, #721fd5a8 0%, #9e64d954 40%, transparent 72%); animation: storyLightDrift 22s ease-in-out infinite alternate; }
.service-story-ambient::after { bottom: -8%; left: -26%; background: radial-gradient(ellipse, #4d00a88f 0%, #bf78b346 42%, transparent 72%); animation: storyLightDrift 28s ease-in-out -9s infinite alternate-reverse; }
@keyframes storyLightDrift { from { transform: translate(-5%, 3%) scale(.96); } to { transform: translate(14%, -10%) scale(1.13); } }
.service-story-section .service-split { grid-template-columns: 1fr .84fr; gap: clamp(80px, 16vw, 230px); }
.service-story-section .service-prose { position: sticky; top: 130px; }
.service-inclusions { display: grid; gap: 26px; }
.service-inclusions article { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; min-height: 270px; padding: 32px; border: 1px solid #ffffff1c; border-radius: 10px; background: linear-gradient(145deg, #111015d4, #09080cad); box-shadow: inset 0 1px 0 #ffffff0f, 0 24px 70px #05030852; backdrop-filter: blur(28px) saturate(1.15); -webkit-backdrop-filter: blur(28px) saturate(1.15); }
.service-inclusions article::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(120deg, #ffffff09, transparent 38%, #8f54c80a); }
.service-item-number { color: #c6a2ed; font-size: 11px; line-height: 2.5; }
.service-inclusions .service-item-number { text-transform: uppercase; letter-spacing: .05em; margin-bottom: 54px; }
.service-inclusions p { margin-top: 12px; max-width: 420px; font-size: 15px; line-height: 1.75; color: var(--service-muted); }
.service-process { position: relative; isolation: isolate; overflow: hidden; background: #17121e; }
.service-ambient { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; }
.service-ambient::before, .service-ambient::after { content: ""; position: absolute; width: 80%; height: 110%; filter: blur(60px); border-radius: 50%; }
.service-ambient::before { bottom: -65%; left: -30%; background: radial-gradient(ellipse, #6f2cbb8c, #d28bab30 40%, transparent 68%); animation: serviceLightDrift 21s ease-in-out infinite alternate; }
.service-ambient::after { top: -65%; right: -30%; background: radial-gradient(ellipse, #5d00c55e, #8e9cc72b 42%, transparent 68%); animation: serviceLightDrift 27s ease-in-out -10s infinite alternate-reverse; }
@keyframes serviceLightDrift { from { transform: translate(-6%, 5%) scale(.95); } to { transform: translate(16%, -16%) scale(1.18); } }
.service-prose .service-process-note { display: flex; align-items: center; gap: 10px; font-size: 11px; color: #c9b5df; margin-top: 34px; }
.service-accordion details { border-bottom: 1px solid #ffffff26; }
.service-accordion details:first-child { border-top: 1px solid #ffffff26; }
.service-accordion summary { list-style: none; display: flex; align-items: center; gap: 20px; padding: 24px 0; cursor: pointer; font-size: 23px; line-height: 1.3; }
.service-accordion summary::-webkit-details-marker { display: none; }
.service-page .service-accordion summary span { color: inherit; transform: none; }
.service-accordion summary:hover, .service-accordion details[open] summary { color: #dcc3fc; }
.service-accordion summary .service-item-number { flex: 0 0 26px; color: #b994e5; }
.service-toggle { position: relative; width: 16px; height: 16px; margin-left: auto; flex: 0 0 16px; color: #c0a5dc; }
.service-toggle::before, .service-toggle::after { content: ""; position: absolute; background: currentColor; top: 7px; left: 1px; width: 14px; height: 1px; }
.service-toggle::after { transform: rotate(90deg); transition: transform .2s; }
details[open] > summary .service-toggle::after { transform: rotate(0deg); }
.service-answer { padding-bottom: 26px; }
.service-answer p { font-size: 15px; line-height: 1.75; color: var(--service-muted); max-width: 460px; }
.service-process-steps .service-answer { padding-left: 46px; }
.service-answer a { text-decoration: underline; text-underline-offset: 3px; color: #ddc6fa; }
.service-split-media { align-items: center; }
.service-support-image > img { width: 100%; height: auto; aspect-ratio: 1.05; object-fit: cover; border-radius: 5px; }
.service-checklist { list-style: none; padding: 0; margin: 28px 0; display: grid; gap: 14px; }
.service-checklist li { position: relative; padding-left: 26px; font-size: 15px; line-height: 1.6; }
.service-checklist li::before { content: "✓"; position: absolute; left: 0; color: #c6a2ed; }
.service-faqs summary { font-size: 17px; padding-block: 24px; }
.service-related { display: flex; gap: 40px; align-items: center; padding-top: 74px; font-size: 13px; }
.service-related p { color: var(--service-muted); font-size: 13px; margin-right: auto; }
.service-related a { display: inline-flex; gap: 24px; padding-block: 12px; }
.service-page .closing h2 { font-size: clamp(44px, 7vw, 96px); }
@media (max-width: 1100px) {
  .service-split, .service-story-section .service-split { gap: 54px; }
  .service-benefits { gap: 22px; }
  .service-benefits h3 { font-size: 23px; }
  .service-related { gap: 24px; }
}
@media (max-width: 800px) {
  .service-hero { padding-bottom: 42px; }
  .service-image-frame { height: 420px; }
  .service-hero-copy { padding-top: 34px; }
  .service-hero h1 { font-size: clamp(44px, 7.7vw, 65px); }
  .service-lede { font-size: 21px; margin-top: 26px; }
  .service-section { padding-block: 70px 78px; }
  .service-page .section-label { margin-bottom: 38px; font-size: 10px; }
  .service-page .section-label > span:last-child { display: none; }
  .service-section-heading { display: block; }
  .service-section-heading > p { margin-top: 26px; font-size: 15px; }
  .service-split, .service-story-section .service-split { grid-template-columns: 1fr; gap: 40px; }
  .service-story-section .service-prose { position: static; }
  .service-inclusions { grid-template-columns: 1fr 1fr; gap: 18px; }
  .service-inclusions article { padding: 26px; min-height: 280px; }
  .service-inclusions .service-item-number { margin-bottom: 30px; }
  .service-benefits { gap: 18px; margin-top: 40px; }
  .service-benefits h3 { font-size: 21px; }
  .service-benefits p { font-size: 14px; }
  .service-value-label { font-size: 9px; }
  .service-prose > p { max-width: 580px; font-size: 15px; }
  .service-prose .service-note { font-size: 12px; }
  .service-prose .service-process-note { font-size: 11px; }
  .service-inclusions p, .service-answer p { max-width: 580px; }
  .service-support-image > img { aspect-ratio: 1.4; }
  .service-related { flex-wrap: wrap; padding-top: 46px; gap: 4px 26px; }
  .service-related p { width: 100%; margin-bottom: 8px; }
}
@media (max-width: 540px) {
  .service-image-frame { height: 360px; }
  .service-image-frame img { object-position: 46% center; }
  .service-hero .eyebrow { font-size: 8px; letter-spacing: .04em; }
  .service-hero h1 { font-size: clamp(38px, 10vw, 54px); margin-top: 24px; }
  .service-lede { font-size: 18px; }
  .service-actions { gap: 24px; }
  .service-page h2 { font-size: clamp(31px, 8.5vw, 42px); }
  .service-page h3 { font-size: 25px; }
  .service-inclusions, .service-benefits { grid-template-columns: 1fr; }
  .service-inclusions article { min-height: 245px; }
  .service-benefits { gap: 46px; }
  .service-value-image { aspect-ratio: 1.15; margin-bottom: 22px; }
  .service-value-label { font-size: 10px; }
  .service-benefits p { font-size: 15px; }
  .service-accordion summary { font-size: 21px; gap: 12px; }
  .service-faqs summary { font-size: 16px; }
  .service-process-steps .service-answer { padding-left: 38px; }
  .service-page .closing h2 { font-size: clamp(36px, 10vw, 54px); overflow-wrap: normal; }
}
@media (prefers-reduced-motion: reduce) {
  .service-ambient::before, .service-ambient::after, .service-story-ambient::before, .service-story-ambient::after { animation: none; }
  .service-page.has-reveals .reveal { opacity: 1; transform: none; transition: none; }
}

@media (max-width: 600px) {
  .service-hero { padding-bottom: 34px; }
  .service-image-frame { height: auto; aspect-ratio: .95; }
  .service-hero-copy { padding-top: 32px; }
  .service-hero .eyebrow { font-size: 11px; line-height: 1.45; }
  .service-hero h1 { font-size: clamp(37px, 10vw, 46px); line-height: 1.08; margin-top: 20px; }
  .service-lede { margin-top: 24px; font-size: 18px; line-height: 1.55; }
  .service-actions { gap: 12px; }
  .service-actions .button, .service-actions .text-link { min-height: 48px; font-size: 14px; }
  .service-section { padding-block: 64px 70px; }
  .service-page .section-label { margin-bottom: 32px; font-size: 11px; }
  .service-page h2 { font-size: clamp(31px, 8.8vw, 38px); line-height: 1.14; }
  .service-page h3 { font-size: 24px; line-height: 1.24; }
  .service-section-heading > p,.service-prose > p,.service-benefits p,.service-inclusions p,.service-answer p,.service-checklist li { font-size: 16px; line-height: 1.68; }
  .service-benefits { gap: 38px; margin-top: 36px; }
  .service-value-label,.service-item-number { font-size: 11px; line-height: 1.45; }
  .service-value-image { aspect-ratio: 1.08; }
  .service-inclusions { gap: 14px; }
  .service-inclusions article { min-height: 0; padding: 24px 22px; }
  .service-inclusions .service-item-number { margin-bottom: 34px; }
  .service-prose .service-note,.service-prose .service-process-note { font-size: 13px; line-height: 1.65; }
  .service-accordion summary { min-height: 54px; padding-block: 18px; font-size: 19px; line-height: 1.35; }
  .service-faqs summary { font-size: 17px; }
  .service-process-steps .service-answer { padding-left: 0; }
  .service-related { display: grid; gap: 8px; padding-top: 38px; font-size: 14px; }
  .service-related p { font-size: 14px; }
  .service-related a { min-height: 44px; align-items: center; }
  .service-page figcaption,.service-imagery-note { font-size: 12px; line-height: 1.55; }
}
