/* Valour Services - Level 2 ASP Services
   Built in the same style/pattern as the working Solar & Battery template. */

.l2asp-page{
  --l2-navy:#06223a;
  --l2-navy-2:#0a2c49;
  --l2-blue:#000;
  --l2-red:#ed1c24;
  --l2-text:#000;
  --l2-light:#f6fafb;
  --l2-border:#dfe7ec;
  color:var(--l2-text);
  font-family:inherit;
}
.l2asp-page *{box-sizing:border-box}
.l2asp-container{width:min(1180px,calc(100% - 40px));margin:0 auto}
.l2asp-section{padding:56px 0}
.l2asp-eyebrow{
  display:flex;align-items:center;gap:10px;
  margin-bottom:8px;color:var(--l2-red);
  font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase
}
.l2asp-eyebrow:before{content:"";display:block;width:28px;height:3px;background:var(--l2-red)}
.l2asp-eyebrow--light{color:#fff}
.l2asp-richtext p{margin:0 0 12px;line-height:1.45}
.l2asp-btn, a.l2asp-button.l2asp-button--hero{
  display:inline-flex;align-items:center;gap:14px;
  min-height:48px;padding:0 22px;background:var(--l2-red);color:#fff!important;
  text-decoration:none;font-weight:800;border-radius:3px;transition:.2s ease
}
.l2asp-btn:hover{transform:translateY(-1px);filter:brightness(.96)}
.l2asp-section-heading{
  display:flex;align-items:center;gap:10px;margin-bottom:20px
}
.l2asp-section-heading>span{display:block;width:28px;height:3px;background:var(--l2-red)}
.l2asp-section-heading h2{
  margin:0;color:var(--l2-blue);font-size:22px;line-height:1.15
}

/* HERO */
.l2asp-hero{
  min-height:520px;background-color:#0b2336;background-size:cover;background-position:center;
  color:#fff;display:flex;align-items:stretch
}
.l2asp-hero__inner{
  display:flex;justify-content:space-between;align-items:center;gap:40px;
  padding-top:120px;padding-bottom:58px
}
.l2asp-hero__content{width:min(850px,74%)}
.l2asp-hero h1{
  margin:0 0 16px;color:#fff;font-size:clamp(46px,5vw,72px);
  line-height:.94;letter-spacing:-.045em
}
.l2asp-hero .l2asp-richtext{font-size:18px;}
.l2asp-network-list{
  display:flex;align-items:center;gap:20px;margin-top:24px;
}
.l2asp-network{
  display:flex;align-items:center;gap:10px;min-width:145px;
}
.l2asp-network img{
  width:50px;height:50px;object-fit:contain;display:block;
}
.l2asp-network strong,.l2asp-network span{display:block}
.l2asp-network strong{color:#fff;font-size:14px;line-height:1.15}
.l2asp-network span{margin-top:4px;color:rgba(255,255,255,.78);font-size:11px;line-height:1.2}
.l2asp-network-divider{
  width:1px;height:54px;background:rgba(255,255,255,.55);flex:0 0 1px
}
.l2asp-side-points{
  margin-left:auto;border-left:3px solid var(--l2-red);padding-left:16px;
  color:#fff;font-size:15px;font-weight:700;line-height:1.5;white-space:nowrap
}

/* CAPABILITIES */
.l2asp-capabilities{
  border-bottom:1px solid var(--l2-border);background:#fff;padding:22px 0 24px
}
.l2asp-capability-grid{
  display:grid;grid-template-columns:repeat(7,1fr);align-items:stretch
}
.l2asp-capability{
  min-height:120px;padding:8px 13px;
  border-right:1px solid var(--l2-border);
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center
}
.l2asp-capability:last-child{border-right:0}
.l2asp-capability img{
  width:48px;height:48px;object-fit:contain;margin-bottom:9px
}
.l2asp-capability h3{
  max-width:135px;margin:0;color:var(--l2-blue);font-size:14px;line-height:1.2;height: 60px;
}

/* CONNECTION */
.l2asp-two-col{
  display:grid;grid-template-columns:1fr 1.1fr;gap:44px;align-items:center
}
.l2asp-copy h2{
  margin:0 0 15px;color:var(--l2-blue);
  font-size:clamp(32px,3.5vw,50px);line-height:.98;letter-spacing:-.035em
}
.l2asp-copy .l2asp-richtext{font-size:16px}
.l2asp-image-panel{
  position:relative;display:block;overflow:hidden;background:#dce4ea
}
.l2asp-image-panel img{
  display:block;width:100%;height:100%;min-height:350px;object-fit:cover
}

/* SERVICES */
.l2asp-services{padding-top:28px;background:var(--l2-light)}
.l2asp-service-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    column-gap: 28px;
    row-gap: 60px;
}
/* Items 1–8: 4 cards per row */
.l2asp-service-grid .l2asp-service-card:nth-child(-n+8) {
    grid-column: span 3;
}

/* Items 9–10: 2 large cards per row */
.l2asp-service-grid .l2asp-service-card:nth-child(n+9) {
    grid-column: span 6;
}
.l2asp-service-card{min-width:0}
.l2asp-service-card__image{
  width:100%;aspect-ratio:1.9/1;overflow:hidden;background:#dce4ea
}
.l2asp-service-card__image img{
  display:block;width:100%;height:100%;object-fit:cover
}
.l2asp-service-card__body{padding-top:10px}
.l2asp-service-card h3{
  margin:0 0 8px;color:var(--l2-blue);font-size:17px;line-height:1.12
}
.l2asp-service-card .l2asp-richtext{
  color:#222;font-size:16px;line-height:1.4
}
.l2asp-service-card .l2asp-richtext p{margin-bottom:10px;}

/* CTA */
.l2asp-cta{
  min-height:330px;background-color:var(--l2-navy);background-size:cover;background-position:center;
  color:#fff;display:flex;align-items:stretch
}
.l2asp-cta__inner{display:flex;align-items:center;padding-top:48px;padding-bottom:48px}
.l2asp-cta__content{width:min(760px,75%)}
.l2asp-cta h2{
  margin:0 0 8px;color:#fff;font-size:clamp(36px,4vw,58px);line-height:1.02;letter-spacing:-.035em
}
.l2asp-cta .l2asp-richtext{font-size:18px;max-width:650px}
.l2asp-cta__actions{
  display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:18px
}
.l2asp-cta__link{color:#fff!important;text-decoration:none;font-weight:700}
.l2asp-cta__link:hover{text-decoration:underline}

/* TABLET */
@media (max-width:980px){
  .l2asp-capability-grid{grid-template-columns:repeat(4,1fr)}
  .l2asp-capability:nth-child(4){border-right:0}
  .l2asp-capability:nth-child(n+5){border-top:1px solid var(--l2-border)}
  .l2asp-service-grid{grid-template-columns:repeat(2,1fr)}
}

/* MOBILE */
@media (max-width:767px){
  .l2asp-container{width:min(100% - 28px,1180px)}
  .l2asp-section{padding:38px 0}
  .l2asp-hero{min-height:0}
  .l2asp-hero__inner{display:block;padding-top:120px;padding-bottom:40px}
  .l2asp-hero__content{width:100%}
  .l2asp-hero h1{font-size:44px}
  .l2asp-hero .l2asp-richtext{font-size:16px}
  .l2asp-network-list{align-items:flex-start;flex-direction:column;gap:14px}
  .l2asp-network-divider{display:none}
  .l2asp-side-points{margin:34px 0 0;white-space:normal}
  .l2asp-capability-grid{grid-template-columns:repeat(2,1fr)}
  .l2asp-capability{border-right:1px solid var(--l2-border);border-top:1px solid var(--l2-border)}
  .l2asp-capability:nth-child(2n){border-right:0}
  .l2asp-capability:nth-child(-n+2){border-top:0}
  .l2asp-two-col{grid-template-columns:1fr;gap:26px}
  .l2asp-image-panel img{min-height:260px}
  .l2asp-service-grid{grid-template-columns:1fr}
  .l2asp-service-card__image{aspect-ratio:1.8/1}
  .l2asp-cta{min-height:0;background-position:70% center}
  .l2asp-cta__inner{display:block;padding-top:40px;padding-bottom:40px}
  .l2asp-cta__content{width:100%}
  .l2asp-cta__actions{align-items:flex-start;flex-direction:column}
}


/* V4 additions */
.l2asp-button--hero{margin-top:24px;}
.l2asp-bullets{margin:18px 0 0;padding:0;list-style:none;}
.l2asp-bullets li{position:relative;margin:0 0 10px;padding-left:22px;color:var(--l2-text);font-size:15px;line-height:1.5;}
.l2asp-bullets li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--l2-red);}
