@media (max-width: 72rem) {
  .site-nav a { padding-inline: .55rem; }
  .grid--4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .footer-grid { grid-template-columns: 1.4fr repeat(2, 1fr); }
  .footer-col:last-child { grid-column: 2 / -1; }
}
@media (max-width: 74rem) {
  .nav-toggle { display: inline-flex; }
  .site-nav { position: fixed; inset: 4.8rem 1rem auto; z-index: var(--z-dropdown); display: none; padding: 1rem; border: 1px solid var(--border-soft); border-radius: var(--radius-lg); background: var(--bg-surface); box-shadow: var(--shadow-lg); }
  .site-nav.is-open { display: grid; }
  .site-nav a { padding: .8rem 1rem; }
  .nav-cta { display: none; }
  .split { grid-template-columns: 1fr; }
  .hero__copy { max-width: 48rem; }
  .hero-visual { min-height: 32rem; }
  .demo-shell { grid-template-columns: 1fr; }
  .demo-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .demo-tab { grid-template-columns: 1fr; }
  .demo-tab span:first-child { display: none; }
  .cta__inner { grid-template-columns: 1fr; align-items: start; }
}
@media (max-width: 48rem) {
  :root { --space-5xl: 5rem; }
  .container { width: min(calc(100% - 1.25rem), var(--container-xl)); }
  .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .demo-tabs { grid-template-columns: 1fr; }
  .demo-tab { grid-template-columns: 2rem 1fr; }
  .demo-tab span:first-child { display: grid; }
  .demo-stage { min-height: 27rem; padding: 1rem; }
  .floating-badge--one { right: -.2rem; }
  .floating-badge--two { left: -.2rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-col:last-child { grid-column: auto; }
  .footer-bottom { flex-direction: column; }
  .compare-card__top { align-items: center; }
}
@media (max-width: 34rem) {
  .navbar { min-height: 4.4rem; }
  .brand span { font-size: 1.05rem; }
  .brand img { width: 2.2rem; height: 2.2rem; }
  .nav-cluster { gap: .45rem; }
  .theme-toggle, .nav-toggle { width: 2.5rem; height: 2.5rem; }
  .actions { display: grid; }
  .actions .button { width: 100%; }
  .hero-visual { min-height: 29rem; }
  .phone { width: min(16rem, 78vw); }
  .phone__screen { min-height: 31rem; }
  .floating-badge { display: none; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-brand { grid-column: auto; }
}


/* Prilagodba službenog logotipa i stvarnih snimki aplikacije */
@media (max-width: 74rem) {
  .brand img.brand__wordmark { width: 10.25rem; }
  .hero-visual--real { min-height: 39rem; }
}
@media (max-width: 48rem) {
  .hero-visual--real { min-height: 36rem; }
  .app-shot--front { width: min(18rem, 69vw); right: 12%; }
  .app-shot--back { width: min(13rem, 46vw); left: 5%; }
  .split--app { grid-template-columns: 1fr; }
}
@media (max-width: 34rem) {
  .brand { min-width: 0; }
  .brand img.brand__wordmark { width: 8.7rem; max-height: 2.65rem; }
  .footer-brand .brand img.brand__wordmark { width: 11rem; }
  .hero-visual--real { min-height: 32rem; }
  .app-shot--back { display: none; }
  .app-shot--front { width: min(16.5rem, 78vw); right: 50%; transform: translateX(50%) rotate(1deg); }
}
@media (max-width: 48rem) {
  .app-shot--front { width: min(15.5rem, 66vw); }
  .app-shot--back { width: min(11.5rem, 42vw); }
}
@media (max-width: 34rem) {
  .app-shot--front { width: min(14.5rem, 72vw); }
}
