*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body { font-family: var(--font); background: var(--bg); color: var(--ink); -webkit-font-smoothing: antialiased; font-size: 14px; line-height: 1.6; }
a { text-decoration: none; color: inherit; }
button, input, select, textarea { font-family: var(--font); }
button { cursor: pointer; border: none; background: none; }
img { display: block; max-width: 100%; }

.w { max-width: var(--w); margin: 0 auto; padding: 0 var(--px); }

.eyebrow { font-size: 10px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--blue-hi); margin-bottom: 10px; }

.row-hdr { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 32px; gap: 16px; flex-wrap: wrap; }

.see-all { font-size: 12px; font-weight: 700; color: var(--blue); padding: 7px 16px; border: 1.5px solid var(--blue-soft); border-radius: var(--pill); transition: all .15s; white-space: nowrap; }
.see-all:hover { background: var(--blue-pale); border-color: var(--blue-hi); }

/* Scroll reveal animation */
.joopzy-reveal { opacity: 0; transform: translateY(18px); transition: opacity .5s ease, transform .5s ease; }
.joopzy-reveal.in { opacity: 1; transform: translateY(0); }

/* Skip link (accessibility) */
.skip-link.screen-reader-text { position: absolute; left: -9999px; }
.skip-link.screen-reader-text:focus { position: fixed; top: 5px; left: 5px; z-index: 100000; padding: 10px 15px; background: var(--white); color: var(--ink); font-size: 14px; font-weight: 700; border-radius: var(--r); }