/* GainWix AI Studio — shared site styles */
*{box-sizing:border-box}
body{margin:0}
html{scroll-behavior:smooth}
/* Clip sideways overflow from decorative gradients/shadows without creating a
   scroll container — overflow-x:hidden on the page wrapper would break the
   sticky header. */
html,body{overflow-x:clip}
::selection{background:rgba(110,86,207,.18)}
a{color:#6E56CF;text-decoration:none}
a:hover{color:#5a43b8}

/* Teal-accented pages (Workmates, Security) */
.theme-teal ::selection{background:rgba(43,196,176,.18)}
.theme-teal a{color:#159C8C}
.theme-teal a:hover{color:#0f7d70}

/* Mobile nav: the header row never fit small screens (fixed 66px height,
   no wrapping — the Download button was clipped off-screen). Below 760px the
   nav wraps to two rows: logo + Download button, then the page links.
   !important is required to win over the inline styles. */
@media (max-width:760px){
  header nav{flex-wrap:wrap!important;height:auto!important;padding:12px 20px!important;gap:10px 22px!important}
  header nav>div{order:3;width:100%;flex-wrap:wrap!important;gap:12px 20px!important;margin-left:0!important}
  header nav>a:last-child{margin-left:auto!important}
}

/* Hover states (replace the template runtime's style-hover attributes).
   !important is required so they win over the inline base styles. */
[class^="hv-"],[class*=" hv-"]{transition:background-color .16s ease,color .16s ease,border-color .16s ease,transform .16s ease,gap .16s ease}
.hv-white:hover{color:#fff!important}
.hv-purple:hover{background:#5c46b8!important}
.hv-purple-lift:hover{background:#5c46b8!important;transform:translateY(-1px)}
.hv-outline:hover{border-color:#6E56CF!important;color:#6E56CF!important}
.hv-gap:hover{gap:11px!important}
.hv-border:hover{border-color:#DDD6F3!important}
.hv-dark:hover{background:#26303a!important}
.hv-teal-lift:hover{background:#128476!important;transform:translateY(-1px)}
