/* Additive service layouts. The seven approved source stylesheets stay intact. */
.service-page {
  --sp-ink: #071d2d;
  --sp-copy: #415f73;
  --sp-paper: #ffffff;
  --sp-stage: #102a3d;
  --sp-edge: #d7e4ec;
  --sp-accent: #87cbff;
  --sp-accent-soft: #1b80b94d;
  background: var(--sp-paper);
  color: var(--sp-ink);
}
.service-page[data-service="chat"] { --sp-accent: #dab6ef; --sp-accent-soft: #a078bc3b; }
.service-page[data-service="website"] { --sp-accent: #8ae0d0; --sp-accent-soft: #208b8628; }
.service-page[data-service="booking"] { --sp-accent: #9bd6ff; --sp-accent-soft: #235d8555; }
.service-page[data-service="follow-up"] { --sp-accent: #9ae4d7; --sp-accent-soft: #25998936; }
.service-page[data-service="reputation"] { --sp-accent: #d7c4e3; --sp-accent-soft: #883c7826; }
.service-page :where(main, section, article, figure, div) { min-width: 0; }
.service-page :where(h1, h2, h3, p, li, dt, dd, a, button, summary) { overflow-wrap: break-word; }
.service-page :where(figure, blockquote, dl) { margin: 0; }
.service-page :where(ul, ol) { padding-left: 1.3em; }
.service-page :where(h1, h2, h3) { color: inherit; }
.service-page :where(p, li, dd) { font-size: 17px; line-height: 1.75; }
.service-page p { color: var(--sp-copy); }
.service-page :where(p + p, p + ul, p + ol) { margin-top: 18px; }
.service-page :where(h2 + p, h3 + p) { margin-top: 18px; }
.service-page :where(h2) { font-size: clamp(30px, 3.1vw, 44px); line-height: 1.13; letter-spacing: -.045em; }
.service-page :where(h3) { font-size: 23px; line-height: 1.25; }
.service-page .sp-container { width: min(1120px, calc(100% - 96px)); margin-inline: auto; }
.service-page .sp-breadcrumb,
.service-page .sp-breadcrumbs,
.service-page nav[aria-label="Breadcrumb"] { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 14px; color: #4c697d; padding-top: 24px; margin-bottom: 40px; }
.service-page :where(.sp-breadcrumb, .sp-breadcrumbs, nav[aria-label="Breadcrumb"]) ol { display: flex; gap: 10px; flex-wrap: wrap; padding: 0; margin: 0; list-style: none; }
.service-page :where(.sp-breadcrumb, .sp-breadcrumbs, nav[aria-label="Breadcrumb"]) a { border-bottom: 1px solid #aac1d0; padding-bottom: 3px; }
.service-page .sp-hero { padding: 0 0 70px; background: radial-gradient(ellipse at 100% 89%, #ffa04525, transparent 27%), radial-gradient(ellipse at 85% 24%, #b6e7ff50, transparent 45%), linear-gradient(115deg, #fff 12%, #f7fcff 70%, #e9f5ff); }
.service-page .sp-hero .sp-container { padding-top: 12px; }
.service-page .sp-hero h1 { max-width: 900px; margin: 20px 0 24px; font-size: clamp(42px, 4.6vw, 65px); line-height: 1.05; letter-spacing: -.055em; }
.service-page .sp-hero > .sp-container > p:not(.sp-eyebrow) { max-width: 730px; }
.service-page .sp-eyebrow { display: block; margin: 0 0 18px; font-size: 13px; line-height: 1.65; font-weight: 800; letter-spacing: .13em; color: #1262a3; }
.service-page .sp-intro { max-width: 750px; font-size: 19px; line-height: 1.75; color: var(--sp-copy); }
.service-page .sp-actions { display: flex; gap: 18px 28px; flex-wrap: wrap; align-items: center; margin-top: 28px; }
.service-page .button { background: linear-gradient(135deg, #0989ff, #0069ee); border: 1px solid #138fff; color: #fff; border-radius: 13px; box-shadow: 0 12px 30px #087cff25; font-size: 16px; min-height: 54px; padding: 15px 23px; }
.service-page .site-header .button { min-height: 46px; font-size: 14px; padding: 11px 19px; }
.service-page .button:hover { background: linear-gradient(135deg, #0475ea, #005cd5); }
.service-page .sp-text-link { display: inline-flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 2px solid #7da9c5; color: #183f5b; font-size: 16px; font-weight: 700; line-height: 1.45; }
.service-page .sp-text-link:hover { border-color: #ff8529; }
.service-page .sp-section { padding: 80px 0; }
.service-page .sp-section + .sp-section { border-top: 1px solid var(--sp-edge); }
.service-page .sp-split { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); align-items: center; gap: 60px; }
.service-page .sp-split > :where(div, article, figure) { min-width: 0; }
.service-page .sp-stage { position: relative; isolation: isolate; overflow: hidden; padding: 80px 0; color: #fff; background: radial-gradient(ellipse at 15% 65%, #1b80b94d, transparent 49%), radial-gradient(ellipse at 95% 15%, #eb973130, transparent 43%), #102a3d; border-block: 1px solid #58798b40; }
.service-page .sp-stage :where(p, li, dd) { color: #fff; }
.service-page .sp-stage .sp-eyebrow { color: var(--sp-accent); }
.service-page .sp-stage .sp-text-link { color: #fff; border-color: #8baac0; }
.service-page .sp-stage .sp-intro { color: #e2edf4; }
.service-page .sp-stage > .sp-container > :where(h2, p) { max-width: 760px; }
.service-page .sp-stage > .sp-container > p + .sp-example,
.service-page .sp-stage > .sp-container > h2 + .sp-example { margin-top: 36px; }
.service-page[data-service="chat"] .sp-stage { background: radial-gradient(ellipse at 8% 78%, #9d477450, transparent 52%), radial-gradient(ellipse at 92% 10%, #a078bc3b, transparent 50%), linear-gradient(130deg, #102a3b, #183a4c 55%, #172c40); }
.service-page[data-service="website"] .sp-stage { background: radial-gradient(ellipse at 90% 15%, #2d899836, transparent 48%), radial-gradient(ellipse at 0 95%, #5c71be28, transparent 48%), #102a3d; }
.service-page[data-service="booking"] .sp-stage { background: radial-gradient(ellipse at 85% 50%, #235d8555, transparent 50%), radial-gradient(ellipse at 5% 100%, #dd771a20, transparent 45%), #0c2437; }
.service-page[data-service="follow-up"] .sp-stage { background: radial-gradient(ellipse at 0 60%, #238f8133, transparent 52%), radial-gradient(ellipse at 100% 10%, #a854852b, transparent 47%), #102a3d; }
.service-page .sp-label { display: block; margin-bottom: 20px; font-size: 14px; font-weight: 600; line-height: 1.7; color: #d5e6f1; }
.service-page .sp-section .sp-label { color: #486779; }
.service-page .sp-example { position: relative; min-width: 0; }
.service-page .sp-example :where(h3, h4) { letter-spacing: -.025em; }
.service-page .sp-example h4 { margin: 0 0 14px; font: 800 18px/1.35 var(--display); }
.service-page :where(.sp-call-summary, .sp-chat-window, .sp-browser, .sp-calendar, .sp-feedback-card) { position: relative; overflow: hidden; padding: 30px; border: 1px solid #7597ad; border-radius: 17px; background: #fff; color: #102a39; box-shadow: 0 25px 65px #00132044; }
.service-page :is(.sp-call-summary, .sp-chat-window, .sp-browser, .sp-calendar, .sp-feedback-card) :where(p, li, dd) { color: #355469; }
.service-page :where(.sp-call-summary, .sp-chat-window, .sp-browser, .sp-calendar, .sp-feedback-card) .sp-label { color: #426376; font-size: 13px; }
.service-page .sp-call-summary { border-top: 4px solid #83caff; }
.service-page .sp-call-summary h3 { margin-bottom: 20px; color: #102a39; }
.service-page dl.sp-call-summary { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 0 20px; }
.service-page .sp-call-summary dl { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 0 20px; }
.service-page .sp-call-summary dt { padding: 15px 0; border-bottom: 1px solid #dbe6ec; font-weight: 800; font-size: 14px; color: #204762; }
.service-page .sp-call-summary dd { margin: 0; padding: 15px 0; border-bottom: 1px solid #dbe6ec; font-size: 16px; }
.service-page .sp-call-summary dl > :nth-last-child(-n+2) { border-bottom: 0; }
.service-page dl.sp-call-summary > :nth-last-child(-n+2) { border-bottom: 0; }
.service-page .sp-call-summary > dl:first-child { margin-top: 0; }
.service-page .sp-status { display: block; padding: 15px 18px; margin-top: 20px; border-left: 3px solid #507fa2; border-radius: 0 8px 8px 0; background: #edf4f8; color: #20425a; font-size: 14px; font-weight: 600; line-height: 1.65; }
.service-page .sp-stage > .sp-container > .sp-status { background: #ffffff0a; color: #fff; border-color: var(--sp-accent); }
.service-page .sp-transcript { display: grid; gap: 16px; padding: 0; list-style: none; }
.service-page .sp-transcript :where(p, li) { margin: 0; padding: 15px 18px; border-left: 2px solid #7097ae; background: #ffffff06; color: #fff; border-radius: 0 7px 7px 0; }
.service-page .sp-transcript :where(b, strong) { display: block; margin-bottom: 5px; color: #cae8ff; font-size: 14px; }
.service-page .sp-selector { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 24px; }
.service-page .sp-selector button { display: inline-flex; justify-content: space-between; align-items: center; gap: 14px; min-height: 50px; max-width: 100%; padding: 12px 17px; border: 1px solid #97b1c966; border-radius: 9px; background: #ffffff08; color: #fff; font-size: 15px; font-weight: 600; line-height: 1.5; text-align: left; }
.service-page .sp-selector button:hover { background: #ffffff14; border-color: #c5d8e8; }
.service-page .sp-selector button[aria-pressed="true"] { background: linear-gradient(125deg, #1c7169, #295c89); color: #fff; border-color: #35dfaa; box-shadow: inset 3px 0 #35dfaa, 0 0 18px #35dfaa25; }
.service-page .sp-selector button:nth-child(2)[aria-pressed="true"] { background: linear-gradient(125deg, #514399, #883d91); border-color: #b281ff; box-shadow: inset 3px 0 #b281ff, 0 0 18px #a875ff25; }
.service-page .sp-selector button:nth-child(3)[aria-pressed="true"] { background: linear-gradient(125deg, #963b74, #593d92); border-color: #ff78b5; box-shadow: inset 3px 0 #ff78b5, 0 0 18px #ff4fa325; }
.service-page :where(.sp-selection-check, .sp-choice-check) { display: inline-block; opacity: 0; font-weight: 800; flex: 0 0 auto; }
.service-page .sp-selector button[aria-pressed="true"] :where(.sp-selection-check, .sp-choice-check) { opacity: 1; }
.service-page [data-sp-panel][hidden] { display: none !important; }
.service-page [data-sp-selection-status] { font-size: 14px; min-height: 1.75em; color: #d6e7f0; }
.service-page .sp-chat-window { display: flex; flex-direction: column; gap: 15px; padding: 25px; border-color: #9b8eb2; background: #f6f8fa; max-width: 650px; margin-inline: auto; }
.service-page .sp-chat-window > :where(h3, header) { margin: 0; padding: 20px 25px; border-bottom: 1px solid #d3dfe7; background: #143246; color: #fff; font-size: 18px; }
.service-page .sp-chat-window > .sp-label { padding: 18px 25px 0; margin-bottom: 0; }
.service-page :where(.sp-chat-conversation, .sp-chat-messages) { display: flex; flex-direction: column; gap: 15px; padding: 26px; list-style: none; margin: 0; }
.service-page .sp-chat-message { width: fit-content; max-width: 88%; padding: 15px 18px; margin: 0; border-radius: 13px; font-size: 16px; line-height: 1.7; }
.service-page .sp-chat-message--visitor,
.service-page .sp-chat-conversation [data-speaker="visitor"] { align-self: flex-end; margin-left: auto; background: #e8e6f0; color: #28374f; border-bottom-right-radius: 3px; }
.service-page .sp-chat-message--assistant,
.service-page .sp-chat-conversation [data-speaker="assistant"] { align-self: flex-start; background: #183e53; color: #fff; border-bottom-left-radius: 3px; }
.service-page .sp-chat-message :where(p, b, strong, small) { color: inherit; }
.service-page .sp-chat-message :where(b, strong, small) { display: block; font-size: 13px; margin-bottom: 4px; }
.service-page .sp-chat-window .sp-status { margin: 0; border-radius: 0; border-left: 0; border-top: 1px solid #d5e2e9; padding: 18px 25px; }
.service-page .sp-browser { padding: 0; border-color: #9fb9c7; }
.service-page .sp-website-views { grid-template-columns: minmax(0, 1.45fr) minmax(0, .7fr); gap: 30px; align-items: start; margin-top: 35px; }
.service-page .sp-browser--phone { max-width: 350px; margin-inline: auto; border: 5px solid #476b60; border-radius: 25px; }
.service-page .sp-browser--phone .sp-website-preview { padding: 26px 20px; }
.service-page .sp-browser--phone .sp-website-preview h3 { font-size: 31px; }
.service-page .sp-browser--phone .sp-sample-contact { padding: 18px; }
.service-page .sp-browser--phone .sp-browser-bar { font-size: 12px; }
.service-page :where(.sp-browser-bar, .sp-browser-chrome) { display: flex; align-items: center; gap: 7px; min-height: 50px; padding: 12px 22px; border-bottom: 1px solid #d4e2e8; background: #edf3f7; color: #31566d; font-size: 13px; font-weight: 600; }
.service-page :where(.sp-browser-bar, .sp-browser-chrome) > :where(i, span.sp-browser-dot) { height: 8px; width: 8px; border: 1px solid #9eb5c1; border-radius: 50%; display: inline-block; }
.service-page .sp-website-preview { background: linear-gradient(140deg, #f5faf6, #edf7f2); padding: 36px; }
.service-page .sp-website-preview h3 { color: #183e35; max-width: 440px; font-size: clamp(28px, 3vw, 39px); line-height: 1.13; }
.service-page .sp-website-preview > p { color: #345d51; }
.service-page :where(.sp-sample-services, .sp-sample-contact) { padding: 0; margin: 25px 0 0; list-style: none; }
.service-page .sp-sample-services { display: flex; flex-wrap: wrap; gap: 8px; }
.service-page .sp-sample-services > * { margin: 0; border: 1px solid #b0c9bb; padding: 8px 11px; background: #fff9; border-radius: 5px; color: #234b3a; font-size: 14px; }
.service-page .sp-sample-contact { padding: 24px; border-top: 3px solid #497e66; background: #fff; border-radius: 7px; box-shadow: 0 7px 20px #3253400d; }
.service-page .sp-sample-contact h4 { color: #244e3b; }
.service-page .sp-sample-contact :where(dt, dd, li) { font-size: 15px; color: #365848; }
.service-page .sp-sample-contact dt { font-weight: 700; }
.service-page .sp-sample-contact dd { margin: 2px 0 14px; }
.service-page .sp-browser figcaption,
.service-page .sp-website-preview + figcaption { padding: 18px 24px; border-top: 1px solid #d7e4dc; background: #f9fcfa; color: #416153; font-size: 14px; line-height: 1.65; }
.service-page .sp-sample-eyebrow { font-size: 12px; letter-spacing: .1em; font-weight: 800; line-height: 1.6; margin-bottom: 18px; color: #456b57; }
.service-page :where(.sp-example-note, .sp-example-caption) { font-size: 14px; line-height: 1.7; margin-bottom: 20px; }
.service-page .sp-example-note { margin-top: 18px; }
.service-page .sp-stage :where(.sp-example-note, .sp-example-caption) { color: #e0edf5; }
.service-page :is(.sp-call-summary, .sp-calendar, .sp-feedback-card, .sp-browser, .sp-chat-window) :is(.sp-example-note, .sp-example-caption) { color: #476174; font-size: 13px; line-height: 1.7; }
.service-page :where(.sp-scope-list, .sp-setup-list) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 25px 30px; margin-top: 32px; }
.service-page :where(.sp-scope-list, .sp-setup-list) > div { border-top: 2px solid #7a9fb5; padding-top: 19px; }
.service-page :where(.sp-scope-list, .sp-setup-list) dt { font: 800 18px/1.4 var(--display); color: #173e57; }
.service-page :where(.sp-scope-list, .sp-setup-list) dd { margin: 10px 0 0; color: #415f73; font-size: 16px; }
.service-page .sp-sample-heading { font-size: 20px; margin-bottom: 18px; }
.service-page .sp-selector-label { font-size: 15px; margin-bottom: 14px; font-weight: 700; }
.service-page .sp-sample-panel > h3 { margin-bottom: 22px; font-size: 22px; }
.service-page .sp-status-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; margin-top: 32px; }
.service-page .sp-status-comparison > article { padding: 24px 0 0; border-top: 2px solid #6e9dbc; }
.service-page .sp-status-comparison > article:last-child { border-color: #7299a5; }
.service-page .sp-calendar { background: #fff; border-color: #4c7896; }
.service-page .sp-calendar h3 { color: #103f5c; margin-bottom: 14px; }
.service-page .sp-calendar :where(dl) { margin-top: 24px; }
.service-page .sp-calendar dt { color: #476b82; font-size: 14px; font-weight: 700; margin-top: 15px; }
.service-page .sp-calendar dd { margin: 4px 0 0; font-size: 16px; color: #193f59; }
.service-page .sp-calendar-slots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0; margin: 22px 0; list-style: none; }
.service-page .sp-calendar-slot { display: block; padding: 14px; border-radius: 7px; background: #edf5fa; border: 1px solid #bad1df; color: #254f6d; font-size: 15px; line-height: 1.6; }
.service-page .sp-calendar-slot :where(b, strong, small, span) { display: block; }
.service-page .sp-calendar-slot :where(small, span) { font-size: 13px; color: #4c6c81; }
.service-page .sp-calendar-slot.is-selected,
.service-page .sp-calendar-slot[data-selected="true"] { border-color: #3b80ac; box-shadow: inset 3px 0 #3b80ac; background: #e4f2fb; }
.service-page .sp-calendar-slot.is-unavailable { background: #f5f6f7; color: #5e7280; border-style: dashed; }
.service-page .sp-timeline { list-style: none; padding: 0; margin: 24px 0 0; display: grid; gap: 0; counter-reset: sp-step; }
.service-page .sp-timeline-step { position: relative; padding: 0 0 26px 48px; border-left: 1px solid #81b2b980; margin-left: 14px; min-height: 100px; counter-increment: sp-step; }
.service-page .sp-timeline-step:last-child { border-left-color: transparent; padding-bottom: 0; }
.service-page .sp-timeline-step::before { content: counter(sp-step, decimal-leading-zero); display: grid; place-items: center; position: absolute; left: -16px; top: 0; width: 31px; height: 31px; border: 1px solid #8ed0c6; border-radius: 50%; color: #baf3e8; background: #123d47; font-size: 12px; font-weight: 700; }
.service-page .sp-timeline-step > :where(h3, h4, strong, b) { display: block; color: #fff; font-size: 18px; line-height: 1.4; margin-bottom: 10px; }
.service-page .sp-timeline-step p { color: #e6f1f4; font-size: 16px; }
.service-page .sp-timeline-step blockquote,
.service-page .sp-sample-message { padding: 16px 20px; margin: 16px 0; border: 1px solid #84b1bb66; border-radius: 9px; background: #f4faf8; color: #234b48; font-size: 16px; line-height: 1.7; }
.service-page .sp-timeline-step blockquote p { color: #234b48; }
.service-page .sp-timeline-stop { padding: 22px 24px; border: 1px solid #ac80a766; border-left: 3px solid #d194c5; border-radius: 9px; background: #ffffff08; color: #fff; }
.service-page .sp-timeline-stop p { font-size: 16px; }
.service-page .sp-section .sp-timeline-step { border-color: #bfd8d8; }
.service-page .sp-section .sp-timeline-step::before { color: #225f53; background: #eef7f4; border-color: #84b5a9; }
.service-page .sp-section .sp-timeline-step :where(h3, h4, p, b, strong) { color: #254b58; }

/* Ember Sculpted Glow: full V2 stage, broad contours, local art light and two orbits. */
.service-page .sp-stage.sp-sculpted { background: radial-gradient(ellipse at 15% 60%, #aa66252b, transparent 45%), radial-gradient(ellipse at 100% 0, #883c7826, transparent 55%), #102b3b; }
.service-page .sp-sculpted::before,
.service-page .sp-sculpted::after { content: ''; position: absolute; pointer-events: none; z-index: -1; border-radius: 50%; border: 1px solid #e8b15c44; }
.service-page .sp-sculpted::before { width: 900px; height: 440px; left: -370px; bottom: -260px; transform: rotate(-18deg); background: radial-gradient(ellipse, #ddaf2917, transparent 67%); box-shadow: 0 0 65px #ddaf2917; }
.service-page .sp-sculpted::after { width: 1000px; height: 620px; right: -550px; top: -190px; transform: rotate(-22deg); border-color: #deb05d25; }
.service-page .sp-feedback-art { position: relative; isolation: isolate; width: 100%; max-width: 500px; margin-inline: auto; padding: 40px 18px; }
.service-page .sp-feedback-art::before { content: ''; position: absolute; pointer-events: none; z-index: 0; inset: 12% 0 15%; border-radius: 50%; background: radial-gradient(ellipse, #d4932e24, transparent 67%); }
.service-page .sp-feedback-art :where(.sp-orbit-one, .sp-orbit-two) { position: absolute; pointer-events: none; z-index: 0; width: 78%; aspect-ratio: 1; left: 11%; top: 7%; border-radius: 50%; border: 1px solid #e8b15c44; box-shadow: 0 0 45px #ddaf2917; }
.service-page .sp-feedback-art .sp-orbit-two { width: 96%; left: 2%; top: -2%; border-color: #deb05d25; box-shadow: 0 0 45px #ddaf2917; }
.service-page .sp-sculpted > :where(.sp-orbit-one, .sp-orbit-two) { position: absolute; pointer-events: none; z-index: -1; width: 420px; aspect-ratio: 1; right: 10%; top: 14%; border-radius: 50%; border: 1px solid #e8b15c44; box-shadow: 0 0 45px #ddaf2917; }
.service-page .sp-sculpted > .sp-orbit-two { width: 540px; right: 5%; top: 4%; border-color: #deb05d25; box-shadow: none; }
.service-page .sp-feedback-card { position: relative; z-index: 1; padding: 30px; border: 5px solid #365263; border-radius: 27px; background: #fff; box-shadow: 0 24px 65px #0013204d; }
.service-page .sp-feedback-card h3 { color: #2a3d50; margin-bottom: 20px; font-size: 21px; }
.service-page .sp-feedback-message { padding: 22px; margin: 0; background: #f1f4f8; border: 1px solid #d6e0e8; border-radius: 12px 12px 12px 3px; font-size: 17px; line-height: 1.75; color: #354e64; }
.service-page .sp-feedback-message p { color: #354e64; }
.service-page .sp-destination { display: block; padding: 15px 18px; margin-top: 20px; border: 1px dashed #98afc1; border-radius: 8px; background: #f7fafc; color: #30506a; font-size: 15px; line-height: 1.6; text-align: center; }
.service-page .sp-feedback-card .sp-status { border-color: #8c77a1; background: #f1edf5; color: #433953; }

.service-page .sp-process { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 30px 0 0; padding: 0; counter-reset: sp-process; }
.service-page .sp-process > li { padding: 22px 0 0; border-top: 2px solid #6a99b1; counter-increment: sp-process; }
.service-page .sp-process > li::before { content: counter(sp-process, decimal-leading-zero); display: block; color: #7192a9; font-size: 13px; font-weight: 800; letter-spacing: .1em; margin-bottom: 12px; }
.service-page .sp-process > li :where(b, strong) { display: block; color: inherit; font-size: 18px; line-height: 1.4; margin-bottom: 10px; }
.service-page .sp-process > li p { font-size: 16px; }
.service-page .sp-stage .sp-process > li { border-color: #91bacd; }
.service-page .sp-stage .sp-process > li::before { color: var(--sp-accent); }
.service-page :where(.sp-checklist, .sp-readiness) { list-style: none; padding: 0; margin: 26px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 25px; }
.service-page :where(.sp-checklist, .sp-readiness) > li { padding: 16px 0; border-top: 1px solid #c9dce6; color: #35576c; font-size: 16px; }
.service-page :where(.sp-checklist, .sp-readiness) > li :where(b, strong) { display: block; color: #153e59; font-size: 17px; margin-bottom: 5px; }
.service-page .sp-faq { background: #f7fafc; padding: 75px 0; }
.service-page .sp-faq > .sp-container > h2 { margin-bottom: 30px; }
.service-page .sp-faq details { border-bottom: 1px solid #bfced9; }
.service-page .sp-faq details:first-of-type { border-top: 1px solid #bfced9; }
.service-page .sp-faq summary { list-style: none; display: flex; justify-content: space-between; gap: 24px; padding: 24px 0; cursor: pointer; color: #193f59; font-size: 18px; line-height: 1.55; font-weight: 700; }
.service-page .sp-faq summary::-webkit-details-marker { display: none; }
.service-page .sp-faq summary::after { content: '+'; flex: 0 0 auto; font-size: 24px; font-weight: 400; line-height: 1.2; color: #28668d; }
.service-page .sp-faq details[open] summary::after { content: '−'; }
.service-page .sp-faq details > p { padding: 0 42px 24px 0; max-width: 900px; }
.service-page .sp-faq p a { border-bottom: 1px solid #88a9c0; color: #1268a5; }
.service-page .sp-related { padding: 55px 0; border-top: 1px solid #d7e4ec; }
.service-page .sp-related h2 { font-size: 29px; }
.service-page .sp-related :where(ul, ol) { display: flex; gap: 12px 30px; flex-wrap: wrap; margin: 24px 0 0; padding: 0; list-style: none; }
.service-page .sp-related a { display: inline-block; padding: 8px 0; color: #245a7d; border-bottom: 1px solid #9ebdcd; font-size: 16px; font-weight: 700; }
.service-page .sp-related a:hover { border-color: #ff8529; }
.service-page .sp-close { position: relative; isolation: isolate; overflow: hidden; padding: 70px 0; color: #fff; background: radial-gradient(ellipse at 100% 5%, #285e893d, transparent 48%), #102a3d; }
.service-page .sp-close :where(h2, p) { max-width: 750px; }
.service-page .sp-close p { color: #d9e8f2; }
.service-page .sp-close .sp-text-link { color: #fff; }
.service-page .sp-close .sp-eyebrow { color: #a5d9ff; }
.service-page[data-service="website"] .sp-close { background: #071d2d; min-height: 410px; display: flex; align-items: center; }
.service-page[data-service="website"] .sp-close::before { content: ''; position: absolute; inset: 0; z-index: -2; background: url('/sunset-vehicle-new-logo.png') center right / cover no-repeat; }
.service-page[data-service="website"] .sp-close::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #061b2ccc 0%, #061b2cb3 38%, #061b2c1a 85%); }
.service-page[data-service="website"] .sp-close :where(h2, p) { max-width: 690px; }

/* Native Guided Reveal: full strip control, optional depth, no booking side effects. */
.service-page .sp-reveal { margin-top: 30px; border: 1px solid #7292a84a; border-radius: 13px; background: #102a3d; overflow: hidden; }
.service-page .sp-reveal > summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; list-style: none; cursor: pointer; padding: 24px 26px; color: #fff; min-height: 95px; }
.service-page .sp-reveal > summary::-webkit-details-marker { display: none; }
.service-page .sp-reveal-label { color: #fff; font-family: var(--display); font-size: 20px; font-weight: 800; letter-spacing: -.03em; line-height: 1.35; }
.service-page .sp-arrow { width: 95px; height: 48px; color: #ff8529; flex: 0 0 auto; overflow: visible; }
.service-page .sp-arrow :where(path, polyline) { stroke: currentColor; }
.service-page .sp-reveal-control { display: flex; align-items: center; gap: 16px; flex: 0 0 auto; color: #fff; font-size: 15px; font-weight: 700; }
.service-page .sp-plus { display: grid; place-items: center; flex: 0 0 auto; width: 48px; height: 48px; border: 1px solid #ffaf68; border-radius: 50%; background: linear-gradient(145deg, #ff8b2c, #ff650b); color: #fff; font-size: 32px; font-weight: 400; line-height: 1; box-shadow: 0 0 18px #ff852952, 0 8px 24px #ff650b33; transition: transform .24s ease, box-shadow .24s ease; }
.service-page .sp-reveal > summary:hover .sp-plus { box-shadow: 0 0 25px #ff852975, 0 8px 26px #ff650b47; }
.service-page .sp-close-label { display: none; }
.service-page .sp-reveal[open] .sp-open-label { display: none; }
.service-page .sp-reveal[open] .sp-close-label { display: inline; }
.service-page .sp-reveal[open] .sp-plus { transform: rotate(45deg); }
.service-page .sp-reveal > :not(summary) { margin: 0; padding: 0 26px 26px; color: #fff; }
.service-page .sp-reveal > :not(summary) p { color: #fff; }
.service-page .sp-reveal :where(p, li, dt, dd, h3, b, strong) { color: #fff; }
.service-page .sp-reveal .sp-label { color: #d5e6f1; }
.service-page .sp-reveal > :where(p, ul, ol) { font-size: 16px; line-height: 1.75; }
.service-page .sp-reveal > :where(ul, ol) { padding-left: 47px; }
.service-page .sp-reveal :where(p + p, li + li) { margin-top: 12px; }
.service-page :where(a, button, summary):focus-visible { outline: 3px solid #ff9f52; outline-offset: 5px; }
.service-page .sp-reveal > summary:focus-visible { outline-offset: -5px; border-radius: 13px; }

/* Small navigation additions on Home/FAQ; no existing stage or action reset. */
.service-detail-link { display: inline-block; margin-top: 20px; padding: 7px 0; color: inherit; font-size: 15px; font-weight: 700; line-height: 1.55; border-bottom: 1px solid #6b91aa; }
.service-detail-link:hover { border-color: #ff8529; }
.service-directory,
.seo-service-links { margin-top: 24px; padding-top: 20px; border-top: 1px solid #98b4c155; }
.service-directory > :where(b, h3, p),
.seo-service-links > :where(b, h3, p) { display: block; margin: 0 0 12px; color: inherit; font-size: 14px; line-height: 1.6; font-weight: 700; }
.service-directory :where(ul, ol),
.seo-service-links :where(ul, ol) { display: flex; flex-wrap: wrap; gap: 8px 20px; list-style: none; padding: 0; margin: 0; }
.service-directory a,
.seo-service-links a { display: inline-block; padding: 5px 0; border-bottom: 1px solid #779aaf; color: inherit; font-size: 14px; font-weight: 600; line-height: 1.6; }
.service-directory a:hover,
.seo-service-links a:hover { border-color: #ff8529; }
.homepage-footer .footer-columns.footer-with-services { grid-template-columns: 1.5fr .75fr .9fr .9fr .75fr; gap: 30px; }
.homepage-footer .footer-services a { font-size: 14px; line-height: 1.6; }
.faq-page h1 { font-size: clamp(38px, 5vw, 58px); line-height: 1.08; max-width: 12ch; }
.faq-page .faq-context a { color: #addef4; border-bottom: 1px solid #79b0c7; }
.faq-page .faq-close { padding: 55px 0; background: #f5fafc; border-top: 1px solid #d6e3eb; color: #102a39; }
.faq-page .faq-close h2 { font-size: clamp(30px, 3vw, 42px); max-width: 780px; }
.faq-page .faq-close p { margin-top: 18px; max-width: 720px; color: #415f73; font-size: 17px; line-height: 1.75; }
.faq-page .faq-close .button { background: linear-gradient(135deg, #0989ff, #0069ee); border: 1px solid #138fff; color: #fff; border-radius: 13px; min-height: 54px; }
.faq-page .faq-close .sp-actions { display: flex; flex-wrap: wrap; gap: 18px 25px; align-items: center; margin-top: 25px; }

@media (max-width: 1100px) {
  .service-page .sp-split { gap: 36px; }
  .homepage-footer .footer-columns.footer-with-services { grid-template-columns: 1.4fr 1fr 1fr; gap: 30px 35px; }
  .service-page .sp-reveal > summary { gap: 14px; }
  .service-page .sp-arrow { width: 68px; }
}
@media (max-width: 850px) {
  .service-page .sp-split { grid-template-columns: 1fr; gap: 36px; }
  .service-page .sp-split > .sp-example,
  .service-page .sp-split > figure { max-width: 680px; width: 100%; margin-inline: auto; }
  .service-page .sp-container { width: calc(100% - 64px); }
  .service-page .sp-stage,
  .service-page .sp-section { padding: 65px 0; }
  .service-page .sp-process { gap: 22px; }
  .service-page :where(.sp-scope-list, .sp-setup-list) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-page .sp-reveal-label { font-size: 19px; }
  .service-page .sp-reveal > summary { padding: 22px; }
}
@media (max-width: 650px) {
  .service-page .sp-container { width: calc(100% - 40px); }
  .service-page .sp-hero { padding-bottom: 48px; }
  .service-page :where(.sp-breadcrumb, .sp-breadcrumbs, nav[aria-label="Breadcrumb"]) { padding-top: 18px; margin-bottom: 26px; font-size: 13px; }
  .service-page .sp-hero h1 { font-size: clamp(37px, 9vw, 47px); line-height: 1.08; margin: 18px 0 22px; }
  .service-page .sp-intro { font-size: 17px; }
  .service-page .sp-eyebrow { font-size: 12px; letter-spacing: .12em; }
  .service-page :where(p, li, dd) { font-size: 16px; line-height: 1.75; }
  .service-page .sp-actions { gap: 15px 24px; }
  .service-page .sp-text-link { font-size: 15px; }
  .service-page .sp-stage,
  .service-page .sp-section,
  .service-page .sp-faq { padding: 52px 0; }
  .service-page .sp-close { padding: 55px 0; }
  .service-page .sp-split { gap: 30px; }
  .service-page .sp-label { font-size: 13px; margin-bottom: 16px; }
  .service-page :where(.sp-call-summary, .sp-calendar) { padding: 22px; border-radius: 12px; }
  .service-page .sp-call-summary dl,
  .service-page dl.sp-call-summary { display: block; }
  .service-page .sp-call-summary dt { border-bottom: 0; padding: 14px 0 3px; }
  .service-page .sp-call-summary dd { padding: 0 0 14px; font-size: 16px; }
  .service-page .sp-call-summary dl > dt:nth-last-child(2) { border-top: 1px solid #dbe6ec; }
  .service-page .sp-selector { gap: 9px; }
  .service-page .sp-selector button { flex: 1 1 145px; padding: 12px 13px; min-height: 52px; font-size: 14px; }
  .service-page :where(.sp-chat-conversation, .sp-chat-messages) { padding: 20px; gap: 13px; }
  .service-page .sp-chat-window { padding: 20px; }
  .service-page .sp-chat-message { max-width: 94%; padding: 13px 15px; font-size: 15px; }
  .service-page .sp-chat-window > :where(h3, header) { padding: 18px 20px; }
  .service-page .sp-chat-window .sp-status { padding: 17px 20px; font-size: 13px; }
  .service-page .sp-website-preview { padding: 26px 21px; }
  .service-page .sp-website-preview h3 { font-size: 31px; }
  .service-page :where(.sp-browser-bar, .sp-browser-chrome) { padding: 12px 18px; }
  .service-page .sp-sample-contact { padding: 20px; }
  .service-page .sp-calendar-slots { grid-template-columns: 1fr; }
  .service-page .sp-calendar-slot { padding: 13px 15px; }
  .service-page .sp-process { grid-template-columns: 1fr; gap: 23px; }
  .service-page :where(.sp-scope-list, .sp-setup-list, .sp-status-comparison) { grid-template-columns: 1fr; gap: 22px; }
  .service-page .sp-website-views { grid-template-columns: 1fr; }
  .service-page .sp-process > li { padding-top: 17px; }
  .service-page :where(.sp-checklist, .sp-readiness) { grid-template-columns: 1fr; }
  .service-page .sp-timeline-step { padding-left: 35px; padding-bottom: 22px; }
  .service-page .sp-timeline-step blockquote { padding: 15px; }
  .service-page .sp-timeline-stop { padding: 20px; }
  .service-page .sp-feedback-art { padding: 35px 6px; }
  .service-page .sp-feedback-card { position: relative; z-index: 1; padding: 23px 20px; border-width: 4px; border-radius: 24px; }
  .service-page .sp-feedback-message { padding: 18px; font-size: 16px; }
  .service-page .sp-feedback-art .sp-orbit-one { top: 6%; }
  .service-page .sp-feedback-art .sp-orbit-two { top: -3%; }
  .service-page .sp-sculpted::before { left: -550px; bottom: -180px; }
  .service-page .sp-sculpted > .sp-orbit-one { right: -40px; }
  .service-page .sp-sculpted > .sp-orbit-two { right: -100px; }
  .service-page .sp-reveal > summary { flex-wrap: wrap; padding: 20px; gap: 14px 12px; }
  .service-page .sp-reveal-label { width: 100%; font-size: 19px; }
  .service-page .sp-arrow { width: 85px; height: 38px; margin-left: auto; }
  .service-page .sp-reveal-control { font-size: 14px; gap: 14px; }
  .service-page .sp-plus { width: 44px; height: 44px; }
  .service-page .sp-reveal > :not(summary) { padding: 0 20px 22px; }
  .service-page .sp-reveal > :where(ul, ol) { padding-left: 40px; }
  .service-page .sp-faq summary { font-size: 16px; padding: 20px 0; gap: 16px; }
  .service-page .sp-faq details > p { padding-right: 0; }
  .service-page .sp-related { padding: 44px 0; }
  .service-page .sp-related :where(ul, ol) { gap: 8px 22px; }
  .service-page .sp-related a { font-size: 15px; }
  .service-page[data-service="website"] .sp-close { min-height: 390px; }
  .service-page[data-service="website"] .sp-close::before { background-position: 70% center; }
  .service-page[data-service="website"] .sp-close::after { background: linear-gradient(90deg, #061b2cdd, #061b2c99 65%, #061b2c4d); }
  .homepage-footer .footer-columns.footer-with-services { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 22px; }
  .homepage-footer .footer-columns.footer-with-services > div:first-child { grid-column: 1 / -1; }
  .homepage-footer .footer-columns.footer-with-services a:not(.brand) { font-size: 14px; line-height: 1.6; }
  .faq-page .faq-close { padding: 45px 0; }
  .faq-page h1 { font-size: clamp(38px, 9vw, 48px); }
}
@media (prefers-reduced-motion: reduce) {
  .service-page .button,
  .service-page .sp-plus { transition: none; }
  .service-page .button:hover { transform: none; }
}

/* Preserve legible FAQ booking text and the open orange arrow stroke. */
.faq-page .homepage-faq a.button { color: #fff; }
.service-page .sp-arrow path { fill: none; }

/* Services navigation: one native disclosure across Home, FAQ and service pages. */
.site-header { position: relative; z-index: 30; }
.site-header .sp-nav { gap: 26px; }
.sp-services-menu { position: static; }
.sp-services-menu > summary { display: flex; align-items: center; gap: 8px; min-height: 46px; padding: 8px 0; cursor: pointer; list-style: none; font-weight: 700; }
.sp-services-menu > summary::-webkit-details-marker { display: none; }
.sp-services-menu > summary .spu-icon { width: 16px; height: 16px; transition: transform 160ms ease; }
.sp-services-menu[open] > summary .spu-icon { transform: rotate(180deg); }
.sp-services-panel { position: absolute; top: calc(100% - 8px); right: 0; width: min(680px, 100%); padding: 24px; background: #fff; color: #102a3d; border-radius: 16px; box-shadow: 0 18px 52px #061b2d33; z-index: 40; }
.sp-services-panel > p { color: #415f73; margin: 0 0 14px; font-size: 14px; line-height: 1.6; }
.sp-services-links { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; }
.site-header .sp-services-panel a { display: grid; grid-template-columns: 32px minmax(0, 1fr) 18px; align-items: start; gap: 10px; padding: 14px 10px; border: 0; border-radius: 10px; min-height: 74px; color: #102a3d; text-decoration: none; white-space: normal; }
.sp-services-links a > .spu-icon:first-child { color: #145fd5; background: #edf4ff; padding: 6px; width: 32px; height: 32px; border-radius: 8px; }
.sp-services-links strong { display: block; font-size: 14px; font-weight: 750; line-height: 1.4; }
.sp-services-links small { display: block; margin-top: 4px; font-size: 13px; font-weight: 400; line-height: 1.5; color: #476174; }
.sp-services-links .spu-menu-arrow { margin-top: 6px; width: 16px; color: #53738a; }
.site-header .sp-services-panel a:hover, .site-header .sp-services-panel a[aria-current="page"] { background: #edf4ff; }
.sp-services-links a[aria-current="page"] strong { color: #124eb4; }
.sp-services-bottom { margin-top: 12px; padding-top: 10px; border-top: 1px solid #dce7ef; }
.site-header .sp-services-bottom a { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 8px 10px; font-size: 13px; color: #255c86; }
.concept-top:has(.sp-services-menu[open]) { overflow: visible; }
.sp-services-menu :focus-visible { outline: 3px solid #f48a35; outline-offset: 3px; }
.spu-icon { display: inline-block; width: 22px; height: 22px; flex-shrink: 0; vertical-align: middle; }

/* Tangible service interfaces, inheriting the approved Ember palette and fonts. */
.service-page { --spu-text: #173244; --spu-muted: #4b6375; --spu-border: #dce5ed; --spu-blue: #1b61c8; --spu-light: #f4f7fa; --spu-teal: #166e62; --spu-motion: 320ms; }
.service-page ::selection { color: #071d2d; background: #b9ddff; }
.service-page main :where(h1,h2,h3) { letter-spacing: -.035em; text-wrap: balance; }
.service-page .sp-hero h1 { letter-spacing: -.035em; max-width: 960px; }
.service-page .sp-section { padding-block: 88px; }
.service-page #service-example .sp-split { align-items: start; gap: 48px; }
.service-page #service-example .sp-intro { max-width: 70ch; }
.service-page .spu-showcase { margin-top: 28px; }
.service-page .sp-split > .spu-showcase, .service-page .sp-feedback-art .spu-showcase { margin-top: 0; }
.service-page .spu-window { overflow: hidden; border: 0; border-radius: 16px; background: #fff; color: var(--spu-text); box-shadow: 0 22px 58px #00122140; font-size: 15px; line-height: 1.5; }
.service-page .spu-window :where(p,li,dd) { color: var(--spu-text); font-size: 15px; line-height: 1.6; }
.service-page .spu-window :where(h3,h4) { color: var(--spu-text); }
.service-page .spu-window :where(p + p, h3 + p, h4 + p) { margin-top: 8px; }
.service-page .spu-appbar { display: flex; align-items: center; gap: 12px; padding: 18px 22px; background: #fff; border-bottom: 1px solid var(--spu-border); }
.service-page .spu-app-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: #edf4ff; color: var(--spu-blue); }
.service-page .spu-appbar > div { flex: 1; min-width: 0; }
.service-page .spu-appbar strong { display: block; font-size: 16px; color: var(--spu-text); font-weight: 750; }
.service-page .spu-appbar > div > span { display: block; margin-top: 2px; font-size: 12px; color: var(--spu-muted); line-height: 1.5; }
.service-page .spu-demo-tag { padding: 3px 8px; border-radius: 5px; font-size: 12px; font-weight: 650; color: #41607a; background: #ecf2f7; }
.service-page .spu-tabs { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 5px; border-radius: 12px; background: #ffffff12; margin: 20px 0 24px; max-width: 100%; }
.service-page .spu-tabs button { justify-content: center; gap: 8px; padding: 10px 14px; border: 0; border-radius: 8px; font-size: 14px; min-height: 46px; background: transparent; box-shadow: none; color: #e4edf4; }
.service-page .spu-tabs button:hover { background: #ffffff16; }
.service-page .sp-selector.spu-tabs button[aria-pressed="true"] { background: #fff; color: #174c78; box-shadow: 0 3px 9px #061b2d20; border: 0; }
.service-page .spu-tabs button .spu-icon { width: 16px; height: 16px; }
.service-page .spu-tabs .sp-selection-check { display: none; }
.service-page .spu-tabs button[aria-pressed="true"] .sp-selection-check { display: inline-flex; }
.service-page .spu-panel-heading { font-size: 17px; font-weight: 650; margin: 0 0 14px; color: #e2edf5; }
.service-page .spu-inbox-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr) 260px; }
.service-page .spu-inbox-list { background: #f5f7fa; border-right: 1px solid var(--spu-border); padding: 18px 12px; display: flex; flex-direction: column; }
.service-page .spu-list-title { display: flex; align-items: center; justify-content: space-between; padding: 0 6px 18px; color: #1c3446; font-weight: 700; font-size: 14px; }
.service-page .spu-list-title span { font-size: 12px; font-weight: 400; color: #51697d; }
.service-page .spu-avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #dcebe7; color: #205d51; font-size: 12px; font-weight: 700; flex-shrink: 0; }
.service-page .spu-inbox-item { display: flex; gap: 9px; align-items: flex-start; padding: 14px 10px; border-radius: 8px; margin-bottom: 5px; }
.service-page .spu-inbox-item.is-current { background: #e3edf9; }
.service-page .spu-inbox-item > div { min-width: 0; flex: 1; }
.service-page .spu-inbox-item strong { display: block; font-size: 13px; color: var(--spu-text); }
.service-page .spu-inbox-item span:not(.spu-avatar) { display: block; font-size: 12px; color: #45637b; line-height: 1.5; margin-top: 4px; }
.service-page .spu-inbox-item small { font-size: 11px; color: #45637b; margin-top: 2px; }
.service-page .spu-inbox-foot { margin-top: auto; padding: 30px 8px 0; font-size: 12px; color: #476174; }
.service-page .spu-thread { display: flex; flex-direction: column; min-height: 455px; background: #fafcfe; }
.service-page .spu-thread-head { display: flex; align-items: center; gap: 12px; padding: 16px 22px; border-bottom: 1px solid var(--spu-border); background: #fff; }
.service-page .spu-thread-head > div { flex: 1; }
.service-page .spu-thread-head strong { display: block; font-size: 15px; }
.service-page .spu-thread-head span:not(.spu-avatar) { display: block; font-size: 12px; margin-top: 2px; color: var(--spu-muted); }
.service-page .spu-thread-head > .spu-icon { color: #59748b; }
.service-page .spu-messages { display: flex; flex-direction: column; gap: 18px; padding: 26px 24px; flex: 1; background: #f7f9fc; }
.service-page .spu-thread-date { text-align: center; font-size: 12px; color: #526a7c; margin: 0 0 2px; }
.service-page .spu-message { align-self: flex-start; width: fit-content; max-width: 86%; padding: 13px 16px 10px; border-radius: 13px 13px 13px 3px; background: #e9eef4; color: var(--spu-text); animation: spu-message-enter var(--spu-motion) cubic-bezier(.16,1,.3,1) both; }
.service-page .spu-message--out { align-self: flex-end; background: var(--spu-blue); color: #fff; border-radius: 13px 13px 3px 13px; }
.service-page .spu-message p { margin: 4px 0 0; font-size: 15px; line-height: 1.65; color: inherit; }
.service-page .spu-message--out p { color: #fff; }
.service-page .spu-message-author { display: block; font-size: 12px; font-weight: 700; color: inherit; }
.service-page .spu-message-time { display: block; margin-top: 7px; font-size: 11px; font-variant-numeric: tabular-nums; text-align: right; color: inherit; }
.service-page .spu-message:nth-of-type(2) { animation-delay: 55ms; }
.service-page .spu-message:nth-of-type(3) { animation-delay: 110ms; }
.service-page .spu-composer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 22px; border-top: 1px solid var(--spu-border); background: #fff; color: #526a7c; font-size: 12px; }
.service-page .spu-send-disabled { color: #637c91; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: #eef3f8; }
.service-page .spu-context { padding: 24px 22px; border-left: 1px solid var(--spu-border); background: #fff; }
.service-page .spu-context h4 { font-size: 19px; line-height: 1.35; margin: 0 0 24px; letter-spacing: -.02em; }
.service-page .spu-context dl > div { padding: 12px 0; border-top: 1px solid var(--spu-border); }
.service-page .spu-context dt { font-size: 12px; color: var(--spu-muted); }
.service-page .spu-context dd { margin: 4px 0 0; font-size: 14px; font-weight: 600; }
.service-page .spu-context h5 { font-size: 13px; margin: 20px 0 8px; }
.service-page .spu-context > p:not(.spu-state) { font-size: 13px; line-height: 1.65; }
.service-page .spu-context .spu-context-note { color: #51697b; font-size: 12px; padding-top: 18px; }
.service-page .spu-state { display: flex; align-items: center; gap: 7px; width: fit-content; padding: 7px 10px; background: #fff0df; color: #794608; border-radius: 6px; font-size: 12px; font-weight: 700; line-height: 1.5; margin-top: 18px; }
.service-page .spu-state .spu-icon { width: 16px; height: 16px; }
.service-page .spu-chat-client .spu-messages { min-height: 310px; }
.service-page .spu-client-status { display: flex; align-items: flex-start; gap: 10px; padding: 16px 22px; background: #edf3fb; color: #204666; }
.service-page .spu-client-status p { color: #204666; font-size: 13px; margin: 0; }
.service-page .spu-call-scene { padding: 32px 24px 24px; text-align: center; background: linear-gradient(150deg, #193b50, #102a3d); color: #fff; }
.service-page .spu-call-avatar { width: 60px; height: 60px; display: grid; place-items: center; margin: 0 auto 20px; border-radius: 50%; background: #ffffff12; color: #b7e3ff; }
.service-page .spu-call-avatar .spu-icon { width: 26px; height: 26px; }
.service-page .spu-call-scene h3 { color: #fff; font-size: 23px; line-height: 1.3; }
.service-page .spu-call-scene p { color: #d4e3ee; font-size: 14px; margin-top: 10px; }
.service-page .spu-wave { display: flex; align-items: center; justify-content: center; gap: 5px; height: 58px; margin: 22px 0 14px; }
.service-page .spu-wave i { width: 4px; height: var(--wave-height); background: #8bd3ff; border-radius: 3px; }
.service-page .spu-call-label { font-size: 12px; color: #c7dfed; }
.service-page .spu-call-record { padding: 24px; }
.service-page .spu-call-record h4 { display: flex; align-items: center; gap: 9px; font-size: 16px; margin: 0 0 16px; }
.service-page .spu-call-record dl > div { display: grid; grid-template-columns: 130px minmax(0,1fr); gap: 12px; padding: 11px 0; border-top: 1px solid var(--spu-border); }
.service-page .spu-call-record dt { font-size: 13px; color: var(--spu-muted); }
.service-page .spu-call-record dd { font-size: 14px; margin: 0; }
.service-page .spu-showcase > .sp-reveal { margin-top: 20px; }
.service-page .spu-calendar-body { padding: 24px 18px; }
.service-page .spu-calendar-body h3 { font-size: 21px; margin: 0 0 24px; }
.service-page .spu-calendar-month { display: flex; justify-content: space-between; gap: 10px; padding: 0 6px 16px; }
.service-page .spu-calendar-month strong { font-size: 15px; }
.service-page .spu-calendar-month span { font-size: 12px; color: var(--spu-muted); }
.service-page .spu-date-grid { border-collapse: separate; border-spacing: 2px 5px; width: 100%; table-layout: fixed; font-variant-numeric: tabular-nums; }
.service-page .spu-date-grid th { font-size: 11px; font-weight: 500; color: var(--spu-muted); padding: 0 0 8px; }
.service-page .spu-date-grid td { text-align: center; padding: 0; height: 44px; }
.service-page .spu-date-grid td > span { color: #647b8d; font-size: 13px; }
.service-page .spu-date-grid button { width: 100%; min-height: 44px; border: 0; border-radius: 8px; background: #edf4fc; color: #1b4f7e; font-size: 14px; font-weight: 700; }
.service-page .spu-date-grid button:hover { background: #daeaff; }
.service-page .spu-date-grid button[aria-pressed="true"] { background: var(--spu-blue); color: #fff; }
.service-page .spu-time-area { margin-top: 24px; padding-inline: 4px; }
.service-page .spu-time-area > strong { font-size: 13px; }
.service-page .spu-times { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 12px; }
.service-page .spu-times button { min-height: 46px; padding: 8px; border: 1px solid #b9cfdf; background: #fff; border-radius: 7px; color: #244d6c; font-size: 13px; font-weight: 600; }
.service-page .spu-times button[aria-pressed="true"] { border-color: var(--spu-blue); color: #fff; background: var(--spu-blue); }
.service-page .spu-request-summary { padding: 18px; margin-top: 24px; border-radius: 10px; background: #f4f7fa; }
.service-page .spu-request-summary .spu-state { margin-top: 0; }
.service-page .spu-request-summary [data-sp-booking-status] { font-weight: 700; font-variant-numeric: tabular-nums; font-size: 15px; margin-top: 12px; }
.service-page .spu-request-summary > p:last-child { font-size: 13px; margin-top: 8px; }
.service-page .spu-demo-note { color: var(--spu-muted); font-size: 12px; line-height: 1.6; margin: 18px 0 0; }
.service-page .spu-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.service-page .spu-browser-chrome { display: flex; align-items: center; gap: 22px; padding: 14px 18px; background: #edf1f5; color: #435c70; font-size: 12px; }
.service-page .spu-browser-chrome > span:last-child { display: flex; align-items: center; gap: 7px; min-width: 0; }
.service-page .spu-browser-chrome .spu-icon { width: 13px; height: 13px; }
.service-page .spu-browser-dots { display: flex; gap: 5px; flex-shrink: 0; }
.service-page .spu-browser-dots i { display: block; width: 7px; height: 7px; border-radius: 50%; background: #98aaba; }
.service-page .spu-garden { background: #faf8f1; color: #244538; }
.service-page .spu-garden-nav { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 32px; border-bottom: 1px solid #dce2d7; }
.service-page .spu-garden-nav strong { font: 750 24px/1.2 var(--display); letter-spacing: -.03em; }
.service-page .spu-garden-nav strong span { display: block; font: 400 11px/1.5 var(--font); letter-spacing: .02em; margin-top: 2px; }
.service-page .spu-garden-nav > span { font-size: 12px; }
.service-page .spu-garden-hero { position: relative; padding: 44px 40px; background: #e8eee2; }
.service-page .spu-garden-hero h3 { color: #244538; font-size: clamp(30px,3.2vw,45px); line-height: 1.1; max-width: 500px; }
.service-page .spu-garden-hero p { font-size: 15px; color: #395645; max-width: 390px; margin-top: 16px; }
.service-page .spu-garden-mark { position: absolute; right: 44px; top: 40px; width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: #d5e0c9; color: #426445; }
.service-page .spu-garden-cta, .service-page .spu-garden-send { display: inline-flex; align-items: center; gap: 18px; padding: 12px 16px; margin-top: 22px; border-radius: 7px; background: #315b42; color: #fff; font-size: 13px; font-weight: 650; }
.service-page .spu-garden-cta .spu-icon, .service-page .spu-garden-send .spu-icon { width: 16px; }
.service-page .spu-garden-services { padding: 30px 40px; }
.service-page .spu-garden-services h4 { color: #244538; font-size: 20px; margin: 0 0 16px; }
.service-page .spu-garden-services ul { display: flex; flex-wrap: wrap; gap: 12px 32px; list-style: none; padding: 0; margin: 0; }
.service-page .spu-garden-services li { display: inline-flex; align-items: center; gap: 8px; color: #395645; font-size: 14px; }
.service-page .spu-garden-services .spu-icon { width: 17px; height: 17px; }
.service-page .spu-garden-contact { padding: 28px 40px; background: #fff; display: grid; grid-template-columns: .8fr 1.2fr; gap: 20px 48px; border-top: 1px solid #e0e5da; }
.service-page .spu-garden-contact h4 { font-size: 21px; color: #244538; margin: 0; line-height: 1.3; }
.service-page .spu-garden-contact p { font-size: 13px; color: #48614f; }
.service-page .spu-garden-contact dl { display: grid; gap: 12px; }
.service-page .spu-garden-contact dt { font-size: 12px; color: #4c6354; margin-bottom: 4px; }
.service-page .spu-garden-contact dd { padding: 10px 12px; margin: 0; border: 1px solid #d8e1d4; border-radius: 6px; font-size: 13px; color: #314e3d; background: #fafcf8; }
.service-page .spu-garden-send { justify-self: start; margin-top: 0; }
.service-page .spu-site-preview--phone { max-width: 375px; margin-inline: auto; border-radius: 22px; }
.service-page .spu-site-preview--phone .spu-browser-chrome { justify-content: center; }
.service-page .spu-site-preview--phone .spu-browser-dots { display: none; }
.service-page .spu-site-preview--phone .spu-garden-nav { padding: 22px; }
.service-page .spu-site-preview--phone .spu-garden-nav > span { display: none; }
.service-page .spu-site-preview--phone .spu-garden-hero { padding: 30px 22px; }
.service-page .spu-site-preview--phone .spu-garden-hero h3 { font-size: 31px; }
.service-page .spu-site-preview--phone .spu-garden-mark { display: none; }
.service-page .spu-site-preview--phone .spu-garden-services { padding: 26px 22px; }
.service-page .spu-site-preview--phone .spu-garden-services ul { flex-direction: column; }
.service-page .spu-site-preview--phone .spu-garden-contact { grid-template-columns: 1fr; padding: 26px 22px; gap: 16px; }
.service-page .spu-feedback-client .spu-messages { min-height: 175px; }
.service-page .spu-feedback-owner { display: flex; gap: 10px; align-items: flex-start; padding: 18px 22px; border-top: 1px solid var(--spu-border); background: #fafcfe; }
.service-page .spu-feedback-owner .spu-icon { color: #446581; }
.service-page .spu-feedback-owner strong { display: block; font-size: 13px; }
.service-page .spu-feedback-owner span { display: block; margin-top: 4px; color: #4d677c; font-size: 12px; }
.service-page .spu-review-destination { display: flex; gap: 12px; align-items: flex-start; padding: 18px 22px; background: #eef4fa; border-top: 1px solid var(--spu-border); color: #265a81; }
.service-page .spu-review-destination strong { display: block; font-size: 13px; color: #214e72; }
.service-page .spu-review-destination span { display: block; margin-top: 4px; font-size: 12px; color: #365d7a; line-height: 1.6; }
.service-page .sp-feedback-art .spu-showcase { position: relative; z-index: 1; }
.service-page .sp-setup-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 44px; }
.service-page .sp-setup-list > div { border-top: 1px solid #ccdce7; padding: 24px 0; }
.service-page .sp-setup-list dt { font-size: 18px; }
.service-page .sp-setup-list dd { max-width: 58ch; margin-top: 8px; }
@keyframes spu-message-enter { from { opacity: .82; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width:1100px) {
 .site-header .sp-nav { gap: 18px; }
 .site-header .sp-nav .sp-nav-secondary { font-size: 13px; }
 .service-page .spu-inbox-layout { grid-template-columns: minmax(0,1fr) 240px; }
 .service-page .spu-inbox-list { display: none; }
}
@media (max-width:800px) {
 .site-header .sp-nav .sp-nav-secondary { display: none; }
 .service-page #service-example .sp-split { grid-template-columns: 1fr; gap: 32px; }
 .service-page #service-example .sp-split > .spu-showcase { width: 100%; max-width: 600px; margin-inline: auto; }
 .service-page .spu-garden-mark { display: none; }
 .service-page .sp-section { padding-block: 64px; }
}
@media (max-width:600px) {
 .site-header { gap: 10px; }
 .site-header .sp-nav { gap: 10px; }
 .site-header .sp-nav .button { font-size: 13px; padding: 10px 12px; min-height: 44px; gap: 6px; }
 .sp-services-menu > summary { font-size: 13px; padding-inline: 6px; }
 .site-header .brand .supplied-logo { font-size: 6.15px; width: 20em; }
 .sp-services-panel { top: calc(100% - 4px); width: 100%; padding: 18px 12px; max-height: min(72vh,600px); overflow-y: auto; overscroll-behavior: contain; }
 .sp-services-links { grid-template-columns: 1fr; }
 .site-header .sp-services-panel a { min-height: 68px; padding: 10px 8px; }
 .site-header .sp-services-bottom a { min-height: 48px; }
 .service-page .spu-inbox-layout { display: flex; flex-direction: column; }
 .service-page .spu-context { border-left: 0; border-top: 1px solid var(--spu-border); padding: 22px; }
 .service-page .spu-context h4 { margin-bottom: 16px; }
 .service-page .spu-context dl { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
 .service-page .spu-thread { min-height: 0; }
 .service-page .spu-appbar { padding: 16px; gap: 10px; }
 .service-page .spu-appbar strong { font-size: 15px; }
 .service-page .spu-appbar > div > span { font-size: 12px; }
 .service-page .spu-messages { padding: 22px 16px; gap: 16px; }
 .service-page .spu-message { max-width: 92%; padding: 12px 14px 9px; }
 .service-page .spu-message p { font-size: 15px; }
 .service-page .spu-tabs { display: flex; width: 100%; }
 .service-page .spu-tabs button { flex: 1 1 100px; min-height: 48px; padding: 10px 8px; font-size: 13px; text-align: center; }
 .service-page .spu-calendar-body { padding: 24px 10px; }
 .service-page .spu-calendar-body > h3 { padding-inline: 8px; }
 .service-page .spu-calendar-month { padding-inline: 8px; }
 .service-page .spu-date-grid { border-spacing: 0 4px; }
 .service-page .spu-composer, .service-page .spu-thread-head { padding: 16px; }
 .service-page .spu-call-record { padding: 22px 18px; }
 .service-page .spu-call-record dl > div { grid-template-columns: 110px minmax(0,1fr); }
 .service-page .spu-garden-nav { padding: 20px; }
 .service-page .spu-garden-hero, .service-page .spu-garden-services { padding: 30px 22px; }
 .service-page .spu-garden-nav > span { display: none; }
 .service-page .spu-garden-contact { grid-template-columns: 1fr; gap: 16px; padding: 26px 22px; }
 .service-page .spu-garden-services ul { flex-direction: column; }
 .service-page .sp-setup-list { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width:360px) {
 .site-header .brand .supplied-logo { font-size: 5.8px; width: 20em; }
 .site-header .sp-nav { gap: 5px; }
 .site-header .sp-nav .button { padding: 10px 9px; font-size: 12px; }
 .sp-services-menu > summary { gap: 4px; padding-inline: 3px; font-size: 12px; }
 .sp-services-menu > summary .spu-icon { width: 14px; height: 14px; }
 .service-page .spu-demo-tag { display: none; }
 .service-page .spu-calendar-body { padding-inline: 4px; }
}
@media (prefers-reduced-motion:reduce) {
 .service-page .spu-message { animation: none; }
 .sp-services-menu > summary .spu-icon { transition: none; }
}

/* Second scoped refinement: the call scene and an art-directed website concept. */
.service-page .spr-section-intro { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; margin-bottom:36px; }
.service-page .spr-section-intro h2 { margin:0; max-width:18ch; }
.service-page .spr-section-intro > p { margin:0; max-width:65ch; }
.service-page .spr-call-demo { margin:0; }
.service-page .spr-call-demo > figcaption { font-size:13px; color:#cadbe6; margin-bottom:18px; }
.service-page .spr-call-layout { display:grid; grid-template-columns:minmax(320px,.85fr) minmax(0,1.25fr); background:#fff; color:#183244; border-radius:16px 16px 0 0; overflow:hidden; }
.service-page .spr-phone { display:flex; flex-direction:column; padding:28px 32px; background:linear-gradient(155deg,#173d4a,#082231 70%); color:#fff; }
.service-page .spr-phone-top { display:flex; align-items:center; justify-content:space-between; gap:18px; font-size:12px; color:#c9e0e8; }
.service-page .spr-phone-top > span:first-child { display:flex; gap:8px; align-items:center; font-size:14px; font-weight:600; color:#fff; }
.service-page .spr-phone svg { width:22px; height:22px; }
.service-page .spr-caller { text-align:center; margin:28px 0 0; }
.service-page .spr-caller img { width:144px; height:144px; border-radius:50%; object-fit:cover; object-position:center 35%; margin-inline:auto; }
.service-page .spr-caller h3 { margin:20px 0 7px; font-size:26px; color:#fff; }
.service-page .spr-caller > p { color:#c8dce5; font-size:14px; margin:0; }
.service-page .spr-call-indicator { display:flex; align-items:center; justify-content:center; gap:8px; margin:20px 0 0; }
.service-page .spr-call-indicator > span { width:6px; height:6px; border-radius:50%; background:#91d6c0; }
.service-page .spr-call-indicator p { color:#b5e3d4; font-size:12px; margin:0; }
.service-page .spr-caller-request { margin:24px 0 0; padding:20px 0; text-align:center; font-size:15px; color:#e4edf2; border-top:1px solid #ffffff1c; border-bottom:1px solid #ffffff1c; }
.service-page .spr-call-controls { display:flex; justify-content:center; gap:18px; margin:24px 0 16px; }
.service-page .spr-call-controls button { width:80px; min-height:84px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; background:#ffffff0d; color:#fff; border:0; border-radius:12px; cursor:pointer; font-size:12px; }
.service-page .spr-call-controls button:hover { background:#ffffff20; }
.service-page .spr-call-controls button[aria-pressed="true"] { background:#e3f4ee; color:#12332b; }
.service-page .spr-call-controls .spr-hangup { background:#bc343e; }
.service-page .spr-call-controls .spr-hangup:hover { background:#d7454f; }
.service-page .spr-phone[data-spr-ended="true"] .spr-hangup { background:#286a59; }
.service-page .spr-phone[data-spr-ended="true"] .spr-call-indicator > span { background:#b7c9d4; }
.service-page .spr-phone[data-spr-ended="true"] .spr-call-indicator p { color:#c8dce5; }
.service-page .spr-call-controls button:disabled { opacity:.5; cursor:default; }
.service-page .spr-phone-note { color:#bdd2dc; text-align:center; max-width:33ch; margin:auto auto 0; padding-top:14px; font-size:12px; line-height:1.6; }
.service-page .spr-call-workspace { background:#fff; }
.service-page .spr-review { padding:48px 44px; background:#fff; display:flex; flex-direction:column; justify-content:center; }
.service-page .spr-review-top { margin:0; }
.service-page .spr-review-top h3 { font-size:32px; line-height:1.2; color:#183244; margin:0; max-width:20ch; }
.service-page .spr-review-intro { font-size:16px; margin-top:18px; color:#33485a; line-height:1.7; }
.service-page .spr-review dl { display:grid; grid-template-columns:1fr; gap:0; margin:28px 0 0; }
.service-page .spr-review dl > div { display:grid; grid-template-columns:112px minmax(0,1fr); gap:18px; padding:18px 0; border-top:1px solid #dce7ee; }
.service-page .spr-review dt { color:#526b7e; font-size:13px; padding-top:2px; }
.service-page .spr-review dd { color:#183244; margin:0; font-size:15px; font-weight:500; line-height:1.65; }
.service-page .spr-handoff-note { font-size:13px; color:#34200b; background:#ffcf79; padding:14px 16px; margin-top:24px; border-radius:8px; }
.service-page .spr-conversation { padding:40px 44px; background:#fff; color:#183244; }
.service-page .spr-transcript-head { display:flex; justify-content:space-between; align-items:center; gap:12px; max-width:850px; margin:0 auto 26px; }
.service-page .spr-transcript-head h3 { font-size:24px; color:#183244; margin:0; }
.service-page .spr-transcript-head > span { font-size:12px; color:#526b7e; }
.service-page .spr-conversation ol { list-style:none; padding:0; margin:0 auto; max-width:850px; }
.service-page .spr-turn { display:grid; grid-template-columns:116px minmax(0,1fr); gap:22px; padding:22px 0; background:#fff; border-top:1px solid #dce7ee; }
.service-page .spr-turn--ai { background:#fff; }
.service-page .spr-turn > span { display:block; color:#526b7e; font-size:13px; font-weight:700; line-height:1.7; }
.service-page .spr-turn--ai > span { color:#2058d4; }
.service-page .spr-turn p { color:#173244; font-size:16px; line-height:1.75; margin:0; max-width:70ch; }
.service-page .spr-turn--ai p { color:#173244; }
.service-page .spr-website-demo { margin-top:20px; }
.service-page .spr-preview-tools { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }
.service-page .spr-preview-tools > p { font-size:13px; margin:0; color:#d0e0e9; }
.service-page .spr-preview-tools .spu-tabs { margin:0; }
.service-page .spr-browser { border-radius:16px; overflow:hidden; background:#ffffff; box-shadow:0 22px 58px #00122140; }
.service-page .spr-browser-bar { display:flex; gap:20px; align-items:center; padding:12px 20px; color:#596572; background:#ecf0f3; font-size:12px; }
.service-page .spr-browser-bar > span:last-child { display:flex; align-items:center; gap:7px; }
.service-page .spr-browser-bar svg { width:12px; height:12px; }
.service-page .spr-browser-dots { display:flex; gap:5px; }
.service-page .spr-browser-dots i { width:7px; height:7px; background:#98a9b8; border-radius:50%; }
.service-page .spr-haven { color:#171c24; background:#ffffff; font-family:var(--font); }
.service-page .spr-haven svg { width:20px; height:20px; flex-shrink:0; }
.service-page .spr-haven button, .service-page .spr-haven a { cursor:pointer; text-decoration:none; font-family:var(--font); }
.service-page .spr-haven :focus-visible { outline:3px solid #4c83ff; outline-offset:4px; }
.service-page .spr-phone :focus-visible { outline:3px solid #eea45d; outline-offset:4px; }
.service-page .spr-haven-nav { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 40px; background:#ffffff; }
.service-page .spr-haven-brand { color:#171c24; font:600 38px/1 var(--display); letter-spacing:-.04em; }
.service-page .spr-haven-brand > span { display:block; font:400 11px/1.6 var(--font); margin-top:5px; letter-spacing:.04em; }
.service-page .spr-haven-nav > div { display:flex; gap:32px; align-items:center; }
.service-page .spr-haven-nav > div > a { color:#171c24; font-size:14px; text-underline-offset:4px; min-height:44px; display:inline-flex; align-items:center; }
.service-page .spr-haven button { display:inline-flex; align-items:center; justify-content:space-between; gap:22px; min-height:46px; border:0; border-radius:0; padding:12px 18px; color:#ffffff; background:#2459df; font-size:13px; font-weight:600; transition:background 150ms ease; }
.service-page .spr-haven button:hover { background:#1748c2; }
.service-page .spr-haven-hero { position:relative; display:grid; grid-template-columns:1fr; min-height:550px; background:#151b24; isolation:isolate; }
.service-page .spr-haven-hero-copy { position:relative; z-index:1; width:60%; padding:62px 40px 32px; display:flex; flex-direction:column; align-items:flex-start; background:linear-gradient(90deg,#151b24f5 0%,#151b24e6 65%,#151b2400 100%); }
.service-page .spr-haven-hero h3 { font:500 clamp(36px,4.7vw,54px)/1.08 var(--display); color:#fff; letter-spacing:-.035em; text-wrap:initial; margin:0; }
.service-page .spr-haven-hero h3 > span, .service-page .spr-haven-hero h3 > em { display:block; }
.service-page .spr-haven em { font-weight:400; color:inherit; }
.service-page .spr-haven-hero h3 > em { color:#ffffff; }
.service-page .spr-haven-hero-copy > p { font-size:16px; line-height:1.65; color:#fff; max-width:31ch; margin:26px 0 28px; }
.service-page .spr-haven-hero-foot { margin-top:auto; padding-top:36px; font-size:13px; color:#fff; }
.service-page .spr-haven-hero > figure { position:absolute; inset:0; z-index:0; margin:0; overflow:hidden; min-height:0; }
.service-page .spr-haven-hero img { width:100%; height:100%; object-fit:cover; object-position:62% center; position:absolute; inset:0; }
.service-page .spr-haven-hero figcaption { position:absolute; right:24px; bottom:24px; max-width:32%; padding:10px 14px; background:#151b24; color:#fff; font-size:12px; line-height:1.6; }
.service-page .spr-haven-care { display:grid; grid-template-columns:.92fr 1.2fr; gap:64px; padding:58px 40px; }
.service-page .spr-haven-care h4 { font:500 34px/1.2 var(--display); color:#151b24; letter-spacing:-.035em; margin:0; }
.service-page .spr-haven-care p { color:#46515f; font-size:15px; line-height:1.7; max-width:36ch; margin-top:20px; }
.service-page .spr-haven-services button { background:transparent; padding:23px 0; color:#151b24; border-top:1px solid #c9ced5; display:flex; width:100%; text-align:left; font-size:19px; font-weight:600; }
.service-page .spr-haven-services button:last-child { border-bottom:1px solid #c9ced5; }
.service-page .spr-haven-services button:hover { color:#151b24; background:#f2f4f7; }
.service-page .spr-haven-services small { display:block; color:#46515f; font-size:13px; font-weight:400; margin-top:7px; line-height:1.6; }
.service-page .spr-haven-contact { display:flex; gap:24px; align-items:center; justify-content:space-between; background:#151b24; padding:36px 40px; }
.service-page .spr-haven-contact p { font:500 36px/1.3 var(--display); color:#fff; margin:0; }
.service-page .spr-haven-footer { display:flex; justify-content:space-between; gap:24px; padding:24px 40px; color:#46515f; font-size:12px; }
.service-page .spr-inquiry { padding:30px 36px; border-top:1px solid #c9ced5; background:#ffffff; }
.service-page .spr-inquiry[hidden] { display:none; }
.service-page .spr-inquiry > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.service-page .spr-inquiry h4 { color:#171c24; font-size:26px; margin:0; }
.service-page .spr-inquiry p { color:#46515f; font-size:14px; }
.service-page .spr-inquiry [data-spr-inquiry-close] { padding:12px; background:transparent; color:#2459df; }
.service-page .spr-inquiry-choices { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.service-page .spr-inquiry-choices button { color:#2459df; background:#f2f4f7; }
.service-page .spr-inquiry-choices button:hover { color:#fff; background:#1748c2; }
.service-page .spr-inquiry-choices button[aria-pressed="true"] { color:#fff; background:#2459df; }
.service-page .spr-inquiry .spr-inquiry-status { margin-top:20px; font-weight:600; }
.service-page .spr-inquiry .spr-inquiry-note { font-size:12px; }
.service-page .spr-inquiry > a { display:inline-flex; align-items:center; gap:14px; color:#2459df; font-size:14px; padding:12px 0; margin-top:8px; font-weight:650; text-decoration:underline; text-underline-offset:5px; }
.service-page .spr-haven--phone { max-width:390px; margin-inline:auto; }
.service-page .spr-haven--phone .spr-browser-dots { display:none; }
.service-page .spr-haven--phone .spr-browser-bar { justify-content:center; }
.service-page .spr-haven--phone .spr-haven-nav { padding:20px; }
.service-page .spr-haven--phone .spr-haven-nav > div > a { display:none; }
.service-page .spr-haven--phone .spr-haven-brand { font-size:29px; }
.service-page .spr-haven--phone .spr-haven-nav button { font-size:12px; gap:10px; padding:10px 12px; }
.service-page .spr-haven--phone .spr-haven-hero { display:flex; flex-direction:column; }
.service-page .spr-haven--phone .spr-haven-hero-copy { width:100%; padding:36px 24px 28px; background:#151b24; }
.service-page .spr-haven--phone .spr-haven-hero h3 { font-size:43px; }
.service-page .spr-haven--phone .spr-haven-hero-foot { padding-top:26px; }
.service-page .spr-haven--phone .spr-haven-hero > figure { position:relative; min-height:285px; }
.service-page .spr-haven--phone .spr-haven-care { display:block; padding:34px 24px; }
.service-page .spr-haven--phone .spr-haven-services { margin-top:28px; }
.service-page .spr-haven--phone .spr-haven-contact { flex-direction:column; align-items:flex-start; padding:28px 24px; }
.service-page .spr-haven--phone .spr-haven-footer { padding:20px 24px; gap:15px; }
.service-page .spr-haven--phone .spr-inquiry { padding:26px 24px; }
@media(max-width:800px) {
 .service-page .spr-section-intro { grid-template-columns:1fr; gap:20px; }
 .service-page .spr-section-intro h2 { max-width:25ch; }
 .service-page .spr-call-layout { grid-template-columns:1fr; max-width:620px; margin-inline:auto; }
 .service-page .spr-phone-note { margin-top:4px; }
 .service-page .spr-call-workspace { border-top:1px solid #dce7ee; }
 .service-page .spr-preview-tools { flex-direction:column; align-items:flex-start; gap:15px; }
}
@media(max-width:600px) {
 .service-page .spr-phone { padding:22px; }
 .service-page .spr-caller { margin-top:28px; }
 .service-page .spr-caller img { width:144px; height:144px; }
 .service-page .spr-caller h3 { font-size:24px; }
 .service-page .spr-call-controls { gap:14px; }
 .service-page .spr-review, .service-page .spr-conversation { padding:24px 20px; }
 .service-page .spr-review-top { margin:0; padding:0; }
 .service-page .spr-review-top h3 { font-size:28px; }
 .service-page .spr-review dl { gap:0; }
 .service-page .spr-turn { grid-template-columns:1fr; gap:6px; padding:20px 0; }
 .service-page .spr-call-demo > figcaption { font-size:12px; }
 .service-page .spr-transcript-head { align-items:flex-start; }
 .service-page .spr-haven-nav { padding:20px; }
 .service-page .spr-haven-nav > div > a { display:none; }
 .service-page .spr-haven-brand { font-size:29px; }
 .service-page .spr-haven-nav button { font-size:12px; gap:10px; padding:10px 12px; }
 .service-page .spr-haven-hero { display:flex; flex-direction:column; }
 .service-page .spr-haven-hero-copy { width:100%; padding:36px 24px 28px; background:#151b24; }
 .service-page .spr-haven-hero h3 { font-size:41px; }
 .service-page .spr-haven-hero-foot { padding-top:26px; }
 .service-page .spr-haven-hero > figure { position:relative; min-height:285px; }
 .service-page .spr-haven-care { display:block; padding:34px 24px; }
 .service-page .spr-haven-services { margin-top:28px; }
 .service-page .spr-haven-contact { flex-direction:column; align-items:flex-start; padding:28px 24px; }
 .service-page .spr-haven-footer { padding:20px 24px; gap:15px; }
 .service-page .spr-inquiry { padding:26px 24px; }
}
@media(prefers-reduced-motion:reduce) { .service-page .spr-haven button { transition:none; } }

/* Strong accents belong to actions and the two distinct call records. */
.service-page .spr-haven-nav button, .service-page .spr-haven-hero-copy button, .service-page .spr-haven-contact button { background:#2459df; color:#fff; min-height:48px; border-radius:4px; }
.service-page .spr-haven-nav button:hover, .service-page .spr-haven-hero-copy button:hover, .service-page .spr-haven-contact button:hover { background:#1748c2; }
.service-page .spr-haven-services button > svg { width:36px; height:36px; padding:8px; border-radius:50%; background:#2459df; color:#fff; }
.service-page .spr-haven ::selection { background:#2459df; color:#fff; }
.service-page .spr-conversation ::selection { background:#2058d4; color:#fff; }
.service-page .spr-haven--phone .spr-haven-hero figcaption { max-width:75%; }
@media(max-width:600px) { .service-page .spr-haven-hero figcaption { max-width:75%; } }

/* Receptionist conversation uses the exact Ember Guided Reveal arrow and rotating plus. */
.service-page .spr-call-reveal { --reveal-arrow:#ff8529; --reveal-control-start:#ff8b2c; --reveal-control-end:#ff650b; background:linear-gradient(100deg,#112e45,#1b4968); color:#fff; border-radius:0 0 16px 16px; overflow:hidden; }
.service-page .spr-call-reveal > summary { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:27px 36px; list-style:none; cursor:pointer; touch-action:manipulation; }
.service-page .spr-call-reveal > summary::-webkit-details-marker { display:none; }
.service-page .spr-call-reveal > summary::marker { content:''; }
.service-page .spr-call-reveal .reveal-heading { min-width:0; }
.service-page .spr-call-reveal .reveal-heading strong { display:block; font-size:25px; line-height:1.3; letter-spacing:-.035em; }
.service-page .spr-call-reveal .reveal-action { display:flex; align-items:center; gap:15px; flex-shrink:0; }
.service-page .spr-call-reveal .reveal-prompt { display:flex; align-items:center; gap:10px; color:#fff; font-size:14px; font-weight:700; }
.service-page .spr-call-reveal .reveal-arrow { width:58px; height:28px; fill:none; stroke:var(--reveal-arrow); stroke-width:2.8; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.service-page .spr-call-reveal .reveal-icon { display:grid; place-items:center; width:50px; height:50px; border-radius:11px; background:linear-gradient(145deg,var(--reveal-control-start),var(--reveal-control-end)); color:#082439; border:1px solid #ffb577; box-shadow:0 0 0 4px #ff781a16,0 0 26px #ff781a38; font-size:32px; font-weight:700; font-style:normal; line-height:1; flex-shrink:0; transition:transform 240ms ease; }
.service-page .spr-call-reveal .reveal-open { display:none; }
.service-page .spr-call-reveal[open] .reveal-open { display:inline; }
.service-page .spr-call-reveal[open] .reveal-closed { display:none; }
.service-page .spr-call-reveal[open] .reveal-icon { transform:rotate(45deg); }
.service-page .spr-call-reveal > summary:focus-visible { outline:3px solid #ffa24b; outline-offset:-4px; }
.service-page .spr-call-reveal .reveal-panel { background:#fff; border-top:1px solid #487391; }
@media(hover:hover) { .service-page .spr-call-reveal > summary:hover .reveal-icon { box-shadow:0 0 0 4px #ff781a25,0 0 30px #ff781a55; } }
@media(max-width:800px) { .service-page .spr-call-reveal { max-width:620px; margin-inline:auto; } .service-page .spr-review { padding:36px 32px; } }
@media(max-width:600px) { .service-page .spr-call-reveal > summary { padding:24px 20px; flex-wrap:wrap; gap:18px; } .service-page .spr-call-reveal .reveal-heading strong { font-size:22px; } .service-page .spr-call-reveal .reveal-action { margin-left:auto; gap:9px; } .service-page .spr-call-reveal .reveal-prompt { font-size:13px; gap:5px; } .service-page .spr-call-reveal .reveal-arrow { width:43px; } .service-page .spr-call-reveal .reveal-icon { width:46px; height:46px; font-size:30px; } .service-page .spr-review { padding:30px 24px; } .service-page .spr-review dl > div { grid-template-columns:1fr; gap:6px; } .service-page .spr-conversation { padding:32px 24px; } }
@media(prefers-reduced-motion:reduce) { .service-page .spr-call-reveal .reveal-icon { transition:none; } }

/* Service marketing refresh. Scoped to outer sections; approved demos stay intact. */
.sr-refresh .sr-hero { background: #fff; padding: 0; }
.sr-refresh .sr-hero .sp-container { padding-top: 0; }
.sr-refresh .sr-hero .sp-breadcrumb { padding-top: 28px; margin-bottom: 40px; color: #3a5367; }
.sr-refresh .sr-hero-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 56px; align-items: center; padding-bottom: 64px; }
.sr-refresh .sr-hero h1 { margin: 0 0 24px; font-size: clamp(44px, 4.9vw, 68px); line-height: 1.06; letter-spacing: -.035em; max-width: 13ch; text-wrap: balance; }
.sr-refresh .sr-hero .sp-intro { font-size: 18px; line-height: 1.7; color: #3a5367; max-width: 48ch; }
.sr-refresh .sr-hero .sp-actions { gap: 20px; margin-top: 32px; }
.sr-refresh .sr-hero .button { background: #1261d8; border: 0; box-shadow: 0 10px 24px #0d4fc822; }
.sr-refresh .sr-hero .button:hover { background: #084bae; }
.sr-refresh .sr-hero .sp-text-link { font-size: 15px; border-bottom: 1px solid #56758b; }
.sr-refresh .sr-hero-preview { min-width: 0; margin: 0; }
.sr-refresh .sr-visual { display: block; color: #fff; border-radius: 16px; overflow: hidden; background: #0a2035; box-shadow: 0 24px 48px #0b243723; transition: box-shadow 220ms ease, transform 220ms ease; }
.sr-refresh .sr-visual:hover { transform: translateY(-4px); box-shadow: 0 28px 52px #0b243731; }
.sr-refresh .sr-hero-preview figcaption { padding: 20px 0 0; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; color: #3a5367; font-size: 12px; line-height: 1.6; }
.sr-refresh .sr-hero-preview figcaption a { font-size: 14px; font-weight: 700; display: inline-flex; align-items: center; gap: 12px; min-height: 32px; color: #102a3d; }
.sr-refresh .sr-hero-preview svg, .sr-refresh .sr-page-path svg, .sr-refresh .sr-faq-link svg { width: 20px; height: 20px; flex-shrink: 0; }
.sr-refresh .sr-page-path { display: grid; grid-template-columns: 1.5fr 1fr .8fr; border-top: 1px solid #becbd5; padding: 20px 0; gap: 24px; }
.sr-refresh .sr-page-path a { display: flex; justify-content: space-between; align-items: center; gap: 16px; font-size: 14px; font-weight: 700; min-height: 44px; }
.sr-refresh .sr-page-path a:hover, .sr-refresh .sr-faq-link:hover { color: #1261d8; }
.sr-refresh .sr-web-nav { padding: 18px 24px; display: flex; justify-content: space-between; align-items: center; background: #fff; color: #171c24; }
.sr-refresh .sr-web-nav strong { font: 500 34px/1 Georgia, serif; letter-spacing: -.035em; }
.sr-refresh .sr-web-nav span { font-size: 12px; }
.sr-refresh .sr-web-cover { position: relative; height: 330px; overflow: hidden; background: #151b24; }
.sr-refresh .sr-web-cover img { display: block; height: 100%; width: 100%; object-fit: cover; }
.sr-refresh .sr-web-cover::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #151b24e6, #151b2466 62%, transparent); }
.sr-refresh .sr-web-cover > div { position: absolute; top: 42px; left: 24px; z-index: 1; }
.sr-refresh .sr-web-cover span { display: block; font-size: 15px; margin-bottom: 18px; }
.sr-refresh .sr-web-cover em { font: italic 400 clamp(32px, 3.7vw, 49px)/1.12 Georgia, serif; letter-spacing: -.025em; }
.sr-refresh .sr-web-bottom { background: #fff; color: #171c24; padding: 24px; display: flex; justify-content: space-between; align-items: center; font-size: 16px; line-height: 1.45; font-weight: 600; }
.sr-refresh .sr-web-bottom svg { color: #2459df; width: 32px; height: 32px; }
.sr-refresh .sr-call-art { position: relative; height: 500px; overflow: hidden; }
.sr-refresh .sr-call-art img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; display: block; }
.sr-refresh .sr-call-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, #061d30 0%, #061d30ee 25%, #061d3000 73%); }
.sr-refresh .sr-call-copy { position: absolute; inset: auto 28px 28px; z-index: 1; }
.sr-refresh .sr-call-copy > span { font-size: 12px; color: #fff; display: block; margin-bottom: 12px; }
.sr-refresh .sr-call-copy strong { font: 700 28px/1.2 var(--display); letter-spacing: -.025em; }
.sr-refresh .sr-call-copy blockquote { font-size: 17px; line-height: 1.6; margin: 20px 0 16px; }
.sr-refresh .sr-call-copy p { color: #fff; font-size: 13px; line-height: 1.65; border-top: 1px solid #698297; padding-top: 16px; }
.sr-refresh :is(.sr-chat-art, .sr-message-art, .sr-calendar-art, .sr-feedback-art) { background: #fff; color: #102a3d; }
.sr-refresh :is(.sr-chat-art, .sr-message-art, .sr-calendar-art, .sr-feedback-art) header { background: #0a2035; color: #fff; padding: 26px 28px; display: flex; flex-direction: column; gap: 6px; }
.sr-refresh :is(.sr-chat-art, .sr-message-art, .sr-calendar-art, .sr-feedback-art) header strong { font-size: 20px; }
.sr-refresh :is(.sr-chat-art, .sr-message-art, .sr-calendar-art, .sr-feedback-art) header span { font-size: 12px; }
.sr-refresh .sr-art-messages { display: flex; flex-direction: column; gap: 22px; padding: 32px 24px; }
.sr-refresh .sr-art-messages p { max-width: 90%; padding: 16px 18px; font-size: 15px; line-height: 1.65; margin: 0; border-radius: 14px; }
.sr-refresh .sr-art-messages .sr-visitor { background: #1261d8; color: #fff; align-self: flex-end; border-bottom-right-radius: 3px; }
.sr-refresh .sr-art-messages .sr-answer { background: #edf1f5; color: #102a3d; align-self: flex-start; border-bottom-left-radius: 3px; }
.sr-refresh .sr-art-note { padding: 20px 24px; border-top: 1px solid #becbd5; font-size: 14px; }
.sr-refresh .sr-message-owner { padding: 24px; display: flex; flex-direction: column; gap: 8px; background: #102a3d; color: #fff; }
.sr-refresh .sr-message-owner strong { font-size: 14px; }
.sr-refresh .sr-message-owner span { font-size: 13px; line-height: 1.6; }
.sr-refresh .sr-calendar-content { padding: 28px; }
.sr-refresh .sr-calendar-month { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.sr-refresh .sr-calendar-month strong { font: 700 34px/1.2 var(--display); letter-spacing: -.025em; }
.sr-refresh .sr-calendar-month > span { font-size: 12px; color: #3a5367; }
.sr-refresh .sr-calendar-days { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; margin: 28px 0; }
.sr-refresh .sr-calendar-days span { padding: 15px 0; text-align: center; color: #3a5367; font-size: 12px; border-radius: 12px; line-height: 1.6; }
.sr-refresh .sr-calendar-days b { font-size: 22px; color: #102a3d; }
.sr-refresh .sr-calendar-days .sr-selected { background: #1261d8; color: #fff; }
.sr-refresh .sr-calendar-days .sr-selected b { color: #fff; }
.sr-refresh .sr-time { display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 20px 0; border-block: 1px solid #becbd5; }
.sr-refresh .sr-time strong { font-size: 24px; }
.sr-refresh .sr-time span { font-size: 12px; color: #3a5367; }
.sr-refresh .sr-calendar-content p { font-size: 16px; margin: 24px 0 8px; color: #102a3d; font-weight: 700; }
.sr-refresh .sr-calendar-content > span { font-size: 14px; line-height: 1.7; display: block; color: #3a5367; }
.sr-refresh .sr-feedback-art blockquote { margin: 32px 28px 20px; font: 700 36px/1.15 var(--display); letter-spacing: -.025em; }
.sr-refresh .sr-feedback-art > p { margin: 0 28px 28px; font-size: 16px; color: #3a5367; }
.sr-refresh .sr-feedback-line { margin: 0 28px 28px; border-top: 1px solid #becbd5; }
/* Editorial questions, a process path, and an open setup brief supply distinct rhythms. */
.sr-refresh .sr-section { padding-block: 96px; }
.sr-refresh .sr-section h2 { font-size: clamp(34px, 3.6vw, 49px); line-height: 1.13; letter-spacing: -.03em; text-wrap: balance; }
.sr-refresh .sr-section h3 { letter-spacing: -.02em; }
.sr-refresh .sr-section :where(p, dd) { font-size: 17px; line-height: 1.75; }
.sr-refresh .sr-scope { border-top: 1px solid #becbd5; }
.sr-refresh .sr-question-layout { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 88px; align-items: start; }
.sr-refresh .sr-section-copy h2 { max-width: 12ch; }
.sr-refresh .sr-section-copy p { color: #3a5367; }
.sr-refresh .sr-scope .sp-scope-list { display: block; margin: 0; }
.sr-refresh .sr-scope .sp-scope-list > div { padding: 26px 0; border-top: 1px solid #becbd5; }
.sr-refresh .sr-scope .sp-scope-list > div:first-child { padding-top: 0; border-top: 0; }
.sr-refresh .sr-scope .sp-scope-list > div:last-child { padding-bottom: 0; }
.sr-refresh .sr-question { display: block; font: 700 clamp(24px, 2.35vw, 32px)/1.23 var(--display); letter-spacing: -.025em; color: #102a3d; margin-bottom: 18px; text-wrap: balance; }
.sr-refresh .sr-scope .sp-scope-list dt { font-size: 14px; color: #1261d8; }
.sr-refresh .sr-scope .sp-scope-list dd { margin-top: 5px; color: #3a5367; }
.sr-refresh.service-page--ai-receptionist .sr-scope .sp-scope-list dt { font-size: 25px; color: #102a3d; }
.sr-refresh .sr-scope > :is(h2,p) { max-width: 760px; }
.sr-refresh .sr-scope > .sp-split { margin-top: 40px; align-items: start; gap: 64px; }
.sr-refresh .sr-scope > .sp-split > div { border-top: 1px solid #becbd5; padding-top: 28px; }
.sr-refresh.service-page--ai-chat .sr-scope > .sp-split > div + div { padding: 28px 32px; background: #102a3d; color: #fff; border: 0; }
.sr-refresh.service-page--ai-chat .sr-scope > .sp-split > div + div :is(p, li) { color: #fff; }
.sr-refresh .sr-scope .sp-checklist { grid-template-columns: 1fr; }
.sr-refresh .sr-scope .sp-setup-list { grid-template-columns: 1fr; gap: 0; }
.sr-refresh .sr-scope .sp-setup-list > div { border-top: 1px solid #becbd5; display: grid; grid-template-columns: .85fr 1.15fr; gap: 24px; padding-block: 24px; }
.sr-refresh .sr-scope .sp-setup-list dt { font-size: 19px; }
.sr-refresh .sr-scope .sp-setup-list dd { margin: 0; }
.sr-refresh .sr-scope .sp-status-comparison { display: block; }
.sr-refresh .sr-scope .sp-status-comparison article { background: transparent; border: 0; border-top: 1px solid #becbd5; border-radius: 0; padding: 24px 0; }
.sr-refresh .sr-scope .sp-status-comparison article h3 { color: #102a3d; font-size: 25px; }
.sr-refresh .sr-scope .sp-status-comparison article p { color: #3a5367; }
.sr-refresh .sr-journey { background: #102a3d; color: #fff; border: 0; }
.sr-refresh .sr-journey :is(p,li,dd,dt,h3) { color: #fff; }
.sr-refresh .sr-journey-layout { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 88px; align-items: start; }
.sr-refresh .sr-journey .sp-process { display: block; margin-top: 0; counter-reset: none; }
.sr-refresh .sr-journey .sp-process > li { position: relative; padding: 0 0 28px 32px; border-top: 0; border-left: 1px solid #708b9f; }
.sr-refresh .sr-journey .sp-process > li:last-child { border-left-color: transparent; padding-bottom: 0; }
.sr-refresh .sr-journey .sp-process > li::before { content: ''; position: absolute; width: 11px; height: 11px; left: -6px; top: 7px; border-radius: 50%; background: #ff8529; margin: 0; }
.sr-refresh .sr-journey .sp-process strong { font-size: 22px; line-height: 1.3; }
.sr-refresh .sr-journey .sp-process p { font-size: 16px; }
.sr-refresh .sr-journey .sp-container > .sr-journey-layout + p { margin-top: 36px; max-width: 70ch; padding-top: 24px; border-top: 1px solid #587386; font-size: 14px; }
.sr-refresh .sr-journey .sp-split { align-items: start; gap: 72px; }
.sr-refresh .sr-journey .sp-setup-list { display: block; margin: 0; }
.sr-refresh .sr-journey .sp-setup-list > div { display: grid; grid-template-columns: .8fr 1.2fr; gap: 24px; padding-block: 20px; }
.sr-refresh .sr-journey .sp-setup-list dd { margin: 0; }
.sr-refresh .sr-journey .sp-setup-list > div { border-top: 1px solid #708b9f; }
.sr-refresh .sr-journey .sp-status { border: 0; background: #ffffff0d; padding: 28px; color: #fff; }
.sr-refresh .sr-editorial { display: grid; grid-template-columns: 1fr 1fr; gap: 0 72px; align-items: start; }
.sr-refresh .sr-editorial > h2 { grid-row: span 3; }
.sr-refresh .sr-editorial > p { margin-top: 0; }
.sr-refresh .sr-editorial > p + p { margin-top: 18px; }
.sr-refresh .sr-editorial > .sp-split { grid-column: 1/-1; }
.sr-refresh .sr-editorial > .sp-process { grid-column: 1/-1; margin-top: 36px; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 32px; }
.sr-refresh.service-page--reputation-management .sr-setup { display: block; }
.sr-refresh.service-page--reputation-management .sr-setup-copy { max-width: 760px; margin-bottom: 48px; }
.sr-refresh .sr-setup { display: grid; grid-template-columns: .9fr 1.1fr; gap: 72px; align-items: start; border-top: 1px solid #becbd5; background: #fff; color: #102a3d; }
.sr-refresh .sr-setup:has(> .sp-container) { display: block; background: #f1f4f7; }
.sr-refresh .sr-setup .sr-setup-copy p { color: #3a5367; }
.sr-refresh .sr-setup .sp-checklist { display: block; margin: 0; }
.sr-refresh .sr-setup .sp-checklist > li { padding: 20px 0 20px 32px; border-bottom: 1px solid #becbd5; color: #102a3d; position: relative; }
.sr-refresh .sr-setup .sp-checklist > li::before { top: 26px; color: #1261d8; }
.sr-refresh .sr-setup .sp-split { align-items: start; gap: 72px; }
.sr-refresh .sr-setup :is(p,li,dd) { color: #3a5367; }
.sr-refresh .sr-setup h3 { color: #102a3d; }
.sr-refresh .sr-setup .sp-reveal { margin-top: 36px; }
.sr-refresh .sr-setup .sp-reveal-content .sp-checklist { margin-top: 0; }
.sr-refresh .sr-setup .sp-setup-list { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 56px; margin-top: 48px; }
.sr-refresh .sr-setup .sp-setup-list > div { padding-top: 20px; border-top: 1px solid #becbd5; }
.sr-refresh .sr-setup .sp-setup-list dt { color: #102a3d; font-size: 21px; }
.sr-refresh .sr-setup .sp-setup-list dd { color: #3a5367; }
.sr-refresh .sr-faq { background: #fff; }
.sr-refresh .sr-faq-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 88px; align-items: start; }
.sr-refresh .sr-faq h2 { max-width: 12ch; }
.sr-refresh .sr-faq-link { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; margin-top: 24px; font-size: 15px; font-weight: 700; }
.sr-refresh .sr-faq details { border-color: #becbd5; }
.sr-refresh .sr-faq summary { font-size: 20px; line-height: 1.45; color: #102a3d; padding: 26px 0; }
.sr-refresh .sr-faq summary::after { content: ''; width: 20px; height: 20px; background: linear-gradient(#1261d8,#1261d8) center/16px 2px no-repeat, linear-gradient(#1261d8,#1261d8) center/2px 16px no-repeat; margin-top: 4px; }
.sr-refresh .sr-faq details[open] summary::after { content: ''; background: linear-gradient(#1261d8,#1261d8) center/16px 2px no-repeat; }
.sr-refresh .sr-faq details > p { font-size: 16px; color: #3a5367; padding-right: 30px; }
.sr-refresh .sr-related { display: grid; grid-template-columns: .8fr 1.2fr; gap: 88px; border-top: 1px solid #becbd5; }
.sr-refresh .sr-related h2 { font-size: 32px; max-width: 13ch; }
.sr-refresh .sr-related ul { display: block; margin: 0; }
.sr-refresh .sr-related li { padding: 18px 0; border-bottom: 1px solid #becbd5; }
.sr-refresh .sr-related li:first-child { padding-top: 0; }
.sr-refresh .sr-related a { border: 0; padding: 0 0 8px; display: flex; justify-content: space-between; gap: 16px; font-size: 17px; color: #102a3d; }
.sr-refresh .sr-related li p { margin: 0; font-size: 14px; line-height: 1.7; color: #3a5367; }
.sr-refresh .sr-close { padding-block: 100px; }
.sr-refresh .sr-close h2 { font-size: clamp(40px, 4.4vw, 60px); line-height: 1.1; max-width: 18ch; letter-spacing: -.035em; }
.sr-refresh .sr-close p { max-width: 52ch; }
.sr-refresh .sr-close .sp-container { position: relative; }
.sr-refresh .sr-close .sp-actions { margin-top: 32px; }
.sr-refresh .sr-close .sp-container > .button { margin-top: 32px; }
.sr-refresh :is(.sr-hero,.sr-section) :is(a,button,summary):focus-visible { outline: 3px solid #1261d8; outline-offset: 6px; }
.sr-refresh .sr-journey :is(a,button,summary):focus-visible, .sr-refresh .sr-close :is(a,button,summary):focus-visible { outline-color: #ff8529; }
.sr-refresh :is(.sr-hero,.sr-section) ::selection { background: #1261d8; color: #fff; }
@media (max-width: 1000px) {
 .sr-refresh .sr-hero-layout { gap: 36px; grid-template-columns: 1.05fr 1fr; }
 .sr-refresh .sr-hero h1 { font-size: 48px; }
 .sr-refresh .sr-question-layout,.sr-refresh .sr-journey-layout,.sr-refresh .sr-faq-layout,.sr-refresh .sr-related { gap: 48px; }
 .sr-refresh .sr-setup { gap: 48px; }
 .sr-refresh .sr-hero .sp-actions { align-items: flex-start; flex-direction: column; gap: 12px; }
 .sr-refresh .sr-call-art { height: 540px; }
}
@media (max-width: 760px) {
 .sr-refresh .sr-hero .sp-breadcrumb { margin-bottom: 28px; }
 .sr-refresh .sr-hero-layout { grid-template-columns: 1fr; gap: 40px; padding-bottom: 40px; }
 .sr-refresh .sr-hero h1 { font-size: clamp(39px, 6.9vw, 55px); max-width: 16ch; }
 .sr-refresh .sr-hero .sp-intro { max-width: 58ch; font-size: 17px; }
 .sr-refresh .sr-hero .sp-actions { flex-direction: row; align-items: center; gap: 16px 24px; }
 .sr-refresh .sr-hero-preview { max-width: 520px; width: 100%; margin-inline: auto; }
 .sr-refresh .sr-call-art { height: 400px; }
 .sr-refresh .sr-web-cover { height: 240px; }
 .sr-refresh .sr-web-cover em { font-size: 42px; }
 .sr-refresh .sr-page-path { grid-template-columns: 1fr; gap: 0; padding: 8px 0; }
 .sr-refresh .sr-page-path a { border-bottom: 1px solid #becbd5; padding: 14px 0; min-height: 52px; }
 .sr-refresh .sr-page-path a:last-child { border-bottom: 0; }
 .sr-refresh .sr-section { padding-block: 64px; }
 .sr-refresh .sr-section h2 { font-size: clamp(32px, 5.7vw, 42px); }
 .sr-refresh .sr-question-layout,.sr-refresh .sr-journey-layout,.sr-refresh .sr-faq-layout,.sr-refresh .sr-related,.sr-refresh .sr-setup,.sr-refresh .sr-editorial { grid-template-columns: 1fr; gap: 36px; }
 .sr-refresh .sr-section-copy h2,.sr-refresh .sr-faq h2,.sr-refresh .sr-related h2 { max-width: 18ch; }
 .sr-refresh .sr-journey .sp-split,.sr-refresh .sr-setup .sp-split { grid-template-columns: 1fr; gap: 36px; }
 .sr-refresh .sr-question { font-size: 26px; max-width: 23ch; }
 .sr-refresh .sr-scope > .sp-split { margin-top: 32px; gap: 32px; }
 .sr-refresh .sr-scope .sp-setup-list > div { grid-template-columns: 1fr; gap: 6px; }
 .sr-refresh .sr-scope .sp-setup-list { margin-top: 24px; }
 .sr-refresh .sr-setup .sp-setup-list { grid-template-columns: 1fr; gap: 24px; margin-top: 32px; }
 .sr-refresh .sr-journey .sp-setup-list > div { grid-template-columns: 1fr; gap: 6px; }
 .sr-refresh .sr-editorial > .sp-process { display: block; margin-top: 0; }
 .sr-refresh .sr-editorial .sp-process > li { border-top: 1px solid #becbd5; padding-block: 24px; }
 .sr-refresh .sr-setup .sp-checklist > li { padding-block: 18px; }
 .sr-refresh .sr-faq-link { margin-top: 16px; }
 .sr-refresh .sr-faq summary { font-size: 18px; padding-block: 24px; }
 .sr-refresh .sr-faq details > p { padding-right: 0; }
 .sr-refresh .sr-editorial > h2 { grid-row: auto; }
 .sr-refresh .sr-editorial > p + p { margin-top: -18px; }
 .sr-refresh .sr-close h2 { font-size: clamp(36px, 6vw, 46px); }
 .sr-refresh .sr-close { padding-block: 72px; }
}
@media (prefers-reduced-motion: reduce) {
 .sr-refresh .sr-visual { transition: none; }
 .sr-refresh .sr-visual:hover { transform: none; }
}

/* UI6: restore Ember's color, light and depth to the marketing surfaces only. */
.sr-refresh {
  --sr-feature-start: #255d98;
  --sr-feature-end: #173b55;
  --sr-feature-ink: #174d91;
  --sr-feature-light: #70c9ff;
  --sr-color-glow: #0069ee99;
  --sr-warm-glow: #ff85294d;
}
.sr-refresh[data-service="chat"] {
  --sr-feature-start: #514399; --sr-feature-end: #883d91;
  --sr-feature-ink: #66358d; --sr-feature-light: #d9b9ff;
  --sr-color-glow: #883d91a6; --sr-warm-glow: #a875ff66;
}
.sr-refresh[data-service="reputation"] {
  --sr-feature-start: #963b74; --sr-feature-end: #593d92;
  --sr-feature-ink: #913566; --sr-feature-light: #ffc1de;
  --sr-color-glow: #963b74a6; --sr-warm-glow: #d4932e66;
}
.sr-refresh[data-service="follow-up"] {
  --sr-feature-start: #173b55; --sr-feature-end: #514399;
  --sr-feature-ink: #573892; --sr-feature-light: #d9c5ff;
  --sr-color-glow: #514399a6; --sr-warm-glow: #d4932e80;
}
.sr-refresh[data-service="booking"] {
  --sr-feature-start: #255d98; --sr-feature-end: #326987;
  --sr-feature-ink: #174d91; --sr-feature-light: #70c9ff;
  --sr-color-glow: #0989ff99; --sr-warm-glow: #dd771a66;
}
/* The promise and its actual example share one illuminated stage. */
.service-page.sr-refresh .sr-hero {
  position: relative; isolation: isolate; overflow: hidden; color: #fff;
  background: radial-gradient(ellipse at 95% 24%, var(--sr-color-glow), transparent 62%), radial-gradient(ellipse at 58% 100%, var(--sr-warm-glow), transparent 48%), #071c30;
}
.service-page.sr-refresh .sr-hero::before {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  width: 1050px; height: 800px; right: -570px; top: -230px;
  border: 1px solid #e8b15c70; border-radius: 50%; transform: rotate(-24deg);
}
.service-page.sr-refresh .sr-hero::after {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  width: 1000px; height: 720px; right: -560px; top: -270px;
  border: 1px solid #70c9ff52; border-radius: 50%; transform: rotate(-24deg);
}
.sr-refresh .sr-hero .sp-breadcrumb { color: #fff; padding-top: 32px; }
.sr-refresh .sr-hero .sp-breadcrumb a { border-color: #99bed7; }
.sr-refresh .sr-hero h1 { color: #fff; }
.sr-refresh .sr-hero .sp-intro { color: #fff; }
.sr-refresh .sr-hero .button,
.sr-refresh .sr-close .button { background: linear-gradient(145deg, #ff8b2c, #ff650b); color: #071d2d; border: 0; box-shadow: 0 12px 30px #00000030; font-weight: 800; }
.sr-refresh .sr-hero .button:hover,
.sr-refresh .sr-close .button:hover { background: #ffa252; color: #071d2d; }
.sr-refresh .sr-hero .sp-text-link { color: #fff; border-color: var(--sr-feature-light); }
.sr-refresh .sr-hero .sp-text-link:hover { border-color: #ff8529; }
.sr-refresh .sr-visual { box-shadow: 0 26px 60px #00101d70; }
.sr-refresh .sr-visual:hover { box-shadow: 0 30px 64px #00101d85; }
.sr-refresh .sr-hero-preview figcaption,
.sr-refresh .sr-hero-preview figcaption a { color: #fff; }
.sr-refresh .sr-hero-preview figcaption a svg { color: var(--sr-feature-light); }
.sr-refresh .sr-page-path { border-top-color: #89b0cc66; }
.sr-refresh .sr-page-path a { color: #fff; padding-inline: 12px; border-radius: 8px; }
.sr-refresh .sr-page-path a svg { color: var(--sr-feature-light); }
.sr-refresh .sr-page-path a:hover { color: #fff; background: #ffffff14; }
/* A filled narrative panel gives the customer questions a clear focal point. */
.sr-refresh .sr-question-layout { gap: 56px; align-items: center; }
.sr-refresh .sr-section-copy {
  padding: 40px 36px; border-radius: 16px; color: #fff;
  background: radial-gradient(ellipse at 100% 0, #70c9ff21, transparent 58%), linear-gradient(135deg, var(--sr-feature-start), var(--sr-feature-end));
  box-shadow: 0 18px 40px #102a3d20;
}
.sr-refresh .sr-section-copy h2 { color: #fff; font-size: clamp(32px, 3.3vw, 45px); }
.sr-refresh .sr-section-copy p { color: #fff; }
.sr-refresh .sr-question { color: var(--sr-feature-ink); }
.sr-refresh .sr-scope .sp-scope-list dt { color: #a13f0a; }
.sr-refresh.service-page--ai-receptionist .sr-scope .sp-scope-list dt { color: var(--sr-feature-ink); }
.sr-refresh .sr-scope .sp-scope-list > div { border-top-color: #aabdd2; }
.sr-refresh .sr-scope > h2 { color: var(--sr-feature-ink); }
.sr-refresh .sr-scope .sp-setup-list dt { color: var(--sr-feature-ink); }
.sr-refresh .sr-scope > .sp-split > div:first-child { border-top-color: var(--sr-feature-ink); }
.sr-refresh.service-page--ai-chat .sr-scope > .sp-split > div + div { border-radius: 16px; background: linear-gradient(135deg, #514399, #883d91); box-shadow: 0 18px 40px #4f246624; }
.sr-refresh.service-page--appointment-booking .sr-scope .sp-status-comparison article { padding: 24px; margin-bottom: 20px; border-radius: 12px; border: 1px solid #8cadd0; background: #fff; }
.sr-refresh.service-page--appointment-booking .sr-scope .sp-status-comparison article + article { background: linear-gradient(135deg, #255d98, #326987); border: 0; }
.sr-refresh.service-page--appointment-booking .sr-scope .sp-status-comparison article + article :is(h3,p) { color: #fff; }
/* Sculpted warmth marks the human-owned process, away from the reading measure. */
.service-page.sr-refresh .sr-journey {
  position: relative; isolation: isolate; overflow: hidden;
  background: radial-gradient(ellipse at 95% 85%, #d4932e66, transparent 48%), radial-gradient(ellipse at 0 0, var(--sr-color-glow), transparent 48%), #102a3d;
}
.service-page.sr-refresh .sr-journey::after {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  width: 1100px; height: 520px; right: -780px; bottom: -290px;
  border: 1px solid #e8b15c88; border-radius: 50%; transform: rotate(-24deg);
}
.sr-refresh .sr-journey .sp-process > li::before { background: #ff8529; }
.sr-refresh .sr-journey .sp-process strong,
.sr-refresh .sr-journey .sp-setup-list dt { color: #fff; }
.sr-refresh .sr-editorial > h2,
.sr-refresh .sr-setup h2 { color: var(--sr-feature-ink); }
.sr-refresh .sr-editorial .sp-process > li { border-top-color: var(--sr-feature-ink); }
.sr-refresh .sr-editorial .sp-process > li::before { color: var(--sr-feature-ink); }
.sr-refresh .sr-setup .sp-checklist > li { border-bottom-color: #aabdd2; }
.sr-refresh .sr-setup .sp-checklist > li::before { color: #a13f0a; }
.sr-refresh .sr-setup .sp-setup-list dt { color: var(--sr-feature-ink); }
.sr-refresh .sr-setup:has(> .sp-container) { background: #fff; }
.sr-refresh .sr-setup .sr-setup-content > .sp-checklist { padding: 8px 32px; border-radius: 16px; background: #f1f6fc; box-shadow: 0 18px 40px #102a3d14; }
.sr-refresh .sr-setup .sr-setup-content > .sp-checklist > li:last-child { border-bottom: 0; }
/* FAQ is a distinct darker pause in the page; disclosure states stay explicit. */
.service-page.sr-refresh .sr-faq {
  margin-bottom: 48px; padding: 56px 48px; border-radius: 16px; border: 0;
  color: #fff;
  background: radial-gradient(ellipse at 0 100%, var(--sr-color-glow), transparent 55%), #071c30;
}
.sr-refresh .sr-faq h2 { color: #fff; }
.sr-refresh .sr-faq-link { color: #fff; }
.sr-refresh .sr-faq-link svg { color: #ff8529; }
.sr-refresh .sr-faq-link:hover { color: #ffad6b; }
.sr-refresh .sr-faq details,
.sr-refresh .sr-faq details:first-of-type { border-color: #7ba1bd88; }
.sr-refresh .sr-faq summary { color: #fff; }
.sr-refresh .sr-faq summary:hover { color: #fff; background: #ffffff08; }
.sr-refresh .sr-faq summary::after { background: linear-gradient(#ff8529,#ff8529) center/16px 2px no-repeat, linear-gradient(#ff8529,#ff8529) center/2px 16px no-repeat; }
.sr-refresh .sr-faq details[open] summary::after { background: linear-gradient(#ff8529,#ff8529) center/16px 2px no-repeat; }
.sr-refresh .sr-faq details > p { color: #fff; }
.sr-refresh .sr-faq p a { color: #fff; border-color: var(--sr-feature-light); }
.sr-refresh .sr-related h2 { color: var(--sr-feature-ink); }
.sr-refresh .sr-related a { color: var(--sr-feature-ink); }
.sr-refresh .sr-related a:hover { color: #a13f0a; }
.service-page.sr-refresh .sr-close:not(.sp-close--scenic) {
  background: radial-gradient(ellipse at 100% 100%, #d4932e66, transparent 50%), radial-gradient(ellipse at 0 0, var(--sr-color-glow), transparent 55%), #071c30;
}
.sr-refresh .sr-close p { color: #fff; }
.sr-refresh .sr-hero :is(a,button):focus-visible,
.sr-refresh .sr-faq :is(a,summary):focus-visible { outline-color: #ffad6b; }
@media(max-width: 1000px) {
  .sr-refresh .sr-question-layout { gap: 36px; }
  .sr-refresh .sr-section-copy { padding: 32px 28px; }
  .service-page.sr-refresh .sr-faq { padding: 44px 36px; }
}
@media(max-width: 760px) {
  .service-page.sr-refresh .sr-hero { background: radial-gradient(ellipse at 100% 66%, var(--sr-color-glow), transparent 48%), radial-gradient(ellipse at 0 100%, var(--sr-warm-glow), transparent 42%), #071c30; }
  .service-page.sr-refresh .sr-hero::before { width: 650px; height: 800px; right: -490px; top: 520px; }
  .service-page.sr-refresh .sr-hero::after { width: 630px; height: 780px; right: -490px; top: 495px; }
  .sr-refresh .sr-hero .sp-breadcrumb { padding-top: 24px; }
  .sr-refresh .sr-page-path a { padding-inline: 0; border-color: #89b0cc66; border-radius: 0; }
  .sr-refresh .sr-question-layout { gap: 36px; }
  .sr-refresh .sr-section-copy { padding: 32px 28px; }
  .service-page.sr-refresh .sr-faq { padding: 36px 24px; margin-bottom: 32px; }
  .sr-refresh .sr-faq-layout { gap: 28px; }
  .sr-refresh .sr-setup .sr-setup-content > .sp-checklist { padding-inline: 24px; }
}