/* Story chapter aligned with the approved first-view direction. */
.story.story-fv-aligned {
  position: relative;
  min-height: 720px;
  min-height: max(720px,100svh);
  padding: 0;
  overflow: hidden;
  isolation: isolate;
  background: #d8f2ed;
  background-image: none;
}

.story-fv-aligned .adventure-bg {
  position: absolute;
  inset: 0;
  z-index: -5;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.9);
}

.story-fv-aligned .adventure-photo {
  position: absolute;
  inset: 0 0 0 auto;
  z-index: 0;
  width: 68%;
  height: 100%;
  object-fit: cover;
  object-position: 58% center;
  filter: saturate(1.04) contrast(1.015);
  transform-origin: 68% 55%;
}

.story-fv-aligned::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg,#fff 0%,rgba(255,255,255,.985) 31%,rgba(255,255,255,.88) 42%,rgba(255,255,255,.3) 54%,rgba(255,255,255,0) 66%);
}

.story-fv-aligned::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: auto -8% -35% 24%;
  height: 66%;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 50%;
  transform: rotate(-8deg);
  box-shadow: 0 0 0 32px rgba(255,255,255,.07),0 0 0 70px rgba(255,255,255,.045);
}

.story-fv-aligned .adventure-glow {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: radial-gradient(circle at 72% 38%,rgba(255,255,255,.1),transparent 28%),radial-gradient(ellipse at 22% 50%,rgba(255,255,255,.92),transparent 47%);
}

.story-fv-aligned .adventure-copy {
  position: absolute;
  z-index: 3;
  left: clamp(54px,7.2vw,140px);
  top: 50%;
  width: min(48vw,730px);
  transform: translateY(-49%);
}

.story-fv-aligned .adventure-copy.reveal.visible {
  transform: translateY(-49%);
}

.js.scroll-polish:not(.motion-off) .story-fv-aligned .adventure-copy.reveal:not(.visible) {
  transform: translateY(calc(-49% + 46px)) scale(.987);
}

.story-fv-aligned .adventure-eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 clamp(30px,4vh,44px);
  font: 600 11px/1.4 'Outfit','Noto Sans JP',sans-serif;
  letter-spacing: .18em;
}

.story-fv-aligned .adventure-eyebrow span {
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  border: 1px solid rgba(7,63,60,.45);
  border-radius: 50%;
  font-size: 9px;
  letter-spacing: .05em;
}

.story-fv-aligned .adventure-copy h2 {
  margin: 0;
  color: #073f3c;
  font: 900 clamp(56px,5.7vw,91px)/1.23 'M PLUS Rounded 1c','Noto Sans JP',sans-serif;
  letter-spacing: -.065em;
}

.story-fv-aligned .adventure-copy h2 span {
  display: block;
  white-space: nowrap;
}

.story-fv-aligned .adventure-rule {
  display: block;
  width: 52px;
  height: 10px;
  margin: clamp(23px,3vh,31px) 0 clamp(23px,2.8vh,29px);
  border-radius: 0;
  background: var(--mamoru-four-dots) center/52px 10px no-repeat;
}

.story-fv-aligned .adventure-lead {
  margin: 0;
  color: #073f3c;
  font: 500 clamp(16px,1.35vw,21px)/2 'Noto Sans JP',sans-serif;
  letter-spacing: .055em;
}

.story-fv-aligned .adventure-mobile-break { display: none; }

.story-fv-aligned .adventure-close {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin: clamp(26px,3.5vh,36px) 0 0;
  color: #073f3c;
  font-size: clamp(12px,1vw,15px);
  line-height: 1.7;
  letter-spacing: .05em;
}

.story-fv-aligned .adventure-close b { font-size: 1.12em; }
.story-fv-aligned .adventure-close span { opacity: .82; }

.story-fv-aligned .adventure-caption {
  position: absolute;
  z-index: 3;
  right: 24px;
  bottom: 18px;
  margin: 0;
  color: rgba(7,63,60,.6);
  font-size: 9px;
  letter-spacing: .04em;
}

