/* A single, full-width first view. Content may grow on short/zoomed screens. */
body.reference-site .hero-section{
  width:100%;max-width:none;margin:0 0 56px;padding:0;display:block
}
body.reference-site .hero-main{
  width:100%;border-radius:0;min-height:max(480px,calc(100svh - var(--header-expanded)));
}
body.reference-site .hero-copy{
  width:100%;max-width:1440px;margin:0 auto;
  min-height:max(480px,calc(100svh - var(--header-expanded)));
  padding:clamp(32px,5vw,80px);justify-content:center
}
body.reference-site .hero-photo{
  inset:0;background-size:cover;background-position:center top
}
.company-page{padding:40px 0 80px}
.company-breadcrumb{display:flex;gap:12px;align-items:center;font-size:13px;color:#657888;margin-bottom:32px}
.company-breadcrumb a{text-decoration:underline;text-underline-offset:4px}
.company-page .company-section{padding:0;max-width:960px}
.company-page .company-panel{margin-top:32px}
.company-page h1{font:600 clamp(30px,4vw,46px)/1.5 MakaseruSerif,'Yu Mincho',serif;color:#142f46}
@media(max-width:900px){
 body.reference-site .hero-section{margin-bottom:36px}
 body.reference-site .hero-copy{justify-content:flex-end;padding:32px 28px}
 body.reference-site .hero-photo{background-position:76% top}
 body.reference-site .hero-main:after{background:linear-gradient(180deg,transparent 18%,rgba(10,36,51,.08) 32%,rgba(10,36,51,.9) 60%,#0b3042 88%)}
 body.reference-site .area-label{left:28px;top:24px}
}
@media(max-width:600px){
 body.reference-site .hero-copy{padding:28px 22px}
 body.reference-site .hero-copy h1{font-size:clamp(27px,8vw,42px)}
 body.reference-site .hero-sub{font-size:clamp(13px,3.75vw,21px)}
 body.reference-site .hero-message{font-size:clamp(20px,5.4vw,25px);margin:20px 0}
 body.reference-site .hero-note{font-size:clamp(10px,2.6vw,13px);white-space:normal}
 body.reference-site .area-label{left:22px;top:22px}
 .company-page{padding-top:24px}
}
@media(max-width:360px){
 body.reference-site .hero-copy{padding:22px 16px}
 body.reference-site .hero-message{margin:14px 0;font-size:19px}
 body.reference-site .area-label{left:16px}
}
@media(max-height:650px) and (min-width:901px){
 body.reference-site .hero-copy{padding:24px 5vw}
 body.reference-site .hero-copy h1{font-size:46px}
 body.reference-site .hero-message{margin:14px 0;font-size:22px}
 body.reference-site .area-label{margin-bottom:14px}
}