/* Método: quatro etapas com fotografia discreta e texto legível. */
.method{background:#0e1b27}
.method.section{padding-top:64px}
.method .eyebrow:after{content:'';width:32px;height:1px;background:#8eb0ba;margin-left:4px}
.method .section-head{margin-bottom:42px}
.method .section-head h2{max-width:none}
.method .steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;border:0}
.method .steps>div,.method .steps>div:not(:first-child){position:relative;min-width:0;min-height:344px;padding:25px;border:1px solid rgba(171,207,217,.22);background:#142633;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start}
.method .steps>div:before{content:'';position:absolute;top:0;left:0;width:44px;height:2px;background:#96b9c3}
.method .steps>div:after{content:'';position:absolute;left:0;right:0;bottom:0;height:46%;background-size:cover;background-position:center;opacity:.8;filter:saturate(.7);mask-image:linear-gradient(to bottom,transparent 0%,#000 24%)}
.method .steps>div:nth-child(1):after{background-image:linear-gradient(0deg,rgba(11,28,39,.1),rgba(11,28,39,.08)),url('assets/project-diagnosis.jpg');background-position:center 52%}
.method .steps>div:nth-child(2):after{background-image:linear-gradient(0deg,rgba(11,28,39,.1),rgba(11,28,39,.08)),url('assets/automation-control.jpg');background-position:70% center}
.method .steps>div:nth-child(3):after{background-image:linear-gradient(0deg,rgba(11,28,39,.1),rgba(11,28,39,.08)),url('assets/cftv-camera-user.jpg');background-position:75% center}
.method .steps>div:nth-child(4):after{background-image:linear-gradient(0deg,rgba(11,28,39,.1),rgba(11,28,39,.08)),url('assets/operations-center.jpg')}
.method .steps span,.method .steps h3,.method .steps p{position:relative;z-index:1}
.method .steps span{font-size:11px;letter-spacing:.12em;color:#a9c6ce}
.method .steps h3{margin:36px 0 9px;font-size:23px;letter-spacing:-.04em}
.method .steps p{margin:0;max-width:265px;color:#a9bac1;font-size:13px;line-height:1.6}
@media(max-width:1000px){.method .steps{grid-template-columns:repeat(2,minmax(0,1fr))}.method .steps>div,.method .steps>div:not(:first-child){min-height:306px}}
@media(max-width:760px){.method.section{padding-top:48px}}
@media(max-width:600px){.method .steps{grid-template-columns:1fr}.method .steps>div,.method .steps>div:not(:first-child){min-height:275px}.method .steps>div:after{height:44%}.method .steps h3{margin-top:23px}}
