/* /wat/ consumer only. Type, buttons and header follow the central kit. */
.services-overview{background:#f5f5f2;color:#101117}
.services-overview .container{box-sizing:border-box;width:100%;max-width:1280px;padding-inline:40px;margin-inline:auto}
.services-overview .overview-hero{padding:170px 0 80px;background:#101117;color:#fff}
.services-overview .overview-hero h1{margin:0 0 28px}
.services-overview p{font-family:Effra,sans-serif;font-size:19px;line-height:1.55;margin:0 0 22px}
.services-overview .overview-lead{color:#c7c7ce}
.services-overview .overview-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px}
.services-overview .overview-accent--brand{--overview-accent:#7054ad;--overview-on-accent:#fff}
.services-overview .overview-accent--web{--overview-accent:#0056dc;--overview-on-accent:#fff}
.services-overview .overview-accent--systems{--overview-accent:#ef8065;--overview-on-accent:#101117}
.services-overview .overview-icon{display:inline-grid;place-items:center;flex:0 0 56px;width:56px;height:56px;border-radius:50%;background:var(--overview-accent);color:var(--overview-on-accent);font-size:23px}
.services-overview .overview-choice{display:flex;align-items:center;gap:16px;min-width:0;padding:22px;background:#21212d;border-radius:18px;color:#fff;text-decoration:none;font-size:20px;font-weight:700;line-height:1.25;transition:background .2s ease}
.services-overview .overview-choice>span:nth-child(2){flex:1;min-width:0}
.services-overview .overview-choice>i{font-size:14px}
.services-overview .overview-choice:hover{background:#13131c}
.services-overview a:focus-visible{outline:2px solid #4386ff;outline-offset:5px}
.services-overview .overview-area{padding:88px 0;scroll-margin-top:100px;background:#f5f5f2;color:#101117}
.services-overview .overview-area:nth-of-type(3){background:#fff}
.services-overview .overview-area__heading{display:flex;gap:20px;align-items:center;margin-bottom:44px}
.services-overview .overview-area__heading h2{margin:0}
.services-overview .overview-area__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px;align-items:center}
.services-overview .overview-area__visual{margin:0;min-width:0;overflow:hidden;border-radius:22px;aspect-ratio:1.1;background:#e6e6e2}
.services-overview .overview-area__visual img{display:block;width:100%;height:100%;object-fit:cover}
.services-overview .overview-area__copy{min-width:0}
.services-overview .overview-area__copy h3{margin:0 0 22px}
.services-overview .overview-value{font-weight:700}
.services-overview .overview-services{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 20px;padding:0;margin:28px 0 32px;list-style:none}
.services-overview .overview-services li{position:relative;padding-left:15px;font-size:17px;line-height:1.4}
.services-overview .overview-services li::before,.services-overview .overview-services li::after{content:none!important;display:none!important}
.services-overview .overview-services li{list-style:none;padding-left:0}
.services-overview .overview-deep-link{margin:22px 0 0;font-size:16px}
.services-overview .overview-deep-link a{color:inherit;text-decoration:none}
.services-overview .overview-deep-link i{margin-left:7px;font-size:12px}
.services-overview .overview-direction{padding:88px 0;background:#13131c;color:#fff}
.services-overview .overview-direction h2{margin:0 0 26px}
.services-overview .overview-direction p{color:#c7c7ce}
.services-overview .overview-actions{display:flex;flex-wrap:wrap;gap:18px;margin-top:30px}
@media(max-width:900px){.services-overview .overview-choices{grid-template-columns:1fr}.services-overview .overview-area__grid{gap:32px}.services-overview .overview-services{grid-template-columns:1fr}}
@media(max-width:767px){.services-overview .container{padding-inline:18px}.services-overview .overview-hero{padding:135px 0 55px}.services-overview .overview-choices{margin-top:32px;gap:12px}.services-overview .overview-choice{padding:18px;font-size:18px}.services-overview .overview-area,.services-overview .overview-direction{padding:56px 0}.services-overview .overview-area__grid{grid-template-columns:1fr;gap:28px}.services-overview .overview-area__heading{gap:14px;margin-bottom:26px}.services-overview .overview-icon{width:48px;height:48px;flex-basis:48px;font-size:21px}.services-overview .overview-area__visual{aspect-ratio:1.3}.services-overview p{font-size:18px}.services-overview .overview-services{grid-template-columns:1fr}.services-overview .overview-actions{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.services-overview .overview-choice{transition:none}}

/* Center icon glyphs independently of their font baseline. */
.services-overview .overview-icon i{display:grid;place-items:center;width:1em;height:1em;line-height:1}
body .services-overview.services-overview .overview-area .overview-area__heading h2{margin:0!important;padding-block:0;align-self:center}

/* Review 3: a composed service visual, with the existing photograph as its main layer. */
.services-overview .overview-icon i{display:flex!important;align-items:center!important;justify-content:center!important;width:32px!important;height:32px!important;line-height:1!important;margin:0!important;padding:0!important}
.services-overview .overview-icon i::before{display:block!important;position:static!important;line-height:1!important;margin:0!important;padding:0!important;transform:none!important;text-align:center}
.services-overview .overview-services{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 30px}
.services-overview .overview-services li{display:inline-flex;align-items:center;min-height:36px;padding:7px 14px;border-radius:999px;background:#e6e6e2;color:#101117;font:400 16px/1.35 Effra,sans-serif;list-style:none}
.services-overview .overview-composition{position:relative;isolation:isolate;aspect-ratio:1.06;padding:24px 24px 0;display:flex;flex-direction:column;justify-content:space-between;background:#e6e6e2;overflow:hidden}
.services-overview .overview-composition::before{content:'';position:absolute;z-index:-1;width:76%;aspect-ratio:1;border-radius:50%;right:-17%;top:-14%;background:var(--overview-accent);opacity:.16}
.services-overview .overview-composition__photo{position:relative;width:100%;height:calc(100% - 92px);min-height:0;overflow:hidden;border-radius:15px;background:#fff}
.services-overview .overview-composition__photo img{display:block;object-fit:cover;width:100%;height:100%}
.services-overview .overview-composition--brand .overview-composition__photo{width:89%;height:calc(100% - 88px);align-self:flex-start}
.services-overview .overview-brand-sheet{position:absolute;right:20px;bottom:93px;display:flex;flex-direction:column;gap:10px;width:35%;padding:18px;background:#fff;border-radius:12px;box-shadow:0 8px 24px #10111714;transform:rotate(5deg)}
.services-overview .overview-brand-sheet__type{font-family:var(--wab-font-heading);font-size:clamp(36px,4vw,62px);line-height:1;color:#7054ad}
.services-overview .overview-swatches{display:flex;gap:5px}
.services-overview .overview-swatches span{width:24px;height:24px;border-radius:50%;background:#7054ad}
.services-overview .overview-swatches span:nth-child(2){background:#101117}.services-overview .overview-swatches span:nth-child(3){background:#f5f5f2;border:1px solid #e6e6e2}
.services-overview .overview-brand-sheet__label{font:700 12px/1.3 Effra,sans-serif}
.services-overview .overview-composition__tools{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:22px 0;min-height:82px;position:relative}
.services-overview .overview-tool{display:inline-flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:9px 13px;color:#101117;font:700 14px/1.3 Effra,sans-serif}
.services-overview .overview-tool img{width:23px;height:23px;object-fit:contain;border-radius:0}
.services-overview .overview-tool i{display:flex;align-items:center;justify-content:center;line-height:1;width:20px;height:20px;color:var(--overview-accent)}
.services-overview .overview-tool i::before{position:static;line-height:1}
.services-overview .overview-composition__stamp{position:absolute;right:12px;top:34%;width:74px;height:74px;display:grid;place-items:center;background:#0056dc;color:#fff;border-radius:50%;font-size:29px;box-shadow:0 8px 20px #10111714}
.services-overview .overview-composition__stamp i,.services-overview .overview-composition__stamp i::before{display:block;line-height:1}
.services-overview .overview-workflow{position:absolute;bottom:100px;left:50%;transform:translateX(-50%);width:76%;display:flex;align-items:center;padding:14px;background:#fff;border-radius:14px;box-shadow:0 8px 24px #10111714}
.services-overview .overview-workflow>span:not(.overview-workflow__line){width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;background:#ef8065;color:#101117;border-radius:50%;font-size:19px}
.services-overview .overview-workflow i,.services-overview .overview-workflow i::before{display:block;line-height:1}
.services-overview .overview-workflow__line{flex:1;height:2px;background:#ef8065}
@media(max-width:767px){.services-overview .overview-composition{aspect-ratio:1.08;padding:16px 16px 0}.services-overview .overview-composition__tools{gap:6px;padding:16px 0;min-height:76px}.services-overview .overview-tool{font-size:12px;padding:8px 9px;gap:6px}.services-overview .overview-tool img{width:20px;height:20px}.services-overview .overview-brand-sheet{right:13px;bottom:91px;padding:13px;width:36%;gap:7px}.services-overview .overview-brand-sheet__type{font-size:42px}.services-overview .overview-brand-sheet__label{font-size:10px}.services-overview .overview-swatches span{width:19px;height:19px}.services-overview .overview-composition__stamp{width:56px;height:56px;font-size:23px;right:8px}.services-overview .overview-workflow{bottom:88px;padding:10px;width:80%}.services-overview .overview-workflow>span:not(.overview-workflow__line){width:36px;height:36px;flex-basis:36px;font-size:16px}}

.services-overview .overview-services{align-items:flex-start}
.services-overview .overview-services li{margin:0!important}
.services-overview .overview-tool .fa-openai{color:#101117}
.services-overview .overview-area__link{color:inherit;text-decoration:none!important;border-radius:22px;cursor:pointer}
.services-overview .overview-area__link:focus-visible{outline:3px solid var(--overview-accent);outline-offset:10px}
.services-overview .overview-area__link .overview-area__action{pointer-events:none}
.services-overview .overview-area__link:hover .overview-area__action{box-shadow:0 0 0 3px #f5f5f2,0 0 0 5px var(--overview-accent)}
.services-overview .overview-deep-link{margin-top:24px}
.services-overview .overview-tool img{width:27px;height:27px;object-fit:contain!important}

/* Review 4: clear service colours; existing brand marks, no partner status claim. */
.services-overview .overview-composition{background:var(--overview-accent)}
.services-overview .overview-composition::before{background:#fff;opacity:1;width:42%;right:-21%;top:-25%}
.services-overview .overview-tool .fa-meta{color:#0866ff}
.services-overview .overview-tool .fa-youtube{color:#f00}
.services-overview .overview-tool .fa-brands::before{line-height:1!important;position:static!important}
.services-overview .overview-composition--web .overview-composition__stamp{border:3px solid #fff}
.services-overview .overview-composition--brand .overview-brand-sheet{box-shadow:0 8px 24px #10111724}

/* Review 5: clearer selection, connected service stories and a quieter photographic rhythm. */
.services-overview .overview-choice>span:nth-child(2){display:flex;flex-direction:column;gap:7px}
.services-overview .overview-choice strong{font:700 19px/1.25 Effra,sans-serif}
.services-overview .overview-choice small{font:400 16px/1.35 Effra,sans-serif;color:#d4d4dc}
.services-overview .overview-area__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;row-gap:24px;align-items:start}
.services-overview .overview-area__heading{grid-column:2;grid-row:1;margin:0;gap:18px}
.services-overview .overview-area__visual{grid-column:1;grid-row:1/span 2;align-self:center}
.services-overview .overview-area__copy{grid-column:2;grid-row:2}
.services-overview .overview-area__copy h3{margin-bottom:20px}
.services-overview #websites .overview-area__heading,.services-overview #websites .overview-area__copy{grid-column:1}
.services-overview #websites .overview-area__visual{grid-column:2}
.services-overview .overview-composition{padding:20px 20px 0;aspect-ratio:1.03}
.services-overview .overview-composition::before{content:none}
.services-overview .overview-composition--brand .overview-composition__photo{width:100%}
.services-overview .overview-brand-sheet{width:30%;bottom:87px;right:14px;padding:14px;transform:rotate(4deg)}
.services-overview .overview-brand-sheet__type{font-size:48px}
.services-overview .overview-brand-sheet__label{font-size:11px}
.services-overview .overview-composition__tools{min-height:80px;padding:20px 0;gap:8px}
.services-overview .overview-value{padding-left:18px;border-left:3px solid var(--overview-accent)}
.services-overview .overview-services{margin-top:24px}
.services-overview .overview-area{padding-block:80px}
@media(min-width:768px) and (max-width:1050px){.services-overview .overview-area__grid{column-gap:32px}.services-overview .overview-area__heading{gap:12px;flex-wrap:wrap}}
@media(max-width:767px){
 .services-overview .overview-choice strong{font-size:18px}.services-overview .overview-choice small{font-size:15px}
 .services-overview .overview-area{padding-block:56px}
 .services-overview .overview-area__grid{grid-template-columns:minmax(0,1fr);gap:26px}
 .services-overview .overview-area .overview-area__heading,.services-overview #websites .overview-area__heading{grid-column:1;grid-row:1;gap:14px}
 .services-overview .overview-area .overview-area__visual,.services-overview #websites .overview-area__visual{grid-column:1;grid-row:2}
 .services-overview .overview-area .overview-area__copy,.services-overview #websites .overview-area__copy{grid-column:1;grid-row:3}
 .services-overview .overview-composition{padding:16px 16px 0;aspect-ratio:1.08}
 .services-overview .overview-composition__tools{padding:16px 0;min-height:76px;gap:6px}
 .services-overview .overview-brand-sheet{width:30%;padding:11px;bottom:87px;right:12px}
 .services-overview .overview-brand-sheet__type{font-size:34px}.services-overview .overview-brand-sheet__label{font-size:9px}
}
/* Freestanding SVG compositions; entire service anchor remains clickable. */
body .services-overview .overview-area__visual.overview-composition{display:block!important;position:relative!important;background:transparent!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important;aspect-ratio:auto!important;min-height:0!important;height:auto!important;isolation:auto!important}
body .services-overview .overview-service-art{display:block!important;width:100%!important;height:auto!important;max-height:none!important;max-width:none!important;object-fit:contain!important;aspect-ratio:4/3!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;transform:none!important}
body .services-overview .overview-area__visual::before,body .services-overview .overview-area__visual::after{content:none!important;display:none!important}

/* Service overview: photo opening and native stacked work-area sections. */
.services-overview .overview-hero--photo{position:relative;isolation:isolate;overflow:hidden}
.services-overview .overview-hero__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%;z-index:-2}
.services-overview .overview-hero--photo:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#101117e8,#101117b8 65%,#10111780);z-index:-1;pointer-events:none}
.services-overview .overview-stack{position:relative;isolation:isolate}
@media(min-width:1001px) and (min-height:740px){.services-overview .overview-stack>.overview-area{position:sticky;top:80px;min-height:0;padding-block:64px;box-shadow:0 -14px 36px #10111712;border-radius:24px 24px 0 0}.services-overview .overview-stack>.overview-area:nth-child(1){z-index:1}.services-overview .overview-stack>.overview-area:nth-child(2){z-index:2}.services-overview .overview-stack>.overview-area:nth-child(3){z-index:3}}
@media(max-width:767px){.services-overview .overview-hero__photo{object-position:50% 40%}.services-overview .overview-hero--photo:before{background:#101117cc}}

/* Only /wat/: overflow-x:hidden on body creates a competing scroll container. */
@supports(overflow:clip){html:has(main.services-overview),body:has(main.services-overview){overflow-x:clip!important;overflow-y:visible!important}}

@media(max-width:767px){.services-overview .overview-hero--photo{padding:220px 0 54px}.services-overview .overview-hero__photo{inset:0 0 auto;height:auto;aspect-ratio:1672/941;object-fit:cover;object-position:50% 42%}.services-overview .overview-hero--photo:before{background:linear-gradient(180deg,#10111755 0,#10111722 100px,#101117 230px)}}

@media(max-width:767px){.services-overview .overview-hero--photo{--svc-photo-top:90px;padding-top:calc(var(--svc-photo-top) + 100vw * 941 / 1672 + 24px)}.services-overview .overview-hero__photo{top:var(--svc-photo-top)}.services-overview .overview-hero--photo:before{background:linear-gradient(180deg,#101117 0,var(--svc-photo-top),#10111722 calc(var(--svc-photo-top) + 60px),#101117 calc(var(--svc-photo-top) + 100vw * 941 / 1672 + 8px))}}
@media(max-width:485px){.services-overview .overview-hero--photo{--svc-photo-top:134px}}

/* Compact content-led stack: no viewport-height runway; preserve native sticky overlap. */
@media(max-width:1000px){.services-overview .overview-stack>.overview-area{padding-block:56px}}
@media(max-width:767px){.services-overview .overview-stack>.overview-area{padding-block:44px}}

/* Desktop face-safe area; mobile keeps its existing separate image band. */
@media(min-width:768px){body.wab-local-ui-contract .services-overview .overview-hero--photo{padding-top:420px!important;padding-bottom:64px!important}body.wab-local-ui-contract .services-overview .overview-hero__photo{object-position:50% 15%!important}body.wab-local-ui-contract .services-overview .overview-hero--photo:before{background:linear-gradient(180deg,#10111744 0,#10111766 300px,#101117e8 440px,#101117f5 100%)!important}}

/* Bounded /wat/ simplification: content and sticky mechanics retained. */
body.wab-local-ui-contract .services-overview--calm .overview-hero--calm{position:relative;background:#101117!important;padding:160px 0 64px!important;min-height:0}
.services-overview--calm .overview-hero--calm>.container{padding-block:0!important}
.services-overview--calm .overview-hero--calm h1{margin-bottom:24px}
.services-overview--calm .overview-hero--calm .overview-lead{margin-bottom:0}
body.wab-local-ui-contract .services-overview--calm .overview-area__heading{display:block}
.services-overview--calm .overview-area__descriptor{margin:12px 0 0;color:#5b6068}
body.wab-local-ui-contract .services-overview--calm .overview-services{display:block!important;margin-block:24px!important;padding:0!important;list-style:none!important}
body.wab-local-ui-contract .services-overview--calm .overview-services>li{display:block!important;padding:0!important;margin:0 0 8px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
body.wab-local-ui-contract .services-overview--calm .overview-stack>.overview-area{border-radius:0!important;box-shadow:none!important}
.services-overview--calm .overview-area__grid{row-gap:32px}
@media(max-width:767px){body.wab-local-ui-contract .services-overview--calm .overview-hero--calm{padding:145px 0 40px!important}.services-overview--calm .overview-area__descriptor{margin-top:10px}}

body.wab-local-ui-contract .services-overview.services-overview--calm .overview-hero.overview-hero--calm .overview-lead{width:100%!important;max-width:70ch!important;margin-inline:auto!important}
