/* Technology of Austin — unified Door 1 / Door 2 / Door 3 design system.
   One brand language, one interaction language, responsive geometry only. */
:root{
  --toa-ds-bg:#02060b;
  --toa-ds-bg-2:#08111e;
  --toa-ds-panel:rgba(10,22,34,.82);
  --toa-ds-panel-strong:rgba(5,13,22,.94);
  --toa-ds-line:rgba(205,230,238,.12);
  --toa-ds-line-strong:rgba(157,199,215,.34);
  --toa-ds-text:#f5f8fa;
  --toa-ds-muted:#9fb0ba;
  --toa-ds-cyan:#9dc7d7;
  --toa-ds-sky:#c8dce4;
  --toa-ds-blue:#a9c4d0;
  --toa-ds-lilac:#b7bbff;
  --toa-ds-radius:20px;
  --toa-ds-radius-sm:14px;
  --toa-ds-shadow:0 26px 72px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.045);
  --toa-ds-max:1180px;
  --toa-ds-sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --toa-ds-serif:Iowan Old Style,Baskerville,Georgia,'Times New Roman',serif;
}

html{
  background:var(--toa-ds-bg)!important;
}
body.toa-one-tap-page,
body.page-id-261,
body.page-id-262{
  margin:0!important;
  background:
    radial-gradient(ellipse at 14% 8%,rgba(66,119,151,.16),transparent 36%),
    radial-gradient(ellipse at 84% 16%,rgba(109,92,142,.12),transparent 38%),
    radial-gradient(ellipse at 54% 88%,rgba(159,199,215,.07),transparent 42%),
    linear-gradient(180deg,#02060b 0%,#07111d 54%,#03070d 100%)!important;
  color:var(--toa-ds-text)!important;
  font-family:var(--toa-ds-sans)!important;
}
.toa-homepage,
#toa-customize-page,
#toa-plans-page,
.toa-door2-shell,
.toa-plans-shell{
  background:transparent!important;
  color:var(--toa-ds-text)!important;
}

/* One top-chrome language across the full three-Door journey. */
body.toa-one-tap-page #toa-header,
#toa-customize-page .toa-door-bar,
#toa-plans-page .toa-door-bar{
  min-height:68px;
  background:rgba(7,21,36,.94)!important;
  border:0!important;
  border-bottom:1px solid var(--toa-ds-line)!important;
  box-shadow:0 10px 34px rgba(0,12,24,.12)!important;
  color:var(--toa-ds-muted)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body.toa-one-tap-page #toa-header::after,
#toa-customize-page .toa-door-bar::after,
#toa-plans-page .toa-door-bar::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:-1px!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(53,207,255,.42),rgba(143,232,255,.72),rgba(196,200,255,.32),transparent)!important;
  background-size:100% 100%!important;
  box-shadow:none!important;
  animation:none!important;
  pointer-events:none!important;
}
#toa-customize-page .toa-door-bar,
#toa-plans-page .toa-door-bar{
  position:sticky;
  top:0;
  z-index:80;
  padding:12px max(18px,4vw) 12px max(64px,calc(4vw + 46px))!important;
  background-image:url("https://technologyofaustin.com/wp-content/uploads/2026/09/technology-of-austin-transparent-mark.png"),linear-gradient(180deg,rgba(5,13,22,.97),rgba(3,8,14,.95))!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:max(18px,4vw) center,center!important;
  background-size:34px 30px,100% 100%!important;
  font-size:9px!important;
  font-weight:800!important;
  letter-spacing:.11em!important;
}
#toa-customize-page .toa-door-bar a,
#toa-plans-page .toa-door-bar a,
body.toa-one-tap-page #toa-nav a{
  color:#d9edf7!important;
  text-decoration:none!important;
}
.toa-door-progress{gap:6px!important}
.toa-door-progress span{
  width:28px!important;
  height:3px!important;
  border-radius:999px!important;
  background:rgba(151,222,255,.15)!important;
  box-shadow:none!important;
  animation:none!important;
}
.toa-door-progress .active{
  background:linear-gradient(90deg,var(--toa-ds-blue),var(--toa-ds-cyan))!important;
  box-shadow:0 0 12px rgba(53,207,255,.18)!important;
}

