/** Shopify CDN: Minification failed

Line 698:20 Unexpected "{"
Line 698:29 Expected ":"
Line 713:18 Unexpected "{"
Line 713:27 Expected ":"
Line 713:33 Unexpected ","
Line 714:18 Unexpected "{"
Line 714:27 Expected ":"
Line 715:18 Unexpected "{"
Line 715:27 Expected ":"
Line 716:18 Unexpected "{"
... and 180 more hidden warnings

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:ctr-box-product (INDEX:33) */
.ctr-product-box {
    --color-primary: #275878;
    --color-primary-light: #5BADBD;
    --color-primary-dark: #124264;
    --color-secondary-dark: #242631;
    --color-secondary-light: #FCFAF8;
    --color-white: #FFF;
    --color-accent-green: #79AF36;

    --font-family: Inter, sans-serif;
    --section-gap: 32px;
    --section-radius: 8px;
    --bundle-gap: 16px;
    --container-width: 926px;
    --container-padding: 0 20px;
    --bundle-width: 686px;
    --transition: 0.1s ease;

    padding: 64px 0;
    font-family: var(--font-family);

    @media screen and (max-width: 768px) {
      --section-gap: 16px;
    }

    .ctr-product-box__container {
      max-width: var(--container-width);
      margin: 0 auto;
      padding: var(--container-padding);
      display: flex;
      flex-direction: column;
      gap: var(--section-gap);
    }

    .ctr-product-box__header {
      display: flex;
      flex-direction: column;
    }

    .ctr-product-box__subtitle {
      color: var(--color-primary-light);
      margin: 0 0 .5rem;
      font-size: 16px;
      font-weight: 400;
      letter-spacing: 1.6px;
      text-align: center;
      text-transform: uppercase;
    }

    .ctr-product-box__title {
      color: var(--color-primary-dark);
      font-size: 28px;
      font-weight: 400;      
      text-align: center;

      @media screen and (max-width: 768px) {
        font-size: 32px;
      }
    }
    .ctr-product-box__description,
    .ctr-product-box__description * {
      color: var(--color-primary-dark);
      font-size: 14px;
      line-height: 1.4;
      transition: all 5s;
    }

    .ctr-product-box__content {
      display: flex;
      flex-direction: column;
      gap: var(--section-gap);
    }

    .ctr-product-box__image-img {
      vertical-align: middle;
      width: 100%;
      height: auto;
    }
    .ctr-bundle {
      display: flex;
      flex-direction: column;
      gap: var(--bundle-gap);
      max-width: var(--bundle-width);
      width: 100%;
      margin: 0 auto;
    }

    .ctr-bundle__options {
      display: flex;
      justify-content: space-between;
      gap: var(--bundle-gap);

      &.m-otp-first {
        flex-direction: row-reverse;
      }

      @media screen and (max-width: 768px) {
        gap: 8px;
      }
    }
    .ctr-bundle__option {
      display: flex;
      align-items: center;
      gap: var(--section-gap);
      color: var(--color-primary);
      font-size: 18px;
      font-weight: 700;
      letter-spacing: 0.4px;
      border: 1px solid #D2D2D2;
      border-radius: var(--section-radius);
      width: 100%;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 16px;
      transition: all var(--transition);

      @media screen and (max-width: 768px) {
        font-size: 15px;
        padding: 16px 4px;

      }
    }

    .ctr-bundle__option.m-active,
    .ctr-bundle__option:hover {
      cursor: pointer;
      background: var(--color-primary);
      color: var(--color-white);
      border-color: var(--color-primary);
    }

    .ctr-bundle__option-input {
      display: none;
    }

    .ctr-bundle__items {
      display: flex;
      flex-direction: column;
      gap: var(--bundle-gap);
    }

    .ctr-bundle__item {
      display: grid;
      grid-template-columns: 24px 1fr 0.8fr;
      grid-template-areas: "header content footer";
      gap: var(--bundle-gap);
      padding: 20px;
      opacity: 0.4;
      color: var(--color-secondary-dark);
      border: 1px solid var(--color-primary);
      border-radius: var(--section-radius);
      background: var(--color-secondary-light);
      transition: opacity var(--transition);

      @media screen and (max-width: 768px) {
        padding: 16px;
        display: grid;
        column-gap: 16px;
        row-gap: 0;
        grid-template-areas:
        "header title title"
        "header price price"
        "header benefits benefits"
        "header footer-text footer-text";
      }

      &.m-active {
        .ctr-bundle__item-list {
          display: flex;
        }
      }
    }

    .ctr-bundle__item-header {
      display: flex;
      justify-content: center;
      align-items: center;
      grid-area: header;
    }
    .ctr-bundle__item-content {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 10px;

      @media screen and (max-width: 768px) {
        display: contents;
      }
    }

    .ctr-bundle__item-footer {
      display: flex;
      flex-direction: column;
      align-items: flex-end;

      @media screen and (max-width: 768px) {
        display: contents;
      }
    }

    .ctr-bundle__item.m-active,
    .ctr-bundle__item:hover {
      cursor: pointer;
      opacity: 1;
    }

    .ctr-bundle__item-input {
      position: relative;
      /* hiding browser el */
      appearance: none;
      /* Safari support */
      -webkit-appearance: none;

      &:after {
        content: '';
        position: absolute;
        width: 20px;
        height: 20px;
        top: 50%;
        left: 50%;
        border-radius: 50%;
        transform: translate(-50%, -50%);
        border: 1px solid var(--color-primary);
        z-index: 1;
      }
      &:before {
        content: '';
        position: absolute;
        width: 14px;
        height: 14px;
        top: 50%;
        left: 50%;
        border-radius: 50%;
        transform: translate(-50%, -50%);
        /* background: var(--color-primary); */
        background: transparent;
        z-index: 2;
      }

      &:checked {
        &:before {
          background: var(--color-primary);
        }
      }
    }

    .ctr-bundle__item-title {
      grid-area: title;
      font-size: 20px;
      font-weight: 700;
      letter-spacing: 0.4px;
      display: flex;
      align-items: center;
      gap: 8px;
      min-height: 30px;

      @media screen and (max-width: 768px) {
        display: block;
        font-size: 18px;
        margin-bottom: 5px;
        min-height: auto;

        .ctr-bundle__item-badge {
          display: none;
        }
      }
    }

    .ctr-bundle__item-benefits {
      grid-area: benefits;

      @media screen and (max-width: 768px) {
        margin-bottom: 10px;
      }
    }

    .ctr-bundle__item-badge {
      font-size: 16px;
      font-weight: 400;
      letter-spacing: 0.3px;
      color: var(--color-secondary-dark);
      white-space: nowrap;
      background: var(--color-primary);
      color: var(--color-white);
      padding: 4px 8px;
      border-radius: var(--section-radius);

      @media screen and (max-width: 768px) {
        font-size: 14px;
      }
    }

    .ctr-bundle__item-list {
      display: none;
      flex-direction: column;
      margin: 0;
      padding: 0;
      list-style: circle;

      li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 16px;
        font-weight: 400;
        letter-spacing: 0.3px;

        @media screen and (max-width: 768px) {
          font-size: 12px;
        }
      }
    }
    .ctr-bundle__item-footer-text-container {
      grid-area: footer-text;

      .ctr-bundle__item-badge {
        display: none;
      }

      @media screen and (max-width: 768px) {
        display: flex;
        gap: 16px;
        align-items: center;

        .ctr-bundle__item-badge {
          display: block;
        }
      }
    }
    .ctr-bundle__item-price {
      grid-area: price;
      display: flex;
      justify-content: flex-end;
      gap: 10px;
      font-size: 20px;
      font-weight: 700;
      letter-spacing: 0.4px;
      color: var(--color-secondary-dark);

      @media screen and (max-width: 768px) {
        font-size: 16px;
        justify-content: flex-start;
        margin-bottom: 5px;
      }
    }

    .ctr-bundle__item-price-new {}

    .ctr-bundle__item-price-old {
      font-weight: 400;
      text-decoration: line-through;
    }

    .ctr-bundle__item-footer-text {
      font-size: 16px;
      font-weight: 400;
      letter-spacing: 0.3px;
      color: var(--color-secondary-dark);

      @media screen and (max-width: 768px) {
        font-size: 14px;
      }

      &.m-transparent {
        opacity: 0;
        visibility: hidden;
      }
    }
    .ctr-bundle__footer {
      display: flex;
      flex-direction: column;
      gap: var(--bundle-gap);
    }

    .ctr-bundle__footer-text {
      font-size: 20px;
      font-weight: 700;
      color: var(--color-secondary-dark);
      letter-spacing: 0.4px;

      strong {
        color: var(--color-accent-green);
      }

      &.m-transparent {
        opacity: 0;
        visibility: hidden;
      }
    }

    .ctr-bundle__button {
      font-size: 20px;
      font-weight: 700;
      padding: 24px;
      color: var(--color-white);
      background: var(--color-primary);
      border-radius: var(--section-radius);
      letter-spacing: 0.4px;
      display: flex;
      justify-content: center;
      align-items: center;
      border: 1px solid var(--color-primary);
      outline: none;
      width: 100%;
      cursor: pointer;
      transition: all var(--transition);
      font-family: var(--font-family);

      @media screen and (max-width: 768px) {
        font-size: 20px;
        padding: 18px;
        border: 1px solid var(--color-primary);
      }
    }

    .ctr-bundle__button:hover {
      background: var(--color-primary-dark);
      border-color: var(--color-primary-dark);
    }

    .ctr-bundle__guarantees {
      display: flex;
      justify-content: space-between;
      gap: var(--bundle-gap);
      list-style: none;
      padding: 0;
      margin: 0;

      @media screen and (max-width: 768px) {
        gap: 16px;
      }
    }

    .ctr-bundle__guarantee {
      display: flex;
      flex-direction: column;
      gap: 8px;
      align-items: center;
      font-size: 16px;
      padding: 16px;
      color: var(--color-secondary-dark);
      font-weight: 500;
      letter-spacing: 0.3px;
      text-align: center;
      border: 2px solid var(--color-primary);
      border-radius: var(--section-radius);
      width: 100%;
      line-height: 1.4;

      @media screen and (max-width: 768px) {
        font-size: 12px;
        padding: 5px;
      }
    }
    .ctr-bundle__guarantee-icon {
      font-size: 18px;
  
      @media screen and (max-width: 768px) {
        font-size: 18px;
      }
    }

    .ctr-bundle__est-time {
      display: flex;
      flex-direction: column;
      gap: 16px;
      align-items: center;
      font-size: 20px;
      letter-spacing: 0.3px;
      width: 100%;

      @media screen and (max-width: 768px) {
        font-size: 18px;
      }
    }

    .ctr-bundle__est-time-text {
      font-weight: 700;
      color: var(--color-secondary-dark);
      background: #E4F0FE;
      padding: 20px;
      width: 100%;
      text-align: center;

    }

    .ctr-bundle__est-time-counter { 
      font-weight: 400;

      span {
        color: var(--color-accent-green);
      }
    }
  }
