/* Approved SEO case presentation shared by SEO and Advertising. */
/* Keep component spacing when the page's later .container margin resets it. */
body.cases-mobile-compact #cases .cases-heading{margin-bottom:40px}
@media(max-width:760px){body.cases-mobile-compact #cases .cases-heading{margin-bottom:28px}}
body.cases-mobile-compact #cases .case-shot{background:#edf4f7}
body.cases-mobile-compact #cases .case-report-link{
  position:absolute;inset:14px;display:block;min-width:0;min-height:0;
  padding:0;border:3px solid #fff;border-radius:16px;background:#edf4f7;overflow:hidden;
  -webkit-mask-image:linear-gradient(#000 calc(100% - 88px),transparent calc(100% - 24px));
  mask-image:linear-gradient(#000 calc(100% - 88px),transparent calc(100% - 24px));
}
/* Safari touch highlight should not cover the report preview while opening it. */
@media (hover:none){
  body.cases-mobile-compact #cases .case-report-link{-webkit-tap-highlight-color:transparent}
}
body.cases-mobile-compact #cases .case-report-link::before{
  display:none;
}
body.cases-mobile-compact #cases .case-report-link::after{
  display:none;
}
@media(orientation:portrait){
  body.cases-mobile-compact #cases .case-report-link{
    -webkit-mask-image:none;
    mask-image:none;
  }
}
body.cases-mobile-compact #cases .case-shot::after{z-index:3;left:28px;bottom:28px}
body.cases-mobile-compact #cases .case-report-hint{display:none}

/* Restrained case frame and clearer supporting copy; no added glow. */
body.cases-mobile-compact #cases .case-card{height:auto;border:1px solid #a5cad7}
body.cases-mobile-compact #cases .case-logo{flex-shrink:0}
body.cases-mobile-compact #cases .case-logo-official img{width:auto;max-width:240px;max-height:82px;object-fit:contain;object-position:left center}
body.cases-mobile-compact #cases .case-logo-fitworld img{max-width:132px;max-height:82px;border-radius:6px}
body.cases-mobile-compact #cases .case-logo-primyase img{max-width:230px;max-height:78px;border-radius:6px}
body.cases-mobile-compact #cases .case-logo-lindfors{height:92px}
body.cases-mobile-compact #cases .case-logo-lindfors img{max-width:178px;max-height:92px}
body.cases-mobile-compact #cases .case-metrics span,
body.cases-mobile-compact #cases .case-metrics small{color:#5f7482}
body.cases-mobile-compact #cases .chart span{color:#8fcbd6}
body.cases-mobile-compact #cases .case-info>p.case-data-source{
  margin:12px 0 0!important;color:#416574!important;font-size:13px!important;
  font-weight:650;line-height:1.45!important;letter-spacing:normal;text-transform:none;
}
@media(max-width:760px){
  body.cases-mobile-compact #cases .case-info>p.case-data-source{font-size:12px!important}
}

@media(min-width:1051px){
  body.cases-mobile-compact #cases .case-card{grid-template-columns:40% minmax(0,1fr)}
  body.cases-mobile-compact #cases .case-info{min-width:0;padding-left:30px;padding-right:28px}
  /* The approved logo/dividers add 28px: keep the report fade at its live height. */
  body.cases-mobile-compact #cases .case-report-link{
    -webkit-mask-image:linear-gradient(#000 calc(100% - 116px),transparent calc(100% - 52px));
    mask-image:linear-gradient(#000 calc(100% - 116px),transparent calc(100% - 52px));
  }
  body.cases-mobile-compact #cases .case-report-link img{
    width:100%;height:100%;object-fit:contain;object-position:top center;
    background:#edf4f7;transform:none;
  }
}

@media(max-width:1050px) and (orientation:landscape){
  body.cases-mobile-compact #cases .case-report-link img{
    object-fit:contain;object-position:top center;
  }
}

/* Increase supporting captions everywhere except the already adjusted phone portrait. */
@media(min-width:601px), (orientation:landscape){
  body.cases-mobile-compact #cases .case-metrics{
    margin-bottom:0;
  }
  body.cases-mobile-compact #cases .chart{margin-top:20px}
  body.cases-mobile-compact #cases .case-metrics>div:first-child>strong{font-size:26px}
  body.cases-mobile-compact #cases .case-metrics span{font-size:12px}
  body.cases-mobile-compact #cases .case-metrics small{font-size:12px}
  body.cases-mobile-compact #cases .chart span{font-size:12px}
}

