:root{--paper:#F9F6EE;--ink:#4A4A4A;--wine:#783E45;--rose:#C9A9A6;--lavender:#E6E6FA;--plum:#684756;--sage:#CED1C1;--olive:#555b4e;--line:#d7d2c8}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Lora,Georgia,serif;font-size:15px;line-height:1.7}button,input{font:inherit}a{color:inherit;text-decoration:none}button,a,input{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--wine);outline-offset:5px}.topline{background:var(--wine);color:var(--paper);padding:9px 5%;font:10px/1.5 Arial,sans-serif;letter-spacing:1.8px;display:flex;justify-content:space-between}.topline button{background:none;border:0;color:inherit;font-size:11px;letter-spacing:.4px}header{max-width:1400px;margin:auto;padding:30px 5%;display:flex;align-items:center;gap:35px}.brand{display:flex;align-items:center;color:var(--wine);gap:13px}.brand svg{width:65px;height:60px;fill:currentColor}.brand>span{font:italic 41px/1 'Playfair Display',serif}.brand small{display:block;text-align:center;font:11px/1.8 Lora,serif;letter-spacing:6px;margin-top:7px}.header-note{font-size:11px;line-height:1.7;margin-left:22px}.outline{border:1px solid var(--wine);color:var(--wine);background:none;padding:12px 20px;margin-left:auto;font-size:12px}nav{display:flex;gap:38px;justify-content:center;border-block:1px solid var(--line);padding:15px 20px;font-size:12px}nav a{position:relative}nav a.active{color:var(--wine)}nav a.active:after{content:'';position:absolute;bottom:-16px;height:2px;background:var(--wine);left:0;right:0}.soon{font:7px Arial,sans-serif;letter-spacing:1px;background:var(--sage);padding:4px;margin-left:7px}main{max-width:1400px;margin:auto;padding:40px 5% 70px}.eyebrow{font:10px/1.6 Arial,sans-serif;letter-spacing:2px;text-transform:uppercase}.intro-line{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:25px}.intro-line span:last-child{font-style:italic;font-size:12px}h1,h2,h3{font-family:'Playfair Display',Georgia,serif;font-weight:400;line-height:1.15;margin:14px 0 20px}h1{font-size:clamp(40px,4.5vw,67px);letter-spacing:-1.8px}h2{font-size:37px;letter-spacing:-.6px}h3{font-size:25px}p{margin:0 0 20px}.hero{display:grid;grid-template-columns:1.12fr 1fr;min-height:490px}.hero-art{position:relative;overflow:hidden;background:#6b6855}.hero-art img{width:100%;height:100%;position:absolute;object-fit:cover;filter:brightness(.78) saturate(.65)}.image-caption{position:absolute;bottom:22px;left:25px;color:white;font:10px Arial,sans-serif;letter-spacing:2px}.hero-copy{background:var(--sage);padding:48px 45px;display:flex;flex-direction:column;justify-content:center}.hero-copy p{max-width:350px;font-size:14px}.text-link{display:inline-block;font-size:12px;border-bottom:1px solid;padding-bottom:4px;align-self:flex-start}.hero-copy .text-link{margin-top:12px}.section-head{display:flex;justify-content:space-between;align-items:baseline;margin:55px 0 24px;border-bottom:1px solid var(--line);padding-bottom:12px}.section-head h2{font-size:31px;margin:0}.section-head a{font-size:11px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.card{display:block}.card-art{height:245px;position:relative;overflow:hidden;margin-bottom:20px}.card:hover h3,.text-link:hover{color:var(--wine)}.card h3{margin:9px 0 12px}.card p{font-size:12px;line-height:1.8}.meta{font:9px Arial,sans-serif;letter-spacing:1px;text-transform:uppercase}.book-scene{background:var(--rose);display:flex;justify-content:center;align-items:center;gap:12px}.book{height:176px;width:116px;background:var(--wine);color:var(--paper);box-shadow:6px 9px 10px #0002;border-left:5px solid #ffffff25;padding:22px 12px;text-align:center;font:19px/1.2 'Playfair Display',serif;transform:rotate(-9deg);display:flex;flex-direction:column;justify-content:space-between}.book small{font:8px Arial,sans-serif;letter-spacing:1px}.book:nth-child(2){background:var(--paper);color:var(--olive);transform:rotate(9deg)}.card-art.photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.55)}.quote-art{background:var(--lavender);display:flex;align-items:center;justify-content:center;padding:30px;text-align:center;color:var(--plum)}.quote-art span{font:italic 34px/1.3 'Playfair Display',serif}.newsletter-band{margin:60px 0;background:var(--wine);color:var(--paper);padding:38px 45px;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.newsletter-band h2{margin:10px 0;font-size:36px}.newsletter-band p{font-size:12px;margin:0}.signup label{display:block;font-size:11px;margin-bottom:8px}.input-row{display:flex;border-bottom:1px solid currentColor}.input-row input{width:100%;min-width:0;border:0;background:transparent;color:inherit;padding:11px 0;outline-offset:0}.input-row input::placeholder{color:inherit;opacity:.65}.input-row button{white-space:nowrap;background:none;border:0;color:inherit;font-size:12px;padding:8px}.signup .consent{display:flex;gap:8px;align-items:center;margin:12px 0 8px;font-size:10px}.signup small{font-size:9px;opacity:.85}.signup small a{text-decoration:underline}.form-status{font-size:12px!important;margin-top:12px!important}.club-teaser{display:grid;grid-template-columns:1fr 1.15fr;background:var(--lavender)}.club-art{min-height:300px;display:flex;align-items:center;justify-content:center;background:var(--plum);color:var(--lavender);text-align:center;font:italic 53px/1.1 'Playfair Display',serif;position:relative}.club-art:before{content:'✳';position:absolute;font:120px Georgia;opacity:.1}.club-copy{padding:35px 45px}.club-copy p{font-size:13px}.page-intro{max-width:750px;margin:30px auto 55px;text-align:center}.page-intro h1{font-size:64px}.page-intro p{max-width:600px;margin:auto}.page-intro .eyebrow{color:var(--wine)}.values{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin:45px 0}.value{border-top:1px solid var(--wine);padding:22px 0}.value p{font-size:13px}.story-panel{background:var(--sage);padding:55px;max-width:900px;margin:auto}.story-panel p{max-width:680px}.draft-note{font:10px/1.7 Arial,sans-serif;color:var(--olive);border-left:2px solid var(--rose);padding:10px 16px;margin:25px 0}.filters{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:35px}.filters button{background:none;border:1px solid var(--line);padding:8px 16px;font-size:11px}.filters button.selected{background:var(--wine);color:var(--paper);border-color:var(--wine)}.article{max-width:760px;margin:25px auto}.article h1{font-size:53px}.article p{line-height:1.95}.article .card-art{height:330px}.article h2{font-size:30px;margin-top:35px}.club-page{max-width:950px;margin:auto;display:grid;grid-template-columns:1fr 1fr;background:var(--lavender)}.club-page .club-copy{padding:45px}.club-page .club-art{min-height:470px}.club-page h1{font-size:46px}.empty-news{background:var(--sage);padding:40px;margin:35px auto;max-width:850px}.empty-news li{margin:15px 0;font-size:14px}footer{border-top:1px solid var(--line);padding:45px 5% 20px;max-width:1400px;margin:auto}.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;padding-bottom:45px}.footer-brand{font:italic 33px 'Playfair Display',serif;color:var(--wine)}footer p{font-size:11px;margin-top:8px}.footer-top>div>a:not(.footer-brand),.footer-top button{display:block;font-size:11px;margin-top:10px}.footer-top button{border:0;padding:0;background:none;color:inherit}.footer-bottom{border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;font-size:9px}dialog{border:0;padding:48px;max-width:500px;width:calc(100% - 32px);background:var(--lavender);color:var(--plum)}dialog::backdrop{background:#29212277}dialog h2{font-size:43px}dialog p{font-size:13px}.close{position:absolute;right:14px;top:7px;background:none;border:0;color:inherit;font-size:28px}@media(min-width:1500px){.hero{min-height:540px}}@media(max-width:800px){header{padding:25px 5%}.header-note{display:none}nav{gap:20px;flex-wrap:wrap;font-size:11px}.hero-copy{padding:30px}.hero{min-height:430px}h1{font-size:44px}.card-art{height:200px}.grid{gap:18px}.book{width:85px;height:145px;font-size:15px}.newsletter-band{gap:25px;padding:30px}.club-copy{padding:30px}.club-page{grid-template-columns:1fr}.club-page .club-art{min-height:230px}}@media(max-width:580px){.topline{font-size:7px;letter-spacing:1px}.topline button{font-size:8px}header{gap:10px}.brand svg{width:45px}.brand>span{font-size:30px}.outline{font-size:10px;padding:9px}.brand small{font-size:9px}.hero{grid-template-columns:1fr}.hero-art{min-height:310px}.hero-copy{padding:33px}.hero h1{font-size:48px}.intro-line span:last-child{display:none}main{padding-top:25px}.grid{grid-template-columns:1fr;gap:30px}.card-art{height:280px}.card h3{font-size:29px}.book{width:130px;height:200px;font-size:25px}.newsletter-band,.club-teaser{grid-template-columns:1fr;gap:25px}.newsletter-band{padding:30px 25px}.club-teaser{gap:0}.club-art{min-height:220px}.section-head h2{font-size:27px}.page-intro h1{font-size:47px}.values{grid-template-columns:1fr;gap:10px}.story-panel{padding:28px}.footer-top{grid-template-columns:1fr 1fr;gap:30px}.footer-top>div:first-child{grid-column:1/-1}.footer-bottom{gap:15px;flex-wrap:wrap}.article h1{font-size:40px}dialog{padding:40px 25px}}

/* Uppercase brand navigation with the original solid rules. */
nav {
  justify-content: space-between;
  align-items: center;
  gap: 22px;
  padding: 20px 6%;
  border-block: 1px solid var(--line);
  background: none;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(13px, 1.4vw, 20px);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: .3px;
  text-transform: uppercase;
}
nav a { padding: 4px 0; }
nav a:hover { color: var(--wine); }
nav a.active:after { display: none; }
nav .soon { display: none; }
@media (max-width: 800px) {
  nav { justify-content: center; gap: 16px 25px; padding: 18px 5%; font-size: 14px; }
}
@media (max-width: 580px) {
  nav { gap: 12px 22px; font-size: 12px; letter-spacing: -.3px; }
}

/* Center the bookstore identity above the navigation. */
header {
  justify-content: center;
  padding: 30px 5%;
}
header .brand {
  flex-direction: column;
  gap: 8px;
  text-align: center;
}
header .brand svg {
  width: 75px;
  height: 60px;
}
@media (max-width: 580px) {
  header { padding: 24px 5%; }
}

/* Newsletter typography: Lora throughout, with a Playfair Display title. */
#newsletter,
#newsletter .eyebrow,
#newsletter input,
#newsletter button,
#newsletter small,
#newsletter .form-status {
  font-family: Lora, Georgia, serif;
}
#newsletter h2 {
  font-family: "Playfair Display", Georgia, serif;
}
#newsletter .signup small {
  display: block;
  margin-top: 12px;
}