/* END_SECTION:ctr-box-product */

/* START_SECTION:kmd-pro-program (INDEX:137) */
.announcement-bar-section{display:none !important;}

.kmd-pro{
  --paper:#F4F0EA; --paper-2:#ECE6DC; --ink:#1C1815; --ink-soft:#5E564E;
  --line:#DAD3C8; --brand:#9A352E; --brand-deep:#6F231E;
  --cool-a:#D9E4EA; --cool-b:#E7E1EE;
  color:var(--ink); background:var(--paper);
  font-family:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
.kmd-pro *{box-sizing:border-box}
.kmd-pro img{max-width:100%; display:block; height:auto}

.kmd-pro .kmd-eyebrow{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--brand); margin:0 0 14px}
.kmd-pro .kmd-h1{font-family:"Newsreader",Georgia,serif; font-weight:500; letter-spacing:-.015em; line-height:1.04; font-size:clamp(30px,6vw,52px); margin:16px 0 0; text-wrap:balance}
.kmd-pro .kmd-h2{font-family:"Newsreader",Georgia,serif; font-weight:500; letter-spacing:-.01em; line-height:1.12; font-size:clamp(24px,4vw,36px); margin:0; text-wrap:balance}
.kmd-pro .kmd-lead{color:var(--ink-soft); font-size:clamp(16px,2.2vw,18px); margin:18px 0 0; max-width:60ch}
.kmd-wrap{padding:56px 22px; max-width:1200px; margin:0 auto}
.kmd-section + .kmd-section{border-top:1px solid var(--line)}
.kmd-alt{background:var(--paper-2)}
.kmd-headblock{max-width:56ch}
.kmd-pro .kmd-sub{color:var(--ink-soft); margin:14px 0 0; font-size:16px}