@media(max-width:1050px) and (orientation:portrait){
  body.cases-mobile-compact #cases .case-report-link{
    cursor:zoom-in;
  }
  body.cases-mobile-compact #cases .case-report-link img{
    position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;max-height:none;
    margin:0;border:0;border-radius:0;object-fit:cover;object-position:top right;
    filter:none;transform:none;transition:none;
  }
  body.cases-mobile-compact #cases .case-shot::after{display:none}
  body.cases-mobile-compact #cases .case-report-hint{
    position:absolute;z-index:3;right:26px;bottom:26px;left:auto;display:inline-flex;pointer-events:none;
    align-items:center;gap:8px;min-height:38px;padding:9px 12px;
    border:1px solid rgba(255,255,255,.4);border-radius:999px;color:#fff;
    background:rgba(4,24,43,.9);box-shadow:none;font-size:12px;font-weight:700;
    line-height:1.3;letter-spacing:0;text-transform:none;
  }
  body.cases-mobile-compact #cases .case-report-hint svg{
    width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;
  }
  body.cases-mobile-compact #cases .case-report-link:focus-visible{
    outline:3px solid #168da3;outline-offset:-4px;
  }
}

@media(min-width:601px) and (max-width:1050px) and (orientation:portrait){
  /* Preserve the report's natural width; clip the bottom half, never stretch it. */
  body.cases-mobile-compact #cases .case-shot{
    width:100%;height:auto;min-height:0;align-self:start;
    aspect-ratio:var(--case-report-half-ratio,.894);
  }
  body.cases-mobile-compact #cases .case-report-link img{height:auto;object-fit:contain;object-position:top center}
}

@media(max-width:600px) and (orientation:portrait){
  body.cases-mobile-compact #cases .case-shot{height:360px;min-height:0;aspect-ratio:auto}
  body.cases-mobile-compact #cases .case-info{min-height:0;padding-top:8px;padding-bottom:24px}
  body.cases-mobile-compact #cases .case-logo{width:80%;max-width:224px;height:67.2px;flex-shrink:0}
  body.cases-mobile-compact #cases .case-logo img{
    position:static;width:auto;height:auto;max-width:100%;max-height:67.2px;
    object-fit:contain;object-position:left center;transform:none;
  }
  body.cases-mobile-compact #cases .case-logo-crop img{width:100%;height:100%;object-position:center}
  body.cases-mobile-compact #cases .case-logo img.round,
  body.cases-mobile-compact #cases .case-logo img.brand-square{max-width:67.2px}
  /* Explicit user-approved exceptions to the shared card-copy/title sizes. */
  body.cases-mobile-compact #cases .case-info>p.case-type{
    margin-top:10px;font-size:8px!important;line-height:1.4!important;
  }
  body.cases-mobile-compact #cases .case-info h3{margin-top:6px;font-size:20.8px!important}
  body.cases-mobile-compact #cases .case-info>p.case-domain{font-size:14px!important}
  body.cases-mobile-compact #cases .case-info>p.case-period{
    margin:10px 0 0;padding:4px 8px;font-size:11px!important;line-height:1.4!important;
  }
  body.cases-mobile-compact #cases .case-metrics{grid-template-columns:minmax(0,1fr);margin:16px 0 0}
  body.cases-mobile-compact #cases .case-metrics>div:first-child{
    display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:6px;
  }
  body.cases-mobile-compact #cases .case-metrics>div:first-child>strong{flex:0 0 auto;font-size:18px}
  body.cases-mobile-compact #cases .case-metrics>div:first-child>span{display:inline;flex:0 1 auto}
  body.cases-mobile-compact #cases .case-metrics>div:first-child>small{
    flex:0 0 100%;margin:0;font-size:12px;line-height:1.45;
  }
  body.cases-mobile-compact #cases .case-metrics>div:nth-child(2){display:none}
  body.cases-mobile-compact #cases .chart{margin-top:20px}
  body.cases-mobile-compact #cases .chart>div{gap:12px}
  body.cases-mobile-compact #cases .chart b{flex-shrink:0;font-size:17px}
  body.cases-mobile-compact #cases .chart span{font-size:10px}
}

