/* Editorial homepage trial. Existing assets and project pages stay unchanged. */

.editorial-home .hero,
.editorial-home .reel-section,
.editorial-home .immersive-heading,
.editorial-home .project-strip {
  width: min(84vw, 1180px);
  margin-inline: auto;
}

.editorial-home .hero {
  grid-template-columns: minmax(0, 2fr) minmax(16rem, .72fr);
  gap: clamp(2rem, 5vw, 5rem);
}
.editorial-home .hero-copy { grid-column: 1; grid-row: 1; align-self: center; justify-self: start; }
.editorial-home .hero-placeholder { grid-column: 1; grid-row: 1; align-self: center; justify-self: end; }
.editorial-home .hero-note { grid-column: 2; grid-row: 1; align-self: center; }
.editorial-home .hero-copy > .eyebrow { display: none; }
.editorial-home .hero h1 { max-width: 16ch; font-size: clamp(2.15rem, 3vw, 3.25rem); line-height: 1.03; }
.editorial-home .hero-subline { margin-top: 1.2rem; font-family: var(--sans); font-size: .98rem; line-height: 1.65; letter-spacing: 0; color: var(--muted); max-width: 36ch; }
.editorial-home .hero-actions { flex-wrap: wrap; gap: 1rem; }
.hero-note { display: flex; flex-direction: column; gap: 2rem; color: var(--muted); }
.hero-disciplines { margin: 0; font-size: .7rem; line-height: 1.9; letter-spacing: .09em; text-transform: uppercase; }
.hero-disciplines span { display: block; }
.hero-note a { border-top: 1px solid var(--line); padding-top: 2rem; text-decoration: none; font-size: .7rem; letter-spacing: .09em; text-transform: uppercase; }
.hero-note a > span { display: block; }
.hero-note a > span:last-child { margin-top: .5rem; font-size: 1rem; }
.editorial-home:lang(ja) .hero h1 { line-height: 1.3; }