.kmd-pro .kmd-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer;
  font-family:"Hanken Grotesk",sans-serif; font-weight:600; font-size:15px; letter-spacing:.01em; line-height:1;
  border-radius:999px; padding:14px 24px; border:1px solid transparent; text-decoration:none; transition:transform .15s ease, background .15s ease}
.kmd-pro .kmd-btn:active{transform:translateY(1px)}
.kmd-pro .kmd-btn--primary{background:var(--brand); color:#fff; box-shadow:0 8px 18px -10px rgba(111,35,30,.8)}
.kmd-pro .kmd-btn--primary:hover{background:var(--brand-deep)}
.kmd-pro .kmd-btn--ghost{background:transparent; color:var(--ink); border-color:var(--line)}
.kmd-pro .kmd-btn--ghost:hover{border-color:var(--ink)}
.kmd-pro .kmd-btn--arrow::after{content:"→"; font-family:"IBM Plex Mono",monospace}

.kmd-hero{padding:48px 22px; max-width:1200px; margin:0 auto}
.kmd-hero-visual{margin-top:30px}
.kmd-hero-img{width:100%; border-radius:14px; border:1px solid var(--line); object-fit:cover}
.kmd-cta-row{display:flex; flex-direction:column; gap:12px; margin-top:26px}
.kmd-cta-row .kmd-btn{width:100%}
.kmd-trust{display:flex; flex-wrap:wrap; gap:8px; margin-top:28px; padding-top:22px; border-top:1px solid var(--line)}
.kmd-trust span{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-soft); border:1px solid var(--line); border-radius:6px; padding:6px 10px; background:var(--paper)}
.kmd-imgslot{position:relative; border-radius:14px; overflow:hidden; border:1px solid var(--line);
  background:linear-gradient(135deg,var(--cool-a),var(--cool-b)); min-height:220px; display:flex; align-items:flex-end}