/* Retired homepage introduction, including older cached markup. */
main > .intro-line { display: none; }

/* Newsletter pop-up brand colours. */
#newsletter {
  background: #C9A9A6;
  color: #783E45;
}

/* A quieter editorial layout with generous whitespace. */
header {
  padding: 50px 6% 44px;
}
nav {
  padding: 24px 7%;
  font-weight: 400;
}
main {
  max-width: 1440px;
  padding: 64px 7% 110px;
}
.hero {
  min-height: 520px;
}
.hero-copy {
  padding: 60px 56px;
}
.hero-copy h1 {
  margin: 24px 0 30px;
}
.hero-copy p {
  line-height: 1.95;
}
.section-head {
  margin: 90px 0 36px;
  padding-bottom: 22px;
}
.section-head h2 {
  font-size: 30px;
}
.grid {
  gap: 42px;
}
.card-art {
  margin-bottom: 28px;
}
.card h3 {
  margin: 14px 0 18px;
  line-height: 1.3;
}
.card p {
  line-height: 1.95;
  margin-bottom: 24px;
}
.newsletter-band {
  margin: 100px 0;
  padding: 60px 56px;
  gap: 70px;
}
.newsletter-band h2 {
  margin: 18px 0 22px;
  line-height: 1.25;
}
.club-copy {
  padding: 52px;
}
.club-copy h2 {
  margin: 24px 0;
}
.club-copy p {
  line-height: 1.95;
  margin-bottom: 28px;
}
.page-intro {
  margin: 30px auto 80px;
}
.page-intro h1 {
  margin: 26px 0 32px;
}
.page-intro p {
  line-height: 1.95;
}
.story-panel {
  padding: 70px;
}
.story-panel h2 {
  margin: 24px 0;
}
.story-panel p {
  line-height: 1.95;
  margin-bottom: 40px;
}
.story-panel p:last-child {
  margin-bottom: 0;
}
.values {
  gap: 45px;
  margin: 75px 0;
}
.value {
  padding-top: 30px;
}
.filters {
  margin-bottom: 55px;
}
.article > p {
  margin-bottom: 30px;
}
.article h2 {
  margin-top: 52px;
  margin-bottom: 24px;
}
.empty-news {
  padding: 60px;
}
footer {
  padding: 65px 7% 28px;
}
.footer-top {
  gap: 55px;
  padding-bottom: 65px;
}
.footer-top > div > a:not(.footer-brand),
.footer-top button {
  margin-top: 16px;
}
.footer-bottom {
  padding-top: 26px;
}
@media (max-width: 1000px) {
  .hero-copy { padding: 40px 34px; }
  .grid { gap: 28px; }
  .newsletter-band { padding: 42px 34px; gap: 40px; }
  .club-copy { padding: 36px; }
}
@media (max-width: 580px) {
  header { padding: 34px 6%; }
  nav { padding: 20px 6%; gap: 16px 22px; }
  main { padding: 36px 6% 70px; }
  .hero-copy { padding: 38px 28px; }
  .hero { min-height: auto; }
  .section-head { margin: 60px 0 28px; padding-bottom: 18px; }
  .grid { gap: 48px; }
  .newsletter-band { margin: 65px 0; padding: 36px 26px; gap: 32px; }
  .club-copy { padding: 34px 28px; }
  .page-intro { margin: 20px auto 50px; }
  .story-panel, .empty-news { padding: 32px 26px; }
  .values { margin: 50px 0; gap: 28px; }
  footer { padding: 45px 6% 24px; }
  .footer-top { gap: 34px; padding-bottom: 40px; }
}

