/** Shopify CDN: Minification failed

Line 7:77 Unexpected "580."

**/
.sf__page-about .m-section-my{margin-top:0}.sf__page-about .sf__about-block{margin-top:40px;margin-bottom:40px}@media(min-width: 1024px){.sf__page-about .sf__about-block{margin-top:50px;margin-bottom:50px}}@media(min-width: 1280px){.sf__page-about .sf__about-block{margin-top:70px;margin-bottom:70px}}@media(max-width: 767px){.sf__page-about .sf__about-block{margin-top:15px;margin-bottom:15px}}.sf__page-about .sf__about-block .sf-custom__block-inner{margin:0 auto}@media(min-width: 1024px){.sf__page-about .sf__about-block .sf-custom__block-inner{max-width:85%}}@media(min-width: 1280px){.sf__page-about .sf__about-block .sf-custom__block-inner{max-width:70%}}.sf__page-about .about__block-heading{font-size:36px;line-height:56px;margin-bottom:30px}@media(max-width: 1023px){.sf__page-about .about__block-heading{font-size:30px;line-height:42px}}@media(max-width: 767px){.sf__page-about .about__block-heading{font-size:24px;line-height:34px;text-align:left;margin-bottom:20px}}.sf__page-about .about__block-subheading{text-align:left;font-size:20px;line-height:30px;font-weight:500;margin-bottom:20px}.sf__page-about .sf__about-block-text-1 .rte,.sf__page-about .sf__about-block-text-2 .rte{text-align:left}.sf__page-about .sf__about-custom-html{align-items:center}@media(min-width: 1024px){.sf__page-about .sf__about-custom-html .sf-custom__block-inner{padding-left:40px}}@media(min-width: 1280px){.sf__page-about .sf__about-custom-html .sf-custom__block-inner{padding-left:70px}}.sf__page-about .sf__about-custom-list h3{font-size:42px;line-height:60px;margin-bottom:60px}@media(max-width: 1023px){.sf__page-about .sf__about-custom-list h3{font-size:30px;line-height:42px;margin-bottom:30px;margin-top:10px}}@media(max-width: 767px){.sf__page-about .sf__about-custom-list h3{font-size:24px;line-height:34px;margin-bottom:30px;margin-top:10px}}.sf__page-about .sf__about-custom-list ul li{display:grid;grid-template-columns:65px auto;column-gap:20px;margin-bottom:30px}.sf__page-about .sf__about-custom-list ul li h4{font-size:20px;line-height:28px;font-weight:500;margin-bottom:12px;margin-top:0}.sf__page-about .sf__about-custom-list ul li:last-child{margin-bottom:0}.sf__page-about .sf__about-custom-heading .content__heading{font-size:42px;line-height:60px;margin-bottom:30px}@media(max-width: 1023px){.sf__page-about .sf__about-custom-heading .content__heading{margin-bottom:10px;font-size:30px;line-height:42px}}@media(max-width: 767px){.sf__page-about .sf__about-custom-heading .content__heading{font-size:24px;line-height:34px;margin-bottom:0}}.sf__page-about .sf__about-card-custom .m-image-card__content{position:relative;padding:30px 0 0}@media(max-width: 767px){.sf__page-about .sf__about-card-custom .m-image-card__content{padding-top:10px;margin-bottom:10px}}.sf__page-about .sf__about-card-custom .m-richtext{display:flex;flex-direction:column;align-items:flex-start;width:100%}.sf__page-about .sf__about-card-custom .m-richtext__title{font-size:18px;line-height:26px;margin-bottom:5px;font-weight:500;order:-1}.sf__page-about .sf__about-card-custom .m-richtext__subtitle{font-size:12px;line-height:16px;margin-bottom:0}@media(max-width: 1023px){.sf__page-about br{display:none}}.sf__page-about.m-icon-box-section{border-top:1px solid #eee}.sf__page-about.m-icon-box-section .m-section-py{padding-top:40px;padding-bottom:40px}.sf__page-about.m-icon-box-section .m-icon-box__text h3{font-weight:500;font-size:20px}
У нас есть страница на about us, наша пфай minimog 580. Туда мы применяли очень много всякого кода. Сейчас я хочу, чтобы ты его просканировал и сделал, оптимизировал его так, чтобы у меня ничего не поехало, но при этом, чтобы он стал последовательным и понятным.
/* === ABOUT: top hero image full-bleed (by block ID) === */
body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0{
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* убираем внутренние боковые отступы/контейнерные ограничения вокруг картинки */
body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0,
body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 .m-custom-content__block-inner,
body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 .m\:w-full{
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
}

/* картинка — адаптивно на всю ширину */
body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 responsive-image,
body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 img{
  width: 100% !important;
  display: block !important;
}
body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 img{
  height: auto !important;
}
/* ABOUT page: reduce space in page header above the hero image */
body.sf__page-about .m-page-header.m-page-header--template-page{
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}
/* Jewell Reef — About column system */
.jr-about-column {
  margin: 0 auto;
  width: min(100%, 920px);
  padding-left: 20px;
  padding-right: 20px;
}

/* Wide desktop */
@media (min-width: 1400px) {
  .jr-about-column {
    width: min(100%, 1090px);
  }
}

/* Laptop / normal desktop */
@media (min-width: 990px) and (max-width: 1399px) {
  .jr-about-column {
    width: min(100%, 920px);
  }
}

/* Mobile */
@media (max-width: 989px) {
  .jr-about-column {
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }
}
/* === ABOUT: Founder (image + text) — controls === */
body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ{
  --jr-gap: 44px;        /* расстояние МЕЖДУ фото и текстом */
  --jr-text-shift: 28px; /* доп. сдвиг текста вправо внутри колонки */
  --jr-text-max: 400px;  /* ширина текста */
}

@media (min-width: 990px){
  body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ .image-with-text > .m\:flex.m\:flex-wrap{
    flex-wrap: nowrap !important;
    column-gap: var(--jr-gap) !important;
  }

  body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ .content__box-image_with_text_Q8WaLQ{
    padding-left: var(--jr-text-shift) !important;
  }

  body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ .content__box-image_with_text_Q8WaLQ .m-richtext{
    max-width: var(--jr-text-max) !important;
  }
}

@media (max-width: 989px){
  body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ .content__box-image_with_text_Q8WaLQ{
    padding-left: 0 !important;
  }
  body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ .content__box-image_with_text_Q8WaLQ .m-richtext{
    max-width: 100% !important;
  }
}
/* === Title 2 lines (как у тебя было) === */
body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ h3.m-richtext__title.rte.h3{
  position: relative !important;
  color: transparent !important;
  user-select: none;
  min-height: 2.35em !important;
}

body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ h3.m-richtext__title.rte.h3::before,
body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ h3.m-richtext__title.rte.h3::after{
  position: absolute;
  left: 0;
  color: #111;
  font: inherit;
  white-space: nowrap;
}

body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ h3.m-richtext__title.rte.h3::before{ content: "A note"; top: 0; }
body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ h3.m-richtext__title.rte.h3::after{ content: "from the founder"; top: 1.12em; }

body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ .m-richtext__description p{ line-height: 1.55 !important; }
/* ABOUT — force black body text inside richtext descriptions */
body.sf__page-about .m-richtext__description,
body.sf__page-about .m-richtext__description p{
  color: #111 !important;
}
/* === ABOUT: spacing between sections (DESKTOP ONLY) === */
@media (min-width: 990px){

  /* 1) Воздух МЕЖДУ блоками внутри первого Custom content (Hero -> Our approach -> Founder -> Presence) */
  body.sf__page-about
  #shopify-section-template--26041740591445__custom-content
  .m-custom-content__wrapper{
    row-gap: 72px !important;   /* <-- тут крути воздух между секциями */
  }

  /* (опционально) если нужно чуть больше воздуха именно после Hero */
  body.sf__page-about
  #shopify-section-template--26041740591445__custom-content
  #m-custom__block--image_d5d2488-3c71-471f-bb75-dbccb6970cb0{
    margin-bottom: 0 !important; /* оставляем управление через row-gap */
  }

  /* 2) Воздух МЕЖДУ первой секцией (до Presence) и последним блоком (image+video) */
  body.sf__page-about
  #shopify-section-template--26041740591445__custom_content_yPmQBE{
    margin-top: 30px !important;  /* <-- воздух перед последним блоком */
  }
}/* === ABOUT: make ALL headings solid black (like "A note from the founder") === */
body.sf__page-about h1,
body.sf__page-about h2,
body.sf__page-about h3,
body.sf__page-about h4,
body.sf__page-about .m-richtext h1,
body.sf__page-about .m-richtext h2,
body.sf__page-about .m-richtext h3 {
  color: #111 !important;
}
/* ABOUT mobile — Hero image full-bleed + correct crop */
@media (max-width: 989px){
  body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0{
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  }

  body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 .m-custom-content__block-inner,
  body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 .m\:w-full{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* фикс “белой полосы”: responsive-image растягиваем и превращаем в контейнер-кроп */
  body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 responsive-image{
    display: block !important;
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    height: 220px !important; /* <-- высота hero на мобиле (можно 260/280) */
  }

  /* псевдоэлемент у них часто держит высоту — отключаем влияние */
  body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 responsive-image::before{
    content: none !important;
  }

  body.sf__page-about #m-custom__block--be5d2488-3c71-471f-bb75-dbccb6970cb0 responsive-image img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
  }
}
@media (max-width: 767px){
  body.sf__page-about .m-page-header.m-page-header--template-page{padding-top:12px!important;padding-bottom:12px!important;}
}
@media (max-width: 767px){
  body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ .img__box-image_with_text_Q8WaLQ{
    padding:0!important;
    width:calc(100% + 32px);
    margin:0 -16px;
  }

  body.sf__page-about #m-custom__block--image_with_text_Q8WaLQ .content__box-image_with_text_Q8WaLQ .m-richtext{
    box-sizing:border-box;
    padding-left:10px!important;
    padding-right:10px!important;
  }
}
@media (max-width: 767px){

  /* 1) Swap order: image first, then text */
  body.sf__page-about #m-custom__block--image_mq4piz{ order: 1; }
  body.sf__page-about #m-custom__block--text_PpLfnc{ order: 2; }

  /* 2) Full-bleed image (to the edges) */
  body.sf__page-about #m-custom__block--image_mq4piz{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.sf__page-about #m-custom__block--image_mq4piz .m-custom-content__block-inner{
    width: calc(100% + 32px);
    margin-left: -16px;
    margin-right: -16px;
  }

  /* optional but usually needed so it feels truly “edge-to-edge” */
  body.sf__page-about #m-custom__block--image_mq4piz .m\:blocks-radius,
  body.sf__page-about #m-custom__block--image_mq4piz img{
    border-radius: 0 !important;
  }
}
/* =========================
   ABOUT — CC2 (yPmQBE)
   Desktop column width + spacing + Mobile reorder/full-bleed
   ========================= */

