/* V19 — Training Portfolio page: immersive, compact and continuous */

.route-training .portfolio-hero{
  min-height:auto !important;
  padding:138px 0 72px !important;
  background:
    linear-gradient(90deg, transparent 0 67%, rgba(21,121,164,.08) 67% 67.08%, transparent 67.08%),
    linear-gradient(180deg,#fbfaf7 0%,#f7f6f2 100%) !important;
  overflow:hidden !important;
}

.route-training .portfolio-hero::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:-7vw !important;
  right:auto !important;
  bottom:-26% !important;
  width:49vw !important;
  height:58% !important;
  background:linear-gradient(135deg,rgba(205,229,237,.92),rgba(221,239,244,.72)) !important;
  clip-path:polygon(0 0,100% 30%,86% 100%,0 100%) !important;
  opacity:1 !important;
  border:0 !important;
  border-radius:0 !important;
  z-index:0;
}

.route-training .portfolio-hero::after{
  content:"EXPERIENCE" !important;
  display:block !important;
  position:absolute;
  right:-.02em;
  bottom:-.24em;
  font-family:var(--serif);
  font-size:clamp(7rem,13vw,13rem);
  line-height:1;
  color:rgba(7,28,51,.025);
  pointer-events:none;
}

.route-training .portfolio-hero-grid{
  position:relative;
  z-index:2;
  grid-template-columns:minmax(0,1.06fr) minmax(360px,.74fr) !important;
  gap:clamp(54px,6vw,84px) !important;
  align-items:center !important;
}

.route-training .portfolio-title{
  padding:18px 0 8px;
}

.route-training .portfolio-title .eyebrow{
  margin-bottom:24px;
}

.route-training .portfolio-title h1{
  max-width:760px;
  margin:0 !important;
  font-size:clamp(4.05rem,5.65vw,5.75rem) !important;
  line-height:.88 !important;
  letter-spacing:-.055em !important;
}

.route-training .portfolio-title h1 em{
  display:inline-block;
  position:relative;
  line-height:1 !important;
  padding-bottom:.07em;
}

.route-training .portfolio-title h1 em::after{
  content:"";
  position:absolute;
  left:.02em;
  bottom:0;
  width:.9em;
  height:2px;
  background:var(--accent);
}

.route-training .portfolio-principles-inline{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:0;
  margin-top:32px;
  max-width:670px;
  border-top:1px solid rgba(7,28,51,.14);
  border-bottom:1px solid rgba(7,28,51,.10);
}

.route-training .portfolio-principles-inline span{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:11px 22px 11px 0;
  margin-right:22px;
  color:var(--text);
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.10em;
  white-space:nowrap;
}

.route-training .portfolio-principles-inline span + span{
  position:relative;
}
.route-training .portfolio-principles-inline span + span::before{
  content:"";
  width:1px;
  height:18px;
  background:rgba(7,28,51,.12);
  margin-right:22px;
}
.route-training .portfolio-principles-inline b{
  color:var(--blue);
  font-size:.65rem;
  letter-spacing:.12em;
}

.route-training .portfolio-intro{
  background:transparent !important;
  backdrop-filter:none !important;
  border-left:2px solid var(--accent) !important;
  padding:18px 0 18px 30px !important;
  max-width:520px;
  align-self:center;
}

.route-training .portfolio-intro-label{
  display:block;
  margin-bottom:16px;
  color:var(--blue) !important;
  font-size:.66rem !important;
  line-height:1.3 !important;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.16em !important;
}

.route-training .portfolio-intro p{
  margin:0 0 18px !important;
  font-family:var(--serif);
  font-size:clamp(1.22rem,1.7vw,1.48rem) !important;
  line-height:1.48 !important;
  color:var(--ink) !important;
}

.route-training .portfolio-intro small{
  display:block;
  padding-top:15px;
  border-top:1px solid rgba(7,28,51,.12);
  color:var(--muted);
  font-size:.69rem;
  line-height:1.7;
  text-transform:uppercase;
  letter-spacing:.12em;
}

/* Gallery state */
.route-training .portfolio-gallery{
  padding:64px 0 82px !important;
  background:#fbfaf7 !important;
}
.route-training .portfolio-gallery-head{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(300px,.7fr);
  gap:64px;
  align-items:end;
  margin-bottom:34px;
  padding-bottom:24px;
  border-bottom:1px solid rgba(7,28,51,.12);
}
.route-training .portfolio-gallery-head h2{
  margin:10px 0 0;
  font-family:var(--serif);
  font-size:clamp(2.7rem,3.6vw,3.8rem);
  line-height:1;
  font-weight:500;
  letter-spacing:-.04em;
}
.route-training .portfolio-gallery-head p{
  margin:0;
  color:var(--text);
  max-width:520px;
}
.route-training .masonry{column-gap:18px !important;}
.route-training .gallery-item{margin-bottom:18px !important;}

/* No-photo state: compact and honest rather than a giant placeholder composition. */
.route-training .portfolio-awaiting{
  padding:58px 0 64px;
  background:#fff;
  border-top:1px solid rgba(7,28,51,.08);
  border-bottom:1px solid rgba(7,28,51,.08);
}
.route-training .portfolio-awaiting-grid{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:clamp(48px,6vw,84px);
  align-items:center;
}
.route-training .portfolio-awaiting-title h2{
  margin:12px 0 0;
  font-family:var(--serif);
  font-size:clamp(2.55rem,3.35vw,3.55rem);
  line-height:1.02;
  font-weight:500;
  letter-spacing:-.04em;
}
.route-training .portfolio-awaiting-title h2 em{
  color:var(--blue);
  font-weight:500;
}
.route-training .portfolio-awaiting-copy{
  padding-left:32px;
  border-left:1px solid rgba(7,28,51,.13);
}
.route-training .portfolio-awaiting-copy p{
  max-width:650px;
  margin:0 0 18px;
  color:var(--text);
  font-size:1rem;
  line-height:1.7;
}

