/* Mobile-only refinements for the portfolio. Desktop donor layouts remain untouched. */
@media(max-width:639px){
  /* Tilda's original next-project compositions use 1200/640px absolute grids
     and clip at 320-430px. Replace those with readable, accessible cards. */
  body.mobile-case-orla #rec848037070,
  body.mobile-case-br-group-branding #rec848037408,
  body.mobile-case-serenity #rec848037130,
  body.mobile-case-prp #rec835387971,
  body.mobile-case-rocket #rec835388450{display:none!important}
  .mobile-case-next{
    display:block!important;max-width:100%;width:100%;background:#f8f8f8;
    color:#1c1e20!important;padding:44px 16px 52px;margin:0 auto;
    font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text',Arial,sans-serif;
  }
  .mobile-case-next a{
    display:grid;grid-template-columns:minmax(0,1fr);gap:20px;color:inherit!important;
    text-decoration:none!important;max-width:100%;width:100%;border:0!important;
  }
  .mobile-case-next h2{font:600 clamp(24px,7.2vw,32px)/1.12 -apple-system,BlinkMacSystemFont,'SF Pro Display',Arial,sans-serif!important;letter-spacing:-.04em;margin:0;padding:0;white-space:normal;overflow-wrap:break-word}
  .mobile-case-next__eyebrow{font-size:12px!important;color:#888f96!important;margin:0 0 13px}
  .mobile-case-next__visual{width:100%;min-width:0;aspect-ratio:1.42;background:#e8eaed;overflow:hidden;border-radius:5px}
  .mobile-case-next__visual img{display:block;width:100%;height:100%;object-fit:cover}
  .mobile-case-next__heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
  .mobile-case-next__arrow{display:grid;place-items:center;border:1px solid #333;border-radius:50%;height:38px;width:38px;min-width:38px;font-size:20px}
  /* Consistent space for sticky navigation and accessible controls. */
  .site-home-back{z-index:100005}
  .mobile-case-next a:focus-visible{outline:2px solid #1c1e20;outline-offset:5px}
  body.mobile-case-prp header.nav .nav-name,
  body.mobile-case-rocket header.nav .nav-name{display:none!important}
  body.mobile-case-prp header.nav .desktop-only,
  body.mobile-case-rocket header.nav .desktop-only{display:none!important}
  body.mobile-case-prp header.nav .wrap.navin,
  body.mobile-case-rocket header.nav .wrap.navin{padding-left:74px!important}
  body.mobile-case-prp header.nav .navright,
  body.mobile-case-rocket header.nav .navright{margin-left:auto}
  /* The Avito Auto page carried a secondary in-content back row
     as well as the site's floating return arrow. */
  body.mobile-case-avito-auto .back.js-transition{display:none!important}
  /* Body/heading safety for long Russian and English labels. */
  body.mobile-case-orla #e-rec835388573-1706429530685,
  body.mobile-case-gm8 #e-rec835388639-1706429530685,
  body.mobile-case-vk-streammur #e-rec840131834-1706429530685{
    left:16px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;
    font-size:clamp(32px,9.5vw,43px)!important;line-height:1.06!important;height:auto!important;
    white-space:normal!important;letter-spacing:-.04em!important;
  }
  body.mobile-case-orla #e-rec835388573-1706429530685{top:417px!important;font-size:clamp(31px,9.35vw,41px)!important}
  body.mobile-case-orla #e-rec835388573-1706429530676{
    left:16px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;
    top:580px!important;font-size:13px!important;line-height:1.28!important;height:auto!important;
  }
  body.mobile-case-gm8 #e-rec835388639-1706429530676,
  body.mobile-case-vk-streammur #e-rec840131834-1706429530676{
    left:16px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;
    line-height:1.28!important;height:auto!important;
  }
  /* Tilda's compact hero grid is 350px wide and starts -15px on 320px screens.
     Make it fluid while preserving the original cover art and positioning. */
  body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530685'],
  body.mobile-case-serenity #rec835388717 .tn-elem[data-elem-id='1706429530685'],
  body.mobile-case-prp #rec835387947 .tn-elem[data-elem-id='1706429530685'],
  body.mobile-case-rocket #rec835388425 .tn-elem[data-elem-id='1706429530685']{
    left:16px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;height:auto!important;
  }
  body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530685']{
    top:520px!important;
  }
  body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530685'] .tn-atom{
    font-size:clamp(32px,9.5vw,41px)!important;line-height:1.04!important;
    letter-spacing:-.042em!important;white-space:normal!important;
  }
  body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530676']{
    left:16px!important;top:580px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;
  }
  body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530676'] .tn-atom{
    font-size:13px!important;line-height:1.3!important;white-space:normal!important;
  }
  body.mobile-case-serenity #rec835388717 .tn-elem[data-elem-id='1706429530676'],
  body.mobile-case-prp #rec835387947 .tn-elem[data-elem-id='1706429530676'],
  body.mobile-case-rocket #rec835388425 .tn-elem[data-elem-id='1706429530676']{
    left:16px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;
  }
  body.mobile-case-prp #rec835387947 .tn-elem[data-elem-id='1706429530685'] .tn-atom,
  body.mobile-case-rocket #rec835388425 .tn-elem[data-elem-id='1706429530685'] .tn-atom{
    font-size:clamp(33px,10.1vw,50px)!important;letter-spacing:-.04em!important;line-height:1.05!important;
  }
  body.mobile-case-serenity #rec835388717 .tn-elem[data-elem-id='1706429530685'] .tn-atom{
    font-size:clamp(33px,9.8vw,50px)!important;letter-spacing:-.04em!important;line-height:1.05!important;
  }
  /* At 320px the presentation intro was still using a centered 350px Tilda block. */
  body.mobile-case-presentations #rec837108584 .tn-elem[data-elem-id='1671962199432']{
    left:16px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;
  }
  body.mobile-case-presentations #rec837108584 .tn-elem[data-elem-id='1671962199432'] .tn-atom{
    font-size:clamp(21px,6.6vw,29px)!important;line-height:1.08!important;
  }
}
@media(max-width:359px){
  body.mobile-case-orla #e-rec835388573-1706429530685{top:398px!important}
  body.mobile-case-orla #e-rec835388573-1706429530676{top:557px!important}
  body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530685']{top:483px!important}
  body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530676']{top:566px!important}
}
/* The fallback next-project markup exists in DOM for all devices, but
   is not visible on desktop or tablet: no donor layout changes there. */
