/* Approved catalogue opening: A copy, G1 photograph, step 1 of 28. */
#menu-toggle{display:none}
.catalogue-header {
  padding: 1rem max(1.75rem, calc((100vw - 1360px) / 2));
  gap: .5rem 1.75rem;
  flex-wrap: wrap;
}
.catalogue-header .brand { min-width: 168px; flex: 0 0 180px; }
.catalogue-header .brand img { width: 180px; }
.catalogue-header nav {
  flex: 1 1 760px;
  width: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0 clamp(.875rem, 1.35vw, 1.375rem);
}
.catalogue-header nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: .875rem;
  line-height: 1.4;
}
.catalogue-header .nav-cta { gap: .625rem; padding: .5rem 0; }

.hero.hero--split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: stretch;
  min-height: 0;
  background: #f5f8f7;
  color: var(--navy);
}
.hero--split .hero-copy {
  width: auto;
  max-width: none;
  min-width: 0;
  align-self: center;
  padding: clamp(1.5rem, 3vh, 2.5rem) 2.75rem clamp(1.5rem, 3vh, 2.5rem) max(2.5rem, calc((100vw - 1280px) / 2));
}
.hero--split .hero-copy .eyebrow {
  max-width: 34rem;
  color: var(--green);
  font-size: .875rem;
  letter-spacing: .035em;
  line-height: 1.6;
  margin: 0 0 1rem;
}
.hero.hero--split h1 {
  font-size: clamp(2.5rem, 3.45vw, 3.5rem);
  line-height: 1.09;
  letter-spacing: -.04em;
  margin: 0 0 1.25rem;
  font-weight: 600;
}
.hero--split h1 em { font-style: normal; color: var(--green); }
.hero--split .hero-copy > .hero-description {
  color: #3b555f;
  max-width: 36rem;
  font-size: 1.125rem;
  line-height: 1.75;
  margin: 0;
}
.hero--split .hero-actions { gap: .875rem; margin-top: 1.5rem; }
.hero--split .hero-actions .button {
  margin: 0;
  padding: .875rem 1.25rem;
  min-height: 52px;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
  justify-content: center;
}
.hero--split .button-outline {
  background: transparent;
  color: var(--navy);
  border-color: #7e9890;
}
.hero--split .button-outline:hover { background: var(--navy); color: white; }
.hero--split .hero-visual {
  display: grid;
  grid-template-rows: auto auto;
  align-self: center;
  width: 100%;
  min-width: 0;
  margin: 0;
  background: #dfe9e4;
}
/* One stable native-ratio frame for G1 and the film; CAD remains uncropped. */
.hero--split .hero-media { position: relative; min-height: 0; aspect-ratio: 16 / 9; overflow: hidden; }
.hero--split .hero-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 68% center;
}
.hero--split #hero-motion { object-fit: contain; background: #14394b; object-position: center; }
.hero--split .hero-motion-control {
  right: 1.25rem;
  bottom: 1.25rem;
  max-width: calc(100% - 2.5rem);
  min-height: 44px;
  padding: .625rem 1rem;
  border-color: #d7e7df;
  background: #14394bed;
  color: #fff;
  font-size: .875rem;
  line-height: 1.4;
}
.hero--split .hero-motion-control:hover { background: #14394b; }
.hero--split .hero-visual figcaption {
  background: #e7eeeb;
  color: #37564c;
  padding: .875rem 1.5rem;
  font-size: .875rem;
  line-height: 1.5;
}

.project-paths {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.project-paths > a {
  display: grid;
  grid-template-columns: 1.5rem minmax(0, 1fr) 1.25rem;
  align-items: center;
  gap: .875rem;
  min-height: 56px;
  padding: .75rem 1.5rem;
  border-right: 1px solid var(--line);
  color: var(--navy);
  text-decoration: none;
  font-family: Outfit, Arial, sans-serif;
  font-size: 1.1875rem;
  font-weight: 550;
  line-height: 1.35;
}
.project-paths > a:first-child { padding-left: 0; }
.project-paths > a:last-child { border-right: 0; padding-right: 0; }
.project-paths > a:hover { color: var(--green); }
.project-paths .path-number { font-size: .875rem; font-weight: 500; color: var(--green); }
.project-paths .path-arrow { font-size: 1.375rem; justify-self: end; }

/* Preserve basic reflow; the dedicated mobile review follows all 28 steps. */
@media (max-width: 1100px) {
  .catalogue-header nav { justify-content: flex-start; flex-basis: 100%; }
  .hero--split .hero-copy { padding: 2rem 1.75rem; }
  .hero.hero--split h1 { font-size: 2.5rem; }
  .hero--split .hero-copy > .hero-description { font-size: 1.0625rem; }
  .project-paths > a { padding: .75rem 1rem; gap: .625rem; font-size: 1.0625rem; }
}
@media (max-width: 850px) {
  .hero.hero--split { grid-template-columns: 1fr; min-height: 0; }
  .hero--split .hero-copy { padding: 2.75rem 1.75rem; }
  .hero.hero--split h1 { max-width: 38rem; font-size: clamp(2.25rem, 6vw, 3rem); }
  .hero--split .hero-media { min-height: 0; aspect-ratio: 16 / 9; }
  .hero--split .hero-image { object-position: center; }
  .project-paths { grid-template-columns: 1fr; padding-top: .75rem; padding-bottom: .75rem; }
  .project-paths > a, .project-paths > a:first-child, .project-paths > a:last-child {
    border-right: 0;
    padding: 1rem 0;
    font-size: 1.125rem;
    min-height: 68px;
  }
  .project-paths > a + a { border-top: 1px solid var(--line); }
}
@media (max-width: 480px) {
  .catalogue-header { padding: .625rem 1.125rem; }
  .catalogue-header nav { gap: 0 1rem; }
  .hero--split .hero-copy { padding: 2.25rem 1.125rem; }
  .hero.hero--split h1 { font-size: clamp(1.875rem, 7.5vw, 2.25rem); }
  .hero--split .hero-copy .eyebrow { font-size: .8125rem; }
  .hero--split .hero-copy > .hero-description { font-size: 1.0625rem; }
  .hero--split .hero-actions { align-items: stretch; }
  .hero--split .hero-actions .button { flex: 1 1 100%; }
  .hero--split .hero-visual figcaption { padding: .875rem 1.125rem; }
}

/* Compact mobile navigation keeps the content and player in view. */
@media(max-width:1000px){
 .catalogue-header{flex-direction:row;align-items:center;justify-content:space-between;gap:0 12px}
 .catalogue-header .brand{flex:0 1 168px;min-width:0}
 .catalogue-header.has-menu #menu-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 12px;border:1px solid var(--navy);background:white;color:var(--navy);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
 .catalogue-header.has-menu nav{display:none;flex:1 0 100%;padding-top:8px}
 .catalogue-header.has-menu nav.is-open{display:flex}
}