/* Desktop compact pass v2 — significantly tighter desktop scale, mobile unchanged. */
@media (min-width: 741px) {
  :root { --content: 1100px; }

  body { font-size: .95rem; line-height: 1.58; }
  .shell { width: min(var(--content), 82%); }

  .site-header { padding-block: 17px; gap: 20px; }
  .wordmark { font-size: 2.05rem; }
  .main-nav { gap: 18px; padding: 7px 22px; font-size: .85rem; }
  .header-cta { min-height: 41px; padding: 8px 17px; font-size: .9rem; }
  .button { min-height: 44px; padding: 10px 19px; font-size: .92rem; gap: 18px; }

  h2 { font-size: clamp(2.05rem, 2.55vw, 2.55rem); line-height: 1.09; margin-bottom: 19px; }
  h3 { font-size: 1.48rem; }
  .eyebrow { margin-bottom: 13px; font-size: .68rem; }
  .section { padding-block: 40px; }

  /* Homepage hero */
  .hero { min-height: 640px; }
  .hero-content { padding-top: 30px; }
  .hero-content .eyebrow { margin-bottom: 17px; }
  .hero h1 { font-size: clamp(3.75rem, 4.2vw, 4.25rem); line-height: .98; max-width: 610px; margin-bottom: 18px; }
  .hero-description { font-size: clamp(1.02rem, 1.2vw, 1.18rem); max-width: 560px; margin-bottom: 20px; }
  .hero-actions { gap: 24px; }
  .hero-bottom { padding-top: 24px; padding-bottom: 88px; }
  .hero-bottom > p { font-size: .58rem; }
  .hero-wave { height: 96px; }
  .art-caption { top: 45%; right: 6%; font-size: .58rem; }

  /* Homepage sections */
  .services { padding-top: 8px; }
  .section-intro { gap: 32px; }
  .section-description { font-size: .94rem; max-width: 290px; }
  .service-list { margin-top: 30px; }
  .service { padding-inline: 14px; }
  .service-index { font-size: 2.65rem; margin-bottom: 16px; }
  .service h3 { font-size: clamp(1.2rem, 1.35vw, 1.42rem); margin-bottom: 11px; }
  .service > p { font-size: .92rem; margin-bottom: 15px; }

  .projects { grid-template-columns: .7fr 1.45fr; gap: 30px; padding-top: 18px; padding-bottom: 16px; }
  .projects-intro h2 { font-size: clamp(2.05rem, 2.5vw, 2.5rem); }
  .projects-intro > p:not(.eyebrow) { font-size: .94rem; max-width: 300px; }
  .project-showcase { border-radius: 30px !important; }
  .project-showcase-visual { min-height: 225px !important; }
  .project-preview { height: 225px !important; }
  .project-preview-old, .project-preview-new { min-height: 225px !important; height: 225px !important; object-fit: cover !important; object-position: top center !important; }
  .project-preview-after .project-preview-new { background: #fff; transform: none !important; }
  .project-site-preview iframe { transform: scale(.35) !important; }
  .project-showcase-copy { padding: 17px 20px 19px !important; gap: 18px !important; }
  .project-showcase-copy h3 { font-size: clamp(1.55rem, 2vw, 1.95rem) !important; margin: 5px 0 6px !important; }
  .project-showcase-copy p { font-size: .88rem !important; line-height: 1.5 !important; }
  .project-showcase-meta { margin-top: 9px !important; gap: 6px !important; }
  .project-showcase-meta span { font-size: .61rem !important; padding: 5px 8px !important; }
  .project-showcase-link { font-size: .69rem !important; }
  .round-arrow { width: 38px; height: 38px; font-size: 1.15rem; }

  .signature-line { padding: 18px 0 32px; }
  .signature-line svg { height: 46px; }

  .about-section { margin-inline: 4%; border-radius: 48px 48px 48px 0; padding-block: 48px; }
  .about-inner { gap: 42px; }
  .about-section h2 { font-size: clamp(2.05rem, 2.4vw, 2.45rem); }
  .about-copy .about-lead { font-size: 1.28rem; }
  .about-copy > p { font-size: .94rem; }
  .process-section { padding-top: 52px; }
  .process-list { gap: 30px; margin-top: 27px; }
  .process-list h3 { font-size: 1.25rem; margin: 13px 0 10px; }
  .process-list p { font-size: .93rem; }
  .faq-section { gap: 42px; padding-top: 16px; padding-bottom: 52px; }
  .faq-list summary { font-size: 1.05rem; }
  .faq-list details { padding: 14px 0; }
  .faq-list details > p { font-size: .92rem; }
  .contact-section { padding: 48px 0 36px; border-radius: 50% 50% 0 0 / 42px 42px 0 0; }
  .contact-inner h2 { font-size: clamp(3.15rem, 3.8vw, 3.7rem); }
  .contact-inner > p:not(.eyebrow) { font-size: .98rem; }

  /* Inner pages */
  .inner-top { border-radius: 0 0 7% 0 / 0 0 42px 0; }
  .page-hero { padding-top: 34px; padding-bottom: 44px; }
  .page-hero h1 { font-size: clamp(2.9rem, 3.6vw, 3.75rem); max-width: 820px; line-height: 1.04; margin-bottom: 18px; }
  .page-lead { max-width: 650px; font-size: 1.03rem; line-height: 1.5; }
  .page-cta { padding: 34px 0 46px; }
  .page-cta h2 { font-size: clamp(2.2rem, 2.9vw, 2.85rem); }

  .service-row { grid-template-columns: 46px 1fr 52px; gap: 20px; padding: 27px 0; }
  .service-row h2 { font-size: clamp(1.65rem, 2.15vw, 2.15rem); }
  .round-link { width: 43px; height: 43px; font-size: 1.18rem; }
  .editorial { max-width: 680px; }
  .editorial > p, .prose p, .prose ul { font-size: .95rem; }
  .two-column { gap: 40px; }
  .soft-panel { border-radius: 32px; padding: 28px; }
  .project-collection { gap: 32px; }
  .case-image { max-height: 340px; border-radius: 36px; }
  .case-image img { max-height: 340px; }
  .contact-grid { gap: 40px; }
  .contact-person h2 { font-size: 2rem; }

  /* Case study */
  .browser-window, .before-shot { border-radius: 28px !important; }
  .case-fact { padding-top: 18px !important; padding-bottom: 18px !important; }
  .compare-grid, .case-compare { gap: 14px !important; }
  .compare-card, .case-compare article { border-radius: 23px !important; padding: 22px !important; }
  .phase-note { gap: 32px !important; }
  .after-live iframe { height: 540px !important; }
}

/* Homepage project preview: on mobile show both screenshots at their natural ratio.
   This prevents the redesign screenshot from being zoomed/cropped outside its frame. */
@media (max-width: 740px) {
  .project-showcase-visual { min-height: 0 !important; }
  .project-preview { height: auto !important; min-height: 0 !important; }
  .project-preview-old,
  .project-preview-new,
  .project-preview-after > img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: top center !important;
    transform: none !important;
  }

  /* Case study /kouzelny-uklid: keep both before/after screenshots inside their cards. */
  body .case-ba-section .case-ba-card img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: top center !important;
    transform: none !important;
  }
}


