/* Systems and grading additions. Shared by the home and dedicated service pages. */
.compact-systems { background: var(--offwhite); color: var(--charcoal); border-top:1px solid var(--line); }
.compact-systems .systems-home-layout { display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); gap:clamp(2rem,6vw,6rem); align-items:center; }
.compact-systems h2 { max-width:none; font-size:clamp(2.25rem,4vw,3.75rem); color:var(--charcoal); }
.compact-systems .systems-home-copy > p:not(.eyebrow) { max-width:39rem; font-size:clamp(1.08rem,1.6vw,1.32rem); font-weight:300; }
.compact-systems .systems-home-actions { display:flex; flex-wrap:wrap; gap:1rem; margin-top:2rem; }
.compact-systems .systems-home-actions .btn--primary { background:var(--charcoal); color:var(--offwhite); }
.systems-laptop { margin:0; }
.systems-laptop img { display:block; width:100%; height:auto; }
.systems-laptop figcaption { margin-top:.7rem; color:var(--muted); font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; }
.systems-cinestream-link { display:inline-block; margin-top:.8rem; color:inherit; font-size:.85rem; text-underline-offset:.25em; }
.systems-columns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:clamp(2.5rem,5vw,4.5rem); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.systems-columns > div { min-width:0; padding:1.25rem 1.1rem 1.4rem; border-right:1px solid var(--line); }
.systems-columns > div:last-child { border-right:0; }
.systems-columns h3 { margin:0 0 .65rem; color:var(--charcoal); font-size:1rem; font-weight:500; }
.systems-columns p { margin:0; font-size:.93rem; font-weight:300; line-height:1.5; }
.compact-grading { background:#d9dad1; }
.grading-layout { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(2rem,6vw,6rem); align-items:start; }
.grading-copy h2 { max-width:12ch; }
.grading-copy > p:not(.eyebrow) { max-width:37rem; font-size:1.1rem; font-weight:300; }
.grading-credit { color:var(--muted); font-size:.78rem !important; letter-spacing:.06em; text-transform:uppercase; }
.legacy-anchor { display:block; position:relative; top:calc(-1 * var(--header-height)); visibility:hidden; }
.grading-work { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.grading-work a { color:inherit; text-decoration:none; }
.grading-work figure { margin:0; }
.grading-work img { display:block; width:100%; aspect-ratio:4 / 3; object-fit:cover; }
.grading-work figcaption { display:flex; justify-content:space-between; gap:.7rem; padding-top:.7rem; font-size:.9rem; }
.grading-work figcaption span { color:var(--muted); font-size:.73rem; }

.system-page { background:var(--offwhite); color:var(--charcoal); }
.system-page .site-header { background:var(--offwhite); }
.systems-hero { padding-top:clamp(4rem,8vw,8rem); padding-bottom:clamp(3rem,7vw,6rem); background:var(--offwhite); color:var(--charcoal); }
.systems-hero .section__inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr); gap:clamp(2rem,7vw,8rem); align-items:end; }
.systems-hero h1 { max-width:8ch; margin:0; color:var(--charcoal); font-size:clamp(3.4rem,8.4vw,8.6rem); font-weight:300; line-height:.89; letter-spacing:-.07em; }
.systems-hero .hero__lede { max-width:31rem; color:var(--charcoal); font-size:clamp(1.1rem,1.8vw,1.45rem); font-weight:300; }
.systems-hero .btn--primary { background:var(--charcoal); color:var(--offwhite); }
.systems-intro .section__header { max-width:55rem; margin-bottom:clamp(2rem,5vw,4rem); }
.systems-intro h2 { max-width:13ch; }
.systems-offers { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); }
.systems-offers article { min-width:0; padding:clamp(1.4rem,3vw,2.5rem); background:#dedfd5; }
.systems-offers article:first-child { background:var(--charcoal); color:var(--offwhite); }
.systems-offers article:first-child .eyebrow { color:#bfc1b7; }
.systems-offers h3 { margin:.5rem 0 1rem; font-size:clamp(1.45rem,2.5vw,2.5rem); }
.systems-offers p { margin:0; font-weight:300; line-height:1.5; }
.systems-proof { background:#d9dad1; }
.systems-proof-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(2rem,7vw,7rem); align-items:center; }
.systems-proof h2 { max-width:12ch; }
.systems-proof p { max-width:36rem; font-size:1.08rem; font-weight:300; }
.systems-proof figure { margin:0; }
.systems-proof figure img { display:block; width:100%; height:auto; }
.systems-proof figcaption { margin-top:.7rem; color:var(--muted); font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; }
.systems-steps { background:var(--charcoal); color:var(--offwhite); }
.systems-steps h2 { color:var(--offwhite); }
.systems-steps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; margin-top:2.5rem; background:#56594f; }
.systems-steps article { min-width:0; padding:1.4rem; background:var(--charcoal); }
.systems-steps .step-number { color:var(--sulphur); font-size:.75rem; letter-spacing:.1em; }
.systems-steps h3 { margin:.75rem 0; color:var(--offwhite); font-size:1.45rem; }
.systems-steps p { margin:0; color:#d8d9d0; font-weight:300; line-height:1.5; }
.systems-contact { background:var(--offwhite); color:var(--charcoal); border-top:1px solid var(--line); }
.systems-contact .section__inner { display:flex; justify-content:space-between; align-items:end; gap:2rem; }
.systems-contact h2 { max-width:12ch; }
.systems-contact .contact-address { display:block; margin-top:.9rem; color:inherit; }
.systems-contact .btn--primary { background:var(--charcoal); color:var(--offwhite); }
.systems-region { margin-top:1.5rem; color:#3d403a; font-size:.85rem; }

@media (max-width: 48rem) {
  .compact-systems .systems-home-layout,.grading-layout,.systems-hero .section__inner,.systems-proof-grid { grid-template-columns:1fr; }
  .systems-columns,.systems-offers,.systems-steps-grid { grid-template-columns:1fr; }
  .systems-columns > div { border-right:0; border-bottom:1px solid var(--line); }
  .systems-columns > div:last-child { border-bottom:0; }
  .grading-work { gap:.8rem; }
  .systems-hero { padding-top:4rem; }
  .systems-hero h1 { font-size:clamp(3.1rem,15vw,5rem); }
  .systems-contact .section__inner { display:block; }
  .systems-contact .contact-direct { margin-top:2rem; }
}
@media (max-width: 30rem) { .grading-work { grid-template-columns:1fr; } .grading-work img { aspect-ratio:16 / 9; } }
@media (prefers-reduced-motion: reduce) {
  .system-page *, .compact-systems * { scroll-behavior:auto; transition:none!important; animation:none!important; }
}
