.process-page-hero{position:relative;min-height:620px;display:flex;align-items:center;overflow:hidden;background:#061421;color:#fff;border-bottom:1px solid rgba(154,184,207,.25)}
.process-page-hero__media{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,18,31,.90) 0%,rgba(3,18,31,.68) 31%,rgba(3,18,31,.10) 61%,rgba(3,18,31,0) 100%),url('../../images/process/brtech-surec-hero.webp') center/cover no-repeat;transform:scale(1.01)}
.process-page-hero__content{position:relative;z-index:1;padding-top:var(--header-height);width:100%;padding-left:clamp(28px,4.5vw,74px);padding-right:clamp(28px,4.5vw,74px)}.process-page-kicker{margin:0 0 20px;color:#91b1ca;font-size:12px;font-weight:700;letter-spacing:.2em}.process-page-hero h1{max-width:650px;margin:0;font-family:"Barlow Semi Condensed","Barlow",sans-serif;font-size:clamp(58px,6vw,96px);line-height:.93;font-weight:800;letter-spacing:-.025em}.process-page-hero p:last-child{max-width:590px;margin:28px 0 0;color:#c9d5df;font-size:18px;line-height:1.65}
.process-page-flow{padding:0 0 78px;background:#061421;color:#fff}.process-page-flow__head{display:grid;grid-template-columns:1.4fr .6fr;gap:70px;align-items:end;padding:34px clamp(28px,3.2vw,54px) 28px}.process-page-flow__head span,.process-page-cta span{color:#8eaec7;font-size:11px;font-weight:700;letter-spacing:.18em}.process-page-flow__head h2,.process-page-cta h2{max-width:620px;margin:9px 0 0;font-family:"Barlow Semi Condensed","Barlow",sans-serif;font-size:clamp(32px,3vw,48px);line-height:1;font-weight:800}.process-page-flow__head p{max-width:470px;margin:0 0 2px;color:#b7c7d4;line-height:1.55}
/* process chevron overrides */
.process-chevron-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;overflow:hidden;border:1px solid rgba(154,190,218,.28);background:rgba(7,24,39,.12);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.process-chevron-card{--tip:54px;position:relative;isolation:isolate;min-height:360px;margin:0 calc(var(--tip)*-1) 0 0;padding-right:var(--tip);overflow:hidden;background-image:var(--process-image);background-position:center;background-size:cover;clip-path:polygon(0 0,calc(100% - var(--tip)) 0,100% 50%,calc(100% - var(--tip)) 100%,0 100%,var(--tip) 50%)}
.process-chevron-card:first-child{clip-path:polygon(0 0,calc(100% - var(--tip)) 0,100% 50%,calc(100% - var(--tip)) 100%,0 100%)}
.process-chevron-card:last-child{margin-right:0;padding-right:0;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,var(--tip) 50%)}
.process-chevron-card__shade{position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(4,15,25,.08),rgba(4,15,25,.22) 48%,rgba(4,15,25,.62) 100%),linear-gradient(90deg,rgba(7,27,43,.20),rgba(12,37,55,.04));backdrop-filter:none;-webkit-backdrop-filter:none}
.process-chevron-card::after{content:"";position:absolute;inset:1px;z-index:0;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.07),transparent 34%,rgba(132,184,221,.035) 74%,transparent);clip-path:inherit}
.process-chevron-card__content{position:relative;z-index:2;height:100%;min-height:360px;display:flex;flex-direction:column;justify-content:flex-end;padding:28px 66px 32px 38px}
.process-chevron-card:not(:first-child) .process-chevron-card__content{padding-left:82px}
.process-chevron-card__no{position:absolute;top:24px;left:38px;color:#91b3cf;font-family:"Barlow Semi Condensed",sans-serif;font-size:50px;line-height:1;text-shadow:0 2px 16px rgba(0,0,0,.28)}
.process-chevron-card:not(:first-child) .process-chevron-card__no{left:82px}
.process-chevron-card h3{margin:0 0 9px;font-family:"Barlow Semi Condensed","Barlow",sans-serif;font-size:25px;line-height:1.05;color:#fff}.process-chevron-card p{max-width:255px;margin:0;color:#c9d6df;font-size:14px;line-height:1.5}
@media(max-width:980px){.process-chevron-flow{grid-template-columns:1fr;overflow:visible;border:0;background:transparent;backdrop-filter:none}.process-chevron-card,.process-chevron-card:first-child,.process-chevron-card:last-child{--v:38px;min-height:310px;margin:0 0 -28px;padding:0 0 var(--v);clip-path:polygon(0 0,50% var(--v),100% 0,100% calc(100% - var(--v)),50% 100%,0 calc(100% - var(--v)))}.process-chevron-card:first-child{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--v)),50% 100%,0 calc(100% - var(--v)))}.process-chevron-card:last-child{margin-bottom:0;clip-path:polygon(0 0,50% var(--v),100% 0,100% 100%,0 100%)}.process-chevron-card__content,.process-chevron-card:not(:first-child) .process-chevron-card__content{min-height:310px;padding:72px 28px 58px}.process-chevron-card__no,.process-chevron-card:not(:first-child) .process-chevron-card__no{top:52px;left:auto;right:26px}}

