/* ============================================================================
   DreamLife — Hero Trust & Reviews widget
   ----------------------------------------------------------------------------
   Structural CSS only. Everything a control can change is emitted per-instance
   by Elementor from the control `selectors`, so the panel always wins.

   Designed to sit on the dark hero image: the pills are translucent white and
   the dots and the Google line are light. Restyle from the panel for a light
   background.
   ========================================================================= */

.dl-trust{width:100%}
.dl-trust *,.dl-trust *::before,.dl-trust *::after{box-sizing:border-box}
.dl-trust ul{margin:0;padding:0;list-style:none}
.dl-trust p{margin:0}
.dl-trust button{font:inherit}

.dl-trust .dl-trust__pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:52px}
.dl-trust .dl-pill{display:inline-flex;align-items:center;gap:10px;
  padding:8px 15px;border-radius:999px;
  background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.17);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  color:#fff;font-size:13.5px;font-weight:600;
  transition:background-color .22s var(--ease),transform .22s var(--ease);}
.dl-trust .dl-pill:hover{background:rgba(255,255,255,.22);transform:translateY(-2px)}
.dl-trust .dl-pill svg{flex:none}
.dl-trust .dl-reviews{margin-top:34px;width:100%;max-width:620px}
.dl-trust .dl-reviews__viewport{overflow:hidden;border-radius:var(--radius-lg);
  touch-action:pan-y;cursor:grab;-webkit-user-select:none;user-select:none;}
.dl-trust .dl-reviews__viewport:active{cursor:grabbing}
.dl-trust .dl-reviews__track{display:flex;will-change:transform;
  transition:transform .55s cubic-bezier(.45,.05,.25,1);}
.dl-trust .dl-review{flex:0 0 100%;min-width:0;
  background:#fff;border-radius:var(--radius-lg);
  padding:20px 22px 22px;
  box-shadow:0 10px 30px rgba(8,16,30,.22);}
.dl-trust .dl-review__head{display:flex;align-items:flex-start;gap:12px}
.dl-trust .dl-review__avatar{flex:none;width:42px;height:42px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:17px;font-weight:800;color:#fff;letter-spacing:.01em;}
.dl-trust .dl-review__who{flex:1;min-width:0}
.dl-trust .dl-review__name{font-size:15.5px;font-weight:800;color:var(--ink);line-height:1.25}
.dl-trust .dl-review__stars{display:flex;gap:2px;margin-top:3px}
.dl-trust .dl-review__stars svg{fill:#FBBC05}
.dl-trust .dl-review__meta{margin-top:2px;font-size:12.5px;color:var(--muted-2)}
.dl-trust .dl-review__badge{flex:none;display:inline-flex;align-items:center;gap:5px;
  padding:5px 9px;border-radius:999px;background:#F1F5FA;
  font-size:11px;font-weight:800;letter-spacing:.02em;color:#4A5A70;text-transform:uppercase;}
.dl-trust .dl-review__text{margin-top:14px;font-size:14.5px;line-height:1.62;color:#3D4A5C;}
.dl-trust .dl-reviews__foot{display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin-top:14px;flex-wrap:wrap;}
.dl-trust .dl-reviews__dots{display:flex;gap:7px}
.dl-trust .dl-reviews__dot{width:9px;height:9px;padding:0;border:0;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.42);
  transition:background-color .25s var(--ease),width .25s var(--ease);}
.dl-trust .dl-reviews__dot:hover{background:rgba(255,255,255,.72)}
.dl-trust .dl-reviews__dot[aria-selected="true"]{width:24px;background:#fff}
.dl-trust .dl-reviews__source{display:inline-flex;align-items:center;gap:7px;
  font-size:13px;color:rgba(255,255,255,.85);}
.dl-trust .dl-reviews__source b{color:#fff;font-weight:800}
.dl-trust .dl-g-mark{flex:none}
@media (max-width:680px){
.dl-trust .dl-trust__pills{margin-top:34px}
.dl-trust .dl-reviews{margin-top:26px}
.dl-trust .dl-review{padding:17px 17px 19px}
.dl-trust .dl-review__text{font-size:14px}
.dl-trust .dl-reviews__foot{justify-content:center;gap:10px}
.dl-trust .dl-pill{font-size:13px;padding:8px 14px}}
@media (hover:none){
.dl-trust .btn:hover,
.dl-trust .dl-pill:hover,
.dl-trust .diff-card:hover,
.dl-trust .col-card:hover,
.dl-trust .amenity:hover,
.dl-trust .logo-grid img:hover,
.dl-trust .shot:hover img,
.dl-trust .split__media:hover img,
.dl-trust .clinical__list li:hover,
.dl-trust .icon-list li:hover .ico,
.dl-trust .diff-card:hover .diff-card__icon,
.dl-trust .amenity:hover .amenity__icon,
.dl-trust .timeline__item:hover .timeline__dot,
.dl-trust .lightbox__btn:hover,
.dl-trust .lightbox__nav:hover,
.dl-trust .video-overlay:hover .video-play{transform:none}/* the tap affordance has to be visible up front */
.dl-trust .dl-reviews__dot:hover{background:rgba(255,255,255,.42)}
.dl-trust .dl-reviews__dot[aria-selected="true"]:hover{background:#fff}
.dl-trust .tab:active,
.dl-trust .diff-card:active,
.dl-trust .col-card:active,
.dl-trust .amenity:active,
.dl-trust .dl-pill:active,
.dl-trust .choice:active{transform:scale(.985)}}
/* The pill icon comes from Elementor's icon control, so size it here. */
.dl-trust .dl-pill i,
.dl-trust .dl-pill svg{flex:none;width:1em;height:1em;font-size:15px}
.dl-trust .dl-pill svg{fill:currentColor}

/* Avatar can be an image instead of an initial. */
.dl-trust .dl-review__avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}

/* Dragging must not select the review text, and a vertical drag belongs to the page. */
.dl-trust .dl-reviews__viewport{
  touch-action:pan-y;cursor:grab;
  -webkit-user-select:none;user-select:none;
}
.dl-trust .dl-reviews__viewport:active{cursor:grabbing}

@media (hover:none){
  .dl-trust .dl-pill:hover{transform:none}
  .dl-trust .dl-reviews__dot:hover{background:rgba(255,255,255,.42)}
  .dl-trust .dl-reviews__dot[aria-selected="true"]:hover{background:#fff}
  .dl-trust .dl-pill:active{transform:scale(.985)}
}

@media (prefers-reduced-motion:reduce){
  .dl-trust *{transition-duration:.01ms !important}
  .dl-trust .dl-pill:hover{transform:none}
}
