/* ===== Our Story — paper, editorial, generous margins ===== */

body{background:var(--paper)}

.opening{padding-block:clamp(3.5rem,8vw,7rem)}
.opening__grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(2rem,7vw,6rem);align-items:start}
.opening h2{font-size:clamp(2.2rem,4.4vw,3.4rem);position:sticky;top:7rem}
.opening__body p:first-of-type::first-letter{
  float:left;font-family:var(--display);font-size:4.6rem;line-height:.78;
  padding:.35rem .7rem 0 0;color:var(--clay)
}
.opening__body p{font-size:1.06rem;color:var(--ink-soft)}

/* full-bleed image band */
.band-figure{margin-block:clamp(1rem,3vw,2rem)}
.band{height:clamp(320px,58vh,620px)}
.band-figure figcaption{
  max-width:var(--maxw);margin:1rem auto 0;padding-inline:var(--pad);
  font-size:.82rem;letter-spacing:.06em;color:var(--ink-soft)
}

/* pull quote */
.pull{padding-block:clamp(3rem,7vw,6rem)}
.pull blockquote{
  font-family:var(--display);font-style:italic;font-size:clamp(1.7rem,4vw,3rem);
  line-height:1.22;margin:0;padding-left:clamp(1rem,3vw,2.5rem);border-left:2px solid var(--clay)
}
.pull cite{display:block;margin-top:1.6rem;padding-left:clamp(1rem,3vw,2.5rem);
  font-style:normal;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--clay)}

/* timeline */
.timeline{background:var(--sand)}
.tl{margin-top:clamp(2.5rem,5vw,4rem);border-top:1px solid var(--line)}
.tl__row{
  display:grid;grid-template-columns:8rem 1fr 1.1fr;gap:clamp(1.5rem,4vw,3.5rem);
  padding:clamp(1.8rem,3.5vw,2.8rem) 0;border-bottom:1px solid var(--line);
  transition:background .4s var(--ease)
}
.tl__row:hover{background:rgba(180,83,42,.05)}
.tl__year{font-family:var(--display);font-size:clamp(1.8rem,3vw,2.5rem);color:var(--clay);line-height:1}
.tl__row h3{font-size:1.5rem;margin-bottom:.4rem}
.tl__row p{margin:0;color:var(--ink-soft);font-size:.95rem}
.tl__art{aspect-ratio:16/10;align-self:center}

/* values */
.values__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,2.5rem);margin-top:3.5rem}
.value{padding:2.2rem;border:1px solid var(--line);background:var(--paper);position:relative}
.value::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--clay);
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)
}
.value:hover::before{transform:scaleX(1)}
.value h3{margin-bottom:.7rem}
.value p{margin:0;color:var(--ink-soft);font-size:.94rem}

/* two-column feature */
.feature{background:var(--ink);color:var(--sand)}
.feature__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);align-items:center}
.feature h2{color:var(--paper)}
.feature .eyebrow{color:var(--gold)}
.feature p{color:rgba(246,240,231,.68)}
.feature__art{aspect-ratio:1;border-radius:50%}
.feature ul{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:.9rem}
.feature li{display:flex;gap:.9rem;color:rgba(246,240,231,.75);font-size:.95rem}
.feature li::before{content:"✦";color:var(--gold);font-size:.7rem;transform:translateY(.35rem)}

/* press */
.press__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;margin-top:3rem}
.press__item{text-align:center;padding:2rem 1rem;border:1px solid var(--line)}
.press__item b{display:block;font-family:var(--display);font-size:1.35rem;margin-bottom:.5rem}
.press__item span{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);opacity:.8}

@media (max-width:900px){
  .opening__grid,.feature__grid,.values__grid{grid-template-columns:1fr}
  .opening h2{position:static}
  .tl__row{grid-template-columns:5rem 1fr}
  .tl__art{display:none}
  .press__grid{grid-template-columns:1fr 1fr}
}