:root{--paper:#f7f2e8;--ink:#302b25;--sage:#64705b;--brown:#765a42;--cream:#fffdf8;--line:#d9d0c2}
*{box-sizing:border-box} body{margin:0;background:var(--paper);color:var(--ink);font-family:Georgia,'Times New Roman',serif;line-height:1.72}
header{background:var(--cream);border-bottom:1px solid var(--line);padding:28px 6% 20px}
.brand{max-width:1100px;margin:auto}.brand h1{font-size:clamp(2rem,5vw,4.4rem);margin:0;letter-spacing:.02em;font-weight:500}
.tag{font-style:italic;color:var(--sage);margin:.25rem 0 1rem}.nav{display:flex;gap:24px;flex-wrap:wrap;font-family:Arial,sans-serif;font-size:.92rem;text-transform:uppercase;letter-spacing:.08em}
a{color:var(--brown)}.nav a{text-decoration:none;color:var(--ink)}.nav a:hover{color:var(--brown)}
main{max-width:1100px;margin:auto;padding:55px 6%}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hero img,.feature img,.story img{width:100%;display:block}.eyebrow{font-family:Arial,sans-serif;text-transform:uppercase;letter-spacing:.13em;font-size:.78rem;color:var(--sage)}
h2{font-size:clamp(2rem,4vw,3.6rem);line-height:1.08;font-weight:500;margin:.4rem 0 1rem}h3{font-size:2rem;font-weight:500;margin-top:2.5rem}
.lead{font-size:1.2rem}.button{display:inline-block;background:var(--sage);color:white;text-decoration:none;padding:11px 18px;margin-top:10px;font-family:Arial,sans-serif;font-size:.9rem}
.rule{border:0;border-top:1px solid var(--line);margin:55px 0}.feature{display:grid;grid-template-columns:.8fr 1.2fr;gap:38px;align-items:center}
.caption{font-size:.88rem;color:#6c6258;font-style:italic;margin-top:7px}.story{max-width:760px;margin:auto}.story .wide{width:min(980px,calc(100vw - 12%));margin-left:50%;transform:translateX(-50%)}
.pull{font-size:1.55rem;line-height:1.5;border-left:4px solid var(--sage);padding-left:22px;margin:38px 0;font-style:italic}
.source{background:#eee7db;padding:24px;margin-top:45px;font-size:.92rem}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:30px 0}
footer{border-top:1px solid var(--line);text-align:center;padding:35px 6%;font-size:.9rem;color:#665d54;background:var(--cream)}
@media(max-width:760px){.hero,.feature{grid-template-columns:1fr}.gallery{grid-template-columns:1fr}main{padding-top:35px}.brand h1{font-size:2.6rem}}

/* Refined homepage hero */
.hero-home{grid-template-columns:minmax(430px,.82fr) minmax(650px,1.35fr);gap:22px;align-items:center}
.hero-home .hero-copy{position:relative;z-index:2}
.hero-home h2{font-size:clamp(3rem,4.5vw,4.65rem);line-height:1.01;letter-spacing:-.025em;margin:.35rem 0 1.4rem}
.hero-home .lead{font-size:1.18rem;line-height:1.55;max-width:590px}
.hero-home .hero-copy>p:not(.eyebrow):not(.lead){max-width:590px}
.hero-art{min-width:0;overflow:hidden}
.hero-art img{width:100%;height:auto;display:block;mix-blend-mode:multiply}
.hero-button{text-transform:uppercase;letter-spacing:.1em;padding:13px 22px;border-radius:2px}
@media(min-width:1100px){main{max-width:1450px}.hero-home{min-height:690px}}
@media(max-width:980px){.hero-home{grid-template-columns:1fr;gap:18px}.hero-home h2{font-size:clamp(2.65rem,8vw,4.1rem)}.hero-art{max-width:820px;margin:-10px auto 0}}

/* Align homepage tree with the top of the main headline */
.hero-home { align-items: start; }
.hero-home .hero-art { margin-top: 3.6rem; }
@media (max-width: 980px) {
  .hero-home .hero-art { margin-top: 0; }
}

/* Final homepage headline refinement */
.hero-home h2 {
  font-size: clamp(2.8rem, 4.25vw, 4.45rem);
  line-height: 1.02;
}


/* Storyteller, invitation, and contact page */
.storyteller-section,
.story-invitation,
.contact-intro,
.contact-card {
  max-width: 820px;
  margin: 64px auto;
}
.storyteller-section,
.story-invitation {
  border-top: 1px solid rgba(72, 76, 55, .22);
  padding-top: 42px;
}
.storyteller-section h2,
.story-invitation h2,
.contact-intro h1 {
  margin-top: .25rem;
}
.contact-intro {
  text-align: center;
  margin-bottom: 32px;
}
.contact-intro .lead {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
.contact-card {
  margin-top: 24px;
  padding: 34px;
  background: rgba(255,255,255,.36);
  border: 1px solid rgba(72,76,55,.18);
}
.contact-card label {
  display: block;
  margin-bottom: 20px;
  font-weight: 600;
}
.contact-card input,
.contact-card textarea {
  width: 100%;
  box-sizing: border-box;
  margin-top: 8px;
  padding: 12px 13px;
  font: inherit;
  color: inherit;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(72,76,55,.30);
  border-radius: 2px;
}
.contact-card textarea {
  resize: vertical;
}
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.contact-submit {
  border: 0;
  cursor: pointer;
}
.form-note {
  margin-top: 16px;
  font-size: .9rem;
  opacity: .72;
}
@media (max-width: 700px) {
  .form-grid { grid-template-columns: 1fr; gap: 0; }
  .contact-card { padding: 24px 20px; }
}