/* SX Agency / homepage visual-only treatment — 2026-10-31.
   No text, destinations or site-wide components have been replaced. */
body.page-home { background:#020407; }
@media (min-width:1181px) {
 body.page-home .site-header {
   width:min(1170px,calc(100% - 68px));height:65px;
   margin:14px auto 0;padding:0 17px;gap:11px;
   border-radius:999px;
   background:linear-gradient(180deg,rgba(29,32,38,.79),rgba(4,5,8,.88) 75%);
 }
 body.page-home .site-header .brand {gap:12px;padding-left:4px}
 body.page-home .site-header .brand-mark{font-size:29px;letter-spacing:-3.4px}
 body.page-home .site-header .brand-name{font-size:9px;letter-spacing:3.0px}
 body.page-home .site-header .brand-rule{width:30px}
 body.page-home .site-header .nav{gap:0}
 body.page-home .site-header .nav>a:not(.button){min-height:41px;padding:0 clamp(9px,.85vw,14px);font-size:11px}
 body.page-home .site-header .nav.sx-nav-single-bubble > .sx-nav-indicator {height:41px}
 body.page-home .site-header .nav.sx-nav-single-bubble > .sx-nav-indicator::after{bottom:7px}
 body.page-home .site-header .header-cta{min-width:135px;height:40px;min-height:40px;font-size:11px}
 body.page-home .site-header .header-cta::before{display:none}
}
body.page-home .hero {
 min-height:472px;
 margin-top:-79px;padding-top:79px;
 display:flex;justify-content:flex-start;align-items:center;
 position:relative;isolation:isolate;
 background:#020408;
}
body.page-home .hero::before{
 content:"";position:absolute;inset:0;z-index:-3;pointer-events:none;
 background-image:linear-gradient(90deg,rgba(0,1,4,.38) 0%,rgba(0,1,4,.15) 34%,transparent 65%),url('images/sx-home-cosmic-native-5k.webp');
 background-repeat:no-repeat;background-size:cover;background-position:center top;
}
body.page-home .hero::after {
 content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
 background:linear-gradient(90deg,rgba(0,0,0,.66) 0%,rgba(0,0,0,.40) 18%,transparent 55%),linear-gradient(0deg,rgba(0,0,0,.18),transparent 16%);
}
body.page-home .hero > .orb {display:none!important}
body.page-home .hero-copy {
 width:min(1060px,calc(100% - 80px));margin:11px auto 35px;
 text-align:left;position:relative;z-index:2;
 padding-right:min(45vw,500px);
}
body.page-home .hero-copy .eyebrow{font-size:9px;letter-spacing:3.8px;color:#d9dce4;white-space:normal}
body.page-home .hero-copy .eyebrow i{font-style:normal;padding:0 8px}
body.page-home .hero h1{font:500 clamp(43px,4.2vw,60px)/.99 var(--display);letter-spacing:-2.9px;margin:20px 0 17px;white-space:nowrap}
body.page-home .hero h1 span {color:#aeb1bc;background:none;-webkit-text-fill-color:currentColor}
body.page-home .hero-intro {margin:0;font-size:13.5px;max-width:405px;line-height:1.7;color:#d0d1d7}
body.page-home .hero-actions{justify-content:flex-start;gap:18px;margin-top:23px}
body.page-home .hero-actions > .sx-glass-cta{font-size:12px;min-height:45px;height:45px;padding:0 15px 0 18px;gap:17px}
body.page-home .hero-actions > .sx-glass-cta .sx-cta-arrow{width:30px;height:30px;min-width:30px;min-height:30px}
body.page-home .hero-services{bottom:28px;left:50%;transform:translateX(-50%);width:min(1020px,calc(100% - 90px));font-size:8px;letter-spacing:2.3px;gap:32px;justify-content:center}
body.page-home .hero-services::before,body.page-home .hero-services::after{background:linear-gradient(90deg,transparent,rgba(225,232,242,.42));opacity:.65}
body.page-home .hero-services::after{transform:scaleX(-1)}
body.page-home .hero-services i{height:20px;background:rgba(220,226,240,.32)}
/* Discover SX — unchanged live link/text elements, matched to the image geometry. */
body.page-home .home-directory {
 position:relative;isolation:isolate;
 width:min(1145px,calc(100% - 70px));padding:23px 0 49px;
 border-bottom:1px solid rgba(210,220,236,.11);
}
body.page-home .home-directory::before{
 content:"";position:absolute;z-index:-1;pointer-events:none;
 left:50%;top:0;width:100vw;height:100%;transform:translateX(-50%);
 background:radial-gradient(ellipse 44% 60% at 90% 18%,rgba(48,62,84,.13),transparent 84%),linear-gradient(180deg,#04070b,#020407 100%);
}
body.page-home .home-directory-heading{margin-bottom:12px;align-items:end;gap:7px 18px}
body.page-home .home-directory-heading .eyebrow {font-size:8px;letter-spacing:3px}
body.page-home .home-directory-heading h2{font:500 clamp(33px,3vw,44px)/1.03 var(--display);letter-spacing:-2.2px}
body.page-home .home-directory-heading h2 span{color:#969ba7}
body.page-home .home-directory-heading>p:last-child{font-size:12.5px;line-height:1.65;max-width:360px;margin:0 3px 10px 0}
body.page-home .home-directory-grid{gap:18px}
body.page-home .home-directory .directory-card{
 height:307px;min-height:307px;padding:20px 23px 66px;border-radius:18px;
 border:1px solid rgba(211,218,231,.4);
 background:linear-gradient(160deg,rgba(32,35,42,.58),rgba(5,7,11,.95) 55%);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 14px 30px rgba(0,0,0,.30);
 -webkit-backdrop-filter:none;backdrop-filter:none;
}
body.page-home .home-directory .directory-card::before{
 background:radial-gradient(ellipse 55% 16% at 88% 1%,rgba(253,254,255,.65),transparent),linear-gradient(180deg,rgba(255,255,255,.075),transparent 25%);opacity:.78
}
body.page-home .home-directory .directory-card::after{opacity:.55}
body.page-home .home-directory .directory-card > span:first-child{font-size:9px;letter-spacing:2.6px;color:#d5d7e0}
body.page-home .home-directory .directory-card > h3{font:500 22px/1.15 var(--display);letter-spacing:-.9px;margin:15px 0 7px;z-index:4}
body.page-home .home-directory .directory-card > p{font-size:12px;line-height:1.55;max-width:245px;z-index:4;color:#d0d1d6}
body.page-home .home-directory .directory-card > .sx-discovery-art,
body.page-home .home-directory .directory-card > .sx-art-interfaces {
 width:100%;height:75%;left:0;right:0;bottom:0;z-index:2;
 background-size:cover;background-position:center bottom;
 opacity:1;filter:none;mix-blend-mode:normal;
 -webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.35) 11%,black 31%,black 100%);
 mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.35) 11%,black 31%,black 100%);
}
body.page-home .home-directory .directory-card > .sx-art-network {background-image:url('images/sx-approved-solutions.webp')}
body.page-home .home-directory .directory-card > .sx-art-interfaces {background-image:url('images/sx-approved-services.webp')}
body.page-home .home-directory .directory-card > .sx-art-sx {background-image:url('images/sx-approved-about.webp')}
body.page-home .home-directory .directory-card > b{right:15px;bottom:15px;width:41px;height:41px;z-index:7}
/* Existing closing CTA stays in place. Only a quiet astronomical treatment. */
body.page-home .home-closer{position:relative;isolation:isolate;overflow:hidden;padding:70px 20px 78px;background:#05070a}
body.page-home .home-closer::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('images/sx-home-cosmic-1920.webp') center 54%/cover no-repeat;opacity:.30;filter:none}
body.page-home .home-closer::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(2,3,6,.80),rgba(2,3,6,.52) 55%,rgba(2,3,6,.94))}
body.page-home .home-closer h2{font-size:clamp(29px,3.4vw,43px);line-height:1.17;letter-spacing:-1.4px;margin:22px auto 24px}
body.page-home .footer {background:#030407}
@media(max-width:1180px){
 body.page-home .hero{margin-top:-88px;padding-top:88px;min-height:625px}
 body.page-home .hero-copy{width:calc(100% - 76px);padding-right:min(37vw,360px);margin:10px auto 35px}
 body.page-home .hero h1{font-size:clamp(40px,5vw,61px)}
 body.page-home .hero-services{width:calc(100% - 75px)}
 body.page-home .home-directory{width:calc(100% - 76px);padding-top:55px}
 body.page-home .home-directory .directory-card{height:330px;min-height:330px;padding:23px 17px 65px}
 body.page-home .home-directory .directory-card > h3{font-size:20px}
 body.page-home .home-directory .directory-card > p{font-size:11px}
}
@media(max-width:760px){
 body.page-home .hero{min-height:625px;margin-top:-72px;padding-top:90px;align-items:center}
 body.page-home .hero::before{background-position:60% top;background-size:auto 100%}
 body.page-home .hero::after{background:linear-gradient(90deg,rgba(0,0,0,.85),rgba(0,0,0,.50) 88%),linear-gradient(0deg,rgba(0,0,0,.42),transparent 30%)}
 body.page-home .hero-copy{width:calc(100% - 42px);padding:0;margin:5px auto 46px}
 body.page-home .hero h1{font-size:clamp(43px,10.6vw,59px);letter-spacing:-2.5px;white-space:normal}
 body.page-home .hero-intro{font-size:13px;max-width:360px}
 body.page-home .hero-actions{display:flex;flex-wrap:wrap;gap:10px}
 body.page-home .hero-actions > .sx-glass-cta{font-size:11px;height:47px;padding:0 13px 0 16px;min-height:47px}
 body.page-home .hero-services{bottom:23px;width:calc(100% - 34px);gap:9px;font-size:7px;letter-spacing:1px}
 body.page-home .hero-services:before,body.page-home .hero-services:after{display:none}
 body.page-home .hero-services i{height:15px}
 body.page-home .home-directory{width:calc(100% - 38px);padding-top:40px;padding-bottom:50px}
 body.page-home .home-directory-heading{display:block;margin-bottom:23px}
 body.page-home .home-directory-heading h2{font-size:41px;margin:20px 0 12px}
 body.page-home .home-directory-heading>p:last-child{font-size:12.5px;max-width:320px;margin:13px 0 0}
 body.page-home .home-directory-grid{grid-template-columns:1fr;gap:14px}
 body.page-home .home-directory .directory-card{height:337px;min-height:337px;padding:23px 22px 65px}
 body.page-home .home-directory .directory-card > h3{font-size:24px;margin:23px 0 8px}
 body.page-home .home-directory .directory-card > p{font-size:12.5px;max-width:280px}
 body.page-home .home-directory .directory-card > .sx-discovery-art,body.page-home .home-directory .directory-card > .sx-art-interfaces{height:78%}
 body.page-home .home-directory .directory-card > b{width:45px;height:45px;right:17px;bottom:17px}
 body.page-home .home-closer{padding:65px 18px 78px}
}
@media(max-width:375px){body.page-home .hero-actions{gap:8px}body.page-home .hero-actions > .sx-glass-cta{font-size:10px;padding-inline:11px}body.page-home .hero-services{font-size:6px;gap:6px}}
@media(prefers-reduced-motion:reduce){body.page-home .home-directory .directory-card,body.page-home .home-directory .directory-card > .sx-discovery-art{transition:none!important;animation:none!important}}
/* Wider production monitors: maintain reference proportions without enlarging any raster beyond its source. */
@media (min-width:2100px){
 body.page-home .site-header{width:min(74vw,2050px);height:clamp(72px,3.5vw,110px);padding-inline:clamp(20px,1.2vw,36px)}
 body.page-home .site-header .nav>a:not(.button){min-height:clamp(45px,2.2vw,60px);font-size:clamp(12px,.70vw,17px);padding-inline:clamp(10px,.85vw,26px)}
 body.page-home .site-header .brand-mark{font-size:clamp(30px,1.8vw,48px)}
 body.page-home .site-header .brand-name{font-size:clamp(9px,.60vw,14px)}
 body.page-home .site-header .header-cta{min-width:clamp(145px,8.5vw,220px);min-height:50px;font-size:clamp(12px,.67vw,16px)}
 body.page-home .hero{margin-top:-125px;padding-top:125px;min-height:clamp(620px,28.7vw,1100px)}
 body.page-home .hero-copy{width:min(71vw,1950px);padding-right:min(31vw,900px)}
 body.page-home .hero h1{font-size:clamp(71px,4vw,130px);letter-spacing:-.05em}
 body.page-home .hero-copy .eyebrow{font-size:clamp(10px,.55vw,16px)}
 body.page-home .hero-intro{font-size:clamp(15px,.95vw,23px);max-width:720px}
 body.page-home .hero-actions{margin-top:35px}
 body.page-home .hero-actions>.sx-glass-cta{min-height:53px;height:53px;font-size:15px}
 body.page-home .hero-services{bottom:55px;width:min(65vw,1700px);font-size:11px}
 body.page-home .home-directory{width:min(70vw,1880px);padding-top:48px;padding-bottom:78px}
 body.page-home .home-directory-heading h2{font-size:clamp(47px,2.8vw,76px)}
 body.page-home .home-directory-heading>p:last-child{font-size:clamp(14px,.72vw,20px);max-width:500px}
 body.page-home .home-directory .directory-card{height:clamp(400px,18.2vw,580px);min-height:400px;padding:clamp(30px,1.6vw,54px)}
 body.page-home .home-directory .directory-card>h3{font-size:clamp(26px,1.4vw,38px)}
 body.page-home .home-directory .directory-card>p{font-size:clamp(14px,.75vw,19px);max-width:340px}
 body.page-home .home-closer{padding-block:clamp(100px,6vw,190px)}
}