/* Training method — designed as the next chapter, not a detached slab. */
.route-training .training-method{
  position:relative;
  padding:70px 0 76px;
  background:linear-gradient(115deg,#061b30 0%,#092844 70%,#0b3150 100%);
  color:#fff;
  overflow:hidden;
}
.route-training .training-method::after{
  content:"JUDGEMENT";
  position:absolute;
  right:-.02em;
  bottom:-.25em;
  font-family:var(--serif);
  font-size:clamp(7rem,15vw,14rem);
  line-height:1;
  color:rgba(255,255,255,.025);
  pointer-events:none;
}
.route-training .training-method-head{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.76fr);
  gap:clamp(48px,6vw,80px);
  align-items:end;
  padding-bottom:34px;
  border-bottom:1px solid rgba(255,255,255,.13);
}
.route-training .training-method .overline{color:var(--sky);}
.route-training .training-method h2{
  margin:12px 0 0;
  font-family:var(--serif);
  font-size:clamp(2.8rem,3.9vw,4.1rem);
  line-height:.98;
  font-weight:500;
  letter-spacing:-.045em;
}
.route-training .training-method h2 em{
  color:var(--sky);
  font-weight:500;
}
.route-training .training-method-head > p{
  margin:0;
  max-width:570px;
  color:#cbdbe2;
  line-height:1.7;
}
.route-training .training-method-steps{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  margin-top:34px;
}
.route-training .training-method-steps article{
  min-height:180px;
  padding:8px 32px 6px 0;
}
.route-training .training-method-steps article + article{
  border-left:1px solid rgba(255,255,255,.12);
  padding-left:32px;
}
.route-training .training-method-steps span{
  display:block;
  margin-bottom:22px;
  color:var(--sky);
  font-size:.65rem;
  letter-spacing:.16em;
}
.route-training .training-method-steps h3{
  margin:0 0 10px;
  font-family:var(--serif);
  font-size:1.65rem;
  font-weight:500;
}
.route-training .training-method-steps p{
  margin:0;
  color:#c8d8df;
  font-size:.91rem;
  line-height:1.65;
}

.route-training .final-cta{
  padding:48px 0 !important;
}
.route-training .final-cta-inner{
  min-height:auto !important;
  padding-top:34px !important;
  padding-bottom:34px !important;
}

@media (max-width:1024px){
  .route-training .portfolio-hero{
    padding:124px 0 64px !important;
  }
  .route-training .portfolio-hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(330px,.78fr) !important;
    gap:44px !important;
  }
  .route-training .portfolio-title h1{
    font-size:clamp(3.75rem,6.4vw,5.15rem) !important;
  }
}

@media (max-width:860px){
  .route-training .portfolio-hero{
    padding:110px 0 56px !important;
  }
  .route-training .portfolio-hero::before{
    width:72vw !important;
    height:38% !important;
    bottom:-18% !important;
  }
  .route-training .portfolio-hero-grid,
  .route-training .portfolio-gallery-head,
  .route-training .portfolio-awaiting-grid,
  .route-training .training-method-head{
    grid-template-columns:1fr !important;
    gap:30px !important;
  }
  .route-training .portfolio-title h1{
    font-size:clamp(3.35rem,13vw,4.65rem) !important;
  }
  .route-training .portfolio-intro{
    max-width:680px;
    padding-left:24px !important;
  }
  .route-training .portfolio-awaiting{
    padding:48px 0 52px;
  }
  .route-training .portfolio-awaiting-copy{
    padding:22px 0 0;
    border-left:0;
    border-top:1px solid rgba(7,28,51,.12);
  }
  .route-training .training-method{
    padding:58px 0 62px;
  }
  .route-training .training-method-steps{
    grid-template-columns:1fr;
    margin-top:24px;
  }
  .route-training .training-method-steps article{
    min-height:auto;
    padding:20px 0;
    border-top:1px solid rgba(255,255,255,.11);
  }
  .route-training .training-method-steps article + article{
    border-left:0;
    padding-left:0;
  }
}

@media (max-width:600px){
  .route-training .portfolio-hero{
    padding:96px 0 48px !important;
  }
  .route-training .portfolio-title h1{
    font-size:clamp(3rem,15vw,4rem) !important;
  }
  .route-training .portfolio-principles-inline{
    margin-top:24px;
  }
  .route-training .portfolio-principles-inline span{
    width:100%;
    padding:9px 0;
    margin:0;
    border-top:1px solid rgba(7,28,51,.08);
  }
  .route-training .portfolio-principles-inline span:first-child{border-top:0;}
  .route-training .portfolio-principles-inline span + span::before{display:none;}
  .route-training .portfolio-intro p{
    font-size:1.12rem !important;
  }
  .route-training .portfolio-awaiting-title h2,
  .route-training .training-method h2{
    font-size:clamp(2.35rem,10vw,3rem);
  }
  .route-training .final-cta{
    padding:38px 0 !important;
  }
}