/* Hero layout: heading in the upper-left, features in the lower-left.
   Keep all desktop spacing inside one bounded content area, not additive offsets. */
.koga-hero{--hero-accent:#a58652;--hero-ink:#36332d;position:relative;isolation:isolate;box-sizing:border-box;width:100%;aspect-ratio:2160/1005;min-height:520px;background:#fcfaf5;color:var(--hero-ink);overflow:hidden}
.koga-hero--2{--hero-accent:#963f49;--hero-ink:#403633;background:#faf8f6}
.koga-hero__photo{position:absolute;inset:0;z-index:-2;display:block}
.koga-hero__photo img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:right bottom}
.koga-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(255,253,247,.97),rgba(255,253,247,.86) 28%,rgba(255,253,247,.45) 46%,transparent 66%)}
.koga-hero--2::before{background:linear-gradient(90deg,rgba(255,254,252,.97),rgba(255,254,252,.88) 28%,rgba(255,254,252,.58) 45%,transparent 65%)}
.koga-hero__content{position:absolute;inset:27% auto 12% 5.55%;width:57%;display:flex;flex-direction:column;align-items:flex-start;box-sizing:border-box}
.koga-hero__title{margin:0;color:var(--hero-ink);font-family:var(--b-font-family);font-weight:var(--b-fw,500);letter-spacing:var(--b-ls,.06em);line-height:1.7;flex-shrink:0}
.koga-hero__lead{display:block;font-size:clamp(28px,2.6vw,58px);white-space:nowrap}
.koga-hero__lead em{display:inline-block;color:var(--hero-accent);font-style:normal;white-space:nowrap}
.koga-hero__sub{display:block;margin-top:8px;font-size:clamp(20px,1.75vw,38px);line-height:1.75}
.koga-hero__rule{flex-shrink:0;width:clamp(44px,3.5vw,72px);height:1px;margin:clamp(16px,1.6vw,32px) 0 24px;background:var(--hero-accent)}
.koga-hero__features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.25vw,24px);width:clamp(360px,31vw,650px);max-width:100%;padding:0;list-style:none;margin:auto 0 0;flex-shrink:0}
.koga-hero__feature{box-sizing:border-box;min-width:0;aspect-ratio:1;border:1px solid #cbb58b;border-radius:50%;background:rgba(255,254,250,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(8px,.7vw,14px);padding:12px 4px;text-align:center}
.koga-hero__feature svg{display:block;flex-shrink:0;width:clamp(28px,1.9vw,42px);height:clamp(30px,2.02vw,45px);color:var(--hero-accent)}
.koga-hero__feature span{font-family:var(--b-font-family);font-size:clamp(14px,1.04vw,22px);font-weight:var(--b-fw,500);line-height:1.55;letter-spacing:0}
.koga-hero__feature strong{font-weight:inherit}
.koga-hero--2 .koga-hero__features{gap:0;width:clamp(390px,32vw,680px)}
.koga-hero--2 .koga-hero__feature{position:relative;aspect-ratio:auto;min-height:clamp(100px,7.4vw,158px);border:0;border-radius:0;background:none;padding:0 12px;gap:clamp(10px,1vw,18px)}
.koga-hero--2 .koga-hero__feature+.koga-hero__feature::before{content:"";position:absolute;left:0;top:8px;bottom:6px;width:1px;background:#d8b8b8}
body:has(.koga-hero) .c-logo{top:24px;width:clamp(240px,21vw,345px)}
body:has(.koga-hero) #menu-button .c-menu-btn__lines span,
body:has(.koga-hero) #menu-button .c-menu-btn__lines::before,
body:has(.koga-hero) #menu-button .c-menu-btn__lines::after{background:#735c51}
body:has(.koga-hero) #menu-button.is-active .c-menu-btn__lines::before,
body:has(.koga-hero) #menu-button.is-active .c-menu-btn__lines::after{background:#fff}
.koga-hero+.p-index-medical{padding-top:clamp(72px,8vw,154px)}
/* Tablets: preserve the full photo instead of overlaying copy across people. */
@media(max-width:1023px){
 .koga-hero{aspect-ratio:auto;min-height:0;padding-top:74px;overflow:hidden}
 .koga-hero::before{display:none}
 .koga-hero__photo{position:relative;inset:auto;z-index:auto;width:100%;aspect-ratio:2160/1005}
 .koga-hero--2 .koga-hero__photo{aspect-ratio:1900/1005}
 .koga-hero__photo img{object-fit:contain;object-position:center bottom;background:#f5f3ed}
 .koga-hero__content{position:relative;inset:auto;width:100%;padding:26px 24px 30px;align-items:center}
 .koga-hero__title{text-align:center}
 .koga-hero__lead{font-size:clamp(22px,3.3vw,32px);white-space:normal;text-wrap:balance}
 .koga-hero__sub{font-size:clamp(16px,2.35vw,23px);margin-top:7px;text-wrap:balance}
 .koga-hero__rule{width:44px;margin:18px 0 24px}
 .koga-hero__features{width:min(100%,460px);margin:0;gap:16px}
 .koga-hero__feature{gap:9px;padding:12px 4px}
 .koga-hero__feature svg{width:30px;height:32px}
 .koga-hero__feature span{font-size:16px}
 .koga-hero--2 .koga-hero__features{width:min(100%,480px)}
 .koga-hero--2 .koga-hero__feature{min-height:94px;padding:0 8px;gap:10px}
 body:has(.koga-hero) .l-header{position:absolute;inset:0 0 auto;height:74px;background:#fff;z-index:100}
 body:has(.koga-hero) .c-logo{top:18px;left:20px;width:260px;max-width:calc(100% - 100px)}
 body:has(.koga-hero) #menu-button{top:13px;right:20px}
 .koga-hero+.p-index-medical{padding-top:60px}
}
@media(max-width:600px){
 .koga-hero--1 .koga-hero__photo{aspect-ratio:1050/1005}
 .koga-hero__content{padding:22px 16px 26px}
 .koga-hero__lead{font-size:clamp(20px,5.2vw,28px);line-height:1.6}
 .koga-hero__sub{font-size:clamp(14px,3.8vw,18px);line-height:1.8}
 .koga-hero__rule{width:38px;margin:16px 0 22px}
 .koga-hero__features{gap:10px;max-width:390px}
 .koga-hero__feature svg{width:27px;height:29px}
 .koga-hero__feature span{font-size:clamp(12px,3.2vw,15px)}
 .koga-hero--2 .koga-hero__feature{min-height:88px;padding:0 4px;gap:10px}
 body:has(.koga-hero) .c-logo{left:16px;width:235px}
 body:has(.koga-hero) #menu-button{right:16px}
}
@media(prefers-reduced-motion:reduce){
 .koga-hero *{animation:none!important;transition:none!important}
 .koga-hero .js-split span{opacity:1;transform:none}
}

/* Common desktop height for all four proposals; never exceed the viewport. */
@media(min-width:1024px){
 .koga-hero{height:min(46.52777778vw,100svh);min-height:min(520px,100svh);max-height:100svh;aspect-ratio:auto}
}
@media(min-width:1024px) and (max-height:700px){
 .koga-hero__content{top:22%;bottom:8%}
 .koga-hero__lead{font-size:clamp(26px,2.2vw,40px)}
 .koga-hero__sub{font-size:clamp(18px,1.5vw,28px)}
 .koga-hero__rule{margin:12px 0 16px}
 .koga-hero__features,.koga-hero--2 .koga-hero__features{width:clamp(330px,25vw,480px)}
 .koga-hero--2 .koga-hero__feature{min-height:82px;gap:8px}
 .koga-hero__feature svg{width:26px;height:28px}
 .koga-hero__feature span{font-size:14px}
}

/* All proposal menus: remove the legacy glow, including the open state. */
body:has(.koga-hero) #menu-button,
body:has(.koga-hero) #menu-button *,
body:has(.koga-hero) #menu-button .c-menu-btn__lines::before,
body:has(.koga-hero) #menu-button .c-menu-btn__lines::after{box-shadow:none;text-shadow:none;filter:none}
/* Same three-column centres and vertical baseline as the approved test3/4. */
@media(min-width:1024px){
 .koga-hero--1 .koga-hero__features{grid-template-rows:minmax(0,1fr);width:clamp(390px,32vw,680px);height:clamp(100px,7.4vw,158px);gap:0;align-items:center}
 .koga-hero--1 .koga-hero__feature{justify-self:center;width:90%;max-width:190px}
}
@media(min-width:1024px) and (max-height:700px){
 .koga-hero--1 .koga-hero__features{width:clamp(330px,25vw,480px);height:82px}
 .koga-hero--1 .koga-hero__feature{width:82%;padding:8px 3px;gap:6px}
}
@media(max-width:1023px){
 .koga-hero--1 .koga-hero__features{width:min(100%,480px);gap:0}
 .koga-hero--1 .koga-hero__feature{justify-self:center;width:90%}
}
/* test2 / test3 / test4: retain the director's head in the team-care background. */
@media(max-width:820px){
 .p-index-concept.test2{background-position:center top;background-attachment:scroll}
}

/* test2 (top page): larger catch copy; emphasised words 1.5x the previous size. */
.koga-hero--2 .koga-hero__lead{font-size:clamp(32px,3vw,67px)}
.koga-hero--2 .koga-hero__lead em{font-size:1.3em}
.koga-hero--2 .koga-hero__sub{font-size:clamp(23px,2vw,44px)}
@media(min-width:1024px) and (max-height:700px){
 .koga-hero--2 .koga-hero__lead{font-size:clamp(30px,2.5vw,46px)}
 .koga-hero--2 .koga-hero__sub{font-size:clamp(21px,1.75vw,32px)}
}
@media(max-width:1023px){
 .koga-hero--2 .koga-hero__lead{font-size:clamp(25px,3.8vw,37px)}
 .koga-hero--2 .koga-hero__sub{font-size:clamp(18px,2.7vw,26px)}
}
@media(max-width:600px){
 .koga-hero--2 .koga-hero__lead{font-size:clamp(22px,5.8vw,32px)}
 .koga-hero--2 .koga-hero__sub{font-size:clamp(16px,4.3vw,21px)}
}