/* Ringo v7 (владелец 14.11, 26129/26138): сцены из слоёв — прокрутка, мышь, наклон телефона, тап, свайп. */
.v7 .eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--plum);margin-bottom:14px}
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.w>i{display:inline-block;font-style:normal;will-change:transform}
.ly,.lp{position:absolute;inset:0;pointer-events:none}
.lp{transform:translate3d(calc(var(--px,0)*var(--d,0)*1px),calc(var(--py,0)*var(--d,0)*1px),0)}
.wa-dot,.call-dot{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center}
.wa-dot{background:#25D366}.call-dot{background:var(--gold)}
.wa-dot svg,.call-dot svg{width:20px;height:20px;fill:#fff}
.note{display:flex;gap:12px;align-items:flex-start;width:300px;padding:12px 14px;border-radius:18px;background:#FFFFFFF2;box-shadow:0 18px 40px -18px #14171F80,0 1px 0 #fff inset;backdrop-filter:blur(10px);font-size:13px;line-height:18px;color:var(--text)}
.note b{display:flex;justify-content:space-between;font-size:12px;font-weight:600;color:var(--muted)}
.note b small{font-weight:500;font-size:11px}
.note p{margin-top:2px}

/* 1. Первый экран: улица → фургон → флаер → заявки */
.v7-hero{position:relative;height:100svh;min-height:640px;max-height:980px;overflow:hidden;isolation:isolate}
.v7-stage{position:absolute;inset:0;z-index:0}
.ly-bg .lp{inset:-40px}
.ly-bg img{position:absolute;top:0;right:0;width:66%;height:100%;object-fit:cover;object-position:14% 50%;transform-origin:40% 55%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 26%);mask-image:linear-gradient(90deg,transparent,#000 26%)}
.ly-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0%,var(--bg) 34%,#F6F2EA00 52%),linear-gradient(0deg,var(--bg) 0%,#F6F2EA00 20%)}
.ly-van img{position:absolute;right:-4%;bottom:3%;width:min(38vw,620px);filter:drop-shadow(0 24px 20px #14171F55)}
.ly-van .shadow{position:absolute;right:-2%;bottom:3%;width:min(35vw,580px);height:44px;border-radius:50%;background:radial-gradient(#14171F77,transparent 70%)}
.flyer{position:absolute;right:13%;top:9%;width:min(23vw,340px);transform:rotate(6deg);transform-style:preserve-3d}
.flyer img{width:100%;border-radius:14px;box-shadow:0 40px 70px -24px #14171F99,0 2px 0 #fff inset}
.flyer::after{content:'';position:absolute;inset:0;border-radius:14px;background:linear-gradient(115deg,#ffffff55,transparent 35%,transparent 70%,#ffffff22);mix-blend-mode:soft-light;pointer-events:none}
.ly-notes .note{position:absolute;opacity:0}
.ly-notes .n1{right:27%;top:52%;opacity:1}
.ly-notes .n2{left:63vw;top:28%}
.ly-notes .n3{left:9vw;top:24%}
.ly-notes .n4{left:65vw;top:55%}
.v7-hero-copy{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;max-width:1376px;margin:0 auto;padding:0 48px 60px}
.v7-hero-copy>*{max-width:600px;pointer-events:auto}
.v7-hero-copy{pointer-events:none}
.v7-hero h1{font-size:clamp(44px,5.4vw,76px);line-height:1.04;font-weight:700;letter-spacing:-.02em;margin-bottom:24px}
.v7-hero h1 .ring>i{color:var(--gold)}
.v7-hero .hero-sub{font-size:18px;line-height:29px;color:var(--muted);max-width:480px;margin-bottom:30px}
.v7-hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}
.hero-end{position:absolute;left:50%;bottom:9%;z-index:3;transform:translateX(-50%);font-size:clamp(22px,2.4vw,34px);font-weight:700;opacity:0;text-align:center;width:90%}
.hero-end em{font-style:normal;color:var(--gold)}
.scroll-cue{position:absolute;left:48px;bottom:28px;z-index:3;display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}
.scroll-cue i{width:22px;height:34px;border:2px solid var(--line);border-radius:12px;position:relative}
.scroll-cue i::after{content:'';position:absolute;left:50%;top:6px;width:4px;height:7px;margin-left:-2px;border-radius:2px;background:var(--gold);animation:cue 1.6s var(--arrival) infinite}
@keyframes cue{0%{transform:translateY(0);opacity:1}100%{transform:translateY(12px);opacity:0}}

/* 2. Флаер собирается из частей */
.v7-build{position:relative;background:var(--wash)}
.build-pin{height:100svh;min-height:640px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:64px;max-width:1280px;margin:0 auto;padding:0 48px}
.build-copy h2,.ring-copy h2,.stack-copy h2{font-size:clamp(36px,4vw,56px);line-height:1.08;font-weight:700;letter-spacing:-.02em;margin-bottom:24px}
.build-steps{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:10px}
.build-steps li{display:flex;align-items:center;gap:14px;font-size:17px;color:var(--muted);transition:color .3s}
.build-steps li::before{content:'';width:10px;height:10px;border-radius:50%;border:2px solid var(--line);transition:.3s var(--arrival)}
.build-steps li.on{color:var(--text)}
.build-steps li.on::before{background:var(--gold);border-color:var(--gold);transform:scale(1.3)}
.build-steps b{font-weight:600}
.build-copy .fine{color:var(--muted);font-size:15px}
.build-stage{perspective:1400px;display:grid;place-items:center}
.build-flyer{position:relative;width:min(400px,36vw);aspect-ratio:4/5;transform-style:preserve-3d;transform:rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg))}
.build-flyer .base{position:absolute;inset:0;border-radius:16px;background:#fff;box-shadow:0 50px 80px -30px #14171F88;opacity:.0}
.pc{position:absolute;background-image:url(ads/ad-23.jpg);background-repeat:no-repeat;will-change:transform}
.build-chip{position:absolute;right:-18px;top:-18px;padding:8px 14px;border-radius:999px;background:var(--text);color:var(--bg);font-size:13px;font-weight:600;opacity:0}

/* 3. Камера въезжает в телефон на приборке */
.v7-dash{position:relative;height:100svh;overflow:hidden;background:#1d140e}
.dash-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:transform}
.dash-copy{position:absolute;left:0;right:0;bottom:12%;text-align:center;color:#fff;padding:0 24px;text-shadow:0 2px 24px #000a}
.dash-copy p{font-size:clamp(26px,3vw,44px);font-weight:700;line-height:1.15}
.dash-copy small{display:block;font-size:16px;font-weight:500;opacity:.8;margin-top:10px}
.dash-flash{position:absolute;inset:0;background:var(--bg);opacity:0}

/* 4. Телефон звонит */
.v7-ring{position:relative;background:var(--bg)}
.ring-pin{position:relative;height:100svh;min-height:680px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:40px;max-width:1376px;margin:0 auto;padding:0 48px}
.ring-waves{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.ring-copy{position:relative;z-index:2}
.ring-metrics{display:flex;gap:28px;margin:6px 0 14px}
.ring-metrics span{font-size:15px;color:var(--muted)}
.ring-metrics b{display:block;font-size:48px;line-height:1.1;font-weight:700;color:var(--text)}
.ring-copy .fine{font-size:12px;color:var(--muted)}
.ring-phone{position:relative;z-index:2;width:300px;height:620px;border-radius:50px;padding:10px;background:linear-gradient(135deg,#F8EFE5,#746A6A 21%,#201B1C 48%,#A89D98 79%,#E8DDD4);box-shadow:0 50px 90px -30px #14171F99}
.ring-phone.buzz{animation:buzz .5s linear 2}
@keyframes buzz{0%,100%{transform:translateX(0) rotate(0)}20%{transform:translateX(-5px) rotate(-1.5deg)}40%{transform:translateX(5px) rotate(1.5deg)}60%{transform:translateX(-4px) rotate(-1deg)}80%{transform:translateX(3px) rotate(.8deg)}}
.rp-screen{position:relative;height:100%;border-radius:41px;overflow:hidden;background:linear-gradient(170deg,#2a1d16,#7a3a1c 55%,#ff8a5c);color:#fff;padding:52px 12px 0}
.rp-screen::before{content:'';position:absolute;top:12px;left:50%;width:96px;height:28px;margin-left:-48px;border-radius:20px;background:#000}
.rp-date{text-align:center;font-size:14px;opacity:.85}
.rp-time{text-align:center;font-size:72px;line-height:1;font-weight:600;letter-spacing:-.02em;margin-bottom:22px}
.rp-notes{display:grid;gap:8px}
.rp-notes .note{width:auto;font-size:12px;line-height:16px;padding:10px 12px;border-radius:16px;opacity:0}
.rp-notes .wa-dot,.rp-notes .call-dot{width:32px;height:32px}
.rp-notes .wa-dot svg,.rp-notes .call-dot svg{width:17px;height:17px}
.ring-plumber{position:relative;z-index:1;align-self:end;justify-self:start}
.ring-plumber img{width:min(30vw,440px);opacity:0;filter:drop-shadow(0 30px 40px #14171F44)}
.ring-tap{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:3;font-size:12px;color:var(--muted)}

/* 5. Стопка флаеров */
.v7-stack{position:relative;background:var(--wash)}
.stack-pin{height:100svh;min-height:640px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:64px;max-width:1280px;margin:0 auto;padding:0 48px}
.stack-copy p{color:var(--muted);font-size:17px;max-width:440px}
.stack-count{margin-top:26px;font-size:15px !important}
.stack-count b{font-size:44px;color:var(--text);font-weight:700;margin-right:6px}
.stack-copy .fine{font-size:13px;margin-top:16px}
.stack-deck{position:relative;width:min(400px,34vw);aspect-ratio:4/5;justify-self:center;touch-action:pan-y;cursor:grab}
.stack-deck img{position:absolute;inset:0;width:100%;height:100%;border-radius:18px;box-shadow:0 30px 60px -28px #14171F99;will-change:transform;user-select:none;-webkit-user-drag:none}
.stack-hint{position:absolute;left:0;right:0;bottom:-44px;text-align:center;font-size:12px;color:var(--muted)}
.v7 .gallery{padding:72px 0 96px}

@media (max-width:900px){
  .v7-hero{height:calc(100svh - 80px);min-height:600px;max-height:none;display:flex;flex-direction:column}
  .v7-hero-copy{order:-1;height:auto;flex:none;padding:12px 24px 0}
  .v7-hero h1{font-size:38px;margin-bottom:12px}
  .v7-hero .hero-sub{font-size:15px;line-height:23px;margin-bottom:16px}
  .v7-hero .actions{margin-bottom:0}
  .v7-hero .actions .secondary,.v7-hero .trust-row{display:none}
  .v7-stage{position:relative;flex:1;min-height:0;margin-top:4px}
  .ly-bg::after{background:linear-gradient(180deg,var(--bg) 0%,#F6F2EA00 26%),linear-gradient(0deg,var(--bg) 0%,#F6F2EA00 24%)}
  .ly-van img{right:auto;left:-6%;bottom:8%;width:74vw}
  .ly-van .shadow{right:auto;left:-4%;width:70vw}
  .flyer{right:6%;top:4%;width:56vw;max-width:300px}
  .ly-notes .note{width:250px;font-size:12px;line-height:16px}
  .ly-notes .n1{right:auto;left:5%;top:58%}
  .ly-notes .n2{right:4%;top:72%}
  .ly-notes .n3{right:auto;left:4%;top:8%}
  .ly-notes .n4{right:auto;left:8%;top:84%}
  .hero-end{bottom:auto;top:6%;font-size:22px}
  .scroll-cue{display:none}
  .build-pin,.stack-pin{grid-template-columns:1fr;gap:28px;align-content:center;padding:0 24px}
  .build-copy h2,.ring-copy h2,.stack-copy h2{font-size:32px;margin-bottom:14px}
  .build-steps{gap:4px;margin-bottom:0}
  .build-steps li{font-size:14px;gap:10px}
  .build-copy .fine{display:none}
  .build-flyer{width:min(300px,70vw)}
  .ring-pin{grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:16px;padding:24px 24px 0;align-items:start;justify-items:center}
  .ring-copy{text-align:center}
  .ring-metrics{justify-content:center;margin:0 0 6px}
  .ring-metrics b{font-size:34px}
  .ring-copy p:not(.fine){display:none}
  .ring-pin{padding-top:16px}
  .ring-phone{width:226px;height:466px;border-radius:42px;padding:8px}
  .rp-screen{border-radius:36px;padding-top:46px}
  .rp-time{font-size:58px;margin-bottom:14px}
  .ring-plumber{display:none}
  .stack-copy{text-align:center}
  .stack-copy p{margin:0 auto}
  .stack-copy p:not(.stack-count){display:none}
  .stack-count{margin-top:10px}
  .stack-count b{font-size:30px}
  .stack-copy .fine{display:none}
  .stack-deck{width:min(290px,70vw)}
}
@media (prefers-reduced-motion:reduce){html:not(.motion) .lp{transform:none}html:not(.motion) :is(.ly-notes .note,.rp-notes .note,.ring-plumber img,.hero-end){opacity:1}}
