/* Inboxino home — mobile (Figma 375). Desktop untouched. */
@media screen and (max-width: 767px) {
  /**
   * Inboxino home — mobile (Figma 375)
   * Loaded only via media="screen and (max-width: 767px)".
   * Do not put desktop rules here.
   */

  html,
  body.inboxino-home,
  .ih-page {
    width: 100%;
    max-width: 100%;
  }

  .ih-wrap {
    width: calc(100% - 32px);
    margin-inline: auto;
  }

  .ih-section-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: -0.8px;
  }

  .ih-section-sub {
    font-size: 14px;
    line-height: 20px;
    color: #434955;
  }

  .ih-btn {
    width: 100%;
    max-width: 100%;
    height: 44px;
    min-height: 44px;
    padding: 12px 16px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    white-space: nowrap;
  }

  .ih-input {
    width: 100%;
    max-width: 100%;
    height: 48px;
    border-radius: 12px;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 20px;
  }

  .ih-lead > .ih-wrap,
  .ih-cta .ih-wrap {
    align-items: stretch;
  }

  .ih-lead-form {
    display: flex;
    flex-direction: column;
    width: auto;
    align-self: stretch;
  }

  .ih-lead-row,
  .ih-lead-field,
  .ih-lead-field .ih-input,
  .ih-input,
  .ih-lead-form .ih-btn {
    width: 100%;
    max-width: none;
    min-width: 0;
    box-sizing: border-box;
    align-self: stretch;
  }

  .ih-lead-row {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 12px;
  }

  .ih-lead-field {
    flex: 0 0 auto;
  }

  .ih-lead-form .ih-btn {
    display: flex;
    height: 44px;
    min-height: 44px;
    font-size: 14px;
    line-height: 20px;
  }

  /* —— Header — Figma 689:7567 (same frosted bar as desktop) —— */
  .ih-header {
    background: transparent;
  }

  .ih-header::before {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    border-bottom: 1px solid #f2f2f3;
    box-shadow: 0 4px 16.5px rgba(0, 0, 0, 0.07);
  }

  .ih-header .ih-wrap.ih-header__inner {
    width: calc(100% - 32px);
    max-width: none;
    margin-inline: auto;
    padding-inline: 0;
    gap: 8px;
  }

  .ih-header .ih-nav {
    display: none !important;
  }

  .ih-header__end {
    gap: 10.776px;
  }

  .ih-page .ih-logo {
    gap: 11px;
    height: 40px;
  }

  .ih-page .ih-logo .ih-logo__word {
    width: 85px;
    height: 15px;
  }

  .ih-page .ih-logo .ih-logo__mark {
    width: 35px;
    height: 40px;
  }

  .ih-burger {
    display: block !important;
    width: 29px;
    height: 29px;
    border: 0;
    border-radius: 0;
    background: transparent;
  }

  .ih-header__actions .ih-btn {
    width: auto;
    height: 35px;
    min-height: 35px;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    white-space: nowrap;
    box-shadow: var(--ih-btn-shadow);
  }

  .ih-login-desk {
    display: none;
  }

  .ih-login-mob {
    display: inline;
  }

  .ih-logo {
    flex-shrink: 0;
  }

  /* —— Hero — Figma 47:2278 (375×693, clipsContent). Image 343.31² hangs 65.31px and is clipped. —— */
  .ih-hero {
    height: auto;
    padding: 114.5px 0 0;
    overflow: hidden;
    display: block;
  }

  .ih-hero::before {
    width: 404px;
    height: 665px;
    background-size: 404px 665px;
    background-position: center top;
    opacity: 0.55;
  }

  .ih-hero__inner {
    flex-direction: column !important;
    align-items: center;
    justify-content: flex-start;
    gap: 60px;
    min-height: 0;
    padding-bottom: 0;
  }

  .ih-hero__copy {
    order: -1;
    width: 100%;
    max-width: 343px;
    align-items: stretch;
    text-align: right;
    gap: 24px;
  }

  .ih-hero__copy > div {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
  }

  /* Figma 47:2281 H3 mobile: 32/42, tracking -4%. 47:2282 Lg-Regular: 16/24. 47:2283 Base-Medium: 14/20. */
  .ih-hero__copy h1 {
    margin: 0;
    font-size: 32px;
    line-height: 42px;
    letter-spacing: -0.04em;
    text-align: right;
    font-weight: 710;
  }

  .ih-hero__title-line {
    letter-spacing: -0.04em;
  }

  .ih-hero__copy p {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    text-align: right;
    color: #131215;
  }

  .ih-hero__copy .ih-btn {
    width: 100%;
    max-width: 343px;
    height: 44px;
    min-height: 44px;
    padding: 12px 16px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
  }

  .ih-hero__visual {
    width: 343.31px;
    max-width: 343.31px;
    flex: 0 0 auto;
    height: 343.31px;
    aspect-ratio: 1 / 1;
    margin: 0 0 -65.31px;
    position: relative;
    overflow: visible;
  }

  /* Figma 526:13524 is 564×564; 2x export is 1128×1428 (overflow). Instance 343.31. */
  .ih-hero__art,
  .ih-page img.ih-hero__art {
    position: absolute;
    left: 0;
    top: -6.27px;
    width: 343.31px;
    height: 434.61px;
    max-width: none;
    object-fit: fill;
    object-position: top left;
  }

  /* —— Features — Figma mobile: horizontal snap track —— */
  .ih-features {
    padding: 86px 0;
    overflow-x: hidden;
    min-height: 0;
  }

  .ih-features__mobile .ih-section-title {
    margin-bottom: 40px;
    padding-inline: 0;
  }

  .ih-features__mobile > .ih-wrap {
    width: auto;
    max-width: none;
    margin-inline: 16px;
  }

  .ih-features__stage {
    display: none !important;
  }

  .ih-features__mobile {
    display: block;
    position: relative;
    top: auto;
    height: auto;
    padding: 0;
    background: transparent;
  }

  .ih-features__track {
    display: flex;
    flex-wrap: nowrap;
    gap: 24px;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 16px;
    -webkit-overflow-scrolling: touch;
    padding: 8px 0 16px;
    scrollbar-width: none;
  }

  .ih-features__track::-webkit-scrollbar {
    display: none;
  }

  .ih-features__slide {
    flex: 0 0 331px;
    width: 331px;
    max-width: calc(100vw - 32px);
    scroll-snap-align: start;
    scroll-margin-inline: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .ih-features__slide:first-child {
    margin-inline-start: 16px;
  }

  .ih-features__slide:last-child {
    margin-inline-end: 16px;
  }

  /* Figma PhoneUI-Image 273.131×440; 2x export includes iPhone overflow (x=-4.59, y=-3.71) */
  .ih-features__slide-phone {
    position: relative;
    width: 273.13px;
    max-width: none;
    height: 440px;
    flex-shrink: 0;
    overflow: visible;
  }

  .ih-features__slide-img,
  .ih-page .ih-features__slide-phone img {
    position: absolute;
    left: -4.59px;
    top: -3.71px;
    display: block;
    width: var(--ih-phone-w, 278px);
    height: var(--ih-phone-h, 448px);
    max-width: none;
    object-fit: fill;
    object-position: top left;
  }

  .ih-features__slide-body {
    width: 100%;
    padding: 8px 8px 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    text-align: right;
    align-items: flex-end;
  }

  .ih-features__slide-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 8px;
    width: 100%;
    direction: rtl;
  }

  .ih-features__slide-titles {
    flex: 1;
    min-width: 0;
  }

  .ih-features__slide-titles h3 {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #131215;
  }

  .ih-features__slide-titles p {
    margin: 0;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    color: #c06d19;
  }

  .ih-features__slide-icon {
    width: 37px;
    height: 37px;
    flex-shrink: 0;
  }

  .ih-features__slide-text {
    margin: 0;
    width: 100%;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    color: #434955;
  }

  .ih-features__slide .ih-platforms {
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    direction: rtl;
  }

  .ih-features__slide .ih-platforms__item {
    direction: ltr;
    flex-direction: row;
  }

  .ih-features__mobile-cta {
    padding: 40px 16px 0;
  }

  .ih-features__mobile-cta .ih-btn {
    width: 100%;
    max-width: 343px;
    margin-inline: auto;
    display: flex;
  }

  .ih-features__row {
    flex-direction: column !important;
    align-items: center;
    gap: 40px;
  }

  .ih-features__visual {
    width: min(100%, 343px);
    max-width: 100%;
    height: auto;
    aspect-ratio: 343 / 480;
  }

  .ih-features__list {
    width: 100%;
    max-width: 343px;
    align-items: stretch;
    gap: 24px;
  }

  .ih-feat-group__title {
    text-align: right;
    width: 100%;
  }

  .ih-features__list > .ih-btn {
    margin-top: 8px;
  }

  .ih-platforms {
    justify-content: flex-start;
    direction: rtl;
  }

  /* —— Lead —— */
  .ih-lead {
    padding: 86px 0 0;
  }

  .ih-lead > .ih-wrap {
    gap: 38px;
  }

  .ih-lead__head {
    width: 100%;
    max-width: 343px;
    margin-inline: auto;
    gap: 4px;
  }

  .ih-lead__form-block {
    width: auto;
    max-width: none;
    margin-inline: 0;
    gap: 16px;
    align-self: stretch;
    align-items: stretch;
  }

  .ih-lead__note {
    font-size: 12px;
    line-height: 18px;
  }

  .ih-lead-form.is-error .ih-lead-field,
  .ih-lead-form.is-success .ih-lead-field {
    padding-bottom: 0;
  }

  .ih-lead-form.is-error .ih-lead-row,
  .ih-lead-form.is-success .ih-lead-row {
    margin-bottom: 0;
    gap: 8px;
  }

  .ih-input-error,
  .ih-input-success {
    position: static;
    top: auto;
    right: auto;
    display: none;
    margin: 8px 0 4px;
    padding: 0 4px;
    font-size: 12px;
    line-height: 18px;
    white-space: normal;
  }

  .ih-lead-form.is-error .ih-input-error,
  .ih-lead-form.is-success .ih-input-success {
    display: block;
  }

  .ih-lead__visual {
    width: 100%;
    max-width: 343px;
    margin: 0 auto;
  }

  .ih-lead__visual img,
  .ih-lead__visual picture {
    width: 100%;
    height: auto;
    display: block;
  }

  /* —— Voices carousel —— */
  .ih-voices {
    padding: 86px 16px;
  }

  .ih-voices > .ih-wrap {
    width: 100%;
    max-width: none;
    padding: 0;
  }

  .ih-voices__head {
    margin-bottom: 40px;
    padding-inline: 0;
  }

  .ih-voices .ih-section-title {
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.04em;
  }

  .ih-voices .ih-section-sub {
    font-size: 14px;
    line-height: 20px;
  }

  .ih-card__name {
    font-size: 14px;
    line-height: 20px;
  }

  .ih-card__quote {
    font-size: 12px;
    line-height: 18px;
  }

  .ih-voices__grid {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 16px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 8px;
    margin-inline: 0;
    width: 100%;
  }

  .ih-voices__grid::-webkit-scrollbar {
    display: none;
  }

  .ih-voices__grid .ih-card {
    width: 311px;
    max-width: none;
    height: 214px;
    min-height: 214px;
    flex: 0 0 311px;
    scroll-snap-align: center;
    margin-inline: 0;
  }

  /* —— Stats —— Figma 47:3043: numbers centered in 343 content —— */
  .ih-stats {
    padding: 86px 0;
    text-align: center;
  }

  .ih-stats .ih-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
  }

  .ih-stats .ih-section-title {
    color: #fff;
    width: 100%;
    max-width: 343px;
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: -0.04em;
    text-align: center;
  }

  .ih-stats .ih-stats__row {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    max-width: 343px;
    height: auto;
    min-height: 0;
    padding: 16px 0;
    box-sizing: border-box;
    margin-inline: auto;
    text-align: center;
    direction: ltr;
  }

  .ih-stats .ih-stat {
    display: flex;
    flex: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 100%;
    max-width: 343px;
    height: auto;
    min-height: 0;
    padding: 0 12px;
    gap: 8px;
    text-align: center;
  }

  .ih-stats .ih-stat__num,
  .ih-stats .ih-stat__label {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0;
    text-align: center;
  }

  .ih-stats .ih-stat__num {
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    letter-spacing: -0.04em;
  }

  .ih-stats .ih-stat__label {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
  }

  /* —— Setup — Figma 47:3059: phone flush to section bottom —— */
  .ih-setup {
    padding: 86px 0 0;
    overflow: hidden;
  }

  .ih-setup__row {
    flex-direction: column !important;
    align-items: center;
    gap: 40px;
  }

  .ih-setup__copy {
    width: 100%;
    max-width: 343px;
    align-items: flex-end;
    text-align: right;
  }

  .ih-setup__copy .ih-section-title,
  .ih-setup__copy .ih-section-sub {
    text-align: right;
    width: 100%;
  }

  .ih-setup__copy .ih-btn {
    width: 100%;
    align-self: stretch;
  }

  .ih-steps {
    width: 100%;
    align-items: stretch;
  }

  .ih-step {
    justify-content: flex-end;
  }

  .ih-setup__visual {
    width: 306px;
    max-width: 100%;
    height: 444px;
    position: relative;
    top: auto;
    order: 1;
    margin-bottom: 0;
  }

  .ih-page .ih-setup__video {
    width: 306px;
    height: 444px;
    margin: 0;
    display: block;
  }

  .ih-page .ih-setup__glow {
    left: 26.63%;
  }

  .ih-setup__copy {
    order: 0;
  }

  /* —— FAQ —— */
  .ih-faq {
    padding: 86px 0;
  }

  .ih-faq__list {
    width: 100%;
    max-width: 343px;
  }

  .ih-faq__item {
    width: 100%;
  }

  .ih-faq__btn span {
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
  }

  .ih-faq__answer {
    font-size: 14px;
    line-height: 20px;
  }

  /* —— CTA —— */
  .ih-cta {
    padding: 86px 0;
  }

  .ih-cta .ih-wrap {
    gap: 38px;
  }

  .ih-cta__copy {
    width: 100%;
    max-width: 343px;
  }

  .ih-cta .ih-section-title {
    white-space: normal;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.04em;
  }

  .ih-cta .ih-section-sub {
    font-size: 16px;
    line-height: 24px;
  }

  .ih-cta__note {
    font-size: 12px;
    line-height: 18px;
  }

  .ih-cta__form-block {
    width: auto;
    max-width: none;
    gap: 16px;
    align-self: stretch;
    align-items: stretch;
  }

  .ih-cta .ih-lead-row {
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 12px;
  }

  .ih-cta__glow {
    width: 375px;
    max-width: none;
    height: 348px;
    left: 50%;
    transform: translateX(-50%);
    top: -190px;
  }

  /* —— Footer —— */
  .ih-footer {
    padding: 86px 0;
  }

  .ih-footer__cols {
    display: flex;
    flex-direction: column-reverse;
    align-items: stretch;
    gap: 20px;
    margin-bottom: 40px;
  }

  .ih-fcol {
    width: 100%;
    min-width: 0;
    flex: none;
    align-items: stretch;
    gap: 20px;
    border-bottom: 0;
  }

  .ih-fcol__title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    direction: ltr;
    cursor: pointer;
    padding: 0;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    color: #131215;
  }

  .ih-fcol__head {
    display: flex;
    align-items: center;
    gap: 8px;
    direction: ltr;
    flex: 0 0 auto;
    margin-inline-start: auto;
  }

  .ih-fcol__chev {
    display: block;
    width: 16px;
    height: 16px;
    order: 0;
  }

  .ih-fcol.is-open .ih-fcol__chev {
    transform: rotate(180deg);
  }

  .ih-fcol__body {
    display: none;
    align-items: flex-end;
    gap: 20px;
    padding: 0;
    width: 100%;
  }

  .ih-fcol.is-open .ih-fcol__body {
    display: flex;
  }

  .ih-fcol a {
    text-align: right;
    direction: rtl;
    width: 100%;
  }

  .ih-footer__card {
    border-radius: 32px;
    padding: 20px;
    gap: 44px;
  }

  .ih-footer__top {
    flex-direction: column-reverse;
    align-items: center;
    gap: 44px;
  }

  .ih-footer__intro {
    align-items: center;
    width: 100%;
  }

  .ih-page img.ih-footer__logo {
    height: 66.788px;
    width: 218px;
    max-width: 100%;
  }

  .ih-footer__about {
    text-align: right;
    font-size: 14px;
    line-height: 20px;
  }

  .ih-badges {
    justify-content: center;
    width: 100%;
  }

  .ih-badges img {
    height: 78px;
    width: auto;
  }

  .ih-footer__bar {
    flex-direction: column-reverse;
    align-items: center;
    gap: 29px;
    padding: 16px;
  }

  .ih-footer__addr {
    text-align: right;
    max-width: none;
    font-size: 14px;
    line-height: 20px;
  }

  .ih-copy {
    margin-top: 40px;
    font-size: 12px;
    line-height: 18px;
  }

  .ih-socials {
    justify-content: center;
  }
}