/* A warm family publication: clear hierarchy, real photography and quiet surfaces.
   Extends the existing brand without changing content or interaction behavior. */
body.compass-elevated.compass-scrapbook {
  --scrap-paper: #fffcf6;
  --scrap-ink: #23364b;
  --publication-line: #dce2e2;
  --publication-muted: #52616e;
  --publication-pink: #f9e9ef;
  --publication-mint: #e9f3ef;
  --publication-shadow: 0 8px 24px #23364b08;
  background: var(--scrap-paper);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  line-height: 1.75;
}
body.compass-elevated.compass-scrapbook :is(h1,h2,h3,h4) {
  color: var(--scrap-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 500;
  letter-spacing: -.025em;
  line-height: 1.2;
}
body.compass-elevated.compass-scrapbook .eyebrow {
  color: var(--publication-muted);
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .1em;
  line-height: 1.6;
}
body.compass-elevated.compass-scrapbook .top {
  background: #edf5f4;
  border-bottom-color: var(--publication-line);
  font-size: .75rem;
  letter-spacing: .08em;
  padding: 7px 16px;
}
body.compass-elevated.compass-scrapbook .site-header {
  border-bottom-color: var(--publication-line);
  padding: 10px 24px 16px;
  gap: 12px 20px;
}
body.compass-elevated.compass-scrapbook #site-navigation a {
  background: transparent;
  border: 1px solid transparent;
  border-radius: 10px;
  box-shadow: none;
  color: var(--scrap-ink);
  font-size: .9375rem;
  font-weight: 600;
  padding: 10px 12px;
  line-height: 1.4;
}
body.compass-elevated.compass-scrapbook #site-navigation a:hover,
body.compass-elevated.compass-scrapbook #site-navigation a[aria-current] {
  background: var(--publication-pink);
  border-color: #edd5de;
  box-shadow: none;
  color: var(--scrap-ink);
  transform: none;
}
body.compass-elevated.compass-scrapbook .site-header .explore-nav {
  background: var(--publication-mint);
  border: 1px solid #c7dcd3;
  border-radius: 12px;
  box-shadow: none;
  min-height: 44px;
  font-size: .875rem;
  font-weight: 650;
}
body.compass-elevated.compass-scrapbook .explore-nav .compass-nav-icon { width: 30px; height: 28px; }
body.compass-elevated.compass-scrapbook .compass-utilities a {
  border-color: transparent;
  background: transparent;
  border-radius: 10px;
  font-size: .875rem;
  padding: 9px 10px;
}
body.compass-elevated.compass-scrapbook .compass-utilities a:hover { background: #edf5f4; }

/* The photograph and headline lead; paper textures stay in the actual artwork. */
body.compass-elevated.compass-scrapbook .editorial-hero {
  background: transparent;
  background-image: none;
  grid-template-columns: 1.05fr 1fr;
  gap: 44px;
  padding: 42px 0 44px;
  margin: 0 0 36px;
  border-bottom: 1px solid var(--publication-line);
}
body.compass-elevated.compass-scrapbook .hero-copy > .eyebrow {
  background: transparent;
  padding: 0;
  transform: none;
}
body.compass-elevated.compass-scrapbook .hero-copy h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.2rem, 4.8vw, 4rem);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.1;
  margin: 18px 0 24px;
  max-width: none;
}
body.compass-elevated.compass-scrapbook .hero-copy h1 .hero-city { background: none; padding: 0; }
body.compass-elevated.compass-scrapbook .hero-copy h1 em {
  color: #854457;
  font-family: inherit;
  font-style: italic;
  font-weight: 500;
  letter-spacing: inherit;
  line-height: inherit;
}
body.compass-elevated.compass-scrapbook .hero-copy p { color: var(--publication-muted); font-size: 1.0625rem; line-height: 1.75; }
body.compass-elevated.compass-scrapbook .hero-photo {
  background: transparent;
  border: 0;
  border-radius: 20px;
  box-shadow: none;
  transform: none;
  padding: 0;
  margin: 0;
  width: 100%;
}
body.compass-elevated.compass-scrapbook .hero-photo::before,
body.compass-elevated.compass-scrapbook .about-portrait::before { content: none; }
body.compass-elevated.compass-scrapbook .hero-photo img { aspect-ratio: 4/3; border-radius: 20px; object-position: 55% center; }
body.compass-elevated.compass-scrapbook .home-actions { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
body.compass-elevated.compass-scrapbook .home-actions a {
  background: #fff;
  border: 1px solid var(--publication-line);
  border-radius: 12px;
  box-shadow: none;
  font-size: .875rem;
  padding: 12px 10px;
  min-height: 68px;
}
body.compass-elevated.compass-scrapbook .home-actions a:last-child { background: var(--publication-mint); }
body.compass-elevated.compass-scrapbook .home-actions small { font-size: .8125rem; color: var(--publication-muted); }
body.compass-elevated.compass-scrapbook .hero-signoff { display: block; font-size: .875rem; margin-top: 20px; color: var(--publication-muted); }

/* Consistent magazine cards, while retaining the existing content grids. */
body.compass-elevated.compass-scrapbook :is(.fresh-card,.card,.library-card,.printable-card,.find-card,.guide-topic,.guide-feature,.edition-list a,.compass-result,.buddy-resource) {
  background: #fff;
  border-color: var(--publication-line);
  border-radius: 16px;
  box-shadow: var(--publication-shadow);
  transform: none;
}
body.compass-elevated.compass-scrapbook[data-compass-home] .fresh-card {
  background: #fff;
  padding: 12px 12px 20px;
  gap: 12px;
}
body.compass-elevated.compass-scrapbook[data-compass-home] .fresh-card img { border-radius: 10px; }
body.compass-elevated.compass-scrapbook[data-compass-home] .fresh-card span {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: -.025em;
  line-height: 1.25;
}
body.compass-elevated.compass-scrapbook[data-compass-home] .fresh-card small { font-size: .875rem; line-height: 1.6; }
body.compass-elevated.compass-scrapbook :is(.card .content,.find-copy,.guide-topic-copy) { background: #fff; }
body.compass-elevated.compass-scrapbook .card:hover { transform: none; box-shadow: 0 10px 28px #23364b10; }
body.compass-elevated.compass-scrapbook .sectionline { border-color: var(--publication-line); padding-top: 28px; }
body.compass-elevated.compass-scrapbook .sectionline h2 { font-family: Georgia,serif; font-weight: 500; font-size: clamp(1.8rem,3vw,2.25rem); letter-spacing: -.025em; }
body.compass-elevated.compass-scrapbook :is(.finder-home-callout,.buddy-promo,.plan-links>a,.family-resource-callouts>a,.social-discovery,.sponsor,.shef-partner,.guide-map-note,.party-cover,.founding-partner) {
  border-color: var(--publication-line);
  border-radius: 18px;
  box-shadow: none;
}
body.compass-elevated.compass-scrapbook .finder-home-callout { background: #edf5f4; }
body.compass-elevated.compass-scrapbook .buddy-promo { background: var(--publication-pink); }
body.compass-elevated.compass-scrapbook .plan-links>a { background: #edf5f4; }
body.compass-elevated.compass-scrapbook .plan-links>a:nth-child(2) { background: var(--publication-pink); }
body.compass-elevated.compass-scrapbook .plan-links>a:nth-child(3) { background: #f1f5e9; }
body.compass-elevated.compass-scrapbook :is(.plan-links h2,.finder-home-callout h2,.buddy-promo h2,.family-resource-callouts h2,.guide-map-note h2) {
  font-family: Georgia,serif;
  font-weight: 500;
  font-size: clamp(1.5rem,2.8vw,2rem);
  letter-spacing: -.025em;
}
body.compass-elevated.compass-scrapbook .finder-home-callout>.compass-accent { width: 82px; height: 82px; justify-self: center; }
body.compass-elevated.compass-scrapbook .family-resource-callouts .compass-accent { width: 64px; height: 64px; }
body.compass-elevated.compass-scrapbook .sponsor { background: var(--publication-pink); }
body.compass-elevated.compass-scrapbook .halloween-feature { background: #faf1e2; border-color: #eadfca; border-radius: 18px; box-shadow: none; }

/* Discover, print and shop: one headline system and fewer competing textures. */
body.compass-elevated.compass-scrapbook :is(.guides-intro,.resource-intro,.finds-cover,.buddy-welcome) {
  background: #fff;
  background-image: none;
  border-color: var(--publication-line);
  border-radius: 20px;
  padding: 32px;
}
body.compass-elevated.compass-scrapbook :is(.guides-intro h1,.resource-intro h1,.buddy-welcome h1),
body.compass-elevated.compass-scrapbook .family-finds-magazine .finds-cover h1,
body.compass-elevated.compass-scrapbook [data-compass-hub]>h1 {
  font-family: Georgia,serif;
  font-weight: 500;
  font-size: clamp(2.2rem,4.5vw,3.5rem);
  letter-spacing: -.035em;
  line-height: 1.12;
}
body.compass-elevated.compass-scrapbook .resource-intro { padding-right: 132px; }
body.compass-elevated.compass-scrapbook .resource-intro>.compass-accent { width: 82px; height: 82px; top: 32px; right: 24px; }
body.compass-elevated.compass-scrapbook .family-finds-magazine .finds-cover h1 em { color: #854457; font-style: italic; }
body.compass-elevated.compass-scrapbook .finds-cover-art { border-color: #edd5de; border-radius: 18px; box-shadow: none; }
body.compass-elevated.compass-scrapbook .family-finds-magazine :is(.finds-section-heading h3,.resource-section-heading h2) {
  font-family: Georgia,serif;
  font-weight: 500;
  letter-spacing: -.025em;
}
body.compass-elevated.compass-scrapbook .printable-preview { background-image: none; padding: 26px; }
body.compass-elevated.compass-scrapbook .printable-preview img { transform: none; box-shadow: 0 6px 20px #23364b14; }
body.compass-elevated.compass-scrapbook .guide-map-note { background: var(--publication-mint); }
body.compass-elevated.compass-scrapbook :is(.guide-chooser-controls,.buddy-form,.buddy-chat,.partnership-form) { border-color: var(--publication-line); box-shadow: none; }
body.compass-elevated.compass-scrapbook .guide-topic[aria-pressed=true] { border-color: #854457; box-shadow: 0 0 0 2px #854457; }

/* Erika's introduction retains her actual portrait and clear partnership links. */
body.compass-elevated.compass-scrapbook .about-layout {
  background: #fff;
  background-image: none;
  border-color: var(--publication-line);
  border-radius: 20px;
  grid-template-columns: minmax(0,250px) minmax(0,1fr);
  gap: 32px;
  padding: 32px;
}
body.compass-elevated.compass-scrapbook .about-portrait { padding: 0; margin: 0; border: 0; box-shadow: none; transform: none; max-width: 250px; }
body.compass-elevated.compass-scrapbook .about-portrait img { border-radius: 16px; }
body.compass-elevated.compass-scrapbook .about-copy { padding: 0; border: 0; background: transparent; box-shadow: none; }
body.compass-elevated.compass-scrapbook .about-copy h1 { font-family: Georgia,serif; font-size: clamp(2.2rem,4.2vw,3.2rem); font-weight: 500; }

/* Buddy remains a recognizable sidekick without dominating the reading surface. */
body.compass-elevated.compass-scrapbook .buddy-launcher {
  background: #edf5f4;
  border-color: #b8d2cf;
  box-shadow: 0 4px 16px #23364b14;
  min-height: 52px;
  padding: 5px 14px 5px 7px;
  gap: 8px;
  font-size: .875rem;
  font-weight: 600;
}
body.compass-elevated.compass-scrapbook .buddy-launcher img { width: 40px; height: 40px; }
body.compass-elevated.compass-scrapbook .buddy-dialog { background: #fffcf6; border-color: var(--publication-line); box-shadow: 0 18px 56px #23364b30; border-radius: 18px; }
body.compass-elevated.compass-scrapbook .buddy-dialog-top { background: #edf5f4; padding: 12px 14px; }
body.compass-elevated.compass-scrapbook .buddy-dialog-top h2 { font-family: Georgia,serif; font-size: 1.5rem; font-weight: 500; }
body.compass-elevated.compass-scrapbook .buddy-close { border: 1px solid #b5c6c7; background: #fff; min-height: 48px; min-width: 84px; border-radius: 10px; }
body.compass-elevated.compass-scrapbook .buddy-plan-heading { background: var(--publication-pink); border-color: #edd5de; }
body.compass-elevated.compass-scrapbook :is(.button,.shef-button,.finder-home-callout .read,.buddy-build,.guide-pick-button) { border-radius: 12px; box-shadow: none; min-height: 46px; }
body.compass-elevated.compass-scrapbook footer { background: #edf5f4; border-color: var(--publication-line); padding-bottom: 86px; }
body.compass-elevated.compass-scrapbook footer .footer-brand strong { font-family: Georgia,serif; font-weight: 500; }
body.compass-elevated.compass-scrapbook :is(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid #854457; outline-offset: 4px; }

@media(min-width:1024px) {
  body.compass-elevated.compass-scrapbook .site-header { display: grid; grid-template-columns: 88px auto minmax(0,1fr) auto; align-items: center; }
  body.compass-elevated.compass-scrapbook .site-header .brand-logo { width: 88px; margin: 0; grid-column: 1; grid-row: 1; }
  body.compass-elevated.compass-scrapbook .site-header .explore-nav { grid-column: 2; grid-row: 1; }
  body.compass-elevated.compass-scrapbook .site-header #site-navigation { display: flex; flex-wrap: wrap; justify-content: center; grid-column: 3; grid-row: 1; width: auto; margin: 0; gap: 2px; }
  body.compass-elevated.compass-scrapbook .site-header #site-navigation a { font-size: .875rem; padding: 10px; }
  body.compass-elevated.compass-scrapbook .site-header .compass-utilities { grid-column: 4; grid-row: 1; gap: 2px; }
}
@media(max-width:900px) {
  body.compass-elevated.compass-scrapbook .editorial-hero { gap: 26px; }
  body.compass-elevated.compass-scrapbook .about-layout { grid-template-columns: minmax(0,210px) minmax(0,1fr); gap: 24px; padding: 26px; }
}
@media(max-width:760px) {
  body.compass-elevated.compass-scrapbook .site-header { padding: 8px 16px 12px; gap: 8px 10px; }
  body.compass-elevated.compass-scrapbook .site-header .brand-logo { width: 68px; }
  body.compass-elevated.compass-scrapbook .site-header #site-navigation { gap: 8px; }
  body.compass-elevated.compass-scrapbook #site-navigation a { padding: 12px 8px; min-height: 48px; border-color: var(--publication-line); background: #fff; }
  body.compass-elevated.compass-scrapbook #site-navigation a[aria-current] { background: var(--publication-pink); }
  body.compass-elevated.compass-scrapbook .editorial-hero { grid-template-columns: 1fr; gap: 24px; padding: 28px 0 32px; margin-bottom: 30px; }
  body.compass-elevated.compass-scrapbook .hero-copy h1 { font-size: clamp(2.2rem,7.6vw,3.5rem); margin: 16px 0 18px; }
  body.compass-elevated.compass-scrapbook .hero-photo { width: 100%; max-width: none; margin: 0; padding: 0; transform: none; }
  body.compass-elevated.compass-scrapbook .hero-photo img { aspect-ratio: 16/9; object-position: 55% 58%; border-radius: 16px; }
  body.compass-elevated.compass-scrapbook .home-actions a { min-height: 52px; font-size: .875rem; padding: 10px 7px; }
  body.compass-elevated.compass-scrapbook .home-actions small { display: none; }
  body.compass-elevated.compass-scrapbook :is(.guides-intro,.resource-intro,.finds-cover,.buddy-welcome) { padding: 22px; }
  body.compass-elevated.compass-scrapbook .resource-intro { padding-right: 22px; }
  body.compass-elevated.compass-scrapbook .resource-intro>.compass-accent { position: static; float: none; width: 48px; height: 48px; margin: 0 0 12px; }
  body.compass-elevated.compass-scrapbook .resource-intro>p { margin-right: 0; }
  body.compass-elevated.compass-scrapbook :is(.guides-intro h1,.resource-intro h1,.buddy-welcome h1),
  body.compass-elevated.compass-scrapbook .family-finds-magazine .finds-cover h1 { font-size: clamp(2.1rem,7vw,3rem); }
  body.compass-elevated.compass-scrapbook .family-finds-magazine .finds-cover-copy>.compass-accent { width: 52px; height: 52px; }
  body.compass-elevated.compass-scrapbook .finder-home-callout>.compass-accent { width: 60px; height: 60px; }
  body.compass-elevated.compass-scrapbook .family-resource-callouts .compass-accent { width: 52px; height: 52px; }
  body.compass-elevated.compass-scrapbook .about-layout { grid-template-columns: 1fr; gap: 24px; padding: 24px; }
  body.compass-elevated.compass-scrapbook .about-portrait { max-width: 190px; justify-self: center; }
  body.compass-elevated.compass-scrapbook .buddy-launcher { right: 12px; padding-right: 12px; }
  body.compass-elevated.compass-scrapbook .buddy-launcher span { max-width: none; line-height: 1.4; }
}
@media(max-width:380px) {
  body.compass-elevated.compass-scrapbook .home-actions { grid-template-columns: 1fr; }
  body.compass-elevated.compass-scrapbook .home-actions a { display: block; min-height: 44px; padding: 10px 14px; text-align: left; }
}
@media(prefers-reduced-motion:reduce) {
  body.compass-elevated.compass-scrapbook .card { transition: none; }
}
@media print {
  body.compass-elevated.compass-scrapbook :is(.buddy-launcher,.buddy-dialog,.site-header,.compass-utilities) { display: none !important; }
  body.compass-elevated.compass-scrapbook :is(.card,.library-card,.buddy-resource) { box-shadow: none; }
}

/* Practical next steps use the same quiet editorial language as the rest of the site. */
body.compass-elevated.compass-scrapbook .buddy-starts {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid #e6ced7;
}
body.compass-elevated.compass-scrapbook .buddy-starts a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  min-height: 88px;
  padding: 16px;
  background: #fff;
  border: 1px solid #e6ced7;
  border-radius: 12px;
  color: var(--scrap-ink);
  text-decoration: none;
  line-height: 1.5;
}
body.compass-elevated.compass-scrapbook .buddy-starts strong { font-size: 1rem; }
body.compass-elevated.compass-scrapbook .buddy-starts span { font-size: .875rem; color: var(--publication-muted); }
body.compass-elevated.compass-scrapbook .buddy-starts a:hover { border-color: #854457; background: #fffcf6; }
body.compass-elevated.compass-scrapbook :is(.compass-help,.compass-approach,.compass-contact) {
  margin-top: 36px;
  padding: 30px;
  border: 1px solid var(--publication-line);
  border-radius: 18px;
  background: #fff;
}
body.compass-elevated.compass-scrapbook :is(.compass-help,.compass-approach,.compass-contact) h2 { font-size: clamp(1.8rem,3.1vw,2.3rem); margin: 10px 0 16px; }
body.compass-elevated.compass-scrapbook :is(.compass-help,.compass-approach,.compass-contact) p { font-size: 1rem; line-height: 1.8; max-width: 68ch; }
body.compass-elevated.compass-scrapbook .compass-help-questions { margin-top: 22px; }
body.compass-elevated.compass-scrapbook .compass-help-questions details { padding: 0; border-top: 1px solid var(--publication-line); }
body.compass-elevated.compass-scrapbook .compass-help-questions summary { cursor: pointer; padding: 18px 4px; font-size: 1rem; font-weight: 600; line-height: 1.6; }
body.compass-elevated.compass-scrapbook .compass-help-questions details p { margin: 0 4px 18px; }
body.compass-elevated.compass-scrapbook .compass-approach { background: #edf5f4; }
body.compass-elevated.compass-scrapbook .compass-approach-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px; }
body.compass-elevated.compass-scrapbook .compass-approach-grid h3 { font-size: 1.35rem; line-height: 1.35; margin: 12px 0; }
body.compass-elevated.compass-scrapbook .compass-contact { display: grid; grid-template-columns: minmax(0,1fr) minmax(190px,.45fr); align-items: center; gap: 30px; }
body.compass-elevated.compass-scrapbook .compass-contact-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; line-height: 1.65; }
body.compass-elevated.compass-scrapbook .compass-contact-actions>a:last-child { font-size: .875rem; }
body.compass-elevated.compass-scrapbook .guide-contents { margin: 26px 0 32px; padding: 0 18px; border: 1px solid #c7dcd3; border-radius: 12px; background: #edf5f4; }
body.compass-elevated.compass-scrapbook .guide-contents summary { font-size: 1rem; font-weight: 600; cursor: pointer; min-height: 48px; padding: 12px 0; line-height: 1.65; }
body.compass-elevated.compass-scrapbook .guide-contents nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 20px; margin: 0; padding: 0 0 16px; }
body.compass-elevated.compass-scrapbook .guide-contents nav a { display: flex; align-items: center; margin: 0; min-height: 44px; font-size: .9375rem; line-height: 1.6; text-align: left; text-underline-offset: 3px; }
body.compass-elevated.compass-scrapbook main :is(h2[id],section[id]) { scroll-margin-top: 24px; }
body.compass-elevated.compass-scrapbook .compass-footer-library { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; max-width: 1096px; margin: 24px auto 0; padding-top: 24px; border-top: 1px solid #cadcda; text-align: left; }
body.compass-elevated.compass-scrapbook .compass-footer-library nav { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 2px; margin: 0; }
body.compass-elevated.compass-scrapbook .compass-footer-library strong { font-size: 1rem; font-weight: 600; margin-bottom: 10px; }
body.compass-elevated.compass-scrapbook .compass-footer-library a { display: flex; align-items: center; min-height: 44px; margin: 0; font-size: .9375rem; line-height: 1.6; text-decoration: none; }
body.compass-elevated.compass-scrapbook .compass-footer-library a:hover { text-decoration: underline; text-underline-offset: 3px; }
@media(max-width:760px) {
  body.compass-elevated.compass-scrapbook .buddy-starts { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  body.compass-elevated.compass-scrapbook .buddy-starts a { padding: 12px; min-height: 100px; }
  body.compass-elevated.compass-scrapbook :is(.compass-help,.compass-approach,.compass-contact) { padding: 22px; margin-top: 26px; }
  body.compass-elevated.compass-scrapbook :is(.compass-approach-grid,.compass-contact) { grid-template-columns: 1fr; gap: 18px; }
  body.compass-elevated.compass-scrapbook .guide-contents nav { grid-template-columns: 1fr; gap: 2px; }
  body.compass-elevated.compass-scrapbook .compass-footer-library { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 16px; }
  body.compass-elevated.compass-scrapbook .compass-footer-library nav:last-child { grid-column: 1/-1; }
}
@media(max-width:380px) {
  body.compass-elevated.compass-scrapbook .buddy-starts { grid-template-columns: 1fr; }
  body.compass-elevated.compass-scrapbook .buddy-starts a { min-height: 72px; }
}
@media print {
  body.compass-elevated.compass-scrapbook :is(.guide-contents,.compass-footer-library) { display: none !important; }
}
