:root{
    --backgroundcolor:#FFF;
    --sgadow-hedaer:rgba(0, 0, 0, 0.25);
    --Cta:#E9741B;
     --cta-hover:#E74F13;
     --blacktext:#361F0D;
     --stroke0range:#ED4612;
     --black:#00000065;
     --orange2:#CC3305;
}


.body2{  width: 1280px;

    margin: 0 auto;
    position: relative;
    overflow-x: hidden;
    background-color: var(--backgroundcolor);}

.linkkcta{    width: 151px;
    height: 49px;text-decoration: none;}
.logoo{width: 142px;
height: 111px;}

.nav2-link {
  position: relative;
  color: var(--blacktext);
  font-family: Poppins;
  font-size: 18px;
  margin: 0;
  font-weight: 500;
  text-decoration: underline;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: 6px; 
  text-underline-position: from-font;
  transition: color 0.3s ease;
}

a , li{
list-style-type: none;
text-decoration: none;
}
.nav{
width: 1280px;
    height: 120px;
    flex-shrink: 0;
    box-sizing: border-box;
    position: fixed;
    padding: 0 100px;
    display: flex
;    top: 0;
    z-index: 1111;
    justify-content: space-between;
    align-items: center;
    background: var(--backgroundcolor);

box-shadow: 0 3px 13.6px 0 var(--sgadow-hedaer);
}
.nav-box{
    width: auto;
    height:60px ;
    display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 42px;margin: 0;padding: 0;
    
}
.logo{
    width: 77px;
    height: auto;
    margin: 0;
}
.nav-link {
  position: relative;
  color: var(--blacktext);
  font-family: Poppins;
  font-size: 18px;;margin: 0;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.3s ease;
}


.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height:2px;
  background: var(--Cta);
  
  transition: width 0.4s ease;
}

.nav-link:hover::after {
  width: 100%;
}

.nav-link:hover {
  color: var(--blacktext);
  transform: translateY(-2px);
  transition: transform 0.3s ease, color 0.3s ease;
}

.cta{
display: flex
;
    width: 151px;
    height: 49px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 35px;
    background: var(--Cta);
    color: var(--backgroundcolor);
    font-family: Poppins;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;}
.cta:hover{
    background-color: var(--cta-hover);
}

.header{width: 1280px;
height: 120px;}


.sec1-ch{width: 1280px;
    height: 840px;
    align-items: end;position: relative;
    display: flex;
    justify-content: right;}

.sec1-box{    display: flex;
    flex-direction: column;
    gap: 60px;
    width: 533.009px;
    display: flex;    margin-bottom: 136px;
    margin-right: 100px;
    align-items: end;}

