a/* ============ HAPEI COMPONENTS ============ */

/* Header */
.hp-site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--hp-line)}
.hp-site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:.65rem}
.hp-brand__text{display:flex;align-items:center;gap:.55rem;font-family:var(--hp-display);font-weight:800;font-size:1.3rem;color:var(--hp-red);text-decoration:none;min-width:0}
.hp-brand__mark{color:var(--hp-flame);font-size:1.4rem;flex:0 0 auto}
.hp-brand img{max-height:44px;width:auto;display:block}

/* Logo with site title + tagline stacked underneath, sized per breakpoint.
   Both lines truncate with an ellipsis rather than wrap or overflow, so an
   unusually long site title never unbalances the row against the nav and
   header actions sharing the same line. */
.hp-brand{display:flex;align-items:center;gap:.65rem;min-width:0;flex:0 1 auto;overflow:hidden}
.hp-brand__meta{display:flex;flex-direction:column;justify-content:center;gap:.05rem;min-width:0;line-height:1.2}
.hp-brand__title{font-family:var(--hp-display);font-weight:700;font-size:.86rem;color:var(--hp-ink);letter-spacing:-.005em;
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52vw}
.hp-brand__tagline{font-family:var(--hp-body);font-weight:500;font-size:.7rem;color:var(--hp-slate);
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52vw}
@media(min-width:900px){
	.hp-brand img{max-height:46px}
	.hp-brand__title{font-size:.98rem;max-width:17rem}
	.hp-brand__tagline{font-size:.76rem;max-width:17rem}
}
@media(min-width:1200px){
	.hp-brand img{max-height:50px}
	.hp-brand__title{font-size:1.05rem;max-width:23rem}
	.hp-brand__tagline{font-size:.8rem;max-width:23rem}
}
@media(max-width:479px){
	.hp-brand img{max-height:34px}
	.hp-brand__title{font-size:.76rem;max-width:46vw}
	.hp-brand__tagline{font-size:.62rem;max-width:46vw}
}
.hp-nav__list{display:flex;gap:1.6rem;list-style:none;margin:0;padding:0}
.hp-nav__list a{font-family:var(--hp-display);font-weight:500;color:var(--hp-ink);text-decoration:none;font-size:1rem}
.hp-nav__list a:hover{color:var(--hp-red)}
.hp-header-actions{display:flex;align-items:center;gap:.8rem}
.hp-burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:.4rem}
.hp-burger span{width:26px;height:2px;background:var(--hp-ink);display:block;transition:.3s}
.hp-mobile{display:none;border-top:1px solid var(--hp-line);background:#fff}
.hp-mobile__list{list-style:none;margin:0;padding:1rem var(--hp-pad)}
.hp-mobile__list a{display:block;padding:.7rem 0;font-family:var(--hp-display);font-weight:500;color:var(--hp-ink);border-bottom:1px solid var(--hp-line);text-decoration:none}
@media(max-width:900px){
  .hp-nav{display:none}
  .hp-header-actions .hp-btn{display:none}
  .hp-burger{display:flex}
  .hp-mobile[data-open="1"]{display:block}
}

/* Hero */
/* hero base styles moved to the redesigned block at end of file */

/* Sections */
.hp-section--mist{background:var(--hp-mist)}
.hp-section-head{max-width:640px;margin-bottom:2.5rem}
.hp-section-more{margin-top:2rem}
.hp-section-head h2{margin:0}

/* Focus areas */
.hp-focus__item{background:#fff;border:1px solid var(--hp-line);border-radius:var(--hp-radius);padding:1.6rem;transition:.28s}
.hp-focus__item:hover{border-color:var(--hp-red);box-shadow:var(--hp-shadow);transform:translateY(-4px)}
.hp-focus__num{font-family:var(--hp-display);font-weight:800;font-size:1.1rem;color:var(--hp-flame);display:block;margin-bottom:.6rem}
.hp-focus__item h3{font-size:1.15rem;margin:0 0 .5rem}
.hp-focus__item p{font-size:.95rem;color:var(--hp-slate);margin:0}

/* Cards */
.hp-card__ph{width:100%;height:100%;background:linear-gradient(135deg,var(--hp-mist),#fff)}
.hp-card{text-decoration:none;color:inherit}
.hp-card:hover{text-decoration:none}
.hp-card__body p{font-size:.95rem;color:var(--hp-slate);margin:0}
.hp-empty{color:var(--hp-slate);font-style:italic}

/* Story feature */
.hp-story-feature__inner{display:grid;gap:2.5rem;align-items:center}
@media(min-width:860px){.hp-story-feature__inner{grid-template-columns:1fr 1fr}}
.hp-story-feature__media img{border-radius:var(--hp-radius);width:100%;object-fit:cover}
.hp-story-feature blockquote{border-left:3px solid var(--hp-flame);padding-left:1.2rem;margin:1.4rem 0;font-size:var(--hp-step-1);font-family:var(--hp-display);color:var(--hp-ink)}
.hp-story-feature cite{display:block;font-size:1rem;color:var(--hp-slate);margin-top:.6rem;font-style:normal}

/* Single hero (program) */
.hp-phero{position:relative;background:var(--hp-deep);color:#fff}
.hp-phero__media{position:absolute;inset:0;opacity:.28}
.hp-phero__media img{width:100%;height:100%;object-fit:cover}
.hp-phero__inner{position:relative;padding-block:clamp(3.5rem,9vw,7rem)}
.hp-phero__inner h1{margin:.4rem 0}
.hp-phero__sub{font-size:var(--hp-step-1);max-width:640px;opacity:.95}
.hp-phero .hp-tag{background:rgba(255,255,255,.16);color:#fff}

/* Single layout */
.hp-single__layout{display:grid;gap:3rem;padding-block:var(--hp-section)}
@media(min-width:900px){.hp-single__layout{grid-template-columns:1fr 340px}}
.hp-prose{font-size:var(--hp-step-0);line-height:1.75}
.hp-prose--wide{max-width:760px}
.hp-prose h2{margin-top:1.8em}
.hp-prose img{border-radius:var(--hp-radius);margin:1.5rem 0}
.hp-block{margin-top:2.5rem;padding-top:2.5rem;border-top:1px solid var(--hp-line)}
.hp-lead{font-size:var(--hp-step-1);color:var(--hp-ink)}
.hp-timeline{list-style:none;padding:0;margin:1rem 0;display:grid;gap:.6rem}
.hp-timeline li{padding-left:1.4rem;position:relative}
.hp-timeline li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--hp-flame)}

/* Stats */
.hp-stats{display:flex;flex-wrap:wrap;gap:2rem;margin-top:1.5rem}
.hp-stat{display:flex;flex-direction:column}
.hp-stat__num{font-family:var(--hp-display);font-weight:800;font-size:var(--hp-step-3);color:var(--hp-red);line-height:1}
.hp-stat__label{font-size:.9rem;color:var(--hp-slate);text-transform:uppercase;letter-spacing:.08em}

/* Aside cards */
.hp-aside-card{background:#fff;border:1px solid var(--hp-line);border-radius:var(--hp-radius);padding:1.5rem;margin-bottom:1.2rem}
.hp-aside-card h3{font-size:1.15rem;margin:0 0 1rem}
.hp-aside-card p{font-size:.95rem;margin:0 0 1rem}
.hp-aside-card--cta{background:linear-gradient(140deg,var(--hp-red),var(--hp-deep));color:#fff;border:0}
.hp-aside-card--cta h3{color:#fff}
.hp-aside-note{opacity:.9;margin-top:1rem!important}

/* Event hero */
.hp-ehero{position:relative;background:var(--hp-ink);color:#fff;min-height:340px;display:flex;align-items:flex-end}
.hp-ehero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.4}
.hp-ehero__inner{position:relative;padding-block:3rem;width:100%}
.hp-ehero__facts{list-style:none;display:flex;flex-wrap:wrap;gap:1.5rem;padding:0;margin:1rem 0 1.4rem;font-family:var(--hp-display);font-weight:500}
.hp-ehero .hp-tag{background:rgba(255,255,255,.18);color:#fff}

/* Job / volunteer hero */
.hp-jhero{background:var(--hp-mist);border-bottom:1px solid var(--hp-line);padding-block:2.5rem}
.hp-jhero--warm{background:linear-gradient(140deg,var(--hp-flame),var(--hp-red));color:#fff}
.hp-jhero h1{margin:.4rem 0}
.hp-jhero__facts{list-style:none;display:flex;flex-wrap:wrap;gap:.7rem;padding:0;margin:1rem 0 0}
.hp-jhero__facts li{background:#fff;color:var(--hp-ink);border-radius:100px;padding:.35rem .9rem;font-size:.85rem;font-family:var(--hp-display);font-weight:500}
.hp-jhero--warm .hp-jhero__facts li{background:rgba(255,255,255,.2);color:#fff}
.hp-back{font-family:var(--hp-display);font-weight:500;text-decoration:none;font-size:.9rem;display:inline-block;margin-bottom:.6rem}
.hp-jhero--warm .hp-back{color:#fff}

/* Person profile */
.hp-person{display:grid;gap:2.5rem;padding-block:var(--hp-section)}
@media(min-width:820px){.hp-person{grid-template-columns:320px 1fr;align-items:start}}
.hp-person__portrait img,.hp-person__ph{border-radius:var(--hp-radius);width:100%;aspect-ratio:4/5;object-fit:cover}
.hp-person__ph{background:linear-gradient(135deg,var(--hp-mist),#fff)}
.hp-person__role{font-family:var(--hp-display);font-weight:600;color:var(--hp-red);font-size:var(--hp-step-1);margin:.3rem 0 1.2rem}
.hp-person__links{display:flex;gap:1.2rem;margin-top:1.5rem}
.hp-person__links a{font-family:var(--hp-display);font-weight:500}

/* CTA band */
.hp-cta-band{text-align:center;background:var(--hp-mist);border-radius:var(--hp-radius);padding:3rem}
.hp-cta-band h2{margin-bottom:1.4rem}

/* Archive / page hero */
.hp-archive-hero,.hp-page-hero{background:linear-gradient(140deg,var(--hp-red),var(--hp-deep));color:#fff;padding-block:clamp(3rem,7vw,5.5rem)}
.hp-page-hero--flame{background:linear-gradient(140deg,var(--hp-flame),var(--hp-red))}
.hp-archive-hero h1,.hp-page-hero h1{margin:.3rem 0}
.hp-archive-hero p,.hp-page-hero p{max-width:620px;opacity:.95}

/* Values */
.hp-values{display:flex;flex-wrap:wrap;gap:.8rem}
.hp-value{font-family:var(--hp-display);font-weight:600;background:#fff;border:1px solid var(--hp-line);border-radius:100px;padding:.6rem 1.3rem;color:var(--hp-red)}

/* Get involved */
.hp-involve__card{background:#fff;border:1px solid var(--hp-line);border-radius:var(--hp-radius);padding:1.6rem;display:flex;flex-direction:column;gap:.8rem}
.hp-involve__card h3{margin:0}
.hp-involve__card p{font-size:.95rem;color:var(--hp-slate);flex:1}
.hp-involve__card .hp-btn{align-self:flex-start}
.hp-involve__card--donate{background:linear-gradient(140deg,var(--hp-red),var(--hp-deep));color:#fff}
.hp-involve__card--donate h3,.hp-involve__card--donate p{color:#fff}
.hp-donate{background:#fff;border:1px solid var(--hp-line);border-radius:var(--hp-radius);padding:clamp(2rem,5vw,3.5rem)}

/* Contact */
.hp-contact{display:grid;gap:3rem}
@media(min-width:820px){.hp-contact{grid-template-columns:1.4fr 1fr}}
.hp-contact label{display:block;font-family:var(--hp-display);font-weight:500;margin-bottom:1rem}
.hp-contact input,.hp-contact textarea,.hp-auth input{width:100%;margin-top:.4rem;padding:.85rem 1rem;border:1px solid var(--hp-line);border-radius:10px;font-family:var(--hp-body);font-size:1rem;background:#fff}
.hp-contact input:focus,.hp-contact textarea:focus{outline:none;border-color:var(--hp-red)}
.hp-contact__details h3{margin-top:0}
.hp-contact__details p{font-size:.95rem}

/* Notes */
.hp-note{padding:1rem 1.2rem;border-radius:10px;background:var(--hp-mist);margin-bottom:1.2rem}
.hp-note--ok{background:#e9f7ee;color:#1e6b3a}
.hp-note--error{background:#fdeaea;color:var(--hp-deep)}

/* Auth + member */
.hp-auth{max-width:420px;margin:3rem auto;padding:2rem;border:1px solid var(--hp-line);border-radius:var(--hp-radius)}
.hp-auth label{display:block;font-family:var(--hp-display);font-weight:500;margin-bottom:1rem}
.hp-auth__reset{display:inline-block;margin-left:1rem;font-size:.9rem}
.hp-member{max-width:820px;margin-inline:auto;padding-block:var(--hp-section)}
.hp-member__head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}
.hp-member__card{background:#fff;border:1px solid var(--hp-line);border-radius:var(--hp-radius);padding:1.6rem;margin-bottom:1.2rem}
.hp-member__card h2{font-size:1.3rem;margin:0 0 .6rem}

/* Footer */
.hp-site-footer{background:var(--hp-ink);color:#fff;padding-top:0}
.hp-footer-cta{background:linear-gradient(140deg,var(--hp-red),var(--hp-deep));border-radius:var(--hp-radius);padding:clamp(2.2rem,5vw,3.5rem);margin-top:-3rem;position:relative;z-index:2;margin-bottom:3.5rem}
.hp-footer-cta h2{margin:.3rem 0}
.hp-footer-cta p{max-width:560px;opacity:.95}
.hp-footer-grid--top{
    padding-top: 3.5rem;
}
.hp-footer-grid{display:grid;gap:2rem;padding-bottom:2.5rem}
@media(min-width:760px){.hp-footer-grid{grid-template-columns:repeat(4,1fr)}}
.hp-footer-col__title{font-size:1.05rem;margin:0 0 1rem;color:#fff}
.hp-footer-col p{font-size:.92rem;opacity:.8;margin:0}
.hp-footer-menu{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.hp-footer-menu a,.hp-social a{color:#fff;opacity:.82;text-decoration:none;font-size:.92rem}
.hp-footer-menu a:hover,.hp-social a:hover{opacity:1;color:var(--hp-flame)}
.hp-social{display:grid;gap:.5rem}
.hp-footer-legal{border-top:1px solid rgba(255,255,255,.14);padding-block:1.6rem;font-size:.85rem;opacity:.7}

/* Pagination + 404 */
.hp-pagination{margin-top:3rem}
.hp-pagination .page-numbers{display:inline-block;padding:.5rem .9rem;border:1px solid var(--hp-line);border-radius:8px;margin:.2rem;text-decoration:none;font-family:var(--hp-display)}
.hp-pagination .current{background:var(--hp-red);color:#fff;border-color:var(--hp-red)}
.hp-404{text-align:center}
.hp-404 h1{margin:.4rem 0 1rem}

/* ---------------------------------------------------------------------------
   Phase 2: media hero, donations, applications
--------------------------------------------------------------------------- */

/* Hero with photo / video / youtube background */
.hp-hero--media{background:var(--hp-deep)}
.hp-hero__bg{position:absolute;inset:0;overflow:hidden;z-index:0}
.hp-hero__img,.hp-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hp-hero__video{z-index:1}
.hp-hero--has-video .hp-hero__img{z-index:0}
.hp-hero__yt{position:absolute;top:50%;left:50%;width:100vw;height:56.25vw;min-height:100%;min-width:177.77vh;transform:translate(-50%,-50%);z-index:1;pointer-events:none}
.hp-hero__yt iframe{width:100%;height:100%;border:0}
.hp-hero__overlay{position:absolute;inset:0;z-index:2;background:linear-gradient(140deg,rgba(164,0,0,calc(.45 + var(--hp-hero-overlay,.55)*.4)),rgba(20,0,0,var(--hp-hero-overlay,.55)))}
.hp-hero--media .hp-hero__inner,.hp-hero--media .hp-heartline{position:relative;z-index:3}
.hp-hero--media .hp-hero__glow{z-index:2;opacity:.35}
.hp-eyebrow--light{color:#fff;opacity:.9}
.hp-btn--on-dark{color:#fff;border-color:rgba(255,255,255,.7)}
.hp-btn--on-dark:hover{background:#fff;color:var(--hp-red)}

/* Donation layout */
.hp-donate{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:start}
.hp-donate__body h2{margin-top:.2em}
.hp-donate__panel{background:var(--hp-mist);border:1px solid var(--hp-line);border-radius:var(--hp-radius);padding:clamp(1.4rem,3vw,2rem)}
@media(max-width:820px){.hp-donate{grid-template-columns:1fr}}

/* Forms shared */
.hp-field{margin-bottom:1rem;display:flex;flex-direction:column;gap:.35rem}
.hp-field label{font-weight:600;font-size:.92rem}
.hp-field input,.hp-field textarea,.hp-field select{padding:.7rem .8rem;border:1px solid var(--hp-line);border-radius:10px;font:inherit;background:#fff;width:100%}
.hp-field input:focus,.hp-field textarea:focus{outline:2px solid var(--hp-red);border-color:var(--hp-red)}
.hp-field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:600px){.hp-field-row{grid-template-columns:1fr}}

/* Donation form specifics */
.hp-donate-amounts{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.hp-amt{padding:.55rem .9rem;border:1px solid var(--hp-line);border-radius:999px;background:#fff;cursor:pointer;font:inherit;font-weight:600;transition:all .15s ease}
.hp-amt:hover{border-color:var(--hp-red)}
.hp-amt.is-on{background:var(--hp-red);color:#fff;border-color:var(--hp-red)}
.hp-gateways{display:flex;flex-direction:column;gap:.4rem}
.hp-gateway{display:flex;align-items:center;gap:.5rem;font-weight:500;background:#fff;border:1px solid var(--hp-line);border-radius:10px;padding:.6rem .8rem;cursor:pointer}
.hp-donate-submit{margin-top:.6rem;width:100%;justify-content:center}
.hp-donate-msg{margin:.7rem 0 0;font-size:.92rem;min-height:1.2em}
.hp-donate-msg.is-error{color:var(--hp-deep);font-weight:600}
.hp-donate-secure{margin:.8rem 0 0;font-size:.8rem;color:#777}

/* Application form */
.hp-apply-section{background:#fff}
.hp-apply-wrap{max-width:720px}
.hp-apply-form{background:var(--hp-mist);border:1px solid var(--hp-line);border-radius:var(--hp-radius);padding:clamp(1.5rem,4vw,2.5rem)}
.hp-apply-form h3{margin-top:0}
.hp-apply-form input[type=file]{padding:.5rem;background:#fff}

/* ---------------------------------------------------------------------------
   Phase 3: impact band, partners, thematic area extras
--------------------------------------------------------------------------- */

/* Impact statistics band */
.hp-impact-band{background:linear-gradient(140deg,var(--hp-red),var(--hp-deep));color:#fff}
.hp-section-head--light h2{color:#fff}
.hp-impact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;text-align:center}
.hp-impact{display:flex;flex-direction:column;gap:.35rem;padding:1rem 0}
.hp-impact__num{font-family:var(--hp-head);font-size:clamp(2rem,5vw,3.2rem);font-weight:800;line-height:1}
.hp-impact__label{font-size:.95rem;opacity:.92}
@media(max-width:820px){.hp-impact-grid{grid-template-columns:repeat(2,1fr)}}

/* Thematic focus: learn more link */
.hp-focus__more{display:inline-block;margin-top:.6rem;font-weight:600;color:var(--hp-red);text-decoration:none}
.hp-focus__more:hover{text-decoration:underline}

/* Partner logos strip */
.hp-partners__strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(1.5rem,4vw,3rem)}
.hp-partners__item{display:flex;align-items:center;justify-content:center;filter:grayscale(1);opacity:.75;transition:filter .2s ease,opacity .2s ease}
.hp-partners__item:hover{filter:grayscale(0);opacity:1}
.hp-partners__item img{max-height:64px;width:auto;object-fit:contain}
.hp-partners__name{font-weight:700;color:var(--hp-ink)}

/* ---------------------------------------------------------------------------
   Redesigned hero (left-aligned editorial split) + contrast fixes
--------------------------------------------------------------------------- */

/* Eyebrow on dark: recolour the leading bar too, so it is not red on red */
.hp-eyebrow--light{color:#fff;opacity:.95}
.hp-eyebrow--light::before{background:#fff}

/* Hero shell */
.hp-hero{position:relative;overflow:hidden;color:#fff;background:radial-gradient(120% 140% at 85% 10%,var(--hp-flame) 0%,var(--hp-red) 38%,var(--hp-deep) 100%);padding-block:clamp(2.3rem,4.7vw,4rem)}
.hp-hero__glow{position:absolute;inset:auto -8% -45% auto;width:52vw;height:52vw;background:radial-gradient(circle,rgba(255,120,80,.55),transparent 62%);filter:blur(38px);opacity:.5;z-index:0}

/* Split layout: text left, emblem right; left-aligned, not centered */
.hp-hero__inner{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(1.5rem,5vw,4rem);align-items:center}
.hp-hero__content{max-width:40rem;text-align:left}
.hp-hero__title{font-size:clamp(2rem,1.3rem + 2.2vw,3rem);line-height:1.08;letter-spacing:-.01em;margin:.3em 0 .4em;text-wrap:balance}
.hp-hero__lead{font-size:var(--hp-step-1);max-width:38rem;opacity:.96;font-family:var(--hp-body);line-height:1.5}
.hp-hero__cta{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1rem}

/* Emblem card on the right */
.hp-hero__aside{position:relative;z-index:3;display:flex;justify-content:center}
.hp-hero__emblem{width:min(24rem,80%);aspect-ratio:1/1;border-radius:28px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem;box-shadow:0 30px 60px -30px rgba(0,0,0,.55);transform:rotate(-2deg)}
.hp-hero__mark{width:clamp(6rem,14vw,9rem);height:auto}
.hp-hero__emblem-line{font-family:var(--hp-head);font-weight:700;font-size:1.15rem;letter-spacing:.01em;margin:0;text-align:center}
.hp-hero__chips{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.hp-hero__chips span{font-size:.78rem;padding:.3rem .7rem;border-radius:100px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);letter-spacing:.03em}
.hp-hero .hp-heartline{position:relative;z-index:3;margin-top:1.2rem;opacity:.9}

/* When a photo / video / youtube background is used: full-bleed, text bottom-left */
.hp-hero--media{background:var(--hp-deep)}
.hp-hero--media .hp-hero__inner{grid-template-columns:1fr;align-items:end;min-height:clamp(17rem,40vh,27rem)}
.hp-hero--media .hp-hero__content{max-width:44rem}
.hp-hero--media .hp-hero__aside{display:none}
.hp-hero--media .hp-hero__glow{opacity:.35}

@media(max-width:860px){
  .hp-hero__inner{grid-template-columns:1fr}
  .hp-hero__aside{display:none}
}

/* ---------------------------------------------------------------------------
   Contrast: eyebrows and links on dark / red backgrounds
--------------------------------------------------------------------------- */
.hp-hero .hp-eyebrow,
.hp-phero .hp-eyebrow,
.hp-page-hero .hp-eyebrow,
.hp-archive-hero .hp-eyebrow,
.hp-footer-cta .hp-eyebrow,
.hp-impact-band .hp-eyebrow,
.hp-aside-card--cta .hp-eyebrow,
.hp-cta-join .hp-eyebrow{color:#fff}
.hp-hero .hp-eyebrow::before,
.hp-phero .hp-eyebrow::before,
.hp-page-hero .hp-eyebrow::before,
.hp-archive-hero .hp-eyebrow::before,
.hp-footer-cta .hp-eyebrow::before,
.hp-impact-band .hp-eyebrow::before,
.hp-aside-card--cta .hp-eyebrow::before,
.hp-cta-join .hp-eyebrow::before{background:#fff}

/* ---------------------------------------------------------------------------
   Homepage: people cards, role list, join band
--------------------------------------------------------------------------- */

/* People (team + ambassadors) */
.hp-person-card{text-align:left}
.hp-person-card__media{display:block;aspect-ratio:4/5;border-radius:var(--hp-radius);overflow:hidden;background:linear-gradient(135deg,var(--hp-mist),#fff);margin-bottom:.8rem}
.hp-person-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.hp-person-card__media:hover img{transform:scale(1.04)}
.hp-person-card h3{margin:0 0 .15rem;font-size:1.1rem}
.hp-person-card h3 a{color:var(--hp-ink)}
.hp-person-card__role{margin:0;color:var(--hp-red);font-weight:600;font-size:.9rem}

/* Open roles list */
.hp-role-list{display:flex;flex-direction:column;gap:.7rem}
.hp-role{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.4rem;border:1px solid var(--hp-line);border-radius:14px;background:#fff;transition:border-color .2s ease,transform .2s ease}
.hp-role:hover{border-color:var(--hp-red);transform:translateX(4px)}
.hp-role__title{font-weight:700;color:var(--hp-ink);font-size:1.05rem;flex:1}
.hp-role__meta{display:flex;gap:.5rem;flex-wrap:wrap}
.hp-role__meta span{font-size:.8rem;color:#6b5a5a;background:var(--hp-mist);padding:.25rem .6rem;border-radius:100px}
.hp-role__go{color:var(--hp-red);font-size:1.2rem;font-weight:700}

/* Join the movement band */
.hp-cta-join{background:linear-gradient(140deg,var(--hp-red),var(--hp-deep));color:#fff}
.hp-cta-join__inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.hp-cta-join h2{color:#fff;margin:.2em 0 .3em}
.hp-cta-join p{opacity:.95;max-width:34rem;margin:0}
.hp-cta-join__actions{display:flex;gap:.8rem;flex-wrap:wrap}

/* Donation test-mode banner */
.hp-donate-testmode{background:#fff4d6;border:1px solid #e6c65a;color:#7a5a00;padding:.6rem .9rem;border-radius:10px;font-size:.9rem;margin:0 0 1rem}

/* ---------------------------------------------------------------------------
   Phase 5: gallery albums + lightbox
--------------------------------------------------------------------------- */
.hp-album-card{display:block;position:relative;border-radius:var(--hp-radius);overflow:hidden;background:var(--hp-mist);text-decoration:none}
.hp-album-card__media{display:block;aspect-ratio:4/3;overflow:hidden}
.hp-album-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.hp-album-card:hover .hp-album-card__media img{transform:scale(1.05)}
.hp-album-card__title{position:absolute;left:0;right:0;bottom:0;padding:1.2rem 1rem .9rem;color:#fff;font-family:var(--hp-head);font-weight:700;font-size:1.1rem;background:linear-gradient(transparent,rgba(20,0,0,.8))}
.hp-album-card__count{position:absolute;top:.7rem;right:.7rem;background:rgba(255,255,255,.9);color:var(--hp-ink);font-size:.72rem;font-weight:700;padding:.2rem .55rem;border-radius:100px}

.hp-lightbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.8rem;margin-top:1.5rem}
.hp-lightbox-item{padding:0;border:0;background:none;cursor:pointer;border-radius:12px;overflow:hidden;aspect-ratio:1/1}
.hp-lightbox-item img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.hp-lightbox-item:hover img{transform:scale(1.06)}
.hp-lightbox{position:fixed;inset:0;z-index:1000;background:rgba(10,0,0,.92);display:flex;align-items:center;justify-content:center;padding:2rem}
.hp-lightbox__img{max-width:92vw;max-height:88vh;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.hp-lightbox__close{position:absolute;top:1.2rem;right:1.5rem;background:none;border:0;color:#fff;font-size:2.4rem;line-height:1;cursor:pointer}

/* ===========================================================================
   Phase 6: section system, peace design pass, motion
   ======================================================================== */

:root{ --hp-soft:#FFF1ED; --hp-calm:#F1F4F6; --hp-olive:#5B7B5B; }

/* Smooth scroll (respecting reduced motion) */
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Section shells: backgrounds */
.hp-sec{position:relative}
.hp-sec--white{background:#fff}
.hp-sec--mist{background:var(--hp-mist)}
.hp-sec--soft{background:var(--hp-soft)}
.hp-sec--calm{background:var(--hp-calm)}
.hp-sec--dark{background:var(--hp-ink);color:#fff}
.hp-sec--brand{background:linear-gradient(140deg,var(--hp-red),var(--hp-deep));color:#fff}
.hp-sec--dark h2,.hp-sec--brand h2,.hp-sec--dark h3,.hp-sec--brand h3{color:#fff}
.hp-sec--dark p,.hp-sec--brand p{color:rgba(255,255,255,.92)}
.hp-sec--dark .hp-eyebrow,.hp-sec--brand .hp-eyebrow{color:#fff}
.hp-sec--dark .hp-eyebrow::before,.hp-sec--brand .hp-eyebrow::before{background:#fff}

/* Section shells: vertical spacing scale */
.hp-pt-none{padding-top:0}.hp-pb-none{padding-bottom:0}
.hp-pt-sm{padding-top:clamp(1.5rem,3vw,2.5rem)}.hp-pb-sm{padding-bottom:clamp(1.5rem,3vw,2.5rem)}
.hp-pt-md{padding-top:clamp(2.5rem,5vw,4rem)}.hp-pb-md{padding-bottom:clamp(2.5rem,5vw,4rem)}
.hp-pt-lg{padding-top:clamp(3.5rem,7vw,5.5rem)}.hp-pb-lg{padding-bottom:clamp(3.5rem,7vw,5.5rem)}
.hp-pt-xl{padding-top:clamp(5rem,10vw,8rem)}.hp-pb-xl{padding-bottom:clamp(5rem,10vw,8rem)}

/* Consistent section heading rhythm */
.hp-section-head{max-width:52rem;margin-bottom:clamp(2rem,4vw,3rem)}
.hp-section-head h2{margin:.25em 0 0;line-height:1.08;letter-spacing:-.01em}
.hp-section-more{margin-top:clamp(1.8rem,4vw,2.6rem)}

/* Refined, peace-minded buttons: calm fill-slide + soft lift */
.hp-btn{position:relative;overflow:hidden;isolation:isolate;box-shadow:0 6px 18px -10px rgba(164,0,0,.6);transition:transform .25s ease,box-shadow .25s ease,color .25s ease,background .25s ease,border-color .25s ease}
.hp-btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--hp-deep);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.65,0,.35,1)}
.hp-btn:hover::before{transform:scaleX(1)}
.hp-btn:hover{transform:translateY(-2px);box-shadow:0 14px 26px -12px rgba(164,0,0,.7)}
.hp-btn--light{box-shadow:0 6px 18px -10px rgba(0,0,0,.4)}
.hp-btn--light::before{background:rgba(255,255,255,.85)}
.hp-btn--light:hover{color:var(--hp-red)}
.hp-btn--ghost{box-shadow:none}
.hp-btn--ghost::before{background:var(--hp-red)}
.hp-btn--ghost:hover{color:#fff}
.hp-btn--on-dark::before{background:#fff}
.hp-btn--on-dark:hover{color:var(--hp-red)}

/* Motion: reveal on scroll (only when JS + GSAP are active and motion allowed) */
html.hp-anim [data-reveal]{opacity:0}
html.hp-anim [data-reveal] .hp-reveal-child{opacity:0}
@media(prefers-reduced-motion:reduce){html.hp-anim [data-reveal],html.hp-anim [data-reveal] .hp-reveal-child{opacity:1}}

/* ===========================================================================
   Phase 6: unified premium form interface
   ======================================================================== */
.hp-formcard{position:relative;background:#fff;border:1px solid var(--hp-line);border-radius:22px;padding:clamp(1.6rem,4vw,2.8rem);box-shadow:0 30px 60px -40px rgba(20,0,0,.35);overflow:hidden}
.hp-formcard::before{content:"";position:absolute;top:0;left:0;width:6px;height:100%;background:linear-gradient(var(--hp-red),var(--hp-flame))}
.hp-formcard__head{margin-bottom:1.4rem}
.hp-formcard__head h3{margin:.1em 0 .2em;font-size:clamp(1.3rem,2.5vw,1.7rem)}
.hp-formcard__head p{margin:0;color:#6b5a5a}
.hp-formcard__steps{display:flex;gap:.5rem;margin-bottom:1.4rem;flex-wrap:wrap}
.hp-formcard__step{font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--hp-red);background:var(--hp-soft);padding:.35rem .8rem;border-radius:100px}
.hp-fieldset{border:0;padding:0;margin:0 0 1.2rem}
.hp-fieldset legend{font-family:var(--hp-head);font-weight:700;font-size:1rem;margin-bottom:.7rem;color:var(--hp-ink);display:flex;align-items:center;gap:.5rem}
.hp-fieldset legend::before{content:"";width:18px;height:2px;background:var(--hp-red)}
.hp-consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem;color:#5a4a4a;margin:.4rem 0 1rem}
.hp-consent input{margin-top:.2rem}
.hp-hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.hp-form-note{font-size:.82rem;color:#7a6a6a;margin:.6rem 0 0;display:flex;align-items:center;gap:.4rem}
.hp-form-note::before{content:"\1F512";font-size:.9rem}
.hp-apply-form,.hp-donate-form{max-width:900px;margin-left:auto;margin-right:auto}
@media(min-width:900px){
	.hp-apply-form.hp-formcard,.hp-donate-form.hp-formcard{padding:clamp(2rem,3vw,3.2rem) clamp(2.4rem,4vw,3.6rem)}
}

/* Hero height + spacing controls */
.hp-hero{padding-block:clamp(2.3rem,4.7vw,4rem)}
.hp-hero--sp-sm{padding-block:clamp(1.3rem,2.7vw,2rem)}
.hp-hero--sp-md{padding-block:clamp(2rem,4vw,3rem)}
.hp-hero--sp-lg{padding-block:clamp(2.3rem,4.7vw,4rem)}
.hp-hero--sp-xl{padding-block:clamp(3.3rem,6.7vw,5.3rem)}
.hp-hero--h-tall{min-height:52vh;display:flex;align-items:center}
.hp-hero--h-full{min-height:67vh;display:flex;align-items:center}
.hp-hero--h-tall .hp-hero__inner,.hp-hero--h-full .hp-hero__inner{width:100%}

/* Recap video */
.hp-video-frame{max-width:960px;margin:0 auto;aspect-ratio:16/9;border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);background:#000}
.hp-video-frame iframe,.hp-video-frame video{width:100%;height:100%;display:block;border:0;object-fit:cover}

/* ===========================================================================
   Phase 7: forms matched to theme + optional multistep
   ======================================================================== */
.hp-formcard label{font-family:var(--hp-body);font-weight:600;font-size:.92rem;color:var(--hp-ink)}
.hp-formcard > label,.hp-formcard .hp-grid--2 > label{display:block;margin-bottom:1rem}
.hp-formcard label > input,.hp-formcard label > select,.hp-formcard label > textarea{margin-top:.4rem}
.hp-formcard input[type=text],.hp-formcard input[type=email],.hp-formcard input[type=tel],
.hp-formcard input[type=url],.hp-formcard input[type=number],.hp-formcard input[type=search],
.hp-formcard select,.hp-formcard textarea{
	width:100%;padding:.8rem .95rem;border:1px solid var(--hp-line);border-radius:12px;
	font-family:var(--hp-body);font-size:1rem;line-height:1.4;background:#fff;color:var(--hp-ink);
	transition:border-color .2s ease,box-shadow .2s ease}
.hp-formcard input:focus,.hp-formcard select:focus,.hp-formcard textarea:focus{
	outline:none;border-color:var(--hp-red);box-shadow:0 0 0 3px rgba(225,13,13,.12)}
.hp-formcard ::placeholder{color:#b09a9a}
.hp-formcard textarea{resize:vertical;min-height:120px}
.hp-formcard input[type=file]{width:100%;padding:.7rem;border:1px dashed var(--hp-line);border-radius:12px;background:var(--hp-mist);font-family:var(--hp-body);font-size:.92rem}
.hp-formcard select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23A40000' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.4rem}

/* single-step hides the step chips */
.hp-formcard:not(.hp-stepform) .hp-formcard__steps{display:none}

/* multistep (only takes effect once JS marks the form) */
.hp-form-actions{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap;margin-top:1.3rem}
.hp-stepform.is-js .hp-step{display:none}
.hp-stepform.is-js .hp-step.is-active{display:block;animation:hp-step-in .3s ease}
@keyframes hp-step-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.hp-formcard__step.is-active{background:var(--hp-red);color:#fff}
.hp-formcard__step.is-done{background:var(--hp-deep);color:#fff}
@media(prefers-reduced-motion:reduce){.hp-stepform.is-js .hp-step.is-active{animation:none}}

/* Section intro paragraph */
.hp-section-intro{margin:.7rem 0 0;font-size:clamp(1rem,1.4vw,1.15rem);line-height:1.6;color:#5a4a4a;max-width:46rem}

/* Mission and Vision */
.hp-mv{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.2rem,3vw,2rem);margin-top:.5rem}
.hp-mv__card{background:#fff;border:1px solid var(--hp-line);border-radius:20px;padding:clamp(1.6rem,3vw,2.4rem);box-shadow:0 24px 50px -40px rgba(20,0,0,.35)}
.hp-mv__icon{display:inline-flex;width:54px;height:54px;align-items:center;justify-content:center;border-radius:14px;background:var(--hp-soft);color:var(--hp-red);margin-bottom:1rem}
.hp-mv__icon svg{width:28px;height:28px}
.hp-mv__card h3{margin:0 0 .5rem;font-size:1.4rem}
.hp-mv__card p{margin:0;color:#5a4a4a;line-height:1.65}
.hp-sec--dark .hp-mv__card,.hp-sec--brand .hp-mv__card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.hp-sec--dark .hp-mv__card p,.hp-sec--brand .hp-mv__card p{color:rgba(255,255,255,.9)}
@media(max-width:760px){.hp-mv{grid-template-columns:1fr}}

/* ===========================================================================
   v1.10: polished application form (stepper, errors, dropzone, checkbox)
   ======================================================================== */
.hp-req{color:var(--hp-red);font-weight:700}

/* Progress stepper (shown only when JS drives the multistep form) */
.hp-stepper{display:none}
.hp-stepform.is-js .hp-stepper{display:flex;position:relative;justify-content:space-between;margin:1.4rem .3rem 2.4rem;padding:0 .4rem}
.hp-stepper__track{position:absolute;left:1.8rem;right:1.8rem;top:19px;height:3px;background:var(--hp-line);border-radius:3px;z-index:0}
.hp-stepper__fill{position:absolute;left:0;top:0;height:100%;width:0;background:var(--hp-red);border-radius:3px;transition:width .35s ease}
.hp-stepper__pt{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:.5rem;cursor:pointer;background:transparent;border:0}
.hp-stepper__num{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;border:2px solid var(--hp-line);color:#9a8a8a;font-weight:700;font-family:var(--hp-head);transition:all .25s ease}
.hp-stepper__lbl{font-size:.8rem;font-weight:600;color:#9a8a8a;white-space:nowrap;transition:color .25s ease}
.hp-stepper__pt.is-active .hp-stepper__num{background:var(--hp-red);border-color:var(--hp-red);color:#fff;box-shadow:0 0 0 5px rgba(225,13,13,.12)}
.hp-stepper__pt.is-active .hp-stepper__lbl{color:var(--hp-red)}
.hp-stepper__pt.is-done .hp-stepper__num{background:var(--hp-red);border-color:var(--hp-red);color:transparent}
.hp-stepper__pt.is-done .hp-stepper__num::after{content:"";position:absolute;width:11px;height:6px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:rotate(-45deg) translateY(-1px)}
@media(max-width:520px){.hp-stepper__lbl{display:none}}

/* Inline field errors */
.hp-err{display:none;color:#d64550;font-size:.8rem;margin-top:.35rem}
.hp-field.has-error .hp-err{display:block}
.hp-err.is-shown{display:block}
.hp-field.has-error input,.hp-field.has-error textarea,.hp-field.has-error select{border-color:#e5484d !important;box-shadow:0 0 0 3px rgba(229,72,77,.14) !important}

/* Upload dropzone */
.hp-drop{position:relative;border:2px dashed var(--hp-line);border-radius:14px;padding:1.8rem 1rem;text-align:center;background:var(--hp-mist);transition:border-color .2s ease,background .2s ease}
.hp-drop:hover,.hp-drop.is-drag{border-color:var(--hp-red);background:var(--hp-soft)}
.hp-drop svg{width:34px;height:34px;color:var(--hp-red);margin-bottom:.5rem}
.hp-drop input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;padding:0;border:0}
.hp-drop__main{margin:.2rem 0 .1rem;font-weight:600;color:var(--hp-ink)}
.hp-drop__hint{margin:0;font-size:.8rem;color:#9a8a8a}
.hp-drop__file{margin:.6rem 0 0;font-weight:700;color:var(--hp-red)}
.hp-drop.has-file{border-style:solid;border-color:var(--hp-red)}

/* Custom consent checkbox */
.hp-consent input[type=checkbox]{appearance:none;-webkit-appearance:none;flex:0 0 auto;width:20px;height:20px;border:2px solid var(--hp-line);border-radius:6px;display:grid;place-content:center;cursor:pointer;background:#fff;margin-top:.1rem;transition:all .2s ease}
.hp-consent input[type=checkbox]::before{content:"";width:11px;height:6px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:rotate(-45deg) scale(0);transition:transform .15s ease;margin-top:-2px}
.hp-consent input[type=checkbox]:checked{background:var(--hp-red);border-color:var(--hp-red)}
.hp-consent input[type=checkbox]:checked::before{transform:rotate(-45deg) scale(1)}
.hp-consent input[type=checkbox]:focus-visible{box-shadow:0 0 0 3px rgba(225,13,13,.2)}

/* Actions row + notices */
.hp-form-actions__spacer{flex:1}
.hp-note{border-radius:16px;padding:1.3rem 1.5rem;margin:0 auto 1.4rem;max-width:900px;line-height:1.5}
.hp-note--ok{background:#eef9f0;border:1px solid #bfe6c6;color:#1f7a34}
.hp-note--error{background:#fdeef0;border:1px solid #f2c0c4;color:#b3262d}

/* ===========================================================================
   v1.11: accessibility pass
   ======================================================================== */

/* Skip link becomes visible when focused */
.screen-reader-text:focus{position:fixed;top:12px;left:12px;z-index:9999;width:auto;height:auto;clip:auto;clip-path:none;
	background:var(--hp-red);color:#fff;padding:.8rem 1.2rem;border-radius:10px;font-weight:700;text-decoration:none;box-shadow:0 10px 30px rgba(0,0,0,.3)}

/* A consistent, visible focus ring for keyboard users everywhere */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--hp-red);outline-offset:2px;border-radius:4px}
.hp-sec--dark a:focus-visible,.hp-sec--brand a:focus-visible,
.hp-sec--dark button:focus-visible,.hp-sec--brand button:focus-visible,
.hp-footer a:focus-visible,.hp-hero a:focus-visible{outline-color:#fff}

/* Stepper points are buttons now: reset button chrome, keep target size */
.hp-stepper__pt{font:inherit;color:inherit;padding:0;min-width:44px;min-height:44px}
.hp-stepper__pt:focus-visible{outline:3px solid var(--hp-red);outline-offset:3px;border-radius:10px}

/* Comfortable touch targets on small screens */
@media(max-width:780px){
	.hp-nav__list a,.hp-mobile__list a,.hp-footer a{padding-block:.35rem}
	.hp-btn{min-height:44px}
}

/* Respect reduced motion across the board */
@media(prefers-reduced-motion:reduce){
	*,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
}

/* Hidden steps must not be reachable by keyboard when JS drives the form */
.hp-stepform.is-js .hp-step[aria-hidden="true"]{display:none}
.hp-radiogroup{border:0;padding:0;margin:0 0 1rem}
.hp-radiogroup legend{font-weight:600;font-size:.92rem;color:var(--hp-ink);margin-bottom:.5rem;padding:0}

/* ===========================================================================
   v1.12: form width and hidden-state fixes
   ======================================================================== */

/* The hidden attribute must always win over component display rules. */
[hidden]{display:none !important}

/* Roomier forms on desktop */
.hp-apply-form,.hp-donate-form{max-width:1080px}
@media(min-width:1024px){
	.hp-apply-form.hp-formcard,.hp-donate-form.hp-formcard{padding:clamp(2.4rem,3.2vw,3.6rem) clamp(3rem,4.5vw,4.5rem)}
	.hp-field-row{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
	.hp-formcard .hp-field{margin-bottom:1.3rem}
	.hp-formcard textarea{min-height:150px}
}
@media(min-width:1280px){
	.hp-apply-form,.hp-donate-form{max-width:1140px}
}

/* ===========================================================================
   v1.13: desktop mega menu
   ======================================================================== */
.hp-mega-toggle{display:none}
.hp-mega{display:none}

@media(min-width:1024px){
	.hp-mega-toggle{display:inline-flex;align-items:center;gap:.4rem;background:none;border:0;cursor:pointer;
		font-family:var(--hp-body);font-weight:600;font-size:.95rem;color:var(--hp-ink);padding:.4rem .2rem}
	.hp-mega-toggle:hover{color:var(--hp-red)}
	.hp-mega-toggle__chev svg{width:12px;height:8px;transition:transform .25s ease}
	.hp-mega-toggle.is-open{color:var(--hp-red)}
	.hp-mega-toggle.is-open .hp-mega-toggle__chev svg{transform:rotate(180deg)}

	.hp-mega{display:block;position:absolute;left:0;right:0;top:100%;z-index:60;background:#fff;
		border-top:1px solid var(--hp-line);box-shadow:0 30px 60px -30px rgba(20,0,0,.35);animation:hp-mega-in .22s ease}
	.hp-mega[hidden]{display:none !important}
	@keyframes hp-mega-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
	.hp-mega__inner{padding-block:2.2rem 1.6rem}

	.hp-mega__search{position:relative;max-width:760px;margin:0 auto 2rem}
	.hp-megasearch{display:flex;align-items:center;gap:.6rem;background:var(--hp-mist);border:1px solid var(--hp-line);
		border-radius:100px;padding:.4rem .5rem .4rem 1rem;transition:border-color .2s ease,box-shadow .2s ease}
	.hp-megasearch:focus-within{border-color:var(--hp-red);box-shadow:0 0 0 3px rgba(225,13,13,.12)}
	.hp-megasearch__icon svg{width:20px;height:20px;color:var(--hp-red);display:block}
	.hp-megasearch input[type=search]{flex:1;border:0;background:none;font-family:var(--hp-body);font-size:1rem;padding:.6rem 0;outline:none;color:var(--hp-ink)}
	.hp-megasearch .hp-btn{padding:.6rem 1.3rem;font-size:.9rem}
	.hp-mega__hint{margin:.5rem 0 0;text-align:center;font-size:.8rem;color:#9a8a8a}
	.hp-mega__results{margin-top:.9rem;background:#fff;border:1px solid var(--hp-line);border-radius:16px;padding:.6rem;max-height:340px;overflow:auto}
	.hp-mega__hits{list-style:none;margin:0;padding:0}
	.hp-mega__hits a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem .9rem;border-radius:10px;text-decoration:none;color:var(--hp-ink)}
	.hp-mega__hits a:hover{background:var(--hp-soft);color:var(--hp-red)}
	.hp-mega__hit-title{font-weight:600}
	.hp-mega__badge{flex:0 0 auto;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
		background:var(--hp-mist);color:#8a7a7a;padding:.2rem .6rem;border-radius:100px}
	.hp-mega__more{margin:.5rem 0 .2rem;text-align:center;font-size:.85rem}
	.hp-mega__empty{margin:.6rem;color:#9a8a8a;font-size:.9rem;text-align:center}

	.hp-mega__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1.6rem;border-top:1px solid var(--hp-line);padding-top:1.8rem}
	.hp-mega__title{margin:0 0 .8rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--hp-red)}
	.hp-mega__title a{color:inherit;text-decoration:none}
	.hp-mega__list{list-style:none;margin:0 0 .8rem;padding:0;display:flex;flex-direction:column;gap:.55rem}
	.hp-mega__list a{text-decoration:none;color:var(--hp-ink);display:block;line-height:1.35}
	.hp-mega__list a:hover .hp-mega__link{color:var(--hp-red)}
	.hp-mega__link{display:block;font-size:.9rem;font-weight:500}
	.hp-mega__meta{display:block;font-size:.76rem;color:#9a8a8a;margin-top:.1rem}
	.hp-mega__all{font-size:.8rem;font-weight:600;color:var(--hp-red);text-decoration:none}
	.hp-mega__all:hover{text-decoration:underline}

	.hp-mega__foot{display:flex;align-items:center;gap:1.4rem;margin-top:1.8rem;padding-top:1.2rem;border-top:1px solid var(--hp-line)}
	.hp-mega__foot a{font-size:.9rem;font-weight:600;color:var(--hp-ink);text-decoration:none}
	.hp-mega__foot a:hover{color:var(--hp-red)}
	.hp-mega__foot .hp-btn{margin-left:auto;color:#fff}
	.hp-btn--sm{padding:.55rem 1.2rem;font-size:.88rem}

	.hp-header{position:relative}
}

/* The mega links stay in the DOM for crawlers on small screens, just hidden. */
@media(max-width:1023px){.hp-mega{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}}

/* ===========================================================================
