/* Pricing stays in the original layout, with a centered presentation. */
.imsg .imsg-pricing .sec-head {
  max-width: none;
  text-align: center;
}
.imsg .plan-grid { margin-inline: auto; }
.imsg .plan-head { text-align: center; }
.imsg .plan-amount { justify-content: center; }
.imsg .plan {
  transition: transform 360ms cubic-bezier(.16, 1, .3, 1), border-color 240ms ease;
  transform-origin: center;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .imsg .plan:hover, .imsg .plan:focus-within {
    transform: translateY(-4px) scale(1.025);
    border-color: var(--ink-3);
    z-index: 1;
  }
}
.imsg .faq-item[data-faq-expanded="false"] .faq-chevron { transform: rotate(0deg); }
.imsg .faq-item[data-faq-expanded="true"] .faq-chevron { transform: rotate(180deg); }
.imsg .faq-chevron { transition: transform 360ms cubic-bezier(.16, 1, .3, 1); }
@media (prefers-reduced-motion: reduce) {
  .imsg .plan, .imsg .faq-chevron { transition: none; }
}

/* This export includes Apple's device bezel; no additional CSS phone frame. */
.imsg .notification-animation { position: relative; margin-inline: auto; aspect-ratio: 720 / 1472; }
.imsg .notification-animation img,
.imsg .notification-animation video { width: 100%; height: auto; display: block; }
.imsg .notification-animation video { display: none; pointer-events: none; }
.imsg .notification-animation.is-video-ready video { display: block; }
.imsg .notification-animation.is-video-ready img { position: absolute; inset: 0; opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .imsg .notification-animation.is-video-ready video { display: none; }
  .imsg .notification-animation.is-video-ready img { position: static; opacity: 1; }
}

.imsg .retention-phone { width: min(300px, 78%); }
@media (max-width: 560px) { .imsg .retention-phone { width: min(260px, 80%); } }

/* Mobile audit: readable controls, compact rhythm, and unclipped anchor headings. */
.imsg [id] { scroll-margin-top: 96px; }
.imsg .waitlist-form input[type="tel"] { font-size: 16px; }
body:has(.imsg) .nav-mobile-toggle { width: 44px; height: 44px; }
.imsg .btn, .imsg .case-link { min-height: 44px; }
body:has(.imsg) .footer-column a { display: flex; align-items: center; min-height: 44px; }
.imsg :is(a, button, input, summary):focus-visible { outline: 2px solid var(--imsg-blue); outline-offset: 4px; }
@media (max-width: 900px) {
  body:has(.imsg) .nav-minimal .nav-actions > a { display: none; }
  body:has(.imsg) .nav-minimal .nav-mobile-toggle { display: inline-flex; }
  body:has(.imsg) .nav-minimal .nav-mobile-menu .btn { width: 100%; min-height: 44px; margin-top: 8px; }
  body:has(.imsg) .nav-mobile-menu { max-height: calc(100dvh - 100px); }
}
@media (max-width: 560px) {
  .imsg section { padding-block: 44px; }
  .imsg section.imsg-hero { padding-top: 104px; padding-bottom: 36px; }
  .imsg-hero .imsg-container { gap: 28px; }
  .imsg-hero .hero-sub { margin-top: 18px; }
  .imsg-hero .waitlist-form { margin-top: 22px; gap: 10px; }
  .imsg-hero .hero-phone { width: min(270px, 78vw); margin-top: 0; }
  .imsg .sec-head { margin-bottom: 24px; }
  .imsg-cases .case-copy { padding: 22px 20px 0; }
  .imsg-cases .case-link { margin-top: 6px; font-size: 12px; }
  .imsg-cases .case-media { padding: 0 16px 24px; margin-top: 16px; }
  .imsg-cases .case-phone, .imsg .retention-phone { width: min(280px, 100%); }
  .imsg .agent-grid { gap: 20px; }
  .imsg .feature-media, .imsg .feature:last-child .feature-media { aspect-ratio: 16 / 10; }
  .imsg .feature-body { padding: 16px 20px 22px; }
  .imsg .plan-grid { gap: 16px; }
  .imsg .faq-question { line-height: 1.45; }
  .imsg .prompt-row { padding: 18px; margin-top: 20px; }
  .imsg .agent-logos { justify-content: center; }
}
@media (max-width: 900px) and (orientation: landscape) {
  body:has(.imsg) .nav { padding-left: max(var(--imsg-gutter), env(safe-area-inset-left)); padding-right: max(var(--imsg-gutter), env(safe-area-inset-right)); }
  .imsg-container { padding-left: max(var(--imsg-gutter), env(safe-area-inset-left)); padding-right: max(var(--imsg-gutter), env(safe-area-inset-right)); }
}

