/* Conversium production patch — 2026-08-11. Base CSS intentionally untouched. */

/* Larger Telegram airplane, with optical vertical centering. */
.concept-v08-1 .concept-cta img{
  width:21px;
  height:21px;
  flex:0 0 auto;
  transform:translateY(-1px);
}
.concept-v08-1 .concept-header.is-sticky .concept-nav-telegram img{
  width:19px;
  height:19px;
  transform:translateY(-1px);
}

/* Filmography now belongs to the bottom of the project list. */
.concept-v08-1 .project-v4-imdb-bottom{
  margin-top:18px;
}

/* Contact section: align its label/content to the orange section above.
   Footer border is deliberately NOT moved. */
@media (min-width:701px){
  .concept-v08-1 .hybrid-contact-v8 > .sheet-section-label,
  .concept-v08-1 .hybrid-contact-v8 > .hybrid-contact-layout{
    margin-left:calc(clamp(24px,6vw,92px) - var(--concept-gutter));
    margin-right:calc(clamp(24px,6vw,92px) - var(--concept-gutter));
  }
}

/* Two real quote paragraphs; quote marks stay inline with the text, as before.
   Gap is about 25% tighter than the original blank-line separation. */
.concept-v08-1 .hybrid-contact-owner blockquote p{
  margin:0;
}
.concept-v08-1 .hybrid-contact-owner blockquote p + p{
  margin-top:20px;
}

/* Align client email with the left edge of the CTA column on desktop. */
@media (min-width:901px){
  .concept-v08-1 .hybrid-contact-v8 footer{
    grid-template-columns:minmax(360px,.86fr) minmax(520px,1.14fr);
    gap:clamp(56px,8vw,140px);
    padding-left:calc(clamp(24px,6vw,92px) - var(--concept-gutter));
    padding-right:calc(clamp(24px,6vw,92px) - var(--concept-gutter));
    box-sizing:border-box;
  }
}

@media (max-width:700px){
  .concept-v08-1 .concept-cta img{
    width:19px;
    height:19px;
    transform:translateY(-1px);
  }
  .concept-v08-1 .floating-contact img{
    width:28px;
    height:28px;
    transform:translateY(-1px);
  }
  .concept-v08-1 .hybrid-contact-owner blockquote p + p{
    margin-top:18px;
  }
  .concept-v08-1 .project-v4-imdb-bottom{
    margin-top:14px;
  }
}

/* Final approved quote variant — v4 base preserved. */
.concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-open-lock,
.concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-close-lock{
  white-space:nowrap;
}
.concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-mark{
  display:inline-block;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(48px,4.2vw,68px);
  font-weight:400;
  line-height:0;
  vertical-align:-0.17em;
  letter-spacing:0;
}
.concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-open-lock .quote-mark{
  margin-right:12px;
}
.concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-close-lock .quote-mark{
  margin-left:12px;
  transform:translateY(.40em);
}
@media (max-width:700px){
  .concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-mark{
    font-size:46px;
    vertical-align:-0.16em;
  }
  .concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-open-lock .quote-mark{
    margin-right:9px;
  }
  .concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-close-lock .quote-mark{
    margin-left:9px;
    transform:translateY(.27em);
  }
}


/* === Conversium next patch — accumulated fixes (2026-08-12) === */

/* 1) Small service labels / breadcrumbs: improve readability on displays
   where the original very small mono text starts to disappear or pixelate. */
.concept-v08-1 .hero-eyebrow,
.concept-v08-1 .sheet-section-label,
.concept-v08-1 .editorial-main-caption{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}
.concept-v08-1 .hero-eyebrow{
  font-size:11px;
  line-height:1.38;
  letter-spacing:.085em;
  color:#9c9c9c;
}
.concept-v08-1 .sheet-section-label{
  font-size:10px;
  line-height:1.35;
  letter-spacing:.06em;
}
.concept-v08-1 .editorial-main-caption{
  font-size:10px;
  line-height:1.38;
  letter-spacing:.05em;
}

/* 3) Desktop video affordance: make the "развернуть" plaque visible like on mobile.
   Small videos already have a real element; the main showreel receives a matching visual plaque. */
@media (min-width:701px){
  .concept-v08-1 .concept-video.is-expandable .concept-video-open{
    opacity:1;
  }
  .concept-v08-1 .editorial-v4-player .concept-video.is-expandable::after{
    content:"РАЗВЕРНУТЬ ↗";
    position:absolute;
    right:10px;
    bottom:10px;
    z-index:4;
    padding:6px 8px;
    background:rgba(0,0,0,.7);
    color:#fff;
    font-family:var(--font-plex-mono), monospace;
    font-size:8px;
    letter-spacing:.04em;
    line-height:1;
    pointer-events:none;
  }
}

