/* Reusable content components */
.sec { padding: clamp(64px, 8vw, 96px) 0; }
.fine { margin-top: 24px; font-size: 12px; line-height: 1.5; color: var(--ink-muted); }

.pill { display: inline-flex; align-items: center; min-height: 46px; padding: 0 26px; border: 1.5px solid var(--navy); border-radius: 999px; font-weight: 700; font-size: 15px; color: var(--navy); transition: background-color .2s, color .2s, transform .2s var(--ease); }
.pill:hover { background: var(--navy); color: var(--white); transform: translateY(-2px); }

.zoom { overflow: hidden; border-radius: var(--radius); }
.zoom img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.zoom:hover img { transform: scale(1.05); }

.checks { display: grid; gap: 12px; margin: 24px 0 32px; }
.checks li { display: flex; align-items: center; gap: 12px; font-size: 17px; color: var(--ink); }
.checks .i { color: var(--cyan-ink); }

.video { position: relative; display: block; overflow: hidden; border-radius: var(--radius); background: var(--navy); }
.video img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease), opacity .3s; }
.play { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 88px; height: 88px; margin: -44px 0 0 -44px; border-radius: 50%; background: var(--gold); color: var(--navy); box-shadow: 0 0 0 0 rgba(242, 177, 0, .5); transition: transform .3s var(--ease), box-shadow .4s var(--ease); }
.play .i { width: 30px; height: 30px; margin-left: 4px; }
.video:hover img { transform: scale(1.04); }
.video:hover .play { transform: scale(1.1); box-shadow: 0 0 0 14px rgba(242, 177, 0, .28); }

.post { display: block; aspect-ratio: 1; overflow: hidden; border-radius: var(--radius); }
.post img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease), filter .3s; }
.post:hover img { transform: scale(1.06); filter: brightness(1.05); }

.card-lift { transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s; }
.card-lift:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); }

.chev { width: 18px; height: 18px; transition: transform .25s var(--ease), color .2s; }