.process-page-cta{display:grid;grid-template-columns:1.1fr .75fr auto;gap:44px;align-items:center;margin:24px clamp(28px,3.2vw,54px) 0;padding:24px 30px;border:1px solid rgba(135,169,195,.35);background:linear-gradient(90deg,rgba(16,43,64,.78),rgba(6,20,33,.75))}.process-page-cta h2{font-size:32px}.process-page-cta p{margin:0;color:#b8c8d5;line-height:1.5}
@media(max-width:980px){.process-page-hero{min-height:560px}.process-page-flow__head{grid-template-columns:1fr;gap:18px}.process-page-cta{grid-template-columns:1fr;gap:18px}}
@media(max-width:640px){.process-page-hero{min-height:600px;align-items:flex-end}.process-page-hero__content{padding-left:24px;padding-right:24px}.process-page-hero__media{background:linear-gradient(180deg,rgba(3,18,31,.18),rgba(3,18,31,.72) 45%,rgba(3,18,31,.98) 82%),url('../../images/process/brtech-surec-hero.webp') 60% center/cover no-repeat}.process-page-hero__content{padding-top:calc(var(--header-height) + 210px);padding-bottom:52px}.process-page-hero h1{font-size:clamp(48px,14vw,68px)}.process-page-hero p:last-child{font-size:16px}.process-page-flow{padding-bottom:54px}.process-page-flow__head{padding:30px 0 24px}.process-page-flow__head h2{font-size:36px}.process-chevron-card,.process-chevron-card:first-child,.process-chevron-card:last-child{min-height:330px}.process-chevron-card__content,.process-chevron-card:not(:first-child) .process-chevron-card__content{min-height:330px}.process-page-cta{padding:24px 22px}.process-page-cta h2{font-size:30px}}

/* Subtle panel edge: keep the original imagery and geometry intact. */
@media (min-width:981px){
  .process-chevron-card:not(:last-child){
    filter:drop-shadow(1px 0 0 rgba(181,211,232,.34));
  }
}

/* Process panels: keep photographs rectangular; use the chevron only as a light glass separator. */
@media (min-width:981px){
  .process-chevron-flow{overflow:hidden}
  .process-chevron-card,
  .process-chevron-card:first-child,
  .process-chevron-card:last-child{
    margin:0;
    padding-right:0;
    clip-path:none;
    overflow:hidden;
  }
  .process-chevron-card__content,
  .process-chevron-card:not(:first-child) .process-chevron-card__content{
    padding-left:38px;
    padding-right:34px;
  }
  .process-chevron-card__no,
  .process-chevron-card:not(:first-child) .process-chevron-card__no{left:38px}
  .process-chevron-card:not(:last-child){filter:none}
  .process-chevron-card:not(:last-child)::before{
    content:"";
    position:absolute;
    z-index:3;
    top:0;
    right:-1px;
    width:44px;
    height:100%;
    pointer-events:none;
    background:linear-gradient(90deg,rgba(231,243,251,.025),rgba(237,247,253,.11) 48%,rgba(255,255,255,.34) 50%,rgba(213,235,249,.10) 53%,rgba(219,238,250,.018));
    clip-path:polygon(0 0,100% 50%,0 100%,10% 100%,100% 50%,10% 0);
  }
  .process-chevron-card::after{
    inset:1px;
    clip-path:none;
    background:linear-gradient(135deg,rgba(255,255,255,.045),transparent 32%,rgba(132,184,221,.025) 76%,transparent);
  }
}

/* Final process treatment: images stay whole; chevrons float over the joins. */
@media (min-width:981px){
  .process-chevron-card,
  .process-chevron-card:first-child,
  .process-chevron-card:last-child{
    overflow:visible;
    clip-path:none;
    margin:0;
    padding:0;
  }
  .process-chevron-card{z-index:1}
  .process-chevron-card__content{z-index:6}
  .process-chevron-card:not(:last-child)::before{
    right:-42px;
    width:84px;
    z-index:5;
    background:linear-gradient(90deg,transparent 0%,rgba(225,240,250,.025) 30%,rgba(244,250,255,.16) 48%,rgba(255,255,255,.55) 50%,rgba(230,243,252,.14) 52%,rgba(216,235,248,.025) 70%,transparent 100%);
    clip-path:polygon(0 0,52% 50%,0 100%,8% 100%,60% 50%,8% 0);
    filter:drop-shadow(0 0 5px rgba(190,220,240,.10));
  }
}
@media (max-width:980px){
  .process-chevron-card,
  .process-chevron-card:first-child,
  .process-chevron-card:last-child{
    overflow:visible;
    clip-path:none;
    margin:0;
    padding:0;
  }
  .process-chevron-card:not(:last-child)::before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-30px;
    width:100%;
    height:60px;
    z-index:5;
    pointer-events:none;
    background:linear-gradient(180deg,transparent 0%,rgba(235,246,253,.04) 30%,rgba(255,255,255,.42) 50%,rgba(224,240,250,.04) 70%,transparent 100%);
    clip-path:polygon(0 0,50% 48%,100% 0,100% 8%,50% 58%,0 8%);
  }
}

