@charset "UTF-8";
/*------------------------------------*\
  Estilos theme 
  2026
  Autor: Aguayo
\*------------------------------------*/
/**
* Base HTML: 16px
* @nuclide Variables
* @section Settings > Font size
*/
/**
* Font family: 'Uncut Sans'
* @nuclide Variables
* @section Settings > Font family
*/
/**
* Font family: 'Alfredino Tuttocurvy'
* @nuclide Variables
* @section Settings > Font family
*/
/**
* Font family: 'Uncut Sans Variable'
* @nuclide Variables
* @section Settings > Font family
*/
/**
* font-weight: light | Font family: Uncut Sans, Uncut Sans Variable
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Regular | Font family: Uncut Sans, Alfredino Tuttocurvy, Uncut Sans Variable
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Medium | Font family: Uncut Sans, Uncut Sans Variable
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Semi-bold | Font family: Uncut Sans, Uncut Sans Variable
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Bold | Font family: Uncut Sans, Uncut Sans Variable
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Italic
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* Unidad mínima la retícula digital es 8, 
* el sistema de reticula se basa en incrementos verticales y horizontales de 8 píxeles.
* Uso: multiplicar la variable por el número del incremento deseado. Ejemplo: $gutter * 2
* @nuclide Variables
* @section Settings > Gutter 
*/
/**
* $canvas-with: Ancho del canvas en porcentajes
* @nuclide Variables
* @section Settings > Canvas
*/
/**
* Small
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* small-m
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* medium
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* wide
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* large
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* big
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* huge
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* $c-white
* @color Blanco neutro
* @section Neutro
*/
/**
* $c-dark
* @color Negro oscuro
* @section Dark
*/
/**
* $c-beige
* @color Beige
* @section Neutro
*/
/**
* $c-gray-100
* @color Gris
* @section Gray Scale
*/
/**
* $c-gray-300
* @color Gris
* @section Neutro
*/
/**
* $c-gray-500
* @color Gris
* @section Gray Scale
*/
/**
* $c-gray-600
* @color Gris
* @section Gray Scale
*/
/**
* $c-gray-700
* @color Gris
* @section Gray Scale
*/
/**
* $c-gray-900
* @color Gris
* @section Gray Scale
*/
/**
* $c-primary-purple
* @color
* @section Primary
*/
/**
* $c-primary-yellow
* @color
* @section Primary
*/
/**
* $c-primary-green
* @color
* @section Primary
*/
/**
* $c-primary-pink
* @color
* @section Primary
*/
/**
* $c-primary-blue
* @color
* @section Primary
*/
/**
* $c-error
* @color Color de error
* @section Status
*/
/**
* $c-succes
* @color Color de éxito
* @section Status
*/
/**
* $c-default-text
* @color Color por defecto para texto
* @section Default
*/
/**
 * Convertir valor de (px) a (rem) de cualquier propiedad, agrega fallback en px para navegadores antiguos.
 *
 * @mixin
 * @section Utils
 * @param $property Propiedad css, ej. margin, max-width, etc..
 * @param $values Valor en px
 * @example
 *  .foo {
 *    @include px-to-rem(padding, 20px 10px);
 *  }
 */
/**
 * Incluye Font-family propiedades fuente de iconos para pseudo elementos.
 * @mixin
 * @section Utils
 * @param $font-family Variable Font-family
 * @example
 *  .foo {
 *		Propiedades...
 *		&:before {
 *    	@include font-family-ico($font-family-ico);
 *		}
 *  }
 */
/**
 * Full query: Mediaquerys predefinidos, para el proyecto.
 * Disponibles para 10 screen sizes diferentes.
 * Para modificarlos, editar las variables definidas en los breakpoints.
 *
 * @mixin
 * @section Utils
 * @param $breakpoint-value
 *    ♣ Breakpoint min-width  
 *      small: 375px | small-m: 480px | medium: 768px | wide: 1024px | big: 1280px | huge: 1440px | large: 1180px 
 *    ♣ Breakpoint max-width  
 *      medium-max: 0 - 767px  |  wide-max  : 0 - 1023px  |  large-max : 0 - 1179px
 *
 * @example
 *  || small: breakpoint min-width: 375px --> $bp-small
 *     @include media-query(small) {
 *       PROPERTIES...
 *     }
 *  || small-m: breakpoint min-width 540px --> $bp-small-m
 *     @include media-query(small-m) {
 *        PROPERTIES...
 *     }
 *  || medium: breakpoint min-width 768px --> $bp-medium
 *     @include media-query(medium) {
 *        PROPERTIES...
 *     }
 *  || medium-max: breakpoint max-width 0 - 767px
 *     @include media-query(medium-max) {
 *        PROPERTIES...
 *     }
 *  || wide: breakpoint min-width 1024px --> $bp-wide
 *     @include media-query(wide) {
 *        PROPERTIES...
 *     }
 *  || wide-max: breakpoint max-width 0 - 1023px
 *     @include media-query(wide-max) {
 *        PROPERTIES...
 *     }
 *  || large: breakpoint min-width 1180px --> $bp-large
 *     @include media-query(large) {
 *        PROPERTIES...
 *     }
 *  || huge: breakpoint min-width 1440px --> $bp-huge
 *     @include media-query(huge) {
 *        PROPERTIES...
 *     } 
 *  || large-max: breakpoint max-width 0 - 1179px
 *     @include media-query(large-max) {
 *        PROPERTIES...
 *     }
 *  || big: breakpoint min-width 1280px --> $bp-big
 *     @include media-query(big) {
 *        PROPERTIES...
 *     }
 */
/**
 * Helper para insertar fácilmente mediaquery a un selector específico.
 *
 * @mixin
 * @section Helpers
 * @param $breakpoint-value
 *    ♣ Breakpoint min-width  
 *    【 small: 375px | small-m: 480px | medium: 768px | wide: 1024px | big: 1280px | huge: 1440px | large: 1180px 】 
 *    ♣ Breakpoint max-width
 *    【 medium-max: 0 - 767px  |  wide-max  : 0 - 1023px  |  large-max : 0 - 1179px 】
 * @example
 *  .foo {
 *    PROPERTIES...
 *    @include media-query-help(small) {
 *      PROPERTIES...
 *    }
 *  }
 *  || Variables
 *  ♣ small     : breakpoint min-width 375px
 *  ♣ medium    : breakpoint min-width 768px
 *  ♣ medium-max: breakpoint max-width 0 - 767px
 *  ♣ wide      : breakpoint min-width 1024px
 *  ♣ wide-max  : breakpoint max-width 0 - 1023px
 *  ♣ large     : breakpoint min-width 1180px
 *  ♣ huge      : breakpoint min-width 1440px
 *  ♣ large-max : breakpoint max-width 0 - 1179px
 *  ♣ big       : breakpoint min-width 1280px
 */
.u-hidden {
  display: none !important; }

.u-display-block {
  display: block !important; }

.u-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
  border: 0; }

