.elementor-20 .elementor-element.elementor-element-4c5fafff{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-20 .elementor-element.elementor-element-107bca8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20 .elementor-element.elementor-element-53338d5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-20 .elementor-element.elementor-element-53338d5:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-53338d5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-2e9956b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20 .elementor-element.elementor-element-2e9956b:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-2e9956b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-1e97e42{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20 .elementor-element.elementor-element-1e97e42:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-1e97e42 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-dc99f35{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20 .elementor-element.elementor-element-dc99f35:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-dc99f35 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-5005e00{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-20 .elementor-element.elementor-element-4755c53{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-20 .elementor-element.elementor-element-4755c53:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-4755c53 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-ecff627{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20 .elementor-element.elementor-element-ecff627:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-ecff627 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-64c0e4f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20 .elementor-element.elementor-element-64c0e4f:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-64c0e4f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-eb79b5e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:0.5;--padding-top:300px;--padding-bottom:250px;--padding-left:0px;--padding-right:0px;}.elementor-20 .elementor-element.elementor-element-eb79b5e:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-eb79b5e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-eb79b5e::before, .elementor-20 .elementor-element.elementor-element-eb79b5e > .elementor-background-video-container::before, .elementor-20 .elementor-element.elementor-element-eb79b5e > .e-con-inner > .elementor-background-video-container::before, .elementor-20 .elementor-element.elementor-element-eb79b5e > .elementor-background-slideshow::before, .elementor-20 .elementor-element.elementor-element-eb79b5e > .e-con-inner > .elementor-background-slideshow::before, .elementor-20 .elementor-element.elementor-element-eb79b5e > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-20 .elementor-element.elementor-element-db76550{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-20 .elementor-element.elementor-element-db76550:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-db76550 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-20 .elementor-element.elementor-element-bd60dcf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-20 .elementor-element.elementor-element-bd60dcf:not(.elementor-motion-effects-element-type-background), .elementor-20 .elementor-element.elementor-element-bd60dcf > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}@media(max-width:767px){.elementor-20 .elementor-element.elementor-element-107bca8{--margin-top:-13px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}}/* Start custom CSS for html, class: .elementor-element-cd23a0e */*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:'Inter',sans-serif;
  background:#0d0d0d;
  overflow-x:hidden;
}

a{
  text-decoration:none;
  color:inherit;
}

/* TOPBAR */

.ks-topbar{
  background:#0d0d0d;
  border-bottom:1px solid #262626;
  color:#c8c8c8;
}

.ks-topbar-inner{
  max-width:1280px;
  margin:auto;
  padding:10px 50px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:11px;
  letter-spacing:1px;
}

.ks-topbar-left,
.ks-topbar-right{
  display:flex;
  align-items:center;
  gap:16px;
}

.ks-topbar-divider{
  width:1px;
  height:12px;
  background:#333;
}

.ks-status-dot{
  width:6px;
  height:6px;
  background:#22c55e;
  border-radius:50%;
  display:inline-block;
  margin-right:8px;
}

/* HERO */

.ks-banner{
  position:relative;
  height:100vh;
  overflow:hidden;
  background:#000;
}

/* SLIDES */

.ks-slide{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity 1s ease;
}

.ks-slide-active{
  opacity:1;
}

.ks-slide-img{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  animation:ksZoom 7s linear infinite;
}

@keyframes ksZoom{
  from{ transform:scale(1); }
  to{ transform:scale(1.08); }
}

/* OVERLAY */

.ks-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    90deg,
    rgba(0,0,0,0.92) 0%,
    rgba(0,0,0,0.72) 45%,
    rgba(0,0,0,0.35) 100%
  );
  z-index:2;
}

.ks-overlay-vertical{
  position:absolute;
  inset:0;
  background:linear-gradient(
    180deg,
    rgba(0,0,0,0.15) 0%,
    rgba(0,0,0,0.1) 50%,
    rgba(0,0,0,0.65) 100%
  );
  z-index:2;
}

/* GRID */

.ks-grid-bg{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size:60px 60px;
  z-index:2;
}

/* CONTENT */

.ks-content{
  position:relative;
  z-index:5;
  max-width:1280px;
  margin:auto;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  padding:120px 50px 100px;
}

/* EYEBROW */

.ks-eyebrow-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:fit-content;
  padding:9px 20px;
  border-radius:100px;
  background:rgba(196,30,30,0.12);
  border:1px solid rgba(196,30,30,0.4);
  backdrop-filter:blur(8px);
  margin-bottom:22px;
}

.ks-pulse-dot{
  width:7px;
  height:7px;
  background:#c41e1e;
  border-radius:50%;
  animation:pulse 2s infinite;
}

@keyframes pulse{
  50%{ opacity:0.5; transform:scale(1.4); }
}

.ks-eyebrow-text{
  font-size:11px;
  letter-spacing:2px;
  font-weight:600;
  color:#ffb1b1;
}

/* TYPE */

.ks-typewriter{
  color:#8c8c8c;
  letter-spacing:4px;
  font-size:12px;
  margin-bottom:18px;
}

.ks-cursor{
  width:2px;
  height:12px;
  background:#c41e1e;
  display:inline-block;
  margin-left:4px;
  animation:blink 1s infinite;
}

@keyframes blink{
  50%{ opacity:0; }
}

/* HEADING */

.ks-headline{
  font-family:'Oswald',sans-serif;
  font-size:96px;
  line-height:0.95;
  color:#fff;
  text-transform:uppercase;
  margin-bottom:28px;
  text-align:left;
}

.ks-red-word{
  color:#c41e1e;
}

/* TEXT */

.ks-lead-text{
  max-width:620px;
  color:#d1d1d1;
  font-size:17px;
  line-height:1.8;
  margin-bottom:40px;
  text-align:left;
}

/* BUTTONS */

.ks-cta-row{
  display:flex;
  gap:16px;
  justify-content:flex-start;
}

.ks-btn-primary,
.ks-btn-ghost{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:17px 34px;
  font-size:13px;
  font-weight:600;
  letter-spacing:1px;
  text-transform:uppercase;
  transition:0.3s ease;
}

.ks-btn-primary{
  background:#c41e1e;
  color:#fff;
  box-shadow:0 12px 30px rgba(196,30,30,0.3);
}

.ks-btn-primary:hover{
  transform:translateY(-3px);
}

.ks-btn-ghost{
  border:1px solid rgba(255,255,255,0.25);
  color:#fff;
  backdrop-filter:blur(6px);
}

.ks-btn-ghost:hover{
  background:rgba(255,255,255,0.06);
}

/* SLIDE CONTROLS */

.ks-slide-controls{
  position:absolute;
  right:50px;
  bottom:42px;
  z-index:10;
  display:flex;
  align-items:center;
  gap:12px;
}

.ks-dot{
  width:42px;
  height:2px;
  border:none;
  cursor:pointer;
  background:rgba(255,255,255,0.25);
  transition:0.4s ease;
}

.ks-dot-active{
  width:72px;
  background:#c41e1e;
}

.ks-dot:hover{
  background:rgba(255,255,255,0.7);
}

/* ========================= */
/* TABLET (769px–1024px) */
/* ========================= */

@media (max-width:1024px) and (min-width:769px){

  .ks-headline{
    font-size:64px;
  }

  .ks-content{
    padding:100px 40px 80px;
    justify-content:center;
    align-items:flex-start;
  }

  .ks-lead-text{
    max-width:480px;
    font-size:16px;
  }

}

/* ========================= */
/* MOBILE */
/* ========================= */

@media (max-width:768px){

  .ks-topbar{
    display:block;
  }

  .ks-topbar-inner{
    padding:8px 16px;
    flex-wrap:nowrap;
    overflow-x:auto;
    -ms-overflow-style:none;
    scrollbar-width:none;
    gap:12px;
  }

  .ks-topbar-inner::-webkit-scrollbar{
    display:none;
  }

  .ks-topbar-right{
    display:none;
  }

  .ks-topbar-left{
    font-size:10px;
    gap:10px;
    white-space:nowrap;
  }

  .ks-banner{
    height:100svh;
    min-height:560px;
  }

  .ks-overlay{
    background:linear-gradient(
      180deg,
      rgba(0,0,0,0.75) 0%,
      rgba(0,0,0,0.60) 40%,
      rgba(0,0,0,0.90) 100%
    );
  }

  .ks-overlay-vertical{
    background:linear-gradient(
      180deg,
      rgba(0,0,0,0.20) 0%,
      rgba(0,0,0,0.30) 50%,
      rgba(0,0,0,0.80) 100%
    );
  }

  .ks-content{
    justify-content:flex-end;
    align-items:flex-start;
    padding:60px 22px 90px;
    text-align:left;
    max-width:100%;
  }

  .ks-eyebrow-pill{
    padding:8px 14px;
    margin-bottom:14px;
  }

  .ks-eyebrow-text{
    font-size:9px;
    letter-spacing:1.5px;
  }

  .ks-typewriter{
    font-size:10px;
    letter-spacing:2px;
    margin-bottom:12px;
  }

  .ks-headline{
    font-size:42px;
    line-height:1.08;
    margin-bottom:16px;
    letter-spacing:0.3px;
  }

  .ks-headline br{
    display:none;
  }

  .ks-lead-text{
    max-width:100%;
    font-size:15px;
    line-height:1.7;
    margin-bottom:24px;
    color:#f1f1f1;
  }

  .ks-cta-row{
    flex-direction:column;
    width:100%;
    gap:12px;
    justify-content:flex-start;
  }

  .ks-btn-primary,
  .ks-btn-ghost{
    width:100%;
    justify-content:center;
    padding:16px 20px;
    font-size:12px;
  }

  .ks-slide-controls{
    left:22px;
    right:auto;
    bottom:22px;
    transform:none;
    gap:8px;
  }

  .ks-dot{
    width:20px;
    height:3px;
  }

  .ks-dot-active{
    width:38px;
  }

  .ks-slide-img{
    animation-duration:9s;
  }

}

/* ========================= */
/* SMALL PHONES */
/* ========================= */

@media (max-width:480px){

  .ks-banner{
    min-height:520px;
  }

  .ks-content{
    padding:50px 18px 80px;
    justify-content:flex-end;
    align-items:flex-start;
  }

  .ks-headline{
    font-size:34px;
    line-height:1.12;
    margin-bottom:14px;
  }

  .ks-lead-text{
    font-size:14px;
    line-height:1.65;
    margin-bottom:20px;
  }

  .ks-eyebrow-text{
    font-size:8px;
  }

  .ks-eyebrow-pill{
    padding:7px 12px;
    margin-bottom:12px;
  }

  .ks-typewriter{
    font-size:9px;
    letter-spacing:1.5px;
    margin-bottom:10px;
  }

  .ks-btn-primary,
  .ks-btn-ghost{
    font-size:11px;
    padding:15px 18px;
  }

  .ks-topbar-left span:last-child{
    display:none;
  }

  .ks-slide-controls{
    left:18px;
    bottom:18px;
  }

}

/* ========================= */
/* LANDSCAPE PHONES */
/* ========================= */

@media (max-height:480px) and (orientation:landscape){

  .ks-banner{
    height:auto;
    min-height:100svh;
  }

  .ks-content{
    justify-content:center;
    align-items:flex-start;
    padding:70px 30px 50px;
  }

  .ks-headline{
    font-size:32px;
    margin-bottom:12px;
  }

  .ks-lead-text{
    margin-bottom:16px;
    font-size:13px;
  }

  .ks-cta-row{
    flex-direction:row;
    justify-content:flex-start;
  }

  .ks-btn-primary,
  .ks-btn-ghost{
    width:auto;
    padding:12px 22px;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6ba1835 */.ks-counter-section{
  width:100%;
  background:#ffffff;
  padding:90px 7%;
  position:relative;
}

/* WRAPPER */

.ks-counter-wrapper{
  max-width:1400px;
  margin:auto;

  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:28px;
}

/* CARD */

.ks-counter-card{
  position:relative;

  background:#ffffff;

  border:1px solid #e8e8e8;

  border-radius:24px;

  padding:55px 30px;

  text-align:center;

  transition:all .45s ease;

  overflow:hidden;

  box-shadow:
  0 4px 20px rgba(0,0,0,0.04);
}

/* PREMIUM TOP LINE */

.ks-counter-card::before{
  content:"";
  position:absolute;

  top:0;
  left:0;

  width:100%;
  height:4px;

  background:#c41e1e;

  transform:scaleX(0);
  transform-origin:left;

  transition:transform .45s ease;
}

.ks-counter-card:hover::before{
  transform:scaleX(1);
}

/* HOVER */

.ks-counter-card:hover{
  transform:translateY(-10px);

  border-color:rgba(196,30,30,0.18);

  box-shadow:
  0 18px 45px rgba(0,0,0,0.08);
}

/* NUMBER */

.ks-counter-number{
  font-family:'Oswald', sans-serif;

  font-size:72px;
  font-weight:700;

  line-height:1;

  color:#111111;

  margin-bottom:18px;

  letter-spacing:1px;
}

.ks-counter-number span{
  color:#c41e1e;
}

/* LABEL */

.ks-counter-label{
  font-family:'Inter', sans-serif;

  font-size:12px;
  font-weight:600;

  letter-spacing:2px;
  text-transform:uppercase;

  color:#666666;

  margin:0;
}

/* RESPONSIVE */

@media(max-width:992px){

  .ks-counter-wrapper{
    grid-template-columns:repeat(2,1fr);
  }

  .ks-counter-number{
    font-size:58px;
  }
}

@media(max-width:640px){

  .ks-counter-section{
    padding:70px 6%;
  }

  .ks-counter-wrapper{
    grid-template-columns:1fr;
    gap:20px;
  }

  .ks-counter-card{
    padding:45px 24px;
  }

  .ks-counter-number{
    font-size:52px;
  }

  .ks-counter-label{
    font-size:11px;
    letter-spacing:1.5px;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-dcba612 */a.ks-gen-link {
  text-decoration: none !important;
  color: inherit !important;
  display: grid !important;
}


.ks-about {
  background: #0a0a0a !important;
  position: relative !important;
  overflow: hidden !important;
  color: white !important;
  padding: 100px 0 !important;
}

.ks-about-bg-pattern {
  position: absolute !important;
  inset: 0 !important;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px) !important;
  background-size: 80px 80px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}



.ks-about-glow {
  position: absolute !important;
  top: 50% !important;
  right: -200px !important;
  transform: translateY(-50%) !important;
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, rgba(196, 30, 30, 0.18) 0%, transparent 60%) !important;
  pointer-events: none !important;
  filter: blur(80px) !important;
  z-index: 1 !important;
}

.ks-about-inner {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 50px !important;
  display: grid !important;
  grid-template-columns: 1fr 1.1fr !important;
  gap: 80px !important;
  align-items: center !important;
}

.ks-about-left {
  position: relative !important;
}

.ks-about-eyebrow {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 4px !important;
  color: #c41e1e !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  margin: 0 0 28px 0 !important;
  position: relative !important;
  padding-left: 20px !important;
}

.ks-about-eyebrow {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 4px !important;
  color: #c41e1e !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  margin: 0 0 28px 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding-left: 0 !important;
}

.ks-about-eyebrow::before {
  content: '' !important;
  display: inline-block !important;
  width: 8px !important;
  height: 8px !important;
  background: #c41e1e !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  position: static !important;
  transform: none !important;
}

.ks-about-heading {
  font-family: 'Oswald', sans-serif !important;
  font-size: 64px !important;
  line-height: 0.95 !important;
  font-weight: 600 !important;
  color: white !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  margin: 0 0 32px 0 !important;
}

.ks-about-red {
  color: #c41e1e !important;
  font-weight: 700 !important;
}

.ks-about-lead {
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  line-height: 1.85 !important;
  color: #b4b2a9 !important;
  font-weight: 400 !important;
  margin: 0 0 20px 0 !important;
  max-width: 480px !important;
}

.ks-about-lead strong {
  color: white !important;
  font-weight: 600 !important;
}

.ks-about-lead-sub {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  color: #888780 !important;
  font-weight: 400 !important;
  margin: 0 0 36px 0 !important;
  max-width: 460px !important;
  padding-left: 16px !important;
  border-left: 2px solid #c41e1e !important;
}

.ks-about-cta-row {
  display: flex !important;
  align-items: center !important;
  gap: 32px !important;
  padding-top: 24px !important;
  border-top: 0.5px solid #2c2c2a !important;
}

.ks-about-cta {
  font-family: 'Inter', sans-serif !important;
  background: transparent !important;
  border: 0.5px solid rgba(255, 255, 255, 0.3) !important;
  color: white !important;
  padding: 14px 26px !important;
  border-radius: 4px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.ks-about-cta i {
  font-size: 15px !important;
  transition: transform 0.3s ease !important;
}

.ks-about-cta:hover {
  background: #c41e1e !important;
  border-color: #c41e1e !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(196, 30, 30, 0.4) !important;
}

.ks-about-cta:hover i {
  transform: translateX(5px) !important;
}

.ks-about-meta {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
}

.ks-about-meta-num {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 2px !important;
  color: #888780 !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
}

.ks-about-meta-year {
  font-family: 'Oswald', sans-serif !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  color: #c41e1e !important;
  letter-spacing: 1px !important;
}

.ks-about-right {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.ks-gen-line-vertical {
  position: absolute !important;
  left: 23px !important;
  top: 30px !important;
  bottom: 30px !important;
  width: 1px !important;
  background: linear-gradient(180deg, transparent 0%, #c41e1e 20%, #c41e1e 80%, transparent 100%) !important;
  opacity: 0.4 !important;
}

.ks-gen-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 48px 1fr !important;
  gap: 24px !important;
  align-items: center !important;
  padding: 24px 28px !important;
  background: rgba(20, 20, 20, 0.6) !important;
  border: 0.5px solid #2c2c2a !important;
  backdrop-filter: blur(8px) !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
  overflow: hidden !important;
}

.ks-gen-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 0 !important;
  height: 100% !important;
  background: linear-gradient(90deg, rgba(196, 30, 30, 0.1) 0%, transparent 100%) !important;
  transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.ks-gen-card:hover {
  border-color: rgba(196, 30, 30, 0.5) !important;
  transform: translateX(8px) !important;
}

.ks-gen-card:hover::before {
  width: 100% !important;
}

.ks-gen-marker {
  position: relative !important;
  width: 14px !important;
  height: 14px !important;
  border: 2px solid #444441 !important;
  border-radius: 50% !important;
  background: #0a0a0a !important;
  transition: all 0.3s ease !important;
  z-index: 2 !important;
  margin-left: 16px !important;
}

.ks-gen-card:hover .ks-gen-marker {
  border-color: #c41e1e !important;
  box-shadow: 0 0 12px rgba(196, 30, 30, 0.5) !important;
}

.ks-marker-active {
  border-color: #c41e1e !important;
  background: #c41e1e !important;
}

.ks-marker-pulse {
  position: absolute !important;
  inset: -6px !important;
  border: 1px solid #c41e1e !important;
  border-radius: 50% !important;
  animation: ksAboutPulse 2s ease-in-out infinite !important;
}

@keyframes ksAboutPulse {
  0%, 100% { transform: scale(1); opacity: 0.6; }
  50% { transform: scale(1.4); opacity: 0; }
}

.ks-gen-content {
  position: relative !important;
  z-index: 2 !important;
}

.ks-gen-label {
  font-family: 'Inter', sans-serif !important;
  font-size: 10px !important;
  letter-spacing: 2.5px !important;
  color: #c41e1e !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  margin: 0 0 8px 0 !important;
}

.ks-gen-name {
  font-family: 'Oswald', sans-serif !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  color: white !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  margin: 0 0 8px 0 !important;
}

.ks-gen-role {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
  color: #888780 !important;
  font-weight: 400 !important;
  margin: 0 !important;
}

.ks-gen-active {
  background: rgba(196, 30, 30, 0.06) !important;
  border-color: rgba(196, 30, 30, 0.3) !important;
}

@media (max-width: 992px) {
  .ks-about { padding: 70px 0 !important; }
  .ks-about-inner {
    grid-template-columns: 1fr !important;
    gap: 56px !important;
    padding: 0 32px !important;
  }
  
  /* ========================= */
/* TABLET & MOBILE */
/* ========================= */

@media (max-width:992px){

  .ks-about{
    padding:70px 0 !important;
  }

  .ks-about-inner{
    grid-template-columns:1fr !important;
    gap:60px !important;
    padding:0 24px !important;
  }

  .ks-about-left{
    text-align:left !important;
  }

  .ks-about-heading{
    font-size:52px !important;
    line-height:1 !important;
  }

  .ks-about-lead,
  .ks-about-lead-sub{
    max-width:100% !important;
  }

  .ks-about-right{
    gap:18px !important;
  }

  .ks-gen-card{
    grid-template-columns:40px 1fr !important;
    gap:18px !important;
    padding:22px !important;
  }

  .ks-gen-line-vertical{
    left:19px !important;
  }

}


/* ========================= */
/* MOBILE */
/* ========================= */

@media (max-width:768px){

  .ks-about{
    padding:60px 0 !important;
  }

  .ks-about-inner{
    padding:0 20px !important;
    gap:48px !important;
  }

  .ks-about-eyebrow{
    font-size:10px !important;
    letter-spacing:3px !important;
    margin-bottom:18px !important;
  }

  .ks-about-heading{
    font-size:42px !important;
    line-height:1 !important;
    margin-bottom:22px !important;
  }

  .ks-about-lead{
    font-size:15px !important;
    line-height:1.75 !important;
    margin-bottom:18px !important;
  }

  .ks-about-lead-sub{
    font-size:14px !important;
    line-height:1.7 !important;
    margin-bottom:24px !important;
  }

  .ks-about-cta-row{
    padding-top:18px !important;
  }

  .ks-about-meta-year{
    font-size:28px !important;
  }

  .ks-about-right{
    gap:14px !important;
  }

  .ks-gen-card{
    grid-template-columns:34px 1fr !important;
    gap:16px !important;
    padding:18px !important;
  }

  .ks-gen-line-vertical{
    left:16px !important;
    top:20px !important;
    bottom:20px !important;
  }

  .ks-gen-marker{
    width:12px !important;
    height:12px !important;
    margin-left:10px !important;
  }

  .ks-gen-label{
    font-size:9px !important;
    letter-spacing:2px !important;
  }

  .ks-gen-name{
    font-size:20px !important;
  }

  .ks-gen-role{
    font-size:12px !important;
    line-height:1.6 !important;
  }

}


/* ========================= */
/* SMALL PHONES */
/* ========================= */

@media (max-width:480px){

  .ks-about{
    padding:50px 0 !important;
  }

  .ks-about-inner{
    padding:0 16px !important;
  }

  .ks-about-heading{
    font-size:34px !important;
  }

  .ks-about-lead{
    font-size:14px !important;
  }

  .ks-about-lead-sub{
    font-size:13px !important;
    padding-left:12px !important;
  }

  .ks-about-meta-year{
    font-size:24px !important;
  }

  .ks-gen-card{
    grid-template-columns:28px 1fr !important;
    padding:16px !important;
    gap:14px !important;
  }

  .ks-gen-line-vertical{
    left:13px !important;
  }

  .ks-gen-marker{
    width:10px !important;
    height:10px !important;
    margin-left:8px !important;
  }

  .ks-gen-name{
    font-size:18px !important;
  }

  .ks-gen-role{
    font-size:11px !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1102f8c *//* ========================= */
/* TABLET */
/* ========================= */

@media (max-width:992px){

  .kbs-marquee-row{
    animation-duration:40s !important;
    gap:42px !important;
  }

  .kbs-brand-name{
    font-size:24px !important;
    letter-spacing:1.5px !important;
  }

}


/* ========================= */
/* MOBILE */
/* ========================= */

@media (max-width:768px){

  div[style*="background:#faf9f6;padding:80px 0 60px"]{
    padding:60px 0 45px !important;
  }

  div[style*="text-align:center;margin-bottom:50px"]{
    margin-bottom:35px !important;
    padding:0 20px !important;
  }

  div[style*="text-align:center;margin-bottom:50px"] h2{
    font-size:34px !important;
    line-height:1.1 !important;
  }

  div[style*="text-align:center;margin-bottom:50px"] p:last-child{
    font-size:14px !important;
    line-height:1.7 !important;
    max-width:100% !important;
  }

  .kbs-marquee-row{
    animation-duration:34s !important;
    gap:32px !important;
  }

  .kbs-brand-name{
    font-size:20px !important;
    letter-spacing:1px !important;
  }

  div[style*="display:flex;align-items:center;justify-content:center;gap:28px"]{
    flex-direction:column !important;
    gap:14px !important;
    margin-top:30px !important;
    text-align:center !important;
    padding:0 20px !important;
  }

  div[style*="display:flex;align-items:center;justify-content:center;gap:28px"] > span:nth-child(even){
    display:none !important;
  }

  .kbs-cta-btn{
    margin-top:6px !important;
    justify-content:center !important;
  }

}


/* ========================= */
/* SMALL MOBILE */
/* ========================= */

@media (max-width:480px){

  div[style*="background:#faf9f6;padding:80px 0 60px"]{
    padding:50px 0 40px !important;
  }

  div[style*="text-align:center;margin-bottom:50px"]{
    padding:0 16px !important;
  }

  div[style*="text-align:center;margin-bottom:50px"] h2{
    font-size:28px !important;
  }

  div[style*="text-align:center;margin-bottom:50px"] p:last-child{
    font-size:13px !important;
  }

  .kbs-marquee-row{
    animation-duration:28s !important;
    gap:24px !important;
  }

  .kbs-brand-name{
    font-size:18px !important;
    letter-spacing:0.5px !important;
  }

  div[style*="display:flex;align-items:center;justify-content:center;gap:28px"]{
    padding:0 16px !important;
  }

  div[style*="display:flex;align-items:center;justify-content:center;gap:28px"] span,
  .kbs-cta-btn{
    font-size:10px !important;
    letter-spacing:1.5px !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5005e00 */<div style="background:#ffffff;padding:100px 0;width:100%;position:relative;font-family:'Inter',sans-serif;box-sizing:border-box;">

  <style>
    .kp-tile {
      transition: all 0.45s cubic-bezier(0.4, 0, 0.2, 1);
      cursor: pointer;
      overflow: hidden;
      position: relative;
    }
    .kp-tile::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 3px;
      background: #c41e1e;
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
      z-index: 3;
    }
    .kp-tile:hover::before {
      transform: scaleX(1);
    }
    .kp-tile:hover {
      background: #0a0a0a !important;
    }
    .kp-tile:hover .kp-tile-name,
    .kp-tile:hover .kp-tile-sub {
      color: white !important;
    }
    .kp-tile:hover .kp-tile-sub {
      opacity: 0.6 !important;
    }
    .kp-tile:hover .kp-tile-icon {
      background: #c41e1e !important;
      border-color: #c41e1e !important;
      transform: rotate(-6deg) scale(1.05);
    }
    .kp-tile:hover .kp-tile-icon svg {
      stroke: white !important;
      transform: rotate(6deg);
    }
    .kp-tile:hover .kp-tile-arrow {
      opacity: 1 !important;
      transform: translate(0, 0) !important;
    }
    .kp-tile:hover .kp-tile-divider {
      width: 56px !important;
      background: #c41e1e !important;
    }
    .kp-tile-arrow {
      opacity: 0;
      transform: translate(-8px, 8px);
      transition: all 0.45s ease;
    }
    .kp-tile-icon {
      transition: all 0.45s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .kp-tile-icon svg {
      transition: all 0.45s ease;
    }
    .kp-tile-divider {
      transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .kp-cta-btn {
      transition: all 0.3s ease;
      position: relative;
      overflow: hidden;
    }
    .kp-cta-btn::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
      transform: translateX(-100%);
      transition: transform 0.6s ease;
    }
    .kp-cta-btn:hover {
      background: #a01818 !important;
      transform: translateY(-2px);
      box-shadow: 0 10px 30px rgba(196,30,30,0.35);
    }
    .kp-cta-btn:hover::before {
      transform: translateX(100%);
    }
    .kp-cta-btn:hover .kp-cta-arrow {
      transform: translateX(5px);
    }
    .kp-cta-arrow {
      transition: transform 0.3s ease;
    }
  </style>

  <div style="max-width:1320px;margin:0 auto;padding:0 50px;">

    <div style="display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:60px;">
      <div>
        <p style="font-family:'Inter',sans-serif;font-size:11px;letter-spacing:4px;color:#c41e1e;font-weight:600;text-transform:uppercase;margin:0 0 22px 0;display:inline-flex;align-items:center;gap:12px;">
          <span style="display:inline-block;width:8px;height:8px;background:#c41e1e;border-radius:50%;"></span>
          OUR PRODUCTS
        </p>
        <h2 style="font-family:'Oswald',sans-serif;font-size:64px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0;line-height:0.95;">
          EVERYTHING <span style="color:#c41e1e;font-weight:700;">STRUCTURAL</span>, UNDER ONE YARD.
        </h2>
      </div>
      <div style="text-align:left;padding-bottom:8px;">
        <p style="font-family:'Inter',sans-serif;font-size:15px;line-height:1.8;color:#5f5e5a;font-weight:400;margin:0;max-width:440px;">
          From single-piece custom cuts to bulk consignment for marquee infrastructure projects — we stock every grade, size, and brand of mild steel under one roof.
        </p>
      </div>
    </div>

    <div style="display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#e5e3da;border:1px solid #e5e3da;">

      <!-- FIRST ROW (4) = PLATES, BEAMS, PIPES, TMT BARS -->
      <!-- PLATES -->
      <div class="kp-tile" style="background:#ffffff;padding:42px 32px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;">
        <div class="kp-tile-icon" style="width:52px;height:52px;background:#faf9f6;border:1px solid #e5e3da;border-radius:8px;display:flex;align-items:center;justify-content:center;">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c41e1e" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="6" width="18" height="12" rx="1"/><path d="M3 10h18"/></svg>
        </div>
        <div>
          <div class="kp-tile-divider" style="width:36px;height:2px;background:#1a1a1a;margin-bottom:18px;"></div>
          <h3 class="kp-tile-name" style="font-family:'Oswald',sans-serif;font-size:23px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0 0 9px 0;line-height:1;">PLATES</h3>
          <p class="kp-tile-sub" style="font-family:'Inter',sans-serif;font-size:12px;color:#888780;letter-spacing:0.5px;font-weight:500;margin:0;line-height:1.5;">Various Thicknesses · custom sizes</p>
        </div>
        <div class="kp-tile-arrow" style="position:absolute;top:32px;right:32px;color:#c41e1e;font-size:18px;">→</div>
      </div>

      <!-- BEAMS -->
      <div class="kp-tile" style="background:#ffffff;padding:42px 32px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;">
        <div class="kp-tile-icon" style="width:52px;height:52px;background:#faf9f6;border:1px solid #e5e3da;border-radius:8px;display:flex;align-items:center;justify-content:center;">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c41e1e" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4v16M20 4v16M4 12h16"/></svg>
        </div>
        <div>
          <div class="kp-tile-divider" style="width:36px;height:2px;background:#1a1a1a;margin-bottom:18px;"></div>
          <h3 class="kp-tile-name" style="font-family:'Oswald',sans-serif;font-size:23px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0 0 9px 0;line-height:1;">BEAMS</h3>
          <p class="kp-tile-sub" style="font-family:'Inter',sans-serif;font-size:12px;color:#888780;letter-spacing:0.5px;font-weight:500;margin:0;line-height:1.5;">ISMB · NPB · WPB sections</p>
        </div>
        <div class="kp-tile-arrow" style="position:absolute;top:32px;right:32px;color:#c41e1e;font-size:18px;">→</div>
      </div>

      <!-- PIPES -->
      <div class="kp-tile" style="background:#ffffff;padding:42px 32px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;">
        <div class="kp-tile-icon" style="width:52px;height:52px;background:#faf9f6;border:1px solid #e5e3da;border-radius:8px;display:flex;align-items:center;justify-content:center;">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c41e1e" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><ellipse cx="6" cy="12" rx="3" ry="5"/><ellipse cx="18" cy="12" rx="3" ry="5"/><path d="M6 7v10M18 7v10"/></svg>
        </div>
        <div>
          <div class="kp-tile-divider" style="width:36px;height:2px;background:#1a1a1a;margin-bottom:18px;"></div>
          <h3 class="kp-tile-name" style="font-family:'Oswald',sans-serif;font-size:23px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0 0 9px 0;line-height:1;">PIPES</h3>
          <p class="kp-tile-sub" style="font-family:'Inter',sans-serif;font-size:12px;color:#888780;letter-spacing:0.5px;font-weight:500;margin:0;line-height:1.5;">APL · Pushpak · Nezone</p>
        </div>
        <div class="kp-tile-arrow" style="position:absolute;top:32px;right:32px;color:#c41e1e;font-size:18px;">→</div>
      </div>

      <!-- TMT BARS -->
      <div class="kp-tile" style="background:#ffffff;padding:42px 32px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;">
        <div class="kp-tile-icon" style="width:52px;height:52px;background:#faf9f6;border:1px solid #e5e3da;border-radius:8px;display:flex;align-items:center;justify-content:center;">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c41e1e" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18M3 12h18M3 18h18"/></svg>
        </div>
        <div>
          <div class="kp-tile-divider" style="width:36px;height:2px;background:#1a1a1a;margin-bottom:18px;"></div>
          <h3 class="kp-tile-name" style="font-family:'Oswald',sans-serif;font-size:23px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0 0 9px 0;line-height:1;">TMT BARS</h3>
          <p class="kp-tile-sub" style="font-family:'Inter',sans-serif;font-size:12px;color:#888780;letter-spacing:0.5px;font-weight:500;margin:0;line-height:1.5;">SAIL · TATA · JSW · UMA · KALIKA</p>
        </div>
        <div class="kp-tile-arrow" style="position:absolute;top:32px;right:32px;color:#c41e1e;font-size:18px;">→</div>
      </div>

      <!-- SECOND ROW (rest 4) = ANGLES, ROUND BARS, SQUARE BARS, FASTENERS -->
      <!-- ANGLES -->
      <div class="kp-tile" style="background:#ffffff;padding:42px 32px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;">
        <div class="kp-tile-icon" style="width:52px;height:52px;background:#faf9f6;border:1px solid #e5e3da;border-radius:8px;display:flex;align-items:center;justify-content:center;">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c41e1e" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4v16h16"/><path d="M4 4l16 16"/></svg>
        </div>
        <div>
          <div class="kp-tile-divider" style="width:36px;height:2px;background:#1a1a1a;margin-bottom:18px;"></div>
          <h3 class="kp-tile-name" style="font-family:'Oswald',sans-serif;font-size:23px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0 0 9px 0;line-height:1;">ANGLES</h3>
          <p class="kp-tile-sub" style="font-family:'Inter',sans-serif;font-size:12px;color:#888780;letter-spacing:0.5px;font-weight:500;margin:0;line-height:1.5;">Equal Angles </p>
        </div>
        <div class="kp-tile-arrow" style="position:absolute;top:32px;right:32px;color:#c41e1e;font-size:18px;">→</div>
      </div>

      <!-- ROUND BARS -->
      <div class="kp-tile" style="background:#ffffff;padding:42px 32px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;">
        <div class="kp-tile-icon" style="width:52px;height:52px;background:#faf9f6;border:1px solid #e5e3da;border-radius:8px;display:flex;align-items:center;justify-content:center;">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c41e1e" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="3"/></svg>
        </div>
        <div>
          <div class="kp-tile-divider" style="width:36px;height:2px;background:#1a1a1a;margin-bottom:18px;"></div>
          <h3 class="kp-tile-name" style="font-family:'Oswald',sans-serif;font-size:23px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0 0 9px 0;line-height:1;">ROUND BARS</h3>
          <p class="kp-tile-sub" style="font-family:'Inter',sans-serif;font-size:12px;color:#888780;letter-spacing:0.5px;font-weight:500;margin:0;line-height:1.5;">Plain &amp; bright bars</p>
        </div>
        <div class="kp-tile-arrow" style="position:absolute;top:32px;right:32px;color:#c41e1e;font-size:18px;">→</div>
      </div>

      <!-- SQUARE BARS -->
      <div class="kp-tile" style="background:#ffffff;padding:42px 32px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;">
        <div class="kp-tile-icon" style="width:52px;height:52px;background:#faf9f6;border:1px solid #e5e3da;border-radius:8px;display:flex;align-items:center;justify-content:center;">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c41e1e" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="5" width="14" height="14"/><rect x="9" y="9" width="6" height="6"/></svg>
        </div>
        <div>
          <div class="kp-tile-divider" style="width:36px;height:2px;background:#1a1a1a;margin-bottom:18px;"></div>
          <h3 class="kp-tile-name" style="font-family:'Oswald',sans-serif;font-size:23px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0 0 9px 0;line-height:1;">SQUARE BARS</h3>
          <p class="kp-tile-sub" style="font-family:'Inter',sans-serif;font-size:12px;color:#888780;letter-spacing:0.5px;font-weight:500;margin:0;line-height:1.5;">Solid sections · all sizes</p>
        </div>
        <div class="kp-tile-arrow" style="position:absolute;top:32px;right:32px;color:#c41e1e;font-size:18px;">→</div>
      </div>

      <!-- FASTENERS -->
      <div class="kp-tile" style="background:#ffffff;padding:42px 32px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;">
        <div class="kp-tile-icon" style="width:52px;height:52px;background:#faf9f6;border:1px solid #e5e3da;border-radius:8px;display:flex;align-items:center;justify-content:center;">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c41e1e" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="6" r="3"/><path d="M12 9v15M9 24h6"/></svg>
        </div>
        <div>
          <div class="kp-tile-divider" style="width:36px;height:2px;background:#1a1a1a;margin-bottom:18px;"></div>
          <h3 class="kp-tile-name" style="font-family:'Oswald',sans-serif;font-size:23px;font-weight:600;color:#1a1a1a;letter-spacing:1px;text-transform:uppercase;margin:0 0 9px 0;line-height:1;">FASTENERS</h3>
          <p class="kp-tile-sub" style="font-family:'Inter',sans-serif;font-size:12px;color:#888780;letter-spacing:0.5px;font-weight:500;margin:0;line-height:1.5;">Custom Foundation Bolts</p>
        </div>
        <div class="kp-tile-arrow" style="position:absolute;top:32px;right:32px;color:#c41e1e;font-size:18px;">→</div>
      </div>

    </div>

    <div style="display:flex;justify-content:center;align-items:center;margin-top:52px;padding-top:30px;border-top:1px solid #d3d1c7;">
      <a href="https://makeoversdigital.net/kasturisteel/products/" class="kp-cta-btn" style="background:#c41e1e;color:white;font-family:'Inter',sans-serif;font-size:12px;letter-spacing:1.5px;font-weight:600;text-transform:uppercase;padding:16px 30px;text-decoration:none;display:inline-flex;align-items:center;gap:10px;border-radius:4px;white-space:nowrap;">
        VIEW ALL PRODUCTS
        <span class="kp-cta-arrow" style="font-size:14px;">→</span>
      </a>
    </div>

  </div>
</div>/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8d83fdf *//* =====================================================
   KASTURI STEEL YARD SECTION - RESPONSIVE
===================================================== */

/* ---------- TABLET ---------- */

@media (max-width:992px){

  div[style*="background:#faf9f6;padding:100px 0"]{
    padding:70px 0 !important;
  }

  div[style*="max-width:1320px"]{
    padding:0 30px !important;
  }

  div[style*="grid-template-columns:1fr 1fr;gap:60px"]{
    grid-template-columns:1fr !important;
    gap:28px !important;
    margin-bottom:40px !important;
  }

  div[style*="grid-template-columns:repeat(4,1fr);grid-template-rows:300px 300px 300px"]{
    grid-template-columns:repeat(2,1fr) !important;
    grid-template-rows:260px !important;
  }

  .kby-tile:first-child{
    grid-column:span 2 !important;
    grid-row:span 1 !important;
  }

  .kby-tile:last-child{
    grid-column:span 2 !important;
  }

}


/* ---------- MOBILE ---------- */

@media (max-width:768px){

  div[style*="background:#faf9f6;padding:100px 0"]{
    padding:60px 0 !important;
  }

  div[style*="max-width:1320px"]{
    padding:0 20px !important;
  }

  div[style*="grid-template-columns:1fr 1fr;gap:60px"]{
    grid-template-columns:1fr !important;
    gap:22px !important;
    margin-bottom:35px !important;
  }

  h2{
    font-size:36px !important;
    line-height:1.08 !important;
  }

  div[style*="text-align:left;padding-bottom:8px"]{
    padding-bottom:0 !important;
  }

  div[style*="text-align:left;padding-bottom:8px"] p{
    max-width:100% !important;
    font-size:14px !important;
    line-height:1.8 !important;
  }

  div[style*="display:flex;align-items:center;gap:28px;padding-top:20px"]{
    flex-wrap:wrap !important;
    gap:18px !important;
  }

  div[style*="grid-template-columns:repeat(4,1fr);grid-template-rows:300px 300px 300px"]{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
  }

  .kby-tile{
    min-height:260px !important;
    grid-column:auto !important;
    grid-row:auto !important;
  }

  .kby-tile:first-child{
    min-height:360px !important;
  }

  .kby-tile h3{
    font-size:22px !important;
  }

  .kby-tile p{
    font-size:13px !important;
  }

  div[style*="display:flex;justify-content:space-between;align-items:center;margin-top:52px"]{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:20px !important;
    margin-top:35px !important;
    padding-top:25px !important;
  }

  div[style*="display:flex;align-items:center;gap:16px"]{
    align-items:flex-start !important;
  }

}


/* ---------- SMALL MOBILE ---------- */

@media (max-width:480px){

  div[style*="background:#faf9f6;padding:100px 0"]{
    padding:50px 0 !important;
  }

  div[style*="max-width:1320px"]{
    padding:0 16px !important;
  }

  h2{
    font-size:30px !important;
  }

  .kby-tile{
    min-height:220px !important;
  }

  .kby-tile:first-child{
    min-height:300px !important;
  }

  .kby-tile h3{
    font-size:18px !important;
  }

  .kby-tile p{
    font-size:12px !important;
  }

  .kby-tile-tag{
    font-size:8px !important;
    padding:6px 10px !important;
  }

  div[style*="display:flex;align-items:center;gap:16px"] p:last-child{
    font-size:14px !important;
    line-height:1.5 !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-fcbd4c5 *//* =====================================================
   PROJECTS SECTION - RESPONSIVE
===================================================== */

@media (max-width:992px){

  div[style*="background:#0a0a0a;padding:100px 0"]{
    padding:70px 0 !important;
  }

  div[style*="max-width:1320px"]{
    padding:0 30px !important;
  }

  div[style*="grid-template-columns:1fr 1fr;gap:60px"]{
    grid-template-columns:1fr !important;
    gap:30px !important;
    margin-bottom:40px !important;
  }

  div[style*="grid-template-columns:repeat(3,1fr);gap:1px"]{
    grid-template-columns:repeat(2,1fr) !important;
  }

}


/* ================= MOBILE ================= */

@media (max-width:768px){

  div[style*="background:#0a0a0a;padding:100px 0"]{
    padding:60px 0 !important;
  }

  div[style*="max-width:1320px"]{
    padding:0 20px !important;
  }

  div[style*="grid-template-columns:1fr 1fr;gap:60px"]{
    grid-template-columns:1fr !important;
    gap:22px !important;
    margin-bottom:35px !important;
  }

  h2{
    font-size:36px !important;
    line-height:1.08 !important;
  }

  div[style*="text-align:left;padding-bottom:8px"]{
    padding-bottom:0 !important;
  }

  div[style*="text-align:left;padding-bottom:8px"] p{
    max-width:100% !important;
    font-size:14px !important;
    line-height:1.8 !important;
  }

  div[style*="grid-template-columns:repeat(3,1fr);gap:1px"]{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:1px !important;
  }

  .kpj-card{
    min-height:180px !important;
    padding:28px 22px !important;
  }

  .kpj-card h3{
    font-size:20px !important;
    line-height:1.15 !important;
  }

  .kpj-card p{
    font-size:11px !important;
  }

  .kpj-card-icon{
    width:44px !important;
    height:44px !important;
  }

  .kpj-card-icon svg{
    width:20px !important;
    height:20px !important;
  }

  div[style*="justify-content:center;align-items:center;margin-top:52px"]{
    margin-top:36px !important;
    padding-top:24px !important;
  }

  .kpj-cta-btn{
    width:100% !important;
    justify-content:center !important;
    padding:16px 20px !important;
  }

}


/* ================= SMALL MOBILE ================= */

@media (max-width:480px){

  div[style*="background:#0a0a0a;padding:100px 0"]{
    padding:50px 0 !important;
  }

  div[style*="max-width:1320px"]{
    padding:0 16px !important;
  }

  h2{
    font-size:30px !important;
  }

  .kpj-card{
    min-height:165px !important;
    padding:24px 18px !important;
  }

  .kpj-card h3{
    font-size:18px !important;
  }

  .kpj-card p{
    font-size:10px !important;
  }

  .kpj-card-icon{
    width:40px !important;
    height:40px !important;
  }

  .kpj-card-icon svg{
    width:18px !important;
    height:18px !important;
  }

  .kpj-cta-btn{
    font-size:11px !important;
    letter-spacing:1px !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-595f4c5 *//* ================= MOBILE ================= */
@media (max-width:768px){
  div[style*="background:#ffffff;padding:100px 0;width:100%"]{
    padding:60px 0 !important;
  }
  div[style*="max-width:1320px"]{
    padding:0 20px !important;
  }
  div[style*="margin-bottom:60px"] h2{
    font-size:38px !important;
    line-height:1.05 !important;
  }
  div[style*="margin-bottom:60px"]{
    margin-bottom:30px !important;
  }
  .ksv-grid{
    gap:30px !important;
  }
  .ksv-visual{
    min-height:320px !important;
    order:-1;
  }
  .ksv-row{
    padding:22px 0 22px 14px !important;
  }
  .ksv-row:hover{
    padding-left:14px !important;
  }
  .ksv-row-num{
    font-size:13px !important;
  }
  .ksv-row-title{
    font-size:22px !important;
    line-height:1.2 !important;
  }
  .ksv-row-arrow{
    opacity:1 !important;
    transform:none !important;
    font-size:16px !important;
  }
  .ksv-row-text{
    max-height:100px !important;
    opacity:1 !important;
    margin-top:10px !important;
    font-size:13px !important;
    line-height:1.7 !important;
  }
  .ksv-row-marker{
    left:0 !important;
    top:22px !important;
    bottom:22px !important;
    width:3px !important;
    transform:scaleY(1) !important;
  }
  .ksv-visual span{
    font-size:9px !important;
    letter-spacing:2px !important;
  }
  .ksv-visual h3{
    font-size:24px !important;
    line-height:1.15 !important;
  }
  .ksv-visual p{
    font-size:13px !important;
    max-width:100% !important;
  }
  .ksv-cta-btn{
    width:100% !important;
    justify-content:center !important;
  }
}
/* ================= SMALL MOBILE ================= */
@media (max-width:480px){
  div[style*="background:#ffffff;padding:100px 0;width:100%"]{
    padding:50px 0 !important;
  }
  div[style*="max-width:1320px"]{
    padding:0 16px !important;
  }
  div[style*="margin-bottom:60px"] h2{
    font-size:30px !important;
  }
  .ksv-row{
    padding:18px 0 18px 12px !important;
  }
  .ksv-row:hover{
    padding-left:12px !important;
  }
  .ksv-row-title{
    font-size:18px !important;
  }
  .ksv-row-text{
    font-size:12px !important;
  }
  .ksv-row-marker{
    top:18px !important;
    bottom:18px !important;
  }
  .ksv-visual{
    min-height:260px !important;
  }
  .ksv-visual div[style*="position:absolute;top:28px"]{
    top:18px !important;
    left:18px !important;
  }
  .ksv-visual div[style*="position:absolute;bottom:32px"]{
    left:18px !important;
    right:18px !important;
    bottom:18px !important;
  }
  .ksv-visual h3{
    font-size:20px !important;
  }
  .ksv-visual p{
    font-size:12px !important;
    margin-bottom:18px !important;
  }
  .ksv-cta-btn{
    width:100% !important;
    padding:14px 16px !important;
    font-size:11px !important;
    letter-spacing:1px !important;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ba680bb *//* ==========================================================
   HERO TEXT OVERLAY - RESPONSIVE ONLY
========================================================== */

@media (max-width:991px){

  div[style*="position:absolute;inset:0;z-index:5"]{
    padding:0 32px !important;
  }

  div[style*="position:absolute;inset:0;z-index:5"] h2{
    font-size:56px !important;
    max-width:720px !important;
    line-height:1 !important;
  }

  div[style*="position:absolute;inset:0;z-index:5"] p:last-child{
    font-size:15px !important;
    max-width:560px !important;
  }

}


/* ================= MOBILE ================= */

@media (max-width:768px){

  div[style*="position:absolute;inset:0;z-index:5"]{
    padding:0 24px !important;
  }

  div[style*="position:absolute;inset:0;z-index:5"] p:first-child{
    font-size:10px !important;
    letter-spacing:3px !important;
    gap:8px !important;
    margin-bottom:18px !important;
  }

  div[style*="position:absolute;inset:0;z-index:5"] h2{
    font-size:40px !important;
    line-height:1.05 !important;
    max-width:100% !important;
    margin-bottom:18px !important;
    letter-spacing:1px !important;
  }

  div[style*="position:absolute;inset:0;z-index:5"] p:last-child{
    font-size:14px !important;
    line-height:1.7 !important;
    max-width:100% !important;
  }

}


/* ================= SMALL MOBILE ================= */

@media (max-width:480px){

  div[style*="position:absolute;inset:0;z-index:5"]{
    padding:0 18px !important;
  }

  div[style*="position:absolute;inset:0;z-index:5"] p:first-child{
    font-size:9px !important;
    letter-spacing:2px !important;
    margin-bottom:16px !important;
  }

  div[style*="position:absolute;inset:0;z-index:5"] h2{
    font-size:30px !important;
    line-height:1.1 !important;
    margin-bottom:14px !important;
  }

  div[style*="position:absolute;inset:0;z-index:5"] p:last-child{
    font-size:13px !important;
    line-height:1.6 !important;
    max-width:100% !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-cb28c30 *//* ==========================================================
   CLIENTS SECTION - RESPONSIVE ONLY
========================================================== */

@media (max-width:1200px){

  /* Container */
  div[style*="max-width:1320px"]{
    padding:0 32px !important;
  }

  /* Heading */
  h2[style*="font-size:64px"]{
    font-size:52px !important;
  }

  /* Client Grid */
  div[style*="grid-template-columns:repeat(5,1fr)"]{
    grid-template-columns:repeat(4,1fr) !important;
  }

}


/* ================= TABLET ================= */

@media (max-width:991px){

  /* Heading Section */
  div[style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr !important;
    gap:24px !important;
    margin-bottom:40px !important;
  }

  h2[style*="font-size:64px"]{
    font-size:44px !important;
    line-height:1 !important;
  }

  p[style*="font-size:15px"]{
    max-width:100% !important;
  }

  /* Filters */
  div[style*="display:flex;align-items:center;gap:10px"]{
    gap:8px !important;
  }

  .kcl-filter-tab{
    font-size:10px !important;
    padding:9px 14px !important;
  }

  /* Client Grid */
  div[style*="grid-template-columns:repeat(5,1fr)"]{
    grid-template-columns:repeat(3,1fr) !important;
  }

  .kcl-tile{
    min-height:120px !important;
  }

}


/* ================= MOBILE ================= */

@media (max-width:768px){

  /* Container */
  div[style*="max-width:1320px"]{
    padding:0 20px !important;
  }

  /* Heading */
  h2[style*="font-size:64px"]{
    font-size:34px !important;
  }

  /* Hide Filter Tabs */
  div[style*="display:flex;align-items:center;gap:10px"][style*="margin-bottom"]{
    display:none !important;
  }

  /* Grid */
  div[style*="grid-template-columns:repeat(5,1fr)"]{
    grid-template-columns:repeat(2,1fr) !important;
  }

  .kcl-tile{
    min-height:110px !important;
    padding:18px 16px !important;
  }

  .kcl-tile-name{
    font-size:16px !important;
  }

  .kcl-tile-cat{
    font-size:8px !important;
    letter-spacing:1.5px !important;
  }

  /* Bottom Stats */
  div[style*="justify-content:space-between;align-items:center;margin-top:52px"]{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:24px !important;
  }

}


/* ================= SMALL MOBILE ================= */

@media (max-width:480px){

  h2[style*="font-size:64px"]{
    font-size:28px !important;
    line-height:1.1 !important;
  }

  div[style*="grid-template-columns:repeat(5,1fr)"]{
    grid-template-columns:1fr !important;
  }

  .kcl-tile{
    min-height:95px !important;
    padding:18px !important;
  }

  .kcl-tile-name{
    font-size:17px !important;
  }

  div[style*="width:1px;height:44px"]{
    display:none !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f334df4 *//* ==========================================================
   CTA SECTION - RESPONSIVE
========================================================== */

/* ---------- Laptop ---------- */

@media (max-width:1200px){

  div[style*="max-width:1320px"]{
    padding:0 32px !important;
  }

  h2[style*="font-size:54px"]{
    font-size:46px !important;
  }

  h3[style*="font-size:42px"]{
    font-size:36px !important;
  }

}


/* ---------- Tablet ---------- */

@media (max-width:991px){

  div[style*="max-width:720px"]{
    margin-bottom:48px !important;
  }

  h2[style*="font-size:54px"]{
    font-size:38px !important;
    line-height:1.1 !important;
  }

  div[style*="grid-template-columns:1.05fr 1fr"]{
    grid-template-columns:1fr !important;
  }

  div[style*="padding:60px 50px"]{
    padding:48px 36px !important;
    min-height:auto !important;
  }

}


/* ---------- Mobile ---------- */

@media (max-width:768px){

  div[style*="max-width:1320px"]{
    padding:0 20px !important;
  }

  h2[style*="font-size:54px"]{
    font-size:30px !important;
    line-height:1.15 !important;
  }

  h3[style*="font-size:42px"]{
    font-size:28px !important;
  }

  h3[style*="font-size:32px"]{
    font-size:24px !important;
  }

  p[style*="font-size:15px"]{
    font-size:14px !important;
    line-height:1.7 !important;
  }

  div[style*="padding:60px 50px"]{
    padding:34px 24px !important;
  }

  /* Buttons */
  a[class*="kab-cta-btn"],
  a[class*="kab-secondary-btn"]{
    width:100%;
    justify-content:center;
  }

  /* Hours + GST */
  div[style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr !important;
    gap:20px !important;
  }

  /* Director row */
  div[style*="justify-content:space-between;gap:18px"]{
    flex-direction:column !important;
    align-items:flex-start !important;
  }

}


/* ---------- Small Mobile ---------- */

@media (max-width:480px){

  h2[style*="font-size:54px"]{
    font-size:26px !important;
  }

  h3[style*="font-size:42px"]{
    font-size:24px !important;
  }

  h3[style*="font-size:32px"]{
    font-size:22px !important;
  }

  div[style*="padding:60px 50px"]{
    padding:28px 18px !important;
  }

  a[class*="kab-cta-btn"],
  a[class*="kab-secondary-btn"]{
    font-size:11px !important;
    padding:15px 18px !important;
  }

}/* End custom CSS */