*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Noto Sans JP",Meiryo,sans-serif;
  background:#f4f5f9;
  color:#1a1f36;
  line-height:1.8;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
.wrap{max-width:920px;margin:0 auto;padding:0 22px}
.wrap.narrow{max-width:580px}

[data-reveal]{opacity:0;transform:translateY(32px);transition:opacity .8s ease,transform .8s ease}
[data-reveal].is-in{opacity:1;transform:none}

.kicker{
  margin:0 0 12px;font-size:11px;letter-spacing:.22em;font-weight:700;
  color:#4f5fd6;
}
.kicker--light{color:#a8b4ff}

/* —— Hero —— */
.hero{
  position:relative;
  min-height:min(94vh,860px);
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  color:#fff;
}
.hero-media{
  position:absolute;inset:-8% 0 -8% 0;
  will-change:transform;
}
.hero-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.92) contrast(1.05)}
.hero-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(105deg,rgba(18,22,48,.88) 0%,rgba(28,34,72,.55) 48%,rgba(20,24,50,.3) 100%),
    linear-gradient(180deg,transparent 40%,rgba(12,14,32,.92) 100%);
}
.hero-inner{position:relative;z-index:1;width:100%;max-width:920px;margin:0 auto;padding:0 22px 80px}
.brand{margin:0 0 18px;font-size:12px;letter-spacing:.2em;font-weight:700;opacity:.85}
.hero h1{
  margin:0;font-size:clamp(30px,5.4vw,50px);line-height:1.32;font-weight:800;
  letter-spacing:.01em;max-width:12em;
}
.hero-lead{margin:20px 0 0;max-width:30em;font-size:16px;line-height:1.95;opacity:.92}

.btn{
  display:inline-block;margin-top:32px;
  background:#e8ebff;color:#1a1f36;
  font-weight:800;text-decoration:none;
  padding:15px 28px;border:none;cursor:pointer;font-size:15px;
  border-radius:2px;
}
.btn:hover{opacity:.92}
.btn--on-dark{background:#c9d0ff;color:#12162e}

/* —— Story —— */
.story{padding:88px 0;background:#f4f5f9}
.story h2{margin:0;font-size:clamp(24px,3.4vw,34px);line-height:1.45;font-weight:800}
.story p:last-child{margin:22px 0 0;color:#4a5168;font-size:15px;max-width:36em}

/* —— Values —— */
.values{padding:72px 0 88px;background:#eceef6}
.values h2{margin:0 0 36px;font-size:clamp(22px,3vw,30px);font-weight:800}
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:800px){.value-grid{grid-template-columns:1fr}}
.value-grid article{
  padding:28px 24px 32px;
  background:transparent;
  border-top:2px solid #4f5fd6;
}
.value-grid .num{
  display:block;font-size:12px;letter-spacing:.16em;font-weight:800;color:#4f5fd6;margin-bottom:16px;
}
.value-grid h3{margin:0 0 10px;font-size:17px;font-weight:800}
.value-grid p{margin:0;font-size:14px;color:#4a5168;line-height:1.85}

/* —— Day band —— */
.dayband{
  display:grid;grid-template-columns:1.15fr .85fr;min-height:560px;
  background:#12162e;color:#e8ebf8;
}
@media(max-width:860px){.dayband{grid-template-columns:1fr}}
.dayband-media img{width:100%;height:100%;min-height:320px;object-fit:cover}
.dayband-copy{padding:56px 40px;display:flex;flex-direction:column;justify-content:center}
@media(max-width:860px){.dayband-copy{padding:40px 22px}}
.dayband-copy h2{margin:0 0 24px;font-size:clamp(22px,3vw,30px);font-weight:800}
.dayband-copy ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.dayband-copy li{font-size:14px;padding-left:0;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:12px}
.dayband-copy strong{display:inline-block;min-width:3.6em;color:#a8b4ff;font-weight:800}
.dayband-note{margin:20px 0 0;font-size:12px;opacity:.65}

/* —— Voices —— */
.voices{padding:88px 0;background:#f4f5f9}
.voices h2{margin:0 0 32px;font-size:clamp(22px,3vw,30px);font-weight:800}
.voice-list{display:grid;gap:18px}
.voice-list blockquote{
  margin:0;padding:28px 28px 28px 32px;
  background:#fff;
  border-left:3px solid #4f5fd6;
  box-shadow:none;
}
.voice-list p{margin:0;font-size:15px;line-height:1.9;color:#2a3048}
.voice-list cite{
  display:block;margin-top:16px;font-style:normal;
  font-size:12px;font-weight:700;color:#4f5fd6;letter-spacing:.04em;
}

/* —— Benefits —— */
.benefits{padding:72px 0 88px;background:#fff}
.benefits h2{margin:0 0 28px;font-size:clamp(22px,3vw,30px);font-weight:800}
.benefit-grid{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:16px;
}
@media(max-width:680px){.benefit-grid{grid-template-columns:1fr}}
.benefit-grid li{
  padding:22px 20px;
  background:#f4f5f9;
  border-bottom:2px solid #c5cbf0;
}
.benefit-grid strong{display:block;font-size:15px;margin-bottom:6px}
.benefit-grid span{display:block;font-size:13px;color:#4a5168;line-height:1.75}

/* —— FAQ —— */
.faq{padding:72px 0;background:#eceef6}
.faq h2{margin:0 0 24px;font-size:clamp(22px,3vw,30px);font-weight:800}
.faq details{
  background:#fff;padding:16px 18px;margin-bottom:10px;
  border:none;border-bottom:1px solid #d8dcec;
}
.faq summary{cursor:pointer;font-weight:750;list-style:none;font-size:15px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+ ";color:#4f5fd6;font-weight:800}
.faq details[open] summary::before{content:"− "}
.faq p{margin:12px 0 0;font-size:14px;color:#4a5168}

/* —— Form —— */
.final{padding:88px 0;background:#12162e;color:#e8ebf8}
.final h2{margin:0 0 10px;font-size:clamp(24px,3.4vw,32px);font-weight:800}
.final > .wrap > p{margin:0 0 28px;opacity:.85;font-size:14px}
.form{display:grid;gap:14px}
.form label{display:grid;gap:5px;font-size:13px;font-weight:650}
.form input,.form textarea,.form select{
  font:inherit;padding:13px 14px;
  border:1px solid rgba(200,210,255,.28);
  background:rgba(255,255,255,.06);color:#fff;border-radius:2px;
}
.form input::placeholder,.form textarea::placeholder{color:rgba(255,255,255,.4)}
.form select option{color:#1a1f36}
.form .btn{justify-self:start;margin-top:6px}
.form-note{font-size:12px;opacity:.6;margin:6px 0 0}

.site-footer{padding:28px 0;text-align:center;font-size:12px;color:#7a8098;background:#f4f5f9}
.site-footer p{margin:0}
