/* ===== 30 Oct: animated "reading" hero (home page, all languages) ===== */
.hero-read{--barh:112px;--sig:#9FD2A3;--rose:#E0479E;position:relative;overflow:hidden;background:#8db7e6;
  height:calc(100svh - 118px);min-height:max(calc(41.5vw + var(--barh)),600px)}
.hero-read .hr-media{position:absolute;left:0;right:0;top:0;bottom:var(--barh)}
.hero-read .hr-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right 42%;transform:scale(1.06);transition:transform 3s cubic-bezier(.2,.7,.1,1)}
.hero-read.ready .hr-photo{transform:scale(1)}
.hero-read .hr-ov{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hero-read:before{content:"";position:absolute;left:0;right:0;top:0;bottom:var(--barh);z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(10,35,66,.38) 0%,rgba(10,35,66,.22) 26%,rgba(10,35,66,0) 46%)}
.hero-read .hr-copy{position:absolute;z-index:2;left:max(24px,4vw);top:0;bottom:var(--barh);width:var(--copyw,40vw);display:flex;flex-direction:column;justify-content:center;color:#fff}
.hero-read .kicker{color:#fff!important;margin:0 0 18px;opacity:0;transform:translateY(10px);transition:opacity .9s ease .2s,transform .9s ease .2s}
.hero-read h1{color:#fff!important;font-size:var(--h1fs,clamp(2.6rem,4.5vw,5.4rem))!important;line-height:.92;margin:0 0 22px;max-width:none;text-shadow:0 2px 24px rgba(10,35,66,.25);white-space:nowrap;hyphens:manual!important;overflow-wrap:normal!important}
.hero-read h1 .ln{display:block;overflow:hidden;padding-bottom:.04em}
.hero-read h1 .ln>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s cubic-bezier(.2,.7,.1,1)}
.hero-read h1 .ln:nth-child(2)>span{transition-delay:.12s}
.hero-read.ready h1 .ln>span{transform:none}
.hero-read .lead{color:#fff!important;font-size:1.1rem;line-height:1.55;max-width:none;margin:0;text-shadow:0 1px 14px rgba(10,35,66,.35);opacity:0;transform:translateY(10px);transition:opacity .9s ease .45s,transform .9s ease .45s}
.hero-read .download-row{margin-top:24px;opacity:0;transform:translateY(10px);transition:opacity .9s ease .6s,transform .9s ease .6s}
.hero-read.ready .kicker,.hero-read.ready .lead,.hero-read.ready .download-row{opacity:1;transform:none}
.hero-read .download-row .download-btn+.download-btn{background:#fff!important;border-color:#fff!important;color:var(--granite,#466060)!important}

/* overlay graphics */
.hero-read .box{fill:none;stroke:#fff;stroke-opacity:.92}
.hero-read .hair{stroke:#fff;stroke-opacity:.6;fill:none}
.hero-read .dot{fill:#fff}
.hero-read .pill{fill:rgba(20,26,26,.72)}
.hero-read .lbl{fill:#fff;font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:500;letter-spacing:.02em}

/* instrument bar */
.hero-read .hr-bar{position:absolute;z-index:3;left:0;right:0;bottom:0;height:var(--barh);background:#1F1F1F;color:#fff;display:grid;
  grid-template-columns:auto 1.2fr 1.2fr 1.6fr;align-items:center;padding:14px max(24px,2.5vw);font-family:"IBM Plex Mono",ui-monospace,monospace}
.hero-read .cell{height:100%;display:flex;flex-direction:column;justify-content:center;padding:0 22px;border-left:1px solid rgba(255,255,255,.14);min-width:0}
.hero-read .cell:first-child{border-left:0;padding-left:0}
.hero-read .cap{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.62);margin-bottom:7px;white-space:nowrap;overflow:hidden;text-overflow:clip}
.hero-read .big{font-size:.8rem;letter-spacing:.12em;white-space:nowrap}
.hero-read .cnt{color:var(--rose);font-weight:600}
.hero-read canvas{display:block;width:100%;height:42px}
.hero-read .post{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.hero-read .chip{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.54rem;letter-spacing:.1em;color:rgba(255,255,255,.45);transition:color .4s;white-space:nowrap}
.hero-read .chip i{width:9px;height:9px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);transition:background .4s,border-color .4s,box-shadow .4s}
.hero-read .chip.on{color:#fff}
.hero-read .chip.on i{background:var(--rose);border-color:var(--rose);box-shadow:0 0 0 4px rgba(224,71,158,.22)}

/* phones and small tablets: photo on top, text below (as the rest of the site) */
@media (max-width:940px){
  .hero-read{height:auto;min-height:0;overflow:visible;background:var(--ivory,#FFFDF7)}
  .hero-read:before{display:none}
  .hero-read .hr-media{position:relative;inset:auto;aspect-ratio:1/1;overflow:hidden}
  .hero-read .hr-photo{object-position:97% 50%}
  .hero-read .hr-bar{position:relative;height:auto;grid-template-columns:auto 1fr 1fr;padding:12px 16px}
  .hero-read .cell{padding:0 12px}
  .hero-read .cell.posture{display:none}
  .hero-read canvas{height:30px}
  .hero-read .hr-copy{position:relative;left:auto;top:auto;bottom:auto;width:auto;padding:34px 22px 54px;color:var(--navy,#0A2342)}
  .hero-read .kicker{color:var(--granite,#466060)!important}
  .hero-read h1{color:var(--granite,#466060)!important;text-shadow:none;white-space:normal;font-size:var(--h1fs,clamp(2.2rem,11vw,4.2rem))!important}
  .hero-read .lead{text-shadow:none;color:var(--navy,#0A2342)!important;font-size:1.05rem}
  .hero-read .download-row .download-btn+.download-btn{background:transparent!important;border-color:var(--jungle,#57886C)!important;color:var(--jungle,#57886C)!important}
}
@media (min-width:941px) and (max-width:1180px){.hero-read .cell.wave{display:none}.hero-read .hr-bar{grid-template-columns:auto 1.3fr 1.6fr}}
@media (max-width:420px){.hero-read .hr-bar{grid-template-columns:auto 1fr}.hero-read .cell.wave{display:none}}
@media (prefers-reduced-motion:reduce){.hero-read *{transition:none!important}}
