/* Photograph collections: original albums, farm guide and facilities. */
.photo-collection { padding-block: 84px; }
.photo-collection[id] { scroll-margin-top: 110px; }
.photo-collection + .photo-collection { padding-top: 0; }
.inner-page[data-page="about"] .split-hero-photo img { height: auto; aspect-ratio: 4/5; }
.photo-collection .section-heading { align-items: end; }
.photo-collection .section-heading > p { max-width: 370px; }
.photo-count { display: block; margin-top: 15px; color: var(--muted); font: 400 .9375rem/1.6 var(--sans); letter-spacing: 0; }
.photo-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: start; gap: 32px 25px; }
.photo-grid--two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.photo-tile { margin: 0; min-width: 0; }
.photo-grid .gallery-item { grid-column: auto; grid-row: auto; width: 100%; aspect-ratio: 4/3; height: auto; border-radius: 4px; }
.photo-grid--produce .gallery-item { aspect-ratio: 4/5; }
.photo-grid--botanical .gallery-item { aspect-ratio: 1; }
.photo-grid .gallery-item img { width: 100%; height: 100%; object-fit: cover; }
.photo-grid .gallery-item:after { display: none; }
.photo-grid .gallery-item:before { content: '+'; position: absolute; bottom: 14px; right: 14px; z-index: 1; width: 35px; height: 35px; display: grid; place-items: center; border: 1px solid #ffffff80; border-radius: 50%; background: #143b2ec9; color: #fff; font: 400 1.4rem/1 var(--sans); transition: background .2s; }
.photo-grid .gallery-item:hover:before { background: var(--forest); }
.photo-grid .photo-tile figcaption { padding-top: 13px; color: var(--forest); font-size: .9375rem; line-height: 1.6; }
.photo-grid .photo-tile figcaption small { display: block; margin-top: 3px; color: var(--muted); font-size: .875rem; }
.photo-grid--documents .gallery-item { display: flex; align-items: center; justify-content: center; aspect-ratio: 4/3; padding: 20px; background: var(--paper); border: 1px solid var(--line); }
.photo-grid--documents .gallery-item img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.photo-grid--documents .gallery-item:hover img { transform: none; }
.album-links { display: flex; flex-wrap: wrap; gap: 12px; padding-block: 31px; border-bottom: 1px solid var(--line); }
.album-links a { display: inline-flex; gap: 12px; align-items: center; min-height: 47px; padding: 10px 19px; border: 1px solid var(--line); border-radius: 3px; color: var(--forest); font-size: .9375rem; line-height: 1.5; transition: background .2s; }
.album-links a:hover { background: var(--paper); }
.album-links span { color: var(--muted); font-size: .875rem; }
.photo-ribbon { position: relative; overflow: hidden; margin-block: 55px 0; }
.photo-ribbon img { width: 100%; height: 350px; object-fit: cover; border-radius: 4px; }
.photo-ribbon figcaption { padding-top: 14px; }
.photo-feature { display: grid; grid-template-columns: 1.2fr 1fr; gap: 70px; align-items: center; }
.photo-feature figure { min-width: 0; }
.photo-feature img { width: 100%; height: 440px; object-fit: cover; border-radius: 4px; }
.photo-feature .prose > .text-link { margin-top: 24px; }
.photo-feature h2 { margin-bottom: 28px; }
.photo-feature--portrait { grid-template-columns: .85fr 1fr; gap: 100px; }
.photo-feature--portrait img { height: 600px; object-position: center; border-radius: 220px 220px 4px 4px; }
.photo-feature--illustration img { object-fit: contain; background: var(--paper); padding: 24px; }
.plant-intro { margin-top: 28px; max-width: 730px; color: var(--muted); }
.plant-intro p + p { margin-top: 17px; }
.plant-section .section-heading { border-bottom: 1px solid var(--line); padding-bottom: 26px; }
.guide-link { margin-top: 35px; }
.lightbox-controls { display: flex; align-items: center; justify-content: center; gap: 22px; padding: 0 26px 20px; }
.lightbox-controls button { width: 45px; height: 45px; border: 1px solid #ffffff65; border-radius: 50%; background: transparent; color: white; font-size: 1.4rem; line-height: 1; }
.lightbox-controls button:hover { background: #ffffff18; }
.lightbox-controls button:disabled { opacity: .3; cursor: default; }
.lightbox-counter { min-width: 80px; text-align: center; font-size: .875rem; color: #d2dfcd; }
.lightbox-controls[hidden] { display: none; }
.lightbox img { max-height: 71svh; }
.plant-notes[hidden] { display: none; }
.lightbox.plant-lightbox { max-width: min(94vw,1120px); max-height: 92svh; overflow: hidden; background: var(--paper); color: var(--forest); }
.plant-lightbox .lightbox-content { display: grid; grid-template-columns: .95fr 1.05fr; align-items: start; max-height: calc(92svh - 79px); overflow-y: auto; overscroll-behavior: contain; }
.plant-lightbox figure { min-width: 0; align-self: stretch; padding: 28px; background: var(--forest); }
.plant-lightbox figure img { position: sticky; top: 28px; width: 100%; max-height: calc(92svh - 135px); object-fit: contain; }
.plant-lightbox figure figcaption { display: none; }
.plant-notes { min-width: 0; padding: 43px 34px 35px; color: var(--ink); }
.plant-notes .eyebrow { margin-bottom: 18px; color: var(--muted); font-size: .875rem; }
.plant-notes h2 { padding-right: 28px; color: var(--forest); font-size: clamp(2.2rem,4vw,3rem); line-height: 1.1; overflow-wrap: anywhere; }
.plant-other-names,.plant-chinese-names { margin-top: 17px; color: var(--muted); font-size: 1rem; line-height: 1.7; }
.plant-other-names p + p,.plant-chinese-names p + p { margin-top: 4px; }
.plant-chinese-names { color: var(--forest); }
.plant-note-section { border-top: 1px solid var(--line); padding-top: 18px; margin-top: 23px; }
.plant-note-section h3 { font: 600 .9375rem/1.6 var(--sans); color: var(--forest); margin-bottom: 9px; }
.plant-note-section p { font-size: 1rem; line-height: 1.8; color: var(--muted); overflow-wrap: anywhere; }
.plant-note-section p + p { margin-top: 10px; }
.plant-note-section strong { color: var(--ink); font-weight: 600; }
.plant-lightbox .lightbox-controls { padding: 16px 24px; border-top: 1px solid var(--line); background: var(--paper); }
.plant-lightbox .lightbox-controls button { color: var(--forest); border-color: #143b2e60; }
.plant-lightbox .lightbox-controls button:hover { background: #143b2e10; }
.plant-lightbox .lightbox-counter { color: var(--muted); }
.plant-lightbox .lightbox-close { background: var(--forest); border-color: #ffffff70; }
[data-page="farm-notes"] .photo-grid--botanical .gallery-item:before { content: 'i'; font: italic 600 1.45rem/1 var(--serif); }
.photo-grid--botanical .photo-tile figcaption small { display: block; margin-top: .35rem; color: var(--muted); font-size: .875rem; font-weight: 400; line-height: 1.6; }
.plant-note-section a { color: var(--forest); text-decoration: underline; text-underline-offset: .2em; }
.plant-note-section a:hover { color: var(--ink); }
.plant-note-section--credits p { font-size: .875rem; }
@media (max-width:1000px) {
  .photo-grid { gap: 28px 20px; }
  .photo-feature,.photo-feature--portrait { gap: 45px; }
  .photo-feature--portrait img { height: 490px; }
}
@media (max-width:760px) {
  .plant-lightbox .lightbox-content { display: block; }
  .plant-lightbox figure { padding: 28px 24px 24px; }
  .plant-lightbox figure img { position: static; width: auto; max-height: 35svh; }
  .plant-notes { padding: 29px 26px 30px; }
  .plant-notes h2 { padding-right: 0; }
  .photo-collection { padding-block: 62px; }
  .photo-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 25px 16px; }
  .photo-feature,.photo-feature--portrait { grid-template-columns: 1fr; gap: 35px; }
  .photo-feature img { height: 350px; }
  .photo-feature--portrait img { height: auto; max-height: 560px; object-fit: contain; background: var(--paper); border-radius: 4px; }
  .photo-ribbon img { height: 260px; }
  .album-links { gap: 10px; padding-block: 25px; }
  .album-links a { font-size: .875rem; padding: 9px 13px; }
  .photo-grid--botanical { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:520px) {
  .photo-grid,.photo-grid--two { grid-template-columns: 1fr; gap: 27px; }
  .photo-grid--produce { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 13px; }
  .photo-grid--botanical { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 25px 13px; }
  .photo-grid .photo-tile figcaption { font-size: .875rem; }
  .photo-grid .gallery-item:before { width: 32px; height: 32px; right: 10px; bottom: 10px; }
  .photo-ribbon img { height: 210px; }
  .photo-feature img { height: 280px; }
  .photo-feature--portrait img { height: auto; }
  .photo-feature--illustration img { height: 330px; }
}
