/* Misfit Toys Art: shared styles for inner pages (homepage keeps its own inline copy for speed). */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --paper: #E9E6E3; --ink: #000000; --red: #C0392B; --block: #CCD5EE; --blush: #EDCBBE; --white: #FFFFFF;
  --rule: 3px solid var(--ink); --gutter: clamp(1rem, 3vw, 2.5rem);
}
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { font-family: 'Inter', system-ui, sans-serif; font-size: 1.0625rem; line-height: 1.6; color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased; }
h1, h2, h3 { font-family: 'Chivo', sans-serif; font-weight: 900; text-transform: uppercase; line-height: 0.98; letter-spacing: -0.01em; }
p { max-width: 68ch; }
p + p { margin-top: 1rem; }
a { color: inherit; text-underline-offset: 3px; }
img { display: block; max-width: 100%; height: auto; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
em { font-style: italic; }
.skip-link { position: absolute; left: 0; top: -60px; background: var(--ink); color: var(--white); padding: 0.75rem 1rem; z-index: 10000; }
.skip-link:focus { top: 0; }

/* Header */
.site-header { position: sticky; top: 0; z-index: 1000; background: var(--white); border-bottom: var(--rule); }
.header-grid { display: grid; grid-template-columns: auto 1fr auto; align-items: stretch; min-height: 76px; }
.logo-cell { display: flex; align-items: center; gap: 0.6rem; padding: 0 1.5rem; border-right: var(--rule); text-decoration: none; }
.logo-cell img { width: 44px; height: 40px; }
.logo-cell span { font-family: 'Chivo', sans-serif; font-weight: 900; font-size: 1.25rem; text-transform: uppercase; letter-spacing: -0.02em; }
.main-nav { display: flex; align-items: stretch; justify-content: space-around; }
.main-nav a { display: flex; align-items: center; padding: 0 0.85rem; white-space: nowrap; font-family: 'Chivo', sans-serif; font-weight: 700; font-size: 0.95rem; text-transform: uppercase; text-decoration: none; }
.main-nav a:hover, .main-nav a[aria-current="page"] { background: var(--ink); color: var(--white); }
.menu-btn { display: none; background: var(--white); border: none; border-left: var(--rule); font-family: 'Chivo', sans-serif; font-weight: 900; font-size: 1rem; text-transform: uppercase; padding: 0 1.25rem; cursor: pointer; color: var(--ink); }

/* Layout */
.page main { padding: clamp(2rem, 5vw, 4rem) 0; }
.page main > * { width: calc(100% - 2 * var(--gutter)); max-width: calc(1400px - 2 * var(--gutter)); margin: 0 auto var(--gutter); padding-left: 0; padding-right: 0; }
.box { background: var(--white); border: var(--rule); padding: clamp(1.5rem, 4vw, 3rem); }
.page h2 { font-size: clamp(2.2rem, 5vw, 4rem); margin-bottom: 1.25rem; }
.page h3 { font-size: clamp(1.4rem, 2.6vw, 2rem); margin-bottom: 0.75rem; }

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0.8rem 1.6rem; font-family: 'Chivo', sans-serif; font-weight: 900; font-size: 1rem; text-transform: uppercase; text-decoration: none; border: var(--rule); cursor: pointer; color: var(--ink); background: var(--white); }
.btn-red, .btn-primary { background: var(--red); color: var(--white); }
.btn-red:hover, .btn-primary:hover { background: var(--ink); }
.btn:not(.btn-red):not(.btn-primary):hover { background: var(--ink); color: var(--white); }
.chip, .location, .version-label, .artist-role, .project-tag, .coming-soon, .feature-source, .coverage-outlet { display: inline-block; background: var(--blush); border: 2px solid var(--ink); padding: 0.25rem 0.65rem; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.9rem; max-width: none; }

/* Page hero */
.hero .hero-content, .hero .hero-inner, .page-hero .page-hero-inner { background: var(--white); border: var(--rule); padding: clamp(1.5rem, 4vw, 3rem); }
.hero h1, .page-hero h1 { font-size: clamp(2.8rem, 8vw, 7rem); margin-bottom: 1.25rem; }
.hero p, .page-hero p { font-size: clamp(1.1rem, 1.8vw, 1.3rem); }


/* Text block */
.content, .about-block, .featured-block, .news-block, .assets-block, .projects .container, .submit .container, .release > div, .give > div { background: var(--white); border: var(--rule); padding: clamp(1.5rem, 4vw, 3rem) !important; max-width: none; }
.content h2 { margin-bottom: 1.25rem; }
.content p:last-child { color: inherit; }

/* Photos */
.image-section .image-container img, .side-image img, .artist-photo img { width: 100%; border: var(--rule); }
.photo-credit, .credit { font-size: 0.9rem; margin-top: 0.5rem; }