/* Wide desktop: larger product compositions with readable copy measures. */
@media (min-width: 1200px) {
  .imsg { --imsg-maxw: 1600px; --imsg-gutter: clamp(40px, 4vw, 72px); }
  body:has(.imsg) .nav-inner { max-width: 1456px; }
  .imsg section.imsg-hero { padding-top: 128px; padding-bottom: 36px; }
  .imsg-hero .imsg-container {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
    gap: clamp(48px, 6vw, 112px);
  }
  .imsg-hero h1 { font-size: clamp(64px, 5vw, 92px); line-height: 1.02; max-width: 15ch; letter-spacing: -.045em; }
  .imsg-hero .hero-sub { font-size: 20px; max-width: 43ch; margin-top: 28px; }
  .imsg-hero .waitlist-form { margin-top: 32px; max-width: 540px; }
  .imsg-hero .hero-phone { width: clamp(340px, 24vw, 420px); max-width: 100%; }
  .imsg section.imsg-cases { padding-top: 44px; }
  .imsg .sec-head h2 { font-size: clamp(36px, 3vw, 48px); }
  .imsg-cases .case-grid { gap: 28px; }
  .imsg-cases .sup-case { background: var(--surface-2); border-color: transparent; border-radius: 24px; }
  .imsg-cases .sup-case .case-copy {
    display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px;
    padding: 44px 48px 0; align-items: start;
  }
  .imsg-cases .sup-case h3 { font-size: clamp(28px, 2.4vw, 36px); max-width: 19ch; grid-row: 1 / 3; }
  .imsg-cases .sup-case p { margin: 0; font-size: 18px; max-width: 42ch; }
  .imsg-cases .sup-case .case-link { grid-column: 2; justify-self: start; margin-top: 8px; }
  .imsg-cases .case-wide .sup-media { padding: 0 48px 48px; margin-top: 28px; }
  .imsg-cases #agent .case-copy { padding: 40px 40px 0; }
  .imsg-cases #agent h3 { font-size: 30px; }
  .imsg-cases #agent .agent-media { padding: 16px 40px 40px; }
  .imsg .imsg-pricing .imsg-container, .imsg .imsg-faq .imsg-container { max-width: 1280px; }
}

/* Trim the stray previous-message tail at the top of the reaction screenshot. */
.imsg .feature-media.reaction-media img { height: auto; clip-path: inset(3% 0 0); }

/* Hero: a small liquid-glass pill under the headline, "Backed by" and Y Combinator's own logo. */
.imsg-hero .hero-yc {
  display: inline-flex; align-items: center; gap: 7px; margin: 18px 0 0; opacity: 1;
  padding: 6px 13px 6px 12px; border-radius: 999px;
  font-size: 13px; font-weight: 500; letter-spacing: -.005em; color: var(--ink-2, #3c3c43);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.42));
  border: 1px solid rgba(255,255,255,.75);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), inset 0 -1px 0 rgba(0,0,0,.04),
              0 0 0 .5px rgba(0,0,0,.08), 0 4px 14px -4px rgba(0,0,0,.12);
  -webkit-backdrop-filter: blur(14px) saturate(180%); backdrop-filter: blur(14px) saturate(180%);
}
.imsg-hero .hero-yc img { display: block; height: 18px; width: auto; }
[data-theme="dark"] .imsg-hero .hero-yc {
  color: rgba(255,255,255,.85);
  background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.05));
  border-color: rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 4px 14px -4px rgba(0,0,0,.5);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .imsg-hero .hero-yc {
    color: rgba(255,255,255,.85);
    background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.05));
    border-color: rgba(255,255,255,.16);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 4px 14px -4px rgba(0,0,0,.5);
  }
}