/* =========================================================
   HHC TRUST SECTION
   Path: /wp-content/uploads/hh-assets/hh-trust/hh-trust.css
   Scoped to: #hh-trust
   ========================================================= */

#hh-trust{
  --ink:#0f172a;
  --ink-muted:#475569;
  --muted:#64748b;
  --accentA:#2563eb;
  --accentB:#38bdf8;
  --border:rgba(0,0,0,.06);
  --shadow: 0 12px 32px rgba(0,0,0,.07), 0 4px 12px rgba(0,0,0,.04);
  --shadow-hover: 0 0 30px rgba(56,189,248,.45), 0 0 60px rgba(37,99,235,.30), 0 12px 32px rgba(0,0,0,.08);
  --r:20px;

  padding: 80px 20px;
  color: var(--ink);
}

#hh-trust .hh-trust-wrap{
  max-width: 1100px;
  margin: 0 auto;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Header */
#hh-trust .hh-trust-title{
  margin: 0 0 12px;
  text-align: center;
  font-size: clamp(26px, 4vw, 34px);
  line-height: 1.15;
  font-weight: 800;
  color: var(--ink);
}

#hh-trust .hh-trust-lead{
  text-align: center;
  max-width: 760px;
  margin: 0 auto 56px;
  color: var(--ink-muted);
  font-size: 16px;
  line-height: 1.6;
}

/* Section labels */
#hh-trust .hh-trust-level{
  margin: 48px 0 10px;
  font-size: 18px;
  font-weight: 800;
  color: var(--ink);
}

#hh-trust .hh-trust-microline{
  margin: 0 0 20px;
  font-size: 13.5px;
  color: var(--muted);
  font-weight: 700;
}

/* Grid */
#hh-trust .hh-trust-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

@media (max-width: 720px){
  #hh-trust .hh-trust-grid{
    grid-template-columns: 1fr;
  }
}

/* Card base */
#hh-trust .hh-trust-card{
  position: relative;
  isolation: isolate;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  padding: 22px;
  outline: none;
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease,
    background .25s ease;
}

/* Glow layer */
#hh-trust .hh-trust-card::before{
  content: "";
  position: absolute;
  inset: -2px;
  z-index: 0;
  border-radius: calc(var(--r) + 2px);
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(520px 260px at 18% 12%, rgba(56,189,248,.18), transparent 60%),
    radial-gradient(520px 260px at 85% 20%, rgba(37,99,235,.16), transparent 60%),
    radial-gradient(520px 260px at 55% 110%, rgba(16,185,129,.10), transparent 60%);
  transition: opacity .25s ease;
}

#hh-trust .hh-trust-card > *{
  position: relative;
  z-index: 1;
}

/* Card text */
#hh-trust .hh-trust-icon{
  font-size: 28px;
  margin-bottom: 6px;
  line-height: 1;
}

#hh-trust .hh-trust-card h4{
  margin: 0 0 8px;
  font-size: 16.5px;
  line-height: 1.25;
  font-weight: 800;
  color: var(--ink);
}

#hh-trust .hh-trust-card p{
  margin: 0 0 6px;
  font-size: 14.5px;
  line-height: 1.6;
  color: #334155;
}

#hh-trust .hh-trust-note{
  font-size: 12.5px;
  color: var(--muted);
}

/* Focus */
#hh-trust .hh-trust-card:focus-visible{
  outline: 3px solid rgba(56,189,248,.55);
  outline-offset: 4px;
}

/* Desktop hover */
@media (hover:hover) and (pointer:fine){
  #hh-trust .hh-trust-card:hover{
    transform: translateY(-5px);
    box-shadow: var(--shadow-hover);
    border-color: rgba(56,189,248,.32);
    background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(224,242,254,.88) 100%);
  }

  #hh-trust .hh-trust-card:hover::before{
    opacity: 1;
  }
}

/* Mobile active glow (set by JS) */
#hh-trust .hh-trust-card.hh-mobile-glow{
  transform: translateY(-2px);
  box-shadow: var(--shadow-hover);
  border-color: rgba(56,189,248,.28);
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(224,242,254,.88) 100%);
}

#hh-trust .hh-trust-card.hh-mobile-glow::before{
  opacity: 1;
}

/* Footline */
#hh-trust .hh-trust-footline{
  margin: 56px 0 0;
  text-align: center;
  font-size: 14px;
  line-height: 1.5;
  color: var(--muted);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  #hh-trust .hh-trust-card{
    transition: none !important;
    transform: none !important;
  }

  #hh-trust .hh-trust-card::before{
    transition: none !important;
  }

  #hh-trust .hh-trust-card.hh-mobile-glow{
    box-shadow: var(--shadow);
    background: #fff;
    border-color: var(--border);
  }
}