/* Connected process panels: preserve each original rectangular image area, then extend only the right edge into a photographic arrow tip. */
@media (min-width:981px){
  .process-chevron-flow{overflow:hidden}
  .process-chevron-card,
  .process-chevron-card:first-child,
  .process-chevron-card:last-child{
    --photo-tip:44px;
    margin:0;
    padding:0;
    overflow:hidden;
  }
  .process-chevron-card:not(:last-child){
    width:calc(100% + var(--photo-tip));
    clip-path:polygon(0 0,calc(100% - var(--photo-tip)) 0,100% 50%,calc(100% - var(--photo-tip)) 100%,0 100%);
  }
  .process-chevron-card:nth-child(1){z-index:4}
  .process-chevron-card:nth-child(2){z-index:3}
  .process-chevron-card:nth-child(3){z-index:2}
  .process-chevron-card:nth-child(4){z-index:1}
  .process-chevron-card:not(:last-child)::before{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:var(--photo-tip);
    height:100%;
    z-index:4;
    pointer-events:none;
    clip-path:none;
    background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(225,240,250,.035) 58%,rgba(255,255,255,.18) 94%,rgba(255,255,255,.34) 100%);
    border:0;
    filter:none;
  }
  .process-chevron-card:not(:last-child)::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:auto;
    width:var(--photo-tip);
    z-index:5;
    pointer-events:none;
    clip-path:polygon(calc(100% - 2px) 50%,100% 49.2%,100% 50.8%);
    background:rgba(238,248,255,.72);
  }
  .process-chevron-card__content,
  .process-chevron-card:not(:first-child) .process-chevron-card__content{
    padding-left:38px;
    padding-right:calc(34px + var(--photo-tip));
  }
  .process-chevron-card__no,
  .process-chevron-card:not(:first-child) .process-chevron-card__no{left:38px}
}

/* Refined connectors: arrow tip remains photographic; marker sits on the join. */
@media (min-width:981px){
}

@media (max-width:980px){
  .process-chevron-flow{overflow:visible}
  .process-chevron-card,
  .process-chevron-card:first-child,
  .process-chevron-card:last-child{
    --mobile-tip:30px;
    min-height:330px;
    margin:0 0 calc(var(--mobile-tip) * -1);
    padding:0 0 var(--mobile-tip);
    overflow:hidden;
    clip-path:polygon(0 0,100% 0,100% calc(100% - var(--mobile-tip)),50% 100%,0 calc(100% - var(--mobile-tip)));
  }
  .process-chevron-card:not(:first-child){
    clip-path:polygon(0 var(--mobile-tip),50% 0,100% var(--mobile-tip),100% calc(100% - var(--mobile-tip)),50% 100%,0 calc(100% - var(--mobile-tip)));
  }
  .process-chevron-card:last-child{
    margin-bottom:0;
    padding-bottom:0;
    clip-path:polygon(0 var(--mobile-tip),50% 0,100% var(--mobile-tip),100% 100%,0 100%);
  }
  .process-chevron-card__content,
  .process-chevron-card:not(:first-child) .process-chevron-card__content{
    min-height:330px;
    padding:78px 26px 62px;
  }
  .process-chevron-card__no,
  .process-chevron-card:not(:first-child) .process-chevron-card__no{top:48px;right:24px;left:auto}
  .process-chevron-card:not(:last-child)::before{
    left:0;right:0;bottom:0;width:100%;height:var(--mobile-tip);z-index:5;
    background:linear-gradient(180deg,rgba(255,255,255,0),rgba(238,247,253,.08) 55%,rgba(255,255,255,.30));
    clip-path:none;
  }
  .process-chevron-card:not(:last-child)::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:1px;z-index:6;
    background:linear-gradient(90deg,transparent,rgba(238,248,255,.68) 50%,transparent);
    clip-path:none;
  }
}