/* DESKTOP: same column width as CC1 */
@media (min-width: 990px){
  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  .container-fluid{
    margin: 0 auto !important;
    width: min(100%, 920px) !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* DESKTOP: space between text row and tiles row */
  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  .m-custom-content__wrapper{
    row-gap: 72px !important;
  }
}

/* Wide desktop */
@media (min-width: 1400px){
  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  .container-fluid{
    width: min(100%, 1090px) !important;
  }
}

/* MOBILE: normal padding, video first + full-bleed, hide box image */
@media (max-width: 989px){

  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  .container-fluid{
    width: 100% !important;
    margin: 0 !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* hide box image */
  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  #m-custom__block--image_gUXmfM{
    display: none !important;
  }

  /* order: video first, then text */
  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  #m-custom__block--video_pjJNEN{ order: 1; }

  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  #m-custom__block--text_WRJ4jx{ order: 2; }

  /* full-bleed video */
  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  #m-custom__block--video_pjJNEN{
    margin-left: -16px !important;
    margin-right: -16px !important;
    width: calc(100% + 32px) !important;
    max-width: none !important;
  }

  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  #m-custom__block--video_pjJNEN .m-video__container{
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
  }

  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  #m-custom__block--video_pjJNEN .m\:blocks-radius{
    border-radius: 0 !important;
  }
}
/* CC2 — MOBILE: fix left/right padding for "In the making" text */
@media (max-width: 989px){
  body.sf__page-about
  #m-custom-template--26041740591445__custom_content_yPmQBE
  #m-custom__block--text_WRJ4jx .m-richtext{
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}
/* ABOUT page — mobile: reduce top padding for Custom content 2 (video section) */
@media (max-width: 767px) {
  #shopify-section-template--26041740591445__custom_content_yPmQBE
  .container-fluid.m-section-my.m-section-py.m-custom-content__container{
    padding-top: 16px !important; /* было 38px; можно 12/16/20 */
  }
}