/* Equal service cells with quiet subbrand accents and gentle ambient motion. */
.sy-service-map{--map-line:var(--sy-line);position:relative;isolation:isolate;overflow:clip;background:var(--sy-surface);color:var(--sy-ink);padding:80px 48px 64px;scroll-margin-top:96px}
.sy-service-map-container{max-width:1248px;margin-inline:auto}
.sy-service-map-heading{text-align:center;max-width:780px;margin:0 auto 48px}
.sy-service-map-eyebrow{display:inline-flex;align-items:center;gap:9px;margin:0 0 24px;padding:7px 12px;border:1px solid var(--sy-line);border-radius:8px;font-size:12px;font-weight:500;letter-spacing:.08em;line-height:1.4}
.sy-service-map-eyebrow i{width:7px;height:7px;background:var(--sy-accent);border:1px solid #879b39;border-radius:50%}
.sy-service-map h2{margin:0;font-size:clamp(40px,4.4vw,62px);font-weight:600;line-height:1.08;letter-spacing:-.045em}
.sy-service-map h2>span{display:inline-block;color:var(--sy-ink);background:var(--sy-accent);padding:0 .07em .06em;border-radius:10px}
.sy-service-map-intro{max-width:600px;margin:24px auto 0;font-size:16px;line-height:1.65;color:var(--sy-muted)}
/* Every row shares one unit; feature cards always span two units. */
.sy-service-map-grid{position:relative;isolation:isolate;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(6,minmax(112px,1fr));grid-auto-rows:minmax(112px,1fr);gap:1px;border:1px solid var(--map-line);border-radius:18px;overflow:hidden;background:var(--map-line)}
.sy-map-color-seo{--map-color:#4f6415;--map-rgb:158,190,49;--map-tint:#f5f8e9}
.sy-map-color-ads,.sy-map-color-social{--map-color:#a0461b;--map-rgb:255,121,46;--map-tint:#fff3eb}
.sy-map-color-web,.sy-map-color-care{--map-color:#12678b;--map-rgb:57,191,255;--map-tint:#eef9ff}
.sy-map-color-it{--map-color:#6745a3;--map-rgb:161,124,255;--map-tint:#f5f0ff}
.sy-map-item{grid-column:var(--tile-column);grid-row:var(--tile-row);min-width:0;background:#fafaf7}
.sy-map-item>a{position:relative;isolation:isolate;display:flex;height:100%;min-height:104px;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px 10px;text-align:center;font-size:12px;font-weight:500;line-height:1.35;color:#51554b;overflow-wrap:anywhere}
.sy-map-item>a::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--map-tint);opacity:0}
.sy-map-item-ambient{position:absolute;inset:0;z-index:-2;pointer-events:none;opacity:0;background:linear-gradient(135deg,rgba(var(--map-rgb),.22),rgba(var(--map-rgb),.05))}
.sy-map-item>a::after{content:'↗';position:absolute;right:10px;top:8px;font-size:14px;color:var(--map-color);opacity:0}
.sy-map-item-icon{display:block;height:25px;color:#70776b}
.sy-map-item-icon>svg{display:block;width:25px;height:25px;stroke-width:1.65}
.sy-map-item>a>span:last-child{display:flex;align-items:center;justify-content:center;min-height:2.7em}
.sy-map-item>a:is(:hover,:focus-visible){z-index:2;color:var(--sy-ink)}
.sy-map-item>a:is(:hover,:focus-visible)::before,.sy-map-item>a:is(:hover,:focus-visible)::after{opacity:1}
.sy-map-item>a:is(:hover,:focus-visible) .sy-map-item-icon{color:var(--map-color)}
.sy-map-item>a:focus-visible,.sy-map-feature>a:focus-visible{outline:2px solid var(--map-color);outline-offset:-5px}
.sy-map-feature{position:relative;min-width:0;color:var(--sy-ink);background:#fff}
.sy-map-feature-seo{grid-column:3/span 2;grid-row:2/span 2}
.sy-map-feature-ads{grid-column:5/span 2;grid-row:2/span 2}
.sy-map-feature-web{grid-column:3/span 2;grid-row:4/span 2}
.sy-map-feature-it{grid-column:5/span 2;grid-row:4/span 2}
.sy-map-feature>a{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;height:100%;padding:24px;overflow:hidden;background:radial-gradient(ellipse at 0% 0%,var(--map-tint),#fff 80%)}
.sy-map-feature>a::after{content:"";position:absolute;inset:0;z-index:-1;box-shadow:inset 0 0 0 1px rgba(var(--map-rgb),.35);background:rgba(var(--map-rgb),.025);opacity:0}
.sy-map-feature>a:is(:hover,:focus-visible)::after{opacity:1}
.sy-map-feature-top{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;font-size:9px;line-height:1.4;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--map-color)}
.sy-map-feature-top>svg{width:14px;height:14px;flex:none}
.sy-map-feature-visual{display:flex;align-items:center;gap:18px;width:100%;margin:18px 0 16px;pointer-events:none}
.sy-map-feature-lines{position:relative;display:block;width:84px;height:14px;overflow:hidden;background:linear-gradient(90deg,rgba(var(--map-rgb),.34),transparent) left top/100% 1px no-repeat,linear-gradient(90deg,rgba(var(--map-rgb),.24),transparent) left bottom/65% 1px no-repeat}
.sy-map-feature-pulse{position:absolute;inset:0 auto 0 0;width:32px;opacity:0;background:linear-gradient(90deg,transparent,rgba(var(--map-rgb),.9),transparent) left top/100% 2px no-repeat,linear-gradient(90deg,transparent,rgba(var(--map-rgb),.65),transparent) left bottom/100% 2px no-repeat}
.sy-map-feature-glow{position:absolute;inset:-16px;z-index:-1;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 45% 40%,rgba(var(--map-rgb),.32),transparent 72%)}
.sy-map-feature-symbol{display:grid;place-items:center;flex:none;width:50px;height:50px;margin:0;color:var(--map-color);border:1px solid rgba(var(--map-rgb),.12);border-radius:13px;background:#fff;box-shadow:0 3px 5px -2px rgba(var(--map-rgb),.25)}
.sy-map-feature-symbol>svg{width:27px;height:27px;stroke-width:1.6;transform-origin:center;transform-box:fill-box}
.sy-map-feature-name{display:block;font-size:clamp(20px,1.85vw,27px);font-weight:600;line-height:1.18;letter-spacing:-.035em}
.sy-map-feature-description{display:block;font-size:13px;line-height:1.5;color:var(--sy-muted);margin-top:9px;max-width:240px}
.sy-map-item>a::before,.sy-map-item>a::after,.sy-map-feature>a::after{transition:opacity .24s ease}
.sy-map-item-icon,.sy-map-feature-symbol,.sy-map-feature-top>svg{transition:transform .3s var(--sy-ease),color .24s ease}
.sy-map-feature>a:focus-visible .sy-map-feature-symbol,.sy-map-item>a:focus-visible .sy-map-item-icon{transform:translateY(-2px)}
.sy-map-feature>a:focus-visible .sy-map-feature-top>svg{transform:translate(1px,-1px)}
@media(hover:hover){.sy-map-feature>a:hover .sy-map-feature-symbol,.sy-map-item>a:hover .sy-map-item-icon{transform:translateY(-2px)}.sy-map-feature>a:hover .sy-map-feature-top>svg{transform:translate(1px,-1px)}}
.sy-service-map-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:24px;padding-top:24px;border-top:1px solid var(--sy-line);font-size:13px}
.sy-service-map-footer>p{display:flex;align-items:center;gap:12px;color:var(--sy-muted);margin:0}
.sy-service-map-footer>p>span{display:grid;place-items:center;flex:none;width:30px;height:30px;background:var(--sy-bg);border:1px solid var(--sy-line);border-radius:8px;font-size:17px;color:var(--sy-ink)}
.sy-service-map-footer>a{min-height:48px;padding:0 18px;gap:24px;border-radius:10px;flex-shrink:0;font-size:13px}
.sy-service-map-footer>a>svg{width:18px;height:18px}
/* Color alone connects each main card to its services; no moving illustrations. */
.sy-service-map-grid:has(.sy-map-feature-seo>a:is(:hover,:focus-visible)) .sy-map-item.sy-map-color-seo>a::before,
.sy-service-map-grid:has(.sy-map-feature-ads>a:is(:hover,:focus-visible)) .sy-map-item:is(.sy-map-color-ads,.sy-map-color-social)>a::before,
.sy-service-map-grid:has(.sy-map-feature-web>a:is(:hover,:focus-visible)) .sy-map-item.sy-map-color-web>a::before,
.sy-service-map-grid:has(.sy-map-feature-it>a:is(:hover,:focus-visible)) .sy-map-item:is(.sy-map-color-care,.sy-map-color-it)>a::before{opacity:1}
.sy-service-map-grid:has(.sy-map-item.sy-map-color-seo>a:is(:hover,:focus-visible)) .sy-map-feature-seo>a::after,
.sy-service-map-grid:has(.sy-map-item:is(.sy-map-color-ads,.sy-map-color-social)>a:is(:hover,:focus-visible)) .sy-map-feature-ads>a::after,
.sy-service-map-grid:has(.sy-map-item.sy-map-color-web>a:is(:hover,:focus-visible)) .sy-map-feature-web>a::after,
.sy-service-map-grid:has(.sy-map-item:is(.sy-map-color-care,.sy-map-color-it)>a:is(:hover,:focus-visible)) .sy-map-feature-it>a::after{opacity:1}
@media(max-width:1100px){.sy-service-map{padding:80px 32px 64px}.sy-map-feature>a{padding:20px}.sy-map-feature-top{font-size:8px}.sy-map-feature-name{font-size:22px}.sy-map-item>a{padding:16px 8px;font-size:11px}}
@media(max-width:900px){.sy-service-map{padding:72px 24px 56px}.sy-service-map-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:minmax(108px,1fr)}.sy-map-feature{grid-column:auto/span 2;grid-row:auto/span 2}.sy-map-feature>a{padding:24px}.sy-map-feature-top{font-size:9px}.sy-map-feature-name{font-size:27px}.sy-map-feature-description{max-width:260px}.sy-map-item{grid-column:auto;grid-row:auto}.sy-map-item>a{font-size:12px}.sy-service-map-footer{gap:20px}.sy-service-map-footer>p{max-width:340px}}
@media(max-width:600px){.sy-service-map{padding:64px 22px 48px}.sy-service-map-heading{margin-bottom:32px}.sy-service-map h2{font-size:36px}.sy-service-map h2>span{border-radius:6px}.sy-service-map-intro{font-size:14px;margin-top:18px}.sy-service-map-grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(96px,1fr)}.sy-map-item{grid-column:auto/span 2}.sy-map-feature{grid-column:auto/span 3}.sy-map-feature>a{padding:16px 14px}.sy-map-feature-top{font-size:8px;letter-spacing:.015em;min-height:22px}.sy-map-feature-top>svg{width:12px;height:12px}.sy-map-feature-visual{gap:12px;margin:16px 0 14px}.sy-map-feature-lines{width:48px;height:12px}.sy-map-feature-symbol{width:40px;height:40px;border-radius:11px}.sy-map-feature-symbol>svg{width:24px;height:24px}.sy-map-feature-name{font-size:22px}.sy-map-feature-description{display:none}.sy-map-item>a{min-height:96px;font-size:12px;gap:9px;padding:14px 10px}.sy-map-item-icon,.sy-map-item-icon>svg{width:23px;height:23px}.sy-service-map-footer{display:grid;gap:12px;margin-top:24px}.sy-service-map-footer>p{align-items:flex-start}.sy-service-map-footer>a{justify-self:start}}
@media(max-width:360px){.sy-service-map{padding-inline:18px}.sy-service-map h2{font-size:31px}.sy-map-item{grid-column:auto/span 3}.sy-map-feature>a{padding:16px 12px}.sy-map-feature-name{font-size:19px}.sy-map-feature-top{font-size:7px;gap:4px}.sy-map-feature-visual{gap:10px}}
@media(forced-colors:active){.sy-map-feature>a,.sy-map-item>a{background:Canvas;color:CanvasText}.sy-service-map-grid{border-color:CanvasText}.sy-map-item,.sy-map-feature{outline:1px solid CanvasText;outline-offset:-1px}.sy-map-item-icon,.sy-map-feature-top,.sy-map-feature-symbol,.sy-map-feature-description,.sy-service-map-intro,.sy-service-map h2>span{color:CanvasText}.sy-map-item>a::before,.sy-map-item>a::after,.sy-map-feature>a::after,.sy-map-feature-lines,.sy-map-feature-glow{display:none}.sy-service-map a:focus-visible{outline:2px solid Highlight}.sy-map-feature-symbol{background:Canvas;border:1px solid CanvasText}}
@media(max-width:650px){.sy-service-map-eyebrow{font-size:12px;margin-bottom:19px}}

/* Motion controls preserve the complete static layout. */
@media(prefers-reduced-motion:reduce),(forced-colors:active){.sy-service-map *,.sy-service-map *::before,.sy-service-map *::after{transition:none!important}.sy-map-feature-glow,.sy-map-feature-pulse,.sy-map-item-ambient{opacity:0!important}.sy-map-item-icon,.sy-map-feature-symbol,.sy-map-feature-symbol>svg,.sy-map-feature-top>svg{transform:none!important}}
.is-motion-paused .sy-service-map *,.is-motion-paused .sy-service-map *::before,.is-motion-paused .sy-service-map *::after{transition:none!important}
.is-motion-paused .sy-service-map .sy-map-item-icon,.is-motion-paused .sy-service-map .sy-map-feature-symbol,.is-motion-paused .sy-service-map .sy-map-feature-top>svg{transform:none!important}