/* ============================================================================
   Rooted Stack — Layout & utilities (small, composable helpers)
   ============================================================================ */

/* Containers / sections */
.rs-container { width: 100%; max-width: var(--rs-maxw); margin-inline: auto; padding-inline: var(--rs-gutter); }
.rs-container--prose { max-width: var(--rs-maxw-prose); }
.rs-section { padding-block: clamp(40px, 7vw, 88px); }
.rs-section--tight { padding-block: clamp(24px, 4vw, 48px); }

/* Flex / grid */
.rs-stack { display: flex; flex-direction: column; }
.rs-row { display: flex; flex-wrap: wrap; align-items: center; }
.rs-between { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--rs-space-4); }
.rs-grid { display: grid; gap: var(--rs-space-5); }
.rs-grid--cards { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.rs-grid--2 { grid-template-columns: 1fr; }
.rs-grid--3 { grid-template-columns: 1fr; }
@media (min-width: 720px) { .rs-grid--2 { grid-template-columns: 1fr 1fr; } .rs-grid--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .rs-split { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--rs-space-8); align-items: start; } }

/* Gap scale */
.rs-gap-1 { gap: var(--rs-space-1); } .rs-gap-2 { gap: var(--rs-space-2); } .rs-gap-3 { gap: var(--rs-space-3); }
.rs-gap-4 { gap: var(--rs-space-4); } .rs-gap-5 { gap: var(--rs-space-5); } .rs-gap-6 { gap: var(--rs-space-6); }
.rs-gap-8 { gap: var(--rs-space-8); }

/* Margin helpers (block) */
.rs-mt-2 { margin-top: var(--rs-space-2); } .rs-mt-3 { margin-top: var(--rs-space-3); } .rs-mt-4 { margin-top: var(--rs-space-4); }
.rs-mt-6 { margin-top: var(--rs-space-6); } .rs-mt-8 { margin-top: var(--rs-space-8); }
.rs-mb-2 { margin-bottom: var(--rs-space-2); } .rs-mb-4 { margin-bottom: var(--rs-space-4); } .rs-mb-6 { margin-bottom: var(--rs-space-6); } .rs-mb-8 { margin-bottom: var(--rs-space-8); }

/* Text helpers */
.rs-center { text-align: center; }
.rs-muted { color: var(--rs-text-muted); }
.rs-nowrap { white-space: nowrap; }
.rs-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rs-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Surface fills */
.rs-on-paper { background: var(--rs-chart-paper); }
.rs-on-ink { background: var(--rs-deep-water); color: var(--rs-on-ink); }
.rs-on-sage { background: var(--rs-surface-sage); }

/* Aspect ratios for media */
.rs-ratio-3-2 { aspect-ratio: 3 / 2; }
.rs-ratio-1-1 { aspect-ratio: 1 / 1; }
.rs-ratio-4-5 { aspect-ratio: 4 / 5; }

/* Photo treatment — full warmth, no filter clichés. Optional ink scrim. */
.rs-photo { overflow: hidden; background: linear-gradient(135deg, var(--rs-land-tint), var(--rs-surface-sage)); }
.rs-photo img { width: 100%; height: 100%; object-fit: cover; }
.rs-photo--scrim { position: relative; }
.rs-photo--scrim::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,58,62,0) 40%, rgba(15,58,62,.88) 100%); }

/* Reveal-on-scroll (progressive enhancement; visible by default without JS) */
.rs-reveal { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
    .js .rs-reveal { opacity: 0; transform: translateY(12px); transition: opacity var(--rs-dur-3) var(--rs-ease), transform var(--rs-dur-3) var(--rs-ease); }
    .js .rs-reveal.rs-in { opacity: 1; transform: none; }
}

/* Visually hidden (screen-reader only) */
.rs-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.rs-hide { display: none !important; }
@media (max-width: 640px) { .rs-hide-sm { display: none !important; } }
@media (min-width: 641px) { .rs-only-sm { display: none !important; } }
