*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#103c30;background:#fff;font-family:Georgia,'Times New Roman',serif}a{color:inherit}button,input{font:inherit}.site-shell{max-width:1440px;margin:auto;padding:0 clamp(16px,3vw,44px)}.site-header{display:flex;align-items:center;justify-content:center;flex-direction:column;border-bottom:1px solid #e7d7b7;padding:10px 0 15px;gap:0}.brand{display:block;line-height:0}.brand img{width:clamp(190px,21vw,260px);height:auto;object-fit:contain}.nav{display:flex;align-items:center;justify-content:center;gap:clamp(24px,6vw,90px);width:100%;font:600 14px/1.2 Arial,Helvetica,sans-serif}.nav a{text-decoration:none}.nav a:hover{text-decoration:underline}.nav .nav-join{border-radius:99px;padding:12px 22px;color:white;background:#064b31;box-shadow:0 2px 5px #00291b17}.nav .nav-join:hover{text-decoration:none;background:#0b6746}.hero{min-height:390px;display:grid;grid-template-columns:minmax(265px,0.8fr) minmax(0,1.55fr);align-items:center;gap:20px;padding:22px 0 14px}.hero-copy{padding-left:clamp(0px,1.5vw,20px)}.eyebrow{font:700 10px/1.5 Arial,Helvetica,sans-serif;letter-spacing:.18em;color:#956c1e;margin:0 0 12px}h1{font-size:clamp(38px,4.5vw,69px);line-height:1.04;letter-spacing:-.035em;margin:0}.gold-rule{display:block;width:58px;height:3px;border-radius:2px;background:#d5a018;margin:17px 0}.hero-desc{font-size:clamp(16px,1.5vw,21px);line-height:1.4;margin:0 0 19px;max-width:370px}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:99px;padding:12px 24px;color:#fff;text-decoration:none;font:700 14px/1.25 Arial,Helvetica,sans-serif;cursor:pointer;text-align:center}.button-plum{background:#7d1458}.button-plum:hover{background:#621243}.button-green{background:#075139}.button-green:hover{background:#0b684a}.availability{font:12px/1.45 Arial,Helvetica,sans-serif;color:#637069;margin:11px 0 0}.shelf-wrap{position:relative;text-align:center}.shelf-wrap img{display:block;width:100%;height:auto;max-height:420px;object-fit:contain}.shelf-note{position:absolute;right:4%;bottom:0;color:#66746d;font:italic 10px Arial,Helvetica,sans-serif;background:#fffffff0;padding:3px 7px;border-radius:5px}.join{position:relative;overflow:hidden;isolation:isolate;min-height:310px;display:flex;align-items:flex-start;justify-content:center;text-align:center;border-radius:6px;background:#fff url('assets/forest.webp') center bottom / 100% auto no-repeat;margin:2px 0 5px}.join-content{position:relative;z-index:1;padding:21px 20px 100px;width:min(690px,100%)}h2{font-size:clamp(34px,4.2vw,60px);line-height:1.05;letter-spacing:-.028em;margin:0 0 10px}.join p{font-size:clamp(15px,1.45vw,20px);line-height:1.35;margin:0 auto 13px;max-width:570px}.signup{margin:auto;max-width:530px}.signup label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.signup-fields{display:flex;justify-content:center;align-items:stretch;gap:9px}.signup-fields input{border:1px solid #b9c4bd;background:#fff;color:#163e30;border-radius:99px;padding:12px 18px;min-width:0;flex:1;font:14px Arial,Helvetica,sans-serif;box-shadow:0 2px 7px #224b2910}.signup-fields button{white-space:nowrap}.join .form-note{font:11px/1.4 Arial,Helvetica,sans-serif;color:#67736c;margin:9px auto 0;background:#ffffffb8;border-radius:6px;display:table;padding:2px 7px}.site-footer{display:flex;gap:20px;justify-content:center;align-items:center;padding:6px 0 17px;color:#758177;font:11px Arial,Helvetica,sans-serif}.footer-tagline{font-style:italic}@media(min-width:1100px) and (min-height:790px){.hero{min-height:43vh}.join{min-height:32vh}}@media(max-width:760px){.site-shell{padding:0 14px}.site-header{padding:8px 0 10px}.brand img{width:215px}.nav{gap:26px;font-size:13px;justify-content:center}.nav .nav-join{padding:10px 16px}.hero{display:flex;flex-direction:column;gap:8px;padding:26px 4px 12px}.hero-copy{width:100%;padding:0;text-align:center}.eyebrow{margin-bottom:8px}h1{font-size:clamp(42px,9vw,57px)}.gold-rule{margin:12px auto}.hero-desc{margin:0 auto 14px;font-size:17px}.shelf-wrap{width:100%}.shelf-wrap img{max-height:none}.shelf-note{bottom:-7px}.join{min-height:360px;margin-top:22px;background-size:auto 68%;background-position:center bottom}.join-content{padding:18px 14px 145px}h2{font-size:42px}.join p{font-size:16px}.signup-fields{flex-direction:column;max-width:310px;margin:auto}.signup-fields input{width:100%;text-align:center}.signup-fields button{width:100%}.site-footer{display:flex;flex-direction:column;gap:4px;padding-bottom:20px}}@media(max-width:400px){.brand img{width:185px}.nav{gap:18px}.hero{padding-top:20px}.join{background-size:auto 57%}.join-content{padding-bottom:140px}}

