/* SETUP PAGE */
        body {
          overflow-x: hidden;
          background: #000;
          color: #f0f0f0;
        }
        .offcanvas-3__menu li a{ font-size: 5vh; }

        .imgLogo{ width: 70px;margin: 80px; margin-top: 84px; }
        /* === HERO CON VIDEO === */
        .bio-hero {
          height: 100vh;
          position: relative;
          display: flex;
          align-items: center;
          justify-content: center;
          overflow: hidden;
        }

        /* Oculta el menú de escritorio en todas las resoluciones */
        .header__nav.pos-center { display: none !important; }
        /* Asegura que el ícono de hamburguesa siempre sea visible */
        .header__navicon { display: block !important;}
        .header-area button i {color: #ffffff; }
        /*.fa-solid, .fas { font-family: "Font Awesome 6 Free";font-weight: 900;font-size: 3em; }*/

        @media only screen and (max-width: 1919px) {
          .hambur{ padding-top:0px;margin-right:90px; }
        }


        @media (max-width: 767px) {
            #app {
                height: 80vh;
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .fa-solid, .fas {
                font-family: "Font Awesome 6 Free";
                font-weight: 900;
                font-size: 2em;
            }
            .imgLogo { width: 70px;margin: 0px; margin-top: 0px; }
            .portfolio-slider .nav-icon {
                font-size: 18px;
                text-transform: uppercase;
                display: flex;
                gap: 30px;
                color: #ffffff;
                line-height: 1;
                position: relative;
                z-index: 2;
            }
            .hambur {
                padding-top: 0px;
                margin-right: 20px;
            }
        }

        .offcanvas-3__area {
            background: #171717;
            position: fixed;
            width: 100%;
            height: 100%;
            padding: 50px 50px 100px;
            z-index: 100000;
            overflow: hidden;
        }

        .hero-area .content-last .col-first {
          display: grid;
          gap: 0px;
        }

        .hero-area .content-last {
            display: grid;
            gap: 10px;
            grid-template-columns: 324px 1fr;
            align-items: flex-end;
        }
        .hero-area .content-last .col-second {
          display: grid;
          gap: 5px;
        }
    
        .wc-btn-primary:hover {
          color: #0f0f0f;
          background-color: var(--primary);
          border-color: var(--primary);
        }

        .contact-area .contact-formfield input {
          width: 100%;
          height: 40px;
          border: none;
          border-bottom: 1px solid var(--border);
          outline: none;
          background-color: rgb(235 8 8 / 0%);
          transition: all .5s;
          color: #fff;
        }

        .alert-success {
          background-color: #d4edda;
          color: #155724;
          border: 1px solid #c3e6cb;
        }

        .alert-danger {
          background-color: #f8d7da;
          color: #721c24;
          border: 1px solid #f5c6cb;
        }        

        @media only screen and (max-width: 767px) {
          .copyright-area{ padding-bottom: 60px;}
        }

    /* END SETUP PAGE */

    @media only screen and (max-width: 767px) {
      .switcher__area_banner {
        display: none;
        }
        .contact-list p { font-size: 12px; display: inline-block; }
    }

    @media only screen and (max-width: 1919px) {
    .header-area .header-area__inner {
        height: 80px;
    }
}
.header-area .header-area__inner {
    display: flex;
    align-items: center;
    gap: 20px;
    position: relative;
    height: 100px;
}


.header-area .wc-btn-group>*:nth-child(1) {
    transform: scale3d(0.5, 0.5, 1);
    margin-inline-end: -40px;
}
.header-area .wc-btn-circle {
    width: 40px;
    height: 40px;
    font-size: 14px;
    background-color: var(--black);
    color: var(--white);
}
.wc-btn-group>*:nth-child(1) {
    transform: scale3d(0.5, 0.5, 1);
    margin-inline-end: -70px;
}

.header-area .wc-btn-group>*:nth-child(3) {
    transform: scale3d(1, 1, 1);
    margin-inline-start: 0;
}
.header-area .wc-btn-circle {
    width: 40px;
    height: 40px;
    font-size: 14px;
    background-color: var(--black);
    color: var(--white);
}

.wc-btn-circle {
    text-align: center;
    width: 70px;
    height: 70px;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.5;
    color: var(--black);
    border-radius: 100%;
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
    background-color: var(--white);
}

.switcher__area {
    position: relative;
    direction: ltr;
    z-index: 99999;
}

h1, h2 { line-height:1.2 !important;}
p { line-height:1.6 !important;}
h2 { font-size: 25px; }
.font-heading-instumentsans-semibold { color:#0f0f0f; }
.font-heading-instumentsans-semibold .wc-btn-primary:hover{ color:#ffffff; }

@media (max-width: 575px) {
    .contact-list p { font-size: 12px; display: inline-block; }
}

.navbar--menu-trigger {
  width: 56px;   /* desktop */
  cursor: pointer;
}
.dark .navbar--menu-trigger {
  color: #fff;
}
.navbar--menu-trigger svg {
  width: 100%;
  height: auto;
}

/* Mobile */
@media (max-width: 768px) {
  .navbar--menu-trigger {
    width: 40px;
  }
  .offcanvas-3__menu li a { font-size: 5vh; }
}
.header__button{ display: none; }

  ul, ol {
      color: var(--black);
      padding: 0;
      margin: 0;
      font-size: 25px;
      margin-top: 15px;
      line-height: 35px;
  }


.contact-area .contact-formfield input {
    width: 100%;
    height: 40px;
    border: none;
    border-bottom: 1px solid var(--border);
    outline: none;
    background-color: rgb(235 8 8 / 0%);
    transition: all .5s;
    color: #000000;
}

.dark .contact-area .contact-formfield input {
color: #FFF;
}

.font-heading-instumentsans-semibold h1, .font-heading-instumentsans-semibold h2, .font-heading-instumentsans-semibold h3, .font-heading-instumentsans-semibold h4, .font-heading-instumentsans-semibold h5, .font-heading-instumentsans-semibold h6
 {
    font-family: var(--font_instrumentsans)!important;
    font-weight: 600!important;
    line-height: 1!important;
}

.navbar--menu-trigger {
    cursor: pointer;
    color: #111;
}

.hero-area{ background-color: #9e9e9e1a;}

.grecaptcha-badge{ top: 485px; }

/* === ORDEN EN MOBILE */