/* Keep the brand palette in accents rather than full content panels. */
.hero-copy {
  background: transparent;
  border-top: 3px solid var(--sage);
}
.newsletter-band {
  background: transparent;
  color: var(--ink);
  border-top: 1px solid var(--rose);
  border-bottom: 1px solid var(--line);
}
.newsletter-band .eyebrow,
.newsletter-band .input-row button {
  color: var(--wine);
}
.club-teaser,
.club-page {
  background: transparent;
  border-top: 1px solid var(--lavender);
  border-bottom: 1px solid var(--line);
}
.club-art {
  background: transparent;
  color: var(--plum);
}
.club-art:before {
  color: var(--plum);
}
.story-panel,
.empty-news {
  background: transparent;
  border-top: 2px solid var(--sage);
  border-bottom: 1px solid var(--line);
}
.book-scene {
  background: transparent;
  border-bottom: 2px solid var(--rose);
}
.quote-art {
  background: transparent;
  border-bottom: 2px solid var(--lavender);
}

/* About: mission and vision, with no introductory panel or rules. */
.about-copy {
  max-width: 760px;
  margin: 20px auto 0;
}
.about-copy h1,
.about-copy h2 {
  font-size: 32px;
  letter-spacing: 0;
  margin: 0 0 24px;
}
.about-copy h2 {
  margin-top: 60px;
}
.about-copy p {
  line-height: 1.95;
  margin: 0;
}

