/* Reels grid. Scoped to .hawb-reels so the theme is untouched. */
.hawb-reels{--reel-pink:#F12F79;--reel-dark:#1F1B1C;--reel-line:#EFE1E7;
  max-width:1180px;margin:0 auto;padding:8px 0 4px;box-sizing:border-box;
  font-family:inherit;color:inherit}
.hawb-reels *,.hawb-reels *::before,.hawb-reels *::after{box-sizing:border-box}
.hawb-reels-home{padding:56px 20px;background:#fff}
.hawb-reels-head{text-align:center;max-width:720px;margin:0 auto 26px}
.hawb-reels-head h2{margin:0 0 8px;font-size:clamp(26px,5vw,40px);line-height:1.1}
.hawb-reels-head p{margin:0;opacity:.75;font-size:16px}
.hawb-reels-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:26px 20px}
.hawb-reel{margin:0;min-width:0;flex:0 1 240px;max-width:300px}
.hawb-reel h3{margin:14px 0 4px;font-size:17px;line-height:1.25}
.hawb-reel p{margin:0;font-size:14.5px;line-height:1.5;opacity:.78}
.hawb-reel-yt{display:inline-block;margin-top:8px;font-size:13.5px;font-weight:700;color:var(--reel-pink);text-decoration:none}
.hawb-reel-yt:hover{text-decoration:underline}
.hawb-reel-play{display:block;position:relative;width:100%;aspect-ratio:9/16;padding:0;border:0;border-radius:18px;overflow:hidden;
  background:var(--reel-dark);cursor:pointer;box-shadow:0 18px 32px -22px rgba(31,27,28,.65);transition:transform .2s ease,box-shadow .2s ease}
.hawb-reel-play:hover{transform:translateY(-3px);box-shadow:0 24px 40px -22px rgba(31,27,28,.7)}
.hawb-reel-play:focus-visible{outline:3px solid var(--reel-pink);outline-offset:3px}
.hawb-reel-play img{width:100%;height:100%;object-fit:cover;display:block}
.hawb-reel-blank{display:block;width:100%;height:100%;background:linear-gradient(160deg,#2a2426,#140f11)}
.hawb-reel-btn{position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;
  background:var(--reel-pink);display:grid;place-items:center;box-shadow:0 10px 24px -8px rgba(0,0,0,.55);transition:transform .2s ease}
.hawb-reel-play:hover .hawb-reel-btn{transform:scale(1.08)}
.hawb-reel-btn svg{width:26px;height:26px;fill:#fff;margin-left:3px}
.hawb-reel-frame{position:relative;width:100%;aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:#000}
.hawb-reel-frame iframe,.hawb-reel-frame video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.hawb-reels-more{text-align:center;margin:30px 0 0}
.hawb-reels-more a{display:inline-block;padding:14px 30px;border-radius:999px;background:var(--reel-pink);color:#fff;
  font-weight:700;text-decoration:none;letter-spacing:.04em}
.hawb-reels-more a:hover{filter:brightness(.93);color:#fff}
@media (max-width:600px){
  .hawb-reels-grid{gap:20px 14px}
  .hawb-reel{flex:0 1 150px}
  .hawb-reel h3{font-size:15px}
  .hawb-reel p{font-size:13.5px}
  .hawb-reel-btn{width:52px;height:52px;margin:-26px 0 0 -26px}
  .hawb-reels-home{padding:40px 16px}
}
@media (prefers-reduced-motion:reduce){
  .hawb-reel-play,.hawb-reel-btn{transition:none}
}
.hawb-reels-tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 22px}
.hawb-reels-tabs button{padding:9px 18px;border-radius:999px;border:1.5px solid var(--reel-line);background:#fff;
  font:inherit;font-weight:700;font-size:14px;color:inherit;cursor:pointer;transition:all .18s ease}
.hawb-reels-tabs button:hover{border-color:var(--reel-pink)}
.hawb-reels-tabs button.is-on{background:var(--reel-dark);border-color:var(--reel-dark);color:#fff}
.hawb-reel.is-hidden{display:none}

/* Clean page chrome (used by the reels page so it never relies on homepage-only styling) */
body.hawb-clean{margin:0;background:#fff;color:#1F1B1C;
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.hawb-ch{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;border-bottom:1px solid #F2DEE7;background:#fff}
.hawb-ch-logo img{display:block;width:104px;height:auto}
.hawb-ch-nav{display:flex;align-items:center;gap:18px}
.hawb-ch-nav a{color:#1F1B1C;text-decoration:none;font-weight:700;font-size:15px}
.hawb-ch-nav a:hover{color:#F12F79}
.hawb-ch-cta{background:#F12F79;color:#fff!important;padding:11px 20px;border-radius:999px;white-space:nowrap}
.hawb-ch-cta:hover{filter:brightness(.93)}
.hawb-ch-main{max-width:1180px;margin:0 auto;padding:34px 20px 56px}
.hawb-ch-title{margin:0 0 22px;text-align:center;font-size:clamp(30px,6vw,46px);line-height:1.1}
.hawb-ch-foot{background:#1F1B1C;color:#EADFE2;text-align:center;padding:38px 20px 30px}
.hawb-ch-foot img{display:inline-block;width:120px;height:auto}
.hawb-ch-links{margin:16px 0 10px;display:flex;flex-wrap:wrap;gap:18px;justify-content:center}
.hawb-ch-links a{color:#fff;text-decoration:none;font-weight:700;font-size:14.5px}
.hawb-ch-links a:hover{color:#F12F79}
.hawb-ch-copy{margin:0;font-size:12.5px;opacity:.7}
@media (max-width:520px){
  .hawb-ch{padding:12px 14px}
  .hawb-ch-logo img{width:86px}
  .hawb-ch-nav{gap:12px}
  .hawb-ch-nav a{font-size:14px}
  .hawb-ch-cta{padding:10px 16px}
  .hawb-ch-main{padding:26px 14px 44px}
}

/* Inside the copied header/footer, headings keep the colour their own stylesheet gives them
   (WordPress block styles otherwise force them dark on plugin pages). */
.hawb-has-chrome header h1,.hawb-has-chrome header h2,.hawb-has-chrome header h3,
.hawb-has-chrome header h4,.hawb-has-chrome header h5,.hawb-has-chrome header h6,
.hawb-has-chrome footer h1,.hawb-has-chrome footer h2,.hawb-has-chrome footer h3,
.hawb-has-chrome footer h4,.hawb-has-chrome footer h5,.hawb-has-chrome footer h6{color:inherit}
