.elementor-9 .elementor-element.elementor-element-4efcf30{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-148d67f *//* ==========================================
   KANHA MITRAA — COMPLETE MOBILE FIX
   Full-width image + padded text
   Desktop unchanged
========================================== */

@media (max-width: 767px) {

  /* ======================================
     1. HERO MAIN CONTAINER
  ====================================== */

  #km-hero-static {
    --header-height: 60px;

    position: relative !important;
    display: block !important;

    width: 100vw !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;

    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;

    padding: 60px 0 0 !important;

    overflow: hidden !important;
  }

  /* ======================================
     2. HEADER
  ====================================== */

  #km-hero-static .km-header {
    position: absolute !important;

    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    width: 100% !important;
    height: 60px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    padding: 0 24px !important;
    gap: 10px !important;
  }

  /* Header logo */

  #km-hero-static .km-header-logo {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
  }

  #km-hero-static .km-header-logo img {
    width: 38px !important;
    height: 38px !important;

    max-width: none !important;
    object-fit: contain !important;
  }

  /* Navigation */

  #km-hero-static .km-nav {
    display: flex !important;
    flex: 1 1 auto !important;

    min-width: 0 !important;

    align-items: center !important;
    justify-content: flex-end !important;

    gap: clamp(5px, 1.8vw, 12px) !important;
    margin: 0 !important;
  }

  #km-hero-static .km-nav a {
    font-family: Arial, sans-serif !important;

    font-size: clamp(8px, 2.3vw, 11px) !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;

    white-space: nowrap !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
  }

  /* ======================================
     3. HERO IMAGE — EDGE TO EDGE
  ====================================== */

  #km-hero-static .km-hero-image {
    position: relative !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    height: 64vw !important;
    min-height: 0 !important;
    max-height: none !important;

    aspect-ratio: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover !important;
    object-position: center center !important;

    border: 0 !important;
  }

  /* Light image overlay */

  #km-hero-static .km-image-overlay {
    position: absolute !important;

    z-index: 2 !important;

    top: 60px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    background: rgba(255,255,255,0.18) !important;

    pointer-events: none !important;
  }

  /* ======================================
     4. CENTER BRAND LOGO
  ====================================== */

  #km-hero-static .km-center-logo-area {
    position: absolute !important;

    z-index: 20 !important;

    top: 60px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    width: 100% !important;
    height: auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 24px !important;

    pointer-events: none !important;
  }

  #km-hero-static .km-center-logo {
    display: block !important;

    width: 44vw !important;
    max-width: 230px !important;
    height: auto !important;

    margin: 0 auto !important;

    object-fit: contain !important;
  }

  /* ======================================
     5. MADE IN PUSHKAR TEXT SECTION
     Apply km-made-section to its container
  ====================================== */

  .km-made-section {
    box-sizing: border-box !important;

    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;

    padding: 40px 30px 45px !important;

    text-align: left !important;
  }

  .km-made-section > .e-con-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;

    width: 100% !important;
    max-width: 100% !important;
  }

  /* Heading */

  .km-made-section .elementor-widget-heading,
  .km-made-section .elementor-widget-text-editor {
    width: 100% !important;
    max-width: 100% !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .km-made-section .elementor-heading-title,
  .km-made-section h1,
  .km-made-section h2,
  .km-made-section h3 {
    font-family: "Tox Typewriter",
      "Courier New", monospace !important;

    font-size: 29px !important;
    font-weight: 400 !important;
    line-height: 1.12 !important;

    letter-spacing: 0 !important;

    text-align: left !important;
  }

  /* ======================================
     6. GARMENT PARAGRAPH
     Left aligned / Smaller / Two lines
  ====================================== */

  .km-made-section .elementor-widget-text-editor,
  .km-made-section .elementor-widget-text-editor
    .elementor-widget-container,
  .km-made-section .elementor-widget-text-editor p,
  .km-made-section .km-garment-copy,
  .km-made-section .km-garment-copy p {
    width: 100% !important;
    max-width: 100% !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    font-family: "Darker Grotesque",
      Arial, sans-serif !important;

    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0 !important;

    text-align: left !important;
    white-space: normal !important;
  }

  .km-made-section .elementor-widget-text-editor,
  .km-made-section .km-garment-copy {
    margin-top: 25px !important;
  }

  .km-made-section p {
    margin-bottom: 0 !important;
  }
}

