/* Repair Journey approved portrait layout and cinematic hero; no other page uses these rules. */
body.journey-page .journey-hero {
  height:min(780px,calc(100svh - 140px)); min-height:580px; max-height:850px;
  position:relative; display:flex; flex-direction:column; justify-content:center; overflow:hidden;
}
body.journey-page .journey-hero__image {
  background-image:url('/assets/repair-journey/hero-damage.webp')!important;
  background-size:cover!important; background-position:center 46%!important; opacity:1!important;
}
body.journey-page .journey-hero__shade {
  background:linear-gradient(90deg,rgba(5,6,8,.90) 0%,rgba(5,6,8,.68) 48%,rgba(5,6,8,.30) 100%),
             linear-gradient(0deg,rgba(5,6,8,.66),transparent 38%);
}
body.journey-page .journey-hero__content {
  position:relative; z-index:2; width:min(1100px,100%); max-width:1100px;
  margin:0 auto; padding:50px 7% 170px;
}
body.journey-page .journey-hero h1 {
  max-width:none; font-size:clamp(68px,7.4vw,104px); line-height:.98; margin-bottom:20px;
}
body.journey-page .journey-hero h1 em { white-space:nowrap; }
body.journey-page .journey-hero__content>p:not(.eyebrow) {
  max-width:540px; color:#f0f0f2; font-size:19px; line-height:1.65; margin:0;
}
body.journey-page .journey-hero__scroll {
  position:absolute; z-index:4; left:50%; bottom:108px; transform:translateX(-50%);
  margin:0; padding:9px 0; color:#fff; font-size:17px; font-weight:600;
  white-space:nowrap; border-bottom:1px solid #ffffff70;
}
body.journey-page .journey-hero__scroll span { color:#e52b42; margin-left:10px; }
body.journey-page .journey-hero__rail {
  position:absolute; z-index:4; left:50%; right:auto; bottom:39px; transform:translateX(-50%);
  display:grid; grid-template-columns:repeat(7,minmax(42px,1fr)); gap:clamp(8px,2.3vw,24px);
  width:min(540px,calc(100% - 36px)); overflow:visible; padding:0; margin:0; justify-content:center;
}
body.journey-page .journey-hero__rail a {
  display:grid; place-items:center; min-width:42px; min-height:42px; border:1px solid #ffffff66;
  color:#fff; font-size:16px; font-weight:600; transition:background .2s,border-color .2s,color .2s;
}
body.journey-page .journey-hero__rail a:hover,
body.journey-page .journey-hero__rail a:focus-visible { background:#e52b42; border-color:#e52b42; color:#fff; }
/* The intro and seven stages share a bright, clean field. */
body.journey-page .journey-intro,
body.journey-page .journey-grid { background:#fff; color:#242428; }
body.journey-page .journey-intro { padding-top:48px; padding-bottom:24px; gap:48px; }
body.journey-page .journey-intro .eyebrow,
body.journey-page .journey-card__copy .eyebrow { color:#5c5c63; }
body.journey-page .journey-intro h2,
body.journey-page .journey-card__copy h2 { color:#202024; }
body.journey-page .journey-intro h2 em { color:#c92139; }
body.journey-page .journey-intro>p { color:#49494f; font-size:18px; line-height:1.7; }
body.journey-page .journey-grid {
  display:grid; grid-template-columns:minmax(0,1fr); gap:48px;
  padding-top:12px; padding-bottom:74px;
}
body.journey-page .journey-card {
  display:grid; grid-template-columns:minmax(0,.35fr) minmax(0,.65fr); align-items:center;
  gap:clamp(28px,4vw,52px); min-width:0; padding:0; border:0; background:transparent; box-shadow:none;
  scroll-margin-top:90px;
}
body.journey-page .journey-card__visual {
  width:100%; max-width:394px; height:auto; min-height:0; aspect-ratio:394/445;
  display:block; position:relative; overflow:visible; padding:0; margin:0;
  border:0; border-radius:0; background:transparent; box-shadow:none;
}
body.journey-page .journey-card__visual::before,
body.journey-page .journey-card__visual::after { content:none!important; display:none!important; }
body.journey-page .journey-card__photo {
  display:block; width:100%; max-width:394px; height:auto; margin:0; padding:0;
  aspect-ratio:394/445; object-fit:cover; border:0; border-radius:0; background:none;
}
body.journey-page .journey-card__copy { min-width:0; max-width:760px; padding:0; margin:0; }
body.journey-page .journey-card__copy .eyebrow { margin-bottom:10px; font-size:16px; }
body.journey-page .journey-card__copy h2 { margin:0 0 12px; font-size:clamp(34px,3.4vw,46px); }
body.journey-page .journey-card__copy>p:not(.eyebrow) { color:#3f3f45; font-size:18px!important; line-height:1.65; margin-bottom:16px; }
body.journey-page .journey-card details { border-top:1px solid #dedee2; padding-top:12px; }
body.journey-page .journey-card summary { color:#38383e; font-size:16px; }
body.journey-page .journey-card summary span { color:#c92139; }
body.journey-page .journey-card details>p { color:#4a4a50; font-size:16px; line-height:1.7; margin:12px 24px 0 0; }
@media(max-width:900px){
  body.journey-page .journey-card { gap:28px; }
  body.journey-page .journey-grid { gap:42px; }
}
@media(max-width:700px){
  body.journey-page .journey-hero { height:auto; min-height:max(620px,calc(100svh - 120px)); max-height:none; }
  body.journey-page .journey-hero__content { padding:44px 6% 175px; }
  body.journey-page .journey-hero h1 { font-size:clamp(52px,12vw,70px); line-height:1; margin-bottom:18px; }
  body.journey-page .journey-hero__content>p:not(.eyebrow) { font-size:17px; }
  body.journey-page .journey-hero__scroll { bottom:104px; font-size:16px; }
  body.journey-page .journey-hero__rail { bottom:38px; width:calc(100% - 28px); gap:6px; }
  body.journey-page .journey-hero__rail a { min-width:36px; min-height:40px; font-size:16px; }
  body.journey-page .journey-intro { grid-template-columns:1fr; gap:16px; padding:38px 6% 20px; }
  body.journey-page .journey-intro h2 { font-size:clamp(42px,10vw,56px); }
  body.journey-page .journey-intro>p { font-size:17px; }
  body.journey-page .journey-grid { padding:8px 6% 58px; gap:38px; }
  body.journey-page .journey-card { grid-template-columns:minmax(0,1fr); gap:18px; }
  body.journey-page .journey-card__visual,
  body.journey-page .journey-card__photo { width:100%; max-width:394px; }
  body.journey-page .journey-card__copy h2 { font-size:36px; }
  body.journey-page .journey-card__copy>p:not(.eyebrow) { font-size:17px!important; }
  body.journey-page .journey-close { padding:52px 6%; }
}
@media(max-width:360px){
  body.journey-page .journey-hero h1 { font-size:clamp(46px,12vw,52px); }
  body.journey-page .journey-hero__rail { gap:3px; grid-template-columns:repeat(7,minmax(0,1fr)); }
  body.journey-page .journey-hero__rail a { min-width:0; }
}
@media(prefers-reduced-motion:reduce){body.journey-page .journey-hero__rail a { transition:none; }}

/* Compact repair journey layout: align the introduction and stage rows on one grid. */
body.journey-page .journey-hero__content {
  width:min(1120px,100%); max-width:1120px; padding-left:32px; padding-right:32px;
}
body.journey-page .journey-intro,
body.journey-page .journey-grid {
  width:auto; max-width:none; margin-left:0; margin-right:0;
  padding-left:max(32px,calc((100% - 1120px)/2 + 32px));
  padding-right:max(32px,calc((100% - 1120px)/2 + 32px));
}
body.journey-page .journey-intro { padding-top:48px; padding-bottom:24px; }
body.journey-page .journey-grid { padding-top:8px; padding-bottom:56px; gap:0; }
body.journey-page .journey-card {
  grid-template-columns:248px minmax(0,1fr); gap:28px;
  align-items:start; padding:24px 0; border-bottom:1px solid #e5e5e7;
}
body.journey-page .journey-card:last-child { border-bottom:0; }
body.journey-page .journey-card__visual,
body.journey-page .journey-card__photo {
  width:248px; max-width:248px; height:auto!important; min-height:0!important; aspect-ratio:394/445;
}
body.journey-page .journey-card__copy { max-width:none; }
@media(max-width:700px){
  body.journey-page .journey-hero__content { padding-left:20px; padding-right:20px; }
  body.journey-page .journey-intro,
  body.journey-page .journey-grid { padding-left:20px; padding-right:20px; }
  body.journey-page .journey-intro { padding-top:38px; padding-bottom:20px; }
  body.journey-page .journey-grid { padding-top:8px; padding-bottom:48px; }
  body.journey-page .journey-card { grid-template-columns:minmax(0,1fr); gap:18px; padding:24px 0; }
  body.journey-page .journey-card__visual,
  body.journey-page .journey-card__photo { width:248px; max-width:248px; height:auto!important; min-height:0!important; }
  body.journey-page .journey-card__visual { width:248px; max-width:248px; height:auto!important; min-height:0!important; }
  body.journey-page .journey-card__copy h2 { font-size:32px; }
}
@media(max-width:360px){
  body.journey-page .journey-hero__content { padding-left:18px; padding-right:18px; }
  body.journey-page .journey-intro,
  body.journey-page .journey-grid { padding-left:18px; padding-right:18px; }
  body.journey-page .journey-card__visual,
  body.journey-page .journey-card__photo { width:min(248px,100%); max-width:248px; height:auto!important; min-height:0!important; }
}

/* Final approved hero alignment and height to match the homepage. */
body.journey-page .journey-hero {
  height:calc(100svh - 145px); min-height:650px; max-height:880px;
}
body.journey-page .journey-hero__content {
  width:min(1120px,100%); max-width:1120px; padding:50px 32px 140px;
}
body.journey-page .journey-hero__scroll {
  left:50%; bottom:44px; transform:translateX(-50%);
}
body.journey-page .journey-intro {
  grid-template-columns:1fr; gap:12px;
}
body.journey-page .journey-intro h2 { white-space:nowrap; }
body.journey-page .journey-intro>p { max-width:760px; }
@media(max-width:700px){
  body.journey-page .journey-hero {height:auto;min-height:max(730px,calc(100svh - 120px));}
  body.journey-page .journey-hero__content {padding:44px 20px 128px;}
  body.journey-page .journey-hero__scroll {bottom:34px;}
  body.journey-page .journey-intro {grid-template-columns:1fr;gap:16px;}
  body.journey-page .journey-intro h2 {white-space:normal;}
}
@media(max-width:540px){
  body.journey-page .journey-hero {min-height:max(755px,calc(100svh - 120px));}
}

/* Match the hero text edge to the centered 1120px Journey content grid. */
@media(min-width:851px){
  body.journey-page .journey-hero__content {
    box-sizing:border-box;
    width:min(1120px,100%);
    max-width:1120px;
    margin-left:auto;
    margin-right:auto;
    padding:0 0 96px;
  }
}
@media(max-width:850px){
  body.journey-page .journey-hero__content {
    box-sizing:border-box;
    width:100%;
    max-width:none;
    margin:0;
    padding:44px 20px 128px;
  }
}

/* Build 02: keep every Journey hero element in one left-aligned text group. */
body.journey-page .journey-hero__content {
  text-align:left;
}
body.journey-page .journey-hero__scroll {
  position:static;
  left:auto;
  bottom:auto;
  transform:none;
  align-self:flex-start;
  margin:24px 0 0;
}

/* Interior page type scale also applies to the journey stage descriptions. */
body.journey-page.interior-standard main p:not(.eyebrow) {font-size:18px!important;}
@media(max-width:700px){body.journey-page.interior-standard main p:not(.eyebrow) {font-size:17px!important;}}


/* Shared 480px interior desktop hero; mobile keeps its taller photo composition. */
body.journey-page .journey-hero {
  height:480px !important;
  min-height:480px !important;
  max-height:none !important;
}
body.journey-page .journey-hero__content {
  box-sizing:border-box;
  width:100%;
  max-width:none;
  margin:0;
  padding:0 7vw 96px;
}
body.journey-page .journey-hero h1 {
  max-width:100%;
  font-size:clamp(54px,6vw,82px);
  line-height:1.02;
  letter-spacing:-1.4px;
  margin:0 0 20px;
}
body.journey-page .journey-hero__content>p:not(.eyebrow) {
  width:100%;
  max-width:1080px;
  font-size:18px;
  line-height:1.75;
}
body.journey-page .journey-hero__scroll {bottom:34px;}
@media(max-width:850px){
  body.journey-page .journey-hero {
    height:auto !important;
    min-height:max(700px,calc(100svh - 120px)) !important;
    max-height:none !important;
  }
  body.journey-page .journey-hero__content {padding:44px 20px 128px;}
  body.journey-page .journey-hero h1 {font-size:clamp(46px,11vw,68px);}
  body.journey-page .journey-hero__content>p:not(.eyebrow) {font-size:17px;max-width:100%;}
  body.journey-page .journey-hero__scroll {bottom:34px;}
}

/* Final cascade override: keep hero text on the same centered content grid. */
@media(min-width:851px){
  body.journey-page .journey-hero__content {
    box-sizing:border-box;
    width:min(1120px,100%);
    max-width:1120px;
    margin-left:auto;
    margin-right:auto;
    padding:0 32px 96px;
  }
}
@media(max-width:850px){
  body.journey-page .journey-hero__content {
    box-sizing:border-box;
    width:100%;
    max-width:none;
    margin:0;
    padding:44px 20px 128px;
  }
}
