/* Highlight Reel audience pages on trophycentral.com (coaches, teachers, organizers, volunteers, parties). */
.hra{--c:#312D2D;--soft:#f6f6f6;max-width:1000px;margin:0 auto;color:#312D2D;font-family:inherit;line-height:1.6}
.hra a{color:inherit}
.hra-top{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 18px}
.hra-top a{font-size:.9em;font-weight:700;text-decoration:none !important;padding:6px 14px;border-radius:30px;border:2px solid #eee;background:#fff}
.hra-top a.on{background:var(--c);border-color:var(--c);color:#fff !important}
.hra-hero{position:relative;overflow:hidden;text-align:center;padding:48px 24px 40px;border-radius:24px;background:var(--soft);
  background-image:radial-gradient(circle at 8% 20%,rgba(248,222,130,.9) 0 7px,transparent 8px),radial-gradient(circle at 92% 30%,var(--c) 0 6px,transparent 7px),radial-gradient(circle at 15% 85%,var(--c) 0 5px,transparent 6px),radial-gradient(circle at 85% 80%,rgba(248,222,130,.9) 0 9px,transparent 10px),radial-gradient(circle at 50% 8%,var(--c) 0 4px,transparent 5px),radial-gradient(circle at 70% 92%,#fff 0 7px,transparent 8px)}
.hra-sticker{display:inline-block;background:#fff;border:3px solid var(--c);color:var(--c);font-weight:800;padding:6px 16px;border-radius:30px;transform:rotate(-2.5deg);box-shadow:3px 3px 0 var(--c);font-size:.95em}
.hra-emoji{font-size:3.4em;line-height:1;display:block;margin:16px 0 4px}
.hra-hero h2{font-size:2.5em;line-height:1.12;margin:8px auto 14px;max-width:760px;color:#312D2D}
.hra-hero p.sub{font-size:1.15em;color:#4a4545;max-width:720px;margin:0 auto 24px}
.hra-btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.hra-btn{display:inline-block;background:#F8DE82;color:#312D2D !important;font-weight:800;padding:13px 28px;border-radius:30px;text-decoration:none !important;border:3px solid #312D2D;box-shadow:4px 4px 0 #312D2D;transition:transform .12s,box-shadow .12s}
.hra-btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 #312D2D}
.hra-btn.alt{background:#fff}
.hra-free{margin:18px 0 0;font-size:.95em;color:#555}
.hra-free b{color:var(--c)}
.hra-sec{margin:56px 0}
.hra-sec h3{font-size:1.8em;text-align:center;margin:0 0 8px;line-height:1.2}
.hra-lead{text-align:center;color:#666;max-width:640px;margin:0 auto 26px}
.hra-pains{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.hra-pain{background:#fff;border:2px dashed #ddd;border-radius:18px;padding:22px;transform:rotate(-1deg)}
.hra-pain:nth-child(2){transform:rotate(1.2deg)}
.hra-pain:nth-child(3){transform:rotate(-.6deg)}
.hra-pain .e{font-size:2.2em;line-height:1}
.hra-pain h4{margin:10px 0 6px;font-size:1.12em}
.hra-pain p{margin:0;color:#666}
.hra-fix{text-align:center;font-size:1.3em;font-weight:800;margin:26px 0 0}
.hra-fix span{background:linear-gradient(transparent 60%,#F8DE82 60%)}
.hra-steps{counter-reset:s;display:grid;gap:14px;max-width:760px;margin:0 auto}
.hra-step{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:start;background:#fff;border-radius:16px;padding:18px 20px;border-left:6px solid var(--c);box-shadow:0 4px 14px rgba(49,45,45,.06)}
.hra-step b{display:inline-block;background:var(--c);color:#fff;border-radius:10px;padding:4px 10px;font-size:.88em;text-align:center}
.hra-step p{margin:0;color:#444}
@media (max-width:600px){.hra-step{grid-template-columns:1fr;gap:8px}.hra-hero h2{font-size:1.9em}}
.hra-feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.hra-feat{background:#fff;border:1px solid #eee;border-radius:18px;padding:20px 22px;box-shadow:0 4px 14px rgba(49,45,45,.05);transition:transform .15s}
.hra-feat:hover{transform:translateY(-3px) rotate(-.5deg)}
.hra-feat .e{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:16px;background:var(--soft);font-size:1.7em}
.hra-feat h4{margin:12px 0 4px;font-size:1.08em}
.hra-feat p{margin:0;color:#666;font-size:.97em}
.hra-demo{background:#312D2D;color:#fff;border-radius:24px;padding:34px 26px}
.hra-demo h3{color:#F8DE82}
.hra-demo .hra-lead{color:#ddd}
.hra-demo .hra-btns .hra-btn{box-shadow:4px 4px 0 #F8DE82;border-color:#F8DE82}
.hra-demo .hra-btns .hra-btn.alt{background:transparent;color:#fff !important}
.hra-frame{background:#fff;border-radius:16px;padding:10px;margin-top:22px}
.hra-faq details{background:#fff;border:1px solid #eee;border-radius:14px;padding:14px 18px;margin:0 auto 10px;max-width:780px}
.hra-faq summary{font-weight:800;cursor:pointer}
.hra-faq details p{margin:10px 0 0;color:#555}
.hra-cta{text-align:center;background:var(--soft);border-radius:24px;padding:38px 22px}
.hra-cta h3{margin-bottom:6px}
.hra-more{text-align:center;margin:30px 0 0;color:#666}
.hra-more a{font-weight:800;margin:0 8px;display:inline-block}
.hra-fine{text-align:center;color:#888;font-size:.85em;margin-top:22px}