/* LineArt Elementor Section Library v1.2 */

/* Hero section */
.lineart-hero{
  min-height:680px;
  display:flex;
  align-items:center;
  background-size:cover;
  background-position:center center;
  position:relative;
  padding:80px 20px;
}
.lineart-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(7,28,61,.68),rgba(7,28,61,.22));
}
.lineart-hero__inner{
  position:relative;
  z-index:1;
  max-width:var(--la-max);
  width:100%;
  margin:0 auto;
  color:#fff;
}
.lineart-hero h1{
  font-size:52px;
  line-height:1.25;
  color:#fff;
  margin:0 0 20px;
  font-weight:900;
}
.lineart-hero p{
  font-size:21px;
  color:#eef5ff;
  margin-bottom:26px;
}

/* Service cards */
.lineart-service-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
  margin:40px 0;
}
.lineart-service-card{
  background:#fff;
  border:1px solid var(--la-border);
  border-radius:22px;
  padding:30px 22px;
  box-shadow:var(--la-shadow);
  text-align:center;
}
.lineart-service-card img,
.lineart-service-card svg{
  width:62px;
  height:62px;
  margin-bottom:18px;
}
.lineart-service-card strong{
  display:block;
  font-size:19px;
  color:var(--la-navy);
  margin-bottom:8px;
}

/* Before after */
.lineart-before-after{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
  margin:40px 0;
}
.lineart-before-after__card{
  background:#fff;
  border-radius:22px;
  overflow:hidden;
  box-shadow:var(--la-shadow);
  border:1px solid var(--la-border);
}
.lineart-before-after__label{
  display:flex;
  justify-content:space-between;
  padding:16px 20px;
  font-weight:900;
  color:var(--la-blue);
}

/* Process */
.lineart-process{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin:36px 0;
}
.lineart-process__item{
  background:var(--la-sky);
  border-radius:18px;
  padding:24px;
}
.lineart-process__num{
  display:inline-flex;
  width:36px;
  height:36px;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--la-blue);
  color:#fff;
  font-weight:900;
  margin-bottom:12px;
}

@media(max-width:768px){
  .lineart-hero{min-height:520px;}
  .lineart-hero h1{font-size:34px;}
  .lineart-hero p{font-size:17px;}
  .lineart-service-cards{grid-template-columns:repeat(2,1fr);}
  .lineart-before-after{grid-template-columns:1fr;}
  .lineart-process{grid-template-columns:1fr;}
}
