.states__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px);align-items:center}.states__intro .lede{margin-bottom:clamp(28px,3vw,40px)}.states__tabs{display:grid;gap:6px}.states__tab{display:grid;grid-template-columns:minmax(0,1fr) 96px;align-items:center;gap:16px;width:100%;padding:16px 20px;border:1px solid transparent;border-radius:16px;background:transparent;color:var(--c-ink);font:inherit;text-align:left;cursor:pointer;transition:background .25s var(--ease),border-color .25s var(--ease)}.states__tab:hover{background:color-mix(in srgb,var(--c-card) 60%,transparent)}.states__tab[aria-selected=true]{background:#fff;border-color:var(--c-line);box-shadow:0 1px 2px #0000000a,0 8px 24px #1f3b3d0f}.states__tab-text{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px}.states__tab-title{font:var(--head-weight) clamp(21px,1.8vw,26px)/1.15 var(--font-head);letter-spacing:calc(var(--head-tracking) / 2)}.states__tab-line{font-size:15px;line-height:1.4;color:var(--c-muted)}.states__tab .icon--state{width:96px;height:24px;color:var(--c-accent);opacity:.35;transition:opacity .25s var(--ease)}.states__tab[aria-selected=true] .icon--state,.states__tab:hover .icon--state{opacity:1}.states__stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(20px,3vw,48px);min-height:clamp(460px,44vw,600px);padding:clamp(28px,4vw,56px);border-radius:var(--radius);overflow:hidden;isolation:isolate;color:#fff;background:linear-gradient(180deg,#009193,#008083,#006a6c 68%,#004d4f)}.states__stage:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background:radial-gradient(90% 45% at 25% 18%,#009193,transparent 65%),radial-gradient(70% 30% at 85% 75%,rgba(0,145,147,.3),transparent 70%),linear-gradient(172deg,transparent 38%,rgba(0,40,42,.28) 39%,transparent 58%)}.states__panel{max-width:26em;animation:states-in .45s var(--ease) both}.states__panel[hidden]{display:none}.states__kicker{display:block;font:600 12px/1 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:#fffc;margin-bottom:18px}.states__title{font-size:clamp(44px,5vw,72px);color:#fff;margin-bottom:.2em}.states__line{font-size:clamp(18px,1.5vw,21px);line-height:1.4;margin-bottom:14px}.states__desc{font-size:16px;line-height:1.55;color:#ffffffe0}.states__panel .icon--state{display:block;width:180px;height:48px;margin-top:24px;color:var(--accent);stroke-width:2}.states__phone{width:clamp(150px,15vw,220px);filter:drop-shadow(0 24px 40px rgba(10,25,27,.45))}.states__phone img{display:block;width:100%;height:auto}@keyframes states-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.states__panel{animation:none}.states__tab{transition:none}}@media(max-width:960px){.states__grid{grid-template-columns:minmax(0,1fr)}.states__tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.states__tab{grid-template-columns:minmax(0,1fr);gap:10px;padding:14px 16px}.states__tab-text{flex-direction:column}.states__tab .icon--state{width:72px;height:18px}.states__stage{min-height:0}}@media(max-width:560px){.states__tab-line{font-size:14px}.states__stage{grid-template-columns:minmax(0,1fr) 112px;padding:24px 20px;gap:16px}.states__title{font-size:38px}.states__line{font-size:16px}.states__desc{font-size:14px}.states__panel .icon--state{width:120px;height:32px;margin-top:14px}.states__phone{width:112px}}.states__scale{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:340px;margin:32px 0 0;padding:0;list-style:none}.states__scale li{position:relative;padding-top:28px;font:600 12px/1 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:#fffc}.states__scale li:before{content:"";position:absolute;top:6px;left:0;right:0;height:2px;background:#ffffff4d}.states__scale li:last-child:before{right:auto;width:14px}.states__scale li:after{content:"";position:absolute;top:0;left:0;width:14px;height:14px;border-radius:50%;background:var(--accent, #ff8f49)}@media(max-width:560px){.states__scale{margin-top:20px}.states__scale li{padding-top:24px;font-size:11px}}.states__panel--static .states__title{font-size:clamp(38px,4.2vw,60px);white-space:nowrap}@media(max-width:560px){.states__panel--static .states__title{font-size:32px;white-space:normal}}
/*# sourceMappingURL=/cdn/shop/t/17/assets/state-selector.css.map */