.free-resources-page {
  --serif: var(--losp-font-heading);
  --gold-light: var(--losp-gold-light);
  --free-navy: #071f3a;
  --free-red: #762b2e;
  --free-gold: #b9954b;
  --free-paper: #fffdf8;
  --free-cream: #f7f1e6;
  --free-ink: #262722;
  --free-muted: #67675f;
  background: var(--free-paper);
  color: var(--free-ink);
}

.free-resources-page .page-width {
  width: min(calc(100% - (2 * var(--losp-gutter))), var(--losp-content));
  margin-inline: auto;
}

.free-resources-page .is-current {
  color: var(--free-red);
}

.free-hero {
  min-height: 430px;
  padding: 28px max(32px, calc((100vw - 1180px) / 2));
  display: grid;
  grid-template-columns: minmax(360px, .88fr) minmax(520px, 1.12fr);
  align-items: center;
  gap: 48px;
  overflow: hidden;
  position: relative;
  background:
    radial-gradient(circle at 76% 42%, rgba(215, 189, 122, .16), transparent 21rem),
    linear-gradient(150deg, #fffdf8 0%, #fbf6ec 100%);
}

.free-hero::after {
  content: "";
  position: absolute;
  width: 510px;
  height: 510px;
  right: 6.8%;
  top: 8%;
  border: 1px solid rgba(185, 149, 75, .2);
  border-radius: 50%;
}

.free-hero-copy,
.free-hero-art {
  position: relative;
  z-index: 2;
}

.free-hero h1 {
  color: var(--free-red);
  font-size: clamp(66px, 6vw, 96px);
  line-height: .94;
}

.free-deck {
  max-width: 580px;
  margin: 27px 0 20px;
  color: var(--free-navy);
  font: 500 clamp(24px, 2.2vw, 31px)/1.34 var(--serif);
}

.free-hero-copy > p:not(.eyebrow):not(.free-deck) {
  max-width: 630px;
  margin: 0 0 27px;
  color: #4f504a;
  font-size: 18px;
  line-height: 1.72;
}

.free-text-link {
  display: inline-flex;
  gap: 12px;
  color: var(--free-red);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .11em;
  text-decoration: none;
  text-transform: uppercase;
}

.free-hero-art {
  height: 470px;
}

.hero-free-book {
  position: absolute;
  display: block;
  box-shadow: 0 22px 45px rgba(34, 28, 18, .2);
  transition: transform 180ms ease;
}

.hero-free-book:hover,
.hero-free-book:focus-visible {
  transform: translateY(-7px);
}

.hero-free-book img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-free-book--1 {
  width: 202px;
  height: 303px;
  left: 3%;
  top: 105px;
  transform: rotate(-5deg);
}

.hero-free-book--1:hover,
.hero-free-book--1:focus-visible {
  transform: rotate(-5deg) translateY(-7px);
}

.hero-free-book--2 {
  width: 222px;
  height: 333px;
  left: 31%;
  top: 45px;
  z-index: 2;
}

.hero-free-book--3 {
  width: 202px;
  height: 303px;
  right: 1%;
  top: 105px;
  transform: rotate(5deg);
}

.hero-free-book--3:hover,
.hero-free-book--3:focus-visible {
  transform: rotate(5deg) translateY(-7px);
}

.gift-medallion {
  position: absolute;
  display: grid;
  place-items: center;
  width: 104px;
  height: 104px;
  right: 3%;
  top: 1px;
  z-index: 4;
  border: 1px solid rgba(185, 149, 75, .45);
  border-radius: 50%;
  background: rgba(255, 253, 248, .9);
  box-shadow: 0 12px 35px rgba(42, 35, 25, .1);
}

.gift-medallion span {
  display: grid;
  place-items: center;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: var(--free-navy);
}

.gift-medallion img {
  width: 42px;
  height: 42px;
  filter: brightness(0) invert(1);
}

.free-rule {
  display: flex;
  align-items: center;
  gap: 16px;
  color: var(--free-gold);
}

.free-rule::before,
.free-rule::after {
  content: "";
  height: 1px;
  flex: 1;
  background: rgba(185, 149, 75, .24);
}

.free-rule span {
  font-size: 11px;
}

.free-books-section {
  padding: 28px 0;
}

.free-section-heading {
  max-width: 760px;
  margin: 0 0 24px;
}

.free-section-heading h2,
.listen-copy h2,
.online-intro h2,
.free-library-return h2 {
  color: var(--free-red);
  font: 500 clamp(44px, 4.2vw, 64px)/1.02 var(--serif);
  letter-spacing: -.025em;
}

.free-section-heading > p:last-child,
.online-intro > p:last-child,
.free-library-return > p {
  margin: 22px 0 0;
  color: var(--free-muted);
  font-size: 18px;
  line-height: 1.72;
}

.free-book-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}