/* Consistent content width + spacing rhythm. */
.toa-shell,
.toa-custom-hero,
.toa-studio,
.toa-plans-hero,
.toa-plan-grid,
.toa-checkout-head,
.toa-checkout-grid,
.toa-after-order,
.toa-plans-foot{
  width:100%;
  max-width:var(--toa-ds-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.toa-custom-hero,
.toa-plans-hero{
  padding-top:72px!important;
  padding-bottom:30px!important;
}

/* Typography: same voice in all Doors. */
.toa-homepage h1,.toa-homepage h2,.toa-homepage h3,
.toa-custom-hero h1,.preview-brand h3,.preview-review-card h4,.preview-feature-card h4,.preview-wifi-card h4,
.toa-plans-hero h1,.toa-plan h2,.toa-build-recap h2,.toa-checkout-head h2,.toa-summary h3{
  font-family:var(--toa-ds-serif)!important;
  font-weight:400!important;
  letter-spacing:-.045em!important;
  color:var(--toa-ds-text)!important;
}
.toa-eyebrow,.toa-kicker,.toa-plan-label,.toa-build-recap small,.toa-summary>small,.toa-example-switcher>span,
.preview-brand small,.preview-review-card small,.preview-feature-card small,.preview-wifi-card small,.preview-info-card small,.preview-social-card small{
  color:var(--toa-ds-sky)!important;
  font-weight:900!important;
  letter-spacing:.15em!important;
}
.toa-homepage p,.toa-custom-hero p,.toa-plans-hero>p,.toa-plan>p,.toa-summary>p,.toa-checkout-head p,.toa-door2-next small{
  color:var(--toa-ds-muted)!important;
}

/* One card material across Story, Builder and Plans. */
.toa-product-card,
.toa-vision-stack>div,
.toa-usecase-list>div,
.toa-faq-list details,
.toa-example-switcher,
.toa-control-group,
.toa-build-recap,
.toa-plan,
.toa-summary,
#toa-checkout-form,
.toa-after-order{
  border:1px solid var(--toa-ds-line)!important;
  border-radius:var(--toa-ds-radius)!important;
  background:linear-gradient(180deg,rgba(16,45,73,.76),rgba(8,27,45,.84))!important;
  box-shadow:var(--toa-ds-shadow)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.toa-control-group.open,
.toa-plan.selected{
  border-color:var(--toa-ds-line-strong)!important;
  box-shadow:0 20px 58px rgba(0,29,58,.20),0 0 0 1px rgba(53,207,255,.06),inset 0 1px 0 rgba(255,255,255,.06)!important;
}

/* One CTA system. */
.toa-primary-cta,
.toa-next-cta,
.toa-plan.selected button,
#toa-checkout-form button,
.ot-btn.ot-primary,
.preview-primary{
  min-height:54px!important;
  border:1px solid rgba(143,232,255,.50)!important;
  border-radius:var(--toa-ds-radius-sm)!important;
  background:linear-gradient(135deg,var(--toa-ds-blue) 0%,#168dff 45%,var(--toa-ds-cyan) 100%)!important;
  color:#fff!important;
  font-family:var(--toa-ds-sans)!important;
  font-weight:900!important;
  letter-spacing:0!important;
  box-shadow:0 14px 34px rgba(11,114,255,.18)!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,filter .16s ease!important;
}
.toa-primary-cta:hover,.toa-next-cta:hover,.toa-plan.selected button:hover,#toa-checkout-form button:hover,.ot-btn.ot-primary:hover,.preview-primary:hover{
  transform:translateY(-1px)!important;
  filter:brightness(1.04)!important;
  box-shadow:0 18px 42px rgba(11,114,255,.22)!important;
}
.toa-primary-cta:active,.toa-next-cta:active,.toa-plan.selected button:active,#toa-checkout-form button:active,.ot-btn.ot-primary:active,.preview-primary:active{
  transform:translateY(0)!important;
}

/* Secondary controls use one shape and response language. */
.toa-example-switcher button,
.toa-choice-grid button,.toa-primary-grid button,
.toa-plan button,
.preview-action,
.preview-review-card button,
.toa-generated-url{
  border-radius:var(--toa-ds-radius-sm)!important;
  border-color:rgba(151,222,255,.24)!important;
  background:rgba(7,25,42,.78)!important;
  color:#e3f3fb!important;
  transition:border-color .16s ease,background .16s ease,transform .16s ease,box-shadow .16s ease!important;
}
.toa-example-switcher button:hover,.toa-choice-grid button:hover,.toa-primary-grid button:hover,.toa-plan button:hover,.preview-action:hover,.preview-review-card button:hover,.toa-generated-url:hover{
  border-color:rgba(143,232,255,.50)!important;
  background:rgba(14,46,74,.88)!important;
}
.toa-choice-grid button.active,.toa-primary-grid button.active{
  border-color:rgba(143,232,255,.62)!important;
  background:rgba(20,71,108,.88)!important;
  box-shadow:inset 0 0 0 1px rgba(143,232,255,.07)!important;
}

/* Inputs feel identical in Builder + Plan intake. */
.toa-group-body input,.toa-group-body textarea,.toa-group-body select,
#toa-checkout-form input{
  min-height:48px!important;
  border:1px solid rgba(151,222,255,.24)!important;
  border-radius:12px!important;
  background:#06111d!important;
  color:#fff!important;
  padding:11px 12px!important;
  font-size:13px!important;
  outline:none!important;
  box-shadow:none!important;
}
.toa-group-body input:focus,.toa-group-body textarea:focus,.toa-group-body select:focus,#toa-checkout-form input:focus{
  border-color:rgba(143,232,255,.72)!important;
  box-shadow:0 0 0 3px rgba(53,207,255,.08)!important;
}

