/* "What the experts say" trust section: bedrockclaimscore.com
   v2.0, rebuilt Oct 6 2026 per Mykel's spec.
   Outlet names are the hero of each card: large, bold, all-caps, brand font.
   700% stat is the largest element, Bedrock green, count-up on scroll.
   Desktop: hero stat card + 4-card grid. Mobile: horizontal snap carousel. */

/* ---------- section shell ---------- */
.experts{background:var(--cream);padding:72px 0}
.experts .wrap{max-width:1140px}
.experts-head{text-align:center;max-width:780px;margin:0 auto 36px}
.experts-head h2{margin-bottom:12px;font-size:clamp(1.9rem,4.6vw,2.7rem)}
.experts-head .lede{margin:0;font-size:1.1rem}

/* ---------- cards ---------- */
.expert-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.expert-card{
  border:2.5px solid var(--ink);border-radius:var(--r-lg);
  background:#fff;box-shadow:var(--sticker);
  padding:26px 24px;display:flex;flex-direction:column;gap:12px;
}
/* Outlet name: hero of the card, large bold all-caps, brand font/colors */
.expert-card .expert-outlet{
  font-family:var(--font-display);font-weight:900;
  font-size:1.65rem;letter-spacing:.04em;line-height:1.1;
  color:var(--green-800);text-transform:uppercase;
}
.expert-card .expert-quote{
  font-family:var(--font-display);font-weight:600;
  font-size:1.08rem;line-height:1.45;color:var(--ink);flex:1;
}
.expert-card .expert-quote::before{content:"\201C";color:var(--ember);font-weight:900;margin-right:2px}
.expert-card .expert-quote::after{content:"\201D";color:var(--ember);font-weight:900;margin-left:2px}
.expert-card .expert-support{
  font-size:.95rem;line-height:1.5;color:var(--ink-soft);
  background:var(--gold-soft);border-radius:10px;padding:10px 12px;margin:0;
}
.expert-card .expert-support-cite{
  font-size:.8rem;color:var(--muted);font-style:italic;margin:-6px 0 0;
}
.expert-source{display:flex;flex-direction:column;gap:6px;border-top:2px solid var(--line);padding-top:14px}
.expert-source .src-cite{font-size:.85rem;color:var(--muted);line-height:1.5}
.expert-source a{font-weight:700;font-size:.92rem;color:var(--green-700)}
.cite-pending{font-size:.85rem;color:var(--ember-text);font-weight:700}

/* ---------- hero stat card (NerdWallet, always first) ---------- */
.expert-hero{
  grid-column:1/-1;
  background:linear-gradient(180deg,#fff,var(--gold-soft));
  display:grid;grid-template-columns:minmax(240px,.9fr) 1.4fr;gap:8px 34px;align-items:center;
  padding:34px 38px;
}
.expert-hero .expert-outlet{grid-column:1/-1;text-align:center;font-size:2rem}
.expert-hero .hero-stat{text-align:center}
.expert-hero .hero-stat .stat-num{
  font-family:var(--font-display);font-weight:900;color:var(--green-700);
  font-size:clamp(3.2rem,8vw,5.5rem);line-height:1;letter-spacing:-.02em;
}
.expert-hero .hero-stat .stat-label{
  font-weight:600;font-size:.9rem;color:var(--ink-soft);margin-top:10px;line-height:1.5;
}
.expert-hero .expert-quote{font-size:clamp(1.15rem,2.4vw,1.45rem)}

/* ---------- footer: CTA + disclaimer ---------- */
.experts-foot{text-align:center;margin-top:36px}
.experts-foot .experts-cta-line{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.2rem,3vw,1.6rem);color:var(--ink);margin-bottom:14px;
}
.experts-foot .btn{margin-bottom:14px}
.expert-disclaimer{
  font-size:.82rem;color:var(--muted);max-width:640px;margin:0 auto;line-height:1.55;
}

/* ---------- compact variant (consult page) ---------- */
.experts-compact{background:var(--cream);padding:48px 0}
.experts-compact .experts-head{margin-bottom:24px}
.experts-compact .experts-head h2{font-size:clamp(1.5rem,3.6vw,2rem)}
.expert-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,320px);
  gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 18px;
  scrollbar-width:thin}
.expert-strip .expert-card{scroll-snap-align:start;padding:20px 18px}
.expert-strip .expert-card .expert-outlet{font-size:1.3rem}
.expert-strip .expert-quote{font-size:.98rem}
.expert-strip .expert-hero{grid-column:auto;background:linear-gradient(180deg,#fff,var(--gold-soft))}
.expert-strip .expert-hero .hero-stat .stat-num{font-size:2.6rem}
.experts-compact .experts-foot{margin-top:8px}

/* ---------- in-results variant (inside the score report, before the licensed-adjuster step) ---------- */
.experts-results{background:transparent;padding:34px 0 4px}
.experts-results .experts-head{margin-bottom:24px}
.experts-results .expert-grid{grid-template-columns:repeat(2,1fr)}
@media (max-width:899px){
  .experts-results .expert-grid{margin:0 -18px;padding-left:18px;padding-right:18px}
}

/* ---------- mobile: horizontal carousel (full variant) ---------- */
.expert-nav{display:none}
@media (max-width:899px){
  .experts{padding:56px 0}
  .expert-grid{
    display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
    gap:16px;margin:0 -22px;padding:4px 22px 22px;
    scrollbar-width:none;
  }
  .expert-grid::-webkit-scrollbar{display:none}
  .expert-grid .expert-card{flex:0 0 80vw;max-width:380px;scroll-snap-align:center}
  .expert-grid .expert-hero{flex-basis:86vw;grid-column:auto;
    grid-template-columns:1fr;padding:28px 24px;text-align:center}
  .expert-grid .expert-hero .expert-quote{text-align:left}
  .expert-nav{display:flex;justify-content:center;gap:12px;margin-top:2px}
  .expert-nav button{
    width:48px;height:48px;border-radius:50%;border:2.5px solid var(--ink);
    background:#fff;box-shadow:var(--sticker);font-size:1.3rem;font-weight:800;
    color:var(--green-900);cursor:pointer;line-height:1;
  }
  .expert-nav button:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(11,31,20,.92)}
  .expert-swipe-hint{text-align:center;font-size:.85rem;color:var(--muted);margin-top:10px}
}
@media (min-width:900px){.expert-swipe-hint{display:none}}

/* ---------- rotating ticker (optional, near hero) ---------- */
.experts-ticker{
  display:flex;align-items:center;justify-content:center;gap:12px;
  padding:10px 18px;background:var(--ink);color:#fff;
  font-size:.85rem;overflow:hidden;white-space:nowrap;
}
.experts-ticker .ticker-label{
  font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:var(--gold);flex-shrink:0;
}
.experts-ticker .ticker-names{
  font-weight:600;letter-spacing:.04em;opacity:.92;
  animation:ticker-scroll 24s linear infinite;
}
@keyframes ticker-scroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
@media (max-width:640px){
  .experts-ticker{font-size:.78rem;padding:8px 12px}
}

/* Mobile: stack expert cards vertically instead of horizontal scroll */
@media(max-width:560px){
  .expert-strip{
    grid-auto-flow:row;
    grid-auto-columns:unset;
    grid-template-columns:1fr;
    overflow-x:visible;
  }
  .expert-strip .expert-card{
    min-width:0;
  }
}
