/* The photographic hero is an equal composition, not a narrow side card. */
.hero-art { position:relative; display:block; }
.hero-media { position:absolute; inset:0; overflow:hidden; background:#12213a; box-shadow:0 24px 50px rgba(22,24,29,.16); }
.hero-media > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:58% center; filter:saturate(.82) contrast(1.04); animation:vezolino-hero-breathe 12s ease-in-out infinite alternate; }
.hero-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(9,16,27,.1) 10%,rgba(9,16,27,.76) 86%),linear-gradient(90deg,rgba(9,16,27,.35),transparent 60%); pointer-events:none; }
.hero-media-copy { position:absolute; z-index:1; right:8%; bottom:8%; left:8%; color:#fcfaf5; }
.hero-media-copy span { display:block; color:#e6d9c4; font-size:10px; letter-spacing:.14em; }
.hero-media-copy strong { display:block; max-width:290px; margin-top:clamp(90px,10vw,135px); font:500 clamp(3rem,4.1vw,4.55rem)/.84 var(--serif); letter-spacing:-.055em; text-shadow:0 2px 18px rgba(0,0,0,.3); }
.hero-art-note { position:absolute; z-index:2; top:7%; left:-36px; padding:17px; color:#f8eee5; background:var(--clay); box-shadow:0 12px 24px rgba(22,24,29,.11); font-size:10px; line-height:1.35; letter-spacing:.14em; }
.hero-art-orb { position:absolute; z-index:2; bottom:-26px; left:-29px; width:77px; height:77px; overflow:hidden; border:1px solid #164cc1; border-radius:50%; background:#164cc1; box-shadow:0 0 0 8px rgba(22,76,193,.09),0 8px 22px rgba(22,76,193,.25); }
.hero-art-orb::after { content:""; position:absolute; width:9px; height:9px; top:calc(50% - 4px); left:calc(50% - 4px); border-radius:50%; background:#f7f5f0; box-shadow:0 0 0 15px rgba(247,245,240,.14); animation:vezolino-signal 3s ease-in-out infinite; }
@media (min-width:1101px) {
  .hero {
    grid-template-columns:minmax(0,1.18fr) minmax(500px,1fr);
    column-gap:clamp(30px,2.6vw,48px);
    min-height:820px;
  }
  .hero-copy { padding-bottom:0; transform:translateY(-52px); }
  .hero h1 { max-width:840px; font-size:clamp(4.35rem,6.2vw,6.9rem); }
  .hero-art {
    width:100%;
    height:clamp(500px,39vw,620px);
    grid-template-columns:1fr;
    grid-template-rows:1fr;
    align-self:center;
    transform:translateY(-80px);
  }
  .hero-media-copy strong { max-width:350px; margin-top:clamp(110px,11vw,165px); font-size:clamp(3.2rem,4.4vw,5.25rem); }
}

@media (min-width:801px) and (max-width:1100px) {
  .hero { grid-template-columns:minmax(0,1.15fr) minmax(320px,.98fr); column-gap:32px; }
  .hero-art { width:100%; height:370px; grid-template-columns:1fr; grid-template-rows:1fr; }
  .hero-art-note { left:-28px; }
  .hero-art-orb { bottom:-23px; left:-23px; }
}

@media (max-width:800px) {
  .hero-art { height:310px; }
  .hero-media-copy strong { max-width:235px; margin-top:102px; font-size:clamp(2.35rem,10.8vw,3rem); }
  .hero-art-note { top:8%; left:-1px; padding:14px 8px; }
  .hero-art-orb { bottom:-18px; left:-16px; width:48px; height:48px; box-shadow:0 0 0 5px rgba(22,76,193,.09),0 8px 18px rgba(22,76,193,.22); }
  .hero-art-orb::after { width:7px; height:7px; top:calc(50% - 3px); left:calc(50% - 3px); }
}

@media (prefers-reduced-motion:reduce) { .hero-media > img,.hero-art-orb::after { animation:none; } }
