/* THESIS: A living wall of real, permanent BYORDs, not a shop.
   OWN-WORLD: Existing navy, cream and sand; Jackerton headlines, Lunema labels,
   organic artwork windows and open captions inherited from the collection.
   STORY: One continuous gallery, newest Hatches first, with community likes.
   FIRST VIEW: Open split heading, ordering context, three large artworks.
   FORM: Local extension of the established BYORD home; no new visual identity. */
.community-jump { margin-top:20px; }
.community-hatches { position:relative; isolation:isolate; overflow:clip; scroll-margin-top:140px; border-top:1px solid var(--line); }
.community-hatches .community-background { z-index:-1; }
.community-heading { display:grid; grid-template-columns:1.2fr 1fr; align-items:end; gap:32px 8%; }
.community-heading h2 { margin-top:20px; }
.community-intro { max-width:43ch; color:var(--cream); font-size:18px; }
.byord-experience .community-context { margin-top:40px; padding-top:24px; border-top:1px solid var(--line); color:#d0d8f0; font-size:15px; max-width:72ch; }
.community-status { color:var(--cream); font-size:16px; }
.community-status:empty { display:none; }
.community-gallery { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; gap:60px 5%; margin:42px 0 0; padding:0; }
.community-gallery:empty { margin-top:28px; }
.community-piece { min-width:0; position:relative; }
.community-piece:nth-child(3n+2) { padding-top:30px; }
.community-art { display:block; position:relative; aspect-ratio:1; border-radius:45% 55% 49% 51% / 54% 44% 56% 46%; isolation:isolate; }
.community-art::before { content:""; position:absolute; z-index:-1; inset:-5px; border:1px solid var(--blue); border-radius:54% 46% 45% 55% / 44% 55% 45% 56%; transform:rotate(-7deg); transition:transform .5s cubic-bezier(.16,1,.3,1); }
.community-art img { display:block; width:100%; height:100%; object-fit:cover; border-radius:inherit; transition:border-radius .5s cubic-bezier(.16,1,.3,1); }
.community-piece:nth-child(3n+2) .community-art { border-radius:56% 44% 52% 48% / 47% 57% 43% 53%; }
.community-piece:nth-child(3n+3) .community-art { border-radius:46% 54% 57% 43% / 56% 48% 52% 44%; }
.community-art:hover img { border-radius:51% 49% 43% 57% / 45% 51% 49% 55%; }
.community-art:hover::before { transform:rotate(8deg); }
.community-open { position:absolute; right:5%; bottom:3%; display:grid; place-items:center; width:44px; height:44px; border-radius:50%; color:var(--deep); background:var(--gold); font-size:23px; }
.community-image-error { display:grid; place-items:center; height:100%; padding:30px; border:1px solid var(--line); border-radius:inherit; color:var(--cream); text-align:center; font-size:16px; }
.community-caption { display:flex; justify-content:space-between; align-items:center; gap:10px; padding-top:24px; }
.community-caption a { color:var(--cream); font-size:18px; font-weight:700; }
.community-caption a:hover { text-decoration:underline; text-underline-offset:4px; }
.community-date { display:block; margin-top:6px; color:#d0d8f0; font-size:14px; line-height:1.5; }
.community-like { display:flex; flex-shrink:0; align-items:center; justify-content:center; gap:8px; min-width:68px; min-height:48px; padding:10px 14px; border:1px solid var(--blue); border-radius:30px; background:transparent; color:var(--cream); font-size:16px; font-variant-numeric:tabular-nums; }
.community-like svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; }
.community-like[aria-pressed="true"] { background:var(--gold); color:var(--deep); border-color:var(--gold); }
.community-like[aria-pressed="true"] svg { fill:currentColor; }
.community-like:hover { border-color:var(--gold); }
.community-like-error { color:var(--cream); font-size:14px; padding-top:10px; }
.community-like-error:empty { display:none; }
.community-bottom { display:flex; flex-direction:column; align-items:center; gap:22px; margin-top:40px; }
.community-like-note { max-width:65ch; color:#d0d8f0; font-size:14px; text-align:center; }
.community-hatches [hidden] { display:none !important; }
@media (max-width:899px) {
  .community-heading { grid-template-columns:1fr; gap:24px; }
  .community-intro { max-width:60ch; }
  .community-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 6%; }
  .community-piece:nth-child(3n+2) { padding-top:0; }
  .community-piece:nth-child(even) { padding-top:24px; }
}
@media (max-width:480px) {
  .byord-experience .community-context { margin-top:32px; }
  .community-intro { font-size:16px; }
  .community-caption { flex-wrap:wrap; align-items:flex-start; padding-top:18px; }
  .community-caption>div { width:100%; }
  .community-caption a { font-size:16px; }
  .community-like { min-height:44px; padding:8px 12px; }
  .community-date { font-size:14px; }
  .community-open { width:36px; height:36px; right:0; bottom:0; font-size:20px; }
}
@media (prefers-reduced-motion:reduce) { .community-art img,.community-art::before { transition:none; } }
.motion-paused .community-art img,.motion-paused .community-art::before { transition:none; }