/* Image-led public browsing. The longer articles and activity instructions stay available. */
.category-card { min-height: 0; padding: 16px; }
.category-top { margin-bottom: 12px; }
.category-card .card-image {
  display: block; width: 100%; height: 150px; object-fit: cover;
  border-radius: 8px; background: #ebe5db;
}
.category-card h3 { margin: 15px 0 7px; font-size: 1.45rem; }
.category-card p { margin-bottom: 12px; line-height: 1.45; }
.category-card .explore { padding-top: 5px; }
.shop-media-geography { position: relative; display: block; }
.shop-media-geography img { padding: 0; object-fit: cover; }
.shop-media-geography span {
  position: absolute; left: 16px; bottom: 16px; padding: 9px 12px;
  background: #fffdf6; color: var(--burgundy-dark); font: 700 1.15rem/1.1 Georgia, serif;
}
.shop-media-geography .image-disclosure { position: absolute; top: 12px; right: 12px; margin: 0; padding: 5px 7px; background: #fffdf6; color: var(--burgundy-dark); font: 700 .65rem/1 var(--control-font, sans-serif); letter-spacing: .05em; text-transform: uppercase; }
.geography-card .image-disclosure { display: block; margin: 0 0 10px; color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; }
.shop-details p { min-height: 0; }
.free-grid a { min-height: 0; padding: 16px; }
.free-grid .free-image {
  display: block; width: 100%; height: 150px; margin-bottom: 16px;
  object-fit: cover; object-position: center; border-radius: 8px; background: #e8e1d8;
}
.free-grid h3 { margin: 10px 0 7px; }
.free-grid p { margin: 0 0 18px; }
.blog-links { gap: 16px; }
.blog-links a { display: flex; flex-direction: column; gap: 9px; padding: 0 0 14px; }
.blog-links a img { display: block; width: 100%; height: 125px; object-fit: cover; border-radius: 7px; }
.blog-links a span { margin-top: auto; }

/* Blog index */
.blog-hero {
  max-width: var(--max); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
  column-gap: 42px; align-items: center; padding-block: 54px 32px;
}
.blog-hero > .eyebrow, .blog-hero > h1, .blog-hero > p, .blog-hero > .topic-nav { grid-column: 1; }
.hero-figure { margin: 0; }
.hero-figure figcaption { padding-top: 6px; color: var(--muted); font-size: .7rem; text-align: right; }
.blog-hero h1 { max-width: 620px; margin: 8px 0 16px; font-size: clamp(2.7rem, 5vw, 4.2rem); }
.blog-hero > p:not(.eyebrow) { max-width: 520px; margin: 0; }
.blog-hero .hero-figure { grid-column: 2; grid-row: 1 / 5; }
.blog-hero .blog-hero-image {
  width: 100%; height: 360px;
  object-fit: cover; border-radius: 4px;
}
.blog-hero .topic-nav { margin-top: 18px; }
.post-list { padding-top: 8px; }
.post-category { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.post-category > h2 { grid-column: 1 / -1; margin: 12px 0 4px; }
.post-card, .post-card + .post-card { max-width: none; margin: 0; padding: 18px; }
.post-card-image { display: block; width: 100%; height: 180px; object-fit: cover; border-radius: 10px; margin-bottom: 16px; }
.post-card h2 { font-size: clamp(1.45rem, 2.5vw, 2rem); margin: 8px 0 10px; }
.post-card p:not(.post-meta) { margin: 0; font-size: .92rem; line-height: 1.5; }
.post-card .post-link { margin-top: 10px; }
.post-body .inline-visual { margin: 36px 0; }
.post-body .inline-visual img { display: block; width: 100%; max-height: 380px; object-fit: cover; border-radius: 12px; }
.post-body .inline-visual figcaption { padding-top: 5px; color: var(--muted); font: 400 .72rem/1.4 var(--control-font, sans-serif); text-align: right; }

/* Hands-on activities */
.hands-hero { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1fr); gap: 34px; align-items: center; margin-bottom: 40px; }
.hands-hero h1 { font-size: clamp(2.6rem, 5vw, 4rem); line-height: 1.05; }
.hands-hero .lead { margin-bottom: 18px; }
.hands-hero .hero-figure img { display: block; width: 100%; height: 340px; object-fit: cover; border-radius: 12px; }
.handson .ho-card { padding: 18px; }
.handson .ho-card p { font-size: .9rem; line-height: 1.5; }
.handson .ho-card .product-preview { height: 170px; aspect-ratio: auto; object-fit: cover; }
.activity { overflow: hidden; }
.activity-image { display: block; float: right; width: min(38%, 310px); height: 210px; margin: 0 0 16px 22px; object-fit: cover; border-radius: 10px; }
.activity-details { clear: both; margin-top: 18px; border-top: 1px solid var(--line); padding-top: 12px; }
.activity-details summary { cursor: pointer; color: var(--burgundy-dark); font-weight: 800; min-height: 44px; padding: 10px 0; }
.activity-details summary:focus-visible { outline: 3px solid var(--burgundy); outline-offset: 3px; }
.activity-details[open] summary { margin-bottom: 8px; }

/* Shop previews */
.shop-hero {
  max-width: var(--max); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
  column-gap: 42px; align-items: center; text-align: left; padding-block: 50px 30px;
}
.shop-hero > .eyebrow, .shop-hero > h1, .shop-hero > p { grid-column: 1; }
.shop-hero h1 { margin: 8px 0 14px; font-size: clamp(2.7rem, 5vw, 4.2rem); }
.shop-hero > p:not(.eyebrow) { margin: 0; }
.shop-hero .hero-figure { grid-column: 2; grid-row: 1 / 4; }
.shop-hero-image { display: block; width: 100%; height: 330px; object-fit: cover; border-radius: 4px; }
.schedule-builder { margin-bottom: 32px; border: 1px solid var(--line); background: var(--surface); border-radius: 12px; }
.schedule-builder summary { min-height: 54px; padding: 15px 20px; cursor: pointer; font-weight: 800; color: var(--burgundy-dark); }
.schedule-builder summary:focus-visible { outline: 3px solid var(--burgundy); outline-offset: 3px; }
.schedule-builder > div { padding: 0 20px 20px; text-align: center; }
.schedule-builder iframe { display: block; max-width: 760px; width: 100%; height: 900px; margin: auto; border: 0; }
.new-resources { display: flow-root; }
.new-resources > h2 { margin: 0 0 18px; font-size: clamp(2rem, 4vw, 3rem); }
.resource-card { display: flow-root; border-radius: 14px; background: var(--surface); }
.resource-card img.resource-card-image { display: block; float: left; width: 190px; height: 190px; max-width: 42%; margin: 0 24px 12px 0; object-fit: cover; border-radius: 9px; background: #f0eae0; }
.geography-card img.resource-card-image { width: 360px; height: 240px; }
.resource-card h3 { margin-top: 0; }
.resource-card .resource-actions { margin-bottom: 0; }
.purchase-pause { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); color: var(--burgundy-dark); font: 700 .86rem/1.35 var(--control-font, sans-serif); }
.lego-hero-photo { display: block; width: 100%; height: 240px; margin: 20px 0 24px; object-fit: cover; border-radius: 14px; }
.lego-pack-cover { display: block; width: min(100%, 260px); height: auto; margin: 14px auto 24px; border-radius: 10px; }
.lvl-card .level-preview { display: block; width: 100%; height: 150px; margin-bottom: 16px; object-fit: cover; border-radius: 9px; }
.purchase-gate .gate-cover { display: block; width: min(100%, 560px); height: auto; max-height: 270px; margin: 18px auto 24px; object-fit: contain; border-radius: 10px; }

@media (max-width: 800px) {
  .blog-hero, .shop-hero, .hands-hero { grid-template-columns: 1fr; gap: 22px; }
  .blog-hero .hero-figure, .shop-hero .hero-figure { grid-column: 1; grid-row: auto; }
  .blog-hero .blog-hero-image, .shop-hero-image { height: 270px; }
  .post-category { grid-template-columns: 1fr; }
  .hands-hero .hero-figure img { height: 270px; }
}
@media (max-width: 520px) {
  .category-card .card-image, .free-grid .free-image { height: 160px; }
  .blog-links { grid-template-columns: 1fr 1fr; }
  .blog-links a img { height: 100px; }
  .activity-image { float: none; width: 100%; max-width: none; height: 190px; margin: 0 0 16px; }
  .resource-card img.resource-card-image { float: none; width: 100%; height: 220px; max-width: none; margin: 0 0 18px; }
  .shop-hero, .blog-hero { padding-top: 38px; }
}