:root{
  --ink:#171612;--cream:#f5efdf;--paper:#fffdf6;--yellow:#f4ca27;--red:#b63d2e;
  --muted:#756e60;--line:#d6c9ad;--wood:#8b5e38;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--cream);font-family:Arial,Helvetica,sans-serif}
a{text-decoration:none;color:inherit}
.topbar{height:72px;background:#fffefa;border-bottom:1px solid #ddd5c4;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;position:sticky;top:0;z-index:50}
.logo{display:flex;align-items:center;gap:11px}.logo-mark{width:38px;height:38px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;font:700 22px Georgia,serif}.logo-copy b{display:block;font:700 17px Georgia,serif;letter-spacing:1.4px}.logo-copy small{display:block;font-size:8px;letter-spacing:1.5px;color:var(--muted);margin-top:2px}
.main-nav{display:flex;align-items:center;gap:25px;font-size:12px}.main-nav>a{padding:28px 0}.main-nav>a.active{border-bottom:2px solid var(--yellow)}.search{height:37px;width:210px;border:1px solid #d9d4c8;border-radius:4px;display:flex;align-items:center;padding:0 10px;color:#777}.search input{border:0;outline:0;width:100%;font:11px Arial;background:transparent}.search span{font-size:20px}.nav-buy{background:var(--yellow);padding:13px 25px!important;border-radius:4px;font-weight:900}
.hero{min-height:295px;padding:28px 6.5vw 20px;position:relative;display:grid;grid-template-columns:1fr 1.65fr;gap:30px;align-items:start}
.hero-copy{max-width:540px}.kicker{font-size:8px;letter-spacing:2.2px;color:var(--red);font-weight:900;margin:0 0 10px}.hero h1{font:400 clamp(46px,4.5vw,72px)/.9 Georgia,serif;margin:0}.hero h1 em{color:var(--red);font-style:italic}.lead{font-size:13px;line-height:1.45;color:#5e574b;max-width:470px;margin:14px 0 14px}.hero-actions{display:flex;gap:8px}.button{display:inline-flex;align-items:center;gap:14px;padding:12px 17px;border-radius:3px;font-size:9px;font-weight:900}.button.yellow{background:var(--yellow)}.button.light{background:#fff;border:1px solid var(--ink)}.how-icons{display:grid;grid-template-columns:repeat(4,1fr);margin-top:25px}.how-icons>div{text-align:center;border-left:1px solid #bcb3a1;min-height:88px;padding:0 15px}.how-icons>div:first-child{border-left:0}.how-icons .icon{font-size:28px;font-weight:400;display:block;line-height:1;margin-bottom:9px}.how-icons strong{font:700 12px Georgia,serif;line-height:1.1;display:block}.how-icons small{display:block;font-size:8px;color:var(--muted);margin-top:7px}.hand-note{position:absolute;right:7vw;bottom:8px;font:italic 17px/1.05 Georgia,serif;transform:rotate(-5deg)}.hand-note span{display:block;font-size:27px;margin-left:35px;margin-top:2px}
.book-section{padding:24px 3.5vw 38px}.book-intro{display:flex;justify-content:space-between;align-items:end;padding:0 2vw 14px}.book-intro h2{font:400 46px Georgia,serif;margin:0}.book-intro>a{font-size:9px;color:#6d6455}.book-stage{display:flex;align-items:center;justify-content:center;gap:14px}.open-book{width:min(1420px,88vw);position:relative;background:#4b3828;padding:11px 14px 17px;box-shadow:0 18px 35px #0003;border-radius:2px}.book-spread{display:grid;grid-template-columns:1fr 1fr;position:relative;box-shadow:0 0 18px #0002}.book-spine{position:absolute;z-index:10;left:50%;top:3px;bottom:6px;width:16px;transform:translateX(-50%);background:linear-gradient(90deg,#cbbd9e,#f7efd9 35%,#b4a486 60%,#eee4cc);box-shadow:0 0 10px #0003}.book-page{background:var(--paper);min-height:500px;padding:19px 22px 36px;position:relative;overflow:hidden}.book-page.left{box-shadow:inset -18px 0 25px -25px #0008}.book-page.right{box-shadow:inset 18px 0 25px -25px #0008}.page-heading{display:flex;justify-content:space-between;border-bottom:1px solid #cfc3aa;padding-bottom:8px;font-size:7px;letter-spacing:1.4px;font-weight:900}.yellow-ad{margin-top:12px;background:var(--yellow);min-height:145px;padding:17px 20px;display:flex;justify-content:space-between}.feature-ad h2{font:700 22px Georgia,serif;margin:0 0 5px}.feature-ad p{font:13px Georgia,serif;margin:0 0 8px}.yellow-ad ul{padding-left:16px;margin:7px 0;font-size:9px;line-height:1.7}.yellow-ad strong{font-size:10px}.feature-mark{font-size:85px;align-self:center;opacity:.35}.dark-ad{margin-top:9px;background:#171717;color:#fff;min-height:102px;padding:15px 20px;display:flex;justify-content:space-between;align-items:center}.dark-ad h2{font:700 23px Georgia,serif;margin:0;color:#fff}.dark-ad p{color:var(--yellow);font:700 10px Georgia,serif;margin:4px 0 8px}.dark-ad span{font-size:8px;letter-spacing:1px}.dark-ad small{display:block;font-size:9px;margin-top:7px;color:#d4cdbd}.house-mark{font-size:62px;color:var(--yellow)}.bottom-ad-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.directory-ad{border:1px solid #d2c6ad;background:#f0e8d7;display:flex;gap:9px;align-items:center;padding:9px;min-height:58px}.directory-ad .ad-icon{width:31px;height:31px;flex:none;border-radius:3px;background:#26241f;color:#fff;display:grid;place-items:center;font:700 14px Georgia,serif}.directory-ad h3{font:700 12px Georgia,serif;margin:0}.directory-ad p{font-size:8px;margin:3px 0;color:#5c5549}.directory-ad small{font-size:7px}.small-ad-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.small-ad-grid .directory-ad{min-height:70px}.small-ad-grid .highlight{background:#f9dd63;border-color:#c5a932}.page-footer{position:absolute;bottom:11px;left:22px;right:22px;border-top:1px solid #d0c4aa;padding-top:7px;display:flex;justify-content:space-between;font-size:6px;letter-spacing:1px;color:#746c5d}.page-footer b{font-size:10px;color:var(--ink)}.turn{width:50px;height:50px;border:0;background:var(--ink);color:#fff;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;flex:none}.turn span{font-size:32px;line-height:20px}.turn small{font-size:6px;letter-spacing:1px;margin-top:4px}.turn:disabled{opacity:.15}.book-meta{width:min(1420px,88vw);margin:8px auto 0;display:flex;justify-content:space-between;color:#756d5f;font-size:7px;letter-spacing:1.2px}.book-meta i{font-style:normal;color:var(--ink)}
.pricing{background:#fffefa;border-top:1px solid #ded5c3;border-bottom:1px solid #ded5c3;display:grid;grid-template-columns:repeat(5,1fr) 1.2fr;padding:17px 6vw;align-items:center}.price{display:flex;gap:10px;align-items:center;border-right:1px solid #d4ccbb;padding:0 20px}.price strong{font:400 25px Georgia,serif}.price span{font-size:7px;color:#776f61;line-height:1.5}.price b{font-size:7px;color:var(--ink)}.payment strong{font-size:24px}.tagline{font:italic 19px Georgia,serif;text-align:right;line-height:1.05}.tagline em{color:var(--red)}
.how{padding:90px 10vw;background:#eae0c8;display:grid;grid-template-columns:1fr 1fr;gap:100px}.how h2,.bottom-cta h2{font:400 clamp(44px,5vw,68px)/.95 Georgia,serif;margin:0}.how-copy{padding-top:25px;max-width:470px}.how-copy p{font-size:18px;line-height:1.6;color:#5c5549}.text-button{font-size:10px;font-weight:900;border-bottom:1px solid var(--ink);padding-bottom:5px}
.bottom-cta{text-align:center;padding:100px 20px}.bottom-cta .button{margin-top:28px}
footer{padding:25px 7vw;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:8px;color:var(--muted);letter-spacing:1px}footer b{color:var(--ink)}footer div{display:flex;gap:15px}
@media(max-width:1000px){.main-nav{gap:12px}.search{display:none}.hero{grid-template-columns:1fr}.how-icons{margin-top:5px}.hand-note{right:5vw}.pricing{grid-template-columns:repeat(3,1fr);gap:12px}.price{border:0}.tagline{display:none}.how{gap:40px}}
@media(max-width:700px){.topbar{padding:0 4vw}.logo-copy small{display:none}.main-nav>a:not(.nav-buy){display:none}.hero{padding:35px 6vw 20px;min-height:auto}.hero h1{font-size:52px}.how-icons{grid-template-columns:repeat(2,1fr);gap:15px}.how-icons>div:nth-child(3){border-left:0}.hand-note{display:none}.book-section{padding:40px 2vw}.book-intro{padding:0 3vw 15px}.book-intro h2{font-size:38px}.book-intro>a{display:none}.open-book{width:94vw;padding:6px 7px 10px}.book-page{min-height:390px;padding:11px 10px 30px}.book-spine{width:8px}.feature-ad{min-height:115px;padding:11px}.feature-ad h2,.dark-ad h2{font-size:14px}.feature-ad ul{font-size:6px}.feature-mark{font-size:50px}.dark-ad{min-height:80px;padding:10px}.dark-ad span{font-size:5px}.house-mark{font-size:35px}.directory-ad{padding:5px;min-height:54px;gap:5px}.directory-ad .ad-icon{width:20px;height:20px;font-size:9px}.directory-ad h3{font-size:7px}.directory-ad p,.directory-ad small{font-size:5px}.small-ad-grid{gap:4px}.page-heading,.page-footer{font-size:5px}.turn{width:34px;height:34px}.turn span{font-size:23px}.turn small{display:none}.pricing{grid-template-columns:1fr 1fr;padding:15px 5vw}.price{padding:6px 5px}.price strong{font-size:22px}.how{grid-template-columns:1fr;padding:65px 8vw}.how-copy{padding:0}.how-copy p{font-size:15px}footer{flex-direction:column;align-items:flex-start}}

/* THE HELLO PAGES — ADVERTISE PAGE V4 */
.advertise-page{max-width:1320px;margin:auto;padding:55px 5vw 90px}.advertise-hero{display:flex;justify-content:space-between;align-items:end;gap:40px;padding-bottom:38px;border-bottom:1px solid var(--line)}.kicker{font-size:9px;letter-spacing:2.3px;color:var(--red);font-weight:900;margin:0 0 13px}.advertise-hero h1{font:400 clamp(48px,6vw,78px)/.92 Georgia,serif;margin:0}.advertise-hero h1 em{color:var(--red);font-style:italic}.intro{max-width:570px;color:#625a4d;line-height:1.55;font-size:15px;margin:18px 0 0}.order-total{text-align:right;min-width:220px}.order-total span{display:block;font-size:11px;color:var(--muted)}.order-total strong{display:block;font:400 48px Georgia,serif;margin:3px 0 8px}.order-total small{font-size:8px;letter-spacing:1.7px}
.builder{background:var(--paper);border:1px solid var(--line);box-shadow:0 16px 45px #00000012;margin-top:28px}.builder-step{padding:34px 38px;border-bottom:1px solid var(--line)}.builder-step:last-child{border:0}.step-heading{display:flex;gap:20px;align-items:flex-start;margin-bottom:24px}.step-heading>span{font:400 31px Georgia,serif;line-height:1}.step-heading h2{font:400 27px Georgia,serif;margin:0 0 5px}.step-heading p{font-size:11px;color:var(--muted);margin:0;line-height:1.45}.page-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.page-picker button{appearance:none;background:#f5efdf;border:1px solid var(--line);padding:14px;text-align:left;min-height:77px;cursor:pointer;color:var(--ink)}.page-picker button:hover{border-color:var(--ink)}.page-picker button.active{background:var(--ink);color:#fff}.page-picker b,.page-picker span,.page-picker small{display:block}.page-picker b{font-size:12px}.page-picker span{font:12px Georgia,serif;margin:7px 0 4px}.page-picker small{font-size:9px;opacity:.65}
.grid-wrap{overflow:auto;padding:7px 2px 14px;border-top:1px solid #e1d8c6;border-bottom:1px solid #e1d8c6}.ad-grid{display:grid;grid-template-columns:repeat(15,37px);grid-auto-rows:37px;gap:3px;width:max-content}.grid-square{width:37px;height:37px;padding:0;border:1px solid #cfc3aa;background:#faf4e7;cursor:pointer}.grid-square:hover{border-color:#806f45}.grid-square.selected{background:#f4c400 !important;border-color:#111 !important}.grid-square.sold,.grid-square.house-reserved{background:#bdb5a6 !important;border-color:#999 !important;cursor:not-allowed;opacity:1 !important}.grid-legend{display:flex;gap:22px;margin-top:13px;font-size:9px;color:var(--muted)}.grid-legend i{display:inline-block;width:11px;height:11px;background:#faf4e7;border:1px solid var(--line);vertical-align:-2px;margin-right:5px}.grid-legend i.selected{background:var(--yellow);border-color:#a48712}.grid-legend i.sold{background:#bdb5a6}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.field{margin-bottom:15px}.field label{display:block;font-size:10px;font-weight:900;margin-bottom:7px}.field input{width:100%;height:43px;border:1px solid var(--line);background:#fcf7ec;padding:0 12px;outline:0;font:13px Arial;color:var(--ink)}.field input:focus{border-color:var(--ink);background:#fffefa}.field input[type=file]{padding:10px}
.preview-heading{border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.5px;color:var(--muted)}.preview-heading b{color:var(--ink)}.preview-heading i{font-style:normal}.advert-preview{min-height:150px;background:var(--yellow);border:1px solid #c1a124;margin:10px 0 20px;padding:24px;display:flex;flex-direction:column;justify-content:center}.advert-preview strong{font:700 32px Georgia,serif}.advert-preview span{font-size:12px;margin-top:7px}.checkout-note{display:flex;justify-content:space-between;align-items:center;background:#eee6d6;padding:15px 17px;margin-bottom:14px}.checkout-note b,.checkout-note span,.checkout-note small{display:block}.checkout-note b{font:700 13px Georgia,serif}.checkout-note span{font-size:9px;color:var(--muted);margin-top:3px}.checkout-note small{font-size:9px;color:var(--muted)}.continue-button{width:100%;border:0;background:var(--ink);color:#fff;padding:17px;display:flex;justify-content:center;gap:20px;font-size:10px;font-weight:900;letter-spacing:.4px;cursor:pointer}.continue-button:hover{background:#302d26}
footer{padding:25px 7vw;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:8px;color:var(--muted);letter-spacing:1px}footer b{color:var(--ink)}footer div{display:flex;gap:15px}
@media(max-width:950px){.main-nav>a:not(.nav-buy){display:none}.search{display:none}.advertise-hero{align-items:flex-start;flex-direction:column}.order-total{text-align:left}.page-picker{grid-template-columns:repeat(3,1fr)}}
@media(max-width:650px){.topbar{padding:0 4vw}.logo-copy small{display:none}.advertise-page{padding:38px 4vw 60px}.advertise-hero h1{font-size:48px}.builder-step{padding:25px 18px}.page-picker{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}.checkout-note{display:block}.checkout-note small{margin-top:8px}.logo-copy b{font-size:14px}footer{flex-direction:column;align-items:flex-start}}



/* TYPOGRAPHY PASS — clearer editorial hierarchy */
.hero .kicker,.book-intro .kicker,.latest-hellos .kicker{font-size:10px;letter-spacing:2.6px}
.hero h1{font-size:clamp(54px,5.1vw,82px)}
.lead{font-size:15px;line-height:1.55}
.book-intro h2{font-size:clamp(54px,5vw,76px)}
.book-intro>a{font-size:11px}
.page-heading{font-size:10px;letter-spacing:1.7px}
.feature-ad h2{font-size:28px}
.feature-ad p{font-size:15px}
.yellow-ad ul{font-size:11px}
.yellow-ad strong{font-size:12px}
.dark-ad h2{font-size:29px}
.dark-ad p{font-size:12px}
.dark-ad span{font-size:10px}
.dark-ad small{font-size:10px}
.directory-ad h3{font-size:14px}
.directory-ad p{font-size:10px}
.directory-ad small{font-size:8px}
.page-footer{font-size:8px}
.book-meta{font-size:9px}
.price strong{font-size:30px}
.price span,.price b{font-size:9px}

/* LATEST HELLOS */
.latest-hellos{padding:72px 6.5vw 78px;background:#fffefa;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.latest-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:28px}
.latest-head h2{font:400 clamp(42px,4.2vw,62px)/.95 Georgia,serif;margin:0}
.latest-head p:not(.kicker){font-size:14px;color:var(--muted);margin:12px 0 0}
.latest-link{font-size:11px;font-weight:900;border-bottom:1px solid var(--ink);padding-bottom:6px;white-space:nowrap}
.latest-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.hello-card{padding:20px 19px 23px;border-right:1px solid var(--line);min-height:245px;position:relative;background:#f7f1e3}
.hello-card:last-child{border-right:0}
.hello-card.featured{background:var(--yellow)}
.hello-card-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.5px;margin-bottom:28px}
.hello-card-top span{color:var(--red);font-weight:900}
.hello-card.featured .hello-card-top span{color:var(--ink)}
.hello-mark{width:40px;height:40px;background:var(--ink);color:#fff;display:grid;place-items:center;font:700 20px Georgia,serif;margin-bottom:17px}
.hello-card h3{font:700 19px/1.05 Georgia,serif;margin:0 0 7px}
.hello-card p{font:14px Georgia,serif;margin:0 0 9px}
.hello-card small{font-size:9px;color:#655e52;display:block}
.hello-card a{position:absolute;left:19px;bottom:19px;font-size:8px;font-weight:900;letter-spacing:1px;border-bottom:1px solid currentColor;padding-bottom:4px}
@media(max-width:1000px){.latest-grid{grid-template-columns:repeat(2,1fr)}.hello-card:nth-child(2){border-right:0}.hello-card:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media(max-width:700px){.latest-hellos{padding:55px 6vw}.latest-head{align-items:flex-start;flex-direction:column;gap:18px}.latest-grid{grid-template-columns:1fr}.hello-card{border-right:0!important;border-bottom:1px solid var(--line)}.hello-card:last-child{border-bottom:0}.book-intro h2{font-size:48px}.hero h1{font-size:55px}.feature-ad h2{font-size:20px}.dark-ad h2{font-size:21px}.directory-ad h3{font-size:10px}.directory-ad p{font-size:8px}.page-heading,.page-footer{font-size:6px}.book-meta{font-size:7px}}

.page-choice.selected{background:#f4c400 !important;border-color:#111 !important;box-shadow:inset 0 0 0 2px #111;transform:translateY(-1px)}

/* Sticky live price panel */
.order-summary {
  position: sticky;
  top: 105px;
  align-self: flex-start;
  z-index: 20;
}

@media (min-width: 1000px) {
  .advertise-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 28px;
    align-items: start;
  }
}

@media (max-width: 999px) {
  .order-summary {
    position: sticky;
    bottom: 12px;
    top: auto;
    margin-top: 20px;
  }
}


/* Floating live order total */
.order-total {
  position: sticky;
  top: 105px;
  z-index: 30;
  background: #fffaf0;
  border: 2px solid #171717;
  padding: 20px;
  box-shadow: 8px 8px 0 rgba(23,23,23,.12);
}

.order-total #summarySquares {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
}

.order-total #summaryPrice {
  display: block;
  font-family: Georgia, serif;
  font-size: 32px;
  line-height: 1;
}

@media (max-width: 999px) {
  .order-total {
    position: sticky;
    top: auto;
    bottom: 12px;
  }
}

/* Advert builder: content + sticky price panel */
@media (min-width: 1000px) {
  .builder {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 32px;
    align-items: start;
  }

  .builder > .builder-step {
    grid-column: 1;
  }

  .builder > .order-total {
    grid-column: 2;
    grid-row: 1;
  }

  .builder > .order-total {
    position: sticky;
    top: 105px;
  }
}

.sticky-checkout {
  width: 100%;
  margin-top: 18px;
  padding: 13px 12px;
  border: 2px solid #171717;
  background: #f4c400;
  color: #171717;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: .02em;
}

.sticky-checkout:hover {
  background: #171717;
  color: #fffaf0;
}

@media (max-width: 999px) {
  .builder > .order-total {
    position: sticky;
    bottom: 12px;
    z-index: 50;
  }
}


#uploadDimensions {
  display: block;
  margin-top: 8px;
  font-size: 11px;
  line-height: 1.4;
}

#uploadDimensions.valid {
  font-weight: 700;
}

#uploadDimensions.invalid {
  font-weight: 700;
}



/* Advert preview behaves like an advert, not selectable page text */
.advert-preview {
  user-select: none;
  -webkit-user-select: none;
}