@media(min-width:640px){.mobile-case-next{display:none!important}}
@media(prefers-reduced-motion:reduce){.mobile-case-next *{transition:none!important}}

/* Final mobile QA: BR Group's about paragraph used a legacy centered 350px column. */
@media(max-width:639px){
  body.mobile-case-br-group-branding #rec835388369 .tn-elem[data-elem-id='1671886671015'],
  body.mobile-case-br-group-branding #rec835388369 .tn-elem[data-elem-id='1671438035616']{
    left:16px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;
  }
  /* The Avito Auto original header duplicated the floating back arrow's left space. */
  body.mobile-case-avito-auto header.nav .nav-name,
  body.mobile-case-avito-auto-showcase header.nav .nav-name{display:none!important}
  body.mobile-case-avito-auto header.nav .wrap.navin,
  body.mobile-case-avito-auto-showcase header.nav .wrap.navin{padding-left:74px!important}
}

/* 320px regression sweep: fix Haval donor's fixed 350px title grid and
   a harmless 4px decorative protrusion on the Avito showcase page. */
@media(max-width:639px){
  body.mobile-case-haval #rec845928162 .tn-elem[data-elem-id='1706429530685'],
  body.mobile-case-haval #rec845928162 .tn-elem[data-elem-id='1706429530676']{
    left:16px!important;width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;
  }
  body.mobile-case-haval #rec845928162 .tn-elem[data-elem-id='1706429530685'] .tn-atom{
    font-size:clamp(32px,9vw,50px)!important;line-height:1.06!important;
    letter-spacing:-.04em!important;white-space:normal!important;
  }
}
@media(max-width:359px){
  body.mobile-case-avito-auto-showcase,html:has(body.mobile-case-avito-auto-showcase){max-width:100%;overflow-x:clip!important}
}

/* Russian case headlines require more vertical breathing room than English.
   Keep donor desktop placement and the English layout unchanged. */
@media(max-width:479px){
  html[lang="ru"] body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530685'] .tn-atom{
    font-size:clamp(28px,8.5vw,36px)!important;line-height:1.06!important;letter-spacing:-.035em!important;
  }
  html[lang="ru"] body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530676']{
    top:622px!important;
  }
}
@media(max-width:359px){
  html[lang="ru"] body.mobile-case-br-group-branding #rec835388368 .tn-elem[data-elem-id='1706429530676']{
    top:599px!important;
  }
}