:root {
  --ink: #2f2823;
  --muted: #746960;
  --cream: #fbf6ee;
  --paper: #fffdf9;
  --tan: #d6b28a;
  --brown: #765039;
  --rust: #a9603f;
  --sage: #8d9b78;
  --line: rgba(47,40,35,.13);
  --shadow: 0 22px 55px rgba(68, 46, 30, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "DM Sans", Arial, sans-serif;
  line-height: 1.6;
}
img { width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { background: #e7d4bd; color: var(--ink); }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 5vw;
  background: rgba(255,253,249,.92);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.brand, .footer-brand { display: flex; align-items: center; gap: 10px; }
.brand strong, .footer-brand strong { display:block; font-family:"Playfair Display", Georgia, serif; font-size: 20px; }
.brand small, .footer-brand small { display:block; color:var(--muted); font-size:10px; letter-spacing:.16em; text-transform:uppercase; }
.brand-mark { font-size: 28px; }
.nav { display:flex; align-items:center; gap:28px; font-size:13px; font-weight:600; }
.nav a { transition: .2s ease; }
.nav a:hover { color:var(--rust); }
.nav-shop { background:var(--ink); color:#fff !important; padding:10px 16px; border-radius:999px; }
.menu-toggle { display:none; border:0; background:none; font-size:26px; cursor:pointer; }

.hero {
  min-height: 680px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:7vw;
  align-items:center;
  padding: 70px 8vw 85px;
  background:
    radial-gradient(circle at 12% 20%, rgba(214,178,138,.22), transparent 28%),
    linear-gradient(135deg, #fbf6ee 0%, #fffdf9 55%, #f2e7d7 100%);
  overflow:hidden;
}
.hero-copy { max-width:620px; }
.eyebrow, .section-label, .author-accent {
  color:var(--rust);
  letter-spacing:.22em;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
}
h1, h2, h3 { margin-top:0; }
h1, h2 { font-family:"Playfair Display", Georgia, serif; line-height:1.08; }
h1 { font-size:clamp(48px, 6vw, 84px); margin:16px 0 24px; }
h2 { font-size:clamp(36px, 4vw, 58px); margin:12px 0 20px; }
em { color:var(--rust); font-style:italic; }
.hero-text { max-width:540px; font-size:18px; color:var(--muted); }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin:30px 0 20px; }
.button {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  border-radius:999px; padding:13px 21px; border:1px solid transparent;
  font-size:13px; font-weight:700; cursor:pointer; transition:.25s ease;
}
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--ink); color:#fff; }
.button-primary:hover { background:var(--brown); }
.button-ghost { border-color:var(--line); background:#fff; }
.button-light { background:#fff; color:var(--ink); }
.full-width { width:100%; }
.hero-note { font-size:12px; color:var(--muted); }
.hero-note span { color:var(--rust); font-size:16px; }

.hero-photo { position:relative; max-width:550px; justify-self:end; width:100%; }
.photo-frame {
  position:relative; padding:14px; background:#fff; box-shadow:var(--shadow);
  transform:rotate(2deg);
}
.photo-frame img { aspect-ratio: 4 / 4.4; object-fit:cover; }
.photo-tag {
  position:absolute; background:#fff; box-shadow:0 8px 25px rgba(0,0,0,.1);
  padding:9px 15px; font-family:"Playfair Display",serif; font-size:20px;
}
.tag-one { left:-28px; top:16%; transform:rotate(-7deg); }
.tag-two { right:-18px; bottom:13%; transform:rotate(5deg); }
.doodle { position:absolute; color:var(--rust); font-size:34px; }
.doodle-star { top:-30px; right:5%; }
.doodle-heart { bottom:-32px; left:10%; }

.intro-strip {
  display:flex; justify-content:center; gap:7vw; flex-wrap:wrap;
  padding:23px 5vw; background:var(--ink); color:#fff; font-size:13px; font-weight:600;
}
.intro-strip span { margin-right:8px; }

.section { padding:110px 8vw; }
.story { background:var(--cream); }
.story-grid { max-width:1150px; margin:45px auto 0; display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:center; }
.story-photo { box-shadow:var(--shadow); transform:rotate(-2deg); }
.story-photo img { aspect-ratio:1/1.05; object-fit:cover; }
.story-copy p { color:var(--muted); font-size:16px; max-width:570px; }
.signature { color:var(--ink) !important; font-family:"Playfair Display",serif; font-size:20px !important; margin-top:28px; }
.signature span { color:var(--rust); }

.section-heading { max-width:750px; }
.section-heading.centered { margin:0 auto 45px; text-align:center; }
.section-heading > p { color:var(--muted); }

.duo { background:#fff; }
.duo-grid { max-width:1100px; margin:auto; display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.dog-card { background:var(--cream); border:1px solid var(--line); }
.dog-image { height:470px; overflow:hidden; }
.dog-image img { height:100%; object-fit:cover; }
.dog-info { padding:24px 27px 30px; position:relative; }
.dog-number { color:var(--rust); font-size:11px; font-weight:700; letter-spacing:.15em; }
.dog-info h3 { font-family:"Playfair Display",serif; font-size:36px; margin:5px 0; }
.dog-info p { color:var(--muted); margin:0; }

.books { background:var(--cream); }
.book-grid { max-width:1200px; margin:45px auto 0; display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.book-card { background:#fff; border:1px solid var(--line); padding:14px; box-shadow:0 10px 35px rgba(50,35,25,.05); }
.book-cover {
  min-height:340px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:35px; color:#fff; position:relative; overflow:hidden;
}
.cover-main { background:linear-gradient(145deg,#8f684d,#3c3029); }
.cover-school { background:linear-gradient(145deg,#83936e,#4d5941); }
.cover-halloween { background:linear-gradient(145deg,#5b3b68,#241b2b); }
.cover-paw { font-size:42px; margin-bottom:20px; }
.cover-small { letter-spacing:.22em; font-size:10px; font-weight:700; margin-bottom:10px; }
.book-cover strong { font-family:"Playfair Display",serif; font-size:35px; line-height:.95; }
.book-cover > span { margin-top:18px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
.book-cover img { width:100%; height:100%; object-fit:cover; display:block; }
.book-details { padding:20px 7px 7px; }
.book-badge { color:var(--rust); font-size:9px; letter-spacing:.18em; font-weight:700; }
.book-details h3 { font-family:"Playfair Display",serif; font-size:25px; line-height:1.15; margin:8px 0; }
.book-details p { color:var(--muted); font-size:13px; min-height:60px; }
.coming-soon {
  max-width:1200px; margin:28px auto 0; display:flex; gap:16px; align-items:center;
  padding:20px 24px; background:#fff; border:1px dashed #c9b69e;
}
.coming-soon > span { font-size:30px; }
.coming-soon strong { font-size:14px; }
.coming-soon p { margin:2px 0 0; color:var(--muted); font-size:12px; }

.photo-feature { display:grid; grid-template-columns:1fr 1fr; min-height:580px; }
.feature-photo { overflow:hidden; }
.feature-photo img { width:100%; height:100%; object-fit:cover; object-position:center; }
.feature-copy { display:flex; flex-direction:column; justify-content:center; padding:80px 9vw; background:var(--ink); color:#fff; }
.feature-copy .section-label { color:#d6b28a; }
.feature-copy p { color:rgba(255,255,255,.72); max-width:500px; }
.text-link { color:#fff; font-weight:700; margin-top:15px; }

.gallery { background:#fff; }
.gallery-grid {
  max-width:1200px; margin:auto; display:grid;
  grid-template-columns:1.1fr .9fr .9fr; grid-auto-rows:250px; gap:15px;
}
.gallery-item { border:0; padding:0; overflow:hidden; cursor:pointer; background:#eee; }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:.4s ease; }
.gallery-item:hover img { transform:scale(1.04); }
.gallery-item.tall { grid-row:span 2; }
.gallery-item.wide { grid-column:span 2; }

.author-section { padding:100px 8vw; background:var(--cream); }
.author-card { max-width:1050px; margin:auto; background:#fff; padding:55px; box-shadow:var(--shadow); }
.author-content { display:grid; grid-template-columns:150px 1fr; gap:45px; align-items:center; margin-top:20px; }
.author-placeholder {
  width:150px; height:150px; border-radius:50%; display:grid; place-items:center;
  background:#ead9c3; font-size:45px; color:var(--rust);
}
.author-photo { width:150px; height:150px; border-radius:50%; overflow:hidden; }
.author-photo img { width:100%; height:100%; object-fit:cover; }
.author-content p { color:var(--muted); max-width:650px; }

.final-cta { text-align:center; padding:100px 20px; background:var(--rust); color:#fff; }
.final-cta .section-label { color:#f4dcc2; }
.final-cta h2 { margin:12px 0 30px; }
.final-cta h2 em { color:#fff1df; }
.cta-paw { font-size:38px; margin-bottom:12px; }

.footer { padding:40px 8vw 25px; background:#29231f; color:#fff; }
.footer-brand small { color:rgba(255,255,255,.55); }
.footer p { color:rgba(255,255,255,.58); font-size:12px; max-width:500px; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; border-top:1px solid rgba(255,255,255,.12); padding-top:20px; margin-top:25px; color:rgba(255,255,255,.5); font-size:11px; }

.lightbox {
  position:fixed; inset:0; z-index:100; display:none; place-items:center;
  background:rgba(20,15,12,.93); padding:30px;
}
.lightbox.open { display:grid; }
.lightbox img { max-width:92vw; max-height:88vh; width:auto; box-shadow:0 20px 80px rgba(0,0,0,.4); }
.lightbox-close { position:absolute; top:20px; right:25px; border:0; background:none; color:#fff; font-size:42px; cursor:pointer; }

@media (max-width: 900px) {
  .nav { gap:15px; }
  .hero { grid-template-columns:1fr; padding-top:50px; }
  .hero-photo { justify-self:center; max-width:600px; }
  .story-grid, .photo-feature { grid-template-columns:1fr; }
  .book-grid { grid-template-columns:1fr 1fr; }
  .feature-photo { min-height:430px; }
  .author-content { grid-template-columns:110px 1fr; }
  .author-placeholder, .author-photo { width:110px; height:110px; }
}

@media (max-width: 650px) {
  .site-header { padding:14px 5vw; }
  .menu-toggle { display:block; }
  .nav {
    display:none; position:absolute; top:100%; left:0; right:0; padding:18px 5vw;
    flex-direction:column; align-items:stretch; background:#fff; border-bottom:1px solid var(--line);
  }
  .nav.open { display:flex; }
  .nav-shop { text-align:center; }
  .hero { padding:45px 6vw 70px; }
  h1 { font-size:49px; }
  .section { padding:75px 6vw; }
  .intro-strip { gap:12px; flex-direction:column; align-items:center; }
  .duo-grid, .book-grid { grid-template-columns:1fr; }
  .dog-image { height:390px; }
  .gallery-grid { grid-template-columns:1fr 1fr; grid-auto-rows:190px; }
  .gallery-item.tall { grid-row:span 2; }
  .gallery-item.wide { grid-column:span 2; }
  .author-section { padding:70px 6vw; }
  .author-card { padding:30px; }
  .author-content { grid-template-columns:1fr; }
  .author-placeholder, .author-photo { width:90px; height:90px; }
  .footer-bottom { flex-direction:column; }
}