/* The phone preview belongs to the same material system, but remains obviously a device. */
.toa-device-frame,.ot-phone{
  box-shadow:0 30px 78px rgba(0,8,18,.34),0 0 0 1px rgba(151,222,255,.15)!important;
}

/* Remove page-specific ambient layers so the three Doors share one atmosphere. */
.toa-friendly-field,.toa-aqua-field,
.toa-door2-shell::before,.toa-door2-shell::after,
.toa-plans-shell::before,.toa-plans-shell::after{
  display:none!important;
}

/* Door 1 plugin-rendered components use the same typography/materials too. */
.ot-title,.ot-demo h2,.ot-close h2,.ot-section h2{
  font-family:var(--toa-ds-serif)!important;
  font-weight:400!important;
  letter-spacing:-.045em!important;
  color:var(--toa-ds-text)!important;
}
.ot-copy,.ot-demo p,.ot-close p,.ot-small{
  color:var(--toa-ds-muted)!important;
}
.ot-section,.ot-values>div,.ot-previewtile{
  border-color:var(--toa-ds-line)!important;
}
.ot-values>div,.ot-previewtile{
  background:linear-gradient(180deg,rgba(16,45,73,.76),rgba(8,27,45,.84))!important;
  border-radius:var(--toa-ds-radius-sm)!important;
  box-shadow:var(--toa-ds-shadow)!important;
}
.ot-title,.toa-homepage h1,.toa-custom-hero h1,.toa-plans-hero h1{
  font-size:clamp(50px,7.2vw,84px)!important;
  line-height:.96!important;
}

