/* ============================================================
   VISION — one question, three answers, one open door.
   B&W photographic entry, the athlos etymology as the pivot.
   Ink everywhere, orange as accent only.
   ============================================================ */

/* ---------- Shared vocabulary ---------- */
.vision-eyebrow{font-size:clamp(.62rem,1vw,.72rem);text-transform:uppercase;color:var(--body);}
.vision-band{border-top:1px solid var(--hair-soft);padding:clamp(4.5rem,11vh,8.5rem) 0;background:var(--ink);}
.vision-band .wrap{max-width:1360px;}

/* ---------- Hero: full-bleed B&W squad, statement anchored low ---------- */
.vision-hero{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:100svh;padding:calc(var(--nav-h) + 4rem) 0 clamp(2rem,5vh,3.5rem);background:var(--ink);overflow:hidden;}
.vision-hero-media{position:absolute;inset:0;}
.vision-hero-media img{width:100%;height:100%;object-fit:cover;object-position:50% 44%;filter:grayscale(1) contrast(1.16) brightness(.68);}
.vision-hero-shade{position:absolute;inset:0;background:linear-gradient(to top,var(--ink) 3%,rgba(14,14,15,.62) 46%,rgba(14,14,15,.42) 100%);}
.vision-hero .wrap{position:relative;z-index:1;width:100%;max-width:1360px;}
.vision-hero .mast{font-size:clamp(2.6rem,7vw,6.6rem);line-height:1;max-width:14ch;}
.vision-hero .mast .o{color:var(--orange);}

/* Hero footline: where we are, said plainly. */
.vision-hero-meta{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1rem 2rem;margin-top:clamp(2.5rem,7vh,4.5rem);padding-top:1.3rem;border-top:1px solid rgba(245,244,241,.22);}
.vision-hero-meta p{font-size:clamp(.62rem,1vw,.72rem);line-height:1.5;text-transform:uppercase;color:var(--body-strong);}
.vision-hero-meta p .o{color:var(--orange);}

/* ---------- Athlos: the word, then the question it leaves ---------- */
.vision-athlos-band{text-align:center;padding-bottom:clamp(3.5rem,8vh,6rem);}

.athlos{display:flex;justify-content:center;align-items:flex-start;flex-wrap:wrap;gap:clamp(1.2rem,5vw,4.5rem);margin:clamp(2.5rem,7vh,4.5rem) 0 clamp(2.5rem,6vh,3.5rem);}
.athlos-w b{display:block;font-size:clamp(2.4rem,6.4vw,5.4rem);line-height:1;color:var(--head);}
.athlos-w span{display:block;margin-top:1.1rem;font-size:.64rem;line-height:1;text-transform:uppercase;color:var(--orange);}
.athlos-x{font-size:clamp(1.1rem,2.2vw,1.8rem);line-height:1;color:var(--body);opacity:.6;align-self:center;margin-top:.4em;}
.athlos-note{font-size:clamp(1rem,1.3vw,1.15rem);line-height:1.75;color:var(--body-strong);max-width:56ch;margin:0 auto;}
.athlos-ask{font-size:clamp(2rem,5vw,4.4rem);line-height:1.06;color:var(--head);margin-top:clamp(2.5rem,7vh,4.5rem);}
.athlos-ask .o{color:var(--orange);}

/* ---------- The three answers: one rule each, no numbering ---------- */
.vision-pact{padding-top:clamp(3.5rem,8vh,6rem);border-top:0;}
.pact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.8rem,4vw,3.5rem);}
.pact-grid article{border-top:1px solid var(--hair);padding-top:1.9rem;}
.pact-grid h3{font-size:clamp(1.3rem,2.2vw,1.95rem);line-height:1.08;text-wrap:balance;color:var(--head);margin-bottom:1.1rem;}
.pact-grid h3 .o{color:var(--orange);}
.pact-grid p{font-size:.98rem;line-height:1.72;color:var(--body-strong);}

/* ---------- The door: invitation, split ---------- */
.vision-door{border-top:1px solid var(--hair-soft);padding:clamp(4.5rem,11vh,8rem) 0;background:var(--ink);}
.vision-door .wrap{max-width:1360px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start;}
.vision-door h2{font-size:clamp(1.8rem,4vw,3.4rem);line-height:1.06;color:var(--head);max-width:12ch;}
.vision-door p{font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.75;color:var(--body-strong);margin-bottom:1.1rem;max-width:46ch;}
.vision-door .text-link{margin-top:1.2rem;}

/* ---------- Mobile: keep the scale, drop the columns ---------- */
@media (max-width:900px){
  .pact-grid,.vision-door .wrap{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .vision-hero{min-height:92svh;padding-top:calc(var(--nav-h) + 2.5rem);}
  .vision-hero .mast{max-width:none;}
  .athlos{gap:1rem 1.5rem;}
  .vision-athlos-band{text-align:left;}

  .athlos{justify-content:flex-start;}
  .athlos-note{margin-inline:0;}
}