
:root{
  --ink:#14130f;
  --forest:#171a15;
  --moss:#2d3429;
  --cream:#f3ecdf;
  --paper:#fbf7ef;
  --gold:#b98945;
  --amber:#d59a4d;
  --plum:#4d2e48;
  --wine:#6b3949;
  --line:rgba(20,19,15,.16);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:78px}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"DM Sans",Arial,sans-serif;
  line-height:1.65;
}
img{max-width:100%;display:block}
a{color:inherit}
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(247,241,230,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(92,76,51,.12);
}
.nav-wrap{
  max-width:1220px;margin:auto;padding:17px 28px;
  display:flex;align-items:center;justify-content:space-between;gap:28px;
}
.wordmark{
  font-family:"Cormorant Garamond",serif;
  text-transform:uppercase;letter-spacing:.28em;
  font-size:1.05rem;text-decoration:none;
}
.main-nav{display:flex;gap:30px;align-items:center}
.main-nav a{
  text-decoration:none;text-transform:uppercase;
  letter-spacing:.13em;font-size:.72rem;
}
.menu-toggle{display:none;border:0;background:none;font-size:1.3rem;color:var(--ink);cursor:pointer;padding:6px;line-height:1}
.hero{
  position:relative;min-height:88vh;
  background:url("assets/street_wide.jpg") center 58%/cover no-repeat;
  display:flex;align-items:center;overflow:hidden;
}
.hero-shade{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(10,12,9,.92) 0%,rgba(10,12,9,.78) 38%,rgba(10,12,9,.22) 72%,rgba(10,12,9,.08) 100%);
}
.hero-content{
  position:relative;z-index:2;width:min(760px,90%);
  margin-left:max(6vw,42px);padding:80px 0;color:#f8efe1;
}
.eyebrow,.section-kicker{
  text-transform:uppercase;letter-spacing:.24em;font-size:.72rem;font-weight:500;color:var(--gold);
}
.section-kicker.light{color:#d6b47b}
h1,h2,h3{
  font-family:"Cormorant Garamond",serif;
  font-weight:500;line-height:1.02;margin:.2em 0;
}
h1{font-size:clamp(3.6rem,7vw,7.4rem);letter-spacing:-.03em}
h1 em{font-weight:400;color:#e1b56f}
h2{font-size:clamp(2.5rem,4.7vw,4.8rem);letter-spacing:-.02em}
h3{font-size:1.7rem}
.hero-copy{font-family:"Cormorant Garamond",serif;font-size:1.45rem;max-width:650px;color:#eadfce}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.btn{
  display:inline-block;padding:13px 20px;text-decoration:none;
  text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;border:1px solid #cfab6d;
}
.btn-gold{background:#cfab6d;color:#15140f}
.btn-ghost{color:#f7eee1;background:rgba(255,255,255,.03)}
.hero-mark{
  position:absolute;right:5vw;bottom:4vh;color:#d7ad67;
  font-size:1.8rem;opacity:.75;
}
.intro-strip{
  background:#efe5d6;border-top:1px solid rgba(0,0,0,.04);
  border-bottom:1px solid rgba(0,0,0,.05);
  padding:18px 22px;text-align:center;
}
.intro-strip p{
  margin:0;text-transform:uppercase;letter-spacing:.18em;
  font-size:.72rem;color:#655b4f;
}
.book-section{padding:110px 24px;background:#f8f2e8}
.book-grid{
  max-width:1180px;margin:auto;display:grid;
  grid-template-columns:.82fr 1.18fr;gap:82px;align-items:center;
}
.cover-frame{
  position:relative;width:min(390px,90%);margin:auto;padding:16px;
  background:#e8ddcb;box-shadow:0 28px 70px rgba(45,34,18,.18);
}
.cover-frame:before{
  content:"";position:absolute;inset:-10px;border:1px solid rgba(179,134,66,.35);pointer-events:none;
}
.book-copy{max-width:650px}
.series-line{
  font-family:"Cormorant Garamond",serif;font-size:1.35rem;color:#765d3d;margin-top:-8px;
}
blockquote{
  font-family:"Cormorant Garamond",serif;font-size:1.9rem;
  border-left:2px solid var(--gold);padding:4px 0 4px 22px;margin:32px 0;color:#43382d;
}
.format-row{display:flex;gap:9px;flex-wrap:wrap;margin:28px 0 18px}
.format-row span{
  border:1px solid rgba(75,61,42,.2);padding:7px 11px;
  text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;
}
.text-link{text-decoration:none;border-bottom:1px solid #927148;padding-bottom:3px}
.edition-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:30px 0 16px}
.edition-card{min-height:118px;border:1px solid rgba(75,61,42,.22);padding:15px 14px;text-decoration:none;display:flex;flex-direction:column;justify-content:center;transition:transform .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease}
.edition-card.available{background:rgba(255,255,255,.35);border-color:rgba(185,137,69,.48)}
.edition-card.available:hover{transform:translateY(-2px);background:#fffaf2;border-color:var(--gold);box-shadow:0 10px 25px rgba(45,34,18,.08)}
.edition-card.pending{background:rgba(45,52,41,.045);color:#746b60}
.edition-label{text-transform:uppercase;letter-spacing:.13em;font-size:.63rem;color:#806b50;margin-bottom:5px}
.edition-card strong{font-family:"Cormorant Garamond",serif;font-size:1.18rem;font-weight:600;line-height:1.1}
.edition-card small{font-size:.68rem;margin-top:7px;color:#756a5d}
.availability-note{font-family:"Cormorant Garamond",serif;font-size:1.08rem;color:#655746;margin-top:8px}

.memory-banner{
  min-height:74vh;position:relative;
  background:url("assets/street_vertical.jpg") center 54%/cover no-repeat;
  display:flex;align-items:flex-end;color:#f7efe1;
}
.memory-overlay{
  position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,8,6,.08) 0%,rgba(7,8,6,.18) 38%,rgba(7,8,6,.88) 100%);
}
.memory-copy{
  position:relative;z-index:2;max-width:1020px;padding:75px max(6vw,28px) 80px;
}
.memory-copy h2{max-width:950px}
.memory-copy p:last-child{font-family:"Cormorant Garamond",serif;font-size:1.4rem;max-width:700px}
.vignettes{
  display:grid;grid-template-columns:repeat(3,1fr);background:#161712;
}
.vignette{position:relative;min-height:470px;overflow:hidden}
.vignette img{width:100%;height:100%;object-fit:cover;filter:saturate(.9)}
.vignette:after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(9,9,8,.82) 100%);
}
.vignette div{position:absolute;z-index:2;left:28px;right:28px;bottom:25px;color:#f6eddf}
.vignette span{text-transform:uppercase;letter-spacing:.18em;font-size:.66rem;color:#d4ad70}
.vignette h3{margin:.25em 0 0}
.quote-section{
  background:linear-gradient(135deg,#4a2d45,#2f2130);color:#f6eadf;
  padding:105px 24px;text-align:center;
}
.quote-inner p{
  font-family:"Cormorant Garamond",serif;font-size:clamp(2.8rem,6vw,5.8rem);
  margin:10px 0 0;font-style:italic;
}
.quote-inner small{text-transform:uppercase;letter-spacing:.2em;color:#d9b673}
.ornament{color:#d9b673}
.about-section{background:#efe4d2;padding:110px 24px}
.about-grid{
  max-width:1120px;margin:auto;display:grid;
  grid-template-columns:.76fr 1.24fr;gap:80px;align-items:center;
}
.portrait-wrap{
  position:relative;max-width:390px;margin:auto;
  box-shadow:0 24px 60px rgba(43,32,21,.18);
}
.portrait-wrap:after{
  content:"";position:absolute;inset:16px -16px -16px 16px;border:1px solid rgba(179,134,66,.5);z-index:-1;
}
.about-copy p{max-width:690px}
.night-section{
  min-height:58vh;background:url("assets/street_night.jpg") center/cover no-repeat;
  position:relative;display:flex;align-items:center;color:#f6eee3;
}
.night-section:before{
  content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,10,9,.88),rgba(9,10,9,.45),rgba(9,10,9,.2));
}
.night-copy{position:relative;z-index:1;padding:80px max(7vw,30px);max-width:760px}
.night-copy p:last-child{font-size:1.1rem;color:#e9dece}
.stay-section{padding:100px 24px;background:#faf6ef}
.stay-grid{
  max-width:1120px;margin:auto;display:grid;grid-template-columns:1.25fr .75fr;gap:85px;align-items:center;
}
.coming{margin-top:24px;font-size:.78rem;text-transform:uppercase;letter-spacing:.14em;color:#7c6a55}
.studio-card{
  background:#12130f;padding:36px;min-height:340px;display:flex;align-items:center;justify-content:center;
}
.studio-card img{width:min(320px,90%)}
footer{background:#12130f;color:#d8ccba;padding:38px 24px}
.footer-inner{
  max-width:1120px;margin:auto;display:flex;justify-content:space-between;gap:30px;align-items:flex-end;
}
.footer-wordmark{color:#f0e5d5}
.footer-inner p{margin:5px 0;font-size:.8rem}
.footer-right{text-align:right}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s ease}
.reveal.visible{opacity:1;transform:none}
@media (max-width:900px){
  .book-grid,.about-grid,.stay-grid{grid-template-columns:1fr;gap:55px}
  .about-copy,.book-copy{max-width:760px;margin:auto}
  .vignettes{grid-template-columns:1fr}
  .vignette{min-height:360px}
}
@media (max-width:720px){
  .nav-wrap{padding:14px 18px}
  .wordmark{font-size:.92rem}
  .menu-toggle{display:block}
  .main-nav{
    display:none;position:absolute;left:0;right:0;top:100%;
    background:#f5eee2;padding:16px 20px;border-bottom:1px solid var(--line);
    flex-direction:column;align-items:flex-start;gap:14px;
  }
  .main-nav.open{display:flex}
  .hero{
    min-height:86svh;
    background-image:linear-gradient(180deg,rgba(9,11,8,.38),rgba(9,11,8,.92)),url("assets/street_vertical.jpg");
    background-position:center 48%;
  }
  .hero-shade{display:none}
  .hero-content{margin:0;padding:120px 24px 70px;align-self:flex-end}
  h1{font-size:clamp(3.05rem,15vw,5.2rem)}
  .hero-copy{font-size:1.2rem}
  .hero-actions{gap:9px}
  .btn{width:100%;text-align:center}
  .book-section,.about-section,.stay-section{padding:78px 20px}
  .memory-banner{min-height:78svh}
  .memory-copy{padding:50px 22px}
  .memory-copy h2 br{display:none}
  .quote-section{padding:75px 20px}
  .footer-inner{flex-direction:column;align-items:flex-start}
  .footer-right{text-align:left}
}

::selection{background:#b98945;color:#14130f}
a:focus-visible,button:focus-visible{outline:2px solid #b98945;outline-offset:4px}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.025;
  background-image:radial-gradient(rgba(20,19,15,.9) .45px,transparent .45px);
  background-size:4px 4px;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
}

/* Final polish */
section[id]{scroll-margin-top:78px}
.main-nav a,.text-link,.btn{transition:opacity .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease}
.main-nav a:hover,.text-link:hover{opacity:.68}
.btn-gold:hover{background:#dfbd83;border-color:#dfbd83}
.btn-ghost:hover{background:rgba(255,255,255,.10)}
@media (max-width:720px){
  html{scroll-padding-top:66px}
  section[id]{scroll-margin-top:66px}
  .main-nav{box-shadow:0 14px 30px rgba(20,19,15,.10)}
  .main-nav a{width:100%;padding:5px 0}
  .edition-actions{grid-template-columns:1fr;gap:9px}
  .edition-card{min-height:96px}
  .studio-card{min-height:280px}
}
