@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;450;500;550;600;650;700;750;800&display=swap');
:root{--paper:#ffffff;--ink:#042f56;--muted:#54595f;--accent:#0bb9fc;--line:#dbe7ed;--display-font:'Roboto',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Roboto',Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:3px solid #0072dd;outline-offset:6px}::selection{background:var(--accent);color:var(--ink)}.wrap{width:min(1320px,calc(100% - 104px));margin-inline:auto}.header{min-height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.header nav{display:flex;align-items:center;gap:34px;font-size:13px;font-weight:600}.header nav>a:not(.nav-cta):hover{border-bottom:1px solid}.nav-cta{padding:13px 19px;border:1px solid var(--ink);border-radius:50px}.nav-cta span{margin-left:20px}.nav-cta:hover{background:var(--accent)}.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:25px;padding-block:76px 68px;align-items:center}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;display:flex;align-items:center;gap:9px;margin:0 0 27px}.status-dot{display:inline-block;width:7px;height:7px;background:#0072dd;border-radius:50%;box-shadow:0 0 0 4px #0bb9fc12}.hero h1{font-family:'Roboto',Arial,sans-serif;font-size:clamp(46px,4.9vw,76px);font-weight:650;letter-spacing:-4.5px;line-height:1.07;margin:0 0 26px;position:relative;z-index:1;white-space:nowrap}.emphasis{font-family:var(--display-font);font-weight:700;font-style:normal;letter-spacing:-.045em;color:#0072dd}.hero-description{font-size:20px;line-height:1.5;letter-spacing:-.5px;margin:0 0 15px}.hero-detail{font-size:14px;line-height:1.8;max-width:390px;color:var(--muted);margin:0}.hero-actions{display:flex;align-items:center;gap:23px;margin-top:29px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;gap:24px;border-radius:50px;background:var(--ink);color:white;padding:18px 24px;font-size:12px;font-weight:600;transition:transform .2s,background .2s}.button span{font-size:20px;line-height:1}.button:hover{background:#011a33;transform:translateY(-3px)}.text-link{font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:17px;line-height:1.6}.text-link:hover{text-decoration:underline;text-underline-offset:5px}.hero-note{display:flex;align-items:center;gap:10px;font-size:10px;color:var(--muted);margin-top:37px}.tiny-star{font-size:22px;color:var(--ink)}.hero-art{height:475px;position:relative;isolation:isolate;overflow:hidden;border-radius:4px;background:#f5fcff}.art-grid{position:absolute;inset:0;background-image:linear-gradient(#b8dce955 1px,transparent 1px),linear-gradient(90deg,#b8dce955 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(ellipse,black,transparent 77%)}.art-caption{position:absolute;top:29px;left:29px;font-size:9px;letter-spacing:1.7px;line-height:1.7}.orbit{position:absolute;border:1px solid #9dcada;border-radius:50%;width:390px;height:200px;left:calc(50% - 195px);top:135px;transform:rotate(-38deg)}.orbit-two{transform:rotate(54deg);width:365px;left:calc(50% - 182px)}.super-symbol{position:absolute;width:250px;height:340px;top:65px;left:calc(50% - 125px);transform:rotate(9deg);filter:drop-shadow(18px 25px 15px #042f5620);animation:float 7s ease-in-out infinite}.art-spark{position:absolute}.spark-one{top:70px;right:36px;font-size:41px}.spark-two{left:43px;bottom:101px;font-size:26px}.floating-label{position:absolute;padding:13px 18px;background:var(--paper);border:1px solid #c8e3ed;box-shadow:0 8px 20px #042f560a;font-size:11px;display:flex;align-items:center;gap:10px;border-radius:7px}.label-web{left:22px;top:178px;transform:rotate(-7deg)}.label-web span{font-size:24px}.label-search{right:16px;bottom:98px;transform:rotate(7deg)}.label-search i{width:8px;height:8px;background:#0072dd;border-radius:50%}.art-bottom{position:absolute;bottom:23px;left:26px;right:26px;display:flex;justify-content:space-between;gap:12px;font-size:7px;letter-spacing:1px}.specialties{border-block:1px solid var(--line);padding:24px 0}.specialties-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.specialties-inner>span:first-child{font-size:9px;letter-spacing:1.5px;font-weight:600;flex-shrink:0}.specialties-inner>span:last-child{font-size:18px;letter-spacing:-.5px;display:flex;align-items:center;gap:36px}.specialties b{font-size:24px;color:#0072dd;font-weight:400}.section{padding-block:94px}.section-top{display:flex;justify-content:space-between;align-items:start}.section-note{font-size:12px;color:var(--muted);line-height:1.6;margin:0}h2{font-family:'Roboto',Arial,sans-serif;font-size:clamp(36px,3.6vw,54px);font-weight:500;letter-spacing:-2.5px;line-height:1.12;margin:0}h3{font-family:'Roboto',Arial,sans-serif}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:45px}.service-card{border:1px solid var(--line);border-radius:5px;overflow:hidden;background:#ffffff;transition:transform .25s}.service-card:hover{transform:translateY(-5px)}.card-art{height:226px;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}.web-art{background:#edf8ff}.mini-browser{position:absolute;top:28px;left:24px;right:24px;background:#ffffff;border:1px solid #9bc6dc;border-radius:5px;box-shadow:0 10px 20px #042f5615;transform:rotate(-5deg);overflow:hidden}.browser-bar{height:22px;border-bottom:1px solid #dbe7ed;display:flex;align-items:center;gap:3px;padding:0 9px}.browser-bar i{width:4px;height:4px;border:1px solid #698a9d;border-radius:50%}.browser-bar>span{font-size:5px;margin-left:38px;color:#777}.browser-body{display:flex;justify-content:space-between;padding:18px}.browser-body small{font-size:5px;letter-spacing:1px}.browser-body strong{font-size:28px;line-height:1.05;display:block;margin-top:7px;letter-spacing:-1.7px}.mini-button{font-size:5px;background:var(--ink);color:white;display:inline-block;padding:6px 9px;border-radius:20px;margin-top:12px}.mini-flower{font-size:100px;color:#0072dd;line-height:1.2;align-self:center}.art-tag{font-size:7px;letter-spacing:1.5px;position:absolute;bottom:16px;left:22px}.seo-art{background:#eaf5fa}.search-pill{position:absolute;top:30px;left:25px;right:25px;border:1px solid #b9d9e7;background:#ffffff;padding:11px 13px;border-radius:30px;font-size:10px;display:flex;align-items:center;justify-content:space-between;z-index:2}.search-pill span:first-child{font-size:23px;line-height:1}.map-line{position:absolute;background:#ffffff;outline:1px solid #d5e8f0;height:18px;width:120%;left:-20px;top:142px;transform:rotate(-27deg)}.line-b{transform:rotate(53deg);top:140px}.line-c{transform:rotate(-27deg);top:220px}.map-pin{position:absolute;top:99px;left:calc(50% - 27px);width:56px;height:56px;border:1px solid #042f56;background:var(--accent);border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:-8px 10px 10px #042f5620}.map-pin span{display:block;transform:rotate(45deg);font-size:39px;text-align:center}.map-dot{position:absolute;width:9px;height:9px;background:#7aa4b9;border:3px solid #ffffff;box-shadow:0 0 0 1px #b5d5e3;border-radius:50%}.dot-one{top:120px;left:55px}.dot-two{top:160px;right:62px}.branding-art{background:#edf8ff}.brand-tile{position:absolute;width:129px;height:140px;border:1px solid #8dbbd1;padding:10px 16px;display:flex;flex-direction:column;justify-content:space-between}.tile-back{left:43px;top:23px;background:#ffffff;transform:rotate(-12deg);font-family:var(--display-font);font-size:67px}.tile-back span{font-family:Arial;font-size:6px;letter-spacing:1px}.tile-front{left:calc(50% - 9px);top:48px;background:#8fd9f5;transform:rotate(10deg);font-size:82px;line-height:1}.tile-front span{font-size:11px;font-family:var(--display-font);font-style:normal}.card-content{padding:27px 25px}.card-number{font-size:8px;letter-spacing:1.2px;color:var(--muted);font-weight:600}.card-content h3{font-size:28px;line-height:1.14;letter-spacing:-1.3px;font-weight:600;margin:17px 0}.card-content p{font-size:13px;line-height:1.8;color:var(--muted);margin:0 0 25px;min-height:94px}.card-link{display:flex;align-items:center;justify-content:space-between;padding-top:20px;border-top:1px solid var(--line);font-size:11px;font-weight:600;gap:8px}.card-link span{font-size:21px}.card-link:hover{text-decoration:underline;text-underline-offset:4px}.business-section{background:#f5fcff;padding:74px 0;border-block:1px solid #dbe7ed}.business-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px}.business-grid h2{font-size:43px}.business-grid p:not(.eyebrow){font-size:13px;line-height:1.85;color:#54595f;max-width:490px}.business-grid .business-intro{font-size:20px!important;line-height:1.6!important;color:var(--ink)!important;margin-top:0;letter-spacing:-.4px}.industry-tags{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.industry-tags span{padding:8px 12px;border:1px solid #b9d9e7;border-radius:30px;font-size:10px}.approach{display:grid;grid-template-columns:1fr 1fr;gap:90px}.approach-heading h2{font-size:44px}.approach-heading .text-link{margin-top:29px}.step{display:flex;gap:28px;border-top:1px solid var(--line);padding:25px 0}.step:last-child{padding-bottom:0}.step>span{font-size:10px;color:var(--muted);padding-top:6px}.step h3{font-size:21px;font-weight:600;letter-spacing:-.6px;margin:0 0 10px}.step p{font-size:13px;line-height:1.8;color:var(--muted);margin:0;max-width:380px}.cta-section{padding-bottom:65px}.cta-panel{background:var(--ink);color:var(--paper);border-radius:6px;padding:55px 55px 38px;position:relative;overflow:hidden}.cta-panel .eyebrow{color:#dbe7ed}.cta-panel .status-dot{background:var(--accent)}.cta-panel h2{font-size:58px;position:relative;z-index:1}.cta-panel h2 .emphasis{color:var(--accent)}.cta-panel p:not(.eyebrow){font-size:13px;line-height:1.8;color:#cfdee9;margin:23px 0}.light-button{background:var(--accent);color:var(--ink)}.light-button:hover{background:#51ffbb}.cta-star{font-size:305px;color:var(--accent);position:absolute;right:70px;top:20px;transform:rotate(14deg);line-height:1.2}.cta-domain{display:flex;align-items:center;justify-content:space-between;margin-top:46px;padding-top:23px;border-top:1px solid #31516d;font-size:10px;color:#cfdee9}.cta-domain:hover{color:var(--accent)}.footer-top{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;padding:12px 0 45px;align-items:center}.footer-top p{font-size:12px;line-height:1.8;margin:0}.footer-top p span{color:var(--muted)}.footer-contact{display:flex;align-items:flex-start;flex-direction:column;gap:10px;font-size:12px;justify-self:end}.footer-contact>a:first-child{font-weight:600}.footer-contact>a:last-child{color:var(--muted)}.footer-contact a:hover{text-decoration:underline}.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:25px 0 32px;font-size:9px;color:var(--muted)}.footer-bottom a:hover{color:var(--ink)}.skip{position:absolute;left:20px;top:-80px;background:var(--ink);color:white;padding:15px;z-index:20}.skip:focus{top:10px}@keyframes float{0%,100%{transform:translateY(0) rotate(9deg)}50%{transform:translateY(-10px) rotate(12deg)}}
@media(min-width:1500px){.hero{gap:55px}.hero h1{font-size:76px}.hero-art{height:500px}.super-symbol{top:78px}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.hero h1{font-size:55px;letter-spacing:-3.5px}.hero-art{height:450px}.hero-actions{gap:18px}.hero-detail{max-width:350px}.specialties-inner>span:last-child{gap:18px;font-size:15px}.service-grid{gap:16px}.card-content{padding:23px 20px}.card-content h3{font-size:25px}.card-content p{min-height:140px}.mini-browser{left:17px;right:17px}.browser-body{padding:15px 12px}.mini-flower{font-size:73px}.brand-tile{width:110px;height:130px}.tile-back{left:25px}.tile-front{left:calc(50% - 5px)}.business-grid,.approach{gap:50px}.business-grid h2,.approach-heading h2{font-size:37px}.cta-star{right:35px;font-size:245px;top:45px}.cta-panel h2{font-size:50px}}
@media(max-width:800px){.wrap{width:calc(100% - 44px)}.header{min-height:92px}.header nav{gap:18px}.header nav>a:not(.nav-cta){display:none}.hero{grid-template-columns:1fr;padding-top:46px;gap:38px}.hero h1{font-size:clamp(48px,8.5vw,70px);white-space:normal}.hero-detail{max-width:460px}.hero-art{height:410px}.super-symbol{top:32px}.orbit{top:110px}.hero-note{margin-top:25px}.specialties-inner{flex-direction:column;gap:15px;align-items:flex-start}.specialties-inner>span:last-child{gap:18px;flex-wrap:wrap}.section{padding-block:65px}.service-grid{grid-template-columns:1fr;gap:25px}.service-card{display:grid;grid-template-columns:1fr 1.2fr}.card-art{height:100%;min-height:310px;border-bottom:0;border-right:1px solid var(--line)}.mini-browser{top:70px}.search-pill{top:70px}.map-pin{top:150px}.map-line{top:190px}.line-c{top:265px}.brand-tile{top:80px}.tile-front{top:105px}.card-content p{min-height:0}.card-content h3 br{display:none}.section-note{display:none}.business-grid,.approach{grid-template-columns:1fr;gap:35px}.business-grid h2,.approach-heading h2{font-size:43px}.business-grid p:not(.eyebrow){max-width:none}.business-section{padding:58px 0}.cta-panel{padding:38px 30px 28px}.cta-panel h2{font-size:44px}.cta-star{font-size:130px;right:20px;top:23px;opacity:.22}.cta-panel>div{position:relative;z-index:1}.footer-top{grid-template-columns:1fr 1fr;gap:30px}.footer-top p{display:none}.cta-section{padding-bottom:40px}}
@media(max-width:480px){.wrap{width:calc(100% - 36px)}.nav-cta{font-size:11px;padding:11px 14px}.nav-cta span{margin-left:9px}.hero{padding-top:37px;padding-bottom:36px}.eyebrow{font-size:8px;letter-spacing:1.4px;margin-bottom:23px}.hero h1{font-size:48px;letter-spacing:-3px}.hero-description{font-size:18px}.hero-detail{font-size:13px}.hero-actions{align-items:flex-start;flex-direction:column;gap:20px}.hero-art{height:370px}.art-caption{font-size:8px;left:20px;top:20px}.super-symbol{width:210px;height:290px;left:calc(50% - 105px);top:32px}.label-web{font-size:9px;left:10px;top:145px;padding:9px 11px}.label-search{font-size:9px;right:10px;bottom:67px;padding:11px}.spark-one{font-size:31px;top:40px;right:24px}.spark-two{left:22px;bottom:75px}.art-bottom{font-size:6px;left:20px;right:20px}.orbit{width:310px;left:calc(50% - 155px);height:155px;top:110px}.orbit-two{width:300px;left:calc(50% - 150px)}.specialties-inner>span:last-child{font-size:12px;gap:12px}.specialties b{font-size:18px}.specialties-inner>span:last-child>b:last-child{display:none}h2{font-size:36px;letter-spacing:-1.7px}.service-grid{margin-top:32px}.service-card{display:block}.card-art{height:220px;min-height:0;border-right:0;border-bottom:1px solid var(--line)}.mini-browser{top:26px;left:32px;right:32px}.browser-body{padding:17px}.mini-flower{font-size:98px}.search-pill{top:30px}.map-pin{top:103px}.map-line{top:153px}.line-c{top:220px}.brand-tile{width:125px;height:140px;top:24px}.tile-back{left:55px}.tile-front{top:47px}.card-content{padding:26px}.card-content h3{font-size:29px}.card-content p{font-size:13px}.business-grid h2,.approach-heading h2{font-size:36px}.business-grid .business-intro{font-size:18px!important}.step{gap:20px}.step h3{font-size:20px}.cta-panel{padding:32px 25px 25px}.cta-panel h2{font-size:37px;letter-spacing:-1.8px}.cta-panel p:not(.eyebrow) br{display:none}.cta-panel .button{gap:14px;padding:17px 18px;font-size:11px}.cta-star{font-size:115px;right:10px;top:16px}.cta-domain{font-size:9px;margin-top:32px}.footer-top{grid-template-columns:1fr;gap:25px;padding-bottom:30px}.footer-contact{justify-self:start}.footer-bottom{flex-wrap:wrap;row-gap:18px;font-size:9px}.footer-bottom>span{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Brand identity observed on supermanservices.ca; source details in BRAND-REFERENCE.md. */
:root{--brand-dark:#011a33;--brand-blue:#0bb9fc;--brand-navy:#042f56;--brand-text:#2b2b2b;--brand-tint:#f5fcff;--brand-gradient:linear-gradient(80deg,#00b8ff 0%,#51ffbb 100%)}
body{color:var(--brand-text)}
h1,h2,h3,.header,.brand,.text-link,.card-link{color:var(--brand-navy)}
.brand{display:inline-flex;align-items:center;gap:4px;font-family:Arial,Helvetica,sans-serif;font-size:22px;font-weight:700;line-height:1.1;letter-spacing:0;white-space:nowrap}
.brand-logo{display:block;width:76px;height:auto;flex-shrink:0}
.hero h1{font-weight:700;letter-spacing:-3.5px}
.super-symbol{width:340px;height:340px;left:calc(50% - 170px);top:65px;transform:none;filter:none;animation:brand-float 7s ease-in-out infinite}
.super-symbol img{display:block;width:100%;height:auto;object-fit:contain}
.nav-cta:hover{background:var(--brand-tint)}
.hero-art{background:var(--brand-tint)}
.label-web{top:177px}.label-search{bottom:80px}
.button{background:var(--brand-navy);color:white}
.button:hover{background:var(--brand-dark)}
.cta-panel{background:var(--brand-dark)}
.cta-panel h2{color:white}
.cta-panel h2 .emphasis{background:var(--brand-gradient);background-clip:text;-webkit-background-clip:text;color:transparent}
.light-button{background:var(--brand-gradient);color:var(--brand-dark)}
.light-button:hover{background:#51ffbb;color:var(--brand-dark)}
.cta-star{color:var(--brand-blue)}
.tile-back{font-family:'Roboto',Arial,sans-serif;font-weight:600}
.tile-front span{font-family:'Roboto',Arial,sans-serif;font-style:normal}
@keyframes brand-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(min-width:1500px){.super-symbol{top:78px}}
@media(max-width:1100px){.hero h1{font-size:53px}.brand{font-size:20px}}
@media(max-width:800px){.hero h1{font-size:clamp(48px,8.5vw,70px)}.super-symbol{top:35px}.brand{font-size:19px}.brand-logo{width:67px}}
@media(max-width:480px){.brand{font-size:16px;gap:0}.brand-logo{width:52px}.header nav{gap:0}.nav-cta{padding:10px 12px}.hero h1{font-size:46px;letter-spacing:-2.5px}.super-symbol{width:300px;height:300px;left:calc(50% - 150px);top:35px}.label-web{top:145px}.label-search{bottom:59px}.cta-panel h2{font-size:36px}}
@media(max-width:360px){.brand{font-size:14px}.brand-logo{width:45px}.nav-cta{padding:10px;font-size:10px}.nav-cta span{margin-left:5px}.hero h1{font-size:41px}}