/* Mobile: all three Doors use the same non-floating top behavior and safe-area treatment. */
@media(max-width:780px){
  html,body.toa-one-tap-page,body.page-id-261,body.page-id-262{
    background:var(--toa-ds-bg)!important;
  }
  body.toa-one-tap-page #toa-header,
  #toa-customize-page .toa-door-bar,
  #toa-plans-page .toa-door-bar{
    position:relative!important;
    top:auto!important;
    min-height:0!important;
    box-shadow:none!important;
    background:#071524!important;
  }
  #toa-customize-page .toa-door-bar,
  #toa-plans-page .toa-door-bar{
    padding:10px 12px!important;
  }
  .toa-custom-hero,.toa-plans-hero{
    padding:42px 18px 22px!important;
  }
  .toa-studio,.toa-plan-grid,.toa-checkout{
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .toa-product-card,.toa-vision-stack>div,.toa-usecase-list>div,.toa-faq-list details,
  .toa-example-switcher,.toa-control-group,.toa-build-recap,.toa-plan,.toa-summary,#toa-checkout-form,.toa-after-order{
    border-radius:18px!important;
  }
  .toa-primary-cta,.toa-next-cta,.toa-plan.selected button,#toa-checkout-form button,.ot-btn.ot-primary,.preview-primary{
    min-height:56px!important;
    border-radius:14px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .toa-primary-cta,.toa-next-cta,.toa-plan button,#toa-checkout-form button,.ot-btn,.preview-primary,
  .toa-example-switcher button,.toa-choice-grid button,.toa-primary-grid button,.preview-action{
    transition:none!important;
  }
}

