/* SERVICES CSS START */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&family=Space+Mono:wght@400;700&display=swap');

    .cp-services{
      background:#fff;
      color:#000;
      padding:90px 24px 130px;
      font-family:'Space Mono', monospace;
      position:relative;
      overflow:hidden;
    }

    .cp-services *{box-sizing:border-box}

    .cp-services-wrap{
      max-width:1400px;
      margin:auto;
    }

    .cp-services-top{
      display:flex;
      justify-content:space-between;
      border-top:1px solid rgba(0,0,0,.18);
      padding-top:15px;
      margin-bottom:95px;
      font-size:13px;
      font-weight:300;
    }

    .cp-services-head{
      margin-bottom:95px;
    }

    .cp-services-head h2{
      font-family:Inter,Arial,sans-serif;
      font-size:clamp(42px,5vw,66px);
      line-height:1;
      letter-spacing:-3px;
      margin-bottom:20px;
      font-weight:300;
    }

    .cp-services-sub{
      display:flex;
      gap:14px;
      color:rgba(0,0,0,.48);
      text-transform:uppercase;
      font-size:16px;
      line-height:1.45;
      max-width:620px;
    }

    .cp-services-sub:before{
      content:"";
      width:9px;
      height:50px;
      background:#ff4b15;
      flex:0 0 auto;
    }

    .cp-services-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:68px 26px;
    }

    .cp-service-card{
      position:relative;
      min-height:120px;
      padding-top:5px;
      border-top:1px solid rgba(0,0,0,.22);
      cursor:pointer;
      transition:.35s ease;
    }

    .cp-service-card h3{
      font-family:Inter,Arial,sans-serif;
      font-size:28px;
      line-height:1.05;
      letter-spacing:-1.4px;
      font-weight:500;
      margin-bottom:18px;
      transition:.35s ease;
    }

    .cp-service-card p{
      font-size:15px;
      line-height:1.5;
      max-width:430px;
      color:rgba(0,0,0,.82);
    }

    .cp-service-card:hover{
      border-top-color:#ff4b15;
      transform:translateY(-8px);
    }

    .cp-service-card:hover h3{
      color:#ff4b15;
    }

    .cp-float-img{
      position:fixed;
      width:260px;
      height:170px;
      border-radius:10px;
      overflow:hidden;
      pointer-events:none;
      z-index:99999;
      opacity:0;
      transform:translate(-50%,-50%) scale(.85) rotate(-4deg);
      transition:opacity .25s ease, transform .25s ease;
      box-shadow:0 28px 80px rgba(0,0,0,.28);
      border:1px solid rgba(255,75,21,.45);
      background:#111;
    }

    .cp-float-img.active{
      opacity:1;
      transform:translate(-50%,-50%) scale(1) rotate(-4deg);
    }

    .cp-float-img img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      filter:saturate(1.1) contrast(1.1);
    }

    .cp-float-img:after{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(135deg,rgba(255,75,21,.25),transparent 55%);
      mix-blend-mode:screen;
    }

    @media(max-width:1000px){
      .cp-services-grid{
        grid-template-columns:repeat(2,1fr);
      }
    }

    @media(max-width:650px){
      .cp-services{
        padding:60px 18px 90px;
      }

      .cp-services-top{
        margin-bottom:60px;
      }

      .cp-services-head{
        margin-bottom:60px;
      }

      .cp-services-grid{
        grid-template-columns:1fr;
        gap:38px;
      }

      .cp-float-img{
        display:none;
      }
    }

/* SERVICES CSS END */