/* ==========================================
   SMALL PHONES
========================================== */

@media (max-width: 390px) {

  #km-hero-static {
    --header-height: 56px;

    padding-top: 56px !important;
  }

  #km-hero-static .km-header {
    height: 56px !important;
    padding: 0 14px !important;
    gap: 6px !important;
  }

  #km-hero-static .km-header-logo img {
    width: 34px !important;
    height: 34px !important;
  }

  #km-hero-static .km-nav {
    gap: 6px !important;
  }

  #km-hero-static .km-nav a {
    font-size: 8px !important;
  }

  #km-hero-static .km-hero-image {
    height: 66vw !important;
  }

  #km-hero-static .km-image-overlay {
    top: 56px !important;
  }

  #km-hero-static .km-center-logo-area {
    top: 56px !important;
  }

  #km-hero-static .km-center-logo {
    width: 48vw !important;
  }

  .km-made-section {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }

  .km-made-section .elementor-heading-title,
  .km-made-section h1,
  .km-made-section h2,
  .km-made-section h3 {
    font-size: 26px !important;
    line-height: 1.12 !important;
  }

  .km-made-section .elementor-widget-text-editor,
  .km-made-section .elementor-widget-text-editor p,
  .km-made-section .km-garment-copy,
  .km-made-section .km-garment-copy p {
    font-size: 15px !important;
    line-height: 18px !important;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1c1bb3a *//* =========================================
   FIGMA TEXT SIZE CORRECTION
   ========================================= */

/* Reduce horizontal padding so text uses the Figma width */
#km-atelier-section .km-fabric-panel {
  padding-right: clamp(4px, 0.33vw, 5px) !important;
  padding-left: clamp(4px, 0.33vw, 5px) !important;
}

/* Figma: Darker Grotesque 32px / 32px */
#km-atelier-section .km-copy-block {
  width: min(950px, 100%) !important;
  max-width: 950px !important;
  margin-right: auto !important;
  margin-left: auto !important;

  font-family: "Darker Grotesque", sans-serif !important;
  font-size: clamp(20px, 2.13vw, 32px) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

/* Paragraph spacing */
#km-atelier-section .km-copy-block p {
  margin: 0 0 clamp(22px, 2vw, 30px) !important;
}

/* Adjust for the larger top text */
#km-atelier-section .km-copy-bottom {
  margin-top: clamp(220px, 24vw, 360px) !important;
}

/* Tablet */
@media (max-width: 900px) {
  #km-atelier-section .km-copy-block {
    font-size: clamp(20px, 2.7vw, 25px) !important;
    line-height: 1.04 !important;
  }

  #km-atelier-section .km-fabric-panel {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  #km-atelier-section .km-copy-bottom {
    margin-top: clamp(215px, 27vw, 275px) !important;
  }
}

/* Mobile */
@media (max-width: 600px) {
  #km-atelier-section .km-fabric-panel {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  #km-atelier-section .km-copy-block {
    font-size: 19px !important;
    line-height: 1.08 !important;
  }

  #km-atelier-section .km-copy-bottom {
    margin-top: 220px !important;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7430972 *//* Make the stitched paper area bigger */
#km-atelier-section {
  --paper-scale: 1.5;
}

#km-atelier-section .km-atelier-inner {
  width: min(820px, calc(100% - 110px));
}

#km-atelier-section .km-fabric-panel {
  width: 108%;
  min-height: 650px;
  margin-left: -4%;
}