/* 2026-09-29 mobile process correction: hero fits the viewport and every connector points DOWN. */
@media (max-width:980px){
  .process-chevron-flow{
    display:block;
    overflow:visible;
    border:0;
    background:transparent;
  }
  .process-chevron-card,
  .process-chevron-card:first-child,
  .process-chevron-card:not(:first-child),
  .process-chevron-card:last-child{
    --mobile-tip:28px;
    position:relative;
    width:100%;
    min-height:330px;
    margin:0 0 calc(var(--mobile-tip) * -1) !important;
    padding:0 0 var(--mobile-tip) !important;
    overflow:hidden !important;
    /* Same geometry on every panel: flat top, one centered point at the bottom. */
    clip-path:polygon(0 0,100% 0,100% calc(100% - var(--mobile-tip)),50% 100%,0 calc(100% - var(--mobile-tip))) !important;
  }
  .process-chevron-card:last-child{margin-bottom:0 !important;}
  .process-chevron-card:nth-child(1){z-index:4}
  .process-chevron-card:nth-child(2){z-index:3}
  .process-chevron-card:nth-child(3){z-index:2}
  .process-chevron-card:nth-child(4){z-index:1}
  .process-chevron-card:not(:last-child)::before{
    content:"";
    position:absolute;
    left:0;right:0;bottom:0;
    width:100%;height:var(--mobile-tip);
    z-index:5;pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,0),rgba(238,247,253,.06) 58%,rgba(255,255,255,.22));
    clip-path:none;
  }
  .process-chevron-card:not(:last-child)::after{
    content:"";
    position:absolute;
    left:20%;right:20%;bottom:1px;height:1px;
    z-index:6;
    background:linear-gradient(90deg,transparent,rgba(238,248,255,.55),transparent);
    clip-path:none;
  }
}
@media (max-width:640px){
  .process-page-hero{
    min-height:520px;
    align-items:flex-end;
  }
  .process-page-hero__media{
    transform:none;
    background:
      linear-gradient(180deg,rgba(3,18,31,.08) 0%,rgba(3,18,31,.30) 34%,rgba(3,18,31,.82) 68%,rgba(3,18,31,.98) 100%),
      url('../../images/process/brtech-surec-hero.webp') 62% center/cover no-repeat;
  }
  .process-page-hero__content{
    padding:0 20px 34px !important;
  }
  .process-page-kicker{margin-bottom:10px;font-size:9px;letter-spacing:.18em;}
  .process-page-hero h1{
    max-width:340px;
    font-size:clamp(37px,10.8vw,46px) !important;
    line-height:.94;
  }
  .process-page-hero p:last-child{
    max-width:345px;
    margin-top:16px;
    font-size:14px !important;
    line-height:1.5;
  }
  .process-page-flow__head{padding-left:20px;padding-right:20px;}
  .process-chevron-card,
  .process-chevron-card:first-child,
  .process-chevron-card:not(:first-child),
  .process-chevron-card:last-child{min-height:300px;}
  .process-chevron-card__content,
  .process-chevron-card:not(:first-child) .process-chevron-card__content{
    min-height:300px;
    padding:66px 24px 54px;
  }
  .process-chevron-card__no,
  .process-chevron-card:not(:first-child) .process-chevron-card__no{top:38px;right:22px;left:auto;}
}
@media (max-width:390px){
  .process-page-hero__content{padding-left:16px !important;padding-right:16px !important;}
  .process-page-hero h1{font-size:35px !important;max-width:300px;}
}
