/* ==========================================================================
   Sabra Software — responsive rules
   Breakpoints: 1180 (small desktop), 1024 (tablet), 768 (small tablet), 520 (phone)
   ========================================================================== */

@media (max-width: 1180px) {
  .primary-nav a { padding: 10px 10px; }
  .site-header__inner { gap: 18px; }
  .brand { width: 200px; }
  .org-grid { gap: 14px; }
  .org__logo { min-height: 136px; padding: 22px 24px; }
}

@media (max-width: 1024px) {
  :root { --nav-h: 68px; --marquee-h: 34px; }
  .primary-nav, .site-header__cta { display: none; }
  .menu-toggle { display: inline-flex; }
  .brand { width: 200px; }

  .hero__shade { background: linear-gradient(180deg, rgba(5,7,22,.7) 0%, rgba(5,7,22,.35) 42%, rgba(5,7,22,0) 62%, rgba(5,7,22,.5) 100%); }
  .hero__content { justify-content: flex-start; padding-top: calc(var(--header-h) + 3vh); }
  .section--approach { margin-top: -28px; border-radius: 28px 28px 0 0; }
  .hero__loader { top: auto; bottom: 110px; }
  .hero__fallback { align-items: flex-end; justify-content: center; padding: 0 0 10vh; }
  .hero__fallback img { width: min(86vw, 560px); }

  .approach, .about, .why, .faq, .contact, .experience { grid-template-columns: 1fr; }
  .about { grid-template-areas: "head" "visual" "body"; row-gap: 28px; }
  .about__head .section-title { margin-bottom: 0; }
  .pricing__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing__tables { grid-template-columns: 1fr; }
  .faq__head { position: static; }
  .principles { grid-template-columns: repeat(2, 1fr); }
  .services { grid-template-columns: repeat(2, 1fr); }
  .service--featured { grid-column: span 2; }
  .org-grid { grid-template-columns: repeat(2, 1fr); }
  .project, .project:nth-child(even) { grid-template-columns: 1fr; }
  .project:nth-child(even) .project__media { order: 0; }
  .about__visual { max-width: 480px; margin-inline: auto; }
  .collage { max-width: 520px; }
  .site-footer__grid { grid-template-columns: repeat(3, 1fr); }
  .site-footer__brand { grid-column: 1 / -1; }

  .process { grid-template-columns: 1fr; gap: 14px; max-width: 620px; margin-inline: auto; }
  .process::before, .process::after { left: 46px; right: auto; top: 24px; bottom: 24px; width: 2px; height: auto; }
  .process::after { transform-origin: top; transform: scaleY(var(--process-progress, 0)); }
  .process__step { text-align: left; padding: 20px 20px 20px 92px; }
  .process__num { left: 22px; top: 20px; transform: none; }
}

@media (max-width: 768px) {
  body { font-size: 1rem; }
  .services { grid-template-columns: 1fr; }
  .service--featured { grid-column: auto; }
  .service--featured .service__list { columns: 1; }
  .principles { grid-template-columns: 1fr; }
  .about__facts { grid-template-columns: 1fr; }
  .about__frame .float-badge--tl { left: -8px; top: 22px; }
  .about__frame .float-badge--br { right: -8px; bottom: 16px; }
  .why__list { grid-template-columns: 1fr; }
  .field-row { grid-template-columns: 1fr; }
  .work__cta { padding: 28px 24px; }
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .approach__media .float-badge { left: 12px; bottom: 12px; }
  .site-footer__logo { width: 304px; max-width: 80%; }
  .site-footer { padding-bottom: 96px; }
  .pricing__tabs { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(-1 * var(--gutter)); padding: 4px var(--gutter) 10px; scrollbar-width: none; }
  .pricing__tab { flex: 0 0 auto; }
  .pricing__cta { padding: 26px 22px; }
}

@media (max-width: 520px) {
  .brand { width: 176px; }
  .fab__btn { width: 50px; height: 50px; }
  .to-top { width: 46px; height: 46px; }
  .tech-ring { height: 130px; }
  .tech-ring__spin span { transform: translate(-50%, -50%) rotateY(calc(var(--i) * 30deg)) translateZ(140px); font-size: .7rem; }
  .hero__title { font-size: clamp(2.5rem, 1.6rem + 5vw, 3.1rem); margin-bottom: 18px; }
  .hero__lead { font-size: 1rem; margin-bottom: 26px; }
  .hero__actions { gap: 10px; }
  .hero__actions .btn { flex: 1 1 150px; --btn-h: 50px; padding: 0 14px; font-size: .95rem; }
  .hero__skip { bottom: 44px; }
  .org-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .org__logo { min-height: 104px; padding: 16px 14px; gap: 10px; }
  .org__logo--pair img { max-width: calc(50% - 12px); }
  .org__logo-sep { height: 30px; }
  .org__name { font-size: .74rem; padding: 10px 8px; }
  .org__name small { font-size: .66rem; }
  .skills { padding: 16px; }
  .skills__tab { font-size: .84rem; padding: 0 12px 0 10px; }
  .skill-chips li { padding: 10px 14px; font-size: .94rem; }
  .experience__num { font-size: 3rem; }
  .collage { height: 210px; }
  .collage__a { height: 160px; }
  .collage__b { height: 140px; }
  .float-badge { font-size: .8rem; padding: 10px 14px 10px 10px; max-width: 240px; }
  .float-badge .icon-tile { width: 36px; height: 36px; }
  .faq__item summary { font-size: 1rem; padding-right: 56px; }
  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__bottom { flex-direction: column; }
  .pricing__grid { grid-template-columns: 1fr; }
}

@media (max-height: 560px) and (orientation: landscape) {
  .hero__content { justify-content: center; padding-top: var(--header-h); padding-bottom: 20px; }
  .hero__title { font-size: clamp(1.9rem, 1rem + 3vw, 2.6rem); margin-bottom: 10px; }
  .hero__lead { margin-bottom: 16px; font-size: .96rem; }
  .hero__skip { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .js [data-reveal] { opacity: 1; transform: none; }
}

@media (hover: none) {
  .service:hover, .org:hover, .principle:hover, .why__list li:hover, .process__step:hover, .project__media:hover .browser { transform: none; }
}

@media print {
  .site-header, .hero__canvas, .hero__skip, .mobile-menu, .section__bg { display: none !important; }
  .hero { height: auto; }
  .hero__sticky { position: static; height: auto; }
}
