/* White caption strips and a portrait beside the message on small screens. */
#home-view .hero-message p{display:flex;flex-direction:column;align-items:flex-start;gap:9px;font-size:30px;line-height:1.35;letter-spacing:.01em}
#home-view .hero-message p>br{display:none}
#home-view .hero-mobile-break{display:none}
#home-view .hero-message .paper-emphasis{display:block;width:max-content;max-width:100%;padding:3px 10px 5px;background:#fff;color:#163b40;border:1px solid #163b40;box-shadow:3px 3px 0 #163b40;font-weight:700;white-space:nowrap}
@media(min-width:701px){
 #home-view .hero-copy{padding-top:46px}
 #home-view .hero-instagram{margin-top:12px}
}
@media(min-width:701px) and (max-width:1250px){
 #home-view .hero-message p{font-size:26px;gap:8px}
}
@media(max-width:700px){
 #home-view .hero-inner{display:grid;grid-template-columns:56% 44%;grid-template-rows:auto auto auto auto minmax(70px,auto);height:auto;min-height:0;padding:26px 22px 0;align-items:start}
 #home-view .hero-copy{display:contents}
 #home-view .hero-kicker{grid-column:1/-1;grid-row:1;position:relative;z-index:3;font-size:16px;line-height:1.65}
 #home-view .hero h1{grid-column:1/-1;grid-row:2;position:relative;z-index:3;width:100%;max-width:none;margin:20px 0 25px}
 #home-view .hero-message{grid-column:1;grid-row:3;position:relative;z-index:3;min-width:0}
 #home-view .hero-message p{font-size:clamp(22px,5.8vw,28px);line-height:1.35;gap:9px}
 #home-view .hero-message .paper-emphasis{padding:3px 6px 5px;max-width:none;box-shadow:3px 3px 0 #163b40}
 #home-view .hero-message>span{max-width:100%;margin-top:20px;font-size:12px;line-height:1.9;letter-spacing:0}
 #home-view .hero-mobile-break{display:block}
 #home-view .hero-actions{grid-column:1;grid-row:4;position:relative;z-index:3;display:flex;flex-direction:column;align-items:flex-start;margin-top:22px;gap:0}
 #home-view .hero-actions>.btn{font-size:12px;min-height:46px;padding:10px 14px;gap:12px;white-space:nowrap}
 #home-view .hero-actions>.btn .icon{width:18px;height:18px}
 #home-view .hero-actions .video-link,#home-view .hero-instagram{display:none}
 #home-view .hero-portrait{grid-column:2;grid-row:3/6;position:relative;align-self:end;justify-self:end;width:calc(100% + 88px);max-width:340px;height:auto;min-height:0;aspect-ratio:1082/1352;right:-40px;overflow:visible;z-index:2}
 #home-view .hero-person{position:absolute;width:100%;height:auto;max-width:none;left:0;right:auto;top:auto;bottom:0}
 #home-view .hero-sign{left:8%;bottom:22px;width:75%;max-width:260px}
 #home-view .hero-sign small{font-size:10px;margin-bottom:7px;letter-spacing:.03em}
}
@media(min-width:480px) and (max-width:700px){
 #home-view .hero-inner{padding:32px 28px 0;grid-template-rows:auto auto auto auto minmax(95px,auto)}
 #home-view .hero h1{margin-top:24px;margin-bottom:30px}
 #home-view .hero-message>span{max-width:245px;font-size:13px}
 #home-view .hero-actions>.btn{font-size:13px;gap:22px;padding-inline:20px}
 #home-view .hero-portrait{width:calc(100% + 90px);right:-28px}
 #home-view .hero-sign small{font-size:11px}
}
@media(max-width:370px){
 #home-view .hero-inner{padding-inline:18px}
 #home-view .hero-kicker{font-size:15px}
 #home-view .hero-message p{font-size:21px}
 #home-view .hero-message .paper-emphasis{padding-inline:5px}
 #home-view .hero-actions>.btn{font-size:11px;padding-inline:12px;gap:10px}
 #home-view .hero-portrait{right:-34px;width:calc(100% + 78px)}
 #home-view .hero-sign{bottom:20px}
}

/* Trim the blank half of the final Japanese punctuation without removing it. */
#home-view .hero-message .hero-punctuation{display:inline-block;width:.55em;letter-spacing:0}

/* Keep the face beside the copy while letting the elbow extend past the edge. */
@media(max-width:700px){
 #home-view .hero-portrait{width:calc(120% + 105.6px);max-width:408px;right:-75px}
 #home-view .hero-sign{width:66%}
}
@media(min-width:480px) and (max-width:700px){
 #home-view .hero-portrait{width:calc(120% + 108px);right:-66px}
}
@media(max-width:370px){
 #home-view .hero-portrait{width:calc(120% + 93.6px);right:-66px}
}

/* Add a little breathing room before the first glyph on each caption strip. */
#home-view .hero-message .paper-emphasis{padding-left:13px}
@media(max-width:700px){
 #home-view .hero-message .paper-emphasis{padding-left:9px}
}
@media(max-width:370px){
 #home-view .hero-message .paper-emphasis{padding-left:8px}
}
