/* ==========================================================================
   Meeow 0.2.6 — Home trust strip v1
   Loaded after bright-v1.css. Four white cards with 3D art pods; the phone
   card is one tel: link whose number is typed in when it scrolls into view.
   The red area code uses --b-cta so it keeps AA contrast on the white card.
   ========================================================================== */

.hv3-trust .tr1 {
  margin: 0; padding: 0;
  list-style: none;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;
  background: none; border: 0; border-radius: 0;
}
.hv3-trust .tr1 > li { min-width: 0; display: block; padding: 0; }

.hv3-trust .tr1-card {
  --tr-tint: var(--b-mint-soft);
  --tr-edge: rgba(10, 113, 102, .16);
  position: relative;
  justify-self: stretch;
  height: 100%; min-height: 88px;
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px;
  color: var(--b-ink);
  text-decoration: none;
  background: #fff;
  border: 1px solid var(--b-hair);
  border-radius: 22px;
  box-shadow: 0 1px 2px rgba(34, 48, 74, .04), 6px 10px 22px -16px rgba(170, 138, 104, .5);
}
.hv3-trust .tr1-card.is-sun { --tr-tint: var(--b-sun-soft); --tr-edge: rgba(138, 90, 0, .16); }
.hv3-trust .tr1-card.is-peach { --tr-tint: var(--b-peach); --tr-edge: rgba(184, 57, 45, .14); }
.hv3-trust .tr1-card.is-sky { --tr-tint: var(--b-sky-soft); --tr-edge: rgba(31, 95, 153, .16); }

.hv3-trust .tr1-art {
  flex: none;
  width: 54px; height: 54px;
  display: grid; place-items: center;
  border-radius: 17px;
  background: radial-gradient(120% 120% at 28% 18%, #fff 0%, var(--tr-tint) 58%);
  box-shadow: inset 0 0 0 1px var(--tr-edge), inset 0 -8px 14px -10px var(--tr-edge);
}
.hv3-trust .tr1-art img {
  width: 42px; height: 42px;
  object-fit: contain;
  filter: drop-shadow(0 5px 5px rgba(120, 88, 56, .2));
}

.hv3-trust .tr1 .tr1-text { min-width: 0; display: grid; gap: 3px; line-height: 1.5; }
.hv3-trust .tr1-text strong { color: var(--b-ink); font-size: .9rem; font-weight: 700; line-height: 1.45; }
.hv3-trust .tr1-text small { display: block; color: var(--b-muted); font-size: .74rem; line-height: 1.7; text-wrap: pretty; }

/* Phone card */
.hv3-trust .tr1-card--call {
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .3s var(--b-ease), transform .3s var(--b-ease);
}
.hv3-trust .tr1 .tr1-card--call:hover {
  text-decoration: none;
  border-color: rgba(210, 64, 47, .3);
  transform: translateY(-2px);
  box-shadow: 0 1px 2px rgba(34, 48, 74, .04), 8px 14px 26px -16px rgba(210, 64, 47, .42);
}
.hv3-trust .tr1 .tr1-card--call:active { transform: scale(.985); }
.hv3-trust .tr1 .tr1-card--call:focus-visible { outline: 3px solid var(--b-mint); outline-offset: 3px; }

.hv3-trust .tr1-num {
  justify-self: start;
  direction: ltr; unicode-bidi: isolate;
  white-space: nowrap;
  font-size: 1.1rem; font-weight: 800; line-height: 1.3;
  letter-spacing: .015em;
}
.hv3-trust .tr1-num__code { color: var(--b-cta); }
.hv3-trust .tr1-num__rest { color: var(--b-ink); }
.hv3-trust .tr1-num.is-armed .tr1-ch:not(.is-on) { visibility: hidden; }
.hv3-trust .tr1-caret {
  display: inline-block;
  width: 2px; height: 1.05em;
  margin-right: -2px;
  vertical-align: -.16em;
  background: currentColor;
  border-radius: 1px;
  animation: tr1Blink .8s steps(1) infinite;
}
.hv3-trust .tr1-num.is-typing .tr1-caret { animation-play-state: paused; }
.hv3-trust .tr1-num.is-done .tr1-caret { animation: tr1CaretOut .5s ease forwards; }
@keyframes tr1Blink { 50% { opacity: 0; } }
@keyframes tr1CaretOut { to { opacity: 0; } }

.hv3-trust .tr1-go {
  flex: none;
  width: 34px; height: 34px;
  margin-inline-start: auto;
  display: grid; place-items: center;
  color: var(--b-peach-ink);
  background: var(--b-peach);
  border-radius: 50%;
  transition: color .2s ease, background .2s ease;
}
.hv3-trust .tr1-go svg { width: 17px; height: 17px; }
.hv3-trust .tr1-card--call:hover .tr1-go { color: #fff; background: var(--b-cta); }

/* ---------- Responsive ---------- */
@media (max-width: 1060px) {
  .hv3-trust .tr1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .hv3-trust .tr1 { gap: 8px; }
  .hv3-trust .tr1-card { min-height: 66px; gap: 10px; padding: 10px; border-radius: 18px; }
  .hv3-trust .tr1-art { width: 42px; height: 42px; border-radius: 14px; }
  .hv3-trust .tr1-art img { width: 34px; height: 34px; }
  .hv3-trust .tr1-text strong { font-size: .8rem; }
  .hv3-trust .tr1-text small { display: none; }
  .hv3-trust .tr1-num { font-size: .98rem; }
  .hv3-trust .tr1-go { display: none; }
  .hv3-trust .tr1 .tr1-card--call:hover { transform: none; }
}
@media (max-width: 370px) {
  .hv3-trust .tr1-card { gap: 8px; padding: 9px 8px; }
  .hv3-trust .tr1-art { width: 36px; height: 36px; border-radius: 12px; }
  .hv3-trust .tr1-art img { width: 30px; height: 30px; }
  .hv3-trust .tr1-num { font-size: .88rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hv3-trust .tr1-card--call, .hv3-trust .tr1-go { transition: none; }
  .hv3-trust .tr1 .tr1-card--call:hover, .hv3-trust .tr1 .tr1-card--call:active { transform: none; }
  .hv3-trust .tr1-caret { display: none; }
}