@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Source+Serif+4:ital,wght@0,400;0,500;0,600;1,400&display=swap');

:root{
  --paper:#faf9f5;
  --paper-2:#f5f2ea;
  --ink:#20201d;
  --muted:#6f6c65;
  --line:#dedbd2;
  --line-soft:#e9e6de;
  --fiodorov:#0e2031;
  --copper:#a77648;
  --hatata:#8c351b;
  --hatata-soft:#f4eadf;
  --serif:"Source Serif 4", Georgia, serif;
  --sans:"Inter", Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.site-shell{width:min(1180px,calc(100% - 56px));margin:0 auto}

/* Header */
.site-header{border-bottom:1px solid var(--line-soft);background:rgba(250,249,245,.97)}
.site-header-inner{
  min-height:108px;display:flex;align-items:center;justify-content:space-between;gap:36px
}
.brand{display:flex;align-items:center;gap:16px;font-family:var(--sans);font-size:18px;font-weight:500;letter-spacing:.085em;text-transform:uppercase}
.brand img{height:76px;width:auto}
.site-nav{display:flex;align-items:center;gap:46px;font:500 16px/1 var(--sans);color:var(--muted)}
.site-nav a{transition:color .2s ease}
.site-nav a:hover{color:var(--ink)}

/* Home */
.hero{padding:52px 0 48px}
.kicker{font:500 13px/1.4 var(--sans);letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.hero h1{max-width:760px;margin:14px 0 12px;font:400 clamp(42px,4.3vw,54px)/1.15 var(--serif);letter-spacing:-.015em}
.hero p{margin:0;color:var(--muted);font:400 22px/1.55 var(--serif)}
.section-head{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:16px 0 30px}
.section-head h2{margin:0;font:500 13px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.section-head span{font:500 13px/1.4 var(--sans);color:var(--muted);letter-spacing:.08em}

.catalog{padding-bottom:78px}
.catalog-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(0,260px));
  justify-content:center;
  gap:64px 52px;
}
.book-card{width:260px;max-width:100%}
.cover-stage{
  height:370px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.cover-stage img{
  height:100%;
  width:auto;
  max-width:100%;
  object-fit:contain;
  object-position:center bottom;
  transition:transform .5s ease;
}
.book-card a:hover .cover-stage img{transform:scale(1.008)}
.book-meta{border-top:1px solid var(--line-soft);margin-top:22px;padding-top:15px;min-height:268px}
.book-index{display:block;margin-bottom:11px;font:500 16px/1.5 var(--sans);color:var(--muted);letter-spacing:.07em}
.book-meta h3{min-height:76px;margin:0 0 6px;font:400 30px/1.2 var(--serif);letter-spacing:-.01em}
.book-subtitle{min-height:64px;margin:0 0 14px;font:italic 400 20px/1.45 var(--serif)}
.book-author{margin:0;font:500 15px/1.55 var(--sans);color:var(--muted)}
.book-note{margin:10px 0 0;font:400 14px/1.5 var(--sans);color:var(--muted)}

.about{border-top:1px solid var(--line-soft);background:var(--paper-2);padding:68px 0 76px}
.about-grid{display:grid;grid-template-columns:260px minmax(0,660px);gap:84px;align-items:start}
.about h2{margin:12px 0 0;font:400 44px/1.15 var(--serif)}
.about p{margin:0;font:400 26px/1.58 var(--serif);letter-spacing:-.006em}
.place{margin-top:26px;font:500 16px/1.5 var(--sans);color:var(--muted);letter-spacing:.08em;text-transform:uppercase}

.site-footer{border-top:1px solid var(--line-soft)}
.footer-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px;font:400 14px/1.5 var(--sans);color:var(--muted)}
.footer-brand{font-weight:500;color:var(--ink)}


.contact{
  border-top:1px solid var(--line-soft);
  padding:58px 0 62px;
  background:var(--paper);
}
.contact-grid{
  display:grid;
  grid-template-columns:260px minmax(0,660px);
  gap:84px;
  align-items:start;
}
.contact h2{margin:12px 0 0;font:400 42px/1.15 var(--serif)}
.contact p{margin:0 0 18px;font:400 22px/1.6 var(--serif);color:var(--muted)}
.contact-mail{
  display:inline-block;
  font:500 17px/1.5 var(--sans);
  border-bottom:1px solid var(--ink);
  padding-bottom:3px;
}
.contact-mail:hover{opacity:.65}
.amazon-link{
  display:inline-block;
  margin-top:14px;
  font:500 15px/1.5 var(--sans);
  letter-spacing:.02em;
  border-bottom:1px solid currentColor;
  padding-bottom:2px;
}
.amazon-link:hover{opacity:.65}
.purchase-note{
  margin-top:13px;
  font:400 14px/1.55 var(--sans);
  color:var(--muted);
}

/* Book pages */
.book-page{min-height:100vh}
.book-page.fiodorov{background:#f6f2e9;--theme:var(--fiodorov);--accent:var(--copper)}
.book-page.hatata{background:#f7f0e8;--theme:#432419;--accent:var(--hatata)}
.book-page .site-header{background:transparent}
.breadcrumb{padding:28px 0 0;font:500 15px/1.5 var(--sans);color:var(--muted);letter-spacing:.055em}
.breadcrumb a:hover{color:var(--ink)}

.book-hero{
  display:grid;
  grid-template-columns:minmax(240px,360px) minmax(0,1fr);
  gap:clamp(54px,8vw,116px);
  align-items:center;
  padding:42px 0 86px;
}
.book-hero .book-cover{
  width:min(100%,330px);
  margin:0 auto;
  box-shadow:0 18px 38px rgba(28,24,20,.12);
}
.book-copy .eyebrow,.essay-label .eyebrow{font:500 16px/1.5 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.book-copy h1{max-width:720px;margin:15px 0 8px;color:var(--theme);font:400 clamp(52px,5.8vw,78px)/1.04 var(--serif);letter-spacing:-.025em}
.hatata .book-copy h1{font-size:clamp(64px,7vw,94px)}
.book-copy .subtitle{margin:0 0 28px;font:italic 400 28px/1.35 var(--serif)}
.attribution{display:flex;flex-direction:column;gap:6px;margin:0 0 25px}
.attribution span{font:500 12px/1.4 var(--sans);letter-spacing:.11em;color:var(--muted)}
.attribution strong{font:500 16px/1.5 var(--sans)}
.book-rule{height:1px;background:var(--line);margin:0 0 24px}
.book-description{max-width:610px;margin:0;font:400 22px/1.65 var(--serif)}
.book-cta{margin-top:30px}
.text-cta{display:inline-block;padding-bottom:3px;border-bottom:1px solid currentColor;font:500 15px/1.5 var(--sans);letter-spacing:.03em}
.text-cta:hover{opacity:.65}

.essay{display:grid;grid-template-columns:250px minmax(0,680px);gap:84px;padding:64px 0 66px;border-top:1px solid var(--line)}
.essay-label h2{margin:10px 0 0;color:var(--theme);font:400 46px/1.13 var(--serif);letter-spacing:-.015em}
.essay-body{max-width:680px}
.essay-body p{margin:0 0 24px;font:400 22px/1.68 var(--serif)}
.essay-body p:last-child{margin-bottom:0}
.book-next{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);padding:28px 0 68px;font:500 16px/1.5 var(--sans);letter-spacing:.07em;color:var(--muted)}
.book-next a{font-family:var(--serif);font-size:22px;font-weight:400;letter-spacing:0;color:var(--ink)}
.book-next a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}

@media (max-width:900px){
  .site-shell{width:min(100% - 42px,1180px)}
  .catalog-grid{grid-template-columns:repeat(2,minmax(0,260px));gap:56px 38px}
  .cover-stage{height:330px}
  .about-grid{grid-template-columns:1fr;gap:28px}
  .about p{max-width:680px}
  .book-hero{grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:46px}
  .essay{grid-template-columns:190px minmax(0,1fr);gap:48px}
}
@media (max-width:640px){
  .site-shell{width:calc(100% - 34px)}
  .site-header-inner{min-height:82px}
  .brand span{display:none}
  .brand img{height:58px}
  .site-nav{gap:14px;font-size:12px}
  .hero{padding:36px 0 40px}
  .hero h1{font-size:clamp(37px,10.3vw,48px);margin-top:12px}
  .hero p{font-size:20px}
  .section-head{padding-bottom:24px}
  .catalog{padding-bottom:64px}
  .catalog-grid{grid-template-columns:minmax(0,270px);gap:54px}
  .book-card{width:270px}
  .cover-stage{height:360px}
  .book-meta{min-height:0}
  .about{padding:58px 0 64px}
  .contact{padding:52px 0 56px}
  .contact-grid{grid-template-columns:1fr;gap:26px}
  .about h2{font-size:38px}
  .about p{font-size:23px}
  .footer-inner{min-height:100px;display:block;padding:24px 0}
  .footer-inner div+div{margin-top:8px}
  .book-hero{grid-template-columns:1fr;gap:44px;padding:32px 0 68px}
  .book-hero .book-cover{width:min(100%,300px)}
  .book-copy h1{font-size:clamp(44px,13vw,66px)}
  .hatata .book-copy h1{font-size:clamp(64px,18vw,88px)}
  .book-copy .subtitle{font-size:24px}
  .book-description{font-size:20px}
  .essay{grid-template-columns:1fr;gap:24px;padding:52px 0 54px}
  .essay-label h2{font-size:38px}
  .essay-body p{font-size:20px}
  .book-next{display:block;padding-bottom:52px}
  .book-next a{display:block;margin-top:14px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms!important}
}

.first-edition{
  display:block;
  margin:0 0 13px;
  font:600 13px/1.45 var(--sans);
  letter-spacing:.075em;
  text-transform:uppercase;
  color:var(--muted);
}
@media (max-width:640px){
  .first-edition{font-size:12px}
}