:root { --lume-paper: #ece9df; --lume-cream: #f6f3ea; --lume-olive: #27362c; --lume-sage: #637762; }
.demo-bar { background: #314437; text-transform: none; letter-spacing: .02em; }
.lume-header { border-bottom: 1px solid #c8cabf; }
.lume-hero { display: grid; grid-template-columns: minmax(0,48%) minmax(0,52%); align-items: stretch; min-height: min(730px,80dvh); background: var(--lume-paper); color: var(--lume-olive); }
.lume-hero::before { display: none; }
.lume-hero > img { position: static; grid-column: 2; grid-row: 1; z-index: auto; width: 100%; height: 100%; object-fit: cover; object-position: 60% center; filter: saturate(.78); }
.lume-hero-content { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; width: auto; margin: 0; padding: 75px clamp(28px,7vw,120px); }
.lume-hero h1 { font-size: clamp(4.5rem,8vw,9rem); max-width: 10ch; margin-bottom: 32px; }
.lume-hero-content .lume-eyebrow { color: #677d6b; }
.lume-hero-copy { max-width: 37ch; line-height: 1.75; }
.lume-button-light { background: transparent; color: var(--lume-olive); border-bottom: 1px solid currentColor; padding: 12px 0; }
.lume-button-light:hover { background: transparent; color: #607360; }
.lume-hero-side { color: var(--lume-cream); right: 22px; }
.lume-intro { grid-template-columns: .8fr 1.2fr; }
.lume-intro-image img { aspect-ratio: 5/4; }
.lume-services { background: #e0e6dc; }
.lume-service-grid { display: block; border-top: 1px solid #849589; }
.lume-service-grid article { min-height: 0; display: grid; grid-template-columns: .3fr .7fr 1.3fr; align-items: baseline; gap: 20px; padding: 23px 4px; border-bottom: 1px solid #849589; background: transparent; }
.lume-service-grid article:hover { transform: none; }
.lume-service-grid h3 { margin: 0; font-size: clamp(2.4rem,4vw,4.1rem); }
.lume-service-grid p { max-width: 45ch; margin: 0; }
.lume-service-line { display: none; }
.lume-statement { background: #3c5341; }
@media (max-width: 780px) {
  .lume-hero { display: flex; flex-direction: column; min-height: 0; }
  .lume-hero-content { order: 1; padding: 70px 22px 45px; }
  .lume-hero > img { order: 2; height: clamp(270px,78vw,480px); object-position: center; }
  .lume-hero h1 { font-size: clamp(4.3rem,13vw,7rem); }
  .lume-service-grid article { grid-template-columns: 50px 1fr; gap: 7px 16px; }
  .lume-service-grid p { grid-column: 2; }
}