/* V4: Compact one-screen DESKTOP presentation; mobile remains naturally scrollable. */
@media (min-width: 761px) {
  .site-shell { max-width: 1440px; }
  .site-header { padding: 4px 0 6px; }
  .brand img { width: clamp(235px, 23vw, 286px); }
  .nav { min-height: 0; }
  .hero {
    min-height: 0;
    grid-template-columns: minmax(252px, .84fr) minmax(0, 1.65fr);
    gap: clamp(10px, 2vw, 26px);
    padding: 8px 0 4px;
  }
  .eyebrow { margin-bottom: 6px; }
  h1 { font-size: clamp(37px, 4.15vw, 61px); line-height: 1.02; }
  .gold-rule { margin: 11px 0; }
  .hero-desc { margin-bottom: 12px; font-size: clamp(15px, 1.35vw, 19px); line-height: 1.32; }
  .hero .button { padding: 10px 19px; }
  .availability { margin-top: 8px; font-size: 11px; }
  .shelf-wrap img { max-height: min(39vh, 345px); width: 100%; object-fit: contain; }
  .join {
    min-height: 0;
    height: clamp(185px, 29vh, 255px);
    margin: 0 0 2px;
    background-size: 100% auto;
    background-position: center bottom;
  }
  .join-content { padding: 3px 16px 0; }
  h2 { font-size: clamp(31px, 3.4vw, 46px); margin-bottom: 5px; }
  .join p { font-size: clamp(14px, 1.2vw, 17px); line-height: 1.28; margin-bottom: 8px; }
  .signup-fields input { padding: 9px 15px; }
  .signup-fields button { padding: 9px 18px; }
  .join .form-note { margin-top: 6px; font-size: 10px; }
  .site-footer { padding: 2px 0 6px; }
}
/* Prevent the older tall-screen min-heights from overriding the compact layout. */
@media (min-width: 1100px) and (min-height: 790px) {
  .hero { min-height: 0; }
  .join { min-height: 0; }
}
/* On shorter desktop windows, trim the logo and scene to prioritize fit. */
@media (min-width: 761px) and (max-height: 740px) {
  .brand img { width: clamp(216px, 20vw, 254px); }
  .hero { padding-top: 3px; }
  .shelf-wrap img { max-height: min(36vh, 295px); }
  .join { height: clamp(165px, 27vh, 205px); }
  h2 { font-size: clamp(30px, 3vw, 40px); }
}

