@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Lora:wght@400;500;600&display=swap');

:root {
  --bg:#f3f2f2; --ink:#201f1d; --gold:#b68235; --gold-deep:#8a6127; --gold-light:#e2c79a;
  --rule:#dcd9d6; --dark:#2b2521; --paper:#eae9e9;
  --serif:'Cormorant Garamond',Garamond,'Times New Roman',serif;
  --body:'Lora',Georgia,serif;
}
*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--body); text-wrap:pretty; }
p { margin:0; }
a { color:var(--gold-deep); text-decoration:none; }
a:hover { color:var(--gold); text-decoration:underline; }
::selection { background:rgba(182,130,53,.22); }
:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }

.wrap { max-width:1180px; margin:0 auto; padding-left:clamp(20px,5vw,72px); padding-right:clamp(20px,5vw,72px); }
.rule { height:1px; background:var(--rule); border:0; margin:0; }
.kicker { font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-deep); }

/* nav */
.nav { display:flex; flex-wrap:wrap; gap:16px 28px; align-items:center; justify-content:space-between;
  padding:16px clamp(20px,5vw,72px); border-bottom:1px solid var(--rule); }
.nav-links { display:flex; flex-wrap:wrap; gap:16px 26px; align-items:center; }
.nav-brand { font-family:var(--serif); font-size:20px; letter-spacing:.01em; color:var(--ink); }
.nav a { color:var(--ink); font-size:16px; }
.nav a:hover { color:var(--gold); text-decoration:none; }
.nav-dark { border-bottom:1px solid rgba(247,245,243,.16); }
.nav-dark .nav-brand, .nav-dark a { color:#f7f5f3; }
.nav-dark a:hover { color:var(--gold-light); }

/* buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 20px;
  border-radius:4px; border:1px solid var(--gold); color:var(--gold-deep); background:transparent;
  font-family:var(--body); font-size:15px; line-height:1; cursor:pointer; text-decoration:none;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease; }
.btn:hover { background:rgba(182,130,53,.08); color:var(--gold-deep); text-decoration:none; }
.btn-solid { background:var(--gold); border-color:var(--gold); color:#fff; }
.btn-solid:hover { background:#9d6f2c; border-color:#9d6f2c; color:#fff; }

/* hero */
.hero { background-image:url('assets/hero-field.jpg'); background-size:cover; background-position:center;
  color:#f7f5f3; overflow:hidden; }
.hero-grid { display:grid; grid-template-columns:minmax(0,6fr) minmax(0,5fr); gap:clamp(40px,6vw,80px);
  align-items:center; padding-top:clamp(56px,7vw,104px); padding-bottom:clamp(56px,7vw,100px); }
.hero .kicker { color:rgba(247,245,243,.85); letter-spacing:.14em; }
.hero-logo { display:block; width:min(100%,440px); height:auto; margin:clamp(24px,3vw,34px) 0 0;
  filter:invert(1) brightness(1.08); }
.hook { font-family:var(--serif); font-weight:400; font-size:clamp(30px,3.8vw,50px); line-height:1.15;
  margin:clamp(26px,3vw,36px) 0 0; }
.hero-sub { font-size:19px; line-height:1.75; max-width:44ch; margin:clamp(26px,3vw,34px) 0 0;
  color:rgba(247,245,243,.88); }
.hero-cta { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:clamp(30px,4vw,40px); }
.cover { margin:calc(-1 * clamp(30px,4vw,64px)) calc(-1 * clamp(12px,3vw,64px)); justify-self:center;
  width:min(880px,168%); }
.cover img { display:block; width:100%; height:auto; filter:drop-shadow(0 34px 60px rgba(30,18,36,.55)); }

/* credibility bar */
.bar { background:var(--dark); color:#f2efec; }
.bar .wrap { display:flex; flex-wrap:wrap; gap:12px clamp(28px,5vw,64px); align-items:center;
  justify-content:space-between; padding-top:22px; padding-bottom:22px; font-size:15px; line-height:1.7; }
.bar .dim { color:rgba(242,239,236,.75); }

/* labelled two-column section */
.sec { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,7fr); gap:clamp(28px,4vw,72px);
  padding-top:clamp(48px,6vw,88px); padding-bottom:clamp(48px,6vw,88px); }
.sec > .kicker { margin-top:6px; }
.col { max-width:62ch; }
.lead { font-family:var(--serif); font-size:clamp(26px,3vw,38px); line-height:1.3; }
.h1 { font-family:var(--serif); font-weight:400; font-size:clamp(34px,4.4vw,60px); line-height:1.1; margin:0; }
.h2 { font-family:var(--serif); font-weight:400; font-size:clamp(26px,3vw,38px); line-height:1.25; margin:0; }
.body { font-size:18px; line-height:1.85; margin-top:24px; }
.dim { color:rgba(32,31,29,.82); }

/* praise rail */
.praise { padding-top:clamp(48px,6vw,88px); padding-bottom:clamp(48px,6vw,88px); }
.praise-head { display:flex; flex-wrap:wrap; gap:20px 48px; align-items:flex-end; justify-content:space-between; }
.rail { display:flex; gap:24px; overflow-x:auto; scroll-snap-type:x mandatory;
  padding:28px clamp(20px,5vw,72px) 8px; }
.card { flex:0 0 min(360px,82vw); scroll-snap-align:start; border:1px solid var(--rule); border-radius:4px;
  padding:30px; display:flex; flex-direction:column; justify-content:space-between; gap:22px; background:transparent; }
.quote { font-family:var(--serif); font-size:19px; line-height:1.5; }
.clamp { display:-webkit-box; -webkit-line-clamp:8; -webkit-box-orient:vertical; overflow:hidden; }
.card:has(details[open]) .clamp { -webkit-line-clamp:unset; display:block; }
.name { font-size:14px; line-height:1.6; }
.role { font-size:13px; line-height:1.6; color:rgba(32,31,29,.62); }
details { margin-top:14px; }
details > summary { cursor:pointer; font-size:14px; color:var(--gold-deep); list-style:none; }
details > summary::-webkit-details-marker { display:none; }
details > summary::after { content:' →'; }
details[open] > summary::after { content:' ↑'; }
details p + p { margin-top:14px; }
details > p:first-of-type { margin-top:14px; }

/* plates, forms, lists, footer */
.plate { border:6px solid var(--paper); border-radius:4px; margin:0; }
.plate img { display:block; width:100%; height:auto; filter:sepia(.22) saturate(.82) contrast(1.05); }
.author-grid { display:grid; grid-template-columns:minmax(0,300px) minmax(0,1fr); gap:clamp(24px,4vw,48px); align-items:start; }
.form { display:flex; gap:12px; max-width:460px; margin-top:28px; }
.input { flex:1; min-height:44px; padding:0 14px; border:1px solid var(--rule); border-radius:4px;
  background:#fff; font-family:var(--body); font-size:15px; color:var(--ink); }
.row { display:flex; justify-content:space-between; gap:24px; padding:14px 0; border-top:1px solid var(--rule); font-size:16px; }
.row:last-child { border-bottom:1px solid var(--rule); }
.row span + span { color:rgba(32,31,29,.65); text-align:right; }
.table { width:100%; border-collapse:collapse; margin-top:32px; font-size:16px; }
.table th { text-align:left; font-family:var(--body); font-weight:600; font-size:13px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--gold-deep); padding:0 12px 12px 0; border-bottom:1px solid var(--rule); }
.table td { padding:14px 12px 14px 0; border-bottom:1px solid var(--rule); vertical-align:top; }
.tnum { font-variant-numeric:tabular-nums; }
footer .wrap { display:flex; flex-wrap:wrap; gap:20px 48px; justify-content:space-between;
  padding-top:36px; padding-bottom:56px; font-size:14px; line-height:1.8; color:rgba(32,31,29,.7); }

@media (max-width:900px) {
  .hero-grid, .sec, .author-grid { grid-template-columns:1fr; }
  .cover { width:min(560px,100%); margin:0 auto; }
  .sec { gap:20px; }
}