.o-border-bottom {
  border-bottom: 2px solid #000; }

.o-border-top {
  border-top: 2px solid #000; }

.o-border-top_1 {
  border-top: 1px solid #000; }

.o-border-all {
  border: 2px solid #000; }

.u-font-bold {
  font-weight: 700; }

.u-margin-top-8 {
  margin-top: 8px;
  margin-top: 0.5rem; }

.u-margin-top-24 {
  margin-top: 24px;
  margin-top: 1.5rem; }

.u-margin-bottom-24 {
  margin-bottom: 24px;
  margin-bottom: 1.5rem; }

.u-flex-center-y {
  display: flex;
  align-items: center; }

.u-flex-center-x {
  display: flex;
  justify-content: center; }

.u-flex-center-both {
  display: flex;
  align-items: center;
  justify-content: center; }

/**
* Desktop | VP: min-width 1024px
*/
@media only screen and (min-width: 1024px) {
  .u-position-sticky-dk {
    position: sticky;
    top: 120px; } }

body,
h1, h2, h3, h4, h5, h6,
dl, dd, ol, ul {
  margin: 0;
  padding: 0; }

html {
  font-size: 16px;
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body * {
  box-sizing: border-box; }

article,
aside,
footer,
header,
nav,
section {
  display: block; }

h1 {
  font-size: 2em; }

figcaption,
figure,
main {
  display: block; }

figure,
p {
  margin: 0; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects; }
  a:active, a:hover {
    outline-width: 0; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted; }

abbr[title],
dfn[title] {
  cursor: help; }

b,
strong {
  font-weight: inherit;
  font-weight: bolder; }

code,
pre,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

dfn {
  font-style: italic; }

mark {
  background-color: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

blockquote {
  margin: 0; }

audio,
video {
  display: inline-block;
  vertical-align: baseline; }

audio:not([controls]) {
  display: none;
  height: 0; }

img {
  border-style: none;
  vertical-align: bottom;
  max-width: 100%;
  height: auto; }

svg:not(:root) {
  overflow: hidden; }

input {
  line-height: normal; }

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  font-size: 100%;
  line-height: 1.15;
  margin: 0; }

button,
input {
  overflow: visible; }

button,
select {
  text-transform: none; }

button {
  background-color: transparent; }

optgroup {
  font-weight: bold; }

button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

fieldset {
  margin: 0 2px;
  padding: 0.35em 0.75em 0.625em; }

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
  border: 0; }

progress {
  display: inline-block;
  vertical-align: baseline; }

textarea {
  overflow: auto; }

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td, th {
  padding: 0; }

details,
menu {
  display: block; }

summary {
  display: list-item; }

canvas {
  display: inline-block; }

template {
  display: none; }

[hidden] {
  display: none; }

/**
 * Tipografía títulares
 *
 * **Alfredino Tuttocurvy** es una fuente utilizada
 * para títulos especiales o elementos destacados.
 *
 * Uso recomendado:
 * - títulos
 * - frases destacadas
 * - componentes editoriales
 *
 * Uso NO recomendado:
 * - textos largos
 * - contenido funcional
 *
 * Pesos disponibles:
 * - Regular (400)
 *
 *
 */
@font-face {
  font-family: "Alfredino Tuttocurvy";
  src: url("../fonts/alfredino/alfredino-tuttocurvy.woff2") format("woff2"), url("../fonts/alfredino/alfredino-tuttocurvy.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap; }

/**
 * Tipografía base
 *
 * La fuente principal del sistema es **Uncut Sans**.
 *
 * Se utiliza para:
 * - textos corridos
 * - componentes UI
 *
 * Pesos disponibles:
 * - Light (300)
 * - Regular / Book (400)
 * - Medium (500)
 * - Semibold (600)
 * - Bold (700)
 *
 * Soporta variantes:
 * - Normal
 * - Italic
 *
 */
@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-Light.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-LightItalic.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-Book.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-Book.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-BookItalic.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-BookItalic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-Regular.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-RegularItalic.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-RegularItalic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-Medium.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-MediumItalic.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-MediumItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-Semibold.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-Semibold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-SemiboldItalic.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-SemiboldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-Bold.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: "Uncut Sans";
  src: url("../fonts/uncut-sans/UncutSans-BoldItalic.woff2") format("woff2"), url("../fonts/uncut-sans/UncutSans-BoldItalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap; }

/**
 * Tipografía variable
 *
 * **Uncut Sans Variable** se incluye como alternativa moderna
 * para proyectos que requieran control fino de pesos tipográficos.
 *
 * Rango de pesos:
 * - 300 a 700
 *
 * Uso recomendado:
 *
 *
 */
@font-face {
  font-family: "Uncut Sans Variable";
  src: url("../fonts/uncut-sans/UncutSans-Variable.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap; }

/**
 * Iconografía
 *
 * Sistema de iconos basado en **Tabler Icons**.
 *
 * Los iconos se implementan como una **fuente web (webfont)** y se renderizan
 * mediante pseudo-elementos (`::before` y `::after`).
 *
 * Convenciones:
 * - Prefijo de clase: `i-`
 * - Uso principal: iconos decorativos
 * - El contenido del icono se define mediante variables SCSS (`$i-*`)
 *
 * Ejemplo:
 * <span class="i-chevron-down"></span>
 *
 * Fuente:
 * Tabler Icons — https://tabler.io/icons
 *
 * Styleguide Foundations.Iconography
 */
@font-face {
  font-family: "ico-tabler-icons";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/tabler-icons.eot?qqnr5");
  src: url("../fonts/tabler-icons.eot?#iefix") format("embedded-opentype"), url("../fonts/tabler-icons.woff2?qqnr5") format("woff2"), url("../fonts/tabler-icons.woff?qqnr5") format("woff"), url("../fonts/tabler-icons.ttf?qqnr5") format("truetype"); }

.i-::before,
[class^="i-"]::before,
[class*=" i-"]::before,
.o-ico::before {
  font-family: "ico-tabler-icons";
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  speak: never;
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.i-after-::after,
[class^="i-after-"]::after,
[class*="i-after-"]::after {
  font-family: "ico-tabler-icons";
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  speak: never;
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

/**
 * @icon .i-arrow-back
 * @markup
 *   <span class="i-arrow-back"></span>
 */
.i-arrow-back::before {
  content: ""; }

/**
 * @icon .i-chevron-down
 * @markup
 *   <span class="i-chevron-down"></span>
 */
.i-chevron-down::before {
  content: ""; }

/**
 * @icon .i-after-chevron-down
 * @markup
 *   <span class="i-after-chevron-down"></span>
 */
.i-after-chevron-down::after {
  content: ""; }

/**
 * @icon .i-after-chevron-up
 * @markup
 *   <span class="i-after-chevron-up"></span>
 */
.i-after-chevron-up::after {
  content: ""; }

/**
 * @icon .i-chevron-up
 * @markup
 *   <span class="i-chevron-up"></span>
 */
.i-chevron-up::before {
  content: ""; }

/**
 * @icon .i-chevron-left
 * @markup
 *   <span class="i-chevron-left"></span>
 */
.i-chevron-left::before {
  content: ""; }

/**
 * @icon .i-chevron-right
 * @markup
 *   <span class="i-chevron-right"></span>
 */
.i-chevron-right::before {
  content: ""; }

/**
 * @icon .i-after-chevron-right
 * @markup
 *   <span class="i-after-chevron-right"></span>
 */
.i-after-chevron-right::after {
  content: ""; }

/**
 * @icon .i-arrow-narrow-left
 * @markup
 *   <span class="i-arrow-narrow-left"></span>
 */
.i-arrow-narrow-left::before {
  content: ""; }

/**
 * @icon .i-arrow-narrow-right
 * @markup
 *   <span class="i-arrow-narrow-right"></span>
 */
.i-arrow-narrow-right::before {
  content: ""; }

/**
 * @icon .i-after-arrow-narrow-right
 * @markup
 *   <span class="i-after-arrow-narrow-right"></span>
 */
.i-after-arrow-narrow-right::after {
  content: ""; }

/**
 * @icon .i-volume-3
 * @markup
 *   <span class="i-volume-3"></span>
 */
.i-volume-3::before {
  content: ""; }

/**
 * @icon .i-volume
 * @markup
 *   <span class="i-volume"></span>
 */
.i-volume::before {
  content: ""; }

/**
 * @icon .i-player-pause
 * @markup
 *   <span class="i-player-pause"></span>
 */
.i-player-pause::before {
  content: ""; }

/**
 * @icon .i-player-play
 * @markup
 *   <span class="i-player-play"></span>
 */
.i-player-play::before {
  content: ""; }

/**
 * @icon .i-brand-whatsapp
 * @markup
 *   <span class="i-brand-whatsapp"></span>
 */
.i-brand-whatsapp::before {
  content: ""; }

/**
 * @icon .i-brand-instagram
 * @markup
 *   <span class="i-brand-instagram"></span>
 */
.i-brand-instagram::before {
  content: ""; }

/**
 * @icon .i-brand-facebook
 * @markup
 *   <span class="i-brand-facebook"></span>
 */
.i-brand-facebook::before {
  content: ""; }

/**
 * @icon .i-brand-youtube
 * @markup
 *   <span class="i-brand-youtube"></span>
 */
.i-brand-youtube::before {
  content: ""; }

/**
 * @icon .i-brand-linkedin
 * @markup
 *   <span class="i-brand-linkedin"></span>
 */
.i-brand-linkedin::before {
  content: ""; }

/**
 * @icon .i-brand-behance
 * @markup
 *   <span class="i-brand-behance"></span>
 */
.i-brand-behance::before {
  content: ""; }

/**
 * @icon .i-brand-twitter
 * @markup
 *   <span class="i-brand-twitter"></span>
 */
.i-brand-twitter::before {
  content: "ﰏ"; }

/**
 * @icon .i-email
 * @markup
 *   <span class="i-email"></span>
 */
.i-email::before {
  content: ""; }

/**
 * @icon .i-brand-tiktok
 * @markup
 *   <span class="i-brand-tiktok"></span>
 */
.i-brand-tiktok::before {
  content: ""; }

/**
 * @icon .i-world
 * @markup
 *   <span class="i-world"></span>
 */
.i-world::before {
  content: ""; }

/**
 * @icon .i-after-world
 * @markup
 *   <span class="i-after-world"></span>
 */
.i-after-world::after {
  content: ""; }

/**
 * @icon .i-menu-2
 * @markup
 *   <span class="i-menu-2"></span>
 */
.i-menu-2::before {
  content: ""; }

/**
 * @icon .i-map-pin
 * @markup
 *   <span class="i-map-pin"></span>
 */
.i-map-pin::before {
  content: ""; }

/**
 * @icon .i-clock
 * @markup
 *   <span class="i-clock"></span>
 */
.i-clock::before {
  content: ""; }

/**
 * @icon .i-calendar
 * @markup
 *   <span class="i-calendar"></span>
 */
.i-calendar::before {
  content: ""; }

/**
 * @icon .i-quote
 * @markup
 *   <span class="i-quote"></span>
 */
.i-quote::before {
  content: ""; }

/**
 * @icon .i-x
 * @markup
 *   <span class="i-x"></span>
 */
.i-x::before {
  content: ""; }

/**
 * @icon .i-adjustments-horizontal
 * @markup
 *   <span class="i-adjustments-horizontal"></span>
 */
.i-adjustments-horizontal::before {
  content: ""; }

/**
 * @icon .i-after-adjustments-horizontal
 * @markup
 *   <span class="i-after-adjustments-horizontal"></span>
 */
.i-after-adjustments-horizontal::after {
  content: ""; }

/**
 * @icon .i-trash
 * @markup
 *   <span class="i-trash"></span>
 */
.i-trash::before {
  content: ""; }

/**
 * @icon .i-after-trash
 * @markup
 *   <span class="i-after-trash"></span>
 */
.i-after-trash::after {
  content: ""; }

/**
 * @icon .i-check
 * @markup
 *   <span class="i-check"></span>
 */
.i-check::before {
  content: ""; }

/**
 * @icon .i-after-check
 * @markup
 *   <span class="i-after-check"></span>
 */
.i-after-check::after {
  content: ""; }

/**
 * @icon .i-circle-check
 * @markup
 *   <span class="i-circle-check"></span>
 */
.i-circle-check::before {
  content: ""; }

/**
 * @icon .i-alert-hexagon
 * @markup
 *   <span class="i-alert-hexagon"></span>
 */
.i-alert-hexagon::before {
  content: ""; }

html {
  scroll-padding-top: 75px;
  scroll-padding-top: 4.6875rem;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch; }

.o-canvas {
  width: 90%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  transition: all ease-in 0.2s; }

.o-canvas_small {
  max-width: 720px; }

@media only screen and (min-width: 768px) {
  html {
    scroll-padding-top: 117px;
    scroll-padding-top: 7.3125rem; } }

/**
 * Class: o-text | <body> | <p>
 * @description  
 * Estilos tipográficos por defecto aplicados al body.  
 * Usa la fuente INTL Headline Regular, asegurando legibilidad y consistencia entre dispositivos.  
 *  
 * ♣ Propiedades:
 * - Mobile: 16px | 1.4 | Uncut Sans 
 * - Desktop: 18px | 1.5 | Uncut Sans 
 *
 * @atom Body copy
 * @section 01. Estilos textos
 *
 * @markup
 * <p>Este es el texto por defecto del sistema tipográfico.</p>
 */
body,
.o-text {
  font-family: "Uncut Sans", sans-serif;
  font-weight: 400;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.4;
  color: #000;
  letter-spacing: normal; }

/* Desktop */
@media (min-width: 768px) {
  body,
  .o-text {
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 1.5; } }

i,
em,
.o-italic {
  font-style: italic; }

.o-center {
  text-align: center; }

.o-right {
  text-align: right; }

/**
* Class: Tag HTML | <u>
* @description  Representa texto que no está articulado y tiene un estilo diferente al texto normal, como palabras mal escritas o nombres propios.
*  ♣ Propiedades: underline-position under
* @atom Texto subrayado
* @section 01. Estilos textos
* @markup
*  <p class="o-text">
*	  Ad ea velit nisi aliquip <u>nostrud laboris laborum</u> aliquip laborum.
*  </p>
*/
u,
.o-underline {
  text-underline-position: under; }

.o-uppercase {
  text-transform: uppercase; }

/**
* Class: .o-bold | <strong>, <b>
* @description  define estilo negrilla para el texto.
*  ♣ Propiedades: 700
* @atom Texto negrilla
* @section 01. Estilos textos
* @markup
*  <p class="o-text">
*	  Ad ea velit nisi <span class="o-bold">aliquip nostrud laboris</span> laborum aliquip laborum.
*  </p>
*  <p class="o-text">
*	  <strong>Ad ea velit nisi aliquip nostrud laboris laborum aliquip laborum</strong>
*  </p>
*/
b,
strong,
.o-bold {
  font-weight: 700; }

/**
 * @section Titles
 * @description  
 * Define los estilos tipográficos por defecto aplicados a elementos semánticos HTML: h1–h5.  
 *  
 * ♣ Font families:
 * - "INTL Headline" para títulos
 *
 * @responsive
 * - Mobile (<768px)
 * - Desktop (≥768px)
 *
 * @markup
 * <h1 class="o-title_xl">H1 – INTL Headline Medium</h1>
 * <h2 class="o-title_lg">H2 – INTL Headline Medium</h2>
 * <h3 class="o-title_md">H3 – INTL Headline Medium</h3>
 * <h4 class="o-title_sm">H4 – INTL Headline Medium</h4>
 * <h5 class="o-title_xs">H5 – INTL Headline Medium</h5>
 * <h6 class="o-title_xxs">H6 – INTL Headline Medium</h6>
 */
/* ***********************
   Headlines (h1–h6)
***************************/
/* --- Mobile --- */
h1,
h2,
h3,
h4,
h5 {
  font-family: "Alfredino Tuttocurvy", sans-serif;
  color: #000;
  letter-spacing: normal;
  line-height: 1.2;
  font-weight: 400; }

.o-title_xl {
  font-size: 40px;
  font-size: 2.5rem; }

.o-title_lg {
  font-size: 36px;
  font-size: 2.25rem; }

.o-title_md {
  font-size: 32px;
  font-size: 2rem; }

.o-title_sm {
  font-size: 28px;
  font-size: 1.75rem; }

.o-title_xs {
  font-size: 24px;
  font-size: 1.5rem; }

.o-title_xxs {
  font-size: 24px;
  font-size: 1.5rem; }

.o-title_w640 {
  max-width: 640px;
  max-width: 40rem; }

.o-hgroup {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 16px;
  row-gap: 1rem;
  padding-top: 40px;
  padding-top: 2.5rem;
  padding-bottom: 40px;
  padding-bottom: 2.5rem; }

.o-hgroup_small {
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem; }

/* --- Desktop --- */
@media (min-width: 768px) {
  .o-title_xl {
    font-size: 80px;
    font-size: 5rem; }
  .o-title_lg {
    font-size: 56px;
    font-size: 3.5rem; }
  .o-title_md {
    font-size: 48px;
    font-size: 3rem; }
  .o-title_sm {
    font-size: 40px;
    font-size: 2.5rem; }
  .o-title_xs {
    font-size: 32px;
    font-size: 2rem; }
  .o-title_xxs {
    font-size: 28px;
    font-size: 1.75rem; } }

/**
 * Body text
 *
 * Sistema de tamaños para texto corrido (body).
 *
 * Las clases `o-body_*` definen el tamaño del texto
 * según el breakpoint:
 *
 * - Mobile (default)
 * - Desktop (≥ 767px)
 *
 * Ejemplo:
 * <p class="o-body_m">
 *   Texto base del sistema
 * </p>
 *
 * Notas:
 * - Estas clases solo controlan el `font-size`
 *
 */
.o-body_xl {
  font-size: 20px;
  font-size: 1.25rem; }

.o-body_l {
  font-size: 18px;
  font-size: 1.125rem; }

.o-body_m {
  font-size: 16px;
  font-size: 1rem; }

.o-body_s {
  font-size: 14px;
  font-size: 0.875rem; }

.o-body_xs {
  font-size: 12px;
  font-size: 0.75rem; }

@media (min-width: 767px) {
  .o-body_xl {
    font-size: 24px;
    font-size: 1.5rem; }
  .o-body_l {
    font-size: 20px;
    font-size: 1.25rem; }
  .o-body_m {
    font-size: 18px;
    font-size: 1.125rem; }
  .o-body_s {
    font-size: 16px;
    font-size: 1rem; }
  .o-body_xs {
    font-size: 14px;
    font-size: 0.875rem; } }

*:focus {
  outline: 0; }

button {
  padding: 0;
  line-height: inherit;
  font-family: "Uncut Sans", sans-serif;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  outline: none;
  outline-width: 0;
  border: none;
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition: all 0.6s; }
  button:focus {
    outline-width: 0; }
  button:disabled {
    cursor: default; }

/**
 * Class: o-btn
 * @atom Botón base
 * @section 03. Botones
 * @description
 *
 *  Este es el botón principal y sirve como base para variaciones como:
 *   - `.o-btn_secondary`: botón principal.
 *
 * @markup
 *  <button class="o-btn" type="button">
 *    Botón base
 *  </button>
 */
.o-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 4px;
  column-gap: 0.25rem;
  width: fit-content;
  border-radius: 8px;
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-top: 10px;
  padding-top: 0.625rem;
  padding-bottom: 10px;
  padding-bottom: 0.625rem;
  border-top: 2px solid #000;
  border-bottom: 4px solid #000;
  border-right: 4px solid #000;
  border-left: 2px solid #000;
  color: #000;
  background-color: #fff;
  font-weight: 400;
  font-size: 16px;
  font-size: 1rem;
  font-family: "Alfredino Tuttocurvy", sans-serif;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.1;
  cursor: pointer;
  transition: 0.3s; }
  .o-btn:hover, .o-btn:focus, .o-btn:active {
    box-shadow: inset 23em 0 0 0 #000;
    color: #fff; }
    .o-btn:hover::before, .o-btn:hover::after, .o-btn:focus::before, .o-btn:focus::after, .o-btn:active::before, .o-btn:active::after {
      color: #fff; }
  .o-btn:disabled {
    color: #CECFD1;
    border: 2px solid #CECFD1;
    background-color: #F3F3F4;
    pointer-events: none; }

/**
 * Class: o-btn_secondary
 * @atom Botón secundario
 * @section 03. Botones
 *
 * @markup
 *  <button class="o-btn o-btn_secondary" type="button">
 *    Botón Secundario
 *  </button>
 */
.o-btn_secondary {
  border: 2px solid #000;
  background-color: transparent; }
  .o-btn_secondary:disabled {
    background-color: transparent; }

/**
 * Class: o-btn_tertiary
 * @atom Botón Terciario
 * @section 03. Botones
 *
 * @markup
 *  <button class="o-btn o-btn_tertiary" type="button">
 *    Botón Terciario
 *  </button>
 */
.o-btn_tertiary:hover, .o-btn_tertiary:focus, .o-btn_tertiary:active {
  border: 2px solid #000;
  background-color: transparent;
  box-shadow: none; }

.o-btn_tertiary:disabled {
  color: #CECFD1;
  border: 2px solid #CECFD1;
  background-color: transparent;
  pointer-events: none; }

/**
 * Class: o-btn_w100
 * @atom Botón ancho
 * @section 03. Botones
 *
 * @markup
 *  <button class="o-btn o-btn_w100" type="button">
 *    Botón ancho
 *  </button>
 */
.o-btn_w100 {
  width: 100%;
  max-width: 328px;
  max-width: 20.5rem; }

/**
 * Class: o-btn_sm-padding
 * @atom Botón con poco padding para botones de solo icono
 * @section 03. Botones
 *
 * @markup
 *  <button class="o-btn o-btn_sm-padding i-world" type="button">
 *  </button>
 */
.o-btn_sm-padding {
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem; }

/**
 * Class: o-link
 * @atom Enlace base
 * @section 04. Enlaces
 * @description
 *  Define el estilo base de los enlaces con iconos y sin iconos.
 *
 * @markup
 *  <a href="#" class="o-link">
 *    <span class="o-link_text">Enlace con ícono</span>
 *  </a>
 */
.o-link {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: fit-content;
  column-gap: 4px;
  column-gap: 0.25rem;
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-top: 8px;
  padding-top: 0.5rem;
  padding-bottom: 2px;
  padding-bottom: 0.125rem;
  color: #000;
  font-weight: 400;
  font-size: 16px;
  font-size: 1rem;
  font-family: "Alfredino Tuttocurvy", sans-serif;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.1;
  cursor: pointer;
  border: none;
  border-bottom: 2px solid #000;
  background-color: transparent;
  transition: 0.3s; }
  .o-link:hover, .o-link:focus, .o-link:active {
    box-shadow: inset 0 -3.25em 0 0 #000;
    color: #fff; }
  .o-link:disabled {
    border: none;
    border-bottom: 2px solid #7A7D80;
    color: #7A7D80;
    background-color: transparent;
    pointer-events: none; }
  .o-link::after, .o-link::before {
    font-size: 18px;
    font-size: 1.125rem; }

/*------------------------------------*\
  Patterns Elements
    #Styles for Forms
\*------------------------------------*/
/**
 * Form fields
 *
 * Sistema base de campos de formulario.
 *
 * Este patrón define la estructura, estados y comportamiento visual
 * de los siguientes elementos:
 *
 * - Radio button
 * - Checkbox
 * - Select
 * - Input de texto
 *
 * Todos los campos deben construirse usando el wrapper `.o-field`
 * y sus elementos internos para garantizar consistencia visual,
 * accesibilidad y correcta aplicación de estados.
 *
 * ---
 *
 * Estructura base:
 *
 * <div class="o-field">
 *   <input type="radio|checkbox" id="id-ejemplo">
 *   <label class="o-field__label" for="id-ejemplo">
 *     Etiqueta
 *   </label>
 * </div>
 *
 * <div class="o-field">
 *   <label class="o-field__label" for="input-id">
 *     Etiqueta
 *   </label>
 *
 *   <div class="o-field__wrap">
 *     <input type="text" id="input-id">
 *     <!-- o -->
 *     <select id="select-id"></select>
 *   </div>
 *
 *   <p class="o-field__help">
 *     Texto de ayuda
 *   </p>
 * </div>
 *
 * ---
 *
 * Estados:
 *
 * Los estados se controlan aplicando clases al contenedor `.o-field`:
 *
 * - `.is-error`   → estado de error (borde rojo, icono de error, texto de ayuda en rojo)
 * - `.is-succes`  → estado de éxito (borde verde, icono de check, texto de ayuda en verde)
 *
 * Ejemplo:
 *
 * <div class="o-field is-error">
 *   ...
 * </div>
 *
 *
 * Accesibilidad:
 *
 * - El `label` siempre debe estar asociado al `input` mediante `for` / `id`
 * - El `input` real nunca se elimina (solo se oculta visualmente)
 *
 */
input,
select,
textarea {
  outline: none; }

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

fieldset {
  border: none;
  padding: 0;
  margin: 0; }

.o-field_space {
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem; }

.o-field {
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem; }
  .o-field input[type="radio"],
  .o-field input[type="checkbox"] {
    position: absolute;
    opacity: 0; }
    .o-field input[type="radio"] + .o-field__label,
    .o-field input[type="checkbox"] + .o-field__label {
      font-weight: 400; }
      .o-field input[type="radio"] + .o-field__label:before,
      .o-field input[type="checkbox"] + .o-field__label:before {
        content: "";
        position: relative;
        display: inline-block;
        margin-right: 8px;
        margin-right: 0.5rem;
        width: 24px;
        width: 1.5rem;
        min-width: 24px;
        min-width: 1.5rem;
        height: 24px;
        height: 1.5rem;
        background-color: #fff;
        border: 1px solid #000;
        cursor: pointer;
        text-align: center;
        transition: all 0.4s ease; }
  .o-field input[type="radio"] {
    display: inline-block; }
    .o-field input[type="radio"] + .o-field__label:before {
      border-radius: 100%; }
    .o-field input[type="radio"]:checked + .o-field__label:before {
      background-color: #000;
      box-shadow: inset 0 0 0 4px #fff; }
    .o-field input[type="radio"]:disabled + .o-field__label:before {
      box-shadow: inset 0 0 0 4px #F3F3F4;
      border-color: #E7E8EA;
      background-color: #F3F3F4;
      pointer-events: none; }
    .o-field input[type="radio"]:focus + .o-field__label:before {
      outline: none;
      border-color: #000; }
  .o-field input[type="checkbox"] {
    display: inline-flex;
    align-items: center;
    justify-content: center; }
    .o-field input[type="checkbox"] + .o-field__label:before {
      border-radius: 4px; }
    .o-field input[type="checkbox"]:checked + .o-field__label:before {
      content: "\ea5e";
      background-color: #000;
      border-color: #000;
      font-family: "ico-tabler-icons";
      color: #fff;
      font-size: 18px;
      font-size: 1.125rem; }
    .o-field input[type="checkbox"]:disabled + .o-field__label:before {
      background: #F3F3F4;
      border-color: #E7E8EA;
      color: #E7E8EA;
      pointer-events: none; }
    .o-field input[type="checkbox"]:focus + .o-field__label:before {
      outline: none;
      border-color: #000; }

.o-field_wrap {
  display: flex;
  flex-wrap: wrap; }
  .o-field_wrap .o-field__label,
  .o-field_wrap .o-field__help {
    flex: 1 100%; }
  .o-field_wrap .o-field_space {
    margin: 8px; }

.o-field__label {
  display: flex;
  align-items: center;
  font-size: 16px;
  font-size: 1rem;
  font-weight: 700;
  color: #000;
  transition: all 0.4s ease; }

.o-field__wrap {
  position: relative;
  width: 100%; }
  .o-field__wrap select,
  .o-field__wrap input[type="text"],
  .o-field__wrap input[type="email"],
  .o-field__wrap input[type="number"],
  .o-field__wrap input[type="tel"],
  .o-field__wrap input[type="url"],
  .o-field__wrap input[type="time"],
  .o-field__wrap input[type="date"],
  .o-field__wrap input[type="file"] {
    width: 100%;
    padding-top: 12px;
    padding-top: 0.75rem;
    padding-bottom: 12px;
    padding-bottom: 0.75rem;
    padding-left: 16px;
    padding-left: 1rem;
    border: 1px solid #000;
    border-radius: 4px;
    font-size: 16px;
    font-size: 1rem;
    transition: all 0.4s ease; }
    .o-field__wrap select:disabled,
    .o-field__wrap input[type="text"]:disabled,
    .o-field__wrap input[type="email"]:disabled,
    .o-field__wrap input[type="number"]:disabled,
    .o-field__wrap input[type="tel"]:disabled,
    .o-field__wrap input[type="url"]:disabled,
    .o-field__wrap input[type="time"]:disabled,
    .o-field__wrap input[type="date"]:disabled,
    .o-field__wrap input[type="file"]:disabled {
      border: 1px solid #E7E8EA; }
      .o-field__wrap select:disabled::before,
      .o-field__wrap input[type="text"]:disabled::before,
      .o-field__wrap input[type="email"]:disabled::before,
      .o-field__wrap input[type="number"]:disabled::before,
      .o-field__wrap input[type="tel"]:disabled::before,
      .o-field__wrap input[type="url"]:disabled::before,
      .o-field__wrap input[type="time"]:disabled::before,
      .o-field__wrap input[type="date"]:disabled::before,
      .o-field__wrap input[type="file"]:disabled::before {
        color: #CECFD1; }
  .o-field__wrap input[type="time"],
  .o-field__wrap input[type="date"],
  .o-field__wrap input[type="file"] {
    width: auto; }
  .o-field__wrap input[type="file"] {
    width: 100%;
    background-color: #fff; }
  .o-field__wrap select {
    padding-right: 36px;
    padding-right: 2.25rem; }
  .o-field__wrap:has(select[multiple])::before {
    content: none; }
  .o-field__wrap input[type="text"],
  .o-field__wrap input[type="email"],
  .o-field__wrap input[type="number"],
  .o-field__wrap input[type="tel"],
  .o-field__wrap input[type="url"],
  .o-field__wrap input[type="time"],
  .o-field__wrap input[type="date"],
  .o-field__wrap input[type="file"] {
    padding-right: 16px;
    padding-right: 1rem; }
    .is-error .o-field__wrap input[type="text"], .is-succes .o-field__wrap input[type="text"], .is-error .o-field__wrap input[type="email"], .is-succes .o-field__wrap input[type="email"], .is-error .o-field__wrap input[type="number"], .is-succes .o-field__wrap input[type="number"], .is-error .o-field__wrap input[type="tel"], .is-succes .o-field__wrap input[type="tel"], .is-error .o-field__wrap input[type="url"], .is-succes .o-field__wrap input[type="url"], .is-error .o-field__wrap input[type="time"], .is-succes .o-field__wrap input[type="time"], .is-error .o-field__wrap input[type="date"], .is-succes .o-field__wrap input[type="date"], .is-error .o-field__wrap input[type="file"], .is-succes .o-field__wrap input[type="file"] {
      padding-right: 36px;
      padding-right: 2.25rem; }
  .o-field__wrap textarea {
    width: 100%;
    padding: 16px;
    padding: 1rem; }
  .o-field__wrap::before {
    font-family: "ico-tabler-icons";
    position: absolute;
    right: 0;
    top: 50%;
    color: #000;
    margin-right: 16px;
    margin-right: 1rem;
    transform: translateY(-50%);
    pointer-events: none; }
  .o-field__wrap:has(input[type="text"])::before, .o-field__wrap:has(input[type="email"])::before, .o-field__wrap:has(input[type="number"])::before, .o-field__wrap:has(input[type="tel"])::before, .o-field__wrap:has(input[type="url"])::before, .o-field__wrap:has(input[type="time"])::before, .o-field__wrap:has(input[type="date"])::before, .o-field__wrap:has(input[type="file"])::before {
    content: "";
    margin-right: 0; }
    .is-error .o-field__wrap:has(input[type="text"])::before, .is-error .o-field__wrap:has(input[type="email"])::before, .is-error .o-field__wrap:has(input[type="number"])::before, .is-error .o-field__wrap:has(input[type="tel"])::before, .is-error .o-field__wrap:has(input[type="url"])::before, .is-error .o-field__wrap:has(input[type="time"])::before, .is-error .o-field__wrap:has(input[type="date"])::before, .is-error .o-field__wrap:has(input[type="file"])::before {
      content: "";
      color: #C00;
      margin-right: 16px;
      margin-right: 1rem; }
    .is-succes .o-field__wrap:has(input[type="text"])::before, .is-succes .o-field__wrap:has(input[type="email"])::before, .is-succes .o-field__wrap:has(input[type="number"])::before, .is-succes .o-field__wrap:has(input[type="tel"])::before, .is-succes .o-field__wrap:has(input[type="url"])::before, .is-succes .o-field__wrap:has(input[type="time"])::before, .is-succes .o-field__wrap:has(input[type="date"])::before, .is-succes .o-field__wrap:has(input[type="file"])::before {
      content: "";
      color: #007E33;
      margin-right: 16px;
      margin-right: 1rem; }
  .o-field__wrap:has(select)::before {
    content: ""; }
  .is-error .o-field__wrap {
    border: 1px solid #C00;
    border-radius: 4px; }
  .is-succes .o-field__wrap {
    border: 1px solid #007E33;
    border-radius: 4px; }

.o-field__help {
  display: block;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.2;
  color: #5F5E5B;
  transition: all 0.4s ease; }
  .is-error .o-field__help.js-form-error {
    color: #C00;
    transition: all 0.4s ease; }
  .is-succes .o-field__help {
    color: #007E33;
    transition: all 0.4s ease; }

.o-section__beige {
  background-color: #FFFBE1; }

.o-section__gray-100 {
  background-color: #F3F3F4; }

.o-section__white {
  background-color: #fff; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**
* Mobile | VP: max-width 768px
*/
@media only screen and (max-width: 767px) {
  .o-section {
    margin-top: 40px;
    margin-top: 2.5rem;
    margin-bottom: 40px;
    margin-bottom: 2.5rem; }
  .o-section-padding {
    padding-top: 40px;
    padding-top: 2.5rem;
    padding-bottom: 40px;
    padding-bottom: 2.5rem; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .o-section {
    margin-top: 80px;
    margin-top: 5rem;
    margin-bottom: 80px;
    margin-bottom: 5rem; }
  .o-section-padding {
    padding-top: 40px;
    padding-top: 2.5rem;
    padding-bottom: 40px;
    padding-bottom: 2.5rem; } }

.o-card {
  max-width: 360px;
  max-width: 22.5rem;
  width: 100%;
  border: 2px solid #000; }

.o-card_w100 {
  min-width: 100%; }

.o-card__action {
  text-decoration: none;
  color: initial; }
  .o-card__action:hover {
    text-decoration: none; }
    .o-card__action:hover .o-link {
      box-shadow: inset 0 -3.25em 0 0 #000;
      color: #fff; }

.o-card__action_flex {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%; }

.o-card__media {
  position: relative;
  aspect-ratio: 1/1;
  overflow: hidden; }

.o-card__media_right {
  display: flex;
  justify-content: right; }
  .o-card__media_right img {
    width: 75%;
    max-width: 430px;
    max-width: 26.875rem;
    aspect-ratio: 1/1;
    object-fit: cover; }

.o-card__media_circle {
  border-radius: 100%;
  max-width: 96px;
  max-width: 6rem;
  margin-top: 24px;
  margin-top: 1.5rem;
  margin-left: 24px;
  margin-left: 1.5rem; }

.o-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover; }

.o-card__badge {
  position: absolute;
  bottom: 12px;
  left: 16px; }

.o-card__content {
  display: flex;
  flex-direction: column;
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-left: 24px;
  padding-left: 1.5rem;
  padding-right: 24px;
  padding-right: 1.5rem;
  row-gap: 16px;
  row-gap: 1rem; }

.o-card__content_pbottom {
  padding-bottom: 24px;
  padding-bottom: 1.5rem; }

.o-card__content_gap {
  padding-bottom: 0; }

.o-card__description {
  word-break: break-word; }

.o-card__item {
  display: inline-flex;
  align-items: center;
  column-gap: 8px;
  column-gap: 0.5rem;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 700; }

.o-card__list {
  display: flex;
  flex-wrap: wrap;
  column-gap: 8px;
  column-gap: 0.5rem;
  row-gap: 8px;
  row-gap: 0.5rem;
  margin-top: 8px;
  margin-top: 0.5rem;
  list-style-type: none; }

.o-card__sm-link::before {
  font-size: 19px;
  font-size: 1.1875rem; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**
* Mobile | VP: max-width 768px
*/
@media only screen and (max-width: 767px) {
  .o-card__title {
    font-size: 20px;
    font-size: 1.25rem; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .o-card__title {
    font-size: 24px;
    font-size: 1.5rem; } }

/**
 * Background color sequence
 *
 * Aplica una secuencia de colores a elementos hermanos
 * usando `:nth-child`.
 *
 * Uso:
 * <section class="o-bg-sequence">
 *   <article class="o-card"></article>
 *   <article class="o-card"></article>
 *   <article class="o-card"></article>
 *   <article class="o-card"></article>
 * </section>
 */
.o-bg-sequence > :nth-child(5n + 1) {
  background-color: #CA99FF; }

.o-bg-sequence > :nth-child(5n + 2) {
  background-color: #FFEE5E; }

.o-bg-sequence > :nth-child(5n + 3) {
  background-color: #00E07A; }

.o-bg-sequence > :nth-child(5n + 4) {
  background-color: #FFA7E9; }

.o-bg-sequence > :nth-child(5n + 5) {
  background-color: #88C7FF; }

.o-swiper__footer {
  display: flex;
  justify-content: space-between;
  align-items: center; }

.o-swiper__controls {
  display: flex;
  height: 36px;
  height: 2.25rem;
  gap: 8px;
  gap: 0.5rem; }

.o-swiper__controls_prev,
.o-swiper__controls_next {
  position: static !important;
  width: 36px !important;
  height: 36px !important;
  margin-top: 0 !important;
  border-top: 2px solid #000;
  border-bottom: 4px solid #000;
  border-right: 4px solid #000;
  border-left: 2px solid #000;
  border-radius: 8px;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: 0.3s; }
  .o-swiper__controls_prev:hover, .o-swiper__controls_prev:focus, .o-swiper__controls_prev:active,
  .o-swiper__controls_next:hover,
  .o-swiper__controls_next:focus,
  .o-swiper__controls_next:active {
    box-shadow: inset 23em 0 0 0 #000;
    color: #fff; }
  .o-swiper__controls_prev svg,
  .o-swiper__controls_next svg {
    display: none; }
  .o-swiper__controls_prev::before,
  .o-swiper__controls_next::before {
    color: #000;
    font-size: 24px;
    font-size: 1.5rem; }

.o-swiper__pagination {
  font-weight: 700; }

.o-swiper__wrapper {
  align-items: stretch; }
  .o-swiper__wrapper > .swiper-slide {
    height: auto;
    display: flex; }
    .o-swiper__wrapper > .swiper-slide .o-card {
      height: 100%; }
  .o-swiper__wrapper .o-card__action.o-card__action_flex {
    justify-content: flex-start;
    height: 100%;
    width: 100%; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**
* Mobile | VP: max-width 768px
*/
@media only screen and (max-width: 767px) {
  .o-swiper__footer {
    margin-top: 24px;
    margin-top: 1.5rem; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .o-swiper__footer {
    margin-top: 40px;
    margin-top: 2.5rem; } }

.s-richtext a,
.s-richtext_inline a,
.s-richtext_basic a {
  color: #000;
  text-decoration: underline;
  font-weight: 700; }

.s-richtext hr,
.s-richtext_inline hr,
.s-richtext_basic hr {
  color: #7A7D80;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem; }

.s-richtext p,
.s-richtext_inline p,
.s-richtext_basic p {
  margin-bottom: 32px;
  margin-bottom: 2rem; }

.s-richtext h3,
.s-richtext_basic h3 {
  font-size: 32px;
  font-size: 2rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem; }

.s-richtext p:empty,
.s-richtext_basic p:empty {
  display: inline; }

.s-richtext .s-richtext-emoji,
.s-richtext_basic .s-richtext-emoji {
  display: inline-block;
  margin-bottom: 8px;
  margin-bottom: 0.5rem; }

.s-richtext img.full-width,
.s-richtext_basic img.full-width {
  width: 100%; }

.s-richtext img.full-width,
.s-richtext img.left,
.s-richtext img.right,
.s-richtext_basic img.full-width,
.s-richtext_basic img.left,
.s-richtext_basic img.right {
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem; }

.s-richtext img.left,
.s-richtext_basic img.left {
  float: left;
  margin-right: 24px;
  margin-right: 1.5rem; }

.s-richtext img.right,
.s-richtext_basic img.right {
  float: right;
  margin-left: 24px;
  margin-left: 1.5rem; }

.s-richtext ul li,
.s-richtext ol li,
.s-richtext_basic ul li,
.s-richtext_basic ol li {
  margin-left: 32px;
  margin-left: 2rem; }

.s-richtext h2 {
  font-size: 36px;
  font-size: 2.25rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem; }

.s-richtext h4 {
  font-size: 28px;
  font-size: 1.75rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem; }

.s-richtext h5 {
  font-size: 24px;
  font-size: 1.5rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem; }

.s-richtext iframe {
  display: block;
  width: 100%;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem; }

.s-richtext blockquote {
  position: relative;
  padding: 24px;
  padding: 1.5rem;
  margin-top: 20px;
  margin-top: 1.25rem;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
  background-color: #fff; }
  .s-richtext blockquote::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    background-color: #000;
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px; }
  .s-richtext blockquote::before {
    content: "";
    font-family: "ico-tabler-icons";
    display: block;
    font-size: 32px;
    font-size: 2rem; }

.s-richtext-img-wrap {
  display: flex;
  column-gap: 8px;
  column-gap: 0.5rem; }

.s-richtext-img {
  display: block;
  width: 100%;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem; }

.s-richtext-img_land {
  aspect-ratio: 16/9; }

.s-richtext-img_port {
  width: auto;
  aspect-ratio: 9/16;
  max-height: 640px;
  max-height: 40rem;
  margin-left: auto;
  margin-right: auto; }

.s-richtext-img_mid {
  aspect-ratio: 3/2; }

.s-richtext-img_square {
  aspect-ratio: 1/1; }

.s-richtext-img__file {
  width: 100%;
  height: 100%;
  object-fit: cover; }

.s-table-wrap {
  width: 100%;
  overflow-x: auto;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem; }

.s-table {
  width: 100%; }

.s-table__thead,
.s-table__th_head {
  background-color: #E7E8EA; }

.s-table__th {
  font-weight: 700; }

.s-table__td,
.s-table__th {
  padding-top: 8px;
  padding-top: 0.5rem;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  border: 1px solid #CECFD1;
  text-align: left; }

@media screen and (max-width: 459px) {
  .s-richtext iframe {
    min-height: 235px;
    min-height: 14.6875rem; } }

@media screen and (min-width: 460px) {
  .s-richtext iframe {
    min-height: 360px;
    min-height: 22.5rem; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .s-richtext h2 {
    font-size: 56px;
    font-size: 3.5rem; }
  .s-richtext h4 {
    font-size: 40px;
    font-size: 2.5rem; }
  .s-richtext h5 {
    font-size: 32px;
    font-size: 2rem; }
  .s-richtext h3,
  .s-richtext_basic h3 {
    font-size: 48px;
    font-size: 3rem; }
  .s-richtext hr,
  .s-richtext_inline hr,
  .s-richtext_basic hr {
    margin-bottom: 32px;
    margin-bottom: 2rem;
    margin-top: 32px;
    margin-top: 2rem; } }

.o-layout-results {
  display: flex;
  margin-bottom: 56px;
  margin-bottom: 3.5rem;
  margin-top: 40px;
  margin-top: 2.5rem; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**

* Mobile | VP: max-width 1023px
*/
@media only screen and (max-width: 1023px) {
  .o-layout-results {
    flex-direction: column;
    align-items: center;
    row-gap: 24px;
    row-gap: 1.5rem; } }

/**
* Desktop | VP: min-width 1024px
*/
@media only screen and (min-width: 1024px) {
  .o-layout-results {
    display: flex;
    column-gap: 24px;
    column-gap: 1.5rem; }
  .o-layout-results__first {
    flex: 30%; }
  .o-layout-results__second {
    flex: 90%;
    justify-self: end; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .o-layout-results {
    margin-bottom: 80px;
    margin-bottom: 5rem; } }

.o-paginator,
.o-paginator__wrap {
  display: flex; }

.o-paginator {
  justify-content: space-between; }

.o-paginator__wrap {
  display: flex;
  column-gap: 8px;
  column-gap: 0.5rem; }

.o-paginator__num {
  font-size: 24px;
  font-size: 1.5rem; }

.o-paginator__btn::before {
  font-size: 24px;
  font-size: 1.5rem; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**
* Mobile | VP: max-width 768px
*/
/**
* Desktop | VP: min-width 768px
*/
/**
 * Tag
 *
 * Objeto visual para mostrar etiquetas breves,
 * categorías o estados de forma compacta.
 *
 * Uso recomendado:
 * - Badges de cards
 * - Categorías
 * - Etiquetas informativas
 *
 * Ejemplo de marcado:
 *
 * <span class="o-tag">
 *   Categoría
 * </span>
 *
 */
.o-tag {
  display: inline-block;
  padding: 8px;
  padding: 0.5rem;
  background-color: #F3F3F4;
  border-radius: 4px;
  font-weight: 700;
  font-size: 14px;
  font-size: 0.875rem; }

/**
 * Tag Bullet
 *
 * Objeto tipográfico para mostrar etiquetas o metadatos
 * en línea, separados por un bullet (`•`).
 *
 * Este objeto no define colores ni contexto visual,
 * solo la estructura y separación entre ítems.
 *
 * Uso recomendado:
 * - Metadatos de cards
 * - Categorías
 * - Tipos de contenido
 * - Información breve en línea
 *
 * Comportamiento:
 * - El bullet se agrega automáticamente entre elementos hermanos
 *   que compartan la clase `.o-tag-bullet`
 * - El último elemento no muestra separador
 *
 * Ejemplo de marcado:
 *
 * <div>
 *   <p class="o-tag-bullet">Crónica</p>
 *   <p class="o-tag-bullet">Mapatintas</p>
 * </div>
 *
 * Variante:
 * - `.o-tag-bullet_before` permite forzar un bullet antes del contenido
 */
.o-tag-bullet {
  display: inline-flex;
  align-items: center;
  column-gap: 8px;
  column-gap: 0.5rem;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 700; }
  .o-tag-bullet:not(:last-child)::after {
    content: "•"; }
  .o-tag-bullet::before, .o-tag-bullet::after {
    font-size: 18px;
    font-size: 1.125rem; }

.o-tag-bullet_gray {
  font-size: 16px;
  font-size: 1rem;
  font-weight: initial;
  color: #3F4246; }

.o-tag-bullet_before::before {
  content: "•"; }

.o-grid-flex {
  display: grid;
  row-gap: 24px;
  row-gap: 1.5rem;
  column-gap: 24px;
  column-gap: 1.5rem; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**
* Mobile | VP: min-width 590px
*/
@media screen and (min-width: 590px) {
  .o-grid-flex {
    grid-template-columns: repeat(2, 50%); } }

/**
* Mobile | VP: min-width 1180px
*/
@media only screen and (min-width: 1180px) {
  .o-grid-flex {
    grid-template-columns: repeat(3, 33.33%); }
  .o-grid-flex_four {
    grid-template-columns: repeat(4, 1fr); } }

.o-img {
  width: 100%;
  aspect-ratio: 16/9; }

.o-messages {
  position: fixed;
  top: 106px;
  left: 0;
  width: 100%;
  z-index: 100;
  overflow: hidden; }

.is-messageClose {
  display: none; }

.o-messages__success .o-messages__item {
  color: #fff;
  background-color: #00e07a; }

.o-messages__success .o-alert:before {
  content: ""; }

.has-messageOpen {
  max-height: 100vh;
  animation: moveOpen 2s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards; }

.has-messageClose {
  position: relative;
  max-height: 0;
  overflow: hidden;
  transition: all ease-out;
  animation: moveOut 1s;
  animation-iteration-count: 1;
  animation-fill-mode: backwards; }

.o-messages__item {
  list-style: none;
  text-align: center;
  background-color: #00e07a;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.07); }
  .o-messages__item .o-alert {
    width: 92%;
    max-width: initial;
    padding-left: 0;
    padding-right: 0;
    text-align: left;
    color: inherit;
    box-shadow: none;
    background-color: transparent; }
  .o-messages__item .o-alert__lead {
    flex: 1 1; }

.o-alert {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  max-width: 400px;
  padding: 12px;
  padding: 0.75rem;
  line-height: 1.4;
  color: #000;
  font-size: 14px;
  font-size: 0.875rem;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.07); }
  .o-alert:before {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    width: 1.5rem;
    min-width: 24px;
    min-width: 1.5rem;
    max-width: 24px;
    max-width: 1.5rem;
    height: 24px;
    height: 1.5rem;
    margin-right: 14px;
    margin-right: 0.875rem;
    border: 3px solid;
    border-radius: 50%;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1; }

.o-alert__lead {
  align-self: center; }

.o-alert__close {
  align-self: center;
  margin-left: 14px;
  margin-left: 0.875rem;
  padding-top: 4px;
  padding-top: 0.25rem;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 28px;
  line-height: 1.75rem;
  opacity: 0.6;
  color: inherit;
  transition: all 0.2s ease-in-out; }
  .o-alert__close:hover {
    margin-left: 12px;
    margin-left: 0.75rem;
    opacity: 1;
    font-size: 12px;
    font-size: 0.75rem; }

@media only screen and (min-width: 768px) {
  .o-alert {
    padding: 12px 20px;
    padding: 0.75rem 1.25rem;
    font-size: 16px;
    font-size: 1rem; } }

@keyframes moveOpen {
  from {
    transform: translate(-100px, 0); }
  50% {
    transform: translate(12px, 0); }
  to {
    transform: translate(0, 0); } }

@keyframes moveOut {
  from {
    max-height: 100vh; }
  to {
    max-height: 0; } }

.c-header__container {
  position: fixed;
  width: 100vw;
  background-color: #FFEE5E;
  z-index: 20000; }
  .c-header__container .is-menu-open {
    height: 100vh; }

.c-header__wrap {
  position: relative;
  display: grid;
  align-items: center; }

.c-header__figure {
  padding-bottom: 12px;
  padding-bottom: 0.75rem;
  padding-top: 12px;
  padding-top: 0.75rem;
  margin-right: 16px;
  margin-right: 1rem; }

.c-header__btn1::after {
  font-size: 19px;
  font-size: 1.1875rem; }

.c-header__btn-wrap {
  display: flex;
  column-gap: 4px;
  column-gap: 0.25rem; }

.c-header__nav {
  background-color: #fff; }

.c-header__list {
  list-style-type: none; }

.c-header__link-txt,
.c-header-dropdown__link-txt {
  position: relative;
  display: inline-block;
  text-decoration: none;
  color: #000;
  font-weight: 700;
  cursor: pointer; }
  .c-header__link-txt::before,
  .c-header-dropdown__link-txt::before {
    content: "";
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 4px;
    bottom: -6px;
    left: 0;
    background-color: #00E07A;
    transition: transform 0.25s ease-out;
    transform-origin: bottom center; }
  .c-header__link-txt:hover,
  .c-header-dropdown__link-txt:hover {
    text-decoration: none; }
    .c-header__link-txt:hover::before,
    .c-header-dropdown__link-txt:hover::before {
      transform: scaleX(1);
      transform-origin: bottom center; }
  .is-menu-active .c-header__link-txt::before, .is-menu-active .c-header-dropdown__link-txt::before {
    transform: scaleX(1);
    transform-origin: bottom center; }

.c-header__link-txt::after {
  margin-left: 8px;
  margin-left: 0.5rem;
  transform: rotate(0deg);
  transition: transform ease-in 0.3s; }

.is-open-submenu .c-header__link-txt::after {
  transform: rotate(180deg);
  transition: all ease-in 0.3s; }

.c-header-dropdown__list {
  list-style-type: none; }

.c-header-dropdown__link {
  text-decoration: none; }

.c-header-dropdown__link-txt_regular {
  font-weight: 400; }

.c-header-dropdown__link-txt_flex {
  display: flex;
  align-items: center;
  column-gap: 8px;
  column-gap: 0.5rem;
  cursor: pointer; }
  .c-header-dropdown__link-txt_flex::after {
    font-size: 27px;
    font-size: 1.6875rem; }

@media only screen and (max-width: 767px) {
  .c-header {
    min-height: 72px;
    min-height: 4.5rem; }
  .c-header__wrap {
    grid-template-columns: 5% 1fr minmax(0, 74px) minmax(0, 55px) 5%;
    grid-template-rows: minmax(0, 72px);
    /* Estado abierto */ }
    .is-menu-open .c-header__wrap {
      height: 100vh;
      grid-template-rows: minmax(0, 72px) auto minmax(0, 88px);
      transition: transform ease-in 0.3s; }
  .c-header__figure::before,
  .c-header__btn-wrap::before {
    content: "";
    position: absolute;
    left: 0;
    display: block;
    height: 2px;
    width: 100%;
    background-color: #000; }
  .c-header__figure {
    grid-column: 2 / 3;
    grid-row: 1 / 2; }
    .c-header__figure::before {
      top: 0; }
  .c-header__btn1 {
    grid-column: 3 / 4;
    grid-row: 1 / 2; }
  .c-header__btn-menu:active, .c-header__btn-menu:focus, .c-header__btn-menu:hover {
    box-shadow: inset 7em 0 0 0 #fff; }
  .c-header__btn-menu-span {
    position: relative;
    display: block;
    width: 20px;
    height: 2px;
    background-color: #000;
    border-radius: 2px;
    transition: background-color 0.2s ease;
    /* Estado abierto */ }
    .c-header__btn-menu-span::before, .c-header__btn-menu-span::after {
      content: "";
      position: absolute;
      left: 0;
      width: 100%;
      height: 2px;
      background-color: #000;
      border-radius: 2px;
      transition: transform 0.3s ease, top 0.3s ease; }
    .c-header__btn-menu-span::before {
      top: -6px; }
    .c-header__btn-menu-span::after {
      top: 6px; }
    .is-menu-open .c-header__btn-menu-span {
      background-color: transparent; }
      .is-menu-open .c-header__btn-menu-span::before {
        top: 0;
        transform: rotate(45deg); }
      .is-menu-open .c-header__btn-menu-span::after {
        top: 0;
        transform: rotate(-45deg); }
  .c-header__btn-menu {
    grid-column: 4 / 5;
    grid-row: 1 / 2;
    min-height: 44px;
    min-height: 2.75rem;
    margin-left: 4px;
    margin-left: 0.25rem; }
    .c-header__btn-menu:active .c-header__btn-menu-span, .c-header__btn-menu:focus .c-header__btn-menu-span, .c-header__btn-menu:hover .c-header__btn-menu-span {
      background-color: #000; }
      .c-header__btn-menu:active .c-header__btn-menu-span::before, .c-header__btn-menu:active .c-header__btn-menu-span::after, .c-header__btn-menu:focus .c-header__btn-menu-span::before, .c-header__btn-menu:focus .c-header__btn-menu-span::after, .c-header__btn-menu:hover .c-header__btn-menu-span::before, .c-header__btn-menu:hover .c-header__btn-menu-span::after {
        background-color: #000; }
      .is-menu-open .c-header__btn-menu:active .c-header__btn-menu-span, .is-menu-open .c-header__btn-menu:focus .c-header__btn-menu-span, .is-menu-open .c-header__btn-menu:hover .c-header__btn-menu-span {
        background-color: transparent; }
  .c-header__btn-wrap {
    position: absolute;
    grid-column: 2 / 5;
    grid-row: 3 / 4;
    justify-content: center;
    padding-bottom: 24px;
    padding-bottom: 1.5rem;
    padding-top: 16px;
    padding-top: 1rem;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    /* Estado abierto */ }
    .c-header__btn-wrap::before {
      bottom: 0; }
    .is-menu-open .c-header__btn-wrap {
      position: static;
      visibility: visible;
      opacity: 1;
      pointer-events: all;
      transition: opacity ease-in 0.3s; }
    .c-header__btn-wrap .o-btn {
      width: 100%;
      max-width: 328px;
      max-width: 20.5rem; }
  .c-header__nav {
    position: absolute;
    grid-column: 1 / 6;
    grid-row: 2 / 3;
    height: 100%;
    width: 100%;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition: transform 0.25s ease-out;
    /* Estado abierto */ }
    .c-header__nav::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      display: block;
      height: 2px;
      width: 100%;
      background-color: #E7E8EA; }
    .is-menu-open .c-header__nav {
      position: relative;
      visibility: visible;
      opacity: 1;
      pointer-events: all;
      overflow-y: auto;
      transform: translateY(0); }
  .c-header__item {
    text-align: center;
    border-bottom: 1px solid #E7E8EA; }
    .c-header__item:last-child {
      border-bottom: none; }
  .c-header__item_padding {
    padding-bottom: 24px;
    padding-bottom: 1.5rem; }
  .c-header__link,
  .c-header__span.c-header__wrap {
    display: inline-block;
    padding-bottom: 24px;
    padding-bottom: 1.5rem;
    padding-top: 24px;
    padding-top: 1.5rem;
    width: 100%; }
  .c-header__link::before {
    bottom: 18px; }
  .c-header__link-txt_padding {
    padding-top: 24px;
    padding-top: 1.5rem; }
  .c-header-dropdown {
    max-height: 0;
    overflow: hidden;
    transition: all 0.7s ease; }
  .c-header-dropdown__wrap {
    padding-top: 24px;
    padding-top: 1.5rem;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease-in;
    /* Estado abierto */ }
    .is-open-submenu .c-header-dropdown__wrap {
      visibility: visible;
      opacity: 1;
      pointer-events: all;
      transition: opacity 0.3s ease-in; }
  .c-header-dropdown__item:last-of-type .c-header-dropdown__link {
    padding-bottom: 0; }
  .c-header-dropdown__link {
    display: block;
    padding-top: 16px;
    padding-top: 1rem;
    padding-bottom: 24px;
    padding-bottom: 1.5rem; }
  .c-header-dropdown__link-txt_flex {
    justify-content: center; } }

@media only screen and (min-width: 768px) {
  .c-header {
    min-height: 113px;
    min-height: 7.0625rem; }
  .c-header::before,
  .c-header__nav::before {
    content: "";
    position: absolute;
    left: 0;
    display: block;
    height: 2px;
    width: 100%;
    background-color: #000; }
  .c-header__wrap {
    grid-template-columns: minmax(5%, calc((100vw - 1440px) / 2)) auto 1fr auto auto minmax(5%, calc((100vw - 1440px) / 2));
    grid-template-rows: auto auto; }
    .c-header__wrap::before {
      top: 0; }
  .c-header__figure {
    grid-column: 2 / 3;
    grid-row: 1 / 2; }
  .c-header__btn1 {
    grid-column: 4 / 5;
    grid-row: 1 / 2;
    margin-right: 5px;
    margin-right: 0.3125rem; }
  .c-header__btn-wrap {
    grid-column: 5 / 6;
    grid-row: 1 / 2; }
  .c-header__nav {
    grid-column: 1 / 7;
    grid-row: 2 / 3; }
    .c-header__nav::before {
      bottom: 0; }
  .c-header__btn-menu {
    display: none; }
  .c-header__list {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    column-gap: 24px;
    column-gap: 1.5rem;
    padding-bottom: 14px;
    padding-bottom: 0.875rem;
    padding-top: 14px;
    padding-top: 0.875rem; }
  .c-header-dropdown__wrap {
    position: absolute;
    top: 60px;
    left: 0;
    right: 0;
    width: 100%;
    padding-left: 24px;
    padding-left: 1.5rem;
    padding-right: 24px;
    padding-right: 1.5rem;
    padding-top: 16px;
    padding-top: 1rem;
    padding-bottom: 16px;
    padding-bottom: 1rem;
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid #000;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s ease-in;
    /* Estado abierto */ }
    .is-open-submenu .c-header-dropdown__wrap {
      visibility: visible;
      opacity: 1;
      pointer-events: all;
      transition: all 0.3s ease-in; }
  .c-header-dropdown__link {
    display: block;
    padding-top: 14px;
    padding-top: 0.875rem;
    padding-bottom: 14px;
    padding-bottom: 0.875rem; }
  .c-header-dropdown__link_underline {
    width: max-content; } }

.c-footer {
  background-color: #fff;
  border-top: 2px solid #000; }

.c-footer__dropdown {
  display: flex;
  align-items: flex-start; }

.c-footer__dropdown-cta {
  font-family: "Alfredino Tuttocurvy", sans-serif;
  font-weight: 400; }

.c-footer__list {
  list-style-type: none; }

.c-footer__link {
  display: block;
  color: #000;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  padding-top: 16px;
  padding-top: 1rem;
  text-decoration: none; }
  .c-footer__link:hover {
    text-decoration: none; }

.c-footer__img {
  width: 100%; }

.c-footer__bottom {
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  background-color: #FFEE5E; }

.c-footer__bottom-wrap {
  display: flex;
  align-items: center; }

.c-footer__social-list {
  list-style-type: none;
  display: flex;
  column-gap: 8px;
  column-gap: 0.5rem; }

.c-footer__social-list_space {
  justify-content: space-evenly; }

.c-footer__social-link::before {
  font-size: 22px;
  font-size: 1.375rem; }

.c-footer__social-image {
  max-width: 32px; }

@media only screen and (max-width: 767px) {
  .c-footer__figure {
    padding-top: 32px;
    padding-top: 2rem;
    padding-bottom: 32px;
    padding-bottom: 2rem; }
  .c-footer__column {
    border-bottom: 1px solid #E7E8EA; }
  .c-footer__dropdown {
    padding-top: 16px;
    padding-top: 1rem;
    padding-bottom: 16px;
    padding-bottom: 1rem;
    align-items: center; }
  .c-footer__dropdown-cta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    font-size: 24px;
    font-size: 1.5rem; }
    .c-footer__dropdown-cta::after {
      color: #3F4246;
      transform: rotate(0deg);
      transition: transform ease-in 0.3s; }
    .is-open-footer-menu .c-footer__dropdown-cta::after {
      transform: rotate(180deg);
      transition: transform ease-in 0.3s; }
  .c-footer__dropdown-wrap {
    max-height: 0;
    overflow: hidden;
    transition: all 0.7s ease; }
  .c-footer__list {
    padding-bottom: 24px;
    padding-bottom: 1.5rem; }
  .c-footer__bottom-wrap {
    flex-direction: column-reverse;
    row-gap: 8px;
    row-gap: 0.5rem; }
  .c-footer__legal {
    text-align: center; }
  .c-footer__social-list {
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 8px;
    row-gap: 0.5rem; } }

@media only screen and (min-width: 768px) {
  .c-footer {
    padding-top: 40px;
    padding-top: 2.5rem; }
  .c-footer__columns {
    display: flex;
    justify-content: space-between; }
  .c-footer__dropdown {
    flex-direction: column; }
  .c-footer__dropdown-cta {
    font-size: 28px;
    font-size: 1.75rem; }
    .c-footer__dropdown-cta::after {
      display: none;
      text-align: left; }
  .c-footer__figure {
    padding-bottom: 40px;
    padding-bottom: 2.5rem; }
  .c-footer__bottom-wrap {
    justify-content: space-between; } }

.c-hero {
  position: relative;
  display: grid;
  border-bottom: 2px solid #000; }
  .c-hero::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    z-index: -500;
    opacity: 0.4; }

.c-hero__content {
  margin-top: auto;
  max-width: 670px;
  max-width: 41.875rem; }

.c-hero__content_white .c-hero__title,
.c-hero__content_white .c-hero__description {
  color: #fff; }

.c-hero__figure {
  height: 100%;
  z-index: -1000; }

.c-hero__img,
.c-hero__video {
  width: 100%;
  height: 100%;
  object-fit: cover; }

.c-hero__players {
  display: flex; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**
* Mobile | VP: max-width 768px
*/
@media only screen and (max-width: 767px) {
  .c-hero {
    grid-template-columns: 5% 1fr minmax(0, 112px) 5%;
    grid-template-rows: auto minmax(0, 52px) minmax(0, 16px);
    align-items: center;
    min-height: 570px;
    min-height: 35.625rem; }
  .c-hero__content {
    margin-bottom: 32px;
    margin-bottom: 2rem; }
  .c-hero__title,
  .c-hero-intro__title {
    font-size: 40px;
    font-size: 2.5rem; }
  .c-hero__content {
    grid-column: 2 / 4;
    grid-row: 1 / 2; }
  .c-hero__button {
    grid-column: 2 / 3;
    grid-row: 2 / 3; }
  .c-hero__figure {
    grid-column: 1 / 5;
    grid-row: 1 / 4;
    height: 100%;
    z-index: -1000; }
  .c-hero__players {
    grid-column: 3 / 4;
    grid-row: 2 / 3; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .c-hero {
    grid-template-columns: minmax(5%, calc((100vw - 1440px) / 2)) repeat(4, 1fr) minmax(5%, calc((100vw - 1440px) / 2));
    grid-template-rows: 419px 48px 60px 48px 40px; }
  .c-hero_big {
    grid-template-rows: 571px 48px 103px 48px 40px; }
  .c-hero__title,
  .c-hero-intro__title {
    font-size: 80px;
    font-size: 5rem; }
  .c-hero__content {
    grid-column: 2 / 6;
    grid-row: 1 / 2;
    height: fit-content;
    margin-bottom: 48px;
    margin-bottom: 3rem; }
  .c-hero__button {
    grid-column: 2 / 3;
    grid-row: 2 / 3; }
  .c-hero__figure {
    grid-column: 1 / 7;
    grid-row: 1 / 6; }
  .c-hero__players {
    justify-content: flex-end;
    grid-column: 5 / 6;
    grid-row: 4 / 5; } }

.c-hero-intro {
  --c-background-color: $c-primary-purple;
  border-bottom: 2px solid #000;
  background-color: var(--c-background-color);
  overflow: hidden; }

.c-hero-intro__img {
  width: 100%; }

@media only screen and (max-width: 767px) {
  .c-hero-intro {
    padding: 40px 0; }
  .c-hero-intro__content {
    margin-top: 24px; }
  .c-hero-intro__title {
    margin-bottom: 24px; }
  .c-hero-intro__title,
  .c-hero-intro__button {
    margin-top: 24px; } }

@media (min-width: 768px) and (max-width: 1199px) {
  .c-hero-intro__title {
    font-size: 40px; } }

@media only screen and (min-width: 768px) {
  .c-hero-intro__canvas {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 32px; }
  .c-hero-intro__box {
    width: 50%; }
  .c-hero-intro__content {
    padding: 40px 0; }
  .c-hero-intro__picture {
    margin-left: auto;
    margin-right: calc(-50vw + 50%); }
  .c-hero-intro__button {
    margin-top: 40px; } }

.c-form__caption {
  --c-background-color-form: $c-primary-purple;
  flex: 50%;
  padding-top: 16px;
  padding-top: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-left: 16px;
  padding-left: 1rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  background-color: var(--c-background-color-form);
  border-bottom: 2px solid #000; }

.c-form__wrap {
  flex: 50%;
  padding-top: 40px;
  padding-top: 2.5rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-left: 16px;
  padding-left: 1rem;
  padding-bottom: 40px;
  padding-bottom: 2.5rem;
  width: 100%; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**
* Desktop | VP: min-width 1024px
*/
@media only screen and (min-width: 1024px) {
  .c-form {
    display: flex; }
  .c-form_column {
    flex-direction: column;
    max-width: 700px;
    max-width: 43.75rem; }
    .c-form_column .c-form__caption {
      padding-bottom: 24px;
      padding-bottom: 1.5rem; }
    .c-form_column .c-form__wrap {
      padding-top: 24px;
      padding-top: 1.5rem; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .c-form__caption {
    padding-top: 80px;
    padding-top: 5rem;
    padding-right: 40px;
    padding-right: 2.5rem;
    padding-left: 40px;
    padding-left: 2.5rem;
    padding-bottom: 80px;
    padding-bottom: 5rem;
    border-bottom: none; }
  .c-form__wrap {
    padding-top: 80px;
    padding-top: 5rem;
    padding-right: 80px;
    padding-right: 5rem;
    padding-left: 80px;
    padding-left: 5rem;
    padding-bottom: 80px;
    padding-bottom: 5rem; } }

.c-error-message {
  height: 100%; }

.c-error-message__title {
  text-align: center; }

.c-error-message__wrap {
  display: flex;
  flex-direction: column;
  row-gap: 56px;
  padding-top: 80px;
  padding-bottom: 80px;
  align-items: center; }

.c-error-message__img {
  width: 100%;
  max-width: 760px; }

.c-social-media {
  justify-content: center; }

.c-social-media__list {
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  column-gap: 8px;
  column-gap: 0.5rem;
  row-gap: 8px;
  row-gap: 0.5rem; }

.c-social-media__item,
.c-social-media__link {
  max-width: 50px;
  max-width: 3.125rem; }

.c-social-media__image {
  max-width: 24px;
  max-width: 1.5rem; }

@media only screen and (min-width: 768px) {
  .c-social-media {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 24px;
    column-gap: 1.5rem; } }

/*# sourceMappingURL=theme.css.map */