/* Artists (Jax) */
.artists-container { background: var(--block); border: var(--rule); padding: clamp(1.5rem, 4vw, 3rem); }
.artists-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gutter); }
.artist-card { background: var(--white); border: var(--rule); padding: 1.5rem; }
.artist-photo { margin: 0; aspect-ratio: 4 / 5; position: relative; border: var(--rule); overflow: hidden; background: var(--ink); }
.artist-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: none; }
.follow { font-weight: 700; }

/* Locations (Jax) */
.locations-header h2 { margin: 1rem 0 0; }
.side-container { display: grid; grid-template-columns: 1fr 1fr; background: var(--white); border: var(--rule); }
.side-container > * { min-width: 0; }
.side-image { border-right: var(--rule); }
.side-image figure { margin: 0; height: 100%; }
.side-image img { height: 100%; object-fit: cover; border: none; }
.side-content { padding: clamp(1.5rem, 4vw, 3rem); }
.side-container > .side-content:first-child { border-right: var(--rule); }
.side-container > .side-content:first-child + .side-image { border-right: none; }

/* Map */
.map-container { background: var(--white); border: var(--rule); padding: clamp(1.5rem, 4vw, 3rem); }
.map-container iframe { width: 100%; height: 420px; border: var(--rule); display: block; }
.map-note { margin-top: 1rem; font-weight: 600; }

/* Partners strip */
.partners-section .partners-container, .partners-section .partners-group, .partners-section > h2, .partners-section > .partners-list { background: var(--ink); color: var(--white); }
.partners-section { background: var(--ink); color: var(--white); border: var(--rule); padding: clamp(1.5rem, 4vw, 3rem) !important; }
.partners-section h2 { color: var(--white); }
.partners-list { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1rem; }
.partners-list a, .partners-list .name, .partners-list > span:not(.partners-divider) { border: 2px solid var(--white); padding: 0.5rem 0.9rem; font-weight: 600; text-decoration: none; }
.partners-list a:hover { background: var(--white); color: var(--ink); }
.partners-divider { display: none; }
.partners-group + .partners-group { margin-top: 2rem; }
.partners-group-label, .partners-label { display: block; font-family: 'Chivo', sans-serif; font-weight: 700; font-size: 1.1rem; }

/* Press release (Jax) */
.release > div > .release-label { font-family: 'Chivo', sans-serif; font-weight: 900; font-size: clamp(2.2rem, 5vw, 4rem); text-transform: uppercase; display: block; margin-bottom: 1.25rem; line-height: 1; }
.release-box { border: var(--rule); }
.release-box > div:first-child { padding: 1.5rem; border-bottom: var(--rule); background: var(--block); }
.release-box > div:first-child h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); }
.release-box > div:last-child { padding: 1.5rem; }
.release-box p + p, .release-box blockquote + p { margin-top: 1rem; }
blockquote { border-left: 6px solid var(--red); margin: 1.75rem 0; padding: 0.25rem 0 0.25rem 1.25rem; }
blockquote p { font-size: 1.15rem; font-weight: 600; }
cite { display: block; margin-top: 0.5rem; font-style: normal; font-size: 0.95rem; }
hr { border: none; border-top: var(--rule); margin: 2rem 0; }
.give > div { text-align: left; }
.give .btn { margin-top: 1.25rem; }

/* Press page */
.section-label { display: none; }
.feature-item { border: var(--rule); padding: 1.25rem 1.5rem; margin-top: 1rem; }
.feature-quote { font-family: 'Chivo', sans-serif; font-weight: 700; font-size: 1.25rem; margin: 0.25rem 0 0.5rem; }
.feature-link { display: inline-block; margin-top: 0.75rem; font-weight: 700; }
.coverage-item { border: var(--rule); padding: 1.25rem 1.5rem; display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: center; }
.coverage-item .coverage-outlet { margin: 0; }
.coverage-title a { font-weight: 700; }
.coverage-date { font-weight: 600; }
.assets-block .btn { margin-top: 1.25rem; }

/* Dreams */
.dreams .content-inner { background: var(--white); border: var(--rule); padding: clamp(1.5rem, 5vw, 4rem); }
.dreams h1 { font-size: clamp(3rem, 10vw, 8rem); text-transform: none; margin-bottom: 1.5rem; }
.equation { color: var(--red); }
.coming-soon { background: var(--red); color: var(--white); margin-top: 1.5rem; }

/* Speshul projects */
.projects-intro { margin-bottom: 1.5rem; }
.project-card { display: grid; grid-template-columns: 1fr 240px; border: var(--rule); }
.project-card > * { min-width: 0; }
.project-body { padding: 1.5rem; border-right: var(--rule); }
.project-meta { display: flex; gap: 1rem; font-weight: 700; margin-bottom: 0.5rem; }
.project-image img { width: 100%; height: 100%; object-fit: cover; }
.project-tag { margin-top: 1rem; }
.submit .btn { margin-top: 1.25rem; }

