/* SPECIAL
   ================= */
@media only screen and (max-width: 1420px) {
  #page-header .home-title span {
    font-size: 11vw;
  }
  #page-header.ph-full {
    display: flex;
    align-items: center;
    min-height: 100dvh;
  }
}
/* TABLET: Landscape 
   ================= */
@media only screen and (max-width: 1200px) {
}

/* TABLET: Portrait Only
   ===================== */
@media only screen and (min-width: 740px) and (max-width: 960px) {
}

/* TABLET: Portrait
   ================ */
@media only screen and (max-width: 960px) {
  .fx-cursor,
  .mob-no {
    display: none !important;
  }
  .mob-ok {
    display: unset !important;
  }
  .stamp {
    display: none;
  }

  /* MENU */
  .nav-fixed {
    display: block;
  }
  .tt-logo {
    position: absolute;
    left: 40px;
    top: 20px;
    z-index: 11111111;
  }
  .tt-ol-menu-toggle-btn {
    background-color: #f8f8f8aa;
    border-radius: 10px;
    backdrop-filter: blur(11px);
  }
  body:not(.tt-boxed) .tt-header-inner,
  .tt-header-inner:not(.tt-wrap) {
    padding: 30px;
  }
  #tt-ol-menu-toggle-btn-wrap {
    display: flex;
  }
  .tt-ol-menu-toggle-btn {
    transition: all 0.2s ease-in-out;
  }
  .tt-ol-menu-toggle-btn * {
    transition: all 0.2s ease-in-out !important;
  }
  .tt-ol-menu-toggle-btn span {
    width: 32px;
    position: absolute;
    display: block;
    top: calc(50% + 4px);
  }
  body.tt-ol-menu-open .tt-ol-menu-toggle-btn span {
    top: 50%;
  }
  .tt-ol-menu-toggle-btn-text {
    padding-right: 0;
  }
  .tt-ol-menu-toggle-btn span::before,
  .tt-ol-menu-toggle-btn span::after {
    background-color: var(--color-fede-fv);
    transition: all 0.2s ease-in-out;
  }
  .tt-ol-menu-toggle-btn span::before {
    top: -4px;
    width: 32px;
  }
  .tt-ol-menu-toggle-btn span::after {
    width: 32px;
    bottom: -4px;
  }
  .tt-ol-menu-toggle-btn span:last-child::before {
    top: -12px;
  }
  .tt-ol-menu-toggle-btn span:last-child::after {
    display: none;
  }
  body.tt-ol-menu-open .tt-ol-menu-toggle-btn span:first-child::before {
    top: 0;
    opacity: 0;
  }
  body.tt-ol-menu-open .tt-ol-menu-toggle-btn span {
    width: 32px;
  }
  body.tt-ol-menu-open .tt-ol-menu-toggle-btn span::before {
    width: 32px;
  }
  body.tt-ol-menu-open .tt-ol-menu-toggle-btn span::after {
    width: 32px;
  }

  .tt-overlay-menu {
    background-color: var(--color-fede-white);
  }
  .tt-ol-submenu-wrap {
    display: list-item !important;
    transition: all 0.2s ease-in-out;
  }
  .tt-ol-menu-content {
    display: flex;
    align-items: center;
  }
  .tt-ol-menu-list {
    margin: 0;
    display: flex;
    align-items: center;
    width: 100%;
    gap: 18px;
    flex-direction: column;
    transition: all 0.2s ease-in-out;
  }
  .tt-ol-menu-list li {
    transition: all 0.2s ease-in-out;
  }
  .tt-ol-menu-list > li a,
  .tt-ol-menu-list > li > .tt-ol-submenu-trigger > a {
    display: flex;
    padding: 0;
    font-size: 16px;
    font-weight: 400;
    color: var(--color-fede-fv);
    letter-spacing: 7px;
    text-transform: uppercase;
    height: 26px;
  }
  .tt-ol-menu-list > li a:hover,
  .tt-ol-menu-list > li > .tt-submenu-trigger:hover a,
  .tt-ol-menu-list > li > .tt-submenu-trigger:hover .tt-m-caret,
  .tt-ol-menu-list > li.active > a,
  .tt-ol-menu-list > li.active > .tt-submenu-trigger a,
  .tt-ol-menu-list > li.active > .tt-submenu-trigger .tt-m-caret {
    color: var(--color-fede-fv);
  }
  .tt-ol-submenu {
    margin-left: 0;
  }
  .tt-ol-submenu-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 17px;
  }
  .tt-ol-submenu-trigger {
    margin-top: 3px;
    margin-bottom: -3px;
    transition: all 0.2s ease-in-out;
  }
  .tt-ol-submenu-trigger.tt-ol-submenu-open {
    margin-bottom: 45px;
  }
  body.hide-others .tt-ol-menu-list {
    margin-top: 20px;
    gap: 0;
  }
  body.hide-others .tt-ol-submenu-wrap {
    margin: 0;
  }
  body.hide-others .tt-ol-menu-list li.common-li {
    height: 0;
    opacity: 0;
    margin: 0;
    transition: all 0.2s ease-in-out;
  }

  /* HERO */
  #page-header.ph-full {
    display: flex;
    align-items: center;
    min-height: 100dvh;
  }
  #page-header .home-title span {
    font-size: 12.8vw;
    letter-spacing: 1px;
  }
}

