/* HFT Search & Filter 0.9.0 — SEO Playbooks (teachers' playbook under the grid on indexed filter pages).
   Design = approved Free Bundle model (pill, kicker, swash H2, colour "dream" cards with line icons, tilted product
   tiles, stat pills, rounded FAQ cards). Accent per grade via --pb-acc (set inline). Phone-first checks: 360/768/1280. */
.hft-pb{--pb-navy:var(--hft-navy,#1B437D);--pb-pink:var(--hft-cta,#D6337B);--pb-sail:#FBB915;--pb-cream:#FBF5EC;--pb-line:#E9E0D4;--pb-slate:#5A6B7D;--pb-white:#fff;
  --pb-tint:color-mix(in srgb,var(--pb-acc) 11%,#fff);--pb-shadow:0 18px 40px -18px rgba(27,67,125,.35);
  --pb-display:var(--hft-font-display,"Fredoka","Nunito Sans",system-ui,sans-serif);--pb-body:var(--hft-font-body,"Nunito Sans",system-ui,-apple-system,sans-serif);
  position:relative;overflow:hidden;margin:48px 0 0;border-radius:28px;background:var(--pb-tint);font-family:var(--pb-body);color:#231F20;line-height:1.6;isolation:isolate}
.hft-pb::before,.hft-pb::after{content:"";position:absolute;border-radius:50%;background:var(--pb-white);opacity:.55;pointer-events:none;z-index:0}
.hft-pb::before{width:340px;height:340px;right:-120px;top:-120px}
.hft-pb::after{width:220px;height:220px;left:-90px;bottom:120px}
.hft-pb-in{position:relative;z-index:1;padding:clamp(28px,5vw,64px) clamp(16px,4vw,48px);display:grid;gap:clamp(36px,5vw,56px)}
.hft-pb.is-auto .hft-pb-in{gap:28px;padding-block:clamp(24px,4vw,40px)}
.hft-pb-pill{display:inline-flex;align-items:center;gap:8px;background:var(--pb-white);color:var(--pb-acc);font:800 13px/1 var(--pb-body);border-radius:999px;padding:9px 14px;box-shadow:0 2px 0 var(--pb-line)}
.hft-pb-pill svg{width:18px;height:18px}
.hft-pb-kicker{font-family:var(--pb-display);font-weight:600;color:var(--pb-acc);font-size:clamp(19px,2.3vw,24px);margin:14px 0 4px}
.hft-pb-h2{font-family:var(--pb-display);font-weight:600;color:var(--pb-navy);font-size:clamp(26px,3.4vw,42px);line-height:1.15;margin:0 0 14px;text-wrap:balance}
.hft-pb.is-auto .hft-pb-h2{font-size:clamp(22px,2.6vw,30px)}
.hft-pb-h2 em{font-style:normal;color:var(--pb-acc);position:relative;z-index:0;white-space:nowrap}
.hft-pb-h2 em::after{content:"";position:absolute;left:-4px;right:-4px;bottom:.04em;height:.32em;background:var(--pb-sail);opacity:.55;border-radius:6px;transform:rotate(-1.5deg);z-index:-1}
.hft-pb-lede{font-size:clamp(16.5px,1.6vw,19px);max-width:68ch;margin:0}
.hft-pb-sub{font-size:17px;max-width:66ch;margin:0}
.hft-pb .eq{display:inline-block;background:var(--pb-white);border:2px solid var(--pb-sail);border-radius:10px;padding:0 8px;font-family:var(--pb-display);font-weight:600;color:var(--pb-navy);font-variant-numeric:tabular-nums}
.hft-pb-dreams{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px;margin-top:22px}
.hft-pb-dream{position:relative;overflow:hidden;border-radius:26px;padding:26px 24px 22px;color:var(--pb-white);display:grid;gap:12px;align-content:start;grid-template-rows:auto auto 1fr auto auto;box-shadow:var(--pb-shadow)}
.hft-pb-dream::after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;background:rgba(255,255,255,.08);right:-60px;top:-60px;z-index:0}
.hft-pb-dream>*{position:relative;z-index:1}
.hft-pb-d1{background:var(--pb-acc)}.hft-pb-d2{background:var(--pb-navy)}.hft-pb-d3{background:var(--pb-d3,#1F8551)}
.hft-pb-icon{width:46px;height:46px;border-radius:14px;background:var(--pb-sail);color:var(--pb-navy);display:grid;place-items:center}
.hft-pb-dream h3{font-family:var(--pb-display);font-weight:600;font-size:23px;margin:0;line-height:1.2;color:var(--pb-white)}
.hft-pb-dream p{margin:0;font-size:15.5px;color:var(--pb-white)}
.hft-pb-dream .hft-pb-why{font-size:13.5px;opacity:.9;border-top:1px dashed rgba(255,255,255,.4);padding-top:10px}
.hft-pb-feat{display:grid;grid-template-columns:minmax(0,46%) 1fr;gap:14px;align-items:center;background:var(--pb-white);color:var(--pb-navy);border-radius:20px;padding:12px;text-decoration:none;transition:transform .2s;margin-top:4px}
.hft-pb-feat:hover{transform:translateY(-3px)}
.hft-pb-fimg{background:var(--pb-cream);border-radius:14px;padding:10px;display:flex;justify-content:center}
.hft-pb-fimg img{max-height:190px;width:auto;height:auto;box-shadow:0 3px 10px rgba(0,0,0,.16);transform:rotate(-2deg)}
.hft-pb-ftxt{display:grid;gap:4px}
.hft-pb-trylabel{font:800 11px/1 var(--pb-body);letter-spacing:.1em;text-transform:uppercase;color:var(--pb-acc)}
.hft-pb-ftxt b{font-family:var(--pb-display);font-weight:600;font-size:18px;line-height:1.2}
.hft-pb-ftxt small{font:800 11px/1 var(--pb-body);letter-spacing:.1em;text-transform:uppercase;color:var(--pb-slate)}
.hft-pb-go{color:var(--pb-pink);font-weight:800;font-size:14px;margin-top:4px}
.hft-pb-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:22px;margin-top:22px}
.hft-pb-tile{background:var(--pb-white);border-radius:24px;padding:16px 16px 20px;text-decoration:none;color:#231F20;display:grid;gap:6px;align-content:start;transform:rotate(var(--tilt,0));transition:transform .25s;box-shadow:var(--pb-shadow)}
.hft-pb-tile:hover{transform:rotate(0) translateY(-4px)}
.hft-pb-pimg{background:var(--pb-cream);border-radius:16px;display:flex;justify-content:center;padding:12px;margin-bottom:6px}
.hft-pb-pimg img{max-height:170px;width:auto;height:auto;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.hft-pb-tile small{font:800 11px/1 var(--pb-body);letter-spacing:.1em;text-transform:uppercase;color:var(--pb-acc)}
.hft-pb-tile h3{font-family:var(--pb-display);font-weight:600;font-size:21px;margin:0;color:var(--pb-navy)}
.hft-pb-tile p{margin:0;font-size:15px}
.hft-pb-stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.hft-pb-stat{display:flex;align-items:baseline;gap:8px;background:var(--pb-white);border-radius:999px;padding:9px 16px;text-decoration:none;color:var(--pb-navy);font-weight:800;box-shadow:0 2px 0 var(--pb-line);transition:transform .2s}
.hft-pb-stat:hover{transform:translateY(-2px)}
.hft-pb-stat b{font-family:var(--pb-display);font-size:21px;color:var(--pb-acc);font-variant-numeric:tabular-nums}
.hft-pb-favs{margin:12px 0 0;font-size:15px}
.hft-pb-favs a{color:var(--pb-navy);font-weight:800}
.hft-pb-faq{display:grid;gap:12px;max-width:860px;margin-top:8px}
.hft-pb-faq details{background:var(--pb-white);border:2px solid var(--pb-line);border-radius:20px;padding:16px 20px}
.hft-pb-faq details[open]{border-color:var(--pb-acc)}
.hft-pb-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;font-family:var(--pb-display);font-weight:600;font-size:18px;color:var(--pb-navy)}
.hft-pb-faq summary::-webkit-details-marker{display:none}
.hft-pb-faq summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:50%;background:var(--pb-tint);color:var(--pb-acc);display:grid;place-items:center;font-weight:800}
.hft-pb-faq details[open] summary::after{content:"\2013"}
.hft-pb-faq p{margin:10px 0 0;font-size:15.5px}
.hft-pb-related{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.hft-pb-related a{background:var(--pb-white);border-radius:999px;padding:9px 16px;text-decoration:none;color:var(--pb-navy);font-weight:800;font-size:14px;box-shadow:0 2px 0 var(--pb-line)}
.hft-pb-byline{font-size:13px;color:var(--pb-slate);max-width:90ch;margin:0}
.hft-pb-byline b{color:var(--pb-navy)}
.hft-pb-byline a{color:var(--pb-navy);text-decoration:underline;text-underline-offset:2px}
.hft-pb a:focus-visible,.hft-pb summary:focus-visible{outline:3px solid var(--pb-pink);outline-offset:3px}
.hft-pb-summary a{color:var(--pb-pink,var(--hft-cta,#D6337B));font-weight:800;text-decoration:none;white-space:nowrap}
.hft-pb-summary{max-width:80ch}
@media (max-width:600px){
  .hft-pb{border-radius:20px;margin-top:36px}
  .hft-pb-tiles{gap:14px}
  .hft-pb-tile{grid-template-columns:96px 1fr;column-gap:14px;transform:none;padding:12px}
  .hft-pb-tile:hover{transform:none}
  .hft-pb-pimg{grid-row:1/span 5;margin:0;padding:8px}
  .hft-pb-pimg img{max-height:110px}
  .hft-pb-tile h3{font-size:19px}
  .hft-pb-dream{padding:22px 18px 18px}
  .hft-pb-feat{padding:10px}
}
@media (max-width:420px){.hft-pb-feat{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.hft-pb-tile,.hft-pb-feat,.hft-pb-stat{transition:none}.hft-pb-tile{transform:none}}