.join-body{background:#e9edf2;color:#101c2c}
.join-main{padding:0}
.join-shell{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(360px,.78fr);overflow:hidden;border:1px solid #9eabb9;background:#fff;box-shadow:0 22px 54px rgba(15,31,52,.14)}
.join-product{min-width:0;padding:clamp(38px,4.2vw,58px);background:#fff}
.join-product-copy{max-width:700px}
.join-label{display:block;color:#2f61aa;font-size:.72rem;font-weight:800;letter-spacing:.085em;text-transform:uppercase}
.join-product h1{max-width:720px;margin:17px 0 0;color:#0b1728;font-size:clamp(2.65rem,4.1vw,4.25rem);font-weight:790;line-height:1;letter-spacing:-.052em;text-wrap:balance}
.join-product-copy>p{max-width:650px;margin:23px 0 0;color:#526074;font-size:1rem;line-height:1.65}
.join-preview-stage{--tilt-x:0deg;--tilt-y:0deg;position:relative;margin:38px 0 0;padding:0 8px 27px;perspective:1400px;transform-style:preserve-3d}
.join-preview-stage::before{content:"";position:absolute;inset:12px 0 17px 17px;border:1px solid #c4cdd8;background:#dfe5ec;transform:translateZ(-28px);box-shadow:0 12px 28px rgba(15,31,52,.08)}
.join-preview{position:relative;z-index:1;margin:0;overflow:hidden;border:1px solid #aeb9c6;background:#f7f8fa;box-shadow:0 18px 38px rgba(15,31,52,.16);transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transform-style:preserve-3d;transition:transform .18s ease-out,box-shadow .18s ease-out}
.join-preview-stage:hover .join-preview{box-shadow:0 24px 48px rgba(15,31,52,.2)}
.join-preview-bar{height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #d7dde5;background:#f4f6f8;color:#647185;font-size:.66rem}
.join-preview-bar>span{display:flex;gap:5px}
.join-preview-bar i{display:block;width:7px;height:7px;border:1px solid #a4afbc;border-radius:50%;background:#fff}
.join-preview-bar b{font-weight:720}
.join-preview picture,.join-preview img{display:block;width:100%}
.join-preview img{height:auto;filter:contrast(1.07) saturate(1.02)}
.join-preview figcaption{padding:11px 14px;border-top:1px solid #d7dde5;background:#fff;color:#667286;font-size:.68rem;font-weight:650}
.join-float-card{position:absolute;z-index:3;display:grid;gap:4px;min-width:170px;padding:11px 13px;border:1px solid #9eaebe;background:#fff;color:#18273a;box-shadow:0 13px 27px rgba(15,31,52,.16);pointer-events:none;transform:translateZ(65px)}
.join-float-card span{color:#66758a;font-size:.58rem;font-weight:760;letter-spacing:.045em;text-transform:uppercase}
.join-float-card strong{font-size:.69rem}
.join-float-campaigns{right:-9px;top:70px}
.join-float-reports{left:-9px;bottom:4px}
.join-product-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:25px;border-top:1px solid #cfd6df;border-bottom:1px solid #cfd6df}
.join-product-grid>div{min-width:0;padding:15px 13px;border-right:1px solid #dce1e7}
.join-product-grid>div:last-child{border-right:0}
.join-product-grid strong,.join-product-grid span{display:block}
.join-product-grid strong{color:#172438;font-size:.76rem}
.join-product-grid span{margin-top:5px;color:#697589;font-size:.64rem;line-height:1.42}
.join-access{min-width:0;display:flex;flex-direction:column;background:#10253d;color:#fff}
.join-access-head{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 clamp(30px,3.2vw,46px);border-bottom:1px solid #31465e;color:#b8c5d4;font-size:.66rem;font-weight:750;letter-spacing:.075em;text-transform:uppercase}
.join-access-index{color:#fff;font-size:.8rem;letter-spacing:.13em}
.join-access-body{display:flex;flex:1;flex-direction:column;padding:clamp(38px,4.2vw,58px) clamp(30px,3.2vw,46px)}
.join-kicker{margin:0;color:#82aef2;font-size:.72rem;font-weight:800;letter-spacing:.075em;text-transform:uppercase}
.join-access h2{margin:17px 0 0;color:#fff;font-size:clamp(2.1rem,3.2vw,3.2rem);font-weight:770;line-height:1.02;letter-spacing:-.045em;text-wrap:balance}
.join-access-intro{margin:21px 0 0;color:#c0cad7;font-size:.93rem;line-height:1.62}
.join-google{min-height:58px;display:flex;align-items:center;justify-content:center;gap:11px;margin-top:31px;border:1px solid #fff;background:#fff;color:#17202c;font-size:.94rem;font-weight:760;box-shadow:0 5px 12px rgba(0,8,19,.22);transition:background .16s ease,border-color .16s ease}
.join-google:hover{border-color:#d9e4f2;background:#f2f6fb}
.join-google img{flex:none}
.join-microsoft{width:100%;min-height:56px;display:flex;align-items:center;justify-content:center;gap:11px;margin-top:12px;border:1px solid #60758d;background:#183049;color:#fff;font:inherit;font-size:.91rem;font-weight:740;cursor:pointer;transition:background .16s ease,border-color .16s ease}
.join-microsoft:hover{border-color:#8297ad;background:#1d3855}
.microsoft-mark{width:20px;height:20px;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:2px;flex:none}
.microsoft-mark i:nth-child(1){background:#f25022}
.microsoft-mark i:nth-child(2){background:#7fba00}
.microsoft-mark i:nth-child(3){background:#00a4ef}
.microsoft-mark i:nth-child(4){background:#ffb900}
.join-maintenance{display:grid;gap:3px;margin-top:12px;padding:12px 14px;border-left:3px solid #82aef2;background:#1a324c;color:#d7e1ec;text-align:left}
.join-maintenance[hidden]{display:none}
.join-maintenance strong{font-size:.72rem}
.join-maintenance span{color:#aebdcd;font-size:.67rem;line-height:1.45}
.join-terms{margin:14px 0 0;color:#94a5b9;font-size:.68rem;line-height:1.5;text-align:center}
.join-terms a{color:#d9e5f4;text-decoration:underline;text-underline-offset:2px}
.join-included{margin-top:36px;padding:27px 0 8px;border-top:1px solid #31465e}
.join-included h3{margin:0;color:#fff;font-size:.76rem;letter-spacing:.025em}
.join-included ul{list-style:none;margin:18px 0 0;padding:0}
.join-included li{display:grid;grid-template-columns:32px 1fr;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid #2d4259;color:#c4ceda;font-size:.78rem;line-height:1.4}
.join-included li:last-child{border-bottom:0}
.join-included li span{color:#6f98d1;font-size:.61rem;font-weight:800;letter-spacing:.07em}
.join-access-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:auto;padding-top:28px;color:#9bacbf;font-size:.68rem}
.join-access-foot a{color:#fff;font-weight:720}
.join-proof{display:grid;grid-template-columns:repeat(3,1fr);margin-top:28px;margin-bottom:64px;border-top:1px solid #bdc6d0;border-bottom:1px solid #bdc6d0}
.join-proof>div{padding:20px 22px;border-right:1px solid #c7cfd8}
.join-proof>div:last-child{border-right:0}
.join-proof strong,.join-proof span{display:block}
.join-proof strong{color:#1b2b40;font-size:.76rem}
.join-proof span{margin-top:5px;color:#667386;font-size:.68rem;line-height:1.45}
@media(max-width:1040px){.join-shell{grid-template-columns:1fr}.join-access{order:-1}.join-access-body{min-height:auto}.join-access-foot{margin-top:30px}.join-product-grid{grid-template-columns:repeat(2,1fr)}.join-product-grid>div:nth-child(2){border-right:0}.join-product-grid>div:nth-child(-n+2){border-bottom:1px solid #dce1e7}}
@media(max-width:620px){.join-body{background:#fff}.join-shell{width:100%;border-inline:0;box-shadow:none}.join-access-head{min-height:60px;padding-inline:20px}.join-access-body{padding:31px 20px 34px}.join-access h2{font-size:clamp(2rem,10vw,2.3rem);line-height:1.04}.join-access-intro{margin-top:17px;font-size:.88rem;line-height:1.55}.join-google{min-height:54px;margin-top:25px;font-size:.88rem}.join-microsoft{min-height:54px;font-size:.86rem}.join-included{margin-top:29px;padding-top:22px}.join-included li{padding:11px 0}.join-access-foot{align-items:flex-start;flex-direction:column;gap:8px;margin-top:24px}.join-product{padding:34px 20px 30px}.join-product h1{font-size:clamp(2.05rem,9.6vw,2.3rem);line-height:1.04}.join-product-copy>p{margin-top:17px;font-size:.9rem;line-height:1.56}.join-preview-stage{margin-top:25px;padding:0}.join-preview-stage::before,.join-float-card{display:none}.join-preview{transform:none!important}.join-preview-bar{height:35px;padding-inline:10px}.join-preview figcaption{padding:9px 10px}.join-product-grid{grid-template-columns:repeat(2,1fr)}.join-product-grid>div{padding:13px 11px;border-right:1px solid #dce1e7;border-bottom:1px solid #dce1e7}.join-product-grid>div:nth-child(2n){border-right:0}.join-product-grid>div:nth-last-child(-n+2){border-bottom:0}.join-proof{width:100%;grid-template-columns:1fr;margin-top:18px;margin-bottom:36px}.join-proof>div{padding:17px 20px;border-right:0;border-bottom:1px solid #c7cfd8}.join-proof>div:last-child{border-bottom:0}}
@media(prefers-reduced-motion:no-preference){.join-shell{animation:joinEnter .5s cubic-bezier(.2,.75,.25,1) both}.join-float-card{animation:joinCardEnter .55s cubic-bezier(.2,.75,.25,1) .18s both}@keyframes joinEnter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes joinCardEnter{from{opacity:0;transform:translateY(9px) translateZ(65px)}to{opacity:1;transform:translateZ(65px)}}}
@media(prefers-reduced-motion:reduce){.join-google,.join-microsoft,.join-preview{transition:none}}