.r1 { background: #000; color: #fff; font-family: inherit; line-height: 1.8; }
.r1 *, .r1 *::before, .r1 *::after { box-sizing: border-box; }
.r1 img { display: block; max-width: 100%; height: auto; }
.r1 a { color: inherit; text-underline-offset: .25em; }
.r1 a:focus-visible { outline: 3px solid #00ae42; outline-offset: 6px; }
.r1 ::selection { color: #000; background: #68d58f; }
.r1-wrap { width: min(1200px, 90%); margin-inline: auto; }
.r1-hero { position: relative; isolation: isolate; background: #101010; color: #fff; border-bottom: 2px solid #00ae42; line-height: 1.4; }
/* X1E: 60vw product area (2468 x 1496), 140px top / 160px copy bottom. */
.r1-hero-inner { position: relative; width: 100%; display: grid; grid-template-columns: calc(100% - 60vw + 80px) 1fr; align-items: center; padding-top: 140px; }
.r1-hero-inner::after { content: ""; grid-column: 2; grid-row: 1; height: min(36.36953vw, 800px); }
.r1-hero-copy { position: relative; z-index: 1; grid-column: 1; grid-row: 1; justify-self: end; width: 432px; max-width: 100%; margin-bottom: 160px; }
.r1-hero .r1-logo { filter: brightness(0) invert(1); }
.r1-logo { width: 250px; }
.r1 h1 { margin: 24px 0 12px; font-size: 80px; font-weight: 700; line-height: 1.1; }
.r1-lead { margin: 0 0 30px; font-size: 23px; font-weight: 700; line-height: 1.6; }
.r1 .r1-hero-image { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.r1-actions { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }
.r1 .r1-button { display: inline-block; padding: 14px 36px; background: #00ae42; color: #000; font-weight: 700; text-align: center; text-decoration: none; transition: background .2s; }
.r1 .r1-button:hover { background: #63d28d; }
.r1-hero .r1-logo { width: 15vw; max-width: 360px; margin-bottom: 20px; }
.r1-hero h1 { margin: 0; font-size: clamp(28px, 6vw, 94px); line-height: 1.4; }
.r1-hero .r1-lead { margin: 0 0 50px; font-size: clamp(18px, 1.3vw, 22px); font-weight: 400; line-height: 1.4; }
.r1-hero .r1-actions { display: flex; gap: 24px; align-items: center; font-size: 16px; }
.r1-hero .r1-button { padding: 16px 32px; border: 0; border-radius: 0; }
.r1-hero .r1-spec-link { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.r1-hero .r1-spec-link:hover { color: #68d58f; }
.r1-nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px 40px; padding-block: 28px; border-bottom: 1px solid #333; }
.r1-nav a { padding: 6px 0; }
.r1-nav a:hover, .r1-back:hover { color: #68d58f; }
.r1-section { padding-block: 80px; scroll-margin-top: 100px; }
.r1 h2 { color: #00ae42; font-size: 32px; line-height: 1.5; font-weight: 700; text-align: center; margin: 0 0 28px; }
.r1 h3 { color: #fff; font-size: 24px; line-height: 1.6; margin: 0 0 20px; }
.r1-intro { max-width: 760px; margin: 0 auto 44px; text-align: center; font-size: 17px; }
.r1-feature { display: grid; grid-template-columns: 1fr 1fr; gap: 7%; align-items: center; }
.r1-feature h3:not(:first-child) { margin-top: 36px; }
.r1-feature p { margin: 0 0 20px; }
.r1-wide-image { width: 100%; }
.r1-figure { margin: 0; }
.r1-image-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.r1-image-credit { margin-top: 24px; text-align: center; }
.r1 figcaption, .r1-note { color: #c9c9c9; font-size: 14px; line-height: 1.8; }
.r1 figcaption { margin-top: 14px; text-align: center; }
.r1-specs { width: 100%; border-collapse: collapse; margin: 0 0 24px; font-size: 16px; color: #fff; background: transparent; }
.r1-specs caption { text-align: left; padding-bottom: 16px; }
.r1-specs th, .r1-specs td { padding: 20px 24px; border: 0; border-bottom: 1px solid #444; text-align: left; background: transparent; }
.r1-specs th { width: 36%; font-weight: 500; }
.r1-specs tr:first-child { border-top: 2px solid #00ae42; }
.r1-contact { padding: 70px 0; text-align: center; border-top: 5px solid #00ae42; background: #161616; }
.r1-contact p { margin: 0 0 30px; }
.r1-contact-actions { display: flex; justify-content: center; align-items: center; gap: 24px; flex-wrap: wrap; }
.r1-back { display: inline-block; margin: 0; }
.r1-list { margin: 0; }
.r1-list > div { padding: 22px 0; border-bottom: 1px solid #333; }
.r1-list dt { font-size: 20px; font-weight: 700; margin-bottom: 10px; }
.r1-list dd { margin: 0; color: #ddd; }
.r1-explanation { max-width: 850px; margin: 40px auto 0; }
.r1-explanation h3:not(:first-child) { margin-top: 34px; }
.r1-explanation p { margin: 0 0 18px; }
.r1-sensors, .r1-accessories { margin-top: 36px; }
.r1-sensors > div, .r1-accessories > div { display: grid; grid-template-columns: 32% 1fr; gap: 32px; }
.r1 .r1-materials { margin-top: 48px; }
.r1-materials th { width: auto; }
.r1-materials thead th { color: #68d58f; font-weight: 700; }
.r1-text-columns { align-items: start; }
.r1 .r1-subheading { margin: 44px 0 24px; }
.r1 #r1-expansion .r1-figure { max-width: 900px; margin-inline: auto; }
@media (min-width: 768px) and (max-width: 1199px) {
  .r1-hero-inner { grid-template-columns: calc(100% - 60vw) 1fr; padding-top: 80px; }
  .r1-hero-inner::after { height: min(43.57282vw, 800px); }
  .r1-hero-copy { margin-bottom: 80px; }
  .r1-hero .r1-lead { margin-bottom: 30px; }
}
@media (min-width: 768px) and (max-width: 1020px) {
  .r1-hero-inner { padding-top: 60px; padding-left: 20px; }
  .r1-hero-copy { margin-bottom: 40px; }
}
@media (max-width: 767px) {
  .r1-image-pair { grid-template-columns: 1fr; gap: 28px; }
  .r1-list dt { font-size: 18px; }
  .r1-sensors > div, .r1-accessories > div { grid-template-columns: 1fr; gap: 0; }
  .r1-materials th, .r1-materials td { padding: 14px 8px; }
  .r1 .r1-materials th { width: auto; }
  .r1-hero-inner { width: 90%; display: flex; flex-direction: column; align-items: stretch; gap: 30px; padding: 30px 0; }
  .r1-hero-inner::after { display: none; }
  .r1-hero-copy { width: 100%; max-width: none; margin: 0; text-align: center; }
  .r1-hero .r1-logo { width: 40vw; margin-inline: auto; }
  .r1-hero h1 { font-size: 50px; margin: 0 0 20px; }
  .r1-hero .r1-lead { font-size: 18px; margin-bottom: 30px; }
  .r1-hero .r1-actions { justify-content: center; }
  .r1 .r1-hero-image { position: relative; inset: auto; z-index: 0; width: calc(100% / .9); max-width: none; height: auto; margin-inline: calc(-100% / 18); }
  .r1-logo { width: 200px; }
  .r1 h1 { font-size: 60px; margin-top: 22px; }
  .r1-lead { font-size: 20px; }
  .r1 h2 { font-size: 25px; }
  .r1 h3 { font-size: 21px; }
  .r1-section { padding-block: 48px; }
  .r1-intro { font-size: 15px; margin-bottom: 28px; }
  .r1-intro br { display: none; }
  .r1-feature { grid-template-columns: 1fr; gap: 28px; }
  .r1-nav { gap: 8px 22px; font-size: 14px; padding-block: 20px; }
  .r1-specs { font-size: 14px; }
  .r1-specs th, .r1-specs td { padding: 16px 10px; overflow-wrap: anywhere; }
  .r1-specs th { width: 40%; }
  .r1-contact { padding-block: 48px; }
}
@media (prefers-reduced-motion: reduce) { .r1 .r1-button { transition: none; } }