.kmd-imgslot--tall{min-height:280px}
.kmd-imgslot .kmd-tag{font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase;
  color:#4a5560; background:rgba(255,255,255,.7); border:1px solid rgba(255,255,255,.9); border-radius:6px; padding:5px 9px; margin:14px}

.kmd-figure{margin:28px 0 0}
.kmd-figure-img{width:100%; border-radius:14px; border:1px solid var(--line); object-fit:cover; max-height:440px}
.kmd-figure-cap{font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.04em; color:var(--ink-soft); margin:11px 0 0}

.kmd-carousel-wrap{margin-top:28px}
.kmd-carousel{display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding:2px 0 8px; scrollbar-width:thin}
.kmd-carousel:focus-visible{outline:2px solid var(--brand); outline-offset:3px}
.kmd-carousel::-webkit-scrollbar{height:8px}
.kmd-carousel::-webkit-scrollbar-thumb{background:rgba(120,110,100,.35); border-radius:8px}
.kmd-carousel::-webkit-scrollbar-track{background:transparent}
.kmd-ba-item{flex:0 0 auto; width:min(340px,78vw); scroll-snap-align:start; margin:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--paper)}
.kmd-ba-item img{width:100%; height:auto}
.kmd-ba-ph{aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--cool-a),var(--cool-b));
  font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#4a5560}
.kmd-ba-cap{font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.06em; color:var(--ink-soft); padding:9px 12px; border-top:1px solid var(--line)}
.kmd-carousel-nav{display:flex; gap:10px; margin-top:14px}
.kmd-carousel-btn{width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:var(--paper); color:var(--ink);
  font-size:20px; line-height:1; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:border-color .15s, color .15s}
.kmd-carousel-btn:hover{border-color:var(--brand); color:var(--brand)}
.kmd-carousel-btn:focus-visible{outline:2px solid var(--brand); outline-offset:2px}

.kmd-disclaimer{font-family:"IBM Plex Mono",monospace; font-size:11px; color:var(--ink-soft); margin:20px 0 0}
.kmd-proofs{display:flex; flex-wrap:wrap; gap:10px; margin-top:22px}
.kmd-proof{display:inline-flex; align-items:center; gap:9px; font-size:14px; font-weight:500; color:var(--ink);
  border:1px solid var(--line); background:var(--paper); border-radius:999px; padding:10px 16px; text-decoration:none; transition:border-color .15s}
.kmd-proof:hover{border-color:var(--brand)}
.kmd-proof span{color:var(--brand); font-family:"IBM Plex Mono",monospace}