/* V5 footer breathing room: no changes to the hero or logo. */
@media (min-width: 761px) {
  .join {
    height: clamp(230px, 32vh, 282px);
    margin-top: 14px;
    margin-bottom: 0;
    background-size: 94% auto;
    background-position: center bottom;
    align-items: flex-start;
  }
  .join-content { padding: 12px 16px 0; }
  .join h2 { margin-bottom: 9px; }
  .join p:not(.form-note) { margin-bottom: 12px; }
  .signup-fields { gap: 10px; }
  .site-footer { padding: 0 0 5px; }
}
/* Keep the disclaimer accessible but hidden until the form is used. */
.join .form-note { display: none; }
.join .form-note.is-visible { display: table; }
@media (max-width: 760px) {
  .join .form-note.is-visible { display: block; }
}

/* V6: finalized slim-paperback scene, non-destructive Coming Soon ribbons, muted forest. */
.shelf-wrap { position: relative; isolation: isolate; }
.coming-soon {
  position: absolute;
  z-index: 2;
  display: block;
  transform: translate(-50%, -50%) rotate(-8deg);
  background: #79345b;
  color: #fff;
  font: 700 clamp(7px, 1vw, 14px)/1.05 Arial, Helvetica, sans-serif;
  letter-spacing: .045em;
  text-align: center;
  white-space: nowrap;
  padding: .5em .8em;
  box-shadow: 0 2px 5px #301e271b;
  pointer-events: none;
}
/* Coordinates are percentages of the unchanged book scene, not of the page. */
.coming-soon--pma { left: 46.4%; top: 62.5%; }
.coming-soon--wonder { left: 75.5%; top: 62.5%; }
/* The full painted treetops are inside this image; never crop them with cover. */
.join { background-color:#fff; background-repeat:no-repeat; }
@media (max-width: 760px) {
  .coming-soon { font-size: clamp(6px, 1.8vw, 11px); padding:.42em .62em; }
  .coming-soon--pma { left:46.4%; top:62.5%; }
  .coming-soon--wonder { left:75.5%; top:62.5%; }
}
/* Keep ribbons anchored to the image's actual bounds, including at short desktop heights. */
@media (min-width: 761px) {
  .shelf-wrap { width:min(100%, 612px); justify-self:center; }
  .shelf-wrap img { max-height:none; }
}
@media (min-width: 761px) and (max-height: 740px) {
  .shelf-wrap { width:min(100%, 524px); }
}

/* V7: mobile-first readability and complete forest artwork. */
.join-forest-mobile{display:none}
@media(max-width:760px){
 html,body{overflow-x:hidden}
 .site-shell{padding:0 15px}
 .site-header{padding:15px 0 12px}
 .brand img{width:min(55vw,228px)}
 .hero{padding:22px 2px 3px;gap:14px}
 .hero-copy{text-align:center}
 .eyebrow{font-size:9px;letter-spacing:.16em;margin-bottom:12px}
 .hero h1{font-size:clamp(40px,10.6vw,56px);line-height:1.05}
 .hero-desc{font-size:16px;max-width:340px;line-height:1.43;margin-bottom:16px}
 .hero .button{font-size:13px;min-height:44px;padding:12px 18px}
 .availability{max-width:320px;margin:11px auto 0;font-size:11px;line-height:1.5}
 .shelf-wrap{width:100%;margin:0 auto}
 .shelf-wrap img{width:100%;height:auto;max-height:none}
 .coming-soon{font-size:clamp(6px,1.6vw,9px);padding:.38em .54em}
 .join{min-height:0;height:auto;overflow:visible;display:flex;flex-direction:column;align-items:center;justify-content:start;margin:21px 0 0;background:none!important}
 .join-content{padding:10px 0 4px;width:100%}
 .join h2{font-size:clamp(36px,9vw,46px);margin-bottom:9px}
 .join p:not(.form-note){max-width:345px;font-size:15px;line-height:1.45;margin:0 auto 16px}
 .signup-fields{max-width:350px;gap:9px}
 .signup-fields input{height:46px;font-size:15px}
 .signup-fields button{height:46px}
 .join-forest-mobile{display:block;width:100%;height:auto;margin:4px 0 -3px;object-fit:contain}
 .site-footer{font-size:11px;line-height:1.5;padding:4px 0 22px;gap:3px}
}
@media(min-width:761px){.join-forest-mobile{display:none}}
