/* uk-registered-office-address.css -- styles used only on uk-registered-office-address.html.
   Generated by tools/split-css.js from the original style.css. */

.uk-address-visual {
  position: relative;
  min-height: 390px;
}

.address-step-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 88px;
}

.address-three-col {
  grid-template-columns: 1fr 1fr;
}

.address-benefit-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 15px;
  margin-top: 22px;
}

.address-benefit-row article {
  display: grid;
  justify-items: center;
  text-align: center;
}

.address-benefit-row h3 {
  margin: 10px 0 6px;
  font-size: 13px;
}

.address-benefit-row p {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
}

.address-included {
  grid-template-columns: 42% 58%;
}

.address-included .check-list {
  columns: 1;
}

.address-steps {
  grid-template-columns: 1fr;
  text-align: center;
}

.address-final-cta {
  grid-template-columns: 1fr 220px;
}

@media (max-width: 980px) {
  .uk-address-visual {
    min-height: 430px;
  }
  .address-final-cta {
    grid-template-columns: 1fr;
  }

  /* .address-benefit-row sets its own unconditional grid-template-columns
     above, which -- loading after base.css, at the same specificity --
     silently wins over base.css's shared collapse rule for this class
     name at every width, including mobile (see
     UK-PAGES-RESPONSIVE-SPEC.md, Finding A). legacy-patches.css already
     fixes this exact issue for .address-step-grid, .address-three-col
     (via the co-occurring .uk-three-col class) and .address-included
     with page-shell-scoped !important rules, but has no equivalent for
     .address-benefit-row -- re-declaring its intended collapse here
     fixes it without touching either of those files. */
  .address-benefit-row {
    grid-template-columns: repeat(2, 1fr);
  }
  .address-benefit-row article:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 620px) {
  .uk-address-visual {
    min-height: 710px;
  }

  .address-benefit-row {
    grid-template-columns: 1fr;
  }
  .address-benefit-row article:last-child {
    grid-column: auto;
  }
}


/* Client testimonial marquee (matches homepage index.html) */
.testimonial-marquee {
  width: 100%;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}

.testimonial-track {
  display: flex;
  width: max-content;
  gap: 16px;
  animation: testimonial-scroll 48s linear infinite;
}

.testimonial-marquee:hover .testimonial-track,
.testimonial-marquee:focus-within .testimonial-track {
  animation-play-state: paused;
}

@keyframes testimonial-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.marquee-card {
  flex: 0 0 340px;
  width: 340px;
  min-height: 190px;
  padding: 20px 24px;
}

.marquee-card .avatar {
  width: 40px;
  height: 40px;
  flex-basis: 40px;
}

.marquee-card p {
  font-size: 14px;
  line-height: 1.55;
}

.marquee-card .stars {
  font-size: 20px;
}

.marquee-card .person strong {
  font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
  .testimonial-track {
    animation: none;
  }
}

@media (max-width: 620px) {
  .marquee-card {
    flex-basis: 285px;
    width: 285px;
    padding: 18px 20px;
  }
}