.ind,
.ind h1,
.ind h2,
.ind p,
.ind span,
.ind a,
.ind div {
   font-family: "Poppins", sans-serif
}

.ind {
   --o: #ff7a45;
   --o2: #ff9e6b;
   --od: #e5622f;
   --dark: #0e0f12;
   position: relative;
   z-index: 2
}

#mainfooter {
   position: relative;
   z-index: 1
}

.ind * {
   box-sizing: border-box
}

#mainheader {
   min-height: 0 !important;
   padding: 0 !important
}

.ind .container {
   max-width: 1180px;
   width: 100%;
   margin-left: auto;
   margin-right: auto;
   padding-left: 20px;
   padding-right: 20px
}

.ind-btn {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   background: var(--o);
   color: #fff;
   font-weight: 600;
   font-size: 15px;
   padding: 15px 30px;
   border-radius: 10px;
   text-decoration: none;
   transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
   border: 2px solid var(--o);
   box-shadow: 0 10px 26px rgba(255, 122, 69, .28)
}

.ind-btn:hover {
   background: var(--od);
   border-color: var(--od);
   transform: translateY(-3px);
   box-shadow: 0 16px 34px rgba(255, 122, 69, .4)
}

.ind-btn.out {
   background: transparent;
   color: var(--o);
   box-shadow: none
}

.ind-btn.out:hover {
   background: var(--o);
   color: #fff
}

.ind-btn svg {
   width: 17px;
   height: 17px
}

.ind-hero {
   padding: 120px 20px 96px;
   text-align: center;
}

.ind-hero:before {
   top: -160px;
   left: 50%;
   transform: translateX(-50%);
   width: 680px;
   height: 520px;
   background: radial-gradient(circle, rgba(255, 122, 69, .24), transparent 62%);
}

.ind-eyebrow {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   font-size: 12px;
   font-weight: 700;
   letter-spacing: 1.6px;
   text-transform: uppercase;
   color: var(--o2);
   background: rgba(255, 122, 69, .1);
   border: 1px solid rgba(255, 122, 69, .32);
   padding: 8px 16px;
   border-radius: 30px;
   margin-bottom: 22px
}

.ind-eyebrow svg {
   width: 15px;
   height: 15px;
   stroke: var(--o2)
}

.ind-hero h1 {
   font-size: 50px;
   line-height: 1.08;
   font-weight: 800;
   color: #fff;
   margin: 0 0 18px;
   letter-spacing: -.5px;
}

.ind-hero h1 span {
   color: var(--o);
}

.ind-hero p {
   font-size: 18px;
   line-height: 1.7;
   color: #b9bcc6;
   max-width: 620px;
   margin: 0 auto;
}

.ind-grid {
   max-width: 1180px;
   margin: 0 auto;
   padding: 80px 20px;
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 24px;
   background: #fff
}

.ind-card {
   display: block;
   background: #fff;
   border: 1px solid #f2ece7;
   border-radius: 18px;
   padding: 30px 28px;
   box-shadow: 0 10px 30px rgba(0, 0, 0, .06);
   text-decoration: none;
   transition: transform .32s cubic-bezier(.16, 1, .3, 1), box-shadow .32s ease, border-color .32s ease
}

.ind-card:hover {
   transform: translateY(-10px);
   box-shadow: 0 26px 52px rgba(255, 122, 69, .16);
   border-color: #ffd8c6
}

.ind-card .ic {
   width: 56px;
   height: 56px;
   border-radius: 15px;
   background: linear-gradient(135deg, #fff2ea, #ffe0d1);
   border: 1px solid #ffe0d1;
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--o);
   margin-bottom: 16px;
   box-shadow: 0 8px 20px rgba(255, 122, 69, .16)
}

.ind-card .ic svg {
   width: 28px;
   height: 28px;
   stroke: var(--o)
}

.ind-card h2 {
   font-size: 19px;
   font-weight: 700;
   color: #111;
   margin: 0 0 8px
}

.ind-card p {
   font-size: 14px;
   line-height: 1.7;
   color: #666;
   margin: 0 0 14px
}

.ind-card .go {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   color: var(--o);
   font-weight: 700;
   font-size: 13.5px
}

.ind-card .go svg {
   width: 15px;
   height: 15px;
   stroke: var(--o);
   transition: transform .25s ease
}

.ind-card:hover .go svg {
   transform: translateX(4px)
}

.ind-card.soon {
   opacity: .7;
   pointer-events: none
}

.ind-card.soon .go {
   color: #b0a79f
}

.ind-cta {
   background: var(--dark);
   text-align: center;
   padding: 74px 20px;
   position: relative;
   overflow: hidden
}

.ind-cta:before {
   content: "";
   position: absolute;
   top: -140px;
   left: 50%;
   transform: translateX(-50%);
   width: 600px;
   height: 400px;
   background: radial-gradient(circle, rgba(255, 122, 69, .22), transparent 62%);
   pointer-events: none
}

.ind-cta .container {
   position: relative;
   z-index: 2
}

.ind-cta h2 {
   color: #fff;
   font-size: 34px;
   font-weight: 700;
   margin: 0 0 22px
}

.ind-cta .b {
   display: flex;
   gap: 14px;
   justify-content: center;
   flex-wrap: wrap
}

@media(max-width:992px) {
   .ind-grid {
      grid-template-columns: repeat(2, 1fr)
   }

   .ind-hero h1 {
      font-size: 40px;
   }
}

@media(max-width:600px) {
   .ind-grid {
      grid-template-columns: 1fr
   }

   .ind-hero h1 {
      font-size: 32px;
   }
}