.kmd-founder-grid{display:grid; grid-template-columns:1fr; gap:24px; margin-top:8px}
.kmd-video{position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden;
  border-radius:14px; border:1px solid var(--line); background:linear-gradient(160deg,#241f1d,#3b3330); aspect-ratio:16/10; text-decoration:none}
.kmd-video--photo{aspect-ratio:4/5; background:var(--paper-2)}
.kmd-video-native{display:block; margin:0 auto; aspect-ratio:9/16; height:min(78vh,620px); width:auto; max-width:100%; object-fit:cover; border-radius:14px; border:1px solid var(--line); background:#000}

.kmd-vslides{position:relative}
.kmd-vslide[hidden]{display:none}
.kmd-vslide-cap{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.06em; color:var(--ink-soft); text-align:center; margin:12px 0 0}
.kmd-vdots{display:flex; gap:11px; justify-content:center; align-items:center; margin-top:18px}
.kmd-vdot{width:10px; height:10px; padding:0; border:0; border-radius:50%; background:var(--line); cursor:pointer; transition:background .15s ease, transform .15s ease}
.kmd-vdot:hover{background:var(--ink-soft)}
.kmd-vdot.is-active{background:var(--brand); transform:scale(1.2)}
.kmd-vdot:focus-visible{outline:2px solid var(--brand); outline-offset:3px}
.kmd-video-poster{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.kmd-play{position:relative; width:58px; height:58px; border-radius:50%; background:rgba(255,255,255,.94); display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 30px -8px rgba(0,0,0,.5)}
.kmd-play::before{content:""; border-left:16px solid var(--brand); border-top:10px solid transparent; border-bottom:10px solid transparent; margin-left:4px}
.kmd-vlabel{position:absolute; left:14px; bottom:14px; font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.1em;
  text-transform:uppercase; color:#fff; background:rgba(0,0,0,.4); padding:5px 9px; border-radius:6px}
.kmd-role{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); margin:10px 0 0}
.kmd-founder-bio{color:var(--ink-soft); margin:16px 0 0}
.kmd-founder-bio p{margin:0 0 12px}

.kmd-partner-body{max-width:64ch; margin:22px 0 0}
.kmd-partner-body p{color:var(--ink-soft); margin:0 0 16px; font-size:16px}
.kmd-partner-body p:last-child{margin-bottom:0}
.kmd-partner-body strong{color:var(--ink); font-weight:600}

.kmd-steps{display:grid; grid-template-columns:1fr; margin-top:26px; border:1px solid var(--line); border-radius:14px; overflow:hidden}
.kmd-step{display:flex; gap:16px; padding:22px; background:var(--paper)}
.kmd-step + .kmd-step{border-top:1px solid var(--line)}
.kmd-step-n{font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--brand); flex:0 0 auto; padding-top:3px}
.kmd-step-h{font-family:"Newsreader",serif; font-weight:500; font-size:20px; margin:0 0 5px}
.kmd-step-p{margin:0; color:var(--ink-soft); font-size:15px}
.kmd-cta-repeat{display:flex; flex-direction:column; gap:12px; align-items:center; margin-top:32px}
.kmd-cta-repeat .kmd-btn{width:100%; max-width:340px}

.kmd-questions{background:linear-gradient(150deg,var(--cool-a),var(--cool-b)); display:grid; grid-template-columns:1fr; overflow:hidden}
.kmd-questions-copy{padding:52px 22px}
.kmd-questions .kmd-h2{font-size:clamp(26px,5vw,38px)}
.kmd-questions-note{color:#41474d; margin:12px 0 0; max-width:46ch}
.kmd-questions-email{margin:20px 0 0; font-size:clamp(17px,2.4vw,21px); font-family:"Newsreader",serif; color:var(--ink)}
.kmd-questions-email a{color:var(--brand-deep); text-decoration:underline; text-underline-offset:3px}
.kmd-questions-photo{min-height:280px}
.kmd-questions-img{width:100%; height:100%; object-fit:cover}
.kmd-questions-photo .kmd-imgslot{height:100%; border:0; border-radius:0}

@media (min-width:768px){
  .kmd-wrap{padding:76px clamp(32px,6vw,72px)}
  .kmd-hero{padding:64px clamp(32px,6vw,72px) 72px; display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center}
  .kmd-hero-visual{margin-top:0}
  .kmd-hero-img{height:100%; max-height:560px}
  .kmd-imgslot{min-height:440px}
  .kmd-cta-row{flex-direction:row}
  .kmd-cta-row .kmd-btn{width:auto}
  .kmd-figure-img{max-height:480px}
  .kmd-founder-grid{grid-template-columns:1fr 1fr; gap:44px; align-items:center; margin-top:16px}
  .kmd-steps{grid-template-columns:repeat(3,1fr)}
  .kmd-step + .kmd-step{border-top:none; border-left:1px solid var(--line)}
  .kmd-cta-repeat{flex-direction:row; justify-content:center}
  .kmd-cta-repeat .kmd-btn{width:auto; max-width:none}
  .kmd-questions{grid-template-columns:1fr 1fr; align-items:stretch}
  .kmd-questions-copy{padding:72px clamp(32px,6vw,72px); align-self:center}
  .kmd-questions-photo{min-height:100%}
}
@media (prefers-reduced-motion:reduce){.kmd-pro *{transition:none!important; scroll-behavior:auto!important}}
/* END_SECTION:kmd-pro-program */

/* START_SECTION:pdp-box-product-ctr (INDEX:176) */
/* =========================================================
   CTR PDP Buy Box — cleaned + overflow-safe
   Key fix: ALL #shopify-section-{{ section.id }} rules are NOT nested
   ========================================================= */

/* Base variables + section shell */
.ctr-product-box{
  --color-primary: #275878;
  --color-primary-light: #5BADBD;
  --color-primary-dark: #124264;
  --color-secondary-dark: #242631;
  --color-secondary-light: #FCFAF8;
  --color-white: #FFF;
  --color-accent-green: #79AF36;

  --font-family: Inter, sans-serif;

  --section-gap: 32px;
  --section-radius: 8px;
  --bundle-gap: 16px;

  /* Defaults (overridden per-section below) */
  --container-width: 926px;
  --container-padding: 0 20px;
  --bundle-width: 686px;

  --transition: 0.1s ease;

  padding: 64px 0;
  font-family: var(--font-family);
}

@media (max-width: 749px){
  #shopify-section-{{ section.id }} .ctr-product-box{
    padding-top: 20px;   
    padding-bottom: 32px;
  }
}

@media screen and (max-width: 768px){
  .ctr-product-box{ --section-gap: 16px; }
}

/* =========================================================
   SECTION-SCOPED LAYOUT OVERRIDES (MUST NOT BE NESTED)
   ========================================================= */

/* 1) Make padding count toward width (prevents 430 + padding overflow) */
#shopify-section-{{ section.id }},
#shopify-section-{{ section.id }} *,
#shopify-section-{{ section.id }} *::before,
#shopify-section-{{ section.id }} *::after{
  box-sizing: border-box;
}

/* 2) Desktop sizing to match your current PDP */
#shopify-section-{{ section.id }} .ctr-product-box{
  --container-width: 1330px;     /* overall two-column section width */
  --container-padding: 0 20px;   /* gutters */
  --bundle-width: 100%;          /* IMPORTANT: stop buybox being artificially narrow */
}

/* 3) Mobile: match site gutters + prevent any bleed */
@media (max-width: 749px){
  #shopify-section-{{ section.id }} .ctr-product-box{
    --container-width: 100%;
    --container-padding: 0 16px;
    --bundle-width: 100%;
  }

  {% if template.suffix == 'pdp-buy-box-test' %}
  #shopify-section-{{ section.id }} .pdp-ctr-accordions.accordion {
    margin-top: -1.5rem !important;
  }
{% endif %}


  #shopify-section-{{ section.id }}{
    overflow-x: clip;
  }

  /* Allow children to shrink instead of forcing horizontal scroll */
  #shopify-section-{{ section.id }} .pdp-ctr-grid,
  #shopify-section-{{ section.id }} .pdp-ctr-grid__media,
  #shopify-section-{{ section.id }} .pdp-ctr-grid__buybox{
    min-width: 0;
  }

  #shopify-section-{{ section.id }} img{
    max-width: 100%;
    height: auto;
  }

  /* Prevent two 100%-width options / guarantees from overflowing */
  #shopify-section-{{ section.id }} .ctr-bundle__options,
  #shopify-section-{{ section.id }} .ctr-bundle__guarantees{
    flex-wrap: wrap;
  }

  #shopify-section-{{ section.id }} .ctr-bundle__option,
  #shopify-section-{{ section.id }} .ctr-bundle__guarantee{
    width: auto !important;
    flex: 1 1 calc(50% - 8px);
    min-width: 0;
  }
}