/* Book recommendations: a simple shelf of covers and purchase links. */
.book-recs > h1 {
  text-align: center;
  font-size: clamp(30px, 4vw, 48px);
  margin: 20px 0 72px;
}
.book-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 72px 60px;
}
.book-pick img {
  display: block;
  width: 100%;
  height: 320px;
  object-fit: contain;
  object-position: left bottom;
  margin-bottom: 28px;
}
.book-pick h2 {
  font-size: 25px;
  line-height: 1.3;
  margin: 0 0 12px;
}
.book-pick p { font-size: 14px; margin-bottom: 18px; }
@media (max-width: 800px) {
  .book-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 50px 30px; }
  .book-pick img { height: 280px; }
}
@media (max-width: 420px) {
  .book-grid { gap: 40px 20px; }
  .book-pick img { height: 220px; }
  .book-pick h2 { font-size: 21px; }
  .book-pick p { font-size: 12px; }
}

.book-pagination {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 70px;
  padding: 20px 0;
  border: 0;
  background: none;
  font-family: Lora, Georgia, serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}
.book-pagination a { padding: 6px 10px; }
.book-pagination a[aria-current="page"] {
  color: var(--wine);
  border-bottom: 1px solid var(--wine);
}

/* A simple invitation for the forthcoming book club. */
.club-coming-soon {
  min-height: 48vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 50px 0 70px;
}
.club-coming-soon h1 {
  font-size: clamp(58px, 8vw, 112px);
  margin: 0 0 40px;
}
.club-coming-soon .outline { margin: 0; padding: 14px 26px; }
#club-signup { background: var(--paper); color: var(--ink); }
#club-signup .signup small { display: block; margin-top: 14px; }

