/** Shopify CDN: Minification failed

Line 16:7 Expected identifier but found whitespace
Line 16:9 Unexpected "{"
Line 16:18 Expected ":"
Line 17:15 Expected identifier but found whitespace
Line 17:17 Unexpected "{"
Line 17:26 Expected ":"
Line 18:10 Expected identifier but found whitespace
Line 18:12 Unexpected "{"
Line 18:21 Expected ":"

**/
/* Variables y estilos scoped */
.matis-section{
  --bg: {{ section.settings.fondo }};
  --text-color: {{ section.settings.text_color }};
  --brand: {{ section.settings.brand_color }};
  --chakra-colors-brand-primary: var(--brand);
  --shadow: 0 12px 40px rgba(0,0,0,.2);

  background: var(--bg);
  color: var(--text-color);
  font: 16px "gira-sans",sans-serif;
  margin: auto;
  padding: 150px 40px 72px;
}

.features {
    display: flex
;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: center;
    width: 100%;
    max-width: 2000px;
    margin: auto;
}
.otr-f{
  transform: skew(-15deg);
  font-family: big-caslon-fb, serif;
  display:inline-block;
  font-style: italic;
  font-weight: 400;
  font-size: 2rem;
  margin-inline: 4px;
  line-height: 1;
}
.feature{
  flex:1 1 300px; display:flex; flex-direction:column;
  background:#fff; box-shadow:var(--shadow);
  border-radius:5px;
}
.media{position:relative; overflow:hidden; border-radius: 5px 5px 0px 0px;}
.media video{display:block; width:100%; height:auto; object-fit:cover;}
.content{padding:1rem 2rem 2rem; display:flex; flex-direction:column;}
.paragraph-wrapper{display:flex; margin-top:12px;}
.p-guion{
  width: 24px; height: 3px; background-color: var(--chakra-colors-brand-primary);
  flex-shrink: 0; margin-right: 12px; align-self:flex-start; margin-top:12px;
}
.h2-headding{font-size:28px; margin:.5rem 0; font-weight:700; line-height:20px;
  font-family:"gira-sans",sans-serif; color:var(--text-color)}
.section-parrafo{font-size:18px; color:var(--text-color); margin:0; display:flex; flex-direction:column;}

/* Hero-4 */
.hero-4{
  display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:center;
  width:100%;
  max-width: 2000px;
  margin: 5% auto;
}

.hero-video-container{position:relative; display:inline-block; width:100%; max-width:650px; margin: 0 auto;}
.hero-video-container video{width:100%; height:auto; border-radius:10px; display:block;}

.boton-video{
  position:absolute; top:50%; left:50%;
  transform:translate(-50%, -50%);
  cursor:pointer; transition:.3s;
  display:flex; align-items:center; justify-content:center;
}
.boton-video:hover{transform:translate(-50%, -50%) scale(1.1);}
.hero-copy{padding:20px; display:flex; flex-direction:column; justify-content:center;}
.hero-copy .paragraph-wrapper{display:flex; margin-top:12px; width:510px;}

/* Responsive */
@media(max-width:900px){
  .features{flex-direction:column; align-items:center;}
  .feature{width:90%; margin-bottom:20px;}
  .hero-4{display:flex; flex-direction:column; align-items:center; gap:30px; margin-top:50px;}
  .hero-copy{text-align:center; padding:10px;}
  .paragraph-wrapper{flex-direction:row; justify-content:center;}
  .matis-section{padding:20px 10px; max-width:100%;}
  .h2-headding{font-size:22px;}
  .section-parrafo{font-size:16px; text-align:left;}

.hero-copy .paragraph-wrapper{display:flex; margin-top:12px; width:100%;}

}