:root{
  --bg-dark:#161310; --bg-dark-2:#1F1B16;
  --paper:#E9E9E6; --paper-2:#DEDEDA;
  --ink:#211D18; --ink-strong:#121110;
  --off-white:#F4F4F0;
  --green:#0F7A3D; --green-deep:#08532A; --green-light:#3FA36E;
  --red:#CE1126; --red-deep:#8F0B1A; --red-light:#E5495C;
  --gold:#F0C230; --gold-soft:#F5D566;
  --grey-line: rgba(33,29,24,.14);
  --grey-line-dark: rgba(245,242,231,.18);
  --radius:3px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
body{background:var(--paper); color:var(--ink); font-family:Helvetica,'Helvetica Neue',Arial,sans-serif; font-size:15px; line-height:1.75; -webkit-font-smoothing:antialiased;}
img,svg{max-width:100%; display:block;}
h1,h2,h3{font-family:Georgia,'Times New Roman',Times,serif; color:var(--ink-strong); font-weight:bold; letter-spacing:-0.01em;}
a{color:inherit;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
.measure{max-width:62ch;}

/* HEADER - dark charcoal band, echoing the cover's black bands */
header.site{background:var(--bg-dark); color:var(--off-white); position:relative;}
.headerbar{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding:1.1rem 0;}
.brand{display:flex; align-items:center; gap:.9rem; text-decoration:none;}
.brand .mark-img{width:50px; height:50px; max-width:50px; max-height:50px; min-width:50px; border-radius:50%; object-fit:cover; flex-shrink:0; border:2px solid var(--gold); display:block;}
@media (max-width:480px){ .brand .mark-img{width:38px; height:38px; max-width:38px; max-height:38px; min-width:38px;} }
.brand .name-block{display:flex; flex-direction:column; gap:.15rem;}
.brand .name-block .name{font-family:Georgia,'Times New Roman',Times,serif; font-weight:bold; font-style:italic; font-size:1.32rem; color:var(--off-white); line-height:1.15; white-space:nowrap;}
.brand .name-block .tagline{font-size:.6rem; letter-spacing:.16em; color:var(--gold); font-weight:bold; white-space:nowrap;}
@media (max-width:480px){ .brand .name-block .name,.brand .name-block .tagline{white-space:normal;} }
.navlinks{display:flex; list-style:none; gap:1.6rem; align-items:center;}
.navlinks a{display:block; padding:.3rem 0; color:var(--off-white); text-decoration:none; font-size:.74rem; letter-spacing:.1em; font-weight:bold; border-bottom:2px solid transparent; transition:color .15s,border-color .15s;}
.navlinks a:hover,.navlinks a:focus-visible{color:var(--gold);}
.navlinks a.current{color:var(--red-light); border-color:var(--red);}
.navtoggle{display:none; background:transparent; color:var(--off-white); border:1px solid var(--grey-line-dark); border-radius:var(--radius); width:42px; height:42px; cursor:pointer; font-size:1.1rem;}
@media (max-width:840px){
  .navlinks{position:absolute; top:100%; left:0; right:0; z-index:60; flex-direction:column; gap:0; background:var(--bg-dark); border-top:1px solid var(--grey-line-dark); box-shadow:0 16px 28px -12px rgba(0,0,0,.5); transform:translateY(-6px); opacity:0; pointer-events:none; transition:opacity .18s ease, transform .18s ease; align-items:stretch;}
  .navlinks.open{transform:translateY(0); opacity:1; pointer-events:auto;}
  .navlinks a{padding:1rem 28px; text-align:center; border-bottom:1px solid var(--grey-line-dark);}
  .navtoggle{display:block;}
}


/* WIDE PHOTO BANNER */
.banner{position:relative; min-height:70vh; max-height:640px; display:flex; align-items:flex-end; overflow:hidden; color:#fff;}
.banner.banner-sm{min-height:340px; max-height:400px;}
.banner img.bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 18%;}
.banner::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,12,9,.15) 0%, rgba(15,12,9,.4) 45%, rgba(15,12,9,.94) 100%);}
.banner .wrap{position:relative; z-index:2; padding-bottom:3.2rem; width:100%;}
.banner .badge{display:inline-block; background:var(--red); color:#fff; font-size:.66rem; font-weight:bold; letter-spacing:.14em; padding:.4rem .9rem; border-radius:var(--radius); margin-bottom:1.1rem;}
.banner h1{font-size:clamp(2.1rem,5vw,3.4rem); line-height:1.12; font-style:italic; color:#fff; text-shadow:0 2px 18px rgba(0,0,0,.4);}
.banner p.lede{margin-top:1.1rem; font-size:1.05rem; max-width:56ch; opacity:.95;}
.banner .eyebrow{display:block; color:var(--gold); font-weight:bold; letter-spacing:.14em; font-size:.7rem; margin-bottom:.5rem;}
.banner p{opacity:.92; max-width:60ch;}

.cta-row,.buy-row{display:flex; gap:.9rem; flex-wrap:wrap; align-items:center; margin-top:1.9rem;}
.btn{display:inline-flex; align-items:center; gap:.5rem; font-weight:bold; font-size:.78rem; letter-spacing:.08em; padding:.9rem 1.7rem; border-radius:var(--radius); text-decoration:none; border:2px solid transparent; cursor:pointer; transition:background .15s,border-color .15s,transform .15s,color .15s;}
.btn:active{transform:translateY(1px);}
.btn-red{background:var(--red); color:#fff;}
.btn-red:hover{background:var(--red-light);}
.btn-green{background:transparent; border-color:var(--green); color:var(--green);}
.btn-green:hover{background:var(--green); color:#fff;}
.btn-ghost{background:rgba(255,255,255,.06); border-color:#fff; color:#fff;}
.btn-ghost:hover{background:rgba(255,255,255,.18);}
.btn-outline-dark{background:transparent; border-color:var(--ink-strong); color:var(--ink-strong);}
.btn-outline-dark:hover{border-color:var(--red); color:var(--red);}

section{padding:5.5rem 0;}
.section-head{max-width:640px; margin-bottom:2.8rem;}
.section-head .eyebrow{display:block; color:var(--red); font-weight:bold; letter-spacing:.14em; font-size:.72rem; margin-bottom:.6rem;}
.section-head h2{font-size:clamp(1.5rem,3vw,2.2rem); font-style:italic;}
.section-alt{background:var(--paper-2);}

.feature-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem; text-align:center;}
@media (max-width:820px){ .feature-grid{grid-template-columns:1fr;} }
.feature{padding:0 .5rem;}
.feature .ficon{width:54px; height:54px; border-radius:50%; border:2px solid var(--gold); color:var(--ink-strong); display:flex; align-items:center; justify-content:center; margin:0 auto 1.2rem; font-family:Georgia,serif; font-weight:bold; font-style:italic; font-size:1.3rem;}
.feature h3{font-size:1.05rem; margin-bottom:.6rem;}
.feature p{font-size:.9rem; opacity:.75;}

/* BOOK + AUTHOR */
.book-feature{display:grid; grid-template-columns:auto 1fr; gap:3.2rem; align-items:center;}
@media (max-width:780px){ .book-feature{grid-template-columns:1fr; text-align:center;} .book-feature .buy-row,.book-feature .cta-row{justify-content:center;} }

.book-photo{width:260px; flex-shrink:0; margin:0 auto; transition:transform .4s ease;}
.book-photo img{width:100%; display:block; filter:drop-shadow(0 30px 45px rgba(0,0,0,.35));}
.book-photo:hover{transform:translateY(-4px);}
.book-photo.lg{width:320px;}

.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:3.4rem;}
@media (max-width:820px){ .about-grid{grid-template-columns:1fr;} }
.pullquote{font-family:Georgia,serif; font-style:italic; font-size:1.28rem; line-height:1.55; border-left:3px solid var(--gold); padding-left:1.4rem; margin:1.8rem 0; color:var(--ink-strong);}
.facts{list-style:none; display:grid; gap:1rem; margin-top:1.4rem;}
.facts li{display:grid; grid-template-columns:130px 1fr; gap:1rem; font-size:.9rem; border-top:1px solid var(--grey-line); padding-top:1rem;}
.facts li:first-child{border-top:none; padding-top:0;}
.facts b{font-weight:bold; color:var(--red);}

/* Clean divided rows - used for book details AND the launch-event schedule (Ruth Chou Simons style) */
.detail-table{display:grid; gap:0;}
.detail-table .row{display:grid; grid-template-columns:180px 1fr; gap:1rem; padding:1.05rem 0; border-top:1px solid var(--grey-line); font-size:.94rem;}
.detail-table .row:first-child{border-top:none;}
.detail-table b{color:var(--green); font-weight:bold; font-family:Georgia,serif; font-style:italic;}
@media (max-width:560px){ .detail-table .row{grid-template-columns:1fr;} }

/* Elegant, minimal quotes: no heavy card, just a rule and generous type */
.quote-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem;}
@media (max-width:860px){ .quote-grid{grid-template-columns:1fr;} }
.quote-card{text-align:center; padding-top:1.4rem; border-top:2px solid var(--gold);}
.quote-card p{font-family:Georgia,serif; font-style:italic; font-size:1.1rem; line-height:1.6; color:var(--ink-strong);}
.quote-card span{display:block; margin-top:1.1rem; font-size:.72rem; letter-spacing:.1em; color:var(--red); text-transform:uppercase; font-weight:bold;}

.vip-card{background:var(--bg-dark); color:var(--off-white); border-radius:var(--radius); padding:1.9rem 2.1rem; display:flex; gap:1.3rem; align-items:flex-start; border-left:4px solid var(--gold);}
.vip-card .vip-icon{font-size:1.6rem; flex-shrink:0;}
.vip-card p{font-size:.95rem; line-height:1.65;}
.vip-card b{color:var(--gold);}

.imgzoom{overflow:hidden; border-radius:var(--radius); aspect-ratio:3/4;}
.imgzoom img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease;}
.imgzoom:hover img,.imgzoom:focus-within img{transform:scale(1.07);}

.carousel{position:relative; aspect-ratio:4/3; max-width:640px; margin:0 auto; border-radius:var(--radius); overflow:hidden; background:var(--paper-2);}
.carousel .slide{position:absolute; inset:0; opacity:0; transition:opacity 1s ease;}
.carousel .slide.active{opacity:1;}
.carousel .slide img{width:100%; height:100%; object-fit:cover; object-position:center 8%;}
.carousel-arrow{position:absolute; top:50%; transform:translateY(-50%); background:rgba(22,19,16,.55); color:#fff; border:none; width:44px; height:44px; border-radius:50%; font-size:1.2rem; cursor:pointer; z-index:5; transition:background .15s;}
.carousel-arrow:hover{background:var(--red);}
.carousel-arrow.prev{left:12px;} .carousel-arrow.next{right:12px;}
.carousel-dots{display:flex; justify-content:center; gap:.5rem; margin-top:1.1rem;}
.carousel-dots button{width:9px; height:9px; border-radius:50%; border:none; background:var(--grey-line); cursor:pointer; padding:0;}
.carousel-dots button.active{background:var(--red);}

.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;}
@media (max-width:760px){ .gallery-grid{grid-template-columns:repeat(2,1fr);} }
.gitem{aspect-ratio:1; border-radius:var(--radius); cursor:pointer; position:relative; overflow:hidden; border:1px solid var(--grey-line); background:var(--paper-2);}
.gitem img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease;}
.gitem:hover img,.gitem:focus-visible img{transform:scale(1.08);}
.gitem .gcap{position:absolute; inset:auto 0 0 0; background:linear-gradient(0deg, rgba(0,0,0,.72), transparent); color:#fff; font-size:.78rem; padding:1.6rem .8rem .6rem; opacity:0; transition:opacity .25s;}
.gitem:hover .gcap,.gitem:focus-visible .gcap{opacity:1;}

.lightbox{position:fixed; inset:0; background:rgba(10,8,6,.86); display:none; align-items:center; justify-content:center; z-index:100; padding:2rem;}
.lightbox.open{display:flex;}
.lightbox-inner{max-width:640px; width:100%; padding:0; background:transparent; text-align:left; position:relative;}
.lightbox-inner .lb-frame{position:relative; overflow:hidden; border-radius:var(--radius); background:#000;}
.lightbox-inner img{width:100%; max-height:70vh; object-fit:contain; display:block; animation:lbfade .3s ease; background:#000;}
@keyframes lbfade{from{opacity:0; transform:scale(.97);} to{opacity:1; transform:scale(1);}}
.lb-caption{background:var(--paper); padding:1rem 1.4rem; border-radius:0 0 var(--radius) var(--radius);}
.lb-caption h3{font-style:italic; font-size:1rem; margin-bottom:.3rem; color:var(--ink-strong);}
.lb-caption p{font-size:.85rem; opacity:.7;}
.lb-nav button{position:absolute; top:50%; transform:translateY(-50%); background:rgba(0,0,0,.5); color:#fff; border:none; width:40px; height:40px; border-radius:50%; cursor:pointer; z-index:6;}
.lb-nav button.lb-prev{left:10px;} .lb-nav button.lb-next{right:10px;}
.lightbox-close-btn{position:absolute; top:-2.6rem; right:0; background:transparent; color:#fff; border:1px solid #fff; width:34px; height:34px; border-radius:50%; cursor:pointer; font-size:1rem;}

.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:2rem;}
@media (max-width:860px){ .blog-grid{grid-template-columns:1fr;} }
.post{border-top:2px solid var(--gold); padding-top:1.2rem;}
.post .tag{font-size:.7rem; color:var(--red); font-weight:bold; letter-spacing:.1em;}
.post h3{font-size:1.05rem; margin:.5rem 0 .6rem; font-style:italic;}
.post p{font-size:.88rem; opacity:.75;}
.post a.readmore{font-size:.8rem; font-weight:bold; text-decoration:none; border-bottom:2px solid var(--red); display:inline-block; margin-top:.7rem;}

.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:3.4rem;}
@media (max-width:820px){ .contact-grid{grid-template-columns:1fr;} }
form{display:grid; gap:1.1rem;}
label{font-size:.8rem; font-weight:bold; margin-bottom:.35rem; display:block;}
input,textarea{width:100%; background:var(--off-white); border:1px solid var(--grey-line); border-radius:var(--radius); padding:.75rem .9rem; font-family:inherit; font-size:.92rem; color:var(--ink);}
input:focus,textarea:focus,a:focus-visible,button:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}
textarea{min-height:110px; resize:vertical;}
.form-note{font-size:.8rem; opacity:.6; margin-top:.2rem;}
.contact-card{background:var(--bg-dark); color:var(--off-white); border-radius:var(--radius); padding:2.2rem; border-left:4px solid var(--red);}
.contact-card h3{color:var(--off-white); margin-bottom:1rem; font-style:italic;}
.contact-card a{text-decoration:none; border-bottom:1px solid var(--gold); color:var(--off-white);}
.contact-card ul{list-style:none; display:grid; gap:.85rem; margin-top:1.15rem; font-size:.9rem;}

.ctaband{background:var(--bg-dark); color:var(--off-white); text-align:center; padding:3.4rem 0;}
.ctaband h2{color:var(--off-white); font-size:clamp(1.4rem,3vw,1.9rem); font-style:italic; margin-bottom:1.3rem;}
.ctaband .btn{background:var(--gold); color:var(--ink-strong); border-color:var(--gold);}
.ctaband .btn:hover{background:var(--gold-soft);}

footer{background:var(--bg-dark); color:var(--off-white); padding:2.4rem 0; text-align:center; font-size:.8rem;}
footer .footlinks{display:flex; justify-content:center; gap:1.5rem; list-style:none; margin-bottom:1.2rem; flex-wrap:wrap; font-size:.74rem; letter-spacing:.06em;}
footer .footlinks a{text-decoration:none; color:var(--off-white); opacity:.85;}
footer .footlinks a:hover{opacity:1; color:var(--gold);}
footer p{opacity:.75;}
footer a{color:var(--gold-soft); text-decoration:none; border-bottom:1px solid transparent;}
footer a:hover{border-color:var(--gold-soft);}
.manuscript-callout{border:1px dashed var(--gold); border-radius:var(--radius); padding:1.1rem 1.5rem; display:inline-block; margin-bottom:1.3rem; background:var(--bg-dark); text-align:left;}
.manuscript-callout p{font-size:.85rem; opacity:.9; margin-bottom:.6rem; color:var(--off-white);}

.reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease;}
.reveal.visible{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1; transform:none; transition:none;} }

