/* Standalone farm-photo library surface. The public site owns the palette and
 * type; this file only supplies the album layout and its responsive rhythm. */
.photo-library-hero { position: relative; z-index: 1; padding: clamp(4.5rem, 10vw, 8rem) 0 clamp(3.5rem, 8vw, 6rem); background: color-mix(in srgb, var(--sage) 54%, transparent); border-bottom: 1px solid var(--line); }
.photo-library-hero h1 { max-width: 11ch; margin-bottom: .35em; }
.photo-library-intro { max-width: 38rem; font-size: clamp(1.1rem, 2vw, 1.35rem); color: var(--ink-2); margin: 0; }
.photo-library-band { position: relative; z-index: 1; padding: clamp(3.25rem, 7vw, 6rem) 0 6rem; }
.photo-library-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.5rem; }
.photo-library-heading h2 { margin-bottom: 0; }
.photo-library-count { margin: 0 0 .25rem; color: var(--ink-2); font-size: .9rem; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.photo-library-filters { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: 2rem; }
.photo-filter { border: 1px solid var(--line); border-radius: 999px; padding: .5rem .85rem; background: color-mix(in srgb, var(--paper) 84%, transparent); color: var(--field); font: inherit; font-size: .9rem; cursor: pointer; transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease; }
.photo-filter:hover { border-color: var(--gold-d); transform: translateY(-1px); }
.photo-filter.is-active { background: var(--field); border-color: var(--field); color: var(--paper); }
.photo-library-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2.2vw, 1.8rem); align-items: start; }
.photo-card { min-width: 0; margin: 0; }
.photo-card-link { position: relative; display: block; overflow: hidden; border-radius: var(--r); background: var(--sage); box-shadow: var(--shadow); text-decoration: none; }
.photo-card img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: contain; background: var(--sage); transition: transform .35s ease; }
.photo-card.is-portrait img { aspect-ratio: 4 / 5; }
.photo-card.is-square img { aspect-ratio: 1; }
.photo-card-link:hover img, .photo-card-link:focus-visible img { transform: scale(1.035); }
.photo-card-open { position: absolute; right: .7rem; bottom: .7rem; border-radius: 999px; padding: .35rem .55rem; background: rgba(28,24,22,.78); color: #fff; font-size: .72rem; line-height: 1; opacity: 0; transform: translateY(.3rem); transition: opacity .18s ease, transform .18s ease; }
.photo-card-link:hover .photo-card-open, .photo-card-link:focus-visible .photo-card-open { opacity: 1; transform: translateY(0); }
.photo-card figcaption { display: grid; gap: .25rem; padding: .7rem .2rem 0; color: var(--ink-2); font-size: .92rem; line-height: 1.42; }
.photo-card-category { color: var(--barn); font-size: .7rem; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }
.photo-library-status { grid-column: 1 / -1; padding: 2rem; border: 1px dashed var(--line); border-radius: var(--r); color: var(--ink-2); text-align: center; }
.photo-library-warning { margin: 2rem 0 0; padding: 1rem 1.2rem; border-left: 4px solid var(--gold-d); background: color-mix(in srgb, var(--gold) 16%, transparent); color: var(--ink-2); }
@media (max-width: 920px) { .photo-library-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 680px) { .photo-library-heading { display: block; } .photo-library-count { margin-top: .7rem; } .photo-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } .photo-card-open { display: none; } }
@media (max-width: 430px) { .photo-library-hero { padding-top: 3.5rem; } .photo-library-grid { grid-template-columns: 1fr; } .photo-card img, .photo-card.is-portrait img, .photo-card.is-square img { aspect-ratio: 4 / 3; } }
@media (prefers-reduced-motion: reduce) { .photo-filter, .photo-card img, .photo-card-open { transition: none; } }