/* Home tuned for notebook viewports, preserving readable body text. */
body { padding-block: 10px; }
.site-shell { width: min(1380px, calc(100% - 48px)); }
.site-shell .wrap { width: calc(100% - 48px); max-width: 1280px; }
.utility > .wrap { min-height: 26px; }
.utility, .utility a { font-size: 11px; }
.brandbar { min-height: 78px; padding-block: 7px; gap: 18px; }
.brand img.brand-emblem { width: 64px; height: 64px; }
.brand img.brand-wordmark { width: 235px; }
.brand { gap: 12px; }
.header-social { gap: 7px; }
.header-social a { width: 28px; }
.header-social svg { width: 21px; height: 21px; }
#search { width: 310px; min-width: 290px; }
.navigation a, .navigation summary { padding-block: 9px; font-size: 13px; }
.navigation summary > a { padding: 0; }
.navigation details > div a { font-size: 14px; padding: 9px 13px; }

.facade-hero { height: 180px; grid-template-columns: 40% 60%; margin-block: 12px 14px; }
.facade-copy { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 16px 28px; }
.facade-copy .eyebrow { font-size: 11px; letter-spacing: 1.2px; }
.facade-copy h1 { font-size: 35px; line-height: 1.08; margin: 8px 0 9px; }
.facade-copy .text-link { margin: 0; padding-top: 0; padding-bottom: 3px; font-size: 13px; }
.facade-hero figure > img { object-fit: cover; object-position: center; }
.facade-hero figcaption { bottom: 11px; left: 18px; right: 18px; }
.facade-hero figcaption b { font-size: 20px; }
.facade-hero figcaption > span { font-size: 11px; }

.portal-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.highlights { gap: 9px; }
.banner-controls { padding: 4px 9px; }
#banner-label { font-size: 12px; }
.slide-actions > button { width: 25px; height: 25px; }
.map-highlight { height: 82px; min-height: 0; flex: none; grid-template-columns: 45% 55%; }
.map-highlight > span { padding: 7px 16px; }
.map-highlight .eyebrow { display: none; }
.map-highlight h2 { font-size: 22px; margin: 0 0 4px; line-height: 1.1; }
.map-cta { font-size: 13px; }
.portal-grid .section-intro { margin-bottom: 8px; }
.portal-grid .section-intro h2 { font-size: 24px; line-height: 1.2; }
.portal-grid .section-intro > span { font-size: 12px; }
.portal-grid .service-grid { height: calc(100% - 37px); }
.portal-grid .service { padding: 11px 13px; gap: 6px; min-height: 0; }
.portal-grid .service svg { width: 22px; height: 22px; }
.portal-grid .service strong { font-size: 14px; line-height: 1.25; }
.portal-grid .service .arrow { top: 10px; right: 12px; font-size: 14px; }