/* Door 1 parity — Doors 2 + 3 inherit the same luxury atmosphere, materials and real TOA mark. */
body.page-id-261,
body.page-id-262{
  background:
    radial-gradient(ellipse at 14% 18%,rgba(76,137,177,.22),transparent 42%),
    radial-gradient(ellipse at 82% 20%,rgba(116,103,162,.16),transparent 44%),
    radial-gradient(ellipse at 52% 78%,rgba(167,211,226,.10),transparent 46%),
    radial-gradient(ellipse at 70% 64%,rgba(211,193,157,.045),transparent 34%),
    linear-gradient(160deg,#020409 0%,#06101a 42%,#0a1422 72%,#05080f 100%)!important;
  background-attachment:fixed!important;
}
#toa-customize-page,
#toa-plans-page,
.toa-door2-shell,
.toa-plans-shell{background:transparent!important;color:#f5f8fa!important}

#toa-customize-page .toa-door-bar,
#toa-plans-page .toa-door-bar{
  position:sticky!important;
  top:0!important;
  min-height:68px!important;
  padding:12px max(18px,4vw) 12px max(76px,calc(4vw + 56px))!important;
  background:linear-gradient(180deg,rgba(5,13,22,.97),rgba(3,8,14,.95))!important;
  border-bottom:1px solid rgba(205,230,238,.12)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.24)!important;
  overflow:visible!important;
}
#toa-customize-page .toa-door-bar::before,
#toa-plans-page .toa-door-bar::before{
  content:""!important;
  position:absolute!important;
  left:max(18px,4vw)!important;
  top:50%!important;
  width:46px!important;
  height:42px!important;
  transform:translateY(-50%)!important;
  background:url("https://technologyofaustin.com/wp-content/uploads/2026/09/technology-of-austin-transparent-mark.png") center/contain no-repeat!important;
  filter:brightness(1.08) saturate(.88) contrast(1.04) drop-shadow(0 0 13px rgba(157,199,215,.16))!important;
  pointer-events:none!important;
}
#toa-customize-page .toa-door-bar::after,
#toa-plans-page .toa-door-bar::after{
  background:linear-gradient(90deg,transparent,rgba(157,199,215,.26),rgba(200,220,228,.40),rgba(183,187,255,.22),transparent)!important;
}
#toa-customize-page .toa-door-bar a,
#toa-plans-page .toa-door-bar a{color:#eaf2f5!important}
.toa-door-progress span{background:rgba(205,230,238,.10)!important}
.toa-door-progress .active{background:linear-gradient(90deg,#9dc7d7,#b7bbff)!important;box-shadow:0 0 14px rgba(157,199,215,.14)!important}

.toa-custom-hero h1,.toa-plans-hero h1,.preview-brand h3,.preview-review-card h4,.preview-feature-card h4,.preview-wifi-card h4,.toa-plan h2,.toa-build-recap h2,.toa-checkout-head h2,.toa-summary h3{
  font-family:Iowan Old Style,Baskerville,Georgia,'Times New Roman',serif!important;
  color:#f5f8fa!important;
}
.toa-eyebrow,.toa-kicker,.toa-plan-label,.toa-build-recap small,.toa-summary>small,.toa-example-switcher>span,.preview-brand small,.preview-review-card small,.preview-feature-card small,.preview-wifi-card small,.preview-info-card small,.preview-social-card small{color:#9dc7d7!important}
.toa-custom-hero p,.toa-plans-hero>p,.toa-plan>p,.toa-summary>p,.toa-checkout-head p,.toa-door2-next small{color:#9fb0ba!important}

.toa-example-switcher,.toa-control-group,.toa-build-recap,.toa-plan,.toa-summary,#toa-checkout-form,.toa-after-order{
  border:1px solid rgba(205,230,238,.12)!important;
  background:linear-gradient(180deg,rgba(10,22,34,.92),rgba(4,11,18,.96))!important;
  box-shadow:0 30px 90px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.toa-control-group.open,.toa-plan.selected{
  border-color:rgba(157,199,215,.34)!important;
  box-shadow:0 32px 96px rgba(0,0,0,.38),0 0 0 1px rgba(183,187,255,.05),inset 0 1px 0 rgba(255,255,255,.05)!important;
}

.toa-primary-cta,.toa-next-cta,.toa-plan.selected button,#toa-checkout-form button,.preview-primary{
  border:1px solid rgba(255,255,255,.50)!important;
  background:linear-gradient(112deg,#edf6f8 0%,#c7dee5 48%,#a9c4d0 74%,#b7bbff 120%)!important;
  color:#071018!important;
  box-shadow:0 16px 38px rgba(0,0,0,.26)!important;
}
.toa-primary-cta:hover,.toa-next-cta:hover,.toa-plan.selected button:hover,#toa-checkout-form button:hover,.preview-primary:hover{
  filter:brightness(1.03)!important;
  box-shadow:0 20px 46px rgba(0,0,0,.32)!important;
}
.toa-example-switcher button,.toa-choice-grid button,.toa-primary-grid button,.toa-plan button,.preview-action,.preview-review-card button,.toa-generated-url{
  border-color:rgba(205,230,238,.12)!important;
  background:rgba(3,9,15,.56)!important;
  color:#dce8ed!important;
}
.toa-example-switcher button:hover,.toa-choice-grid button:hover,.toa-primary-grid button:hover,.toa-plan button:hover,.preview-action:hover,.preview-review-card button:hover,.toa-generated-url:hover{
  border-color:rgba(157,199,215,.34)!important;
  background:rgba(10,22,34,.82)!important;
}
.toa-choice-grid button.active,.toa-primary-grid button.active{
  border-color:rgba(157,199,215,.40)!important;
  background:linear-gradient(145deg,rgba(29,51,64,.82),rgba(18,22,45,.82))!important;
  box-shadow:inset 0 0 0 1px rgba(183,187,255,.05)!important;
}
.toa-group-body input,.toa-group-body textarea,.toa-group-body select,#toa-checkout-form input{
  border-color:rgba(205,230,238,.14)!important;
  background:#06101a!important;
  color:#f5f8fa!important;
}
.toa-group-body input:focus,.toa-group-body textarea:focus,.toa-group-body select:focus,#toa-checkout-form input:focus{
  border-color:rgba(157,199,215,.56)!important;
  box-shadow:0 0 0 3px rgba(157,199,215,.07)!important;
}
.toa-device-frame{box-shadow:0 34px 90px rgba(0,0,0,.42),0 0 0 1px rgba(205,230,238,.12)!important}

@media(max-width:780px){
  html,body.page-id-261,body.page-id-262{
    background:
      radial-gradient(ellipse at 18% 10%,rgba(76,137,177,.18),transparent 38%),
      radial-gradient(ellipse at 82% 18%,rgba(116,103,162,.12),transparent 40%),
      linear-gradient(160deg,#020409 0%,#06101a 48%,#05080f 100%)!important;
  }
  #toa-customize-page .toa-door-bar,
  #toa-plans-page .toa-door-bar{
    position:relative!important;
    top:auto!important;
    padding:10px 12px 10px 60px!important;
    background:linear-gradient(180deg,#050d16,#03080e)!important;
  }
  #toa-customize-page .toa-door-bar::before,
  #toa-plans-page .toa-door-bar::before{
    left:12px!important;
    width:38px!important;
    height:34px!important;
  }
}

/* Door 1 motion language carried through Door 2 + Door 3. */
body.page-id-261,
body.page-id-262{
  position:relative!important;
  isolation:isolate;
}
body.page-id-261::before,
body.page-id-262::before,
body.page-id-261::after,
body.page-id-262::after{
  content:"";
  position:fixed;
  inset:-24vh -18vw;
  pointer-events:none;
  z-index:0;
  filter:blur(76px);
  opacity:.72;
  will-change:transform;
}
body.page-id-261::before,
body.page-id-262::before{
  background:
    radial-gradient(ellipse at 18% 26%,rgba(79,149,184,.18),transparent 38%),
    radial-gradient(ellipse at 78% 22%,rgba(127,111,177,.13),transparent 40%),
    radial-gradient(ellipse at 56% 78%,rgba(167,211,226,.08),transparent 44%);
  animation:toaDoorAtmosphereA 24s ease-in-out infinite alternate;
}
body.page-id-261::after,
body.page-id-262::after{
  background:
    radial-gradient(ellipse at 72% 64%,rgba(213,195,160,.04),transparent 30%),
    radial-gradient(ellipse at 28% 72%,rgba(125,181,204,.08),transparent 36%);
  animation:toaDoorAtmosphereB 30s ease-in-out infinite alternate;
}
#toa-customize-page,
#toa-plans-page{
  position:relative;
  z-index:1;
}