/* Source-led reading collections, with small colour accents. */
.reading-note {
  border-bottom: 1px solid var(--line);
  padding-bottom: 24px;
  margin-bottom: 44px;
  font-size: 11px;
  line-height: 1.8;
}
.reading-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 64px 70px; }
.reading-card { border-top: 2px solid var(--rose); padding-top: 24px; }
.reading-card:nth-child(3n+2) { border-color: var(--sage); }
.reading-card:nth-child(3n) { border-color: var(--lavender); }
.reading-card h2 { font-size: 29px; line-height: 1.3; margin: 16px 0 20px; }
.reading-card h2 a:hover { color: var(--wine); }
.reading-card .reading-source { font-size: 11px; line-height: 1.9; color: var(--olive); }
.reading-card > p:not(.reading-source) { font-size: 14px; line-height: 1.95; }
.reading-card .text-link { color: var(--wine); }
@media (max-width: 680px) {
  .reading-grid { grid-template-columns: 1fr; gap: 48px; }
  .reading-card h2 { font-size: 27px; }
}

/* Homepage: an editorial lead story and previews from the live collections. */
.home-feature { display: grid; grid-template-columns: 1.2fr 1fr; gap: 54px; align-items: center; }
.feature-image { display: block; }
.feature-image img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.feature-story h1 { font-size: clamp(36px, 4vw, 58px); line-height: 1.16; margin: 24px 0; }
.feature-story h1 a:hover, .home-article h3 a:hover { color: var(--wine); }
.feature-story > p:not(.preview-source) { font-size: 14px; line-height: 1.95; }
.preview-source { font-size: 10px; line-height: 1.8; color: var(--olive); }
.home-news-layout { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 42px; align-items: start; }
.home-article .preview-image { display: block; margin-bottom: 26px; }
.preview-image img { display: block; width: 100%; aspect-ratio: 3/2; object-fit: cover; }
.home-article h3 { font-size: 28px; line-height: 1.3; margin: 16px 0 22px; }
.home-article > p:not(.preview-source) { font-size: 13px; line-height: 1.95; }
.home-news-layout .home-article:not(:first-child) { border-top: 2px solid var(--rose); padding-top: 24px; }
.home-news-layout .home-article:last-child { border-color: var(--lavender); }
.home-activism-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; }
.home-article .eyebrow, .feature-story .eyebrow { color: var(--wine); }
@media (max-width: 900px) {
  .home-feature { gap: 32px; }
  .home-news-layout { gap: 28px; }
  .home-article h3 { font-size: 24px; }
  .home-activism-layout { gap: 32px; }
}
@media (max-width: 680px) {
  .home-feature, .home-news-layout, .home-activism-layout { grid-template-columns: 1fr; gap: 44px; }
  .feature-story h1 { font-size: 46px; }
  .home-reading .section-head { gap: 20px; }
  .home-reading .section-head h2 { font-size: 25px; }
  .home-reading .section-head > a { white-space: nowrap; }
  .home-article h3 { font-size: 28px; }
}

/* News begins directly with the article previews beneath its heading. */
.reading-collection-news .reading-grid > .reading-card:nth-child(-n+2) {
  border-top: 0;
  padding-top: 0;
}
@media (max-width: 680px) {
  .reading-collection-news .reading-grid > .reading-card:nth-child(2) {
    border-top: 2px solid var(--sage);
    padding-top: 24px;
  }
}

/* Activism uses an unruled article list beneath its title. */
.reading-collection-activism .reading-grid > .reading-card {
  border-top: 0;
  padding-top: 0;
}

/* Footer wordmark follows the lettering and stacked layout of the logo. */
.footer-brand {
  display: inline-block;
  text-align: center;
  font: italic 41px/1 "Playfair Display", Georgia, serif;
  color: var(--wine);
}
.footer-brand small {
  display: block;
  text-align: center;
  font: 11px/1.8 Lora, Georgia, serif;
  letter-spacing: 6px;
  margin-top: 7px;
}
.footer-brand + p { margin-top: 18px; }
@media (max-width: 580px) {
  .footer-brand { font-size: 30px; }
  .footer-brand small { font-size: 9px; }
}

