/* Shirin Shamsi — faithful rebuild of the original Salient design */
@font-face{
  font-family:'naughtymonster';
  src:url('/assets/fonts/naughtymonster.woff') format('woff');
  font-weight:normal;font-style:normal;font-display:swap;
}
:root{
  --teal-a:#4ca1af; --teal-b:#c4e0e5; --orange:#fd6d01; --ink:#444;
  --maxw:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.8 'Open Sans',-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:linear-gradient(to right,var(--teal-a),var(--teal-b)) fixed}
.nm{font-family:'naughtymonster','Comic Sans MS',cursive;font-weight:400!important;letter-spacing:1px}
h1,h2,h3,h4{color:#444;font-weight:400;letter-spacing:1px;line-height:1.25;margin:0 0 .6em}
img{max-width:100%;height:auto}
a{color:var(--orange)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px;top:0;background:var(--orange);color:#fff;padding:.5rem 1rem;z-index:100}
.skip:focus{left:0}
.center{text-align:center}
.just{text-align:justify}

/* top bar */
.topbar{background:#fff}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;min-height:38px}
.topbar-social{display:flex;gap:13px}
.topbar-social a{color:#9a9a9a;display:flex}
.topbar-social a:hover{color:#444}
.topbar-mail{color:#2b2b2b;text-decoration:none;font-size:15px;display:flex;align-items:center;gap:7px;text-transform:uppercase}
.topbar-mail:hover{color:var(--orange)}

/* header */
.site-header{background:linear-gradient(to right,var(--teal-a),var(--teal-b));position:sticky;top:0;z-index:50}
.header-inner{display:flex;align-items:center;justify-content:space-between;min-height:86px}
.brand img{display:block;width:152px;height:auto}
.site-header nav > ul{display:flex;gap:2.1rem;list-style:none;margin:0;padding:0;align-items:center}
.site-header nav li{position:relative}
.site-header nav a{color:#2b2b2b;text-decoration:none;font-size:18px;padding:.15rem 0 .2rem;display:inline-block;
  border-bottom:2px solid transparent}
.site-header nav > ul > li > a:hover,.site-header nav > ul > li > a.active{border-bottom-color:#c0392b;color:#000}
.caret{font-size:.55em;opacity:.55;vertical-align:.15em}
.site-header nav ul.sub{display:none;position:absolute;top:100%;left:0;background:#fff;min-width:270px;
  padding:.5rem 0;margin:0;list-style:none;box-shadow:0 8px 24px rgba(0,0,0,.18);border-radius:6px;
  flex-direction:column;gap:0;z-index:60}
.sub li{width:100%}
.sub a{display:block;padding:.55rem 1.2rem;font-size:17px;border-bottom:none!important}
.sub a:hover{background:#f4f8f9;color:var(--orange)}
.site-header nav .has-sub:hover ul.sub,.site-header nav .has-sub:focus-within ul.sub{display:flex}
.nav-toggle{display:none}
.nav-burger{display:none;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
.nav-burger span{display:block;width:26px;height:2px;background:#2b2b2b}
@media(max-width:900px){
  .nav-burger{display:flex}
  .site-header nav{display:none;width:100%}
  .nav-toggle:checked ~ nav{display:block}
  .site-header nav > ul{flex-direction:column;gap:0;padding:.4rem 0 1rem;align-items:flex-start}
  .site-header nav a{padding:.5rem 0}
  .site-header nav ul.sub{display:flex;position:static;box-shadow:none;background:transparent;padding-left:1.2rem}
  .site-header nav ul.sub a{padding:.3rem 0}
  .header-inner{flex-wrap:wrap}
}

/* yellow title band */
.band{background:url('/assets/img/band-bg.png');background-size:100% 100%;background-repeat:no-repeat;
  padding:72px 0 96px;text-align:center}
.band h1{font-size:clamp(2.4rem,6vw,4rem);color:#111;margin:0}
.band-sub{margin:.6rem 0 0;font-size:1.15rem;color:#333}
.band-sub time{font-weight:600}

/* hero */
.hero{padding:56px 0 40px}
.hero-inner{display:grid;grid-template-columns:520px 1fr;gap:3.5rem;align-items:center}
.hero-panel{background:url('/assets/img/band-bg.png');background-size:100% 100%;padding:52px 64px 72px;
  display:flex;justify-content:center}
.hero-panel img{max-width:350px;filter:drop-shadow(0 14px 28px rgba(0,0,0,.28))}
.hero-text h1{font-size:clamp(2.6rem,5vw,3.9rem);color:#111;margin:0 0 .1em}
.hero-sub{font-size:clamp(1.3rem,2.4vw,1.8rem);color:#222;margin:0 0 1rem}
.stars{list-style:none;margin:0 0 1.5rem;padding:0;font-size:.95rem}
.stars li{margin:.45rem 0}
.star{color:#f5b301}
.cta-row{display:flex;gap:1.2rem;flex-wrap:wrap}
@media(max-width:900px){.hero-inner{grid-template-columns:1fr}.hero-panel{max-width:420px;margin:0 auto}}

/* buttons — flat orange, like the original */
.btn{display:inline-block;background:var(--orange);color:#fff;text-decoration:none;font-weight:600;
  font-family:'Open Sans',sans-serif;font-size:15px;padding:.75rem 1.6rem;border-radius:3px;border:none;cursor:pointer}
.btn:hover{background:#e35f00}

/* sections */
.section{padding:2.8rem 0}
.section-title{text-align:center;font-size:clamp(2rem,4vw,2.9rem);color:#111;margin-bottom:2.2rem}
.orange-title{color:var(--orange);font-size:clamp(1.9rem,3.5vw,2.6rem)}
.orange-title.h3{font-size:clamp(1.5rem,2.6vw,1.9rem)}

/* author strip */
.author-strip{display:grid;grid-template-columns:400px 1fr;gap:3.5rem;align-items:center}
.author-photo{border-radius:50%;width:380px;height:380px;object-fit:cover}
.author-photo.large{width:400px;height:400px}
.strip-title{font-size:clamp(2.2rem,4.5vw,3.2rem);color:#111}
.author-strip p{font-size:1.1rem}
@media(max-width:900px){.author-strip{grid-template-columns:1fr;text-align:center;justify-items:center}
  .author-photo{width:280px;height:280px}.author-photo.large{width:300px;height:300px}}

/* featured books carousel */
.carousel-shell{position:relative}
.carousel{display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 2px 20px;
  scrollbar-width:none}
.carousel::-webkit-scrollbar{display:none}
.book-card{flex:0 0 218px;background:#fff;border-radius:6px;padding:0;text-decoration:none;overflow:hidden;
  color:#333;scroll-snap-align:start;box-shadow:0 5px 16px rgba(0,0,0,.16);text-align:center;
  display:flex;flex-direction:column;transition:transform .15s ease}
.book-card:hover{transform:translateY(-4px)}
.book-card img{display:block;width:100%;aspect-ratio:3/4.15;object-fit:cover;object-position:top center}
.book-card-cap{display:flex;flex-direction:column;gap:2px;padding:.85rem .7rem 1.05rem}
.book-card-title{font-weight:600;font-size:.98rem;color:#2c2c2c;line-height:1.3}
.book-card-sub{color:#8a8a8a;font-size:.82rem}
.car-btn{position:absolute;top:42%;transform:translateY(-50%);z-index:5;width:44px;height:44px;border-radius:50%;
  border:none;background:#fff;box-shadow:0 4px 14px rgba(0,0,0,.25);font-size:26px;line-height:1;cursor:pointer;color:#333}
.car-btn:hover{color:var(--orange)}
.car-prev{left:-14px}.car-next{right:-14px}

/* feature banner (latest post) */
.feature-banner{display:block;border-radius:8px;overflow:hidden;background-size:cover;background-position:center;
  text-decoration:none;position:relative}
.feature-banner::before{content:"";position:absolute;inset:0;
  background:linear-gradient(to right,rgba(18,45,60,.88) 0%,rgba(18,45,60,.72) 55%,rgba(18,45,60,.45) 100%)}
.fb-inner{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.9rem;padding:3.4rem 3rem;max-width:560px}
.fb-title{color:#fff;font-size:1.7rem;line-height:1.3;font-weight:300}
.fb-excerpt{color:#e8eef2;font-size:.95rem}
.fb-btn{margin-top:.4rem}
@media(max-width:700px){.fb-inner{padding:2.2rem 1.4rem}}

/* retailers */
.retailer-row{display:flex;gap:3.5rem;align-items:center;justify-content:center;flex-wrap:wrap}
.retailer-row img{max-height:64px;width:auto;object-fit:contain}

/* subscribe zone */
.subscribe-zone{display:grid;grid-template-columns:1fr 1.6fr 1fr;gap:2.5rem;align-items:center}
.aff-col{display:flex;flex-direction:column;gap:1.2rem;align-items:center}
.aff-col img{max-height:82px;width:auto;object-fit:contain}
.subscribe-box{border:2px solid #fff;border-radius:4px;padding:2rem 2.4rem;text-align:center}
.subscribe-box h2{font-size:1.9rem;color:#111}
.subscribe-box input{display:block;width:100%;margin:0 0 1rem;padding:.7rem .9rem;font:inherit;
  background:rgba(255,255,255,.35);border:2px solid var(--orange);border-radius:4px;color:#222}
.subscribe-box input::placeholder{color:#555}
#sub-status{font-weight:600;min-height:1.4em;margin:.8rem 0 0}
@media(max-width:900px){.subscribe-zone{grid-template-columns:1fr}.aff-col{flex-direction:row;flex-wrap:wrap;justify-content:center}}

/* books page tiles */
.tile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-bottom:3rem}
.tile{position:relative;border-radius:6px;overflow:hidden;background-size:cover;background-position:center;
  min-height:260px;display:flex;flex-direction:column;justify-content:center;padding:2rem;text-decoration:none}
.tile::before{content:"";position:absolute;inset:0;background:rgba(30,30,30,.55);transition:background .2s ease}
.tile:hover::before{background:rgba(30,30,30,.4)}
.tile-wide{grid-column:span 2;min-height:320px}
.tile-label{position:relative;color:#fff;font-size:1.9rem;line-height:1.2}
.tile-click{position:relative;color:#fff;font-size:1rem;margin-top:.6rem;text-decoration:underline;text-underline-offset:4px}
@media(max-width:800px){.tile-grid{grid-template-columns:1fr}.tile-wide{grid-column:span 1}}
.book-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:1.6rem;margin-bottom:2.6rem}
.book-grid .book-card{flex:initial}
.coming-soon{font-style:italic;color:#555;margin-bottom:2.4rem}

/* book detail */
.book-layout{display:grid;grid-template-columns:300px 1fr;gap:3rem;align-items:start;margin-top:1.5rem}
.cover-card{position:sticky;top:130px}
.cover-card img{display:block;border-radius:10px;box-shadow:0 8px 22px rgba(0,0,0,.18);background:#fff}
.book-body .review-quote{font-size:.98rem;color:#4a4a4a}
.details-flex{display:grid;grid-template-columns:1fr 250px;gap:2.5rem;align-items:start}
.detail-line{margin:.15rem 0}
.detail-line strong{font-weight:600}
.buy-col{display:flex;flex-direction:column;gap:1.4rem;align-items:stretch}
.buy-col .btn{text-align:center}
.divider{border:none;border-top:2px dashed rgba(255,255,255,.8);margin:3rem 0}
.back-link{margin-top:2.6rem}
@media(max-width:900px){.book-layout{grid-template-columns:1fr}.cover-card{position:static;max-width:300px;margin:0 auto}
  .details-flex{grid-template-columns:1fr}}

/* news */
.news-layout{display:grid;grid-template-columns:2.4fr 1fr;gap:3rem;align-items:start}
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.6rem}
.news-card{background:#fff;border-radius:8px;overflow:hidden;text-decoration:none;color:#333;
  box-shadow:0 6px 18px rgba(0,0,0,.14);display:flex;flex-direction:column;transition:transform .15s ease}
.news-card:hover{transform:translateY(-4px)}
.news-card img{aspect-ratio:16/11;object-fit:cover}
.news-cat{color:var(--orange);font-size:.95rem;padding:.9rem 1.1rem 0}
.news-title{font-weight:600;font-size:1.12rem;line-height:1.4;padding:.2rem 1.1rem .4rem;color:#222}
.news-excerpt{color:#666;font-size:.9rem;padding:0 1.1rem 1.2rem}
.news-side h2{font-weight:300;font-size:1.9rem;color:#222}
.recent-list{list-style:none;margin:0;padding:0}
.recent-list li{margin:.9rem 0}
.recent-list a{color:#333;text-decoration:none}
.recent-list a:hover{color:var(--orange)}
@media(max-width:900px){.news-layout{grid-template-columns:1fr}}

/* post article */
.post-card{background:rgba(255,255,255,.82);border-radius:10px;padding:2.6rem 3rem;max-width:880px;margin:0 auto;
  box-shadow:0 8px 22px rgba(0,0,0,.12)}
.post-card h3{font-weight:600;font-size:1.1rem;color:#222;margin-top:1.8rem}
.post-img{border-radius:8px;margin:1.4rem 0;display:block}
blockquote{border-left:4px solid var(--orange);margin:1.4rem 0;padding:.4rem 0 .4rem 1.2rem;color:#4a4a4a;font-style:italic}
.source-box{background:rgba(76,161,175,.14);border-radius:6px;padding:.8rem 1.1rem;margin-top:2rem;font-size:.92rem}
@media(max-width:700px){.post-card{padding:1.6rem 1.2rem}}

/* contact */
.contact-intro{text-align:center;max-width:820px;margin:0 auto 2.6rem;font-size:1.05rem}
.form-card{background:#fff;border-radius:16px;max-width:620px;margin:0 auto;padding:3rem 3.2rem;
  box-shadow:0 10px 30px rgba(0,0,0,.18)}
.form-card h2{font-size:2.6rem}
.form-card label{display:block;text-align:center;margin:1.1rem 0 .35rem;color:#222}
.form-card input,.form-card textarea{width:100%;padding:.7rem .9rem;font:inherit;color:#222;
  background:transparent;border:2px solid var(--orange);border-radius:4px}
.form-card input:focus,.form-card textarea:focus{outline:2px solid #ffb066}
.form-card .btn{margin-top:1.4rem}
.hp{position:absolute!important;left:-9999px;height:0;width:0;opacity:0;border:none!important}
#cf-status{min-height:1.4em;font-weight:600;margin-top:1rem}
@media(max-width:700px){.form-card{padding:1.8rem 1.2rem}}

/* footer */
.site-footer{margin-top:2rem}
.footer-inner{text-align:center;padding:2.6rem 24px 2.2rem}
.footer-title{font-size:2rem;color:#111;margin:0 0 1.2rem}
.footer-social{display:flex;gap:1.1rem;justify-content:center}
.soc{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}
.soc-ig{background:radial-gradient(circle at 30% 110%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285AEB 90%)}
.soc-tw{background:#1da1f2}
.soc-li{background:#0a66c2}
.soc:hover{opacity:.85}
.copyright{background:#161616;color:#ddd;font-size:.85rem}
.copyright .wrap{padding-top:.7rem;padding-bottom:.7rem;text-align:center}
.copyright a{background:#fff;color:#111;padding:1px 6px;font-weight:800;text-decoration:none}
.center-page{padding:4rem 0 7rem;text-align:center;font-size:1.1rem}

@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}
