/* =============================================
   RESPONSIVE BREAKPOINT SYSTEM

   1280px: wide grids that need to collapse before tablet
   960px:  two-column layouts become single-column
   768px:  tablet/mobile component refinements
   600px:  phones and compact navigation
   480px:  small-phone tightening
   ============================================= */

@media (max-width: 1280px) {
  .uma-feature-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 960px) {
  .twc-panel {
    grid-template-columns: 1fr;
    min-height: unset;
  }

  .twc-divider {
    flex-direction: row;
    height: 48px;
  }

  .twc-divider::before {
    background: linear-gradient(to right, var(--bg-white), var(--bg-alt-2) 40%, #1e1c1a 60%, #1e1c1a);
  }

  .twc-half {
    padding: 36px 28px;
  }

  .sg-hero__layout,
  .sg-row,
  .uma-retrieval-split,
  .uma-decision-grid,
  .uma-final-hero__inner,
  .animus-promo__inner {
    grid-template-columns: 1fr;
  }

  .sg-row {
    gap: var(--sp-5);
  }

  .sg-row--reverse .sg-row__visual {
    order: unset;
  }

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

  .sg-cta {
    grid-template-columns: 1fr;
  }

  .sg-cta__actions {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .sg-hero__media {
    justify-content: center;
  }

  .sg-code-card pre {
    padding: 14px 18px;
    font-size: 0.75rem;
  }

  .sg-steps {
    grid-template-columns: 1fr;
    gap: 1px;
  }

  .uma-final-hero {
    padding: 76px var(--sp-4) 76px var(--section-left-offset);
  }


  .animus-promo__actions {
    justify-self: start;
  }
}

@media (max-width: 768px) {
  :root {
    --section-content-max: none;
    --section-left-offset: max(12px, 6vw);
  }

  .twc-half {
    min-width: 0;
  }

  .twc-half__badge {
    font-size: clamp(0.68rem, 2vw, 0.74rem);
    letter-spacing: 0.06em;
    max-width: 100%;
    white-space: normal;
  }

  .twc-half__title {
    font-size: clamp(1.15rem, 4.5vw, 1.45rem);
    line-height: 1.18;
  }

  .twc-half__lead {
    font-size: clamp(0.92rem, 2.4vw, 1rem);
    line-height: 1.6;
  }

  .twc-list li {
    font-size: clamp(0.9rem, 2.3vw, 0.98rem);
    line-height: 1.55;
  }

  .twc-code {
    font-size: clamp(0.76rem, 1.9vw, 0.84rem);
    line-height: 1.6;
    white-space: pre-wrap;
    word-break: break-word;
    overflow-x: hidden;
  }

  .twc-half__lead,
  .twc-list li,
  .twc-code {
    overflow-wrap: anywhere;
  }

  .timeline-section {
    padding-top: var(--sp-2);
  }

  .timeline-wrap {
    width: 100%;
    min-width: 0;
    padding: 28px 20px 28px 0;
  }

  .timeline-item {
    grid-template-columns: 32px 1fr;
    column-gap: 18px;
    min-height: 128px;
  }

  .timeline-dot {
    width: 18px;
    height: 18px;
    box-shadow: 0 0 0 5px rgba(250,250,249,.95);
  }

  .timeline-line {
    top: 24px;
    height: calc(100% - 24px);
  }

  .timeline-box {
    padding: 0;
  }

  .timeline-content {
    padding-bottom: 22px;
  }

  .timeline-content h3 {
    margin-bottom: 6px;
  }

  .backend-strip {
    padding: 42px 0;
  }

  .backend-marquee__track {
    gap: 44px;
    animation-duration: 26s;
  }

  .backend-logo {
    height: 28px;
  }

  .backend-marquee::before,
  .backend-marquee::after {
    width: 64px;
  }
}

@media (max-width: 600px) {
  .twc-half {
    padding: 20px 14px;
    gap: 12px;
  }

  .twc-half__badge {
    font-size: 0.66rem;
  }

  .twc-half__title {
    font-size: clamp(1.05rem, 5.6vw, 1.22rem);
    line-height: 1.2;
  }

  .twc-half__lead {
    font-size: 0.95rem;
    line-height: 1.6;
  }

  .twc-list {
    gap: 8px;
  }

  .twc-list li {
    font-size: 0.92rem;
    line-height: 1.55;
    gap: 7px;
  }

  .twc-code {
    font-size: 0.74rem;
    padding: 10px 12px;
    line-height: 1.55;
  }

  :root {
    --sp-7: 52px;
    --sp-8: 64px;
  }

  .container {
    padding: 0 var(--sp-3);
  }

  .sg-nav__link span,
  .site-topnav__ai-label {
    display: none;
  }

  .sg-nav__link,
  .site-topnav__link {
    padding: 7px 9px;
  }

  .sg-hero h1 {
    font-size: clamp(2rem, 10vw, 2.5rem);
    line-height: 1.12;
  }

  .sg-hero__headline-line {
    display: block;
    white-space: normal;
    max-width: 12ch;
  }

  .hero-phrase {
    white-space: normal;
    display: block;
    max-width: 12ch;
  }

  .sg-hero__lead,
  .section-header--center {
    max-width: 100%;
  }

  .sg-hero__lead {
    font-size: 1.1rem;
    line-height: 1.65;
  }

  .sg-grid,
  .uma-feature-grid {
    grid-template-columns: 1fr;
  }

  .sg-stats {
    gap: var(--sp-3);
  }

  .sg-trust__sep {
    display: none;
  }

  .sg-code-card__header {
    padding: 8px 12px;
  }

  .sg-code-card__label {
    font-size: 0.6rem;
  }

  .sg-code-card pre {
    padding: 8px 12px;
    font-size: 0.7rem;
    line-height: 1.6;
  }

  .sg-footer__inner {
    grid-template-columns: 1fr;
    align-items: flex-start;
  }

  .sg-footer__brand:nth-of-type(1),
  .sg-footer__links,
  .sg-footer__copy {
    grid-column: 1;
    justify-self: start;
  }

  .sg-footer__links {
    grid-row: 3;
  }

  .sg-footer__copy {
    grid-row: 4;
  }

  .sg-footer__brand-image {
    width: min(160px, 100%);
  }

  .uma-feature-section {
    padding: 24px 14px;
  }

  .uma-feature-card {
    min-height: 150px;
  }

  .uma-feature-card h3 {
    white-space: normal;
  }

  .sg-rlm-step {
    display: block;
    padding-left: 8px;
  }

  .sg-rlm-step__num {
    position: absolute;
    visibility: hidden;
  }

  .sg-rlm-step__body {
    width: 100%;
  }
  .uma-retrieval-card,
  .uma-retrieval-decision {
    padding: 22px;
    border-radius: 22px;
  }

  .uma-retrieval-card h3 {
    font-size: clamp(1.45rem, 8vw, 1.9rem);
    line-height: 1.08;
  }

  .uma-code {
    font-size: 0.78rem;
  }

  .uma-final-hero {
    padding: 64px var(--sp-4) 64px var(--section-left-offset);
  }

  .uma-final-hero__panel,
  .animus-promo__inner {
    border-radius: 22px;
    padding: 24px;
  }

  .provider-grid {
    grid-template-columns: 1fr;
  }

  .uma-final-hero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .btn-dark-primary,
  .btn-dark-secondary,
  .btn-animus {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 768px) {
  .lanes-manifest__entry {
    grid-template-columns: 160px 1fr;
    gap: 0 16px;
    padding: 20px 0;
  }

  .lanes-manifest__name {
    font-size: 1.35rem;
  }

  .lanes-manifest__what {
    font-size: 1rem;
  }
}

@media (max-width: 600px) {
  .lanes-manifest__entry {
    grid-template-columns: 1fr;
    gap: 8px 0;
    padding: 18px 0;
  }

  .lanes-manifest__left {
    flex-direction: row;
    align-items: baseline;
    gap: 10px;
  }

  .lanes-manifest__opt-tag {
    margin-top: 0;
    align-self: center;
  }

  .lanes-manifest__name {
    font-size: 1.2rem;
  }

  .lanes-manifest__what {
    font-size: 0.95rem;
  }
}

@media (max-width: 480px) {
  .twc-half {
    padding: 18px 12px;
    gap: 10px;
  }

  .twc-half__title {
    font-size: 0.98rem;
  }

  .twc-half__lead,
  .twc-list li {
    font-size: 0.88rem;
  }

  .twc-code {
    font-size: 0.7rem;
    padding: 8px 10px;
  }

  .sg-hero__headline-line {
    white-space: normal;
    max-width: 10ch;
  }

  .hero-phrase {
    max-width: 10ch;
  }

  .sg-hero__lead {
    font-size: 1rem;
    line-height: 1.6;
  }

  .uma-retrieval-card,
  .uma-retrieval-decision {
    width: 100%;
    padding: 18px;
    border-radius: 18px;
  }

  .uma-retrieval-card__header {
    gap: 8px;
    margin-bottom: 14px;
  }

  .uma-retrieval-card h3 {
    font-size: clamp(1.25rem, 8vw, 1.6rem);
    line-height: 1.08;
    letter-spacing: -0.04em;
  }

  .uma-retrieval-card__lead,
  .uma-retrieval-list ul {
    font-size: 1.2rem;
    line-height: 1.55;
  }

  .uma-code {
    margin-top: 18px;
    padding: 14px;
    border-radius: 14px;
  }

  .uma-code code {
    font-size: 0.74rem;
    line-height: 1.55;
  }

  .sg-nav .site-topnav__ai,
  .sg-nav .site-topnav__sep {
    display: none;
  }
}