/* MOBILE PHONES
   ============= */
@media only screen and (max-width: 739px) {
  body.tt-boxed .tt-wrap {
    max-width: unset;
  }

  .tt-logo a {
    width: 60px;
  }
  .scroll.bottom {
    bottom: 70px;
  }
  .scroll p {
    display: none;
  }
  .pl-percent {
    font-size: 11vw !important;
  }
  h2.section-title {
    font-size: 53px;
  }
  #about .tt-wrap #hola-foto {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
  }
  #about .tt-wrap #hola-foto div:first-child {
    order: 1;
  }
  #about .tt-wrap #hola-foto .photo {
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    margin: 30px auto 0;
  }
  #about .tt-wrap #hola-foto .info {
    position: relative;
    pointer-events: none !important;
    transform: unset !important;
  }
  #about .tt-wrap #hola-foto .info p {
    text-align: center;
    color: var(--color-fede-fv);
  }
  #about .tt-wrap #hola-foto:hover .photo {
    transform: unset !important;
  }
  #works {
    padding-top: 80px;
  }
  #works .card {
    padding-top: 0;
  }
  #works .card .meta {
    flex-direction: column;
    gap: 7px;
  }
  #works .card .meta p:last-child {
    display: none;
  }
  #works .gallery {
    gap: 35px;
  }
  #services {
    padding-top: 80px;
  }
  #services .tt-row {
    width: 100%;
  }
  #services .services-container {
    width: 341px;
    gap: 40px;
  }
  #services .services-container .items {
    gap: 14px;
  }
  #services .services-container .services-buttons .buttons1 a {
    width: 156px;
    background-image: url(../img/services-button1-mob.png);
  }
  #services .services-container .services-buttons a.buttons2 {
    width: 341px;
    background-image: url(../img/button-mob.png);
  }
  #services h4 {
    margin-top: 120px;
  }

  /* WORKS */
  #content-wrap.work .title-work {
    padding-top: 120px;
  }
  #content-wrap.work .work-title h1 {
    font-size: 45px;
  }

  /* SERVICES */
  /* #services [class*="tt-col-"],
  #contact [class*="tt-col-"] {
    padding-left: 25px;
    padding-right: 25px;
  } */
  #services .words-container {
    width: 100%;
    margin: -5px auto 45px;
  }

  /* TESTIMONIALS */
  .carousel {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
    overflow: unset;
    padding: 50px 0;
  }
  .stage {
    height: unset;
    overflow: visible;
    perspective: unset;
    transform-style: unset;
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 341px;
  }
  .verbatim,
  .verbatim.hidden {
    transform: unset !important;
    filter: unset !important;
    box-shadow: rgba(0, 0, 0, 0.06) 0px 0px 16px !important;
    opacity: 1 !important;
    z-index: 1;
    position: relative;
    top: unset !important;
    left: unset !important;
    width: 100%;
    transform-origin: center center;
    will-change: transform, filter;
    border-radius: 7px;
    padding: 32px;
    height: 100%;
    gap: 14px;
    flex-direction: column;
  }
  .verbatim img {
    width: 62px;
    height: 62px;
    margin: 0;
  }
  .verbatim p {
    margin: 0;
    padding: 0;
  }
  .verbatim p:first-child {
    position: absolute;
    transform: translate(76px, -69px);
  }
  .verbatim p span {
    display: flex;
    flex-direction: column;
    margin-bottom: 4px;
  }

  /* CONTACT */
  body.tt-boxed #contact .tt-wrap {
    width: 341px;
  }
  #contact .tt-col-md-6 {
    width: 100%;
    max-width: 100%;
  }
  #contact form .field:nth-child(3) {
    display: none;
  }
  #contact h3 {
    text-align: center;
  }
  footer#contact .btn {
    width: 341px;
    background-image: url(../img/button-mob.png);
  }
  footer#contact .socials {
    transform: unset;
    justify-content: center;
    margin-bottom: 75px;
  }
  footer#contact .footer-bottom-full,
  footer#contact .footer-bottom-cut {
    height: 87.22vw;
    -webkit-mask-image: url("../img/footer_lets-build-mob.svg");
    mask-image: url("../img/footer_lets-build-mob.svg");
  }
  footer#contact {
    padding-bottom: 88.22vw !important;
  }
}