@keyframes toaDoorAtmosphereA{
  0%{transform:translate3d(-2%,1%,0) scale(1.02) rotate(-1deg)}
  100%{transform:translate3d(4%,-3%,0) scale(1.09) rotate(2deg)}
}
@keyframes toaDoorAtmosphereB{
  0%{transform:translate3d(3%,-1%,0) scale(1.04)}
  100%{transform:translate3d(-3%,3%,0) scale(1.10)}
}
@keyframes toaDoorEnter{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes toaDoorFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
@keyframes toaDoorShimmer{
  0%{background-position:0% 50%}
  100%{background-position:200% 50%}
}
@keyframes toaDoorLogoBreath{
  0%,100%{filter:brightness(1.08) saturate(.88) contrast(1.04) drop-shadow(0 0 10px rgba(157,199,215,.12))}
  50%{filter:brightness(1.12) saturate(.92) contrast(1.04) drop-shadow(0 0 18px rgba(183,187,255,.18))}
}

#toa-customize-page .toa-door-bar::before,
#toa-plans-page .toa-door-bar::before{
  animation:toaDoorLogoBreath 7s ease-in-out infinite;
}

.toa-example-switcher,
.toa-control-group,
.toa-build-recap,
.toa-plan,
.toa-summary,
#toa-checkout-form,
.toa-after-order{
  transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .28s ease,box-shadow .28s ease,background .28s ease!important;
}
.toa-control-group:hover,
.toa-plan:hover,
.toa-summary:hover,
#toa-checkout-form:hover{
  transform:translateY(-2px);
  border-color:rgba(205,230,238,.18)!important;
  box-shadow:0 34px 98px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.045)!important;
}
.toa-control-group.open,
.toa-plan.selected{
  transform:translateY(-2px);
}