.free-book-card {
  min-width: 0;
  padding: 24px;
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 24px;
  flex: 1;
  text-decoration: none;
  background: transparent;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.free-book-card:hover,
.free-book-card:focus-visible {
  border-color: rgba(118, 43, 46, .35);
  box-shadow: 0 18px 40px rgba(42, 35, 25, .09);
  transform: translateY(-4px);
}

.free-cover {
  height: 220px;
  display: grid;
  place-items: center;
  margin-bottom: 0;
}

.free-cover img {
  max-width: 100%;
  max-height: 220px;
  box-shadow: 0 16px 30px rgba(29, 24, 17, .18);
}

.free-cover--framed img {
  outline: 1px solid rgba(91, 68, 38, .12);
}

.free-book-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.resource-type {
  margin-bottom: 12px;
  color: var(--free-gold);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .19em;
  text-transform: uppercase;
}

.free-book-copy strong {
  color: var(--free-navy);
  font: 500 29px/1.08 var(--serif);
}

.free-book-copy em {
  min-height: 0;
  margin: 9px 0 15px;
  color: var(--free-red);
  font: 400 17px/1.38 var(--serif);
}

.free-book-copy > span:not(.resource-type):not(.quiet-link) {
  color: var(--free-muted);
  font-size: 15px;
  line-height: 1.65;
}

.free-book-copy .quiet-link {
  margin-top: auto;
  padding-top: 24px;
  color: var(--free-red);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.listen-feature {
  padding: 88px 0;
  background:
    radial-gradient(circle at 25% 50%, rgba(185, 149, 75, .16), transparent 20rem),
    var(--free-navy);
  color: #f7f1e6;
}

.listen-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  align-items: center;
  gap: 90px;
}

.listen-emblem {
  min-height: 370px;
  display: grid;
  place-items: center;
  position: relative;
}

.sound-ring {
  position: absolute;
  border: 1px solid rgba(215, 189, 122, .35);
  border-radius: 50%;
}

.sound-ring--outer {
  width: 350px;
  height: 350px;
}

.sound-ring--inner {
  width: 270px;
  height: 270px;
  border-color: rgba(215, 189, 122, .22);
}

.sound-lotus {
  width: 190px;
  height: 190px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 253, 248, .96);
  box-shadow: 0 25px 60px rgba(0, 0, 0, .24);
}

.sound-lotus img {
  width: 104px;
  height: 104px;
}

.listen-copy .eyebrow {
  color: var(--gold-light);
}

.listen-copy h2 {
  color: #fffaf0;
}

.listen-copy h2 em {
  font-weight: 500;
}

.listen-lead {
  margin: 23px 0 16px;
  color: var(--gold-light);
  font: 400 25px/1.45 var(--serif);
}

.listen-copy > p:not(.eyebrow):not(.listen-lead):not(.preparation-note) {
  max-width: 700px;
  color: rgba(255, 253, 248, .82);
  font-size: 18px;
  line-height: 1.75;
}

.preparation-note {
  width: fit-content;
  margin-top: 27px;
  padding-top: 15px;
  border-top: 1px solid rgba(215, 189, 122, .3);
  color: rgba(255, 253, 248, .58);
  font-size: 12px;
  font-style: italic;
}

.excerpt-section {
  padding-block: 30px;
}

.free-section-heading--center {
  margin-inline: auto;
  text-align: center;
}

.excerpt-plan {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid rgba(185, 149, 75, .28);
  border-bottom: 1px solid rgba(185, 149, 75, .28);
}