/* Add more space above the bottom text */
#km-atelier-section .km-copy-bottom {
  margin-top: 235px;
  padding-top: 20px;
}

/* Make thread roll slightly bigger */
#km-atelier-section .km-thread-holder {
  width: 125px;
  height: 68px;
}

#km-atelier-section .km-thread-roll {
  width: 105px;
}

/* Mobile adjustments */
@media (max-width: 767px) {
  #km-atelier-section {
    --paper-scale: 1.75;
  }

  #km-atelier-section .km-atelier-inner {
    width: calc(100% - 70px);
  }

  #km-atelier-section .km-fabric-panel {
    width: 106%;
    min-height: 730px;
    margin-left: -3%;
  }

  #km-atelier-section .km-copy-bottom {
    margin-top: 215px;
    padding-top: 20px;
  }

  #km-atelier-section .km-thread-holder {
    width: 92px;
    height: 54px;
  }

  #km-atelier-section .km-thread-roll {
    width: 78px;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4ee22c5 */#km-project-section .km-scissors,
#km-project-section .km-scissors.km-reveal,
#km-project-section.km-visible .km-scissors.km-reveal {
  top: -95px;
  transform: translateY(0) rotate(-90deg) scale(1);
}


/* =========================================
   SCISSORS SECTION BACKGROUND
   ========================================= */

#km-project-section .km-project-top {
  background-image: url("https://kanhamitraa.com/wp-content/uploads/2026/09/sciser-section-bg-Untitled-design.png") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 100% 100% !important;
}

/* Hide the old Pleated-Paper image */
#km-project-section .km-pleated-paper {
  display: none !important;
}

/* =========================================
   START-A-PROJECT BUTTON BACKGROUND
   ========================================= */

#km-project-section .km-project-button {
  display: block !important;
  width: min(480px, 80%) !important;
  min-height: 0 !important;
  aspect-ratio: 958 / 675 !important;
  margin: 45px auto 0 !important;

  background-color: transparent !important;
  background-image: url("https://kanhamitraa.com/wp-content/uploads/2026/09/start-a-project.png") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 100% 100% !important;

  border: 0 !important;
  transform: none !important;
}

/* Remove old hand-drawn CSS border */
#km-project-section .km-project-button::before,
#km-project-section .km-project-button::after {
  display: none !important;
  content: none !important;
}

/* The new image already contains the seal and text */
#km-project-section .km-metal-button,
#km-project-section .km-project-button-text {
  display: none !important;
}

/* Disable button movement */
#km-project-section .km-project-button:hover {
  transform: none !important;
}

/* Mobile */
@media (max-width: 767px) {
  #km-project-section .km-project-top {
    background-size: 100% 100% !important;
  }

  #km-project-section .km-project-button {
    width: min(390px, 88%) !important;
    margin-top: 40px !important;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4efcf30 *//* Complete page content scale */
:root {
  --km-page-content-scale: 1.22;
}

@media (min-width: 1024px) {
  #km-production-intro .km-intro-inner,
  #km-atelier-section .km-atelier-inner,
  #km-tailor-section .km-tailor-inner,
  #km-project-section .km-project-inner {
    zoom: var(--km-page-content-scale);
  }

  /* Enlarge hero content */
  #km-hero .km-center-logo {
    width: min(580px, 58vw);
  }

  #km-hero .km-header-logo img {
    width: 58px;
    height: 58px;
  }

  #km-hero .km-nav a {
    font-size: 16px;
  }
}

/* Slight enlargement on tablets */
@media (min-width: 768px) and (max-width: 1023px) {
  #km-production-intro .km-intro-inner,
  #km-atelier-section .km-atelier-inner,
  #km-tailor-section .km-tailor-inner,
  #km-project-section .km-project-inner {
    zoom: 1.1;
  }
}/* End custom CSS */