.editorial-home .work-section { width: 100%; border: 0; padding: 0 0 4rem; }
.editorial-home .section-heading { width: var(--shell); margin: 0 auto 2rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.editorial-home .work-description { white-space: normal; font-size: .98rem; line-height: 1.65; }
.editorial-home .project-grid { display: flex; flex-direction: column; gap: 0; }
.editorial-home .project-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2.1fr) minmax(6rem, .42fr);
  grid-template-rows: auto;
  grid-template-areas: "meta image keywords";
  gap: clamp(1.5rem, 3vw, 3rem);
  height: auto;
  min-height: 0;
  padding: 2.2rem calc((100% - var(--shell)) / 2);
  border-radius: 0;
  align-items: center;
}
.editorial-home .project-card--polarity { --project-number: #9fb6c3; --project-label: #5e7b8a; background: linear-gradient(110deg, #dce5e9, #cad8de); }
.editorial-home .project-card--playful { --project-number: #debdb4; --project-label: #bb887e; background: linear-gradient(110deg, #f4e1dc, #f0d8d1); }
.editorial-home .project-card--never { --project-number: #b8cdbf; --project-label: #84998b; background: linear-gradient(110deg, #dfe7df, #cfded6); }
.editorial-home .project-card--bell { --project-number: #d6c19f; --project-label: #ae9167; background: linear-gradient(110deg, #f2e6d5, #eaddc8); }
.editorial-home .project-card--interactive { --project-number: #c1b6ce; --project-label: #9384a1; background: linear-gradient(110deg, #e6e0eb, #dad5e2); }
.editorial-home .project-card .project-meta { position: relative; isolation: isolate; display: grid; grid-template-columns: 2.1rem minmax(0, 1fr); grid-template-rows: repeat(4, auto); column-gap: .75rem; align-content: center; background: transparent; padding: 1rem 0; min-width: 0; }
.editorial-home .project-theme { display: contents; color: var(--project-number); text-transform: uppercase; pointer-events: none; }
.editorial-home .project-theme-label { grid-column: 2; grid-row: 1; align-self: start; color: var(--project-label); font-size: clamp(.92rem, 1.15vw, 1.15rem); font-weight: 600; line-height: 1.2; letter-spacing: .09em; }
.editorial-home .project-meta h3, .editorial-home .project-description, .editorial-home .project-view { position: relative; z-index: 1; }
.editorial-home .project-index { grid-column: 1; grid-row: 1 / 3; align-self: center; justify-self: end; color: var(--project-number); font: 300 clamp(3.9rem, 4.8vw, 4.9rem)/.8 var(--serif); letter-spacing: -.05em; }
.editorial-home .project-meta h3 { grid-column: 2; grid-row: 2; font-size: clamp(1.55rem, 2vw, 2.15rem); line-height: 1; margin: .85rem 0 .75rem; }
.editorial-home .project-meta p { font-size: .92rem; line-height: 1.6; max-width: 31ch; }
.editorial-home .project-meta .project-description { grid-column: 2; grid-row: 3; margin-left: 0; font-size: .95rem; line-height: 1.65; }
.editorial-home .project-meta .project-view { grid-column: 2; grid-row: 4; margin: 1rem 0 0; font-size: .7rem; letter-spacing: .07em; text-decoration: underline; text-underline-offset: .25rem; }
.editorial-home .project-card .project-image { width: 100%; height: auto; aspect-ratio: 2.2; padding: 0; background: #000; }
.editorial-home .project-card .project-image img { height: 100%; width: 100%; max-width: none; object-fit: cover; object-position: center; transform: none; }
.editorial-home .project-card:hover .project-image img { transform: scale(1.035); }
.editorial-home .project-card--polarity .project-image { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .25rem; padding-inline: .7rem; }
.editorial-home .project-card--polarity .project-image img { display: block; object-fit: contain; object-position: center bottom; bottom: -5%; transform: scale(1.05); }
.editorial-home .project-card--polarity:hover .project-image img { transform: scale(1.08); }
.editorial-home .project-card--bell .project-image { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); gap: .25rem; padding: 0; }
.bell-frame { min-width: 0; min-height: 0; height: 100%; overflow: hidden; }
.editorial-home .project-card--bell .project-image img { min-width: 0; min-height: 0; object-fit: cover; transform: translateY(-3%) scale(1.1); }
.editorial-home .project-card--bell:hover .project-image img { transform: translateY(-3%) scale(1.14); }
.editorial-home .project-card--interactive .project-image { background: transparent; }
.editorial-home .project-card--interactive .project-image img { object-fit: cover; transform: scale(1.08); }
.editorial-home .project-card--interactive:hover .project-image img,
.editorial-home .project-card--interactive:focus-visible .project-image img { transform: scale(1.12); }
.editorial-home .project-arrow { display: none; }
.project-keywords { grid-area: keywords; border-left: 1px solid rgba(37,35,32,.18); padding: 1.5rem 0 1.5rem 1rem; color: var(--muted); }
.project-keywords span { display: block; font-size: .65rem; line-height: 1.85; letter-spacing: .1em; text-transform: uppercase; overflow-wrap: anywhere; }
.editorial-home .project-card:focus-visible { outline: 2px solid var(--ink); outline-offset: -4px; }
.editorial-home .immersive-heading, .editorial-home .project-strip { margin-inline: auto; }
.editorial-home .immersive-heading { margin-top: 3rem; }
.editorial-home .about-inner { padding-block: 3rem; }
.editorial-home .about-title h2 { font-size: clamp(1.9rem, 2.7vw, 2.8rem); }
.editorial-home .contact-main { padding-block: 3rem; }
.editorial-home:lang(ja) .project-meta h3 { line-height: 1.3; }

@media (max-width: 1000px) {
  .editorial-home .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
  .editorial-home .hero h1 { max-width: none; }
  .editorial-home .hero h1 > br { display: none; }
  .editorial-home .hero-subline { max-width: none; }
  .editorial-home .hero-copy { grid-column: 1; grid-row: 1; }
  .editorial-home .hero-placeholder { grid-column: 2; grid-row: 1; }
  .editorial-home .hero-note { grid-column: 1 / -1; grid-row: 2; flex-direction: row; justify-content: space-between; align-items: center; }
  .hero-disciplines { display: flex; flex-wrap: wrap; gap: .25rem 1rem; padding-left: 0; border-left: 0; }
  .hero-disciplines span { display: inline-flex; align-items: center; }
  .hero-disciplines span:not(:first-child)::before { content: "•"; margin-right: 1rem; font-size: .65em; opacity: .65; }
  .hero-note a { border-top: 0; border-left: 1px solid var(--line); padding: 0 0 0 1rem; flex-shrink: 0; }
  .editorial-home .project-card { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
  .editorial-home .project-card { grid-template-areas: "meta image"; }
  .project-keywords { display: none; }
  .editorial-home .project-card .project-image { aspect-ratio: 1.8; }
}
@media (max-width: 800px) {
  .editorial-home .hero,
  .editorial-home .reel-section,
  .editorial-home .immersive-heading,
  .editorial-home .project-strip { width: var(--shell); }
  /* Match the line-to-title gap used by the Reel 2026 section. */
  .editorial-home .section-heading { padding-top: 3rem; }
}
@media (max-width: 600px) {
  .editorial-home .hero { grid-template-columns: 1fr; }
  .editorial-home .hero-copy { grid-column: 1; grid-row: 1; }
  .editorial-home .hero-placeholder { grid-column: 1; grid-row: 2; }
  .editorial-home .hero-note { grid-column: 1; grid-row: 3; }
  .editorial-home .hero h1 { font-size: 2.6rem; }
  .editorial-home .hero-actions { flex-direction: row; flex-wrap: nowrap; align-items: center; gap: .75rem; }
  .editorial-home .hero-placeholder { width: min(100%, 19rem); justify-self: center; }
  .hero-note { gap: 1rem; }
  .hero-disciplines { font-size: .66rem; }
  .editorial-home .project-card { grid-template-columns: 1fr; grid-template-areas: "meta" "image"; gap: 1rem; padding-block: 2rem; }
  .editorial-home .project-meta h3 { font-size: 2rem; }
  .editorial-home .project-meta p { max-width: 40ch; }
  .editorial-home .project-card .project-image { aspect-ratio: 16 / 9; }
  .editorial-home .project-card--polarity .project-image { grid-template-columns: repeat(3, minmax(0, 1fr)); height: 16rem; aspect-ratio: auto; }
  .editorial-home .project-card--polarity .project-image img:nth-of-type(2),
  .editorial-home .project-card--polarity .project-image img:nth-of-type(4) { display: none; }
  .editorial-home .project-card--interactive .project-image { height: 17rem; aspect-ratio: auto; }
}