/* Approved homepage story treatment. Scoped to the hero and hiring journey. */
#top.nv-story-hero {
  grid-template-columns: minmax(0, 1.22fr) minmax(0, 1fr) !important;
  gap: clamp(30px, 4vw, 60px) !important;
  padding-block: clamp(40px, 5vw, 64px) !important;
}
#top.nv-story-hero > :not(.nv-aurora):not(.nv-page-doodles) { min-width: 0; }
#top.nv-story-hero h1 {
  font-size: clamp(40px, 4.4vw, 55px) !important;
  line-height: 1.07 !important;
  letter-spacing: -.025em !important;
}
.nv-story-line { display: block; }
.nv-story-phrase { white-space: nowrap; }
.nv-story-emphasis { color: var(--accent-deep, #8c491a); }
#top .nv-story-visual { max-width: 400px !important; }
#top .nv-story-scene { position: relative; isolation: isolate; }
#top .nv-story-scene > img { width: 100%; height: auto; display: block; }
.nv-story-task {
  position: absolute; left: 6%; top: 26%; width: 64%; z-index: 2;
  background: #fffaf2; color: #201e1d; border: 1px solid #ddc7a6;
  border-radius: 14px; padding: 13px 14px; box-shadow: 0 6px 14px #563e2010;
  transition: transform 650ms cubic-bezier(.2,.7,.2,1), opacity 400ms;
}
.nv-story-task small {
  display: block; text-transform: uppercase; letter-spacing: .07em;
  color: #8c491a; font-size: 10px; margin-bottom: 6px;
}
.nv-story-task-row { display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 1.4; }
.nv-story-check {
  width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%;
  border: 1px solid #cdbb9e; flex: none; font-size: 12px;
}
.nv-story-scene[data-phase="0"] .nv-story-task { opacity: 0; transform: translate(-30px,12px); }
.nv-story-scene[data-phase="2"] .nv-story-task { opacity: 0; transform: translate(85px,170px) scale(.25); }
.nv-story-scene[data-phase="3"] .nv-story-task { border-color: #a7b18d; transform: translateY(8px); }
.nv-story-scene[data-phase="3"] .nv-story-check { background: #56633f; border-color: #56633f; color: #fffaf2; }
.nv-story-reply {
  position: absolute; right: 5%; top: 52%; z-index: 2; font-size: 14px;
  background: #c67139; color: #fffaf2; padding: 11px 13px;
  border-radius: 15px 15px 2px 15px; opacity: 0; transform: translateY(8px);
  transition: opacity 400ms, transform 400ms;
}
.nv-story-scene[data-phase="2"] .nv-story-reply { opacity: 1; transform: none; }
.nv-story-timeback {
  position: absolute; left: 8%; right: 8%; bottom: 8%; z-index: 2; text-align: center;
  border-radius: 12px; padding: 12px; background: #e2e7d4; color: #56633f;
  font-size: 14px; opacity: 0; transform: translateY(10px); transition: opacity 500ms, transform 500ms;
}
.nv-story-scene[data-phase="3"] .nv-story-timeback { opacity: 1; transform: none; }
.nv-journey-step summary:focus-visible { outline: 3px solid #8c491a; outline-offset: 4px; }
#how.nv-story-journey { background: #e2e7d4; }
#how.nv-story-journey > .nv-journey-wrap {
  position: relative; z-index: 1; max-width: 1240px; margin: auto;
  padding: clamp(44px, 5vw, 72px) clamp(20px, 5vw, 48px);
}
.nv-journey-heading { text-align: center; max-width: 670px; margin: 0 auto 30px; }
.nv-journey-heading small { font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: #56633f; }
#how .nv-journey-heading h2 { font-family: var(--font-heading); font-size: clamp(30px, 3.5vw, 44px); line-height: 1.13; margin: 14px 0 12px; letter-spacing: -.02em; }
#how .nv-journey-heading p { font-size: 17px; line-height: 1.6; color: #4e5840; margin: 0; }
.nv-journey-stops { position: relative; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; list-style: none; padding: 0; margin: 0; }
.nv-journey-stops::before { content: ''; position: absolute; top: 150px; left: 16%; right: 16%; border-top: 2px dashed #a9b38f; }
.nv-journey-step { position: relative; text-align: center; min-width: 0; }
.nv-journey-art { position: relative; height: 225px; display: flex; align-items: end; justify-content: center; max-width: 290px; margin: auto; }
.nv-journey-art::before { content: ''; position: absolute; width: 190px; height: 170px; bottom: 6px; background: #f1eddb; border-radius: 48% 52% 35% 40%; }
.nv-journey-art > img { position: relative; z-index: 2; width: 165px; height: 200px; object-fit: contain; }
.nv-journey-paper { position: absolute; z-index: 3; left: 5px; bottom: 18px; width: 100px; padding: 11px; background: #fffaf2; border: 1px solid #cfbc9d; border-radius: 9px; transform: rotate(-6deg); box-shadow: 0 4px 6px #3d48240c; color: #8c491a; font-size: 11px; line-height: 1.4; }
.nv-journey-paper b { display: block; margin-bottom: 8px; font-size: 12px; font-weight: 600; }
.nv-journey-calendar { display: grid; grid-template-columns: repeat(3,1fr); gap: 4px; margin-top: 8px; }
.nv-journey-calendar i { height: 14px; border-radius: 2px; background: #ece2cd; font-style: normal; }
.nv-journey-calendar i.nv-journey-date { background: #c67139; color: #fffaf2; }
.nv-journey-rule { display: block; height: 5px; background: #dac9ab; border-radius: 3px; margin: 6px 0; }
.nv-journey-rule:nth-child(even) { width: 70%; }
.nv-journey-flag { display: block; border-radius: 4px; padding: 5px; background: #e2e7d4; color: #56633f; font-size: 10px; }
.nv-journey-number { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #a5b18d; border-radius: 50%; margin: 14px auto; background: #fffaf2; color: #56633f; font-size: 13px; }
.nv-journey-step.is-active .nv-journey-number { background: #8c491a; border-color: #8c491a; color: #fffaf2; }
#how .nv-journey-step h3 { font-family: var(--font-heading); font-size: clamp(22px,2.1vw,27px); line-height: 1.2; margin: 0 0 12px; }
#how .nv-journey-step p { font-size: 16px; line-height: 1.6; color: #4f5841; margin: 0 auto; max-width: 29ch; }
.nv-journey-step details { margin-top: 6px; }
.nv-journey-step summary { display: inline-block; padding: 12px; cursor: pointer; color: #56633f; font-size: 14px; text-decoration: underline; text-underline-offset: 4px; list-style: none; }
.nv-journey-step summary::-webkit-details-marker { display: none; }
#how .nv-journey-step details p { padding: 6px 8px 0; font-size: 14px; }
.nv-journey-footer { text-align: center; margin-top: 28px; }
.nv-journey-footer a { color: #56633f; font-size: 15px; text-underline-offset: 5px; }
@keyframes nv-journey-settle { from { transform: translateY(14px) rotate(-10deg); } to { transform: translateY(0) rotate(-6deg); } }
@media (prefers-reduced-motion: no-preference) {
  .nv-journey-step.is-active .nv-journey-paper { animation: nv-journey-settle 650ms cubic-bezier(.16,1,.3,1) both; }
}
@media (max-width: 760px) {
  #top.nv-story-hero { grid-template-columns: minmax(0,1fr) !important; gap: 32px !important; }
  #top.nv-story-hero h1 { font-size: clamp(32px,7vw,49px) !important; }
  #top .nv-story-visual { max-width: 360px !important; }
  .nv-journey-stops { grid-template-columns: minmax(0,1fr); gap: 38px; }
  .nv-journey-stops::before { display: none; }
  #how .nv-journey-step h3 { font-size: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  .nv-story-scene *, .nv-journey-step * { transition: none !important; animation: none !important; }
}
