/* Homepage sections below the hero (approved full-page design, 31 Oct): category icons, Featured and Newly Uploaded rows, Why Teachers Love,
   Explore Amazing Creators, Resources for Every Classroom, the Creator Memberships banner, quotes, For Schools & Districts and Stay in the
   Loop. Logo colours: navy, pink and aqua. Bands run edge to edge; their content lines up with the page. */
body[data-page=home]{--hm-navy:#0b2559;--hm-pink:#e6066f;--hm-pink-soft:#fde3ef;--hm-aqua:#00b5c8;--hm-aqua-soft:#d9f6fa;--hm-line:#e3e9f1;--hm-muted:#4a5a78}
.hm-section{margin:34px 0}
.hm-head{display:flex;justify-content:space-between;align-items:center;gap:10px 20px;flex-wrap:wrap;margin-bottom:16px}
.hm-head>div{display:flex;align-items:center;flex-wrap:wrap;gap:6px 18px}
.hm-head h2{display:inline-flex;align-items:center;gap:14px;margin:0;color:var(--hm-navy);font:700 clamp(24px,2.4vw,32px)/1.15 Fraunces,Georgia,serif}
.hm-head h2::after{content:"";width:42px;height:3px;border-radius:2px;background:var(--hm-pink)}
.hm-head p{margin:0;color:var(--hm-muted);font-size:14px}
.hm-head>a{color:var(--hm-navy);font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap}
.hm-head>a:hover{color:var(--hm-pink);text-decoration:underline}
.hm-btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:10px 22px;border:2px solid var(--hm-pink);border-radius:12px;background:var(--hm-pink);color:#fff;
  font-weight:700;font-size:16px;text-decoration:none;box-shadow:0 6px 16px #e6066f2e}
.hm-btn:hover{background:#c2055e;border-color:#c2055e;color:#fff;text-decoration:none}
.hm-btn .ico{width:20px;height:20px}
.hm-btn-outline{background:#fff;color:var(--hm-navy);border-color:var(--hm-aqua);box-shadow:none}
.hm-btn-outline:hover{background:var(--hm-aqua-soft);color:var(--hm-navy);border-color:var(--hm-aqua)}
.pink{color:var(--hm-pink)}

/* Category icons */
.hm-cats{margin:6px 0 10px;padding:22px 0 18px;border-bottom:1px solid var(--hm-line)}
.hm-cats-row{display:flex;justify-content:space-between;gap:10px;overflow-x:auto;scrollbar-width:thin}
.hm-cat{flex:1 0 82px;display:grid;justify-items:center;align-content:start;gap:8px;color:var(--hm-navy);font-size:13px;font-weight:600;text-align:center;text-decoration:none;line-height:1.25}
.hm-cat:hover{color:var(--hm-pink);text-decoration:none}
.hm-cat-more>button{display:grid;justify-items:center;gap:8px;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}
.hm-cat-ico{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;transition:transform .15s}
.hm-cat-ico.pink{background:var(--hm-pink-soft);color:var(--hm-pink)}.hm-cat-ico.aqua{background:var(--hm-aqua-soft);color:#0794a4}
.hm-cat-ico .ico{width:28px;height:28px}
.hm-cat:hover .hm-cat-ico{transform:translateY(-2px)}
.hm-cat-more{position:relative}
.hm-cat-more .bl-navmenu-list{right:0;left:auto;text-align:left}

/* Resource rows (Featured and Newly Uploaded) */
.hm-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.hm-row .bl-card,.hp-featured .bl-card{border-radius:14px;box-shadow:0 6px 18px #0b25590f}
.hp-featured .hm-head{margin-bottom:12px}

/* Why Teachers Love */
.hm-why{padding:8px 0}
.hm-why-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none}
.hm-why-grid li{display:grid;justify-items:center;align-content:start;gap:8px;padding:6px 22px;text-align:center;color:var(--hm-navy)}
.hm-why-grid li+li{border-left:1px solid var(--hm-line)}
.hm-why-grid strong{font-size:18px;line-height:1.25}
.hm-why-grid span:last-child{color:var(--hm-muted);font-size:14.5px;line-height:1.45}
.hm-why-ico{display:grid;place-items:center;width:78px;height:78px;margin-bottom:6px;border-radius:50%}
.hm-why-ico.pink{background:var(--hm-pink-soft);color:var(--hm-pink)}.hm-why-ico.aqua{background:var(--hm-aqua-soft);color:#0794a4}
.hm-why-ico .ico{width:38px;height:38px}

/* Explore Amazing Creators */
.hm-creators{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.hm-creator{display:flex;align-items:center;gap:14px;min-width:0;padding:6px}
.hm-creator-avatar{flex:none;display:grid;place-items:center;width:76px;height:76px;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,var(--hm-aqua-soft),var(--hm-pink-soft));
  border:3px solid #fff;box-shadow:0 4px 14px #0b25591f;color:var(--hm-navy);font:700 30px Fraunces,Georgia,serif;text-decoration:none}
.hm-creator-avatar img{width:100%;height:100%;object-fit:cover}
.hm-creator>div{min-width:0}
.hm-creator h3{margin:0;font-size:15.5px;line-height:1.25}
.hm-creator h3 a{color:var(--hm-navy);text-decoration:none}
.hm-creator p{margin:3px 0 8px;color:var(--hm-muted);font-size:13px}
.hm-follow{display:inline-block;min-width:96px;padding:6px 16px;border:1.5px solid #6aa7ea;border-radius:9px;background:#fff;color:#0b4f9c;font-weight:700;font-size:14px;text-align:center;text-decoration:none;cursor:pointer}
.hm-follow:hover{background:#eef5ff;text-decoration:none}
.hm-follow.on,.hm-follow[aria-pressed=true]{background:var(--hm-navy);border-color:var(--hm-navy);color:#fff}

/* Full-width bands: they break out of the page's centred content area. */
.hm-grades,.hm-members,.hm-schools,.hm-loop{margin-inline:calc(50% - 50vw);padding-inline:max(24px,calc((100vw - 1320px)/2 + 24px))}

/* Resources for Every Classroom */
.hm-grades{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,2.4fr);gap:28px;align-items:center;margin-top:40px;margin-bottom:0;padding-block:38px;
  background:linear-gradient(105deg,#fff0f6 0%,#fdf5fa 35%,#e6fafd 100%)}
.hm-grades-copy h2{margin:0 0 12px;color:var(--hm-navy);font:700 clamp(26px,2.6vw,36px)/1.12 Fraunces,Georgia,serif}
.hm-grades-copy p{margin:0 0 20px;color:var(--hm-navy);font-size:15.5px;line-height:1.5}
.hm-grade-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.hm-grade{position:relative;display:grid;align-content:stretch;aspect-ratio:3/4;overflow:hidden;border-radius:14px;color:var(--hm-navy);text-decoration:none;box-shadow:0 8px 20px #0b255914}
.hm-grade.pink{background:linear-gradient(160deg,#ffe3ef,#fff)}.hm-grade.aqua{background:linear-gradient(160deg,#d6f7fb,#fff)}
.hm-grade img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hm-grade-ico{display:grid;place-items:center;align-self:center;justify-self:center;width:72px;height:72px;margin-bottom:46px;border-radius:50%;background:#fff;color:var(--hm-pink);box-shadow:0 4px 12px #0b255914}
.hm-grade.aqua .hm-grade-ico{color:#0794a4}
.hm-grade-ico .ico{width:36px;height:36px}
.hm-grade-label{position:absolute;left:0;right:0;bottom:0;display:grid;place-items:center;min-height:52px;padding:6px 8px;background:#a6eef5e6;font-weight:700;font-size:13.5px;line-height:1.2;text-align:center}
.hm-grade:hover{transform:translateY(-3px);text-decoration:none}

/* Creator Memberships banner */
.hm-members{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(200px,.7fr);gap:30px;align-items:center;margin-block:0;padding-block:34px;
  background:linear-gradient(100deg,#e5f8fc 0%,#f8fdff 45%,#fff3f8 100%)}
.hm-members-art img{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:16px}
.hm-members-screen{display:grid;place-content:center;gap:2px;aspect-ratio:16/10;max-width:380px;margin:auto;border:14px solid #1b2433;border-bottom-width:22px;border-radius:14px;background:#fff;
  box-shadow:12px 18px 30px #0b255930;transform:rotate(-3deg);text-align:center}
.hm-members-screen b{color:var(--hm-navy);font:400 clamp(30px,3.2vw,46px)/1 Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.02em}
.hm-members-screen em{color:var(--hm-pink);font:400 clamp(26px,2.8vw,40px)/1 "Kaushan Script","Brush Script MT",cursive}
.hm-pill{display:inline-block;padding:5px 14px;border-radius:7px;background:var(--hm-aqua);color:#fff;font-weight:700;font-size:13px;letter-spacing:.06em}
.hm-members-copy h2{margin:12px 0 10px;color:var(--hm-navy);font:700 clamp(26px,2.6vw,36px)/1.15 Fraunces,Georgia,serif}
.hm-members-copy p{margin:0 0 18px;color:var(--hm-navy);font-size:15.5px;line-height:1.5}
.hm-perks{display:grid;gap:16px;margin:0;padding:0 0 0 24px;border-left:1px solid #cfe1ec;list-style:none}
.hm-perks li{display:flex;align-items:center;gap:12px;color:var(--hm-navy);font-size:15.5px}
.hm-perks .ico{width:28px;height:28px;color:var(--hm-pink)}

/* Quotes */
.hm-quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.hm-quote{position:relative;margin:0;padding:22px 24px;border:1px solid var(--hm-line);border-radius:14px;background:#fff;box-shadow:0 6px 18px #0b25590f;text-align:center}
.hm-quote::after{content:"”";position:absolute;top:6px;right:16px;color:var(--hm-pink);font:700 46px/1 Georgia,serif}
.hm-stars{margin:0 0 8px;color:#f5a400;font-size:20px;letter-spacing:2px}
.hm-quote blockquote{margin:0 0 12px;color:var(--hm-navy);font-size:15.5px;line-height:1.5}
.hm-quote figcaption{color:var(--hm-navy);font-weight:700;font-size:14.5px}

/* For Schools & Districts */
.hm-schools{display:grid;grid-template-columns:auto minmax(220px,1.1fr) minmax(0,1.6fr) auto;gap:20px 28px;align-items:center;margin-top:34px;padding-block:24px;background:#eef9fc}
.hm-schools-ico{display:grid;place-items:center;width:70px;height:70px;border-radius:18px;background:#fff;color:var(--hm-navy);box-shadow:0 4px 12px #0b255914}
.hm-schools-ico .ico{width:40px;height:40px}
.hm-schools-copy h2{margin:0 0 4px;color:#0794a4;font:700 clamp(22px,2vw,28px)/1.2 Fraunces,Georgia,serif}
.hm-schools-copy p{margin:0;color:var(--hm-navy);font-size:14.5px}
.hm-schools-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 22px;margin:0;padding:0;list-style:none}
.hm-schools-points li{display:flex;align-items:center;gap:10px;color:var(--hm-navy);font-size:14px}
.hm-schools-points .ico{flex:none;width:24px;height:24px;padding:4px;border-radius:50%;background:var(--hm-aqua);color:#fff;stroke-width:3}

/* Stay in the Loop */
.hm-loop{position:relative;display:grid;grid-template-columns:auto minmax(220px,1fr) minmax(300px,1.2fr) auto;gap:20px 28px;align-items:center;margin-bottom:-60px;padding-block:34px 40px;
  background:var(--hm-navy) radial-gradient(#ffffff14 2px,transparent 2.5px) 0 0/26px 26px;color:#fff}
.hm-loop-ico{display:grid;place-items:center;width:76px;height:76px;color:var(--hm-aqua)}
.hm-loop-ico .ico{width:64px;height:64px;stroke-width:1.5}
.hm-loop-copy h2{margin:0 0 4px;color:#fff;font:700 clamp(26px,2.4vw,34px)/1.15 Fraunces,Georgia,serif}
.hm-loop-copy p{margin:0;color:#dbe6f6;font-size:15px}
.hm-loop-field{display:flex;padding:5px;border-radius:12px;background:#fff}
.hm-loop-field input{flex:1;min-width:0;height:46px;padding:0 14px;border:0;outline:0;color:var(--hm-navy);font-size:15px;background:transparent}
.hm-loop-field button{padding:0 22px;border:0;border-radius:9px;background:var(--hm-pink);color:#fff;font-weight:700;font-size:16px;cursor:pointer}
.hm-loop-field button:hover{background:#c2055e}
.hm-loop-field:focus-within{outline:3px solid var(--hm-aqua);outline-offset:2px}
.hm-loop-consent{display:flex;gap:8px;align-items:flex-start;margin-top:10px;color:#dbe6f6;font-size:13px;line-height:1.4}
.hm-loop-consent input{flex:none;width:17px;height:17px;margin-top:1px;accent-color:var(--hm-pink)}
.hm-loop-note{margin:6px 0 0;color:#b8c7de;font-size:12px}
.hm-loop-tagline{display:flex;align-items:flex-start;gap:6px;max-width:250px;margin:0;color:#fff;font:400 24px/1.25 "Kaushan Script","Brush Script MT",cursive;transform:rotate(-4deg)}
.hm-loop-tagline svg{flex:none;width:34px;height:34px;fill:none;stroke:var(--hm-pink);stroke-width:3}
.hm-empty{padding:30px;border-radius:14px;background:#f4f9fd;text-align:center}

@media (max-width:1180px){
  .hm-row,.hm-creators{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hm-grades{grid-template-columns:1fr}.hm-grade-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hm-members{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}.hm-perks{grid-column:1/-1;grid-template-columns:repeat(4,auto);justify-content:space-between;padding:16px 0 0;border-left:0;border-top:1px solid #cfe1ec}
  .hm-schools{grid-template-columns:auto 1fr}.hm-schools-points{grid-column:1/-1}.hm-schools>.hm-btn{grid-column:1/-1;justify-self:start}
  .hm-loop{grid-template-columns:auto 1fr}.hm-loop-form,.hm-loop-tagline{grid-column:1/-1}
}
@media (max-width:760px){
  .hm-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .hm-creators{grid-template-columns:repeat(2,minmax(0,1fr))}.hm-creator{flex-direction:column;text-align:center}
  .hm-cats-row{justify-content:flex-start}.hm-cat{flex:0 0 84px}
  .hm-why-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:18px}.hm-why-grid li:nth-child(3){border-left:0}
  .hm-grade-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hm-members{grid-template-columns:1fr}.hm-perks{grid-template-columns:repeat(2,auto)}
  .hm-quotes{grid-template-columns:1fr}
  .hm-schools-points{grid-template-columns:1fr}
  .hm-loop{grid-template-columns:1fr}.hm-loop-ico{display:none}
}
@media (prefers-reduced-motion:reduce){.hm-cat-ico,.hm-grade{transition:none}.hm-grade:hover,.hm-cat:hover .hm-cat-ico{transform:none}}
.hm-sponsored{padding:2px 9px;border-radius:6px;background:#eef1f5;color:var(--hm-muted);font-size:11px;font-weight:700;letter-spacing:.08em}
/* Follow buttons and creator names: plain, outlined and sans-serif like the design (overrides the site's general button and heading styles). */
body[data-page=home] .hm-creator button.hm-follow{min-height:0;padding:6px 16px;border:1.5px solid #6aa7ea;background:#fff;color:#0b4f9c;box-shadow:none;font:700 14px "DM Sans",Arial,sans-serif}
body[data-page=home] .hm-creator button.hm-follow:hover{background:#eef5ff}
body[data-page=home] .hm-creator button.hm-follow[aria-pressed=true]{background:var(--hm-navy);border-color:var(--hm-navy);color:#fff}
body[data-page=home] .hm-creator h3{font:700 16px/1.25 "DM Sans",Arial,sans-serif}
/* Browse by Subject (Nov 2026): twelve rectangular cards, 6 × 2 on desktop, 3 columns on tablets, 2 on phones (1 on very narrow). */
.hm-subjects{margin:8px 0 36px}
.hm-subjects-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;margin-bottom:16px}
.hm-subjects-head h2{display:flex;align-items:center;gap:14px;margin:0;font:700 clamp(24px,2.4vw,32px)/1.15 Fraunces,Georgia,serif;color:var(--hm-navy)}
.hm-accent{display:inline-block;width:52px;height:3px;border-radius:2px;background:var(--hm-pink)}
.hm-subjects-all{font-weight:700;color:var(--hm-navy);text-decoration:none}
.hm-subjects-all:hover,.hm-subjects-all:focus-visible{color:var(--hm-pink);text-decoration:underline}
.hm-subject-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.hm-subject-grid>li{display:flex}
.hm-subject{flex:1;display:flex;align-items:center;gap:12px;min-height:66px;padding:12px 14px;border-radius:14px;border:1px solid transparent;color:var(--hm-navy);font-weight:700;font-size:15px;line-height:1.25;text-decoration:none;transition:transform .15s,box-shadow .15s}
.hm-subject.is-pink{background:#FFF0F6;border-color:#FAD2E4}
.hm-subject.is-aqua{background:#ECFBFC;border-color:#BDEBF0}
.hm-subject.is-all{background:#BDF1F3;border-color:#7FDDE3}
.hm-subject-ico{flex:none;display:grid;place-items:center;width:34px;height:34px}
.hm-subject-ico .ico{width:30px;height:30px;stroke-width:1.7}
.hm-subject.is-pink .hm-subject-ico{color:var(--hm-pink)}
.hm-subject.is-aqua .hm-subject-ico,.hm-subject.is-all .hm-subject-ico{color:#0794a4}
.hm-subject:hover{transform:translateY(-2px);box-shadow:0 8px 18px #0b25591a;text-decoration:none;color:var(--hm-navy)}
.hm-subject:focus-visible{outline:3px solid var(--hm-pink);outline-offset:2px}
@media (max-width:1100px){.hm-subject-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.hm-subject-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hm-subject{font-size:14px}}
@media (max-width:360px){.hm-subject-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.hm-subject{transition:none}.hm-subject:hover{transform:none}}
