/* Ramki Cards – 5-step reference-size layout (v13)
   Only targets homepage rc-process; does not touch products, photography,
   Latest Stories, or any JS/DB. Larger circles, outline icons and numbered badges.
*/
html body main.rc-new#main-content > section.rc-section.rc-wrap.rc-process {
  background: #ffffff !important;
  border: 0 !important;
  margin-top: 0 !important;
  padding-top: 45px !important;
  padding-bottom: 58px !important;
  text-align: center !important;
}
html body main.rc-new#main-content > section.rc-process > h2 {
  color: #111012 !important;
  font-family: 'Assistant', 'Josefin Sans', Arial, sans-serif !important;
  font-size: clamp(30px, 2.6vw, 38px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  margin: 0 0 14px !important;
}
html body main.rc-new#main-content > section.rc-process > .rc-steps-subtitle {
  color: #423d3b !important;
  font: 400 15px/1.5 'Assistant', 'Josefin Sans', Arial, sans-serif !important;
  letter-spacing: .025em !important;
  margin: 0 auto 0 !important;
  max-width: 650px !important;
}
html body main.rc-new#main-content > section.rc-process > .rc-steps {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  align-items: start !important;
  justify-items: stretch !important;
  column-gap: clamp(12px, 2.3vw, 36px) !important;
  row-gap: 30px !important;
  width: 100% !important;
  max-width: 1320px !important;
  margin: 64px auto 0 !important;
  padding: 0 !important;
}
html body main.rc-new#main-content > section.rc-process .rc-steps > .rc-step-item {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 4px !important;
  min-width: 0 !important;
  text-align: center !important;
}
html body main.rc-new#main-content > section.rc-process .rc-step-symbol {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  position: relative !important;
  width: 102px !important;
  height: 102px !important;
  flex: 0 0 102px !important;
  border: 1px solid #a54b4e !important;
  border-radius: 50% !important;
  color: #943e43 !important;
  background: #ffffff !important;
  margin: 0 0 19px !important;
}
html body main.rc-new#main-content > section.rc-process .rc-step-symbol > svg {
  display: block !important;
  width: 38px !important;
  height: 38px !important;
  fill: none !important;
  stroke: currentColor !important;
}
html body main.rc-new#main-content > section.rc-process .rc-step-symbol > .rc-step-count {
  position: absolute !important;
  display: grid !important;
  place-items: center !important;
  top: -9px !important;
  right: -9px !important;
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #944044 !important;
  color: #ffffff !important;
  font: 600 15px/1 'Assistant', Arial, sans-serif !important;
  padding: 0 !important;
}
html body main.rc-new#main-content > section.rc-process .rc-steps > .rc-step-item > strong {
  display: block !important;
  width: 100% !important;
  color: #1a1316 !important;
  font: 600 17px/1.3 'Assistant', 'Josefin Sans', Arial, sans-serif !important;
  margin: 0 !important;
  letter-spacing: .012em !important;
}
html body main.rc-new#main-content > section.rc-process .rc-steps > .rc-step-item > span {
  display: block !important;
  color: #5c5550 !important;
  font: 400 14px/1.35 'Assistant', 'Josefin Sans', Arial, sans-serif !important;
  margin: 7px 0 0 !important;
  padding: 0 !important;
}
@media (min-width: 701px) and (max-width: 1024px) {
  html body main.rc-new#main-content > section.rc-section.rc-wrap.rc-process {
    padding-top: 42px !important;
    padding-bottom: 48px !important;
  }
  html body main.rc-new#main-content > section.rc-process > .rc-steps {
    margin-top: 50px !important;
    column-gap: 10px !important;
  }
  html body main.rc-new#main-content > section.rc-process .rc-step-symbol {
    width: 84px !important;
    height: 84px !important;
    flex-basis: 84px !important;
    margin-bottom: 15px !important;
  }
  html body main.rc-new#main-content > section.rc-process .rc-step-symbol > svg {width: 33px !important;height: 33px !important;}
  html body main.rc-new#main-content > section.rc-process .rc-steps > .rc-step-item > strong {font-size: 15px !important;}
  html body main.rc-new#main-content > section.rc-process .rc-steps > .rc-step-item > span {font-size: 13px !important;}
}
@media (max-width: 700px) {
  html body main.rc-new#main-content > section.rc-section.rc-wrap.rc-process {
    padding: 34px 16px 42px !important;
  }
  html body main.rc-new#main-content > section.rc-process > h2 {
    font-size: clamp(25px, 6vw, 31px) !important;
    margin-bottom: 12px !important;
  }
  html body main.rc-new#main-content > section.rc-process > .rc-steps-subtitle {
    font-size: 14px !important;
  }
  html body main.rc-new#main-content > section.rc-process > .rc-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin-top: 40px !important;
    column-gap: 10px !important;
    row-gap: 32px !important;
  }
  html body main.rc-new#main-content > section.rc-process .rc-step-symbol {
    width: 88px !important;
    height: 88px !important;
    flex-basis: 88px !important;
    margin-bottom: 15px !important;
  }
  html body main.rc-new#main-content > section.rc-process .rc-step-symbol > svg {
    width: 32px !important;
    height: 32px !important;
  }
  html body main.rc-new#main-content > section.rc-process .rc-step-symbol > .rc-step-count {
    top: -7px !important;
    right: -7px !important;
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    font-size: 13px !important;
  }
  html body main.rc-new#main-content > section.rc-process .rc-steps > .rc-step-item > strong {
    font-size: 15px !important;
  }
  html body main.rc-new#main-content > section.rc-process .rc-steps > .rc-step-item > span {
    font-size: 13px !important;
  }
  html body main.rc-new#main-content > section.rc-process .rc-steps > .rc-step-item:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
    max-width: calc(50% - 5px) !important;
    width: 100% !important;
    justify-self: center !important;
  }
}