.excerpt-plan > div {
  min-height: 245px;
  padding: 35px 34px;
  border-right: 1px solid rgba(185, 149, 75, .2);
}

.excerpt-plan > div:last-child {
  border-right: 0;
}

.excerpt-number {
  color: var(--free-gold);
  font: 500 13px/1 var(--serif);
}

.excerpt-plan h3 {
  margin: 28px 0 13px;
  color: #34352f;
  font: 500 28px/1.08 var(--serif);
}

.excerpt-plan p {
  margin: 0;
  color: var(--free-muted);
  font-size: 15px;
  line-height: 1.68;
}

.online-reading {
  padding: 28px 0;
  background: #f4ecde;
}

.online-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 40px;
  align-items: center;
}

.online-links {
  border-top: 1px solid rgba(118, 43, 46, .25);
}

.online-links a {
  min-height: 104px;
  padding: 22px 0;
  display: grid;
  grid-template-columns: 155px 1fr auto;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid rgba(118, 43, 46, .18);
  text-decoration: none;
}

.online-links a > span {
  color: var(--free-gold);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.online-links strong {
  color: var(--free-navy);
  font: 500 23px/1.2 var(--serif);
}

.online-links b {
  color: var(--free-red);
  font-size: 22px;
  font-weight: 400;
  transition: transform 160ms ease;
}

.online-links a:hover b,
.online-links a:focus-visible b {
  transform: translateX(5px);
}

.free-library-return {
  padding-block: 28px;
  text-align: center;
}

.free-library-return > p {
  max-width: 720px;
  margin-inline: auto;
}

.free-library-return .losp-button {
  margin-top: 30px;
}

.free-resources-page a:focus-visible {
  outline: 3px solid rgba(118, 43, 46, .42);
  outline-offset: 5px;
}

@media (max-width: 1050px) {
  .free-hero {
    grid-template-columns: 1fr;
    gap: 22px;
    padding-top: 28px;
  }

  .free-hero-copy {
    max-width: 760px;
  }

  .free-hero-art {
    width: min(650px, 100%);
    margin-inline: auto;
  }

  .free-book-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .listen-grid,
  .online-grid {
    gap: 54px;
  }
}

@media (max-width: 760px) {
  .free-hero {
    min-height: auto;
    padding: 28px 24px;
  }

  .free-hero h1 {
    font-size: clamp(56px, 17vw, 74px);
  }

  .free-hero-art {
    height: 365px;
  }

  .hero-free-book--1,
  .hero-free-book--3 {
    width: 142px;
    height: 213px;
    top: 106px;
  }

  .hero-free-book--2 {
    width: 164px;
    height: 246px;
    left: calc(50% - 82px);
    top: 62px;
  }

  .gift-medallion {
    width: 82px;
    height: 82px;
    right: 1%;
  }

  .gift-medallion span {
    width: 60px;
    height: 60px;
  }

  .gift-medallion img {
    width: 34px;
    height: 34px;
  }

  .free-books-section,
  .excerpt-section,
  .free-library-return {
    padding-block: 24px;
  }

  .free-book-grid,
  .listen-grid,
  .online-grid,
  .excerpt-plan {
    grid-template-columns: 1fr;
  }

  .free-cover {
    height: 220px;
  }

  .listen-feature,
  .online-reading {
    padding-block: 24px;
  }

  .listen-grid {
    gap: 30px;
  }

  .listen-emblem {
    min-height: 290px;
  }

  .sound-ring--outer {
    width: 278px;
    height: 278px;
  }

  .sound-ring--inner {
    width: 216px;
    height: 216px;
  }

  .sound-lotus {
    width: 154px;
    height: 154px;
  }

  .sound-lotus img {
    width: 86px;
    height: 86px;
  }

  .excerpt-plan > div {
    min-height: auto;
    border-right: 0;
    border-bottom: 1px solid rgba(185, 149, 75, .2);
  }

  .excerpt-plan > div:last-child {
    border-bottom: 0;
  }

  .online-links a {
    grid-template-columns: 1fr auto;
    gap: 8px 18px;
  }

  .online-links a > span {
    grid-column: 1 / -1;
  }
}

@media (max-width: 480px) {
  .hero-free-book--1 {
    left: -8%;
  }

  .hero-free-book--3 {
    right: -8%;
  }

  .free-section-heading h2,
  .listen-copy h2,
  .online-intro h2,
  .free-library-return h2 {
    font-size: 43px;
  }

  .free-book-card {
    padding-inline: 21px;
  }
}
/* Free-resource components only; Book Template v2 and global tokens are unchanged. */
.free-book-entry { min-width: 0; display:flex; flex-direction:column; background:#fbf7ef; border:1px solid rgba(128,94,43,.18); }
.free-book-downloads { display:flex; flex-wrap:wrap; gap:10px; padding:0 24px 24px; margin:0; }
.free-download { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:9px 16px; border:1px solid #2a4267; color:#2a4267; font:600 14px/1.3 var(--losp-font-ui,Inter,sans-serif); text-decoration:none; }
.free-download:hover,.free-download:focus-visible { background:#2a4267; color:#fff; }
.free-audio-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.free-audio-card { min-width:0; display:flex; flex-direction:column; border-top:1px solid rgba(128,94,43,.3); padding-top:20px; }
.free-audio-source { display:flex; align-items:center; gap:16px; margin-bottom:16px; }
.free-audio-source img { width:82px; height:90px; object-fit:contain; }
.free-audio-source a { color:#2a4267; font:600 15px/1.4 var(--losp-font-ui,Inter,sans-serif); }
.free-audio-source .resource-type { margin:0 0 8px; }
.free-audio-card h3 { color:var(--free-navy); font:500 30px/1.1 var(--serif); margin:0 0 12px; }
.free-audio-card > p { font:400 16px/1.6 var(--losp-font-ui,Inter,sans-serif); color:var(--free-muted); margin:0 0 18px; }
.free-audio-card audio { display:block; width:100%; min-width:0; height:54px; margin-top:auto; }
.free-audio-card > .free-text-link { margin-top:14px; min-height:44px; align-items:center; }
.free-reading-image { margin:0; }
.free-reading-image img { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; }
.free-pathways { list-style:none; margin:20px 0 0; padding:0; }
.free-pathways li { padding:9px 0; border-bottom:1px solid rgba(128,94,43,.2); font:500 16px/1.45 var(--losp-font-ui,Inter,sans-serif); }
.free-pathways a { color:#2a4267; text-decoration-thickness:1px; text-underline-offset:4px; }
.free-resources-page .online-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:24px; }
.free-resources-page .online-links a { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:10px; min-height:100px; padding:16px 0; }
.free-library-return .losp-button--navy { margin-top:28px; background:#2a4267; border-color:#2a4267; color:white; }
.free-library-return .losp-button--navy:hover,.free-library-return .losp-button--navy:focus-visible { background:#203653; border-color:#203653; }
@media(min-width:1051px) { .free-hero-art { height:350px; } .hero-free-book--1,.hero-free-book--3 { width:166px; height:249px; top:72px; } .hero-free-book--2 { width:188px; height:282px; top:35px; } }
@media(max-width:1050px) { .free-book-card { grid-template-columns:1fr; gap:16px; } .free-audio-grid { grid-template-columns:1fr; } .free-audio-card { display:grid; grid-template-columns:190px minmax(0,1fr); gap:8px 24px; } .free-audio-source { grid-row:1 / 5; align-self:start; } .free-audio-card audio { margin:0; } }
@media(max-width:760px) { .free-book-card { grid-template-columns:110px minmax(0,1fr); padding:20px; gap:18px; } .free-cover { height:180px; } .free-cover img { max-height:180px; } .free-book-copy strong { font-size:27px; } .free-book-downloads { padding:0 20px 20px; } .free-audio-card { display:flex; } .free-resources-page .online-links { grid-template-columns:1fr; gap:0; } .online-grid { gap:24px; } }
@media(max-width:400px) { .free-book-card { grid-template-columns:1fr; } .free-cover { height:200px; } .free-cover img { max-height:200px; } }


/* Free Resources photographic hero — 2026-09-15 */
.free-resources-page .free-hero {
  align-items: center;
  background-color: #f7f1e6;
  background-image: linear-gradient(90deg, rgba(255,253,248,.34) 0%, rgba(255,253,248,.16) 42%, rgba(255,253,248,0) 58%), url('https://lospstage.wpenginepowered.com/wp-content/uploads/2026/09/freebie-books-hero.png');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  min-height: clamp(430px, 32vw, 500px);
  padding: 42px max(32px, calc((100vw - 1180px) / 2));
}
.free-resources-page .free-hero::after { display: none; }
.free-resources-page .free-hero-copy {
  max-width: min(600px, 45vw);
  width: 100%;
}
.free-resources-page .free-hero h1 { font-size: clamp(60px, 5.3vw, 86px); }
.free-resources-page .free-deck { font-size: clamp(22px, 1.85vw, 29px); margin: 22px 0 16px; max-width: 550px; }
.free-resources-page .free-hero-copy > p:not(.eyebrow):not(.free-deck) { font-size: 17px; line-height: 1.62; margin-bottom: 22px; max-width: 550px; }
@media (max-width: 760px) {
  .free-resources-page .free-hero {
    align-items: flex-start;
    background-image: url('https://lospstage.wpenginepowered.com/wp-content/uploads/2026/09/freebie-books-hero.png');
    background-position: center bottom;
    background-size: 100% auto;
    display: flex;
    min-height: 0;
    padding: 34px 24px calc(33.333vw + 24px);
  }
  .free-resources-page .free-hero-copy { max-width: none; }
  .free-resources-page .free-hero h1 { font-size: clamp(50px, 15vw, 66px); }
  .free-resources-page .free-deck { font-size: 22px; margin: 18px 0 14px; }
  .free-resources-page .free-hero-copy > p:not(.eyebrow):not(.free-deck) { font-size: 16px; line-height: 1.58; margin-bottom: 18px; }
}

.free-resources-page .free-hero { box-sizing: border-box; }
@media (min-width: 761px) {
  .free-resources-page .free-hero-copy,
  .free-resources-page .free-deck,
  .free-resources-page .free-hero-copy > p:not(.eyebrow):not(.free-deck) { max-width: 470px; }
}

.free-resources-page .free-hero { box-sizing: border-box; }
@media (min-width: 761px) {
  .free-resources-page .free-hero-copy,
  .free-resources-page .free-deck,
  .free-resources-page .free-hero-copy > p:not(.eyebrow):not(.free-deck) { max-width: 470px; }
}

/* Free Resources hero text-width correction — 2026-09-15 */
@media (min-width: 761px) {
  .free-resources-page .free-hero-copy {
    flex: 0 0 min(36vw, 470px);
    max-width: min(36vw, 470px);
    width: min(36vw, 470px);
  }
  .free-resources-page .free-deck,
  .free-resources-page .free-hero-copy > p:not(.eyebrow):not(.free-deck) {
    max-width: 100%;
  }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .free-resources-page .free-hero h1 {
    font-size: clamp(46px, 5.5vw, 60px);
    line-height: 1;
  }
}

@media (min-width: 761px) and (max-width: 820px) {
  .free-resources-page .free-hero-copy {
    flex-basis: 33vw;
    max-width: 33vw;
    width: 33vw;
  }
}



/* Free Resources hero image: responsive high-priority HTML layer. */
.free-resources-page .free-hero {
  background-image: none;
  isolation: isolate;
}
.free-resources-page .free-hero-media {
  position: absolute;
  inset: 0;
  display: block;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
}
.free-resources-page .free-hero-media picture {
  display: block;
  width: 100%;
  height: 100%;
}
.free-resources-page .free-hero-media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
}
.free-resources-page .free-hero-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255,253,248,.34) 0%, rgba(255,253,248,.16) 42%, rgba(255,253,248,0) 58%);
}
.free-resources-page .free-hero-copy {
  position: relative;
  z-index: 2;
}
@media (max-width: 760px) {
  .free-resources-page .free-hero-media img {
    inset: auto auto 0 0;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center bottom;
  }
  .free-resources-page .free-hero-shade { display: none; }
}