﻿/* Homepage: calm, local, approachable technology support. */
body.site-theme { --bg:#f8fafc; --bg-elev:#fff; --fg:#19344f; --muted:#52677b; --border:#dce5ec; --accent:#c92d3a; --shadow:0 8px 22px #19344f10; background:var(--bg); color:var(--fg); font-family:'DM Sans',sans-serif; }
.site-theme::before,.site-theme::after { display:none; }
.site-theme .container { width:min(1200px,88%); }
.site-theme h1,.site-theme h2,.site-theme h3 { font-family:'Manrope',sans-serif; }
.site-theme a:focus-visible,.site-theme button:focus-visible { outline:3px solid #315f85; outline-offset:5px; }
.skip-link { position:fixed; top:-80px; left:16px; z-index:2000; padding:12px 20px; background:#fff; color:#19344f; }
.skip-link:focus { top:12px; }
.site-theme .site-header { background:#f8fafcf5; border-bottom:1px solid var(--border); backdrop-filter:blur(12px); }
.site-theme .header-inner { min-height:91px; padding:12px 0; }
.site-theme .logo-img { width:49px; }
.site-theme .logo-text { font:800 16px 'Manrope',sans-serif; letter-spacing:-.5px; }
.site-theme .primary-nav ul { gap:32px; align-items:center; }
.site-theme .primary-nav a { font-size:14px; font-weight:600; padding:10px 0; }
.site-theme .primary-nav a::after { display:none; }
.site-theme .primary-nav .nav-call { display:block; padding:11px 18px; border:1px solid var(--accent); border-radius:6px; color:var(--accent); white-space:nowrap; }
.site-theme .home-hero { padding:76px 0 65px; text-align:left; overflow:hidden; background:none; }
.site-theme .home-hero-grid { display:grid; grid-template-columns:1.08fr 1fr; align-items:center; gap:50px; }
.site-theme .eyebrow { color:#52677b; font:700 11px/1.6 'DM Sans',sans-serif; text-transform:uppercase; letter-spacing:1.7px; margin:0 0 22px; }
.location-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#648e77; margin-right:8px; vertical-align:middle; }
.site-theme .home-hero h1 { font-size:clamp(42px,4.6vw,65px); font-weight:800; line-height:1.12; letter-spacing:-3px; margin:0 0 25px; max-width:650px; }
.site-theme .home-hero h1 span { color:#47769a; display:block; }
.site-theme .hero-lead { color:var(--muted); font-size:16px; line-height:1.85; max-width:475px; margin:0 0 29px; }
.site-theme .actions { display:flex; flex-wrap:wrap; gap:26px; align-items:center; justify-content:flex-start; }
.site-theme .btn { border-radius:6px; padding:15px 22px; font-size:13px; min-height:48px; }
.site-theme .btn-primary { background:var(--accent); box-shadow:none; color:#fff; gap:25px; }
.site-theme .btn-primary:hover { background:#aa2330; }
.site-theme .btn-primary::before { display:none; }
.site-theme .text-link { font-size:13px; font-weight:700; display:inline-flex; gap:15px; align-items:center; min-height:44px; }
.site-theme .text-link:hover { color:var(--accent); }
.site-theme .service-note { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:11px; color:var(--muted); margin-top:25px; letter-spacing:0; }
.site-theme .service-note span { color:#557b64; }
.site-theme .service-note span:nth-child(2) { margin-left:10px; }
.home-scene { position:relative; background:#eaf0f5; border-radius:24px; min-width:0; padding:30px 5px 22px; }
.home-scene svg { display:block; width:100%; height:auto; }
.scene-caption { text-align:center; color:#52677b; font-size:11px; letter-spacing:.3px; }
.service-words { position:absolute; inset:42px 8px 48px; pointer-events:none; overflow:hidden; }
.service-words span { --word-x:0px; --word-y:0px; position:absolute; z-index:2; padding:8px 12px; border-left:3px solid #c92d3a; border-radius:3px; background:#fffffff2; color:#294965; box-shadow:0 8px 22px #19344f12; font:700 10px/1.2 'DM Sans',sans-serif; white-space:nowrap; opacity:0; }
.service-words span:nth-child(1) { top:12%; left:2%; --word-x:28px; --word-y:10px; animation-delay:0s; }
.service-words span:nth-child(2) { top:26%; right:1%; --word-x:-30px; --word-y:5px; animation-delay:-2s; }
.service-words span:nth-child(3) { top:47%; left:0; --word-x:34px; --word-y:-8px; animation-delay:-4s; }
.service-words span:nth-child(4) { top:61%; right:2%; --word-x:-32px; --word-y:-9px; animation-delay:-6s; }
.service-words span:nth-child(5) { top:76%; left:9%; --word-x:26px; --word-y:-14px; animation-delay:-8s; }
.service-words span:nth-child(6) { top:8%; right:11%; --word-x:-24px; --word-y:14px; animation-delay:-10s; }
.service-words span:nth-child(7) { top:69%; left:42%; --word-x:0px; --word-y:-22px; animation-delay:-12s; }
.service-words span:nth-child(8) { top:39%; left:38%; --word-x:0px; --word-y:20px; animation-delay:-14s; }
.scene-bottom { text-align:center; color:#52677b; font-size:11px; }
.local-strip { border-block:1px solid var(--border); background:#fff; }
.local-strip .container { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:20px 0; font-size:12px; }
.local-strip .container>span { font-weight:700; }.local-strip p { display:flex; align-items:center; gap:25px; margin:0; color:var(--muted); }.local-strip i { width:3px; height:3px; border-radius:50%; background:#9eafbc; }
.site-theme .section { padding:83px 0; }
.site-theme .section-heading-row { display:grid; grid-template-columns:1fr 1fr; gap:70px; margin-bottom:35px; align-items:end; }
.site-theme .section h2,.site-theme .support-process h2,.site-theme .business-bridge h2 { font:800 clamp(28px,3vw,40px)/1.2 'Manrope',sans-serif; letter-spacing:-1.4px; margin:0; }
.site-theme .section-heading-row p { font-size:14px; line-height:1.7; margin:0; max-width:390px; }
.site-theme .home-service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.site-theme .home-service-card { background:#fff; border:1px solid var(--border); border-radius:10px; padding:25px 22px; transform:none; }
.site-theme .service-icon { width:40px; height:40px; border-radius:10px; background:#edf2f7; color:#315f85; font-size:21px; margin-bottom:26px; }
.site-theme .home-service-card h3 { font:800 16px/1.45 'Manrope',sans-serif; min-height:46px; margin:0 0 13px; }
.home-service-card h3 a span { color:#7892a8; }
.site-theme .home-service-card p { font-size:13px; line-height:1.8; margin:0; }
.support-process { padding:75px 0; background:#eaf0f5; }
.process-grid { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; }
.support-process p:not(.eyebrow) { font-size:14px; line-height:1.8; color:var(--muted); max-width:390px; }
.process-steps { list-style:none; padding:0; margin:0; }.process-steps li { display:flex; gap:22px; padding:23px 0; border-bottom:1px solid #cfdce6; }.process-steps li:first-child { padding-top:0; }.process-steps li:last-child { border:0; padding-bottom:0; }.process-steps li>span { font:700 12px 'Manrope',sans-serif; padding-top:5px; color:#47769a; }.process-steps h3 { font-size:17px; margin:0 0 7px; }.process-steps p { margin:0; }
.site-theme .business-bridge { margin:0; padding:65px 0; border:0; background:#1c3954; color:#fff; text-align:left; }.site-theme .business-bridge-inner { display:grid; grid-template-columns:1fr auto; gap:65px; }.site-theme .business-bridge .eyebrow { color:#b8cddd; margin-bottom:16px; }.site-theme .business-bridge h2 { font-size:29px; }.site-theme .business-bridge p:not(.eyebrow) { color:#c6d5e1; max-width:690px; font-size:14px; }.site-theme .business-bridge .btn { color:#fff; border-color:#7892a8; }
.site-theme .home-cta { background:#fff; text-align:center; padding:78px 0; }.site-theme .home-cta .eyebrow { margin-bottom:15px; }.site-theme .home-cta .muted { font-size:14px; line-height:1.8; }
.site-theme .navcorp-footer { background:#f0f4f7; border-top:1px solid var(--border); padding-top:40px; }.site-theme .navcorp-footer::before,.site-theme .footer-glow-line { display:none; }.site-theme .footer-label { color:#19344f; font-family:'DM Sans',sans-serif; letter-spacing:1px; }.site-theme .footer-tagline,.site-theme .footer-bottom p,.site-theme .contact-link { color:#52677b; }.site-theme .area-tag { background:transparent; color:#52677b; border-color:#ccd8e1; }.site-theme .footer-logo { width:65px; filter:none; }.site-theme .footer-bottom { border-top:1px solid var(--border); }
@media(max-width:1000px) { .site-theme .home-hero-grid { gap:30px; }.site-theme .home-hero h1 { letter-spacing:-2px; }.site-theme .home-service-grid { grid-template-columns:repeat(2,1fr); }.process-grid { gap:40px; }.site-theme .primary-nav { top:100%; }.site-theme .primary-nav ul { align-items:stretch; gap:10px; }.site-theme .primary-nav a { display:block; padding:12px; }.site-theme .primary-nav .nav-call { padding:12px; text-align:center; } }
@media(max-width:760px) { .site-theme .header-inner { min-height:76px; }.site-theme .logo-text { font-size:13px; }.site-theme .logo-img { width:40px; }.site-theme .home-hero { padding:44px 0; }.site-theme .home-hero-grid { grid-template-columns:1fr; gap:35px; }.site-theme .home-hero h1 { font-size:clamp(40px,8vw,58px); }.site-theme .home-hero .actions { justify-content:flex-start; }.home-scene { max-width:480px; width:95%; margin:auto; }.local-strip .container { flex-direction:column; gap:12px; align-items:flex-start; }.local-strip p { gap:12px; flex-wrap:wrap; font-size:11px; }.site-theme .section { padding:55px 0; }.site-theme .section-heading-row,.process-grid,.site-theme .business-bridge-inner { grid-template-columns:1fr; gap:24px; }.site-theme .eyebrow { font-size:10px; }.support-process { padding:50px 0; }.process-steps { margin-top:12px; }.site-theme .business-bridge .btn { justify-self:start; }.site-theme .footer-inner { align-items:flex-start; text-align:left; }.site-theme .footer-contact { text-align:left; }.site-theme .footer-tagline { text-align:left; } }
@media(max-width:420px) { .site-theme .container { width:89%; }.site-theme .home-service-grid { grid-template-columns:1fr; }.site-theme .home-service-card h3 { min-height:0; }.site-theme .home-service-card { padding:22px; }.site-theme .service-icon { margin-bottom:18px; }.service-words span { padding:6px 9px; font-size:9px; }.site-theme .actions { gap:14px; }.site-theme .service-note span:nth-child(2) { margin-left:0; } }
@media(prefers-reduced-motion:reduce) { .site-theme *, .site-theme *::before,.site-theme *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
.site-theme .nav-toggle { min-width:44px; min-height:44px; }
.site-theme .nav-toggle .bar { margin:5px auto; }
.site-theme .navcorp-footer { margin-top:0; }
.site-theme .footer-bottom { padding-top:16px; margin-top:22px; }
.site-theme .area-tag:hover { background:#e4edf4; border-color:#a7bdce; box-shadow:none; color:#19344f; }
/* A small motion vocabulary: controls, surfaces, and coordinated entrances. */
.site-theme { --motion-fast:180ms; --motion-normal:280ms; --motion-enter:350ms; --ease-settle:cubic-bezier(.22,1,.36,1); --ease-ui:cubic-bezier(.2,0,0,1); }
.site-theme .home-hero { background:radial-gradient(ellipse at 82% 36%,#e6eff780,transparent 58%); }
.site-theme .home-scene { background:linear-gradient(145deg,#e5eff7,#edf3f8 65%,#e4edf4); border:1px solid #ffffffb3; box-shadow:inset 0 1px 0 #fff,0 24px 65px -40px #315f8555; }
.site-theme .home-scene .wifi-wave { stroke-dasharray:100; stroke-dashoffset:100; animation:scene-signal 2.8s ease-in-out infinite; }
.home-scene .scene-printer { transform-origin:460px 350px; animation:scene-printer-ready 3.4s ease-in-out infinite; }
.service-words span { animation:service-word-flight 16s cubic-bezier(.22,.75,.28,1) infinite; }
@keyframes scene-signal { 0%,18% { stroke-dashoffset:100; opacity:.45; } 55%,85% { stroke-dashoffset:0; opacity:1; } 100% { stroke-dashoffset:-100; opacity:.45; } }
@keyframes scene-printer-ready { 0%,75%,100% { transform:translateY(0); } 84% { transform:translateY(-5px); } }
@keyframes service-word-flight { 0%,100% { opacity:0; transform:translate(calc(var(--word-x) * -1),calc(var(--word-y) * -1)) scale(.82); } 8%,22% { opacity:1; transform:translate(0,0) scale(1); } 30% { opacity:0; transform:translate(var(--word-x),var(--word-y)) scale(.9); } 31%,99% { opacity:0; } }
@media(prefers-reduced-motion:reduce) { .site-theme .home-scene .wifi-wave { stroke-dashoffset:0; }.service-words span { opacity:.95; transform:none; } }
.site-theme .home-service-card { position:relative; border-radius:14px; box-shadow:0 3px 12px #19344f03; transition:transform var(--motion-normal) var(--ease-settle),box-shadow var(--motion-normal) var(--ease-ui),border-color var(--motion-fast) var(--ease-ui); }
.site-theme .service-icon { width:46px; height:46px; border:1px solid #dce7f0; background:linear-gradient(140deg,#f5f8fb,#e7eff6); transition:background var(--motion-normal) var(--ease-ui),transform var(--motion-normal) var(--ease-settle); }
.site-theme .service-icon svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.site-theme .btn { transition:transform var(--motion-fast) var(--ease-settle),background var(--motion-fast) var(--ease-ui),box-shadow var(--motion-normal) var(--ease-ui); }
.site-theme .btn-primary { box-shadow:0 4px 10px #c92d3a18; }
.site-theme .text-link span,.site-theme .btn span,.site-theme .home-service-card h3 a span { display:inline-block; transition:transform var(--motion-normal) var(--ease-settle); }
.site-theme .home-service-card:focus-within { border-color:#91afc5; box-shadow:0 14px 32px -15px #19344f35; }
.site-theme .process-steps li>span { display:grid; place-items:center; flex-shrink:0; width:33px; height:33px; padding:0; border:1px solid #c6d8e5; border-radius:50%; background:#f4f8fb; }
.site-theme .business-bridge { background:radial-gradient(ellipse at 100% 0,#31587980,transparent 65%),#1c3954; }
.site-theme .site-header { transition:box-shadow var(--motion-normal) var(--ease-ui); }
.site-theme .site-header.is-scrolled { box-shadow:0 5px 24px #19344f0c; }
@media(hover:hover) and (pointer:fine) {
 .site-theme .home-service-card:hover { transform:translateY(-5px); border-color:#aec5d7; box-shadow:0 18px 34px -16px #19344f35; }
 .site-theme .home-service-card:hover .service-icon { transform:translateY(-2px); background:#e0ebf4; }
 .site-theme .home-service-card:hover h3 a span,.site-theme .btn:hover span { transform:translate(2px,-2px); }
 .site-theme .text-link:hover span { transform:translateX(4px); }
 .site-theme .btn-primary:hover { transform:translateY(-2px); box-shadow:0 9px 18px #c92d3a26; }
}
.site-theme .btn:active { transform:translateY(0) scale(.98); }
@keyframes home-enter { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } }
@keyframes scene-settle { from { opacity:0; transform:translateY(12px) scale(.98); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes signal-arrive { 0% { opacity:.25; } 50% { opacity:1; } 100% { opacity:1; } }
@media(prefers-reduced-motion:no-preference) {
 .site-theme .home-hero-copy>* { animation:home-enter var(--motion-enter) var(--ease-settle) both; }
 .site-theme .home-hero-copy h1 { animation-delay:35ms; }
 .site-theme .home-hero-copy .hero-lead { animation-delay:70ms; }
 .site-theme .home-hero-copy .actions { animation-delay:105ms; }
 .site-theme .home-hero-copy .service-note { animation-delay:140ms; }
 .site-theme .home-scene { animation:scene-settle 450ms var(--ease-settle) both; }
 .site-theme .neighbourhood-route { animation:route-travel 5s linear infinite; }
}
@keyframes route-travel { to { stroke-dashoffset:-88; } }
@media(max-width:900px) {
 .site-theme .primary-nav { display:block; top:100%; padding:8px 3%; background:#f8fafc; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-8px); box-shadow:0 16px 22px #19344f0a; transition:opacity var(--motion-fast) var(--ease-ui),transform var(--motion-normal) var(--ease-settle),visibility 0s var(--motion-normal); }
 .site-theme .primary-nav.open { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); transition-delay:0s; }
 .site-theme .nav-toggle .bar { transition:transform var(--motion-normal) var(--ease-settle),opacity var(--motion-fast) var(--ease-ui); }
 .site-theme .nav-toggle[aria-expanded="true"] .bar:nth-child(1) { transform:translateY(7px) rotate(45deg); }
 .site-theme .nav-toggle[aria-expanded="true"] .bar:nth-child(2) { opacity:0; }
 .site-theme .nav-toggle[aria-expanded="true"] .bar:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
}
@media(prefers-reduced-motion:reduce) {
 .site-theme { --motion-fast:0ms; --motion-normal:0ms; --motion-enter:0ms; }
 .site-theme .home-service-card:hover,.site-theme .home-service-card:hover .service-icon,.site-theme .btn:hover,.site-theme .btn:active,.site-theme .text-link:hover span,.site-theme .btn:hover span,.site-theme .home-service-card:hover h3 a span { transform:none; }
}
/* Animate the icon artwork, not only its surrounding tile. */
@keyframes icon-draw { 0% { stroke-dashoffset:1; opacity:.2; } 70%,100% { stroke-dashoffset:0; opacity:1; } }
@keyframes icon-greet { 0%,100% { transform:scale(1); } 40% { transform:scale(1.16); } 70% { transform:scale(.97); } }
.site-theme .service-icon svg { transform-origin:center; }
@media(prefers-reduced-motion:no-preference) {
 .site-theme .icon-arriving .service-icon svg,
 .site-theme .home-service-card:focus-within .service-icon svg { animation:icon-greet 1100ms var(--ease-settle); }
 .site-theme .icon-arriving .service-icon svg path,
 .site-theme .home-service-card:focus-within .service-icon svg path { stroke-dasharray:1; animation:icon-draw 1100ms var(--ease-ui) both; }
}
@media(prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine) {
 .site-theme .home-service-card:hover .service-icon svg { animation:icon-greet 1100ms var(--ease-settle); }
 .site-theme .home-service-card:hover .service-icon svg path { stroke-dasharray:1; animation:icon-draw 1100ms var(--ease-ui) both; }
}
/* A neighbourhood vignette gives the service area a sense of place. */
.site-theme .local-neighbourhood { padding:10px 0 26px; }
.site-theme .neighbourhood-panel { display:grid; grid-template-columns:.95fr 1.1fr; align-items:center; background:#edf3f7; border:1px solid #dbe6ee; border-radius:22px; overflow:hidden; box-shadow:0 14px 40px -32px #19344f55; }
.neighbourhood-copy { padding:42px 0 42px 38px; position:relative; z-index:1; }
.site-theme .neighbourhood-copy .eyebrow { font-size:10px; margin-bottom:15px; }
.site-theme .neighbourhood-copy h2 { font:800 clamp(26px,2.5vw,36px)/1.25 'Manrope',sans-serif; letter-spacing:-1.2px; margin:0 0 17px; }
.neighbourhood-copy h2 span { color:#47769a; }
.neighbourhood-copy>p:not(.eyebrow) { max-width:340px; color:#52677b; font-size:13px; line-height:1.8; margin:0 0 12px; }
.local-support-note { display:flex; gap:8px; align-items:center; margin-top:19px; font-size:10px; color:#52677b; }
.local-support-note svg { width:16px; height:16px; fill:none; stroke:#638fae; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.neighbourhood-map { position:relative; align-self:stretch; min-width:0; margin:20px 0 0 10px; min-height:320px; overflow:hidden; }
.neighbourhood-art { display:block; width:100%; height:100%; position:absolute; inset:0; }
.place-marker { position:absolute; display:flex; flex-direction:column; align-items:center; gap:9px; }
.place-scarborough { left:16%; top:18%; }.place-pickering { left:16%; top:54%; }.place-ajax { left:50%; top:18%; }.place-oshawa { left:50%; top:54%; }.place-courtice { left:84%; top:18%; }.place-bowmanville { left:84%; top:54%; }
.place-marker { translate:-50% -5px; }
.map-pin { width:14px; height:14px; border:4px solid #fff; border-radius:50%; background:#c92d3a; box-shadow:0 0 0 1px #c92d3a25,0 0 0 6px #c92d3a0b; }
.place-name { padding:9px 15px; border:1px solid #dbe6ee; border-radius:7px; background:#ffffffed; box-shadow:0 5px 14px #19344f0a; font-size:12px; font-weight:700; letter-spacing:-.1px; white-space:nowrap; }
.map-caption { position:absolute; bottom:20px; left:0; right:0; text-align:center; font-size:9px; color:#526f85; letter-spacing:1.2px; text-transform:uppercase; }
@media(max-width:1000px) { .neighbourhood-copy { padding-left:25px; }.place-name { padding:8px 10px; font-size:11px; } }
@media(max-width:760px) {
 .site-theme .local-neighbourhood { padding:0 0 10px; }
 .site-theme .neighbourhood-panel { grid-template-columns:1fr; border-radius:18px; }
 .neighbourhood-copy { padding:28px 25px 0; }
 .site-theme .neighbourhood-copy h2 { font-size:29px; }
 .neighbourhood-map { margin:5px 0 0; min-height:0; aspect-ratio:620/360; }
 .map-caption { bottom:12px; font-size:8px; }
 .place-marker { gap:6px; }.place-name { padding:7px 9px; font-size:10px; }.map-pin { width:12px; height:12px; border-width:3px; }
}
@media(max-width:360px) { .site-theme .neighbourhood-copy h2 { font-size:25px; }.neighbourhood-copy { padding-inline:20px; }.place-name { padding:6px; font-size:9px; } }