/* Clinic's round mark needs enough height for its embedded lettering. */
body.cases-mobile-compact #cases .case-logo:has(img[data-case-logo="medborisovka"]){height:90px}
body.cases-mobile-compact #cases .case-logo img[data-case-logo="medborisovka"]{width:90px;height:90px;max-width:90px;max-height:90px;object-fit:contain;transform:none}
@media(max-width:600px) and (orientation:portrait){body.cases-mobile-compact #cases .case-logo:has(img[data-case-logo="medborisovka"]){height:80px}body.cases-mobile-compact #cases .case-logo img[data-case-logo="medborisovka"]{width:80px;height:80px;max-width:80px;max-height:80px}}

/* Shared separators for the same SEO cards on service hubs. */
body.cases-mobile-compact #cases .case-section-divider{flex:0 0 auto;align-self:stretch;height:1px;background:#d4e3e9;margin:0}
body.cases-mobile-compact #cases .case-logo+.case-section-divider{margin-top:12px}
body.cases-mobile-compact #cases .case-section-divider+.case-type{margin-top:16px}
body.cases-mobile-compact #cases .case-metrics+.case-section-divider{margin:16px 0 0}

/* Shared SEO case category captions: +1px on both service pages. */
body.cases-mobile-compact #cases .case-info>p.case-type{font-size:15px!important}
@media(max-width:600px) and (orientation:portrait){
 body.cases-mobile-compact #cases .case-info>p.case-type{font-size:9px!important}
}

/* Shared SEO result accents, period captions and card spacing. */
body.cases-mobile-compact #cases .case-metrics{margin-bottom:16px}
body.cases-mobile-compact #cases .case-metrics>div:first-child strong{color:#168da3}
body.cases-mobile-compact #cases .chart{padding-top:18px;padding-bottom:18px;border:1.5px solid transparent}
body.cases-mobile-compact #cases .case-logo{position:relative;top:-1px}
@media(min-width:1051px){
 body.cases-mobile-compact #cases .case-info{padding-top:17px}
 body.cases-mobile-compact #cases .case-logo{top:3px}
}
body.cases-mobile-compact #cases .case-info>p.case-period{font-size:calc(var(--ddd-card-copy-size) - 2px)!important}
@media(max-width:600px) and (orientation:portrait){
 body.cases-mobile-compact #cases .case-info>p.case-period{font-size:9px!important}
}

/* SEO case cards contain scrollable content; only their controls respond to presses. */
body.cases-mobile-compact #caseTrack .case-card,
body.cases-mobile-compact #caseTrack .case-card:active{transform:none}

/* Shared proof caption: the check aligns to the first text line in portrait. */
@media(max-width:1100px) and (orientation:portrait){
 body.cases-mobile-compact #cases .case-proof{display:block;position:relative;box-sizing:border-box;padding-left:36px;text-align:left}
 body.cases-mobile-compact #cases .case-proof::before{position:absolute;left:0;top:0}
}

/* Center the caption; its check stays inline with the opening words. */
body.cases-mobile-compact #cases .case-proof{
 display:block;width:min(680px,calc(100% - 40px));max-width:none;padding-left:0;text-align:center;
}
body.cases-mobile-compact #cases .case-proof::before{
 position:static;display:inline-grid;width:26px;height:26px;margin-right:10px;
 vertical-align:middle;place-items:center;
}

/* Optical logo balance: preserve each brand shape; reserve a stable header height. */
body.cases-mobile-compact #caseTrack .case-logo{display:flex;align-items:center;width:100%;max-width:100%;height:96px;overflow:visible;background:transparent;--seo-logo-scale:1}
body.cases-mobile-compact #caseTrack .case-logo img[data-case-logo]{position:static;inset:auto;display:block;width:min(100%,calc(var(--seo-logo-width) * var(--seo-logo-scale)));height:calc(var(--seo-logo-height) * var(--seo-logo-scale));max-width:100%;max-height:96px;object-fit:contain;object-position:left center;transform:none}
body.cases-mobile-compact #caseTrack img[data-case-logo="colizeum"]{--seo-logo-width:190px;--seo-logo-height:90px}
body.cases-mobile-compact #caseTrack img[data-case-logo="shifa"]{--seo-logo-width:220px;--seo-logo-height:82px}
body.cases-mobile-compact #caseTrack img[data-case-logo="mhat"]{--seo-logo-width:100px;--seo-logo-height:92px}
body.cases-mobile-compact #caseTrack img[data-case-logo="tfn"]{--seo-logo-width:190px;--seo-logo-height:76px}
body.cases-mobile-compact #caseTrack img[data-case-logo="medkras"]{--seo-logo-width:210px;--seo-logo-height:86px}
body.cases-mobile-compact #caseTrack img[data-case-logo="do24"]{--seo-logo-width:250px;--seo-logo-height:70px}
body.cases-mobile-compact #caseTrack img[data-case-logo="novakey"]{--seo-logo-width:220px;--seo-logo-height:70px}
body.cases-mobile-compact #caseTrack img[data-case-logo="medborisovka"]{--seo-logo-width:96px;--seo-logo-height:96px}
body.cases-mobile-compact #caseTrack img[data-case-logo="moipechati"]{--seo-logo-width:160px;--seo-logo-height:84px}
body.cases-mobile-compact #caseTrack img[data-case-logo="cnc"]{--seo-logo-width:110px;--seo-logo-height:92px}
body.cases-mobile-compact #caseTrack img[data-case-logo="fitworld"]{--seo-logo-width:140px;--seo-logo-height:90px}
body.cases-mobile-compact #caseTrack img[data-case-logo="primyase"]{--seo-logo-width:190px;--seo-logo-height:86px}
body.cases-mobile-compact #caseTrack img[data-case-logo="lindfors"]{--seo-logo-width:170px;--seo-logo-height:92px}
body.cases-mobile-compact #caseTrack img[data-case-logo="hizhina"]{--seo-logo-width:140px;--seo-logo-height:90px}
@media(max-width:600px) and (orientation:portrait){body.cases-mobile-compact #caseTrack .case-logo{height:80px;--seo-logo-scale:.84}body.cases-mobile-compact #caseTrack .case-logo img[data-case-logo]{max-height:80px}}