/* Modern UX alignment for compact desktop */
@media (min-width:741px){
  .site-header .wordmark{order:1}
  .site-header .main-nav{order:2}
  .site-header .header-cta{order:3}
  .site-header .nav-toggle{order:4}
  .hero-content{padding-top:34px}
  .hero h1{max-width:780px;font-size:clamp(3.65rem,4.6vw,4.65rem);margin-bottom:18px}
  .hero-description{max-width:640px;font-size:clamp(1.02rem,1.25vw,1.2rem)}
  .hero-proof{margin-top:20px}
  .service-list{gap:14px;margin-top:30px}
  .service{min-height:290px;padding:22px;border:1px solid var(--line);border-radius:25px}
  .service + .service{border-left:1px solid var(--line)}
  .service-index{font-size:2.15rem;margin-bottom:20px}
  .service h3{font-size:clamp(1.22rem,1.5vw,1.48rem);margin-bottom:12px}
  .service > p{font-size:.9rem;margin-bottom:18px}
  .audit-feature{border-radius:34px;padding:32px}
  .contact-section{margin:0 2.5% 16px;border-radius:46px}
  .contact-note{font-size:.62rem!important;margin-bottom:22px!important}
  .advice-home{padding-top:46px}
}

@media (min-width:741px){
  .inner-page .service-row{padding:24px 20px;margin-bottom:10px}
  .inquiry-form{padding:24px}
}
