/* Positive hero: the existing message and portrait, with a warm editorial accent. */
.hero{padding-top:64px;align-items:center}
.hero-copy{padding-bottom:58px}
.hero h1{margin:26px 0 30px;font-size:clamp(42px,4.8vw,64px);line-height:1.3;letter-spacing:-.045em}
.hero .hero-title-line{overflow:visible;padding:0;margin:0}
.hero .hero-title-line:first-child{font-size:clamp(27px,2.7vw,36px);font-weight:700;letter-spacing:.015em;margin-bottom:15px}
.hero .hero-title-line:nth-child(2){margin-bottom:13px}
.hero .hero-title-line:nth-child(2)>span{display:inline-block;transform:none}
.hero h1 em{position:relative;isolation:isolate;display:inline-block;color:var(--brand-red);font-weight:900;font-style:normal;white-space:nowrap}
.hero .hero-hope-line{position:absolute;left:-1%;bottom:-.17em;width:103%;height:.25em;overflow:visible;pointer-events:none;z-index:-1}
.hero .hero-hope-line path{fill:none;stroke:#ffedb5;stroke-width:10;stroke-linecap:round}
.hero .hero-title-line:last-child{font-size:clamp(56px,6vw,78px);font-weight:900;letter-spacing:-.04em}
.hero .hero-lead{line-height:2.1}
.hero-actions{margin-top:30px;gap:14px}
.hero .button,.hero .small-link{min-height:54px;padding-inline:25px}
.hero .button>span{display:grid;place-items:center;width:24px;height:24px;border:1px solid #ffffff80;border-radius:50%;font-size:15px}
.hero .portrait::before{width:490px;height:450px;bottom:12px;border-radius:49% 51% 45% 55%;transform:rotate(-9deg);background:#ffedb5;box-shadow:0 0 0 22px #fff8e8}
.hero .hero-identity{background:#fffffff5;border-color:#e7e4df;box-shadow:none;padding:16px 22px}
.hero .hero-name{font-size:30px;letter-spacing:.12em}
@media(min-width:751px) and (max-width:1050px){
 .hero{padding-top:46px}
 .hero h1{font-size:clamp(38px,4.8vw,50px)}
 .hero .hero-title-line:first-child{font-size:27px}
 .hero .hero-title-line:last-child{font-size:62px}
 .hero .portrait::before{width:410px;height:420px}
 .hero .button,.hero .small-link{font-size:13px;padding-inline:19px}
 .hero .hero-identity{padding:14px}
 .hero .hero-name{font-size:27px}
}
@media(max-width:750px){
 .hero{padding-top:36px}
 .hero-copy{padding-bottom:0}
 .hero h1{font-size:clamp(34px,9.5vw,54px);margin:24px 0 26px;line-height:1.3}
 .hero .hero-title-line:first-child{font-size:clamp(25px,6.5vw,32px);margin-bottom:14px;letter-spacing:0}
 .hero .hero-title-line:nth-child(2){margin-bottom:12px}
 .hero .hero-title-line:last-child{font-size:clamp(50px,13vw,68px)}
 .hero .hero-lead{font-size:14px;line-height:2}
 .hero-actions{margin-top:24px;gap:10px}
 .hero .button,.hero .small-link{min-height:50px;padding-inline:20px;font-size:13px}
 .hero .portrait::before{width:360px;height:340px;bottom:-55px;box-shadow:0 0 0 19px #fff8e8}
 .hero .hero-identity{padding:12px 17px}
 .hero .hero-name{font-size:25px}
}
@media(max-width:380px){
 .hero .hero-title-line:first-child{font-size:25px}
 .hero .hero-title-line:last-child{font-size:52px}
 .hero .hero-identity{padding:12px}
}

/* Portrait-led composition: clear round backdrop and a separate name block. */
.hero .portrait{display:flex;flex-direction:column;align-items:center;align-self:center;justify-content:flex-start;height:auto;overflow:visible;padding-bottom:24px}
.hero .portrait::before{width:calc(100% - 24px);max-width:470px;height:auto;aspect-ratio:1;left:50%;top:62px;bottom:auto;transform:translateX(-50%);border-radius:50%;background:linear-gradient(145deg,#ffe7a1,#ffd86a);box-shadow:0 0 0 10px #fff8e8}
.hero .portrait-photo{position:relative;flex:none;width:100%;height:520px;overflow:hidden;z-index:1;border-radius:0 0 46% 46% / 0 0 18% 18%}
.hero .portrait-photo img{position:absolute;height:720px;max-width:none;width:auto;left:50%;top:0;bottom:auto;transform:translateX(-50%)}
@media(min-width:751px) and (max-width:1050px){
 .hero .portrait-photo{height:480px}
 .hero .portrait-photo img{height:680px}
}
@media(max-width:750px){
 .hero .portrait{margin-top:42px;padding-bottom:30px;height:auto}
 .hero .portrait::before{width:calc(100% - 24px);max-width:340px;top:42px;bottom:auto;box-shadow:0 0 0 10px #fff8e8}
 .hero .portrait-photo{height:380px;max-width:390px}
 .hero .portrait-photo img{height:530px}
}

/* Mobile first view: a complete face before the supporting copy. */
.hero-mikan{display:none}
@media(max-width:750px){
 .hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:0;padding-top:26px;padding-bottom:26px;isolation:isolate}
 .hero .hero-copy{display:contents}
 .hero .eyebrow{grid-row:1;position:relative;z-index:1;font-size:12px}
 .hero h1{grid-row:2;position:relative;z-index:1;margin:20px 0 14px;font-size:clamp(32px,8.8vw,48px);line-height:1.22}
 .hero .hero-title-line:first-child{font-size:clamp(23px,6.1vw,29px);margin-bottom:10px}
 .hero .hero-title-line:nth-child(2){margin-bottom:9px}
 .hero .hero-title-line:last-child{font-size:clamp(45px,11.8vw,60px)}
 .hero .hero-mikan{display:block;position:absolute;width:102px;height:102px;right:24px;top:64px;opacity:.28;z-index:0;pointer-events:none;transform:rotate(12deg)}
 .hero .portrait{grid-row:3;margin:0 auto 22px;max-width:350px;padding-bottom:0;align-self:start}
 .hero .portrait::before{top:28px;max-width:300px;width:calc(100% - 34px);box-shadow:0 0 0 8px #fff8e8}
 .hero .portrait-photo{height:330px;width:100%;max-width:350px}
 .hero .portrait-photo img{height:460px;top:0;transform:translateX(-50%)}
 .hero .hero-identity{left:6px;right:6px;bottom:0;padding:10px 14px;max-width:330px}
 .hero .hero-name{font-size:24px;margin:4px 0 8px}
 .hero .hero-origin{font-size:11px}
 .hero .hero-history{font-size:10px;padding-top:8px}
 .hero .hero-lead{grid-row:4;font-size:14px;line-height:2;margin:0}
 .hero .hero-actions{grid-row:5;display:grid;grid-template-columns:1fr;gap:12px;margin-top:20px;padding-inline:8px}
 .hero .hero-actions a{margin:0;justify-content:space-between}
}
@media(max-width:380px){
 .hero{padding-top:22px}
 .hero h1{margin-top:17px}
 .hero .portrait-photo{height:308px}
 .hero .portrait-photo img{height:435px}
 .hero .hero-mikan{width:88px;height:88px;right:18px;top:58px}
}