.footer-brand + p {
  font-family: Lora, Georgia, serif;
  font-size: 11px;
  color: var(--wine);
}

.footer-top > div:first-child {
  justify-self: start;
  text-align: center;
}
.footer-brand + p {
  text-align: center;
  text-transform: uppercase;
}

.footer-brand + p {
  font-size: 9px;
  margin-top: 26px;
}

/* Keep every footer label, link, and control in the brand typefaces. */
footer,
footer .eyebrow,
footer button,
footer .footer-bottom {
  font-family: Lora, Georgia, serif;
}
footer .footer-brand {
  font-family: "Playfair Display", Georgia, serif;
}
footer .footer-brand small {
  font-family: Lora, Georgia, serif;
}

/* Article supporting text consistently uses Lora across all previews and pages. */
.home-article,
.feature-story,
.reading-card,
.article,
.card {
  font-family: Lora, Georgia, serif;
}
.home-article .eyebrow,
.feature-story .eyebrow,
.reading-collection .eyebrow,
.article .eyebrow,
.card .eyebrow,
.article .meta,
.card .meta,
.article .draft-note,
.preview-source,
.reading-source,
.reading-note {
  font-family: Lora, Georgia, serif;
}
.home-article h3,
.feature-story h1,
.reading-card h2,
.article h1,
.article h2,
.card h3 {
  font-family: "Playfair Display", Georgia, serif;
}

.about-copy p {
  font-family: Lora, Georgia, serif;
}

.book-pick p,
.book-pick .text-link {
  font-family: Lora, Georgia, serif;
}

.club-coming-soon [data-club-signup],
#club-signup button[type="submit"] {
  font-family: Lora, Georgia, serif;
}

/* Both sign-up dialogs use Lora, except for their large titles. */
#newsletter,
#newsletter p,
#newsletter label,
#newsletter input,
#newsletter button,
#newsletter small,
#newsletter a,
#newsletter .eyebrow,
#club-signup,
#club-signup p,
#club-signup label,
#club-signup input,
#club-signup button,
#club-signup small,
#club-signup a,
#club-signup .eyebrow {
  font-family: Lora, Georgia, serif;
}
#newsletter h2,
#club-signup h2 {
  font-family: "Playfair Display", Georgia, serif;
}

/* Align footer category headings and link rows on a shared grid. */
.footer-top {
  align-items: start;
}
.footer-top > div:not(:first-child) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: minmax(24px, auto);
  row-gap: 12px;
  align-content: start;
  justify-items: start;
  text-align: left;
}
.footer-top > div:not(:first-child) > .eyebrow {
  line-height: 24px;
  margin: 0 0 8px;
}
.footer-top > div:not(:first-child) > a,
.footer-top > div:not(:first-child) > button {
  margin: 0;
  padding: 0;
  line-height: 24px;
  text-align: left;
}

/* Keep corresponding links level across the two footer columns. */
.footer-top > div:not(:first-child) {
  grid-template-rows: 32px repeat(4, 24px);
  grid-auto-rows: 24px;
}
.footer-top > div:not(:first-child) > .eyebrow {
  grid-row: 1;
  margin: 0;
  white-space: nowrap;
}
.footer-top > div:not(:first-child) > a:nth-child(2) {
  grid-row: 2;
}
.footer-top > div:not(:first-child) > a:nth-child(3) {
  grid-row: 3;
}

/* Balance the waitlist button's text against its outline. */
.club-coming-soon [data-club-signup] {
  font-size: 15px;
  line-height: 1.4;
  padding: 10px 20px;
}

.oruguita-coming-soon {
  min-height: 48vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 50px 0 70px;
  text-align: center;
}
.oruguita-coming-soon h1 {
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(44px, 6vw, 84px);
  line-height: 1.2;
  margin: 0;
}
.footer-top > div:not(:first-child) {
  grid-template-rows: 32px repeat(5, minmax(24px, auto));
}

