/* Nuestra Historia · [NATIVE/CSS]. Loaded only by the internal page.
   Shared tokens, header, newsletter, footer and motion stay in styles.css. */
.history-page {
  --history-hero-position: 50% 42%;
  --history-hero-position-mobile: 44% 50%;
  --history-closing-position: 50% 35%;
  --history-closing-position-mobile: 50% 38%;
}
.history-hero.hero { height: 84vh; min-height: 460px; }
.history-hero .hero-media > img { object-position: var(--history-hero-position); }
.history-reading { max-width: 760px; }
.history-origin { background: var(--soft-pink); color: var(--navy); text-align: center; }
.history-origin h2 { margin: 28px auto 36px; text-wrap: balance; }
.history-prose { max-width: 600px; margin-inline: auto; }
.history-prose p + p { margin-top: 22px; }
.history-manifesto { background: var(--white-warm); text-align: center; }
.history-manifesto blockquote { margin: 0 auto; max-width: 1100px; font-family: var(--font-display); font-size: clamp(1.9rem, 3.5vw, 3.5rem); font-weight: 400; line-height: 1.3; text-wrap: balance; }
.history-designer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 7vw, 112px); align-items: center; }
.history-portrait { aspect-ratio: 1467 / 2200; }
.history-portrait img { object-position: 50% 40%; }
.history-designer-copy { min-width: 0; }
.history-designer-copy h2 { margin-block: 24px 32px; }
.history-designer-copy .history-prose { margin-left: 0; }
.history-evolution { background: var(--navy); color: var(--ivory); text-align: center; }
.history-evolution h2 { margin-bottom: 36px; }
.history-evolution .history-prose { max-width: 550px; }
.history-bolivia { background: var(--ivory); color: var(--navy); text-align: center; }
.history-bolivia h2 { margin-block: 28px 36px; }
.history-closing { height: 90vh; min-height: 600px; }
.history-closing .campaign-media img { object-position: var(--history-closing-position); }
.history-closing .campaign-panel-copy h2 { font-size: clamp(2.4rem, 4.2vw, 4.2rem); }
.history-closing .campaign-panel-copy p { font-size: .65rem; letter-spacing: .16em; }
@media (min-width: 901px) {
  /* Widen only the heading frame; body copy retains its 600px reading width. */
  .history-origin .history-reading { max-width: 1100px; }
  .history-origin h2 span { display: block; }
}
@media (max-width: 900px) {
  .history-designer-grid { gap: 40px; align-items: start; }
  .history-designer-copy h2 { font-size: 2.4rem; }
}
@media (max-width: 700px) {
  .history-designer-grid { grid-template-columns: 1fr; gap: 44px; }
  .history-portrait { max-width: 480px; width: 100%; margin-inline: auto; }
  .history-designer-copy { max-width: 540px; margin-inline: auto; }
  .history-quote-break { display: none; }
}
@media (max-width: 600px) {
  .history-hero.hero { height: 72svh; min-height: 400px; padding-bottom: 52px; }
  .history-hero .hero-media > img { object-position: var(--history-hero-position-mobile); }
  .history-origin h2 { font-size: clamp(1.85rem, 7.8vw, 2.6rem); margin-block: 24px 30px; }
  .history-prose p { font-size: 13px; }
  .history-manifesto blockquote { font-size: clamp(1.85rem, 7.5vw, 2.6rem); }
  .history-closing { height: 82svh; min-height: 560px; }
  .history-closing .campaign-media img { object-position: var(--history-closing-position-mobile); }
}
/* Client launch photography, immediately after Meet the Designer. */
.history-milestone { background: var(--soft-pink); }
.history-milestone > .container { display: grid; grid-template-columns: 1fr 1.4fr; gap: 48px 8%; align-items: center; }
.milestone-copy h2 { margin: 22px 0 28px; }
.milestone-copy p:not(.eyebrow) { max-width: 360px; font-size: 14px; }
.milestone-copy .text-link { margin-top: 28px; }
.history-milestone img { display: block; width: 100%; height: auto; }
.milestone-secondary { grid-column: 2; width: 72%; justify-self: end; }
@media (max-width: 700px) {
 .history-milestone > .container { grid-template-columns: 1fr; gap: 36px; }
 .milestone-secondary { grid-column: 1; width: 85%; }
}

.milestone-copy p + p { margin-top:20px; }
.milestone-copy h2 { font-size:clamp(2rem,3.2vw,3.2rem); }