/* ========================================================================
   INOFE PREMIUM FRAMEWORK
   Archivo: responsive.css
   Versión: 1.0.0
   Descripción:
   Ajustes globales para escritorio, portátil, tableta y teléfono.
   ======================================================================== */


/* ==========================================================
   1. ESCRITORIO MEDIANO
   Hasta 1440 px
   ========================================================== */

@media (max-width: 1440px) {

  .inofe-container {
    width: min(
      calc(100% - 48px),
      var(--container-lg)
    );
  }

  .inofe-section {
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
  }

  .inofe-section--lg {
    padding-top: 7rem;
    padding-bottom: 7rem;
  }

  .inofe-grid {
    gap: 1.75rem;
  }
}


/* ==========================================================
   2. PORTÁTILES Y TABLETAS HORIZONTALES
   Hasta 1200 px
   ========================================================== */

@media (max-width: 1200px) {

  .inofe-container {
    width: min(
      calc(100% - 40px),
      var(--container-md)
    );
  }

  .inofe-section {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

  .inofe-section--sm {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .inofe-section--lg {
    padding-top: 6.5rem;
    padding-bottom: 6.5rem;
  }

  .inofe-section-header {
    margin-bottom: 3.25rem;
  }

  .inofe-grid--5 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .inofe-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inofe-btn--lg {
    min-height: 58px;
    padding-right: 34px;
    padding-left: 34px;
  }
}


/* ==========================================================
   3. TABLETAS
   Hasta 1024 px
   ========================================================== */

@media (max-width: 1024px) {

  .inofe-container {
    width: min(
      calc(100% - 36px),
      960px
    );
  }

  .inofe-section {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
  }

  .inofe-section--lg {
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
  }

  .inofe-section-header {
    max-width: 760px;
  }

  .inofe-section-description {
    font-size: 1.05rem;
  }

  .inofe-grid--5,
  .inofe-grid--4,
  .inofe-grid--3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inofe-grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inofe-gap--lg {
    gap: 2.5rem;
  }

  .inofe-card__body {
    padding: 22px;
  }

  .inofe-card__title {
    font-size: 1.12rem;
  }

  .inofe-icon-box {
    gap: 14px;
  }

  .inofe-icon-box__icon {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
  }
}


/* ==========================================================
   4. TABLETAS VERTICALES
   Hasta 768 px
   ========================================================== */

@media (max-width: 768px) {

  .inofe-container {
    width: calc(100% - 32px);
  }

  .inofe-section {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .inofe-section--sm {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .inofe-section--lg {
    padding-top: 4.75rem;
    padding-bottom: 4.75rem;
  }

  .inofe-section-header {
    max-width: 650px;
    margin-bottom: 2.75rem;
  }

  .inofe-section-header--left {
    text-align: left;
  }

  .inofe-section-title {
    font-size: clamp(2rem, 7vw, 2.8rem);
  }

  .inofe-section-description {
    font-size: 1rem;
    line-height: 1.65;
  }

  .inofe-eyebrow {
    font-size: 0.78rem;
    letter-spacing: 0.9px;
  }

  .inofe-eyebrow::before {
    width: 30px;
  }

  .inofe-grid,
  .inofe-grid--2,
  .inofe-grid--3,
  .inofe-grid--4,
  .inofe-grid--5 {
    grid-template-columns: 1fr;
  }

  .inofe-grid--auto {
    grid-template-columns:
      repeat(
        auto-fit,
        minmax(min(100%, 230px), 1fr)
      );
  }

  .inofe-grid {
    gap: 1.5rem;
  }

  .inofe-gap--lg {
    gap: 2rem;
  }

  .inofe-flex--between {
    align-items: flex-start;
    flex-direction: column;
    gap: 1.25rem;
  }

  .inofe-btn {
    min-height: 52px;
    padding-right: 28px;
    padding-left: 28px;
  }

  .inofe-btn--lg {
    min-height: 56px;
    padding-right: 30px;
    padding-left: 30px;
    font-size: 1rem;
  }

  .inofe-card {
    border-radius: var(--radius-md);
  }

  .inofe-card__body {
    padding: 21px;
  }

  .inofe-card__title {
    font-size: 1.1rem;
  }

  .inofe-card__text {
    font-size: 0.94rem;
  }

  .inofe-icon-box {
    align-items: flex-start;
  }

  .inofe-form-control {
    min-height: 52px;
  }

  textarea.inofe-form-control {
    min-height: 125px;
  }
}


/* ==========================================================
   5. TELÉFONOS GRANDES
   Hasta 640 px
   ========================================================== */

@media (max-width: 640px) {

  .inofe-container {
    width: calc(100% - 28px);
  }

  .inofe-section {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .inofe-section--sm {
    padding-top: 2.75rem;
    padding-bottom: 2.75rem;
  }

  .inofe-section--lg {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .inofe-section-header {
    margin-bottom: 2.4rem;
  }

  .inofe-section-title {
    margin-bottom: 12px;
    font-size: clamp(1.85rem, 8vw, 2.45rem);
  }

  .inofe-section-description {
    font-size: 0.96rem;
  }

  .inofe-eyebrow {
    justify-content: center;
  }

  .inofe-section-header--left .inofe-eyebrow {
    justify-content: flex-start;
  }

  .inofe-grid {
    gap: 1.25rem;
  }

  .inofe-btn,
  .inofe-btn--sm,
  .inofe-btn--lg {
    width: 100%;
    min-height: 52px;
    padding-right: 22px;
    padding-left: 22px;
  }

  .inofe-btn--square {
    width: 52px;
    min-width: 52px;
    padding: 0;
  }

  .inofe-card {
    border-radius: 16px;
  }

  .inofe-card__body {
    padding: 20px;
  }

  .inofe-badge {
    min-height: 29px;
    padding: 4px 11px;
  }

  .inofe-icon-box {
    gap: 13px;
  }

  .inofe-icon-box__icon {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
  }

  .inofe-icon-box__icon svg {
    width: 24px;
    height: 24px;
  }

  .inofe-icon-box__title {
    font-size: 1rem;
  }

  .inofe-icon-box__text {
    font-size: 0.84rem;
  }

  .inofe-form-group {
    margin-bottom: 17px;
  }

  .inofe-form-control {
    min-height: 50px;
    padding: 11px 14px;
  }

  .inofe-divider {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }
}


/* ==========================================================
   6. TELÉFONOS PEQUEÑOS
   Hasta 480 px
   ========================================================== */

@media (max-width: 480px) {

  .inofe-container {
    width: calc(100% - 24px);
  }

  .inofe-section {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .inofe-section--sm {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .inofe-section--lg {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .inofe-section-header {
    margin-bottom: 2rem;
  }

  .inofe-section-title {
    font-size: clamp(1.75rem, 9vw, 2.2rem);
  }

  .inofe-section-description {
    font-size: 0.93rem;
  }

  .inofe-eyebrow {
    gap: 8px;
    font-size: 0.72rem;
  }

  .inofe-eyebrow::before {
    width: 25px;
    height: 2px;
  }

  .inofe-card__body {
    padding: 18px;
  }

  .inofe-card__title {
    font-size: 1.05rem;
  }

  .inofe-card__text {
    font-size: 0.9rem;
  }

  .inofe-btn {
    min-height: 50px;
    font-size: 0.93rem;
  }

  .inofe-btn svg {
    width: 19px;
    height: 19px;
  }

  .inofe-icon-box {
    gap: 11px;
  }

  .inofe-icon-box__icon {
    width: 43px;
    height: 43px;
    flex-basis: 43px;
  }

  .inofe-text-center--mobile {
    text-align: center;
  }

  .inofe-hidden--mobile {
    display: none !important;
  }

  .inofe-block--mobile {
    display: block !important;
  }

  .inofe-width-full--mobile {
    width: 100% !important;
  }
}


/* ==========================================================
   7. TELÉFONOS MUY PEQUEÑOS
   Hasta 360 px
   ========================================================== */

@media (max-width: 360px) {

  .inofe-container {
    width: calc(100% - 20px);
  }

  .inofe-section {
    padding-top: 2.75rem;
    padding-bottom: 2.75rem;
  }

  .inofe-section-title {
    font-size: 1.72rem;
  }

  .inofe-section-description {
    font-size: 0.9rem;
  }

  .inofe-btn {
    padding-right: 17px;
    padding-left: 17px;
    font-size: 0.88rem;
  }

  .inofe-card__body {
    padding: 16px;
  }
}


/* ==========================================================
   8. ORIENTACIÓN HORIZONTAL EN MÓVILES
   ========================================================== */

@media (
  max-width: 900px
) and (
  orientation: landscape
) {

  .inofe-section {
    padding-top: 3.25rem;
    padding-bottom: 3.25rem;
  }

  .inofe-section--lg {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .inofe-grid--3,
  .inofe-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* ==========================================================
   9. DISPOSITIVOS TÁCTILES
   ========================================================== */

@media (hover: none) and (pointer: coarse) {

  .inofe-card:hover,
  .inofe-hover-lift:hover,
  .inofe-hover-glow:hover {
    transform: none;
  }

  .inofe-card:hover .inofe-card__media img,
  .inofe-hover-zoom:hover img {
    transform: none;
  }

  .inofe-btn:hover {
    transform: none;
  }

  .inofe-shine:hover::before {
    left: -80%;
  }
}


/* ==========================================================
   10. PANTALLAS DE ALTA RESOLUCIÓN
   ========================================================== */

@media (min-width: 1800px) {

  .inofe-container {
    max-width: var(--container-xxl);
  }

  .inofe-section {
    padding-top: 7rem;
    padding-bottom: 7rem;
  }

  .inofe-section--lg {
    padding-top: 9rem;
    padding-bottom: 9rem;
  }

  .inofe-grid {
    gap: 2.25rem;
  }
}

/* ==========================================================
   11. RESPONSIVE: OFERTA ACADÉMICA PREMIUM 2.0
   ========================================================== */

@media (max-width: 1400px) {

  .oferta-principal {
    width: calc(100% + 70px);
    margin-right: -35px;
    margin-left: -35px;
  }

  .oferta-principal > .inofe-container {
    width: calc(100% - 36px);
  }

  .inofe-program-card__media {
    height: 295px;
  }

  .inofe-framework .inofe-program-card__title {
    font-size: 1.08rem;
  }
}

@media (max-width: 1200px) {

  .inofe-program-card__media {
    height: 285px;
  }

  .inofe-program-card__body {
    min-height: 285px;
    padding: 20px;
  }

  .inofe-program-card__heading {
    right: 16px;
    bottom: 16px;
    left: 16px;
  }

  .inofe-framework .inofe-program-card__title {
    font-size: 1rem;
  }
}

@media (max-width: 1024px) {

  .oferta-principal {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }

  .oferta-principal > .inofe-container {
    width: calc(100% - 32px);
  }

  .inofe-programs__grid.inofe-grid--4,
  .inofe-programs__grid.inofe-grid--3 {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .inofe-program-card__media {
    height: 350px;
  }

  .inofe-program-card__body {
    min-height: 245px;
  }

  .inofe-framework .inofe-program-card__title {
    font-size: 1.38rem;
    -webkit-line-clamp: 2;
  }
}

@media (max-width: 768px) {

  .oferta-principal > .inofe-container {
    width: calc(100% - 28px);
  }

  .inofe-programs__grid.inofe-grid--2,
  .inofe-programs__grid.inofe-grid--3,
  .inofe-programs__grid.inofe-grid--4 {
    grid-template-columns: 1fr;
  }

  .inofe-program-card {
    max-width: 620px;
    margin-right: auto;
    margin-left: auto;
  }

  .inofe-program-card__media {
    height: 380px;
  }

  .inofe-program-card__body {
    min-height: auto;
    padding: 24px;
  }

  .inofe-framework .inofe-program-card__title {
    font-size: 1.48rem;
    -webkit-line-clamp: 2;
  }

  .inofe-program-card__description {
    -webkit-line-clamp: initial;
  }
}

@media (max-width: 640px) {

  .inofe-program-card__media {
    height: 325px;
  }

  .inofe-program-card__heading {
    right: 16px;
    bottom: 16px;
    left: 16px;
  }

  .inofe-framework .inofe-program-card__title {
    font-size: 1.3rem;
  }

  .inofe-program-card__body {
    padding: 21px;
  }
}

@media (max-width: 480px) {

  .oferta-principal > .inofe-container {
    width: calc(100% - 20px);
  }

  .inofe-program-card {
    border-radius: 17px;
  }

  .inofe-program-card__media {
    height: 275px;
  }

  .inofe-program-card__badge {
    top: 13px;
    left: 13px;
    min-height: 28px;
    padding: 5px 10px;
    font-size: 0.68rem;
  }

  .inofe-program-card__heading {
    right: 14px;
    bottom: 14px;
    left: 14px;
  }

  .inofe-framework .inofe-program-card__title {
    font-size: 1.16rem;
    -webkit-line-clamp: 3;
  }

  .inofe-program-card__body {
    padding: 19px;
  }

  .inofe-program-card__description {
    font-size: 0.89rem;
  }
}

/* ==========================================================
   12. IMPRESIÓN
   ========================================================== */

@media print {

  .inofe-framework {
    color: #000000 !important;
    background: #ffffff !important;
  }

  .inofe-section,
  .inofe-section--dark,
  .inofe-section--light,
  .inofe-section--white {
    padding-top: 20px;
    padding-bottom: 20px;
    color: #000000 !important;
    background: #ffffff !important;
  }

  .inofe-card {
    break-inside: avoid;
    border: 1px solid #cccccc;
    box-shadow: none;
  }

  .inofe-btn,
  .inofe-loader,
  .inofe-hidden--print {
    display: none !important;
  }

  .inofe-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ==========================================================
   RESPONSIVE DEFINITIVO: BENEFICIOS PORTADA
   ========================================================== */

@media (max-width: 1400px) {

  .beneficios-portada {
    width: calc(100% + 70px);
    margin-right: -35px;
    margin-left: -35px;
  }

  .beneficios-portada > .inofe-container {
    width: calc(100% - 36px);
  }

  .beneficios-portada .inofe-benefits__layout {
    grid-template-columns:
      minmax(350px, 0.9fr)
      minmax(0, 1.1fr);
    gap: 3rem;
  }

  .inofe-framework .inofe-benefits__title {
    font-size: clamp(2.15rem, 3vw, 3.3rem);
  }
}

@media (max-width: 1200px) {

  .beneficios-portada .inofe-benefits__layout {
    grid-template-columns:
      minmax(330px, 0.86fr)
      minmax(0, 1.14fr);
    gap: 2.5rem;
  }

  .beneficios-portada .inofe-benefits__list {
    grid-template-columns: 1fr;
  }

  .beneficios-portada .inofe-benefits__item {
    min-height: auto;
  }

  .beneficios-portada .inofe-benefits__image-wrap,
  .beneficios-portada .inofe-benefits__image,
  .beneficios-portada .inofe-benefits__placeholder {
    min-height: 640px;
  }
}

@media (max-width: 1024px) {

  .beneficios-portada {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }

  .beneficios-portada > .inofe-container {
    width: calc(100% - 32px);
  }

  .beneficios-portada .inofe-benefits__layout,
  .beneficios-portada
  .inofe-benefits__layout--image-right {
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  .beneficios-portada .inofe-benefits__visual {
    width: min(100%, 760px);
    margin: 0 auto;
  }

  .beneficios-portada .inofe-benefits__content {
    width: min(100%, 900px);
    margin: 0 auto;
  }

  .beneficios-portada .inofe-benefits__list {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .inofe-framework .inofe-benefits__title {
    max-width: 760px;
    margin-right: auto;
    margin-left: auto;
    font-size: clamp(2.2rem, 6vw, 3.4rem);
  }
}

@media (max-width: 768px) {

  .beneficios-portada > .inofe-container {
    width: calc(100% - 28px);
  }

  .beneficios-portada .inofe-benefits__list {
    grid-template-columns: 1fr;
  }

  .beneficios-portada .inofe-benefits__image-wrap,
  .beneficios-portada .inofe-benefits__image,
  .beneficios-portada .inofe-benefits__placeholder {
    min-height: 540px;
  }

  .inofe-framework .inofe-benefits__title {
    font-size: clamp(2rem, 8vw, 2.8rem);
  }
}

@media (max-width: 480px) {

  .beneficios-portada > .inofe-container {
    width: calc(100% - 20px);
  }

  .beneficios-portada .inofe-benefits__image-wrap,
  .beneficios-portada .inofe-benefits__image,
  .beneficios-portada .inofe-benefits__placeholder {
    min-height: 390px;
  }

  .inofe-framework .inofe-benefits__title {
    font-size: 2rem;
  }

  .beneficios-portada .inofe-benefits__item {
    padding: 15px;
  }
}

/* ==========================================================
   RESPONSIVE: METODOLOGÍA PREMIUM
   ========================================================== */

@media (max-width: 1400px) {

  .inofe-methodology__layout {
    grid-template-columns:
      minmax(0, 1.08fr)
      minmax(350px, 0.92fr);
    gap: 4rem;
  }

  .inofe-methodology__image-wrap,
  .inofe-methodology__image,
  .inofe-methodology__placeholder {
    min-height: 660px;
  }

  .inofe-framework .inofe-methodology__title {
    font-size: clamp(2.25rem, 3.2vw, 3.55rem);
  }
}

@media (max-width: 1200px) {

  .inofe-methodology__layout {
    grid-template-columns:
      minmax(0, 1.1fr)
      minmax(320px, 0.9fr);
    gap: 2.8rem;
  }

  .inofe-methodology__image-wrap,
  .inofe-methodology__image,
  .inofe-methodology__placeholder {
    min-height: 620px;
  }

  .inofe-methodology__floating-card {
    right: -15px;
  }
}

@media (max-width: 1024px) {

  .inofe-methodology__layout,
  .inofe-methodology__layout--image-left {
    grid-template-columns: 1fr;
    gap: 3.5rem;
  }

  .inofe-methodology__layout--image-left
  .inofe-methodology__visual,
  .inofe-methodology__layout--image-left
  .inofe-methodology__content {
    order: initial;
  }

  .inofe-methodology__content {
    width: min(100%, 900px);
    margin: 0 auto;
  }

  .inofe-methodology__visual {
    position: relative;
    top: auto;
    width: min(100%, 760px);
    margin: 0 auto;
  }

  .inofe-methodology__image-wrap,
  .inofe-methodology__image,
  .inofe-methodology__placeholder {
    min-height: 650px;
  }

  .inofe-methodology__header {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
  }

  .inofe-methodology__header
  .inofe-eyebrow {
    justify-content: center;
  }

  .inofe-framework .inofe-methodology__description {
    margin-right: auto;
    margin-left: auto;
  }

  .inofe-methodology__actions {
    justify-content: center;
  }
}

@media (max-width: 768px) {

  .inofe-methodology__steps::before {
    left: 28px;
  }

  .inofe-methodology__step {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 15px;
    padding: 17px;
  }

  .inofe-methodology__step-marker {
    width: 58px;
    min-height: 76px;
  }

  .inofe-methodology__image-wrap,
  .inofe-methodology__image,
  .inofe-methodology__placeholder {
    min-height: 550px;
  }

  .inofe-methodology__floating-card {
    right: 15px;
    bottom: 85px;
  }
}

@media (max-width: 640px) {

  .inofe-framework .inofe-methodology__title {
    font-size: clamp(2rem, 8vw, 2.75rem);
  }

  .inofe-methodology__step {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 13px;
    padding: 15px;
  }

  .inofe-methodology__steps::before {
    left: 25px;
  }

  .inofe-methodology__step-marker {
    width: 52px;
    min-height: 70px;
  }

  .inofe-methodology__step-icon svg {
    width: 22px;
    height: 22px;
  }

  .inofe-methodology__image-wrap,
  .inofe-methodology__image,
  .inofe-methodology__placeholder {
    min-height: 470px;
  }

  .inofe-methodology__actions {
    flex-direction: column;
  }

  .inofe-methodology__actions
  .inofe-btn {
    width: 100%;
  }

  .inofe-methodology__floating-card {
    width: 125px;
    min-height: 105px;
  }

  .inofe-methodology__floating-card strong {
    font-size: 2.2rem;
  }
}

@media (max-width: 480px) {

  .inofe-methodology__step {
    grid-template-columns: 1fr;
  }

  .inofe-methodology__steps::before {
    display: none;
  }

  .inofe-methodology__step-marker {
    width: 100%;
    min-height: 58px;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    padding: 0 15px;
  }

  .inofe-methodology__step-content {
    padding-top: 0;
  }

  .inofe-framework .inofe-methodology__step-title {
    font-size: 1rem;
  }

  .inofe-methodology__image-wrap,
  .inofe-methodology__image,
  .inofe-methodology__placeholder {
    min-height: 400px;
  }

  .inofe-methodology__image-wrap {
    border-radius: 18px;
  }

  .inofe-methodology__image-badge {
    top: 14px;
    left: 14px;
  }

  .inofe-methodology__image-caption {
    right: 14px;
    bottom: 14px;
    left: 14px;
    padding: 14px;
    font-size: 0.84rem;
  }

  .inofe-methodology__floating-card {
    display: none;
  }
}

/* ==========================================================
   RESPONSIVE: GALERÍA DE EXPERIENCIAS
   ========================================================== */

@media (max-width: 1200px) {

  .inofe-gallery__grid {
    grid-auto-rows: 155px;
    gap: 16px;
  }
}

@media (max-width: 1024px) {

  .inofe-gallery__item--1,
  .inofe-gallery__item--2,
  .inofe-gallery__item--3,
  .inofe-gallery__item--4,
  .inofe-gallery__item--5,
  .inofe-gallery__item--6,
  .inofe-gallery__item--7,
  .inofe-gallery__item--8,
  .inofe-gallery__item--9,
  .inofe-gallery__item--10 {
    grid-column: span 6;
    grid-row: span 2;
  }

  .inofe-gallery__grid {
    grid-auto-rows: 180px;
  }
}

@media (max-width: 768px) {

  .inofe-gallery__grid {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: 18px;
  }

  .inofe-gallery__item--1,
  .inofe-gallery__item--2,
  .inofe-gallery__item--3,
  .inofe-gallery__item--4,
  .inofe-gallery__item--5,
  .inofe-gallery__item--6,
  .inofe-gallery__item--7,
  .inofe-gallery__item--8,
  .inofe-gallery__item--9,
  .inofe-gallery__item--10 {
    grid-column: auto;
    grid-row: auto;
    min-height: 390px;
  }

  .inofe-gallery__zoom {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 640px) {

  .inofe-gallery__item--1,
  .inofe-gallery__item--2,
  .inofe-gallery__item--3,
  .inofe-gallery__item--4,
  .inofe-gallery__item--5,
  .inofe-gallery__item--6,
  .inofe-gallery__item--7,
  .inofe-gallery__item--8,
  .inofe-gallery__item--9,
  .inofe-gallery__item--10 {
    min-height: 340px;
  }

  .inofe-gallery__caption {
    right: 17px;
    bottom: 17px;
    left: 17px;
  }

  .inofe-framework .inofe-gallery__title {
    font-size: 1.2rem;
  }
}

@media (max-width: 480px) {

  .inofe-gallery__item {
    border-radius: 17px;
  }

  .inofe-gallery__item--1,
  .inofe-gallery__item--2,
  .inofe-gallery__item--3,
  .inofe-gallery__item--4,
  .inofe-gallery__item--5,
  .inofe-gallery__item--6,
  .inofe-gallery__item--7,
  .inofe-gallery__item--8,
  .inofe-gallery__item--9,
  .inofe-gallery__item--10 {
    min-height: 295px;
  }

  .inofe-gallery__category {
    top: 13px;
    left: 13px;
    min-height: 28px;
    padding: 4px 10px;
    font-size: 0.67rem;
  }

  .inofe-gallery__zoom {
    top: 13px;
    right: 13px;
    width: 36px;
    height: 36px;
  }

  .inofe-gallery__text {
    font-size: 0.79rem;
  }

  .inofe-gallery-lightbox {
    padding: 12px;
  }
}

/* ==========================================================
   RESPONSIVE: TESTIMONIOS PREMIUM
   ========================================================== */

@media (max-width: 1400px) {

  .inofe-testimonials__slides,
  .inofe-testimonial-slide,
  .inofe-testimonial-slide__visual,
  .inofe-testimonial-slide__visual img,
  .inofe-testimonial-slide__visual-placeholder {
    min-height: 580px;
  }

  .inofe-testimonial-slide__content {
    padding:
      4.5rem
      3.8rem
      7rem;
  }

  .inofe-testimonial-slide__quote p {
    font-size: clamp(1.45rem, 2.1vw, 2.15rem);
  }
}

@media (max-width: 1200px) {

  .inofe-testimonial-slide {
    grid-template-columns:
      minmax(0, 1.15fr)
      minmax(320px, 0.85fr);
  }

  .inofe-testimonial-slide__content {
    padding:
      4rem
      3rem
      7rem;
  }

  .inofe-testimonials__navigation {
    right: calc(42% + 24px);
    left: 30px;
  }
}

@media (max-width: 1024px) {

  .inofe-testimonial-slide {
    grid-template-columns: 1fr;
  }

  .inofe-testimonials__slides,
  .inofe-testimonial-slide {
    min-height: auto;
  }

  .inofe-testimonial-slide__content {
    min-height: 500px;
    padding:
      4.5rem
      3.5rem
      7.5rem;
  }

  .inofe-testimonial-slide__visual,
  .inofe-testimonial-slide__visual img,
  .inofe-testimonial-slide__visual-placeholder {
    min-height: 500px;
  }

  .inofe-testimonials__navigation {
    right: 35px;
    bottom: calc(500px + 28px);
    left: 35px;
  }

  .inofe-testimonials__quote-mark {
    top: 26px;
    left: 32px;
  }
}

@media (max-width: 768px) {

  .inofe-testimonials__slider {
    border-radius: 23px;
  }

  .inofe-testimonial-slide__content {
    min-height: 485px;
    padding:
      4rem
      2.4rem
      7rem;
  }

  .inofe-testimonial-slide__quote p {
    font-size: clamp(1.3rem, 4.5vw, 1.75rem);
  }

  .inofe-testimonial-slide__visual,
  .inofe-testimonial-slide__visual img,
  .inofe-testimonial-slide__visual-placeholder {
    min-height: 430px;
  }

  .inofe-testimonials__navigation {
    right: 25px;
    bottom: calc(430px + 24px);
    left: 25px;
  }

  .inofe-testimonials__quote-mark svg {
    width: 105px;
  }
}

@media (max-width: 640px) {

  .inofe-testimonial-slide__content {
    min-height: 500px;
    padding:
      3.7rem
      1.6rem
      6.7rem;
  }

  .inofe-testimonial-slide__rating {
    margin-bottom: 18px;
  }

  .inofe-testimonial-slide__quote p {
    font-size: 1.3rem;
    line-height: 1.45;
  }

  .inofe-testimonial-slide__result {
    margin-top: 21px;
    font-size: 0.76rem;
  }

  .inofe-testimonial-slide__author {
    margin-top: 25px;
  }

  .inofe-testimonial-slide__visual,
  .inofe-testimonial-slide__visual img,
  .inofe-testimonial-slide__visual-placeholder {
    min-height: 370px;
  }

  .inofe-testimonials__navigation {
    right: 18px;
    bottom: calc(370px + 21px);
    left: 18px;
  }

  .inofe-testimonials__dots {
    gap: 6px;
  }
}

@media (max-width: 480px) {

  .inofe-testimonials__slider {
    border-radius: 18px;
  }

  .inofe-testimonial-slide__content {
    min-height: 520px;
    padding:
      3.5rem
      1.25rem
      6.5rem;
  }

  .inofe-testimonial-slide__quote p {
    font-size: 1.18rem;
  }

  .inofe-testimonial-slide__result {
    align-items: flex-start;
    border-radius: 14px;
  }

  .inofe-testimonial-slide__avatar {
    width: 52px;
    height: 52px;
    flex-basis: 52px;
  }

  .inofe-testimonial-slide__visual,
  .inofe-testimonial-slide__visual img,
  .inofe-testimonial-slide__visual-placeholder {
    min-height: 320px;
  }

  .inofe-testimonials__navigation {
    right: 14px;
    bottom: calc(320px + 16px);
    left: 14px;
  }

  .inofe-testimonials__arrow {
    width: 40px;
    height: 40px;
  }

  .inofe-testimonials__dots
  .inofe-slider-dot {
    width: 8px;
    height: 8px;
  }

  .inofe-testimonials__dots
  .inofe-slider-dot.is-active {
    width: 22px;
  }

  .inofe-testimonial-slide__program-badge {
    right: 14px;
    bottom: 14px;
    left: 14px;
  }
}