/* VascuTech website: shared styles. Most layout styling is inline in each page. */
body{margin:0;font-family:'Source Sans 3',system-ui,sans-serif;color:#1B1D22;background:#ffffff}
img{max-width:100%}
a{color:#9C2B45;text-decoration:none}a:hover{color:#77396C}
.nav a:hover{color:#9C2B45}
.btn:hover{opacity:.9}
.card{transition:transform .2s}.card:hover{transform:translateY(-3px)}

/* Collapsible references and evidence */
details>summary{list-style:none;cursor:pointer}
details>summary::-webkit-details-marker{display:none}
details[open] .chev{transform:rotate(180deg)}
.chev{transition:transform .2s}
summary:hover{border-color:#9C2B45}

/* Scrolling logo band */
.mq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.mq-track{display:flex;align-items:center;width:max-content;animation:mq 40s linear infinite}
.mq:hover .mq-track{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.mq-track{animation:none}}

/* Smaller screens */
html{scroll-behavior:smooth}
@media (max-width:720px){
  h1{font-size:38px!important;letter-spacing:-1px!important}
  h2{font-size:28px!important}
  section>div,footer>div,header>div{padding-left:20px!important;padding-right:20px!important}
  .nav{gap:16px!important;font-size:15px!important}
}