/* 4) Two-column proportions on desktop */
@media (min-width: 990px){
  #shopify-section-{{ section.id }} .pdp-ctr-grid{
    grid-template-columns: 53% 44%;
    column-gap: 50px;
    align-items: start;
  }
}



/* PDP standard header above "PREVENTION + TREATMENT" */
#shopify-section-{{ section.id }} .ctr-pdp-standard-header{
  margin-bottom: 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#shopify-section-{{ section.id }} .ctr-pdp-h1{
  margin: 0;
  line-height: 1.1;
}

#shopify-section-{{ section.id }} .ctr-pdp-standard-header {
  margin-top: 0; /* ensures header block isn't being pushed down */
}

#shopify-section-{{ section.id }} .ctr-pdp-h1{
  font-size: 2rem;
  font-weight: 500;
}

@media (min-width: 750px){
  #shopify-section-{{ section.id }} .ctr-pdp-h1{
    font-size: 3rem;
  }
}


#shopify-section-{{ section.id }} .ctr-pdp-reviews{
  margin: 0;
}

/* --- CTR PDP Buybox: keep page background white (prevent theme color-scheme bleed) --- */
#shopify-section-{{ section.id }},
#shopify-section-{{ section.id }} .ctr-product-box{
  background: #fff !important;
}

/* --- Frontrow: contain all blue styling inside the Frontrow box only --- */
#shopify-section-{{ section.id }} .ctr-pdp-frontrow{
  width: 100%;
  max-width: 520px;
  margin: 12px auto 18px;
}

#shopify-section-{{ section.id }} .ctr-frontrow-block{
  background: #F3FBFF;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 12px;
  padding: 18px 20px;
  overflow: hidden;
}

#shopify-section-{{ section.id }} .ctr-frontrow-block__inner{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Nuke any snippet-provided backgrounds/borders/shadows inside the Frontrow render */
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner *{
  box-shadow: none !important;
}
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner [style*="background"],
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner .gradient,
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner .color-background-1,
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner .color-background-2{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner [style*="border"],
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner .content-container,
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner .rte{
  border: 0 !important;
}

/* If the snippet wraps in page-width/content-container, neutralize spacing so our box is the only container */
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner .page-width,
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner .page-width--narrow,
#shopify-section-{{ section.id }} .ctr-frontrow-block__inner .content-container{
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  width: auto !important;
}

/* Icon row (3-up) */
#shopify-section-{{ section.id }} .ctr-pdp-icons{
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 0;
  margin: 18px 0 0;
  padding: 0;
}

#shopify-section-{{ section.id }} .ctr-pdp-icons .icon-with-text__item{
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 12px 18px;
}

#shopify-section-{{ section.id }} .ctr-pdp-icons .icon-with-text__item:not(:first-child){
  border-left: 1px solid rgba(39, 88, 120, .18);
}

#shopify-section-{{ section.id }} .ctr-pdp-icons .icon-with-text__icon{
  width: 24px !important;
  height: 24px !important;
  object-fit: contain;
  display: block;
}

#shopify-section-{{ section.id }} .ctr-pdp-icons .h4{
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.15;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-primary-dark);
}

@media (max-width: 749px){
  #shopify-section-{{ section.id }} .ctr-pdp-icons .icon-with-text__item{
    padding: 10px 12px;
  }
  #shopify-section-{{ section.id }} .ctr-pdp-icons .icon-with-text__icon{
    width: 24px !important;
    height: 24px !important;
  }
  #shopify-section-{{ section.id }} .ctr-pdp-icons .h4{
    font-size: 11px;
  }
}

#shopify-section-{{ section.id }} .ctr-pdp-standard-header,
#shopify-section-{{ section.id }} .ctr-pdp-standard-header *{
  max-width: 100%;
}
/* 5) Spacing: subtitle → title → description → purchase buttons */
#shopify-section-{{ section.id }} .ctr-product-box__subtitle{ margin-bottom: 10px; }
#shopify-section-{{ section.id }} .ctr-product-box__title{ margin-top: 0; margin-bottom: 14px; }