/* Footer */
footer { background: var(--ink); color: var(--white); }
.footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.footer-col { padding: 2.5rem var(--gutter); }
.footer-col + .footer-col { border-left: 2px solid #5c5c5c; }
.footer-col h3 { font-size: 1.2rem; margin-bottom: 1rem; color: var(--white); }
.footer-col p, .footer-col a { display: block; color: #E6E6E6; margin-bottom: 0.45rem; }
.footer-col a { font-weight: 600; }
.footer-col a:hover { color: var(--white); text-decoration-color: var(--white); }
.footer-base { border-top: 2px solid #5c5c5c; padding: 1.25rem var(--gutter); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem; color: #E6E6E6; font-size: 0.95rem; }
.footer-base a { color: var(--white); }
.phone-only { display: none !important; }

@media (max-width: 1100px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-col:nth-child(3) { border-left: none; }
  .footer-col:nth-child(n+3) { border-top: 2px solid #5c5c5c; }
}
@media (max-width: 1180px) {
  .header-grid { grid-template-columns: 1fr auto; min-height: 64px; }
  .logo-cell { border-right: none; padding: 0 1rem; }
  .menu-btn { display: block; }
  .main-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; background: var(--white); border-bottom: var(--rule); }
  .main-nav.open { display: flex; }
  .main-nav a { padding: 1rem 1.25rem; border-top: 2px solid var(--ink); font-size: 1.05rem; }
}
@media (max-width: 860px) {
  .artists-grid, .side-container, .project-card { grid-template-columns: 1fr; }
  .side-image, .side-container > .side-content:first-child, .project-body { border-right: none; }
  .side-image { border-bottom: var(--rule); order: -1; }
  .side-container > .side-content:first-child { border-bottom: none; }
  .project-body { border-bottom: var(--rule); }
  .coverage-item { grid-template-columns: 1fr; }
  .map-container iframe { height: 320px; }
  .phone-only { display: block !important; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-col + .footer-col { border-left: none; border-top: 2px solid #5c5c5c; }
}

/* Added pieces */
.hero { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gutter); }
.hero > * { min-width: 0; }
.hero-figure { margin: 0; border: var(--rule); background: var(--ink); position: relative; min-height: 360px; overflow: hidden; }
.hero-figure img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-figure .credit { position: absolute; right: 0; bottom: 0; margin: 0; background: var(--white); border-top: var(--rule); border-left: var(--rule); padding: 0.3rem 0.7rem; }
.hero:not(:has(.hero-figure)) { grid-template-columns: 1fr; }
.note { border-left: 6px solid var(--red); padding-left: 1rem; }
.map-facade { display: flex; flex-wrap: wrap; gap: 1rem; padding: 2rem; border: var(--rule); background: var(--block); }
.dreams-wrap { max-width: 1400px; }
.project-list { display: grid; gap: var(--gutter); }
@media (max-width: 860px) {
  .hero { grid-template-columns: 1fr; }
  .hero-figure { order: -1; min-height: 0; aspect-ratio: 4 / 3; }
}
.works { }
.works-list { background: var(--white); border: var(--rule); }
.work-row { display: grid; grid-template-columns: 6rem 18rem 1fr; text-decoration: none; }
.work-row + .work-row { border-top: var(--rule); }
.work-row > span { padding: 1.1rem 1.4rem; }
.work-row .yr { font-family: 'Chivo', sans-serif; font-weight: 900; font-size: 1.3rem; background: var(--block); border-right: var(--rule); }
.work-row .nm { font-family: 'Chivo', sans-serif; font-weight: 700; font-size: 1.1rem; border-right: var(--rule); }
.work-row:hover .nm { color: var(--red); }
@media (max-width: 860px) {
  .work-row { grid-template-columns: 5rem 1fr; }
  .work-row .nm { border-right: none; }
  .work-row .pl { grid-column: 1 / -1; border-top: 2px solid var(--ink); }
}
.content, .about-block, .featured-block, .news-block, .assets-block, .partners-section { max-width: calc(1400px - 2 * var(--gutter)) !important; }
.contact-bar.box { background: var(--block); display: flex; flex-wrap: wrap; gap: 0.5rem 2rem; }
.contact-bar-inner { display: flex; flex-wrap: wrap; gap: 0.5rem 2rem; font-weight: 600; }
.contact-bar-inner p + p { margin-top: 0; }
.page main > .box { padding: 1.25rem 1.5rem; }
.page-label { display: none; }

/* No underlines (Dayna's rule). Links in text are red and bold instead. */
a { text-decoration: none !important; }
main p a, main li a, main cite a, .faq-item a, .form-note a, .follow, .feature-link, .coverage-title a { color: var(--red); font-weight: 700; }
main p a:hover, main li a:hover, .follow:hover, .feature-link:hover, .coverage-title a:hover { color: var(--ink); }
.build-intro a, .build-photo a { color: var(--ink); font-weight: 700; }
.footer-col a:hover { color: var(--red) !important; }

.footer-base a { display: inline-block; border: 2px solid #fff; padding: 0.1rem 0.5rem; font-weight: 700; color: #fff !important; }
.footer-base a:hover { background: #fff; color: #000 !important; }
.photo-credit a, .credit a, .contact-bar a, .build-photo a { color: var(--ink) !important; font-weight: 700; }