/* Hero: single source of truth for desktop and mobile */
.hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  align-items:center;
  gap:clamp(44px,6vw,96px);
  min-height:100svh;
  padding:clamp(112px,13vh,142px) clamp(28px,7vw,135px) clamp(48px,7vh,76px);
  background:
    linear-gradient(rgba(8,35,59,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(8,35,59,.028) 1px,transparent 1px),
    linear-gradient(120deg,#fbfaf6 0%,#f5f1e8 64%,#e8eef0 100%);
  background-size:56px 56px,56px 56px,auto;
  overflow:clip;
}
.hero-content{position:relative;z-index:1;max-width:690px}
.hero-eyebrow{margin:0 0 15px;color:var(--gold);font-size:.72rem;font-weight:700;letter-spacing:.2em}
.hero h1{margin:0;color:var(--navy);font:600 clamp(3.7rem,5.1vw,5.8rem)/.98 var(--serif);letter-spacing:-.04em}
.hero-description{max-width:590px;margin:20px 0 0;color:#3f5666;font-size:clamp(1rem,1.3vw,1.16rem);line-height:1.55}
.advisor-info{display:flex;flex-direction:column;margin:22px 0 0;padding-left:16px;border-left:3px solid var(--gold)}
.advisor-info strong{color:var(--navy);font:600 1.25rem var(--serif)}
.advisor-info span{margin-top:2px;color:var(--muted);font-size:.78rem}
.hero-support{max-width:590px;margin:18px 0 0;color:var(--muted);font-size:.92rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:25px}
.hero-visual{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-width:0}
/* Reusable portrait treatment shared by Hero and About */
.advisor-portrait{position:relative;aspect-ratio:3/4;overflow:hidden;border:7px solid rgba(255,255,255,.9);border-radius:24px;outline:1px solid rgba(185,144,76,.5);background:#e8ecee;box-shadow:0 26px 70px rgba(8,35,59,.18)}
.advisor-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .4s ease}
.portrait-card{width:min(100%,440px,calc((100svh - 190px)*.75));transition:transform .18s ease}
.about-photo{width:100%;max-width:390px;justify-self:center}
.about-photo.reveal{transform:translateY(20px) scale(.98)}
.about-photo.reveal.visible{transform:none}
@media (hover:hover) and (pointer:fine){.about-photo.visible:hover img{transform:scale(1.02)}}

@media (max-width:1100px) and (min-width:761px){
  .hero{grid-template-columns:minmax(0,1fr) minmax(320px,.78fr);gap:38px;padding-inline:42px}
  .hero h1{font-size:clamp(3.45rem,5.7vw,4.65rem)}
  .portrait-card{max-width:410px}
}

@media (max-width:760px){
  .hero{
    display:grid;
    grid-template-columns:1fr;
    gap:28px;
    min-height:0;
    padding:92px 24px 70px;
    background-size:48px 48px,48px 48px,auto;
    overflow:clip;
  }
  .hero-content{width:100%;max-width:430px;margin:0 auto}
  .hero-eyebrow{margin-bottom:11px;font-size:clamp(.69rem,2.9vw,.78rem);line-height:1.4;letter-spacing:.17em}
  .hero h1{font-size:clamp(2.7rem,12.2vw,3.18rem);line-height:1.01;letter-spacing:-.038em}
  .hero-description{margin-top:16px;font-size:clamp(1rem,4.2vw,1.1rem);line-height:1.5}
  .advisor-info,.hero-support{display:none}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:22px}
  .hero-actions .btn{width:100%;min-height:50px;padding-inline:16px}
  .hero-visual{width:100%}
  .advisor-portrait{border-width:5px;border-radius:20px;box-shadow:0 20px 48px rgba(8,35,59,.17)}
  .portrait-card{width:min(88%,330px);margin:0 auto;transform:none!important}
  .about-photo{width:86%;max-width:320px;margin:0 auto}
  .advisor-portrait img{object-position:center top}
}

@media (max-width:374px){
  .hero{padding-inline:22px}
  .hero h1{font-size:2.67rem}
}

@media (prefers-reduced-motion:reduce){.portrait-card{transition:none}}