/* ============================================================
   EightySix Digital — shared trade-page components (plumbers etc.)
   Loaded alongside the parent service CSS (digital-marketing.css,
   web-design.css, seo.css, google-ads.css). Tokens from styles.css.
   ============================================================ */

/* small sub-label on channel/card names (e.g. "AI answers") */
.dm-ch-name-sub{font-weight:500;font-size:.8rem;color:#9a9aa3;text-transform:uppercase;letter-spacing:.04em}

/* self-contained kicker + h2 so trade bands work under any parent theme */
.pl-kicker{display:inline-block;font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;color:var(--volt);margin-bottom:14px}
.pl-h2{font-family:var(--display);font-weight:600;line-height:1.04;letter-spacing:-.02em;font-size:clamp(2rem,4.4vw,3.4rem)}

/* ============================================================
   FROM A PLUMBER, FOR PLUMBERS (dark E-E-A-T band)
   ============================================================ */
.pl-stu{background:var(--ink);padding:clamp(80px,11vw,140px) 0}
.pl-stu-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:54px;align-items:center}
.pl-stu-photo{display:flex;justify-content:center}
.pl-stu-frame{position:relative;width:100%;max-width:400px;border-radius:22px;overflow:hidden;border:1px solid var(--line);box-shadow:0 50px 90px -42px rgba(0,0,0,.8)}
.pl-stu-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(10,10,11,.82));pointer-events:none}
.pl-stu-frame img{display:block;width:100%;height:auto;aspect-ratio:5/6;object-fit:cover}
.pl-stu-badge{position:absolute;left:20px;bottom:18px;z-index:1;display:flex;flex-direction:column;gap:2px}
.pl-stu-badge strong{font-family:var(--display);font-weight:700;font-size:1.2rem;color:#fff}
.pl-stu-badge span{font-size:.84rem;color:#cfcfd6}
.pl-stu-copy .pl-h2{margin-bottom:18px}
.pl-stu-copy p{color:#cfcfd6;font-size:clamp(1.02rem,1.4vw,1.15rem);line-height:1.65;margin-bottom:16px}
.pl-stu-copy p:last-child{margin-bottom:0}

/* ============================================================
   RESULTS BAND (orange)
   ============================================================ */
.pl-stats{background:linear-gradient(135deg,var(--volt),#c2530f);color:#fff;padding:clamp(60px,9vw,100px) 0;text-align:center}
.pl-stats-head{margin-bottom:42px}
.pl-stats-kicker{display:inline-block;font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:.8rem;color:rgba(255,255,255,.85);margin-bottom:12px}
.pl-stats-h2{font-family:var(--display);font-weight:700;line-height:1.04;letter-spacing:-.02em;font-size:clamp(1.9rem,4.2vw,3rem);color:#fff}
.pl-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.pl-stat strong{display:block;font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,5.2vw,3.6rem);line-height:1;letter-spacing:-.03em;color:#fff;margin-bottom:6px}
.pl-stat span{font-size:.94rem;color:rgba(255,255,255,.9);font-weight:500;line-height:1.35;display:block;max-width:22ch;margin:0 auto}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:980px){
  .pl-stu-grid{grid-template-columns:1fr;gap:40px}
  .pl-stu-photo{order:-1}
  .pl-stu-frame{max-width:340px}
  .pl-stats-grid{grid-template-columns:1fr 1fr;gap:34px 20px}
}
@media(max-width:560px){
  .pl-stats-grid{grid-template-columns:1fr 1fr;gap:28px 16px}
}
