/* Periodic inspection feature (services) and the advert band (home) */
.pir { position: relative; overflow: hidden; background: radial-gradient(110% 140% at 100% 0%, #262c40, var(--night) 55%, var(--ink)); color: var(--paper); padding: clamp(3.5rem, 8vw, 6.5rem) 0; scroll-margin-top: 5rem; }
.pir::before { content: ""; position: absolute; width: 40rem; height: 40rem; left: -16rem; bottom: -20rem; border-radius: 50%; background: radial-gradient(circle, rgba(230, 222, 120, 0.12), transparent 65%); pointer-events: none; }
.pir__in { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.pir h2 { font-size: clamp(2rem, 4vw, 3.25rem); margin-bottom: 1.1rem; }
.pir .prose { color: var(--mute-d); font-size: 1.0625rem; }
.pir__points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.7rem 1.5rem; margin: 1.75rem 0 2rem; }
.pir__points li { position: relative; padding-left: 1.9rem; font-weight: 500; line-height: 1.4; }
.pir__points li::before { content: ""; position: absolute; left: 0; top: 0.1rem; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: var(--fuse) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b0e14' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 70% no-repeat; }
.pir__act { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.pir .btn--ink { background: var(--fuse); border-color: var(--fuse); color: var(--ink); }
.pir .btn--ink:hover { box-shadow: 0 14px 34px -12px rgba(255, 242, 122, 0.75); }
.pir .btn--line { border-color: rgba(255, 255, 255, 0.45); color: var(--paper); }
.pir .btn--line:hover { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.pir :focus-visible { outline-color: var(--glow); }
.pir__size { font: 500 0.875rem/1 var(--body); opacity: 0.7; }
.pir__media { position: relative; margin: 0; }
.pir__media::before { content: ""; position: absolute; z-index: 0; left: -1.25rem; top: -1.25rem; width: 46%; height: 42%; border: 2px solid var(--fuse); border-radius: 28px; opacity: 0.7; }
.pir video { position: relative; display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 28px 28px 120px 28px; background: var(--ink); box-shadow: 0 40px 80px -40px #000, 0 0 0 1px rgba(255, 255, 255, 0.08); }
.pir figcaption { position: relative; margin-top: 1rem; font-size: 0.9375rem; color: var(--mute-d); max-width: 34em; }

.promo { padding: clamp(3.5rem, 8vw, 6.5rem) 0; background: var(--mist); }
.promo__in { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.promo__art { margin: 0; border-radius: 26px; overflow: hidden; background: var(--ink); box-shadow: 0 40px 70px -40px rgba(11, 14, 20, 0.6); transform: rotate(-1.5deg); transition: transform 0.5s var(--ease); }
.promo__art:hover { transform: rotate(0) scale(1.01); }
.promo__art img { width: 100%; }
.promo__copy p { color: var(--mute); max-width: 32em; font-size: 1.125rem; }
.promo__act { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.75rem; }

@media (max-width: 64rem) {
  .pir__in, .promo__in { grid-template-columns: minmax(0, 1fr); }
  .pir__media { order: -1; }
  .pir__media { max-width: 34rem; width: 100%; }
  .promo__art { max-width: 30rem; width: 100%; }
}
@media (max-width: 40rem) {
  .pir__points { grid-template-columns: minmax(0, 1fr); }
  .pir__act .btn, .promo__act .btn { flex: 1 1 100%; }
  .pir video { border-radius: 22px 22px 80px 22px; }
  .pir__media::before { left: -0.5rem; top: -0.75rem; }
}