.header-sec1{color: var(--cta-hover);
margin: 0;
font-family: Fredoka;
font-size: 55px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.para{color: var(--blacktext);
margin: 0;
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: 150%;}


.img-sec1-channel{position: absolute;
left: 0;bottom: 0;}

.shadow-sec1-channel{width: 1280px;
height: 224px;    z-index: -4;
flex-shrink: 0;opacity: 0.94;position: absolute;bottom: 0;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #E9741B 112.39%);}


.sec2-ch{height: 573px;width: 1280px;padding: 114px 100px;box-sizing: border-box;}

.sec2-box-container{width: 1072.496px;
height: 346.962px;
border-radius: 30px;
border: 5px solid var(--stroke0range);
box-shadow: 0 7px 13.3px 0 var(--black);
display: flex;justify-content: center;
align-items: center;}

.sub-box-sec2-channels{display: flex;
flex-direction: column;gap: 37px;}


.hedaer-sec2-channels{color: var(--cta-hover);
margin: 0;
font-family: Fredoka;
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.para-sec2{color: var(--blacktext);
font-family: Poppins;width: 611.796px;
font-size: 18px;margin: 0;
font-style: normal;
font-weight: 400;
line-height: normal;}

.small-box-sec2-channels{display: flex;
flex-direction: row;gap: 17px;}

.search-bar{width: 799px;
height: 60px;
flex-shrink: 0;
border-radius: 86px;margin: 0;padding: 0 30px 0 30px;box-sizing: border-box;
display: flex;align-items: center;
border: 3px solid var(--orange2);}

.serach-input{display: flex;    width: 100%;
justify-content: space-between;}

.serach-text {
  color: var(--orange2);
  margin: 0;
  font-family: Poppins;
  font-size: 18px;
  border: 1px solid transparent; 
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  outline: none;
  background: none;
}

.serach-text:focus {
  border-color: transparent;
  outline: none;
}

.serach-text::placeholder {
  color: var(--orange2);
  opacity: 1; 
}

.cta-sec2-channels{width: 153px;
height: 49px;border-color: transparent;
flex-shrink: 0;margin: 0;padding: 0;display: flex;
justify-content: center;align-items: center;
border-radius: 25px;
background: var(--Cta);
transition: all 300ms linear;}

.link-sec2-chann{text-decoration: none;width: 100%;
height: 100%;display: flex;
justify-content: center;
align-items: center;}



.text-cta-sec2-channels{color: var(--backgroundcolor);
margin: 0;
font-family: Poppins;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;}



.cta-sec2-channels:hover{
    background-color: var(--cta-hover);transform: scale(1.05);
}


.serachimag{width: 26px;
height: 27px;}


.sec3-ch{    height: auto;
    padding: 114px 100px 100px 100px;
    box-sizing: border-box;
}

.container-sec3-ch{display: flex;flex-direction: column;
gap: 89px;}

.part1-sec3-ch{display: flex;flex-direction: row;
justify-content: space-between;width: 100%;}

.hedaer-sec3-ch{color: var(--cta-hover);
margin: 0;
font-family: Fredoka;
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;}



.cta-sec3-channels{width: 171px;
height: 49px;border-color: transparent;
flex-shrink: 0;margin: 0;padding: 0;display: flex;
justify-content: center;align-items: center;
border-radius: 25px;transition: all 300ms linear;
background: var(--Cta);}

.link-sec3-chann{text-decoration: none;width: 100%;
height: 100%;display: flex;
justify-content: center;
align-items: center;}



.text-cta-sec3-channels{color: var(--backgroundcolor);
margin: 0;
font-family: Poppins;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;}



.cta-sec3-channels:hover{
    background-color: var(--cta-hover); transform: scale(1.05);
}

.part2-sec3-ch{display: flex;flex-direction: column;
gap: 20px;}

.info-line-sec3{display: flex;flex-direction: column;
gap: 40px;}
.info-line-sec3:hover .fig-sec3::after {
  background-color: rgba(0, 0, 0, 0.4);
}


.part2-sec3-ch:hover {
    gap: 50px;
}


.line-sec3-ch{
width: 100%;background-color: var(--cta-hover);
height: 2px;}

.row-sec3-ch{display: flex;flex-direction: row;
gap: 110px;}

.titles-sec3{color: #361F0D;
margin: 0;
font-family: Poppins;
font-size: 32px;
font-style: normal;
font-weight: 500;
line-height: normal;width: 241.8px;
flex-shrink: 0;}

.vert-sec-sec3{display: flex;flex-direction: column;
gap: 26px;width: 152.329px;}


.text2-sec3{color: #361F0D;
margin: 0;
font-family: Poppins;
font-size: 32px;height: 22px;
font-style: normal;
font-weight: 500;
line-height: normal;}


.fig-sec3 {
  position: relative;
  width: 280.892px;
  height: 239.366px;
  margin: 0;
  border-radius: 10px;
  background-image: url(pic/pic3.png);
  background-size: cover;
  background-position: center;
  overflow: hidden;
  transition: transform 0.5s ease; 
}

.fig-sec3:hover {
  transform: scale(1.05) translateY(10px); 
  transform-origin: center;
}


.info-line-sec3:hover .fig-sec3::after {
  background-color: rgba(0, 0, 0, 0.4);
}

.info-line-sec3:hover .fig-sec3 {
  transform: scale(1.05) translateY(10px);
}









.fig-sec3::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background-color: rgba(0, 0, 0, 0); 
  transition: background-color 0.4s ease;
}


.fig-sec3:hover::after {
  background-color: rgba(0, 0, 0, 0.4); 
}

.circle-sec3 {
  display: flex;
  width: 76.928px;
  height: 76.928px;
  margin: 0;
  justify-content: center;
  align-items: center;
  gap: 10.717px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--Cta);
  transition: backgroundd 0.3s;
}

.circle-sec3:hover {
  background: var(--cta-hover);
}

.link-circle-cta-ch{display: flex;
justify-content: center;
align-items: center;
}



.sec4-ch{padding: 114px 100px 114px 100px;box-sizing: border-box;
display: flex;flex-direction: column;gap: 89px;}
.part1-sec4-ch{display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.hedaer-sec4-ch{
  color: var(--cta-hover);
margin: 0;
font-family: Fredoka;
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;
}


.part2-sec4-ch{display: flex;
flex-direction: row;
gap: 20px;}

.card-sec4-ch{display: flex;width: 530px;
flex-direction: column;gap: 45px;}

.img-sec4-ch {
  height: 442.305px;
  align-self: stretch;
  border-radius: 20px;
  aspect-ratio: 530/442.31;
  margin: 0;
  padding: 0;
  background-image: url(pic/pic10.png);
  background-size: cover;
  background-position: center;
  overflow: hidden; 
  transition: transform 0.6s ease;
}


.img-sec4-ch::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  background-image: inherit;
  background-size: cover;
  background-position: center;
  transition: transform 0.6s ease;
}

.img-sec4-ch:hover::before {
  transform: scale(1.1); 
}



.text-cont-sec4-ch{display: flex;
  flex-direction: column;
     gap: 15px;
}

.titles-card-sec4-ch{overflow: hidden;
color: var(--blacktext);
margin: 0;
text-overflow: ellipsis;
white-space: nowrap;
font-family: Poppins;
font-size: 28px;
font-style: normal;
font-weight: 600;
line-height: 121%; /* 50.869px */}

.para-card-sec4-ch{
color: var(--blacktext);
margin: 0;

font-family: Poppins;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 37.836px */
    display: -webkit-box;
    display: box;
    display: flexbox;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;}







.footer{width: 1280px;
height: 186px;background: #E74F13;
display: flex;flex-direction: row;
justify-content: space-between;align-items: center;
padding: 0 100px ;box-sizing: border-box;}

.last-text{display: flex;
width: 437px;
height: 15px;
flex-direction: column;
justify-content: center;
flex-shrink: 0;margin: 0;
color: var(--backgroundcolor);
margin: 0;
font-family: Jost;
font-size: 20px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 30px */}