#shopify-section-{{ section.id }} .ctr-product-box__content p,
#shopify-section-{{ section.id }} .ctr-product-box__content .rte,
#shopify-section-{{ section.id }} .ctr-product-box__description{
  margin-top: 0;
  margin-bottom: 0;
}

#shopify-section-{{ section.id }} .pdp-ctr-accordions{
  margin-top: 10px; 
}

@media (max-width: 749px){
  #shopify-section-{{ section.id }} .pdp-ctr-accordions{
    margin-top: 10px;
  }
}


#shopify-section-{{ section.id }} [x-ref="purchaseTypes"],
#shopify-section-{{ section.id }} .ctr-product-box__purchase-types,
#shopify-section-{{ section.id }} .ctr-product-box__purchase-type{
  margin-top: 18px;
}

/* =========================================================
   Core component styles (your existing structure)
   ========================================================= */

.ctr-product-box__container{
  max-width: var(--container-width);
  margin: 0 auto;
  padding: var(--container-padding);
  display: flex;
  flex-direction: column;
  gap: var(--section-gap);
}

.ctr-product-box__header{
  display: flex;
  flex-direction: column;
}

.ctr-product-box__subtitle{
  color: var(--color-primary-light);
  margin: 0 0 .5rem;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 1.6px;
  text-align: center;
  text-transform: uppercase;
}

.ctr-product-box__title{
  color: var(--color-primary-dark);
  font-size: 28px;
  font-weight: 400;
  text-align: center;
}

@media screen and (max-width: 768px){
  .ctr-product-box__title{ font-size: 32px; }
}

.ctr-product-box__description,
.ctr-product-box__description *{
  color: var(--color-primary-dark);
  font-size: 14px;
  line-height: 1.4;
}

.ctr-product-box__content{
  display: flex;
  flex-direction: column;
  gap: var(--section-gap);
}

.ctr-product-box__image-img{
  vertical-align: middle;
  width: 100%;
  height: auto;
}

/* Bundle */
.ctr-bundle{
  display: flex;
  flex-direction: column;
  gap: var(--bundle-gap);
  max-width: var(--bundle-width);
  width: 100%;
  margin: 0 auto;
}

.ctr-bundle__options{
  display: flex;
  justify-content: space-between;
  gap: var(--bundle-gap);
}

.ctr-bundle__options.m-otp-first{ flex-direction: row-reverse; }

@media screen and (max-width: 768px){
  .ctr-bundle__options{ gap: 8px; }
}

.ctr-bundle__option{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--section-gap);
  color: var(--color-primary);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.4px;
  border: 1px solid #D2D2D2;
  border-radius: var(--section-radius);
  width: 100%;
  text-align: center;
  padding: 16px;
  transition: all var(--transition);
}

@media screen and (max-width: 768px){
  .ctr-bundle__option{
    font-size: 15px;
    padding: 16px 4px;
  }
}

.ctr-bundle__option.m-active,
.ctr-bundle__option:hover{
  cursor: pointer;
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}

.ctr-bundle__option-input{ display: none; }

.ctr-bundle__items{
  display: flex;
  flex-direction: column;
  gap: var(--bundle-gap);
}

/* Keep the rest of your bundle/item styling as-is below this point.
   (No overflow-specific changes needed there.) */


/* =========================================================
   PDP gallery layout (left column)
   ========================================================= */

.pdp-ctr-grid{
  display: grid;
  gap: var(--section-gap);
}

/* Hero + thumbs */
.pdp-ctr-hero{
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--section-radius);
}

/* NEW: ensure video/media fills hero area like the image */
#shopify-section-{{ section.id }} .pdp-ctr-hero-media > *{
  width: 100%;
  max-width: 100%;
  border-radius: var(--section-radius);
  display: block;
}
#shopify-section-{{ section.id }} .pdp-ctr-hero-media video{
  width: 100%;
  height: auto;
  display: block;
}

#shopify-section-{{ section.id }} .pdp-ctr-thumbs{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  gap: 10px;
  overflow: visible;          /* stop horizontal scroll behavior */
  padding-bottom: 0;
  margin-top: 12px;
}

/* Make each thumb consistent, and avoid stretching */
#shopify-section-{{ section.id }} .pdp-ctr-thumb{
  flex: 0 0 55px;             /* fixed width */
  width: 55px;
  height: 55px;
  position: relative;
}

/* NEW: video badge */
#shopify-section-{{ section.id }} .pdp-ctr-thumb__video-badge{
  position: absolute;
  right: 6px;
  bottom: 6px;
  font-size: 12px;
  line-height: 1;
  background: rgba(0,0,0,.65);
  color: #fff;
  padding: 4px 6px;
  border-radius: 999px;
}

@media (max-width: 749px){
  #shopify-section-{{ section.id }} .pdp-ctr-thumbs{
    max-width: 360px;         /* tweak: 320–380 */
    margin-left: auto;
    margin-right: auto;
  }
}

