@import url('../grip-tape.css');

.walls-page-hero { padding: 82px 0 62px; background: var(--pink); border-bottom: 3px solid var(--ink); }
.walls-page-hero h1 { font-size: clamp(3rem, 8vw, 6.2rem); max-width: 1000px; }
.walls-page-hero p { max-width: 760px; margin-top: 20px; font-weight: 700; }
.walls-index { padding: 72px 0 100px; }
.walls-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.wall-card {
  display: flex;
  flex-direction: column;
  border: 3px solid var(--ink);
  background: var(--card);
  box-shadow: var(--shadow);
  text-decoration: none;
  transition: transform .14s ease, box-shadow .14s ease;
  min-width: 0;
}
.wall-card:hover { transform: translate(-3px,-3px); box-shadow: 9px 9px 0 var(--ink); }
.wall-card-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-bottom: 3px solid var(--ink); background: var(--accent); }
.wall-card-media img { width: 100%; height: 100%; object-fit: cover; }
.wall-card-placeholder { width: 100%; height: 100%; display: grid; place-items: center; padding: 30px; text-align: center; background: repeating-linear-gradient(-45deg,var(--pink),var(--pink) 18px,var(--card) 18px,var(--card) 36px); }
.wall-card-placeholder span { background: var(--card); border: 3px solid var(--ink); padding: 8px 12px; font-family: 'Archivo Black','Arial Black',sans-serif; text-transform: uppercase; }
.wall-status { position: absolute; top: 12px; left: 12px; border: 2px solid var(--ink); border-radius: 999px; padding: 5px 9px; background: var(--lime); font-size: .67rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.wall-status.painting { background: var(--orange); }
.wall-status.finished { background: var(--pink); }
.wall-card-copy { padding: 20px; }
.wall-card-copy h2 { font-size: clamp(1.35rem, 3vw, 2rem); margin-bottom: 10px; }
.wall-address { font-weight: 800; }
.wall-artist { margin-top: 15px; color: var(--pink); font-weight: 900; }
.wall-specs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.wall-specs span { border: 2px solid var(--ink); border-radius: 999px; padding: 4px 8px; font-size: .68rem; font-weight: 900; text-transform: uppercase; background: var(--accent); }
.wall-feed-state { border: 3px solid var(--ink); background: var(--card); box-shadow: var(--shadow); padding: clamp(28px,5vw,54px); }
.wall-feed-state h2 { font-size: clamp(2rem,5vw,3.8rem); margin-bottom: 16px; }
.wall-feed-state p { max-width: 720px; }
.wall-detail-hero { padding: 62px 0; background: var(--cream); }
.wall-detail-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(300px,.75fr); gap: clamp(30px,6vw,70px); align-items: start; }
.wall-detail-image { aspect-ratio: 16 / 9; border: 3px solid var(--ink); background: var(--accent); box-shadow: 8px 8px 0 var(--ink); overflow: hidden; }
.wall-detail-image img { width:100%;height:100%;object-fit:cover; }
.wall-detail-image .wall-card-placeholder { min-height: 100%; }
.wall-detail-copy { border: 3px solid var(--ink); background: var(--card); box-shadow: var(--shadow); padding: clamp(24px,4vw,38px); min-width: 0; }
.wall-detail-copy h1 {
  font-size: clamp(2.15rem, 4.25vw, 3.8rem);
  line-height: .96;
  max-width: 100%;
  margin-bottom: 16px;
  overflow-wrap: anywhere;
}
.wall-detail-copy .wall-status { position: static; display: inline-flex; margin-bottom: 18px; }
.wall-detail-meta { margin-top: 28px; display: grid; gap: 13px; }
.wall-detail-meta-row { border-top: 2px solid var(--ink); padding-top: 10px; }
.wall-detail-meta-label { display:block;font-size:.67rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase; }
.wall-detail-meta-value { display:block;margin-top:4px;font-weight:800; }
.wall-detail-meta-value a { color:var(--pink);font-weight:900; }
.wall-detail-story { background: var(--lime); border-block: 3px solid var(--ink); padding: 68px 0; }
.wall-detail-story .party-card { max-width: 920px; }

@media (max-width: 800px) {
  .wall-detail-grid { grid-template-columns:1fr; }
  .wall-detail-copy h1 { font-size: clamp(2.2rem, 9vw, 4rem); }
}