/* SYNK Technology website v1 — Final C look. Dark is the default; [data-synk-theme=light] swaps the tokens (our own attribute, so a host page that sets data-theme cannot change it). */
:root{--focus:#ffb000;--field:#6b6b6b;--bg:#050505;--bg2:#0c0c0c;--fg:#ffffff;--mut:#c2c2c2;--ac:#ffb000;--ac-t:#ffb000;--on-ac:#0a0a0a;--lac:#ffb000;--ln:#2a2a2a;--card:rgba(12,12,12,.93);--glass:5,5,5;--err:#ff8a7a;--fd:Archivo,"Helvetica Neue",Arial,sans-serif;--fm:"JetBrains Mono",ui-monospace,Menlo,monospace;--r:0px;color-scheme:dark}
[data-synk-theme=light]{--focus:#8a5600;--field:#8a8780;--bg:#f4f3ef;--bg2:#ebe9e3;--fg:#101923;--mut:#454b54;--ac:#f0a800;--ac-t:#8a5600;--on-ac:#101923;--lac:#d99a00;--ln:#d3d0c6;--card:rgba(255,255,255,.94);--glass:244,243,239;--err:#b3261e;color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 var(--fd);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ac);color:var(--on-ac);padding:12px 16px;font-weight:600}
.skip:focus{top:12px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:16px}
h1,h2,h3,h4{text-wrap:balance;margin:0}
p{margin:0 0 14px}
.kick{display:flex;align-items:center;gap:10px;margin:0 0 16px;font:500 12px/1.4 var(--fm);letter-spacing:.18em;text-transform:uppercase;color:var(--ac-t)}
.kick::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ac);flex:none}
.mono{font-family:var(--fm)}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border:0;background:var(--ac);color:var(--on-ac);font:700 15px var(--fd);text-decoration:none;cursor:pointer;border-radius:var(--r)}
.btn:hover{filter:brightness(1.07)}
.btn-ghost{background:transparent;color:var(--fg);border:1px solid var(--ln)}
.btn-ghost:hover{border-color:var(--fg)}
.btn-sm{min-height:48px;padding:10px 16px;font-size:14px}
.chip{display:inline-flex;align-items:center;min-height:48px;padding:10px 14px;border:1px solid var(--ln);background:transparent;color:var(--fg);font:500 14px var(--fd);cursor:pointer}
/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(var(--glass),.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--ln)}
.nav{display:flex;align-items:center;gap:14px;min-height:60px}
.brand{display:flex;align-items:center;min-height:48px;color:var(--fg);margin-right:auto}
.logo{height:36px;width:auto;display:block}
.menu{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.menu a{display:flex;align-items:center;min-height:48px;padding:0 12px;text-decoration:none;font-weight:600;font-size:15px;color:var(--mut)}
.menu a:hover,.menu a[aria-current=page]{color:var(--fg)}
.menu a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--ac)}
.theme,.menu-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:transparent;color:var(--fg);cursor:pointer;flex:none}
.theme i{width:34px;height:20px;border-radius:999px;border:1.5px solid currentColor;position:relative}
.theme i::after{content:"";position:absolute;top:3px;left:3px;width:11px;height:11px;border-radius:50%;background:currentColor;transition:transform .2s}
.theme[aria-pressed=true] i::after{transform:translateX(14px)}
.menu-btn{display:none}
.menu-btn b{width:34px;height:34px;border:1px solid var(--ln);display:grid;place-items:center}
.menu-btn i,.menu-btn i::before,.menu-btn i::after{display:block;width:16px;height:2px;background:currentColor;position:relative;transition:transform .2s}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0}
.menu-btn i::before{top:-5px}.menu-btn i::after{top:5px}
.top.open .menu-btn i{background:transparent}.top.open .menu-btn i::before{transform:translateY(5px) rotate(45deg)}.top.open .menu-btn i::after{transform:translateY(-5px) rotate(-45deg)}
.menu .menu-cta{display:none}
@media(max-width:900px){
 .nav-cta{display:none}
 .menu-btn{display:inline-flex}
 .menu .menu-cta{display:list-item}
 .menu .menu-cta a{color:var(--ac-t)}
 .top nav{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--ln);display:none}
 .top.open nav{display:block}
 .menu{flex-direction:column;padding:8px 16px 16px}
 .menu a{min-height:52px;font-size:18px;border-bottom:1px solid var(--ln)}
 .logo{height:32px}
}
/* hero */
.hero{position:relative;padding-block:clamp(40px,9vh,110px) clamp(56px,10vh,120px)}
.hero h1{font:800 clamp(42px,7.4vw,108px)/.92 var(--fd);text-transform:uppercase;letter-spacing:-.015em;max-width:8.5em;margin:0 0 22px}
.hero .sub{font-size:clamp(17px,1.6vw,20px);color:var(--fg);opacity:.92;max-width:34em;margin:0 0 28px}
.cta{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.phone-line{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;font:500 15px var(--fm)}
.copy{min-height:48px;padding:8px 12px;border:1px solid var(--ln);background:transparent;color:var(--mut);font:500 13px var(--fd);cursor:pointer}
.status{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:24px 0 0;font:500 12px/1.5 var(--fm);letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.status .dot{width:8px;height:8px;border-radius:50%;background:var(--mut)}
.status.open .dot{background:var(--ac)}
.page-hero{padding-block:clamp(48px,10vh,120px) 40px;border-bottom:1px solid var(--ln);background:radial-gradient(900px 380px at 85% -10%,color-mix(in srgb,var(--ac) 16%,transparent),transparent 70%),radial-gradient(circle at 1px 1px,color-mix(in srgb,var(--fg) 14%,transparent) 1px,transparent 1.5px) 0 0/18px 18px}
.page-hero{position:relative;overflow:hidden}
.page-hero>.wrap{position:relative;z-index:1}
.page-hero .dots{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.page-hero .dots{-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.3) 50%,#000 78%);mask-image:linear-gradient(90deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.3) 50%,#000 78%)}
@media(max-width:760px){.page-hero .dots{-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.3) 70%,#000 100%);mask-image:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.3) 70%,#000 100%)}}
.page-hero.has-dots{background:radial-gradient(900px 380px at 85% -10%,color-mix(in srgb,var(--ac) 16%,transparent),transparent 70%)}
.page-hero h1{font:800 clamp(38px,6vw,84px)/.95 var(--fd);text-transform:uppercase;letter-spacing:-.01em;margin:0 0 18px;max-width:12em}
.page-hero .sub{font-size:clamp(17px,1.5vw,19px);max-width:40em;margin:0}
/* 3D layer (home) */
.scene{position:fixed;inset:0;z-index:0;pointer-events:none}
.scene canvas{width:100%;height:100%;display:block}
.no3d .scene{background:radial-gradient(1100px 520px at 70% 115%,color-mix(in srgb,var(--ac) 22%,transparent),transparent 70%),radial-gradient(circle at 1px 1px,color-mix(in srgb,var(--fg) 16%,transparent) 1px,transparent 1.6px) 0 0/16px 16px}
.no3d .scene canvas{display:none}
.home main,.home footer{position:relative;z-index:1}
.home .hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(var(--glass),.9) 0%,rgba(var(--glass),.72) 42%,rgba(var(--glass),0) 72%)}
@media(max-width:760px){.home .hero::before{background:linear-gradient(180deg,rgba(var(--glass),.88) 0%,rgba(var(--glass),.72) 70%,rgba(var(--glass),0) 100%)}}
/* sections */
.sec{padding-block:clamp(56px,9vh,110px)}
.sec-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px 16px;flex-wrap:wrap;margin:0 0 26px}
.sec-head h2{font:800 clamp(28px,3.6vw,48px)/1.02 var(--fd);text-transform:uppercase}
.eyebrow{font:500 12px var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin:0}
.panel{background:var(--card);border:1px solid var(--ln);padding:clamp(20px,3vw,36px)}
/* tunnel (home services, Text 2) */
.tunnel{list-style:none;margin:0;padding:0}
.stop{min-height:74vh;display:flex;align-items:center;justify-content:center;scroll-snap-align:center;opacity:.25;transition:opacity .45s}
.stop.hot,.no3d .stop,.stop:focus-within{opacity:1}
.stop .inner{max-width:640px;text-align:center;padding:40px 30px;background:radial-gradient(ellipse 72% 66% at 50% 50%,rgba(var(--glass),.97) 0%,rgba(var(--glass),.95) 62%,rgba(var(--glass),0) 100%)}
.stop .num{display:block;font:500 12px var(--fm);letter-spacing:.14em;color:var(--ac-t);margin:0 0 10px}
.stop h3{font:800 clamp(24px,4.6vw,58px)/1 var(--fd);text-transform:uppercase;margin:0 0 12px}
.stop p{font-size:clamp(16px,1.4vw,18px);margin:0 0 16px}
.stop a{display:inline-flex;align-items:center;min-height:48px;padding:0 6px;font:600 15px var(--fd);color:var(--ac-t)}
html.snap{scroll-snap-type:y proximity}
/* cards */
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.card{background:var(--card);border:1px solid var(--ln);padding:24px;display:flex;flex-direction:column;gap:12px;min-width:0}
.card h3{font:800 clamp(20px,2vw,25px)/1.15 var(--fd);text-transform:uppercase}
.card .tag{font:500 11px var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--ac-t);margin:0}
.card p{margin:0;color:var(--fg);opacity:.88}
.card .fix{border-left:3px solid var(--ac);padding-left:12px;opacity:1}
.card .fix b{display:block;font:500 11px var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.card .act{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding-top:6px}
.card .act span{font:500 13px var(--fm);color:var(--mut)}
.seg{display:inline-flex;border:1px solid var(--ln);padding:3px;gap:2px;align-self:flex-start}
.seg button{min-height:48px;min-width:72px;border:0;background:transparent;color:var(--mut);font:600 13px var(--fd);cursor:pointer}
.seg button[aria-pressed=true]{background:var(--ac);color:var(--on-ac)}
.meta{font:500 13px/1.5 var(--fm);border-left:2px solid var(--ac);padding-left:10px}
.meta b{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
/* gap slider */
.gap{margin-top:30px;max-width:780px}
.gap figcaption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 12px;font:500 11px var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin:0 0 18px}
.gb{display:grid;grid-template-columns:8.5em minmax(0,1fr);align-items:center;gap:12px;margin:0 0 14px;font-size:14px}
.gt{position:relative;height:16px;background:color-mix(in srgb,var(--fg) 8%,transparent)}
.gt i{position:absolute;inset:0;transform-origin:left center}
.gpay i{background:var(--fg);transform:scaleX(var(--pay,.9))}
.gget i{background:var(--ac);transform:scaleX(var(--get,.36))}
.gh{position:absolute;top:0;bottom:0;left:calc(var(--get,.36) * 100%);width:calc((var(--pay,.9) - var(--get,.36)) * 100%);background:repeating-linear-gradient(135deg,var(--err) 0 2px,transparent 2px 6px)}
.gl{position:absolute;bottom:calc(100% + 4px);left:calc(var(--get,.36) * 100%);font:600 11px var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--err);white-space:nowrap}
.gl.closed{color:var(--ac-t)}
.gs{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;margin-top:22px;font:500 12px var(--fm);text-transform:uppercase;color:var(--mut)}
.gs input{width:100%;min-height:48px;accent-color:var(--ac)}
@media(max-width:600px){.gs{grid-template-columns:1fr 1fr}.gs input{grid-column:1/-1;grid-row:2}.gs span:last-child{text-align:right}.gb{grid-template-columns:6.5em minmax(0,1fr)}}
/* content pages */
.prose{max-width:720px}
.prose h2{font:800 clamp(24px,3vw,36px)/1.1 var(--fd);text-transform:uppercase;margin:40px 0 14px}
.prose h3{font:700 20px/1.3 var(--fd);margin:26px 0 8px}
.prose ul{padding-left:20px;margin:0 0 16px}
.prose li{margin:0 0 6px}
.svc-list{display:grid;gap:14px}
.svc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px 40px;padding:clamp(22px,3vw,36px);background:var(--card);border:1px solid var(--ln);scroll-margin-top:90px}
@media(max-width:820px){.svc{grid-template-columns:minmax(0,1fr)}}
.svc .num{font:500 12px var(--fm);letter-spacing:.14em;color:var(--ac-t);margin:0 0 8px;display:block}
.svc h2{font:800 clamp(24px,3vw,38px)/1.05 var(--fd);text-transform:uppercase;margin:0 0 10px}
.svc h3{font:500 12px var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin:0 0 8px}
.svc ul{margin:0 0 18px;padding-left:20px}
.svc li{margin:0 0 6px}
.note{border:1px dashed var(--ac);padding:14px 16px;margin:16px 0 0;font-size:15px}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:s}
.steps li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;padding:24px;background:var(--card);border:1px solid var(--ln);counter-increment:s}
.steps li::before{content:counter(s,decimal-leading-zero);font:800 34px/1 var(--fd);color:var(--ac-t)}
.steps h2{font:800 22px/1.2 var(--fd);text-transform:uppercase;margin:0 0 6px}
.steps p{margin:0}
.faq details{border-top:1px solid var(--ln)}
.faq details:last-child{border-bottom:1px solid var(--ln)}
.faq summary{min-height:56px;display:flex;align-items:center;cursor:pointer;font:700 18px/1.3 var(--fd);padding:12px 0}
.faq p{padding-bottom:12px}
/* forms */
.form{display:grid;gap:16px;background:var(--card);border:1px solid var(--ln);padding:clamp(18px,3vw,30px);min-width:0}
.fld{display:grid;gap:6px}
.form label,.lb{font:600 13px var(--fd);letter-spacing:.04em;text-transform:uppercase;color:var(--mut)}
.lb small,.form label small{text-transform:none;letter-spacing:0;font-weight:400}
.form input[type=text],.form input[type=tel],.form input[type=email],.form select,.form textarea{width:100%;min-height:52px;font:16px/1.4 var(--fd);color:var(--fg);background:var(--bg);border:1px solid var(--field);padding:12px 14px;border-radius:0}
.form textarea{min-height:110px;resize:vertical}
.form [aria-invalid=true]{border-color:var(--err)}
.err{color:var(--err);font-size:14px;margin:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip[aria-pressed=true]{background:var(--ac);border-color:var(--ac);color:var(--on-ac)}
.row{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px}
.row .chip{flex:0 0 auto;flex-direction:column;justify-content:center;min-width:76px;text-align:center;line-height:1.25}
.row .chip small{font-size:12px;opacity:.85}
.grid3b{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.grid3b .chip{justify-content:center}
.form .consent,.consent{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;font:400 15px/1.5 var(--fd);text-transform:none;letter-spacing:0;color:var(--fg);cursor:pointer}
.consent input{width:24px;height:24px;margin:2px 0 0;accent-color:var(--ac)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.result{border:1px solid var(--ln);padding:18px;display:grid;gap:12px}
.result.ok{border-color:var(--ac)}
.result h2,.result h3{font:800 22px/1.2 var(--fd);text-transform:uppercase}
.result dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;margin:0;font-size:15px}
.result dt{font:500 11px var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--mut);padding-top:3px}
.result dd{margin:0;overflow-wrap:anywhere}
.preview-note{font:500 13px var(--fm);border:1px dashed var(--ac);padding:10px 12px;color:var(--fg)}
.ways{display:grid;gap:8px}
.way{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;min-height:56px;border:1px solid var(--ln);padding:10px 14px;text-decoration:none;color:var(--fg);background:transparent;font:inherit;cursor:pointer}
.way span{font:500 11px var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.way b{font:500 16px var(--fm);overflow-wrap:anywhere}
.way:hover{border-color:var(--ac)}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:32px;align-items:start}
@media(max-width:860px){.two{grid-template-columns:minmax(0,1fr)}}
/* CTA band + footer */
.band{border-top:1px solid var(--ln);border-bottom:1px solid var(--ln);background:var(--bg2)}
.band .wrap{display:flex;flex-wrap:wrap;gap:18px 30px;align-items:center;justify-content:space-between;padding-block:40px}
.band h2{font:800 clamp(26px,3.4vw,44px)/1.02 var(--fd);text-transform:uppercase;max-width:14em}
footer.site{background:var(--bg);border-top:1px solid var(--ln);padding-block:40px 56px;font-size:15px}
.fgrid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:28px}
@media(max-width:760px){.fgrid{grid-template-columns:1fr}}
.fgrid h2{font:500 12px var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin:0 0 12px}
.fgrid ul{list-style:none;margin:0;padding:0}
.fgrid li a{display:inline-flex;align-items:center;min-height:48px;min-width:48px;padding-right:8px}
.fine{color:var(--mut);font-size:14px;margin-top:28px}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:90;background:var(--fg);color:var(--bg);padding:10px 16px;font-weight:600;opacity:0;transition:opacity .2s;pointer-events:none;max-width:calc(100vw - 32px)}
.toast.on{opacity:1}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}html.snap{scroll-snap-type:none}}
/* /go/: the Request a call page for Instagram visitors */
.go-h1{font:800 clamp(38px,7vw,72px)/.95 var(--fd);text-transform:uppercase;margin:0 0 16px}
.go-sec{padding-block:clamp(32px,6vh,72px)}
.home .status{background:rgba(var(--glass),.92);padding:8px 12px;width:fit-content;max-width:100%}
.home .hero{isolation:isolate}