.pdp-ctr-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Hide the old in-buybox image (since gallery is now left column) */
.pdp-ctr-grid__buybox .ctr-product-box__image{
  display: none;
}
/* --- Mobile overflow fix: force media column to shrink to viewport --- */
@media (max-width: 749px){
  #shopify-section-{{ section.id }} .pdp-ctr-grid{
    grid-template-columns: 1fr !important; /* ensure single column */
    width: 100%;
    max-width: 100%;
  }

  #shopify-section-{{ section.id }} .pdp-ctr-grid__media,
  #shopify-section-{{ section.id }} .pdp-ctr-grid__buybox{
    min-width: 0 !important;   /* CRITICAL for grid shrink */
    max-width: 100% !important;
    width: 100% !important;
    overflow: hidden;          /* belt + suspenders */
  }

  #shopify-section-{{ section.id }} .pdp-ctr-grid__media img,
  #shopify-section-{{ section.id }} .pdp-ctr-grid__media picture,
  #shopify-section-{{ section.id }} .pdp-ctr-grid__media svg{
    display: block;
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
  }
}


#shopify-section-{{ section.id }} .pdp-ctr-accordions .accordion__title{
  font-size: 2rem;
}

/* summary layout */
#shopify-section-{{ section.id }} .pdp-ctr-accordions summary.accordion__summary{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
}

/* blue chip behind caret */
#shopify-section-{{ section.id }} .pdp-ctr-accordions .icon-collapse{
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(95, 171, 192, 0.2);
  border-radius: 8px;
  flex: 0 0 36px;
}

/* rotate caret when open */
#shopify-section-{{ section.id }} .pdp-ctr-accordions .icon-caret{
  transition: transform 150ms ease;
  transform-origin: 50% 50%;
}

#shopify-section-{{ section.id }} .pdp-ctr-accordions details[open] .icon-caret{
  transform: rotate(180deg);
}

/* Make the caret chip a true square + dead-center contents */
#shopify-section-{{ section.id }} .pdp-ctr-accordions .icon-collapse{
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  padding: 0;
  line-height: 0;
  flex: 0 0 auto;
}

/* Center the SVG box and remove baseline behavior */
#shopify-section-{{ section.id }} .pdp-ctr-accordions .icon-collapse svg{
  display: block;
  width: 10px;
  height: 6px;
  margin: 0;
  transform: translate(1px, -1px); /* right, up */
}

/* =========================================================
   Mobile: gallery arrows + thumbnail suppression + accordion caret sizing
   (Layout reordering is handled by the script below for maximum browser reliability.)
   ========================================================= */

/* Hero wrap is the positioning context for arrows */
#shopify-section-{{ section.id }} .pdp-ctr-hero-wrap{
  position: relative;
}

/* Default: arrows hidden (desktop uses thumbs) */
#shopify-section-{{ section.id }} .pdp-ctr-arrow{
  display: none;
}



  /* Overlay arrows on mobile */
  #shopify-section-{{ section.id }} .pdp-ctr-arrow{
    display: inline-flex !important;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(0,0,0,.12);
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-size: 26px;
    padding: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  #shopify-section-{{ section.id }} .pdp-ctr-arrow--prev{ left: 10px; }
  #shopify-section-{{ section.id }} .pdp-ctr-arrow--next{ right: 10px; }

  /* Kill any theme-provided chevron so only our chip + caret shows */
  #shopify-section-{{ section.id }} .pdp-ctr-accordions summary.accordion__summary::after{
    content: none !important;
  }
  #shopify-section-{{ section.id }} .pdp-ctr-accordions summary.accordion__summary::-webkit-details-marker{
    display: none !important;
  }

  /* Accordion caret chip: smaller + dead-centered */
  #shopify-section-{{ section.id }} .pdp-ctr-accordions summary.accordion__summary .icon-collapse{
    width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    line-height: 0 !important;
    border-radius: 8px !important;
    background: rgba(95, 171, 192, 0.2) !important;
  }
  /* Force true visual centering (some themes offset SVG baseline) */
  #shopify-section-{{ section.id }} .pdp-ctr-accordions summary.accordion__summary .icon-collapse{
    position: relative !important;
  }
  #shopify-section-{{ section.id }} .pdp-ctr-accordions summary.accordion__summary .icon-collapse svg{
    display: block !important;
    width: 10px !important;
    height: 6px !important;
    margin: 0 !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
  }
  #shopify-section-{{ section.id }} .pdp-ctr-accordions details[open] summary.accordion__summary .icon-collapse svg{
    transform: translate(-50%, -50%) rotate(180deg) !important;
  }
  /* Neutralize earlier rotate rule that would otherwise overwrite translate() */
  #shopify-section-{{ section.id }} .pdp-ctr-accordions .icon-caret{
    transform: none !important;
  }
}

.ctr-complementary {
  display: block;
  min-height: 1px; /* key: ensures IntersectionObserver can intersect */
}

.ctr-complementary__placeholder {
  height: 1px;
  width: 100%;
}
/* END_SECTION:pdp-box-product-ctr */