/* ==========================================================================
   hem-test.css — Homepage design refresh (compact trust strip + hero tuning).

   Loaded on BOTH the live front page (front-page.php) and the /hem-test/
   preview (page-hem-test.php). Scoped with [class*="topolis-page-home"] so it
   matches the live homepage wrapper (.topolis-page-home) AND the preview
   wrapper (.topolis-page-home-test) — and nothing else on the site (inner
   pages use .topolis-page-<slug>, which never contains "home").

   The full hero + green trust strip only appear on the homepage, so these
   rules are effectively homepage-only.
   ========================================================================== */

/* -- Hero copy card: let the background image breathe -----------------------
   Slightly narrower and more transparent than the base card, with a stronger
   blur (keeps the dark serif heading legible) and a deeper shadow so the glass
   lifts off the photo. Same glassmorphism language as the base theme. */
[class*="topolis-page-home"] .nt-page-hero__copy{
  width:min(500px,100%);
  max-width:500px;
  background:rgba(255,255,255,.6);
  -webkit-backdrop-filter:blur(22px);
  backdrop-filter:blur(22px);
  box-shadow:0 24px 60px rgba(0,0,0,.22);
}

/* -- Upgraded green trust strip (compact) -----------------------------------
   Soft green gradient with a top hairline; each item is an icon chip + label
   on one row (keeps the bar short), with thin dividers between items and a
   subtle hover lift. Brand tokens + clamp() sizing, no fixed magic numbers. */
[class*="topolis-page-home"] .trust-strip{
  background:linear-gradient(180deg,#b8e2c6 0%,#a1d3b2 100%);
  padding:clamp(10px,1vw,16px) 0;
  border-top:1px solid rgba(255,255,255,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 10px 26px -20px rgba(21,60,45,.6);
}

[class*="topolis-page-home"] .trust-grid{gap:0;align-items:center}

[class*="topolis-page-home"] .trust-grid span{
  position:relative;
  flex-direction:row;
  justify-content:center;
  align-items:center;
  gap:10px;
  padding:2px clamp(8px,1.2vw,20px);
  font-size:clamp(12px,.9vw,14px);
  font-weight:500;
  color:var(--topolis-dark);
  letter-spacing:.01em;
  line-height:1.25;
}

/* Hairline divider between items (not after the last). */
[class*="topolis-page-home"] .trust-grid span:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  width:1px;
  height:26px;
  background:rgba(21,60,45,.16);
}

/* Icon chip — small and neat. */
[class*="topolis-page-home"] .trust-grid svg{
  width:38px;
  height:38px;
  padding:9px;
  border-radius:50%;
  background:rgba(255,255,255,.6);
  color:var(--green-dark);
  box-sizing:border-box;
  box-shadow:0 3px 9px -5px rgba(21,60,45,.5);
  flex:none;
  transition:transform .2s ease, background .2s ease;
}
[class*="topolis-page-home"] .trust-grid span:hover svg{transform:translateY(-2px);background:#fff}

@media(max-width:900px){
  [class*="topolis-page-home"] .trust-grid{grid-template-columns:1fr 1fr;gap:14px 8px}
  [class*="topolis-page-home"] .trust-grid span::after{display:none}
  [class*="topolis-page-home"] .trust-grid span{justify-content:flex-start}
}
@media(max-width:520px){
  [class*="topolis-page-home"] .trust-grid{grid-template-columns:1fr}
}