@media (max-width:1050px) and (min-width:761px) {
  .story-fv-aligned .adventure-copy { left: 50px; width: 54vw; }
  .story-fv-aligned .adventure-copy h2 { font-size: 58px; }
  .story-fv-aligned .adventure-photo { object-position: 57% center; }
}

@media (max-width:760px) {
  .story.story-fv-aligned {
    min-height: 900px;
    min-height: max(900px,100svh);
    padding: 0;
    background: #e4f5f1;
  }

  .story-fv-aligned .adventure-bg {
    object-position: 62% center;
    transform: scale(1.25);
  }

  .story-fv-aligned .adventure-photo {
    inset: auto 0 0;
    width: 100%;
    height: 58%;
    min-height: 0;
    object-fit: cover;
    object-position: 58% center;
    filter: saturate(1.04) contrast(1.015);
    transform-origin: 62% 68%;
    animation: none !important;
    transform: none !important;
  }

  .story-fv-aligned::before {
    background: linear-gradient(180deg,#fff 0%,rgba(255,255,255,.99) 39%,rgba(255,255,255,.88) 45%,rgba(255,255,255,.28) 51%,rgba(255,255,255,0) 58%);
  }

  .story-fv-aligned::after {
    inset: auto -54% -14% -18%;
    height: 49%;
    transform: rotate(-12deg);
  }

  .story-fv-aligned .adventure-copy,
  .story-fv-aligned .adventure-copy.reveal.visible,
  .js.scroll-polish:not(.motion-off) .story-fv-aligned .adventure-copy.reveal:not(.visible) {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    padding: 70px 22px 0;
    transform: none;
    text-align: center;
    opacity: 1;
    visibility: visible;
  }

  .story-fv-aligned .adventure-eyebrow {
    justify-content: center;
    gap: 11px;
    margin-bottom: 24px;
    font-size: 8px;
    letter-spacing: .13em;
  }

  .story-fv-aligned .adventure-eyebrow span {
    width: 27px;
    height: 27px;
    font-size: 8px;
  }

  .story-fv-aligned .adventure-copy h2 {
    font-size: clamp(38px,10.9vw,48px);
    line-height: 1.4;
    letter-spacing: -.065em;
  }

  .story-fv-aligned .adventure-copy h2 span { white-space: nowrap; }

  .story-fv-aligned .adventure-rule {
    width: 52px;
    height: 10px;
    margin: 20px auto 17px;
  }

  .story-fv-aligned .adventure-lead {
    font-size: 13px;
    line-height: 1.9;
    letter-spacing: .035em;
  }

  .story-fv-aligned .adventure-mobile-break { display: block; }

  .story-fv-aligned .adventure-close {
    display: block;
    margin-top: 16px;
    font-size: 11px;
  }

  .story-fv-aligned .adventure-close b,
  .story-fv-aligned .adventure-close span { display: block; }

  .story-fv-aligned .adventure-close span { margin-top: 3px; }

  .story-fv-aligned .adventure-caption {
    right: 13px;
    bottom: 10px;
    font-size: 7px;
  }
}

@media (max-width:360px) {
  .story-fv-aligned .adventure-copy,
  .story-fv-aligned .adventure-copy.reveal.visible { padding-top: 58px; padding-inline: 16px; }
  .story-fv-aligned .adventure-copy h2 { font-size: 36px; }
  .story-fv-aligned .adventure-photo { height: 56%; object-position: 60% center; }
}

@media (prefers-reduced-motion:no-preference) {
  body:not(.motion-off) .story-fv-aligned .adventure-photo { animation: adventure-breathe 9s ease-in-out infinite alternate; }
  @keyframes adventure-breathe { from { transform: scale(1.002); } to { transform: scale(1.022); } }
}

@media (prefers-reduced-motion:reduce) {
  .story-fv-aligned .adventure-photo { animation: none; }
}
