/* ═══ HOME HERO ═════════════════════════════════════════════ */
.hero{position:relative;overflow:hidden;
  margin-top:calc(var(--hdrH,98px) * -1);padding:calc(var(--hdrH,98px) + 40px) 0 96px;
  background:var(--ivory)}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(50% 56% at 76% 10%,rgba(201,151,63,.3),transparent 66%),
             radial-gradient(46% 52% at 2% 60%,rgba(26,98,145,.16),transparent 70%),
             radial-gradient(40% 46% at 58% 104%,rgba(212,166,75,.2),transparent 68%)}
.ghost{position:absolute;left:50%;translate:-50% 0;bottom:-6%;width:120%;text-align:center;
  font-family:var(--font-display);font-weight:700;font-size:clamp(90px,15vw,240px);line-height:.8;
  letter-spacing:.05em;color:rgba(27,58,92,.045);white-space:nowrap;pointer-events:none;user-select:none}
.hero .wrap{position:relative;z-index:3}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:52px;align-items:center}
.hero .shd{font-size:calc(clamp(36px,4.7vw,60px) * var(--h-scale,1));margin:22px 0 22px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero-note{margin-top:22px;font-size:13.5px;color:var(--text-3);display:flex;align-items:center;gap:8px;font-weight:500}

/* portrait — free-standing on the gradient, no frame or fill */
.portrait-wrap{position:relative;display:flex;justify-content:center;align-items:flex-end;min-height:500px}
.halo{position:absolute;bottom:2%;left:50%;translate:-50% 0;width:min(440px,96%);aspect-ratio:1;
  border-radius:50%;background:radial-gradient(circle,rgba(201,151,63,.34),rgba(201,151,63,.07) 56%,transparent 72%);
  filter:blur(6px)}
.ring{position:absolute;bottom:7%;left:50%;translate:-50% 0;width:min(392px,88%);aspect-ratio:1;
  border-radius:50%;border:1px solid rgba(201,151,63,.42)}
.ring::after{content:"";position:absolute;inset:26px;border-radius:50%;border:1px dashed rgba(27,58,92,.15)}
.portrait{position:relative;z-index:2;width:min(430px,100%);height:auto;
  /* an unusually tall photo scales down instead of overflowing the hero,
     and sits on the base line rather than having its head clipped */
  max-height:min(76vh,680px);object-fit:contain;object-position:bottom center;
  filter:drop-shadow(0 30px 40px rgba(18,40,63,.28));
  -webkit-mask-image:linear-gradient(180deg,#000 0 58%,rgba(0,0,0,.94) 78%,rgba(0,0,0,.5) 91%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0 58%,rgba(0,0,0,.94) 78%,rgba(0,0,0,.5) 91%,transparent 100%)}

/* glass cards over the portrait */
.badge{position:absolute;z-index:4;line-height:var(--lh-snug);background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%);
  border:1px solid rgba(255,255,255,.95);border-radius:18px;padding:14px 17px;
  box-shadow:var(--sh-x),inset 0 1px 0 #fff}
.badge .t{font-family:var(--font-display);font-weight:600;font-size:14.5px;color:var(--navy-deep);line-height:var(--lh-snug)}
.badge .s{font-family:var(--font-label);font-size:9px;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;color:var(--text-3)}
.badge-a{left:-14px;bottom:30%;display:flex;align-items:center;gap:12px}
.badge-b{right:-12px;bottom:7%;width:216px}
.badge-i{width:36px;height:36px;border-radius:12px;flex:none;display:grid;place-items:center;
  background:linear-gradient(165deg,var(--gold-pale),var(--gold-pale-2));color:var(--gold-deep);
  box-shadow:inset 0 1px 0 #fff,inset 0 -3px 8px rgba(150,110,30,.16)}
.bd-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;padding:7px 0;
  border-top:1px solid rgba(27,58,92,.1)}
.bd-row span:first-child{color:var(--text-3);font-weight:500}
.bd-row span:last-child{color:var(--navy);font-weight:600}
.urg{color:var(--alert);display:inline-flex;align-items:center;gap:6px}
.urg i{width:7px;height:7px;border-radius:50%;background:var(--alert);animation:pl 2.4s infinite}
@keyframes pl{0%{box-shadow:0 0 0 0 rgba(180,71,44,.5)}70%{box-shadow:0 0 0 8px rgba(180,71,44,0)}100%{box-shadow:0 0 0 0 rgba(180,71,44,0)}}

/* soft light forms drifting behind the hero + inner page heads */
.blob{position:absolute;border-radius:50%;pointer-events:none;filter:blur(46px);opacity:.5;
  animation:drift 22s ease-in-out infinite}
.blob.gold{background:radial-gradient(circle,rgba(224,183,106,.85),transparent 68%)}
.blob.steel{background:radial-gradient(circle,rgba(120,168,204,.7),transparent 68%)}
.blob.b1{width:340px;height:340px;left:-4%;top:16%}
.blob.b2{width:220px;height:220px;right:9%;bottom:14%;animation-duration:17s;animation-direction:reverse}
.blob.b3{width:160px;height:160px;left:38%;bottom:12%;animation-duration:26s}
@keyframes drift{0%,100%{transform:translate3d(0,0,0) scale(1)}
                 50%{transform:translate3d(26px,-30px,0) scale(1.09)}}

/* every hero fades into the page rather than stopping on a line */
.hero::after,.phero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:190px;
  z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(247,244,239,0),var(--ivory))}