@keyframes rise{from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);}}
.banner h1,.banner p.lede,.banner .cta-row,.banner .buy-row,.banner .badge{animation:rise .7s ease both;}
.banner .badge{animation-delay:0s;} .banner h1{animation-delay:.06s;} .banner p.lede{animation-delay:.14s;} .banner .cta-row,.banner .buy-row{animation-delay:.22s;}
@media (prefers-reduced-motion: reduce){ .banner *{animation:none !important;} }

/* Placeholder article teaser (About page: book-launch recap, links through to photos) */
.article-teaser{border-left:4px solid var(--gold); background:var(--paper-2); border-radius:3px; padding:1.9rem 2rem;}
.article-teaser .placeholder-tag{display:inline-block; background:var(--bg-dark); color:var(--gold); font-size:.64rem; font-weight:bold; letter-spacing:.12em; padding:.35rem .7rem; border-radius:3px; margin-bottom:.9rem;}
.article-teaser h3{font-style:italic; font-size:1.2rem; margin-bottom:.7rem;}
.article-teaser p{font-size:.92rem; opacity:.8; margin-bottom:1rem;}
.article-teaser a.readmore{font-size:.82rem; font-weight:bold; text-decoration:none; border-bottom:2px solid var(--red); display:inline-block;}

/* Title with a smaller subtitle line underneath (hero headings) */
.banner h1 .title-sub{display:block; font-size:.42em; font-style:normal; font-weight:normal; letter-spacing:.02em; color:var(--gold-soft); margin-top:.5rem; text-shadow:none;}

/* Simple, minimal page header for blog posts (no photo banner) */
.pagehero-simple{padding:4rem 0 2.5rem; border-bottom:1px solid var(--grey-line); background:var(--paper-2);}

/* Long-form post body */
.post-body{max-width:720px;}
.post-body p{font-size:1rem; line-height:1.85; margin-bottom:1.3rem; color:var(--ink);}
.post-body .cta-row{margin-top:2rem;}

/* Placeholder tiles for pending launch-gallery photos */
.gitem-pending{display:flex; align-items:center; justify-content:center; border:1px dashed var(--grey-line); background:var(--paper-2); cursor:default;}
.gitem-pending:hover img{transform:none;}
.gcap-pending{font-size:.72rem; letter-spacing:.05em; color:var(--ink); opacity:.5; text-align:center; padding:.5rem; line-height:1.5;}