.toa-primary-cta,
.toa-next-cta,
.toa-plan button,
#toa-checkout-form button,
.preview-primary,
.toa-example-switcher button,
.toa-choice-grid button,
.toa-primary-grid button,
.preview-action{
  transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,border-color .22s ease,background .22s ease,filter .22s ease!important;
}
.toa-primary-cta:hover,
.toa-next-cta:hover,
.toa-plan button:hover,
#toa-checkout-form button:hover,
.preview-primary:hover,
.toa-example-switcher button:hover,
.toa-choice-grid button:hover,
.toa-primary-grid button:hover,
.preview-action:hover{
  transform:translateY(-2px)!important;
}
.toa-primary-cta:active,
.toa-next-cta:active,
.toa-plan button:active,
#toa-checkout-form button:active,
.preview-primary:active,
.toa-example-switcher button:active,
.toa-choice-grid button:active,
.toa-primary-grid button:active,
.preview-action:active{
  transform:translateY(0) scale(.985)!important;
}

.toa-door-progress .active{
  background:linear-gradient(90deg,#9dc7d7,#e5eff2,#b7bbff,#9dc7d7)!important;
  background-size:200% 100%!important;
  animation:toaDoorShimmer 5s linear infinite;
}

.toa-device-frame{
  transform-origin:center center;
}
.toa-group-body input,
.toa-group-body textarea,
.toa-group-body select,
#toa-checkout-form input{
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease,transform .2s ease!important;
}
.toa-group-body input:focus,
.toa-group-body textarea:focus,
.toa-group-body select:focus,
#toa-checkout-form input:focus{
  background:#081522!important;
  transform:translateY(-1px);
}

@media(prefers-reduced-motion:no-preference){
  .toa-custom-hero,
  .toa-plans-hero{
    animation:toaDoorEnter .62s cubic-bezier(.2,.8,.2,1) both;
  }
  .toa-example-switcher,
  .toa-build-recap,
  .toa-summary,
  #toa-checkout-form{
    animation:toaDoorEnter .62s cubic-bezier(.2,.8,.2,1) .08s both;
  }
  .toa-control-group,
  .toa-plan{
    animation:toaDoorEnter .56s cubic-bezier(.2,.8,.2,1) both;
  }
  .toa-control-group:nth-child(2),
  .toa-plan:nth-child(2){animation-delay:.07s}
  .toa-control-group:nth-child(3),
  .toa-plan:nth-child(3){animation-delay:.13s}
  .toa-control-group:nth-child(4){animation-delay:.19s}
  .toa-device-frame{animation:toaDoorFloat 9s ease-in-out infinite}
}

@media(max-width:780px){
  body.page-id-261::before,
  body.page-id-262::before,
  body.page-id-261::after,
  body.page-id-262::after{
    inset:-12vh -40vw;
    filter:blur(64px);
    opacity:.58;
  }
  .toa-control-group:hover,
  .toa-plan:hover,
  .toa-summary:hover,
  #toa-checkout-form:hover{
    transform:none;
  }
}

/* The plugin gives each Door an inline !important background, so the moving atmosphere lives inside the Door itself. */
#toa-customize-page,
#toa-plans-page{
  overflow:hidden;
}
#toa-customize-page::before,
#toa-plans-page::before,
#toa-customize-page::after,
#toa-plans-page::after{
  content:"";
  position:fixed;
  inset:-24vh -18vw;
  pointer-events:none;
  z-index:0;
  filter:blur(76px);
  will-change:transform;
}
#toa-customize-page::before,
#toa-plans-page::before{
  background:
    radial-gradient(ellipse at 16% 24%,rgba(79,149,184,.19),transparent 39%),
    radial-gradient(ellipse at 80% 20%,rgba(127,111,177,.14),transparent 41%),
    radial-gradient(ellipse at 54% 82%,rgba(167,211,226,.09),transparent 45%);
  opacity:.74;
  animation:toaDoorAtmosphereA 24s ease-in-out infinite alternate;
}
#toa-customize-page::after,
#toa-plans-page::after{
  background:
    radial-gradient(ellipse at 72% 62%,rgba(213,195,160,.045),transparent 31%),
    radial-gradient(ellipse at 26% 72%,rgba(125,181,204,.08),transparent 37%);
  opacity:.58;
  animation:toaDoorAtmosphereB 30s ease-in-out infinite alternate;
}
#toa-customize-page > *,
#toa-plans-page > *{
  position:relative;
  z-index:1;
}

