/** Shopify CDN: Minification failed

Line 717:33 The "+" operator only works if there is whitespace on both sides

**/

/* Importación de fuentes */
@font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
  }
  
  /* Tipos italic */
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-ExtraLightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-SemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-ExtraBoldItalic.ttf') format('truetype');
    font-weight: 800;
    font-style: italic;
  }
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
  }
  
  @font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/static/Roboto-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
  }@font-face {
    font-family: 'Oswald';
    src: url('./font/Oswald/static/Oswald-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
  }
  @font-face {
    font-family: 'Oswald';
    src: url('./font/Oswald/static/Oswald-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
  }
  @font-face {
    font-family: 'Oswald';
    src: url('./font/Oswald/static/Oswald-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
  }
  @font-face {
    font-family: 'Oswald';
    src: url('./font/Oswald/static/Oswald-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
  }
  @font-face {
    font-family: 'Oswald';
    src: url('./font/Oswald/static/Oswald-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
  }
  @font-face {
    font-family: 'Oswald';
    src: url('./font/Oswald/static/Oswald-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
  }

  /* Definición de variables CSS */
    :root {
        --page-width: 970px;
        --margin-layout: 3.2rem;

        /* font*/
        --font-body-family: 'Roboto', sans-serif;
        --body-font-style: normal;
        --body-font-weight: 400;
        --body-font-size: 16;
        --font-heading-family:'Oswald', sans-serif;
        --heading-font-style: normal;
        --heading-font-weight: 700;
        --hxl-size:  5.6rem;
        --h0-size: 4.8rem;
        --h1-size: 4rem;
        --h2-size: 3.2rem;
        --h3-size: 2rem;
        --h4-size: 1.6rem;
        --h5-size: 1.2rem;
        --h6-size: 1rem;
        --heading-color: 0 0 0;
        --text-color: 42 43 42;
        --text-color-og: 42 43 42;
        --link-color: 42 43 42;
        /* color */
        --color-primary:#0085CA;
        --bg-color: 255 255 255 / 1.0;
        --bg-color-light:#F8F8F8;
        --bg-color-og: 255 255 255 / 1.0;
        --color-surface:#f7f7f7;
        --color-accent-2:#FFB71B;
        --color-success:#108043;
        --color-danger:#C60E0E;
        --color-warning:#DD5A00;
        --color-subdued:#666666;
        /* border */
        --color-border-dark:#d0d0d0;
        --color-border-light:#f0f0f0;
        /* botones */
        --btn-bg-color: 0 133 202;
        --btn-bg-hover-color: 46 159 217;
        --btn-text-color: 255 255 255;
        --btn-bg-color-og: 0 133 202;
        --btn-text-color-og: 255 255 255;
        --btn-alt-bg-color: 255 255 255;
        --btn-alt-bg-alpha: 1.0;
        --btn-alt-text-color: 0 133 202;
        --btn-border-width: 1px;
        --btn-padding-y: 12px;
        --btn-lg-border-radius: 50%;
        --btn-icon-border-radius: 50%;
        /* link */
        /* input*/
        --input-with-btn-inner-radius: var(--btn-border-radius);
        --input-bg-color: 255 255 255 / 1.0;
        --input-text-color: 42 43 42;
        --input-border-width: 1px;
        --input-border-radius: 0px;
        --textarea-border-radius: 0px;
        --input-bg-color-diff-3: #f7f7f7;
        --input-bg-color-diff-6: #f0f0f0;
    }
    
  
  /* Aplicación de fuentes */

  html, body {
    height: auto;
    min-height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
  }

.page-width {
        max-width: var(--page-width);
    margin: 0 auto;
    padding: 0 var(--margin-layout);
}
@media screen and (max-width: 600px) {
    .page-width {
        padding: 0 1rem;
    }
}

  body {
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    grid-template-columns: 100%;
    min-height: 100%;
    margin: 0;
    font-size: var(--font-body-size);
    letter-spacing: 0;
    line-height: calc(var(--line-height) / var(--font-body-scale));
    font-family: var(--font-body-family);
    font-style: var(--font-body-style);
    font-weight: var(--font-body-weight);
  }

  .section-group > div{
    background: var(--bg-color-light) ;
    margin: 0;
  }


/* texto*/
        .text-end{
            text-align: end;
        }
        .text-center{
            text-align: center;
        }
        .text-right{
            text-align: right;
        }
        .text-body {
            font-size: var(--font-body-size);
            letter-spacing: var(--letter-spacing);
            line-height: calc(var(--line-height) / var(--font-body-scale));
            font-family: var(--font-body-family);
            font-style: var(--font-body-style);
            font-weight: var(--font-body-weight);
        }
        
        h1,
        h2,
        h3,
        h4,
        h5,
        .h0,
        .h1,
        .h2,
        .h3,
        .h4,
        .h5,
        .hxl {
            font-family: var(--font-body-family);
            font-style: var(--font-heading-style);
            font-weight: var(--heading-font-weight);
            letter-spacing: var(--heading-letter-spacing);
            color: rgb(var(--color-foreground));
            line-height: calc(var(--heading-line-height) / max(1, var(--font-heading-scale)));
            word-break: break-word;
            margin-bottom: 1.6rem;
            &:first-child {
            margin-top: 0;
            }
        }
        
        .hxl {
            font-size: var(--hxl-size);
        }
        
        .h0 {
            font-size: var(--h0-size);
        }
        
        h1,
        .h1 {
            font-size: var(--h1-size);
        }
        
        h2,
        .h2 {
            font-size: var(--h2-size);
        }
        
        h3,
        .h3 {
            font-size: var(--h3-size);
        }
        
        h4,
        .h4 {
            font-family: var(--font-heading-family);
            font-style: var(--font-heading-style);
            font-size: var(--h4-size);
        }
        
        h5,
        .h5 {
            font-size: var(--h5-size);
        }
        
        h6,
        .h6 {
            font-size: var(--h6-size);
            color: rgba(var(--color-foreground), 1);
            margin-top: 0;
            margin-bottom: 0;
            font-weight: bold;
        }
         /* tablet : dos columnas */
         @media (max-width: 900px) {
            h3,
            .h3 {
                font-size: var(--h4-size);
            }
          }
          
          /* Móviles: 1 columna */
          @media (max-width: 600px) {
            h3,
            .h3 {
                font-size: var(--h4-size);

            }
          }
          .bg-transparente{
            background-color: transparent !important;
          }
          .bg-white{
            background-color: white !important;
          }


/* botones */
        button {
            margin: 0;
            padding: 0;
            border: 0;
            border-radius: 0;
            background: none;
            font-family: inherit;
            font-size: 1em;
            text-decoration: none;
            text-shadow: none;
            cursor: pointer;
        }
        .btn {
            display: inline-block;
            position: relative;
            max-width: 100%;
            padding: var(--btn-padding-y, 12px) 26px;
            transition: opacity .6s ease, color .6s ease, background-position .4s ease-out;
            border-radius: var(--btn-border-radius, 0);
            outline-offset: var(--btn-border-width);
            font-size: .88em;
            font-weight: 700;
            line-height: 1.2em;
            text-align: center;
            text-transform: var(--btn-text-transform, none);
            -webkit-appearance: none;
            appearance: none;
            word-break: break-word;
        }
        .btn--primary{
            border: var(--btn-border-width) solid rgb(var(--btn-bg-color));
            outline-color: rgb(var(--btn-bg-color));
            outline-offset: 3px;
            background: rgb(var(--btn-bg-hover-color)) linear-gradient(104deg, rgb(var(--btn-bg-hover-color)) 60%, rgb(var(--btn-bg-color)) 60% 100%) no-repeat 100% 100%;
            background-size: 300% 100%;
            color: rgb(var(--btn-text-color));
        }
        .btn--primary:hover{
            background-position: 0 100%;
        }
        .btn{
            width: 100%;
            height: 46;
            gap: 3px;
            border-radius: 30px;
            padding: 10px;
        }
        .section__footer .btn, .home-hero  .btn{
            width: calc(100%/4);
        }
        button[disabled]{
            color: white;
            background: #B8B8B8;
            border: transparent;
        }

/* fondo */
        .custom-main {
            /* position: relative; */
            min-height: 100vh;
            overflow-y: auto;
        }
         .section-group{
          width: 100%;
            /*
            max-width: var(--page-width);
            
            margin: 0 auto;
            padding: 0 var(--margin-layout);
            */
            z-index: 999;
            overflow: visible;
        }
        
        .main-content {
            position: relative;
            z-index: 2; 
            padding: 3rem;
        }
        
        
        .background {
            position: absolute;
            z-index: 1;
            background-repeat: no-repeat;
            background-size: contain;
            pointer-events: none;
        }
        
        /* fondo1 (regla a la izquierda) */
        .fondo1 {
            top: -3%;
            left: 27px;
            width: 32%;
            height: 40%;
            background-image: url('/cdn/shop/files/mb-fondo2.png?v=1747297793');
        }
        
        /* fondo2 (camisa abajo a la derecha) */
        .fondo2 {
            bottom: 0;
            right: 0;
            width: 17%;
            height: 36%;
            background-image: url('/cdn/shop/files/mb-fondo1.png?v=1747297651');
        }
                
        /* fondo3 (camisa inicio debajo) */
        .fondo3 {
            bottom: -6%;
            left: 24%;
            width: 22%;
            height: 26%;
            background-image: url('/cdn/shop/files/mb-fondo1.png?v=1747297651');
        }
        
        /* fondo2 (camisa abajo a la derecha) */
        .fondo4 {
            top: 10%;
            width: 32%;
            height: 46%;
            background-image: url('/cdn/shop/files/mb-algodon.jpg?v=1747298121');
        }
        .fondo5 {
            top: 0;
            right: 0;
            width: 31%;
            height: 37%;
            background-image: url('/cdn/shop/files/mb-hilos.jpg?v=1747298588');
        }
        .fondo6 {
            bottom: -31%;
            right: 12%;
            width: 41%;
            height: 65%;
            background-image: url('/cdn/shop/files/mb-home-MODERNA.jpg?v=1747298476');
        }
        .fondo7 {
            top: 2%;
            left: 16%;
            width: 24%;
            height: 14%;
        }


/* section general */
        .section__header{
            padding: 2rem;
        }
        .section__header .header-logo{
            display: grid !important; 
            grid-template-columns: 15fr 1fr !important;
        }
        @media (max-width: 600px) {
            .section__header .header-logo{
                display: grid !important; 
                grid-template-columns: 1fr 1fr !important;
            }
          }
        .section__arrow{
            display: flex;
                justify-content: space-between;
                flex-direction: row;
                align-items: center;
        }
        .section__arrow span{
            color: var(--color-primary);
        }
        .header-logo span{
            display: flex;
            padding-left: 3rem;
            flex-direction: column;
            justify-content: center
        }
        .btn-close{
            display: flex;
            padding: 0 !important;
            justify-content: end;
            align-items: end;
        }

        .section__content-color{
            display: flex;
            flex-direction: column;
            gap: 25px;
        }
        .section__footer, .section__footer div {
            padding: 2rem 0;
            width: 100%;
            display: flex;
            flex-wrap: wrap;
            flex-direction: column;
            align-content: center;
            align-items: center;
            justify-content: center;
        }

        .section__footer small{
            display: flex;
            flex-direction: row;
            align-items: center;
        }
        .section__footer small span{
            padding: .5rem
        }
        .section-group {
            position: relative; /* o absolute si lo necesitas */
            z-index: 1;
          }
          /* .section-group {
            margin-top: 10%;
          } */
  

/* FIN --- section general */

/* ----- section_1_color  y   section_2_color  ------ */
    
    .my-subtitle{
        margin: 0 27px;
    }

    /* Grid de colores */
    .gid-10 {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
        gap: 10px;
        margin-bottom: 1.5rem;
    }
    
    /* Cada bloque de color */
    .color-box {
        width: 60px;
        height: 60px;
        border: 1px solid #ccc;
        border-radius: 4px;
        cursor: pointer;
        transition: transform 0.2s ease;
    }
    
    .color-box:hover {
        transform: scale(1.05);
        border-color: #000;
    }
    .color-box .select-color-box{
        width: 100%;
        height: 100%;
        background: #0085CA66;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    
    /* Inputs para hex/pantone */
    .color-inputs {
        display: flex;
        gap: 1rem;
        margin-bottom: 1.2rem;
        flex-wrap: wrap;
        align-items: center;
    }

    
    .color-inputs input {
        flex: 1;
        min-width: 220px;
        padding: 0.6rem;
        border: 1px solid #000;
        font-size: 0.95rem;
    }
    
    /* Enlace para añadir color */
    .add-color a {
        font-weight: bold;
        font-size: 0.9rem;
        text-decoration: none;
        color: #000;
        transition: color 0.2s ease;
        font-weight: 700;
        font-size: 13px;
        line-height: 114.99999999999999%;
        letter-spacing: 0%;
        text-decoration: underline;
        text-decoration-style: solid;
        text-decoration-offset: 0%;
        text-decoration-thickness: 0%;
    }
    
    .add-color a:hover {
        color: #555;
    }
    .mt-4 {
        margin-top: 4rem;
    }
    .pt-4 {
        padding-top: 4rem;
    }
  /* input */
        .color-inputs{
            margin: 0 27px;
        }
        .color-inputs .field-group {
            width: calc(100% / 3);
            min-width: 316px;
        }
        @media screen and (max-width: 749px) {
            .color-inputs .field-group {
                width: 100%;
            }
        }

        .select, .field {
            display: flex;
            position: relative;
            width: 100%;
            transition: box-shadow var(--duration-short) ease;
        }
        .field-group {
            display: flex;
            flex-direction: column;
            flex-wrap: wrap;
            gap: .8rem;
        }
        .field__input, .select__select {
            -webkit-appearance: none;
            appearance: none;
            background-color: rgb(var(--field-background));
            color: rgb(var(--field-foreground));
            font-size: var(--field-control-fs, 1.6rem);
            font-family: var(--font-body-family);
            font-style: var(--font-body-style);
            font-weight: var(--font-body-weight);
            line-height: var(--field-line-height);
            width: 100%;
            box-sizing: border-box;
            transition: box-shadow var(--duration-short) ease;
            border-radius: var(--inputs-radius);
            min-width: calc(7rem +(var(--inputs-border-width)* 2));
            position: relative;
            border: 0;
            text-align: left;
            padding: var(--field-padding-vertical) var(--field-padding-horizontal);
        }

        .field__button {
            top: 0;
            height: 100%;
            z-index: 2;
            align-items: center;
            background-color: transparent;
            border: 0;
            color: var(--color-foreground);
            cursor: pointer;
            display: flex;
            justify-content: center;
            overflow: hidden;
            padding: 0;
            position: absolute;
            right: 0;
            top: 0;
            padding: 0 .5rem;
        }
        @media screen and (max-width: 600px) {
            .color-inputs {
                margin: 0 1rem;
            }
            .color-inputs input{
                min-width: auto;
            }
            .color-inputs .field-group {
                min-width: 100%;
            }
            
        }

/* ----- FIN  section_1_color  y   section_2_color  ------ */
/* ------ section_imagen_proyectar ---------- */
.style-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    padding: 2rem 1rem;
    background-color: #f8f8f8;
  }
  #section_datos_contacto .style-gallery{
    grid-template-columns: repeat(2, 1fr);
  }
  .style-gallery-4 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));;
    gap: 1.5rem;
    padding: 2rem 1rem;
    background-color: #f8f8f8;
  }
  
  .style-card {
    background: white;
    border: 3px solid transparent;
    padding: 0.5rem;
    text-align: center;
    transition: border 0.3s ease;
    height: fit-content;
  }
  
  .style-card-img {
    min-height: 20rem;
    width: 100%;
    height: 100%;
    object-fit: cover; /* llena el espacio sin deformar */
    flex-grow: 1;
  }
 .style-gallery-4 .style-card-img {
    min-height: 10rem;
    width: 100%;
    height: 100%;
    object-fit: cover; /* llena el espacio sin deformar */
    flex-grow: 1;
  }
  
  .style-label {
    font-family: var(--font-heading-style);
    font-weight: 700;
    font-size: 1.2rem;
    margin-top: 0.5rem;
    color: black;
    background: transparent;
    text-transform: uppercase;
  }
  .style-card-img{
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100%;
    position: relative;
  }

  /* Tarjeta activa con borde azul */
  .style-card:hover {
    border-color: #1e73be; /* azul */
  }
  .style-card .style-card-img .style-card-active{
    display: none;
    position: absolute;
    inset: 0; /* top: 0; right: 0; bottom: 0; left: 0 */
    background-color: #0087ca59; /* azul transparente */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
  }   
  .style-card .style-card-img.active .style-card-active{
    display: flex;
  }

/* Tablets: 2 columnas */
@media (max-width: 900px) {
    .style-card-img {
        min-height: 14rem;
        overflow: hidden; /* corta el contenido que sobrepasa */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
      }
    .style-gallery {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  
  /* Móviles: 1 columna */
  @media (max-width: 600px) {
    .style-gallery-4 {
        gap: .5rem;
    }
    .style-card-img{
        min-height: 10rem;
        overflow: hidden; /* corta el contenido que sobrepasa */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
      }
    .style-gallery {
      grid-template-columns: 1fr;
    }
  }

  /* ------ FIN section_imagen_proyectar ---------- */

  /* inicio  */

  .home-hero {
    display: flex;
    gap: 4rem;
    align-items: center;
    justify-content: center;
  }
  
  .hero-content {
    max-width: 787px;
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    padding: 2rem;
  }
  
  .hero-subtitle {
    color: var(--color-primary);
    font-weight: bold;
    font-size: var(--h5-size);
    margin-bottom: 0;
  }
  
  .hero-title {
    font-size: var(--h1-size);
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .hero-description {
    font-size: 1rem;
    line-height: 1.5;
    color: rgb(var(--text-color));
  }
  .custom-main .section-group {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 90vh; /* ajusta si necesitas más o menos altura */
    padding: 0;
        margin-top: 2%;
  }

    /* tablet : dos columnas */
  @media screen and (max-width: 900px) {
    .hero-images {
      flex-direction: row;
      flex-wrap: wrap;
    }
            /* fondo3 (camisa inicio debajo) */
            .fondo3 {
                bottom: 0;
                left: 0;
                width: 42%;
                height: 24%;
            }
            
            /* fondo2 (camisa abajo a la derecha) */
            .fondo4 {
                top: -4%;
                width: 35%;
                height: 22%;
            }
            .fondo5 {
                top: 0;
                right: 0;
                width: 48%;
                height: 37%;
            }
            .fondo6 {
                bottom: 0;
                right: 0;
                width: 45%;
                height: 26%;
            }
            .fondo7 {
                        top: 0%;
        left: 0;
        width: 40%;
        height: 21%;
                background-image: url('/cdn/shop/files/mb-fondo2.png?v=1747297793') !important;
            }
    
  
  }
  
    /* Móviles: 1 columna */
    @media (max-width: 600px) {
        .hero-title {
            font-size: 40px;
        }
    }

    /* botonoes mobile*/
            /* tablet : dos columnas */
        @media (max-width: 900px) {
            .btn {
                width: calc(100% / 2);
            }
          }
          
          /* Móviles: 1 columna */
          @media (max-width: 600px) {
            .btn, .section__footer small {
                width: 80% !important;
                margin: .3rem;
            }
            .custom-main .section-group{
                padding: 0;
            }
          }

      #moodboard-content {
      display: none;
    }
    .section__content {
      display: none;
    }
    .section__content.active {
      display: grid;
    }
    #moodboard-fin{
      display: none;
    }
    .style-checkbox{
      display: none;
    }
    .select-color-box{
      opacity: 0;
    }
    .style-checkbox:checked + .select-color-box {
        opacity: 1;
    }
    .style-card-active{
      opacity: 0;
    }
    .style-checkbox:checked + .style-card-img .style-card-active{
      opacity: 1;
    }
    .disabled {
      opacity: 0.5;
    }
    #moodboard-content .section-group > div{
        width: auto;
        padding: 2rem;
        max-width: var(--page-width);
    }

  .style-gallery input {
    flex: 1;
    min-width: 220px;
    padding: 0.6rem;
    border: 1px solid #000;
    font-size: 0.95rem;
    }
    #PolicePrivacy input{
      min-width: auto !important;
    }

    @media (max-width: 900px) {
      .section-group > div {
          margin: 0;
      }
      #moodboard-content .section-group > div {
        width: auto;
        margin: 0 1rem;
      }
      .btn, .section__footer small {
        width: 100% !important;
        margin: .3rem;
      }
      .custom-main .section-group {
        padding: 0;
        margin: 2rem 0;
      }

    }
      #moodboard-content .section-group .section__footer{
        padding: 0 2rem;
        margin-bottom: 8rem;
        
      }
       #moodboard-content .section-group .section__footer > div{
          padding-top: 0;
       }
       div#PolicePrivacy {
           padding: 2rem 1rem;
       }

        #section_1_color-primary .color-box .select-color-box,
       #section_2_color-primary .color-box .select-color-box
       {
         background-color: transparent !important;
       }
      #section_1_color-primary .color-box .color-icon,
      #section_2_color-primary .color-box .color-icon
      {
        width: 50% !important;
        height: 50%;
        border-radius: 34px;
        height: 50% !important;
        background: #21b3ff !important;
       }
       
       .style-card .style-label{ 
    hyphens: auto; overflow-wrap: break-word; word-break: normal; }

    .section-group .home-hero.bg-white{ background-color: transparent !important;}