:root { --navy:#15283a; --paper:#f6f2ea; --gold:#b7985b; --muted:#706b62; --line:rgba(21,40,58,.16); } * { box-sizing:border-box; } body { background:var(--paper); color:var(--navy); font-family:"DM Sans",sans-serif; margin:0; } header { align-items:center; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; padding:25px 5vw; } .brand { color:inherit; font-size:.74rem; font-weight:600; letter-spacing:.12em; text-decoration:none; } .brand small { color:var(--muted); display:block; font-size:.65rem; font-weight:400; letter-spacing:.04em; margin-top:5px; } .back { border-bottom:1px solid var(--gold); color:inherit; font-size:.78rem; padding-bottom:4px; text-decoration:none; }
.hero { background:linear-gradient(105deg,rgba(21,40,58,.98),rgba(21,40,58,.75)),url('https://paxcorps.com/wp-content/uploads/2026/06/6-1247x1536.jpg') center 33%/cover; color:white; padding:110px 12vw 90px; } .eyebrow { color:var(--gold); font-size:.72rem; font-weight:600; letter-spacing:.18em; margin:0 0 18px; } h1,h2 { font-family:"Cormorant Garamond",Georgia,serif; font-weight:600; } h1 { font-size:clamp(4.2rem,9vw,8.5rem); letter-spacing:-.045em; line-height:.88; margin:0; } .hero>p:last-child { color:rgba(255,255,255,.85); line-height:1.7; margin:30px 0 0; max-width:440px; }
.purchase-note { align-items:center; border-bottom:1px solid var(--line); display:flex; gap:25px; justify-content:center; padding:21px 5vw; text-align:center; } .purchase-note span { color:var(--gold); font-size:.7rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; } .purchase-note strong { font-size:.85rem; font-weight:500; }.books { margin:auto; max-width:1160px; padding:86px 5vw 100px; }.book { align-items:center; border-bottom:1px solid var(--line); display:grid; gap:9vw; grid-template-columns:minmax(180px,340px) 1fr; padding:0 0 70px; margin-bottom:70px; }.book:nth-child(even) { grid-template-columns:1fr minmax(180px,340px); }.book:nth-child(even) .cover { grid-column:2; }.book:nth-child(even) .book-copy { grid-column:1; grid-row:1; }.cover { background:#ddd4c5; box-shadow:14px 16px 0 rgba(183,152,91,.27); }.cover img { display:block; height:auto; width:100%; }.book-copy { max-width:560px; }.book-type { color:var(--gold); font-size:.7rem; font-weight:600; letter-spacing:.16em; margin:0 0 12px; text-transform:uppercase; } h2 { font-size:clamp(2.4rem,4vw,4.2rem); letter-spacing:-.035em; line-height:.92; margin:0 0 22px; } .description { color:#4f5557; font-size:.94rem; line-height:1.8; margin:0; }.purchase-options { display:flex; flex-wrap:wrap; gap:12px; margin-top:29px; }.option { align-items:center; border:1px solid var(--navy); display:flex; flex:1 1 190px; justify-content:space-between; min-height:56px; padding:11px 14px; text-decoration:none; transition:.2s; }.option strong { color:var(--navy); font-size:.73rem; letter-spacing:.08em; text-transform:uppercase; }.option span { color:var(--muted); font-size:.75rem; }.option:hover { background:var(--navy); }.option:hover strong,.option:hover span { color:white; }.option.print { background:var(--navy); justify-content:center; }.option.print strong { color:white; }.option.print:hover { background:var(--gold); border-color:var(--gold); } footer { border-top:1px solid var(--line); color:var(--muted); font-size:.72rem; padding:28px 5vw; }
@media(max-width:700px) { header{padding:19px 6vw}.back{font-size:.68rem}.hero{padding:85px 7vw 70px}.purchase-note{align-items:start;flex-direction:column;gap:8px;text-align:left}.books{padding:58px 7vw 70px}.book,.book:nth-child(even){display:flex;flex-direction:column;gap:32px;margin-bottom:55px;padding-bottom:55px}.book:nth-child(even) .cover{order:0}.book:nth-child(even) .book-copy{order:1}.cover{max-width:290px;width:82%}.purchase-options{gap:9px}.option{flex-basis:100%} }