@media(prefers-reduced-motion:reduce){
  body.page-id-261::before,
  body.page-id-262::before,
  body.page-id-261::after,
  body.page-id-262::after,
  #toa-customize-page::before,
  #toa-plans-page::before,
  #toa-customize-page::after,
  #toa-plans-page::after,
  #toa-customize-page .toa-door-bar::before,
  #toa-plans-page .toa-door-bar::before,
  .toa-door-progress .active,
  .toa-custom-hero,
  .toa-plans-hero,
  .toa-example-switcher,
  .toa-control-group,
  .toa-build-recap,
  .toa-plan,
  .toa-summary,
  #toa-checkout-form,
  .toa-after-order,
  .toa-device-frame{
    animation:none!important;
  }
}

/* FINAL PARITY OVERRIDE — Door 2 + Door 3 use Door 1's exact background + motion language. */
body.page-id-261,
body.page-id-262{
  background:#020409!important;
}

#toa-customize-page,
#toa-plans-page,
.toa-door2-shell,
.toa-plans-shell{
  position:relative!important;
  background:linear-gradient(160deg,#020409 0%,#06101a 42%,#0a1422 72%,#05080f 100%)!important;
  color:#f5f8fa!important;
}

body.page-id-261::before,
body.page-id-261::after,
body.page-id-262::before,
body.page-id-262::after,
#toa-customize-page::after,
#toa-plans-page::after{
  display:none!important;
}

#toa-customize-page::before,
#toa-plans-page::before{
  content:""!important;
  display:block!important;
  position:fixed!important;
  inset:-20vh -22vw!important;
  pointer-events:none!important;
  z-index:0!important;
  background:
    radial-gradient(ellipse at 14% 18%,rgba(76,137,177,.22),transparent 42%),
    radial-gradient(ellipse at 82% 20%,rgba(116,103,162,.16),transparent 44%),
    radial-gradient(ellipse at 52% 78%,rgba(167,211,226,.10),transparent 46%),
    radial-gradient(ellipse at 70% 64%,rgba(211,193,157,.045),transparent 34%)!important;
  filter:blur(72px)!important;
  opacity:.95!important;
  animation:toaExactDoorDrift 24s ease-in-out infinite alternate!important;
  will-change:transform;
}

#toa-customize-page > *,
#toa-plans-page > *{
  position:relative!important;
  z-index:1!important;
}

@keyframes toaExactDoorDrift{
  from{transform:translate3d(-1%,1%,0) scale(1.03)}
  to{transform:translate3d(3%,-2%,0) scale(1.08)}
}

@media(max-width:780px){
  body.page-id-261,
  body.page-id-262,
  #toa-customize-page,
  #toa-plans-page,
  .toa-door2-shell,
  .toa-plans-shell{
    background:linear-gradient(160deg,#020409 0%,#06101a 42%,#0a1422 72%,#05080f 100%)!important;
  }
  #toa-customize-page::before,
  #toa-plans-page::before{
    inset:-20vh -22vw!important;
    filter:blur(72px)!important;
    opacity:.95!important;
  }
}

@media(prefers-reduced-motion:reduce){
  #toa-customize-page::before,
  #toa-plans-page::before{
    animation:none!important;
  }
}
