/* tt-cta.css — one button design for every page, matched to the home hero
   ("Get the app to start a consult →" / "Explore the studios →").
   Loaded last on each page so it wins over older page-level button styles. */
:is(.btn-fill,.btn-primary,.st-cta,.pro-cta:not(.ghost),.cm-btn.fill,.cm-btn:not(.ghost):not(.fill),.dx-btn.fill,.cs-btn.fill,.pt-btn.fill,.ap-btn.fill,.vl-btn,.xp-cta,.btb-stripe-btn,.ia-cta:not(.ghost),.tt-cta),
:is(.btn-ghost,.pro-cta.ghost,.cm-btn.ghost,.dx-btn.ghost,.cs-btn.ghost,.pt-btn.ghost,.ap-btn.ghost,.ia-cta.ghost){
  display:inline-flex!important;align-items:center!important;justify-content:center;gap:9px!important;
  font-family:var(--font-body)!important;font-size:11px!important;font-weight:400!important;
  letter-spacing:.2em!important;text-transform:none!important;line-height:1.2!important;
  padding:15px 26px!important;min-height:44px;border-radius:999px!important;
  text-decoration:none!important;cursor:pointer;white-space:nowrap;
  animation:none!important;box-shadow:none;
  transition:transform .2s,box-shadow .25s,background .2s,border-color .2s!important;
}
:is(.btn-fill,.btn-primary,.st-cta,.pro-cta:not(.ghost),.cm-btn.fill,.cm-btn:not(.ghost):not(.fill),.dx-btn.fill,.cs-btn.fill,.pt-btn.fill,.ap-btn.fill,.vl-btn,.xp-cta,.btb-stripe-btn,.ia-cta:not(.ghost),.tt-cta){
  background:#12d6ff!important;color:#04253b!important;-webkit-text-fill-color:#04253b;border:0!important;
}
:is(.btn-fill,.btn-primary,.st-cta,.pro-cta:not(.ghost),.cm-btn.fill,.cm-btn:not(.ghost):not(.fill),.dx-btn.fill,.cs-btn.fill,.pt-btn.fill,.ap-btn.fill,.vl-btn,.xp-cta,.btb-stripe-btn,.ia-cta:not(.ghost),.tt-cta):hover{
  transform:translateY(-2px);box-shadow:0 16px 40px -12px rgba(56,182,255,.7);color:#04253b!important;
}
:is(.btn-ghost,.pro-cta.ghost,.cm-btn.ghost,.dx-btn.ghost,.cs-btn.ghost,.pt-btn.ghost,.ap-btn.ghost,.ia-cta.ghost){
  background:transparent!important;color:#fff!important;-webkit-text-fill-color:#fff;border:1px solid rgba(255,255,255,.2)!important;
}
:is(.btn-ghost,.pro-cta.ghost,.cm-btn.ghost,.dx-btn.ghost,.cs-btn.ghost,.pt-btn.ghost,.ap-btn.ghost,.ia-cta.ghost):hover{
  border-color:#12d6ff!important;color:#fff!important;transform:translateY(-2px);
}
/* Button rows: same spacing everywhere */
:is(.hero-cta,.ia-cta-row,.pro-cta-row,.cm-cta-row,.dx-cta-row,.pt-cta-row,.cs-cta-row,.ap-cta-row){display:flex;flex-wrap:wrap;gap:14px;align-items:center}
/* Phones: big, thumb-friendly buttons (Apple HIG: 44pt minimum; we go bigger) */
@media (max-width:680px){
  :is(.btn-fill,.btn-primary,.st-cta,.pro-cta,.cm-btn,.dx-btn,.cs-btn,.pt-btn,.ap-btn,.vl-btn,.xp-cta,.btb-stripe-btn,.ia-cta,.tt-cta,.btn-ghost,.btn){
    font-size:15px!important;font-weight:500!important;letter-spacing:.04em!important;
    min-height:56px!important;padding:16px 24px!important;white-space:normal!important;text-align:center;
  }
  /* In any button row, each button takes the full width so it's easy to hit */
  :is(.hero-cta,.tm-cta,.ia-cta-row,.pro-cta-row,.cm-cta-row,.dx-cta-row,.pt-cta-row,.cs-cta-row,.ap-cta-row){flex-direction:column!important;align-items:stretch!important;gap:12px!important;width:100%;max-width:420px;margin-left:auto;margin-right:auto}
  :is(.hero-cta,.tm-cta,.ia-cta-row,.pro-cta-row,.cm-cta-row,.dx-cta-row,.pt-cta-row,.cs-cta-row,.ap-cta-row)>*{width:100%!important;flex:1 1 auto!important}
  .tt-cta{width:100%!important}
}