/* Keep footer links and the main navigation labels on single lines. */
.footer-top > div:not(:first-child) > a,
.footer-top > div:not(:first-child) > button {
  white-space: nowrap;
  font-size: 10px;
}
nav[aria-label="Main navigation"] {
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: clamp(12px, 2vw, 28px);
  padding-inline: 5%;
  font-size: clamp(11px, 1.3vw, 18px);
  white-space: nowrap;
  overflow-x: auto;
}
nav[aria-label="Main navigation"] > a {
  flex: 0 0 auto;
}
@media (max-width: 580px) {
  nav[aria-label="Main navigation"] {
    gap: 18px;
    font-size: 11px;
  }
  .footer-top {
    column-gap: 20px;
  }
}

/* Accommodate the longer project label in the single-row navigation. */
nav[aria-label="Main navigation"] {
  align-items: center;
  gap: clamp(10px, 1.6vw, 24px);
  font-size: clamp(11px, 1.2vw, 17px);
}

/* Free writing resources, with quiet accents and clear download links. */
.tools-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 60px 70px;
  max-width: 1000px;
  margin: auto;
}
.writing-tool { border: 0; padding-top: 0; }
.writing-tool h2 { font-family: "Playfair Display", Georgia, serif; font-size: 30px; }
.writing-tool p,
.writing-tool a,
.tool-pending { font-family: Lora, Georgia, serif; }
.writing-tool p { font-size: 14px; line-height: 1.95; }
.tool-pending { font-size: 12px; color: var(--olive); }
@media (max-width: 680px) {
  .tools-grid { grid-template-columns: 1fr; gap: 40px; }
}

/* One heading scale across every page, including both About statements. */
:root { --page-heading-size: clamp(40px, 5vw, 64px); }
#main h1,
#main .about-copy h2 {
  font-family: "Playfair Display", Georgia, serif;
  font-size: var(--page-heading-size);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -.8px;
}

/* Actual PDF first pages: click to view, or download below. */
.pdf-preview {
  display: block;
  margin: 26px 0 22px;
  border: 1px solid var(--line);
  background: white;
}
.pdf-preview img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1.414;
  object-fit: contain;
  object-position: top center;
}
.pdf-preview span {
  display: block;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  color: var(--wine);
  background: var(--paper);
  font: 12px/1.5 Lora, Georgia, serif;
}
.pdf-preview:hover { border-color: var(--wine); }

/* Small, individually clickable previews of every PDF page. */
.pdf-page-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px 10px;
  margin: 26px 0;
  align-items: start;
}
.pdf-page-thumb { display: block; text-align: center; }
.pdf-page-thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1.414;
  object-fit: contain;
  object-position: top;
  border: 1px solid var(--line);
  background: white;
}
.pdf-page-thumb:hover img { border-color: var(--wine); }
.pdf-page-thumb span {
  display: block;
  margin-top: 5px;
  font: 9px/1.5 Lora, Georgia, serif;
  color: var(--olive);
}

/* Center each preview group and its final row, excluding PDF covers. */
.pdf-page-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 14px 10px;
}
.pdf-page-thumb {
  flex: 0 0 calc((100% - 30px) / 4);
  max-width: 110px;
}

/* Six-page worksheets: two centered rows of three previews. */
.pdf-page-grid-three .pdf-page-thumb {
  flex-basis: calc((100% - 20px) / 3);
}
.pdf-page-grid-three {
  max-width: 350px;
  margin-inline: auto;
}

/* Explicit worksheet rows: pages 2–4, then pages 5–7. */
.pdf-page-grid.pdf-page-grid-three {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 110px));
  justify-content: center;
  gap: 14px 10px;
  max-width: 350px;
  margin-inline: auto;
}
.pdf-page-grid-three .pdf-page-thumb {
  width: 100%;
  max-width: none;
  min-width: 0;
}

/* Preserve each PDF page's real proportions without added white padding. */
.pdf-page-thumb img {
  aspect-ratio: auto;
  height: auto;
  background: transparent;
}

/* Center the recommendation shelf and keep editorial preview rows balanced. */
.book-pick { text-align: center; display: flex; flex-direction: column; align-items: center; }
.book-pick img { object-position: center bottom; }
.book-pick .text-link { align-self: center; margin-top: auto; }
.home-news-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 64px 56px; }
.home-news-layout .home-article:not(:first-child) { border-top: 0; padding-top: 0; }
.footer-instagram { display: inline-flex; justify-content: center; color: var(--wine); padding: 8px; margin-top: 10px; }
.footer-instagram svg { width: 20px; height: 20px; }
.footer-instagram:hover { opacity: .7; }
@media(max-width:680px) { .home-news-layout { grid-template-columns: 1fr; } }