/* 4) Replace before/after phone frames with JPG assets. */
.concept-v08-1 .compare-before{
  background-image:url(/assets/before.jpg?v=20260812-2) !important;
}
.concept-v08-1 .compare-after{
  background-image:url(/assets/after.jpg?v=20260812-2) !important;
}

/* Desktop: keep the existing mobile-style expand plaque visible on all eight small videos. */
@media (min-width:701px){
  .concept-v08-1 .concept-work-grid .concept-video-open{
    opacity:1;
  }
}


/* === Final additions — 2026-08-12 === */

/* Quick overview: original mobile layout untouched; hidden only on desktop. */
@media (min-width:701px){
  .concept-v08-1 .hybrid-service-index{
    display:none !important;
  }
}

/* Mobile before/after: allow horizontal dragging from anywhere on the frame while preserving vertical page scroll. */
@media (max-width:700px){
  .concept-v08-1 .concept-compare,
  .concept-v08-1 .concept-compare input[type="range"]{
    touch-action:pan-y;
  }
}


/* === Final server fixes — 2026-08-12 v3 === */

/* Contacts: remove the unwanted rule above the quote while preserving its spacing.
   Opening quote stays exactly where it is; closing quote keeps the approved lowered position. */
.concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style{
  border-top:0 !important;
}

/* Mobile phone before/after: make the phone larger while keeping its optical center.
   Desktop framing is unchanged. */
@media (max-width:700px){
  .concept-v08-1 .concept-compare .compare-before,
  .concept-v08-1 .concept-compare .compare-after{
    background-size:auto 120% !important;
    background-position:16% 50% !important;
  }
}

/* === Final visual polish — 2026-08-12 v4 === */

/* Desktop quote optical alignment:
   lift the quote copy slightly, keep the opening quote visually fixed,
   and lower the closing quote to the visible lower line of “конкурентов”. */
@media (min-width:701px){
  .concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style p{
    position:relative;
    transform:translateY(-8px);
  }
  .concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-open-lock .quote-mark{
    transform:translateY(8px);
  }
  .concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-close-lock .quote-mark{
    transform:translateY(.48em);
  }
}

/* Mobile before/after: one more small zoom step.
   20% horizontal positioning preserves the phone's optical centre at the larger scale. */
@media (max-width:700px){
  .concept-v08-1 .concept-compare .compare-before,
  .concept-v08-1 .concept-compare .compare-after{
    background-size:auto 130% !important;
    background-position:20% 50% !important;
  }
}


/* === Quote symmetry polish — 2026-08-12 v5 ===
   Closing quote raised from the previous over-lowered position.
   The opening quote and lifted copy remain unchanged. */


/* Quote-only hotfix — based on the previous mobile-safe build.
   One unified rule for desktop and mobile; no other layout/JS changes. */
.concept-v08-1 .hybrid-contact-owner blockquote.quote-comma-style .quote-close-lock .quote-mark{
  transform:translateY(calc(.64em - 6px)) !important;
}

/* Desktop technical / mono labels: unified proportions.
   Main showreel eyebrow 12.5px; all other technical labels 11px; weight 400.
   No extra scaling on larger displays; mobile remains unchanged. */
@media (min-width:701px){
  .concept-v08-1 .hero-eyebrow,
  .concept-v08-1 .sheet-section-label,
  .concept-v08-1 .editorial-main-caption,
  .concept-v08-1 .proof-service-index > header > p,
  .concept-v08-1 .proof-service-index nav a > span{
    font-weight:400;
  }
  .concept-v08-1 .hero-eyebrow{font-size:12.5px;}
  .concept-v08-1 .sheet-section-label{font-size:11px;}
  .concept-v08-1 .editorial-main-caption{font-size:11px;}
  .concept-v08-1 .proof-service-index > header > p{font-size:11px;}
  .concept-v08-1 .proof-service-index nav a > span{font-size:11px;}
}


/* === RU microfixes — 2026-08-13 === */
/* Desktop only: fluid before/after phone framing.
   The image zoom adapts smoothly to viewport width: ~116% on narrow desktop,
   ~112–113% on medium desktop and no smaller than 108% on wide screens.
   Mobile framing remains exactly as previously approved. */
@media (min-width:701px){
  .concept-v08-1 .concept-compare .compare-before,
  .concept-v08-1 .concept-compare .compare-after{
    background-size:clamp(108%, calc(120.6% - .66vw), 116%) !important;
    background-position:0 50% !important;
  }
}