/* The free collection shares the site's type, colours and Flaggie artwork. */
.resource-hub [hidden] { display:none !important; }
.resource-hub .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.resource-hub :is(a,button,input,summary):focus-visible { outline:3px solid #c2410c; outline-offset:4px; }
.resource-hub :is(section,[id]) { scroll-margin-top:150px; }
.resource-skip { position:fixed; z-index:200; top:10px; left:16px; padding:12px 20px; background:white; border:2px solid #c2410c; border-radius:12px; transform:translateY(-160%); }
.resource-skip:focus { transform:none; }
.resource-header-brand { gap:8px; font-weight:900; letter-spacing:-.035em; font-size:1.2rem; color:#c2410c; }
.resource-header-brand b { color:var(--slate-900); }
.resource-header-brand img { height:42px; }
.resource-hub .header-section-link { display:block; }

/* Hero */
.resource-hero { position:relative; display:grid; grid-template-columns:1.1fr 1fr; gap:40px; align-items:center; overflow:hidden; padding:52px; border:2px solid #fed7aa; border-radius:44px; background:radial-gradient(circle at 85% 30%,#ffedd5 0,#fff7ed00 45%),linear-gradient(125deg,#fff 40%,#fff7ed); box-shadow:0 20px 60px #7c2d1812; }
.resource-hero-copy { position:relative; z-index:1; min-width:0; }
.resource-hero h1 { margin:20px 0; color:var(--slate-900); font-size:clamp(2.25rem,4.3vw,3.8rem); line-height:1.06; letter-spacing:-.065em; font-weight:900; }
.resource-tagline { margin:0; font-size:clamp(1.1rem,2vw,1.4rem); font-weight:900; color:#c2410c; letter-spacing:-.025em; }
.resource-intro p { margin:15px 0 24px; max-width:600px; color:var(--slate-600); line-height:1.75; }
.resource-intro strong { color:var(--slate-900); }
.resource-hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.resource-memberships { padding:16px 21px; border:1px solid #c2410c; border-radius:15px; color:#9a3412; background:white; text-decoration:none; gap:20px; }
.resource-memberships:hover { background:#fff7ed; }
.resource-browse { background:#c2410c; color:white; border-radius:15px; padding:16px 21px; text-decoration:none; gap:24px; box-shadow:0 8px 18px #c2410c25; }
.resource-browse:hover { background:var(--stone-900); }
.resource-access { margin:18px 0 0; color:#047857; font-size:.8rem; font-weight:800; display:flex; flex-wrap:wrap; gap:14px; }
.resource-hero-art { position:relative; min-width:0; }
.resource-hero-label { position:absolute; z-index:4; top:-8px; right:6px; margin:0; padding:9px 15px; transform:rotate(5deg); background:#fffbeb; border:1px solid #fde68a; border-radius:14px; color:#92400e; font-size:.8rem; font-weight:900; box-shadow:0 8px 20px #92400e14; }
.resource-fan { list-style:none; margin:0; padding:24px 0 0; display:grid; }
.resource-fan li { grid-area:1/1; transition:transform .25s ease; }
.resource-fan li:nth-child(1) { transform:translate(-6%,10%) rotate(-7deg) scale(.86); z-index:1; }
.resource-fan li:nth-child(2) { transform:translate(8%,-2%) rotate(5deg) scale(.86); z-index:2; }
.resource-fan li:nth-child(3) { transform:translate(0,22%) rotate(-1deg) scale(.9); z-index:3; }
.resource-fan li:only-child { transform:none; }
.resource-fan li:hover,.resource-fan li:focus-within { z-index:5; }
.resource-fan a { display:block; overflow:hidden; border-radius:20px; background:white; border:1px solid #fed7aa; box-shadow:0 18px 40px #7c2d1822; text-decoration:none; color:var(--slate-900); }
.resource-fan .rc-cover { border-radius:0; }
.resource-fan-title { display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:12px 16px; font-weight:850; font-size:.95rem; letter-spacing:-.02em; }
.resource-fan-title small { flex:none; color:#9a3412; font-size:.7rem; font-weight:800; }
.resource-hero-art { padding-bottom:16%; }

/* Stats and steps */
.resource-stats { list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:10px 34px; margin:26px 0 0; padding:0; color:var(--slate-600); font-size:.92rem; font-weight:650; }
.resource-stats b { color:#c2410c; font-size:1.55rem; font-weight:900; letter-spacing:-.04em; margin-right:4px; }
.resource-how ol { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:30px 0 0; padding:0; }
.resource-how li { display:flex; gap:14px; padding:22px; background:white; border:1px solid #e7e5e4; border-radius:22px; }
.resource-how-n { flex:none; display:grid; place-items:center; width:38px; height:38px; border-radius:12px; background:#ffedd5; color:#c2410c; font-weight:900; }
.resource-how h3 { margin:2px 0 6px; font-size:1.02rem; color:var(--slate-900); letter-spacing:-.025em; }
.resource-how p { margin:0; font-size:.86rem; line-height:1.6; color:var(--slate-600); }

/* Library heading, jumps and filters */
.resource-collections { margin-top:64px; }
.resource-library-heading { display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:16px 24px; margin-bottom:18px; }
.resource-library-heading h2 { margin:12px 0 0; font-size:clamp(1.6rem,3vw,2.3rem); font-weight:900; color:var(--slate-900); letter-spacing:-.055em; }
.resource-jumps { display:flex; flex-wrap:wrap; gap:8px; }
.resource-jumps a { padding:9px 14px; border:1px solid #e7e5e4; background:white; border-radius:100px; text-decoration:none; font-size:.78rem; font-weight:750; color:var(--slate-700); }
.resource-jumps a:hover { background:#ffedd5; border-color:#fb923c; }
.resource-filters { position:sticky; top:72px; z-index:20; display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; padding:14px 16px; background:#ffffffef; backdrop-filter:blur(10px); border:1px solid #e7e5e4; border-radius:22px; box-shadow:0 10px 30px #0f172a0d; }
.rf-search { flex:1 1 280px; display:flex; align-items:center; gap:10px; min-width:0; padding:0 14px; border:1px solid #cbd5e1; border-radius:14px; background:#f8fafc; color:var(--slate-500); }
.rf-search:focus-within { border-color:#c2410c; background:white; }
.rf-search input { flex:1; min-width:0; padding:13px 0; border:0; background:none; font:inherit; font-size:.92rem; color:var(--slate-900); outline:none; }
.rf-chips { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0; padding:0; border:0; min-width:0; }
.rf-chips legend { float:left; margin-right:4px; font-size:.7rem; font-weight:800; color:var(--slate-500); text-transform:uppercase; letter-spacing:.08em; }
.rf-chips label { position:relative; }
.rf-chips input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.rf-chips span { display:block; padding:8px 13px; border:1px solid #e2e8f0; border-radius:100px; background:white; font-size:.8rem; font-weight:750; color:var(--slate-700); }
.rf-chips input:hover + span { border-color:#fb923c; }
.rf-chips input:checked + span { background:#c2410c; border-color:#c2410c; color:white; }
.rf-chips input:focus-visible + span { outline:3px solid #c2410c; outline-offset:3px; }
.resource-filters button { min-height:40px; border:1px solid #fed7aa; border-radius:12px; padding:9px 14px; background:#fff7ed; color:#9a3412; font:inherit; font-weight:800; font-size:.8rem; cursor:pointer; }
.resource-filters button:hover { background:#ffedd5; }
.resource-results { flex-basis:100%; margin:0; color:var(--slate-600); font-size:.76rem; font-weight:600; }

/* Sections and topics */
.resource-section { margin-top:48px; }
.resource-section-heading { display:flex; align-items:center; gap:18px; margin-bottom:8px; }
.resource-section-heading > img { flex:0 0 72px; object-fit:contain; filter:drop-shadow(0 6px 6px #0f172a12); }
.resource-section-heading h2 { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0; font-size:clamp(1.5rem,2.8vw,2.1rem); color:var(--slate-900); letter-spacing:-.045em; font-weight:900; }
.resource-count { padding:5px 10px; border-radius:100px; background:#ffedd5; color:#9a3412; font-size:.72rem; letter-spacing:0; font-weight:800; }
.resource-section-heading p { margin:8px 0 0; max-width:800px; font-size:.92rem; line-height:1.65; color:var(--slate-600); }
.resource-topic { margin-top:26px; }
.resource-topic > h3 { display:flex; align-items:center; gap:12px; margin:0 0 14px; font-size:1.08rem; letter-spacing:-.025em; color:var(--slate-800); }
.resource-topic > h3::after { content:""; flex:1; height:1px; background:#e7e5e4; }
.resource-topic > h3 span { order:2; color:var(--slate-500); font-size:.74rem; font-weight:700; }
.resource-path > p { margin:-6px 0 16px; color:var(--slate-600); font-size:.88rem; line-height:1.6; }
.resource-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }

/* Resource cards */
.rc { display:flex; flex-direction:column; min-width:0; overflow:hidden; border:1px solid #e7e5e4; border-radius:22px; background:white; box-shadow:0 8px 20px #7c2d1806; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.rc:hover { border-color:#fdba74; box-shadow:0 16px 36px #7c2d1814; transform:translateY(-2px); }
.rc-cover { position:relative; display:block; aspect-ratio:16/9; overflow:hidden; background:#fff7ed; border-bottom:1px solid #f1f5f9; }
.rc-cover > img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.rc:hover .rc-cover > img { transform:scale(1.03); }
.rc-free,.rc-slides,.rc-step { position:absolute; top:12px; padding:5px 9px; border-radius:8px; font-size:.66rem; font-weight:900; letter-spacing:.06em; box-shadow:0 4px 10px #0f172a1a; }
.rc-free { left:12px; background:#ecfdf5; color:#047857; text-transform:uppercase; }
.rc-slides { right:12px; background:#0f172acc; color:white; letter-spacing:.02em; }
.rc-step { right:12px; background:#c2410c; color:white; letter-spacing:.02em; }
.rc-audio,.rc-placeholder { display:flex; align-items:center; justify-content:center; gap:14px; width:100%; height:100%; padding:16px; }
.rc-audio { position:relative; background:linear-gradient(135deg,#ede9fe,#e0f2fe); color:#5b21b6; }
.rc-audio-dictation { background:linear-gradient(135deg,#fef3c7,#ffe4e6); color:#9f1239; }
.rc-audio img,.rc-placeholder img { position:relative; width:auto; height:62%; object-fit:contain; filter:drop-shadow(0 8px 8px #0f172a1f); }
.rc-audio b { position:absolute; left:14px; bottom:12px; font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; }
.rc-wave { position:absolute; inset:auto 14px 40% auto; display:flex; align-items:center; gap:4px; height:34%; opacity:.5; }
.rc-wave i { width:4px; border-radius:4px; background:currentColor; height:30%; }
.rc-wave i:nth-child(3n) { height:90%; } .rc-wave i:nth-child(3n+1) { height:55%; } .rc-wave i:nth-child(4n) { height:100%; } .rc-wave i:nth-child(5n) { height:20%; }
.rc-placeholder { flex-direction:column; background:linear-gradient(135deg,#fff7ed,#ffedd5); color:#9a3412; font-size:.85rem; }
.rc-body { display:flex; flex:1; flex-direction:column; padding:18px 20px 18px; }
.rc h4 { margin:0; font-size:1.12rem; line-height:1.3; letter-spacing:-.03em; overflow-wrap:anywhere; }
.rc h4 a { color:var(--slate-900); text-decoration:none; }
.rc h4 a:hover { color:#c2410c; }
.rc-kicker { display:block; margin-bottom:4px; color:#c2410c; font-size:.7rem; font-weight:800; letter-spacing:.02em; }
.rc-meta { display:flex; flex-wrap:wrap; gap:6px; list-style:none; padding:0; margin:10px 0 0; }
.rc-meta li { border:1px solid #e2e8f0; background:#f8fafc; border-radius:6px; padding:4px 7px; font-size:.66rem; font-weight:750; color:var(--slate-600); }
.rc-body > p { color:var(--slate-600); font-size:.84rem; line-height:1.6; margin:12px 0 16px; }
.rc-actions { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px 14px; margin-top:auto; padding-top:14px; border-top:1px solid #f1f5f9; }
.resource-open { display:inline-flex; align-items:center; gap:8px; color:#c2410c; font-size:.84rem; font-weight:850; text-decoration:none; }
.resource-open:hover { text-decoration:underline; }
.rc-pair { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:100px; background:#f5f3ff; color:#6d28d9; font-size:.74rem; font-weight:800; text-decoration:none; }
.rc-pair:hover { background:#ede9fe; }

.resource-section-empty,.resource-no-results { padding:24px; border:1px dashed #d6d3d1; border-radius:20px; color:var(--slate-600); font-size:.9rem; line-height:1.6; }
.resource-no-results { margin-top:24px; background:white; }
.resource-no-results h3 { color:var(--slate-900); margin:0 0 8px; }
.resource-no-results p { margin:0; }
.resource-noscript { color:var(--slate-600); }

/* Other collection, FAQ, community and CTA */
.resource-elsewhere { display:flex; align-items:center; gap:20px; margin-top:52px; padding:24px 28px; border:1px solid #bfdbfe; border-radius:24px; background:linear-gradient(120deg,#eff6ff,#fff); }
.resource-elsewhere > img { flex:0 0 72px; width:72px; height:72px; object-fit:contain; }
.resource-elsewhere > div { flex:1; min-width:0; }
.resource-elsewhere h2 { margin:0; font-size:1.2rem; color:var(--slate-900); letter-spacing:-.03em; }
.resource-elsewhere p { margin:6px 0 0; color:var(--slate-600); font-size:.88rem; line-height:1.6; }
.resource-elsewhere p a { color:#1d4ed8; font-weight:700; }
.resource-elsewhere > a { flex:none; padding:13px 16px; border-radius:12px; background:#1d4ed8; color:white; font-size:.84rem; font-weight:800; text-decoration:none; }
.resource-elsewhere > a:hover { background:#1e3a8a; }
.resource-faq { max-width:860px; margin:72px auto 0; }
.resource-faq h2 { margin:10px 0 20px; font-size:clamp(1.6rem,3vw,2.2rem); font-weight:900; color:var(--slate-900); letter-spacing:-.05em; }
.resource-faq details { border:1px solid #e7e5e4; border-radius:18px; background:white; margin-bottom:10px; }
.resource-faq summary { display:flex; justify-content:space-between; gap:16px; padding:18px 22px; cursor:pointer; list-style:none; font-weight:800; color:var(--slate-900); }
.resource-faq summary::-webkit-details-marker { display:none; }
.resource-faq summary span { color:#c2410c; font-size:1.3rem; line-height:1; transition:transform .2s ease; }
.resource-faq details[open] summary span { transform:rotate(45deg); }
.resource-faq details p { margin:0; padding:0 22px 20px; color:var(--slate-600); line-height:1.7; font-size:.92rem; }
.resource-more { margin-top:56px; display:flex; align-items:center; justify-content:center; gap:24px; padding:30px; border-radius:28px; background:#ffedd580; }
.resource-more > img { object-fit:contain; flex:0 0 110px; }
.resource-more h2 { margin:10px 0 0; color:var(--slate-900); font-size:1.5rem; letter-spacing:-.04em; }
.resource-more p { margin:10px 0 0; max-width:660px; color:var(--slate-600); font-size:.9rem; line-height:1.7; }
.resource-more > div { min-width:0; }
.resource-community { margin-top:24px; padding-top:24px; border-top:1px solid #fed7aa; }
.resource-community h3 { margin:0; color:var(--slate-900); font-size:1.2rem; letter-spacing:-.035em; }
.resource-social-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:18px; }
.resource-social-actions a { display:inline-flex; align-items:center; justify-content:space-between; gap:12px; max-width:100%; padding:13px 16px; border:1px solid #c2410c; border-radius:12px; background:white; color:#9a3412; font-size:.83rem; font-weight:800; text-decoration:none; }
.resource-social-actions a:hover { background:#fff7ed; }
.resource-soft-cta { display:flex; align-items:center; gap:32px; margin-top:28px; padding:40px 48px; border-radius:32px; background:var(--stone-900); color:white; }
.resource-soft-cta > div { flex:1; }
.resource-soft-cta h2 { margin:15px 0 0; font-size:clamp(1.6rem,3vw,2.4rem); letter-spacing:-.055em; }
.resource-soft-cta p { max-width:770px; color:#d6d3d1; line-height:1.7; font-size:.95rem; }
.resource-soft-cta a { display:inline-flex; align-items:center; gap:28px; margin-top:10px; padding:15px 22px; border-radius:14px; background:#fff7ed; color:#9a3412; font-size:.9rem; font-weight:850; text-decoration:none; }
.resource-soft-cta a:hover { background:#ffedd5; }
.resource-soft-cta > img { width:160px; height:auto; object-fit:contain; filter:drop-shadow(0 14px 14px #0004); }

@media (max-width:1000px) {
  .resource-hero { padding:36px; gap:24px; grid-template-columns:1fr; }
  .resource-hero-art { max-width:520px; width:100%; margin:0 auto; }
  .resource-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .resource-how ol { grid-template-columns:1fr; }
}
@media (max-width:700px) {
  .resource-hub .page-shell { padding:88px 16px 40px; }
  .resource-hub .site-header-inner { padding:8px 16px; gap:8px; }
  .resource-header-brand { font-size:.95rem; }
  .resource-hub .header-nav { display:flex; gap:0; font-size:.7rem; }
  .resource-hub .header-section-link { padding:10px 8px; }
  .resource-hub .header-nav a:first-child { display:none; }
  .resource-hub :is(section,[id]) { scroll-margin-top:84px; }
  .resource-hero { padding:26px 22px; border-radius:30px; }
  .resource-hero h1 { font-size:clamp(2rem,8.4vw,3rem); }
  .resource-fan-title { font-size:.82rem; padding:10px 12px; }
  .resource-stats { justify-content:flex-start; gap:6px 20px; font-size:.82rem; }
  .resource-stats b { font-size:1.25rem; }
  .resource-how li { padding:16px; }
  .resource-collections { margin-top:44px; }
  .resource-filters { position:static; padding:14px; }
  .rf-search { flex-basis:100%; }
  .resource-grid { grid-template-columns:1fr; gap:14px; }
  .resource-section-heading { gap:12px; align-items:flex-start; }
  .resource-section-heading > img { width:54px; height:54px; flex-basis:54px; }
  .resource-elsewhere { flex-direction:column; align-items:flex-start; padding:22px; }
  .resource-more { align-items:flex-start; gap:12px; padding:24px 20px; }
  .resource-more > img { width:66px; height:66px; flex-basis:66px; }
  .resource-soft-cta { padding:30px 26px; gap:0; }
  .resource-soft-cta > img { display:none; }
}
@media (prefers-reduced-motion:reduce) { .resource-hub * { transition:none !important; } .rc:hover, .rc:hover .rc-cover > img { transform:none; } }

/* Compact listening and dictation cards */
.rc-audio-head { position:relative; display:flex; align-items:center; gap:14px; padding:16px 20px 0; color:#6d28d9; }
.rc-audio-icon { flex:none; display:grid; place-items:center; width:58px; height:58px; border-radius:16px; background:linear-gradient(135deg,#ede9fe,#e0f2fe); }
.rc-audio-icon.rc-audio-dictation { background:linear-gradient(135deg,#fef3c7,#ffe4e6); }
.rc-audio-icon img { width:46px; height:46px; object-fit:contain; }
.rc-audio-head .rc-wave { position:static; flex:1; height:30px; opacity:.35; }
.rc-audio-head .rc-free { position:static; box-shadow:none; }
.rc-audio-card .rc-body { padding-top:14px; }
.rc-audio-card h4 a:hover { color:#6d28d9; }