.quick-explore { padding-block: 13px 15px; }
.quick-grid { gap: 16px; }
.quick-image { height: 100px; }
.quick-card h3 { font-size: 14px; margin-top: 6px; line-height: 1.35; }
.quick-image.station-full { background: transparent; }
.quick-image.station-full img { object-fit: cover; object-position: center 73%; }
.quick-card:hover .station-full img { transform: scale(1.03); }
.shop-real { background: #f2f0ed; display: flex; align-items: center; justify-content: center; position: relative; gap: 8px; padding: 5px 8px 20px; }
.shop-books { display: flex; align-items: center; justify-content: center; gap: 5px; width: 100%; height: 100%; }
.shop-books img { width: 30%; height: 100%; object-fit: cover; object-position: center; background: white; }
.shop-real > span { position: absolute; bottom: 3px; font-size: 11px; color: var(--brown); font-weight: 600; letter-spacing: .3px; }
.acervo-card { flex-direction: row; justify-content: center; align-items: center; gap: 12px; padding: 10px 12px; text-align: left; background: #8c456a; }
.acervo-card img.cdcc-official { width: 73px; height: 75px; object-fit: contain; flex: none; }
.acervo-card > div { display: flex; flex-direction: column; gap: 4px; }
.acervo-card strong { font: 22px/1.1 Georgia, serif; color: white; }
.acervo-card > div > span { font-size: 11px; line-height: 1.35; color: white; }

.footer-main { grid-template-columns: 85px 1.35fr 1fr 1.05fr 125px; gap: 24px; padding-block: 15px; }
.footer-brand img { width: 84px; height: 84px; }
.footer-main h3 { font-size: 13px; margin-bottom: 5px; }
.footer-main p, .footer-main a { font-size: 12px; line-height: 1.65; }
.footer-address p { line-height: 1.65; }
.footer-phone { margin-top: 3px; }
.city { width: 120px; height: 123px; }
.footer-social-icons { display: grid; grid-template-columns: repeat(3, 25px); gap: 10px 16px; margin-top: 10px; }
.footer-social-icons a { display: grid; place-items: center; color: #73533f; width: 25px; height: 25px; }
.footer-social-icons svg { width: 21px; height: 21px; stroke-width: 1.9; }
.footer-social-icons a:hover { color: #3e2b1f; }
.footer-bottom { padding-block: 9px; }

@media (min-width: 761px) and (max-width: 1150px) {
  .site-shell { width: calc(100% - 30px); }
  .site-shell .wrap { width: calc(100% - 36px); }
  .brandbar { gap: 10px; }
  .brand img.brand-emblem { width: 58px; height: 58px; }
  .brand img.brand-wordmark { width: 205px; }
  .header-social { gap: 4px; }
  .header-social a { width: 25px; }
  #search { width: 280px; min-width: 280px; }
  .facade-copy { padding-inline: 22px; }
  .facade-copy h1 { font-size: 33px; }
  .portal-grid .section-intro h2 { font-size: 22px; }
  .portal-grid .service { padding: 10px; }
  .portal-grid .service strong { font-size: 13px; }
  .map-highlight > span { padding-inline: 12px; }
  .map-highlight h2 { font-size: 21px; }
  .acervo-card { gap: 8px; padding: 9px; }
  .acervo-card img.cdcc-official { width: 55px; height: 62px; }
  .acervo-card strong { font-size: 20px; }
  .footer-main { grid-template-columns: 80px 1.2fr 1fr 1fr 100px; gap: 17px; }
  .city { width: 100px; height: 110px; }
  .footer-social-icons { gap: 9px; }
}

@media (max-width: 760px) {
  .site-shell { width: calc(100% - 20px); }
  .site-shell .wrap { width: calc(100% - 28px); }
  .brandbar { min-height: 0; gap: 12px; padding-block: 12px; }
  .brand img.brand-emblem { width: 52px; height: 52px; }
  .brand img.brand-wordmark { width: 165px; }
  .brand { gap: 8px; }
  #search { width: 100%; min-width: 0; }
  .header-social { gap: 15px; }
  .header-social a { width: 28px; }
  .header-social svg { width: 23px; height: 23px; }
  .navigation a, .navigation summary { font-size: 15px; padding-block: 10px; }
  .navigation summary > a { padding: 0; }
  .facade-hero { grid-template-columns: 1fr; height: auto; margin-block: 13px 17px; }
  .facade-copy { padding: 20px; }
  .facade-copy h1 { font-size: 33px; }
  .facade-hero figure { height: 140px; }
  .facade-hero figure > img { object-position: center; }
  .facade-hero figcaption { left: 12px; right: 12px; bottom: 10px; }
  .facade-hero figcaption b { font-size: 19px; }
  .facade-hero figcaption > span { font-size: 10px; }
  .portal-grid { grid-template-columns: 1fr; gap: 18px; }
  .map-highlight { height: 110px; grid-template-columns: 44% 56%; }
  .map-highlight h2 { font-size: 22px; }
  .map-highlight > span { padding: 11px; }
  .map-cta { font-size: 13px; }
  .portal-grid .section-intro h2 { font-size: 24px; }
  .portal-grid .service-grid { height: auto; }
  .portal-grid .service { min-height: 101px; padding: 13px 10px; gap: 8px; }
  .portal-grid .service strong { font-size: 13px; }
  .quick-explore { padding-block: 18px; }
  .quick-grid { gap: 18px 14px; }
  .quick-image { height: 115px; }
  .shop-real { padding-inline: 4px; }
  .shop-books { gap: 3px; }
  .shop-books img { width: 31%; }
  .acervo-card { flex-direction: column; gap: 4px; text-align: center; padding: 8px; }
  .acervo-card img.cdcc-official { width: 46px; height: 47px; }
  .acervo-card > div { gap: 3px; }
  .acervo-card strong { font-size: 20px; }
  .acervo-card > div > span { font-size: 10px; }
  .footer-main { grid-template-columns: 80px 1fr; gap: 20px 18px; padding-block: 20px; }
  .footer-brand img { width: 76px; height: 76px; }
  .footer-main p, .footer-main a { font-size: 13px; }
  .footer-address { grid-column: 2; }
  .footer-main > div:nth-of-type(3), .footer-connections { grid-column: 1 / -1; }
  .footer-social-icons { display: flex; gap: 17px; }
  .footer-social-icons svg { width: 23px; height: 23px; }
  .city { grid-column: 1 / -1; justify-self: center; width: 120px; height: 130px; }
  .footer-bottom { padding-block: 12px; }
}

/* Accessibility preferences take precedence over the compact composition. */
.larger-text .facade-hero { height: auto; min-height: 210px; }
.larger-text .portal-grid .service-grid { height: auto; }
.larger-text .portal-grid .service { min-height: 100px; }
.larger-text .portal-grid .service strong { font-size: 17px; }
.larger-text .footer-main p, .larger-text .footer-main a { font-size: 16px; }
@media (min-width: 761px) {
  body { padding-block: 8px; }
  .brandbar { min-height: 72px; padding-block: 4px; }
  .navigation a, .navigation summary { padding-block: 7px; }
  .navigation summary > a { padding: 0; }
  .navigation details > div a { padding: 9px 13px; }
  .facade-hero { height: 170px; margin-bottom: 10px; }
  .facade-hero figure > img { width: 103%; max-width: none; margin-left: 0; object-position: left top; }
  .banner-controls { padding-block: 3px; }
  .quick-image { height: 92px; }
  .acervo-card img.cdcc-official { height: 68px; }
  .larger-text .facade-hero { height: auto; min-height: 210px; }
}
@media (prefers-reduced-motion: reduce) { .quick-card:hover img { transform: none; } }

.shop-cart-card { display: flex; align-items: center; justify-content: center; padding: 0; gap: 9px; background: #f8ecdf; }
.shop-cart-card > img { width: 58%; height: 100%; object-fit: contain; flex: none; }
.shop-cart-card > span { font: 21px/1.15 Georgia, serif; color: #73533f; }
.quick-card:hover .shop-cart-card > img { transform: none; }
.footer-social-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 15px; margin-top: 7px; }
.footer-social-links a { font-size: 12px; line-height: 1.6; color: var(--brown); text-decoration: none; }
.footer-social-links a:hover, .footer-social-links a:focus-visible { text-decoration: underline; }
@media (min-width: 761px) {
  .navigation a, .navigation summary { font-size: 14px; padding-block: 10px; }
  .navigation summary > a { padding: 0; }
  .navigation details > div a { padding: 9px 13px; }
}
@media (min-width: 761px) and (max-width: 1150px) {
  .navigation > .wrap { gap: 8px; }
  .navigation a, .navigation summary { font-size: 13px; }
  .shop-cart-card > span { font-size: 18px; }
  .footer-social-links { gap: 4px 9px; }
}
@media (max-width: 760px) {
  .shop-cart-card { gap: 3px; }
  .shop-cart-card > img { width: 60%; }
  .shop-cart-card > span { font-size: 17px; }
  .footer-social-links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 20px; }
  .footer-social-links a { font-size: 14px; }
}