/* V4 → dev2: страница «Shipping Details» (page_id 72), все витрины — 18.10.2026. Разметку раскладывает v4-dostavka.js */
html.v4s-page .tygh-content .span4.ty-sidebox-delimiter { display: none !important; }
html.v4s-page .tygh-content .span12 { width: 100% !important; margin-left: 0 !important; float: none !important; }
html.v4s-page .vs-mainbox-general .vs-mainbox-body:empty, html.v4s-page .vs-mainbox-general .ty-wysiwyg-content > div:empty { display: none; }
.v4s-srOnly { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; margin: 0 !important; padding: 0 !important; }
.v4s { --s-ink: #1E2421; --s-txt: #2F3A35; --s-mute: #6B726E; --s-green: #0F5C45; --s-gold: #9A7A3A; max-width: 1200px; margin: 8px auto 0; font: 400 16px/1.6 Inter, system-ui, sans-serif; color: var(--s-txt); }
.v4s p { margin: 0 0 10px; }
.v4s h2 { margin: 0 0 18px; padding: 0; border: 0; font: 600 clamp(28px, 3.4vw, 42px)/1.1 var(--v4-cond), sans-serif; letter-spacing: -.015em; color: var(--s-ink); text-transform: none; text-align: left; }
.v4s h3 { margin: 0 0 6px; font: 700 18px/1.3 Inter, system-ui, sans-serif; color: var(--s-ink); text-transform: none; }
.v4s a { color: var(--s-green); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.v4s a:hover { color: #006B45; }
.v4s strong { color: var(--s-ink); }
.v4s-sec, .v4s-cards, .v4s-info, .v4s-tableWrap, .v4s-help, .v4s-h2 { opacity: 0; transform: translateY(22px); transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
.v4s-in { opacity: 1 !important; transform: none !important; }
.v4s-b > .v4s-sec { margin: 0 0 clamp(36px, 5vw, 64px); }
.v4s-a > * { margin-bottom: clamp(28px, 4vw, 48px); }
.v4s-k { display: block; margin: 0 0 10px !important; font: 700 13px/1 Inter, system-ui, sans-serif !important; letter-spacing: .16em; text-transform: uppercase; color: var(--s-gold) !important; }

/* шапка */
.v4s .v4s-hero { position: relative; display: grid !important; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: center; gap: 20px 28px; padding: clamp(28px, 5vw, 60px); border-radius: 32px; overflow: hidden; background: radial-gradient(120% 140% at 0% 0%, #FBF1DF 0%, #F6F4EF 45%, #E4F1EA 100%); opacity: 1; transform: none; }
.v4s-hero h2 { font-size: clamp(40px, 5.2vw, 68px) !important; line-height: 1.02 !important; margin-bottom: 14px !important; }
.v4s-heroText > * { animation: v4sUp .8s cubic-bezier(.22,1,.36,1) both; }
.v4s-heroText > :nth-child(2) { animation-delay: .08s; } .v4s-heroText > :nth-child(3) { animation-delay: .16s; } .v4s-heroText > :nth-child(4) { animation-delay: .24s; }
@keyframes v4sUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.v4s-heroText > p { max-width: 560px; font-size: 18px; }
.v4s a.v4s-btn { display: inline-flex; align-items: center; gap: 8px; height: 52px; margin-top: 8px; padding: 0 26px; border-radius: 999px; background: var(--s-green); color: #fff !important; font: 600 16px/1 Inter, system-ui, sans-serif; text-decoration: none !important; box-shadow: 0 10px 22px rgba(15,92,69,.22); transition: transform .2s, background .2s; }
.v4s a.v4s-btn:hover { background: #006B45; transform: translateY(-2px); }
.v4s-heroArt { grid-column: 2; grid-row: 1 / span 2; }
.v4s-heroSide { grid-column: 1; display: flex; flex-wrap: wrap; gap: 12px; }
.v4s-heroSide > div { display: flex; flex-direction: column; gap: 2px; padding: 16px 18px; border-radius: 18px; background: rgba(255,255,255,.8); box-shadow: 0 8px 20px rgba(15,40,32,.06); }
.v4s-heroSide > div:has(.v4s-ico) { padding-left: 64px; position: relative; }
.v4s-heroSide .v4s-ico { position: absolute; left: 16px; top: 16px; }
.v4s-heroSide h3 { margin: 0 !important; font-size: 16px !important; }
.v4s-heroSide p { margin: 0 !important; }
.v4s-art { width: 100%; max-width: 380px; display: block; margin: 0 auto; overflow: visible; }
.v4s-art * { transform-box: view-box; fill: none; stroke: #1E2421; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.v4s-sun { fill: #F2D79A !important; stroke: none !important; animation: v4sSun 6s ease-in-out infinite; transform-origin: 236px 52px; }
@keyframes v4sSun { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }
.v4s-hill { fill: #DCEBE2 !important; stroke: none !important; }
.v4s-road path { stroke: #C9C2B2; }
.v4s-dash { stroke: #fff !important; stroke-width: 2 !important; stroke-dasharray: 14 14; animation: v4sRoad .8s linear infinite; }
@keyframes v4sRoad { to { stroke-dashoffset: 28; } }
.v4s-van { animation: v4sDrive 1.4s ease-in-out infinite; }
@keyframes v4sDrive { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
.v4s-vanB { fill: #fff !important; }
.v4s-vanC { fill: #0F5C45 !important; stroke: #0F5C45 !important; }
.v4s-win { fill: #CFE8F7 !important; stroke: #CFE8F7 !important; }
.v4s-leafL { fill: #2E9E6B !important; stroke: none !important; }
.v4s-leafV { stroke: #2E9E6B !important; stroke-width: 2 !important; }
.v4s-wheel { animation: v4sWheel .6s linear infinite; }
.v4s-wheel circle { fill: #1E2421 !important; }
.v4s-wheel path { stroke: #fff !important; stroke-width: 2 !important; }
@keyframes v4sWheel { to { transform: rotate(360deg); } }
.v4s-wind { stroke: #9AA5A0 !important; stroke-width: 2.5 !important; animation: v4sWind 1.2s linear infinite; }
.v4s-w2 { animation-delay: .3s; } .v4s-w3 { animation-delay: .6s; }
@keyframes v4sWind { 0% { transform: translateX(10px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateX(-16px); opacity: 0; } }
.v4s-box { animation: v4sBox 2.8s ease-in-out infinite; transform-origin: 242px 162px; }
.v4s-box path { fill: #F6E7C8; stroke: #9A7A3A; }
.v4s-tape { stroke: #C2533A !important; stroke-width: 4 !important; }
@keyframes v4sBox { 0%, 100% { transform: translateY(0) rotate(0); } 40% { transform: translateY(-8px) rotate(-3deg); } 60% { transform: translateY(0) rotate(0); } }

/* значки */
.v4s-ico { display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 14px; background: #EEF3F0; }
.v4s-ico svg { width: 24px; height: 24px; overflow: visible; fill: none; stroke: var(--s-green); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.v4s-ico svg * { transform-box: fill-box; }
.v4s-spin { transform-origin: center; animation: v4sWheel 1.2s linear infinite; }
.v4s-bob { animation: v4sBob 2.4s ease-in-out infinite; }
@keyframes v4sBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
.v4s-hand { transform-origin: 50% 100%; animation: v4sWheel 4s linear infinite; }
.v4s-pulse { animation: v4sPulse 1.8s ease-in-out infinite; transform-origin: center; }
@keyframes v4sPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.6); } }
.v4s-turn { transform-origin: center; animation: v4sTurn 6s ease-in-out infinite; }
@keyframes v4sTurn { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(-1); } }
.v4s-draw { stroke-dasharray: 14; stroke-dashoffset: 14; animation: v4sDraw 3s ease-in-out infinite; }
@keyframes v4sDraw { 0% { stroke-dashoffset: 14; } 40%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 14; } }

/* заголовок раздела с пометкой */
.v4s-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 18px; }
.v4s-head h2 { margin: 0 !important; }
.v4s-note { padding: 6px 12px; border-radius: 999px; background: #F6F4EF; font: 500 13px/1.2 Inter, system-ui, sans-serif; color: var(--s-mute); }

/* карточки */
.v4s .v4s-cards { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin: 0 0 16px; }
.v4s .v4s-card { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 22px; border: 1px solid #ECE6DA; border-radius: 24px; background: #FBFAF7; transition: transform .3s, box-shadow .3s; }
.v4s-in .v4s-card, .v4s-cards.v4s-in > .v4s-card { animation: v4sUp .7s cubic-bezier(.22,1,.36,1) both; animation-delay: calc(var(--i) * 100ms); }
.v4s .v4s-card:hover { transform: translateY(-4px); box-shadow: 0 16px 30px rgba(15,40,32,.08); }
.v4s-card .v4s-ico { margin-bottom: 8px; }
.v4s-card p { margin: 0 !important; }
.v4s-card > div:not(:has(h3)) { font: 600 34px/1.1 var(--v4-cond), sans-serif; color: var(--s-ink); }
.v4s-card > div span { font: 500 15px Inter, system-ui, sans-serif; color: var(--s-mute); }
.v4s-cardK { font: 700 13px/1.2 Inter, system-ui, sans-serif !important; letter-spacing: .08em; text-transform: uppercase; color: var(--s-mute) !important; }
.v4s-big { font: 600 40px/1.05 var(--v4-cond), sans-serif !important; color: var(--s-green) !important; }
.v4s-card:nth-child(3n+2) .v4s-big { color: #B8762E !important; }
.v4s-card:nth-child(3n+3) .v4s-big { color: #7A6BB0 !important; }
.v4s-card:nth-child(3n+2) .v4s-ico { background: #FAF1E4; } .v4s-card:nth-child(3n+2) .v4s-ico svg { stroke: #B8762E; }
.v4s-card:nth-child(3n+3) .v4s-ico { background: #F2F0F8; } .v4s-card:nth-child(3n+3) .v4s-ico svg { stroke: #7A6BB0; }
.v4s-foot { margin: 6px 0 0 !important; font-size: 14.5px; color: var(--s-mute); }

/* факты и совет */
.v4s .v4s-facts { display: grid !important; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 16px; align-items: stretch; }
.v4s-factList { display: grid; gap: 12px; }
.v4s-fact { display: grid; grid-template-columns: 44px 1fr; column-gap: 14px; align-items: center; padding: 16px 18px; border-radius: 18px; background: #FBFAF7; border: 1px solid #ECE6DA; }
.v4s-fact .v4s-ico { grid-row: 1 / span 2; }
.v4s-fact p { margin: 0 !important; }
.v4s-factK { font: 600 13px/1.3 Inter, system-ui, sans-serif !important; letter-spacing: .04em; text-transform: uppercase; color: var(--s-mute) !important; }
.v4s-fact p + p { font: 600 17px/1.35 Inter, system-ui, sans-serif; color: var(--s-ink); }
.v4s-tip { position: relative; padding: 24px 24px 24px 72px; border-radius: 22px; background: #FBF6EA; border: 1px dashed #D9C79A; }
.v4s-tip::before { content: ""; position: absolute; left: 24px; top: 24px; width: 30px; height: 30px; background: #C9A961; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4M12 3a6 6 0 0 0-4 10.5c.8.8 1 1.5 1 2.5h6c0-1 .2-1.7 1-2.5A6 6 0 0 0 12 3z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4M12 3a6 6 0 0 0-4 10.5c.8.8 1 1.5 1 2.5h6c0-1 .2-1.7 1-2.5A6 6 0 0 0 12 3z'/%3E%3C/svg%3E") center / contain no-repeat; animation: v4sPulse2 3s ease-in-out infinite; }
@keyframes v4sPulse2 { 0%, 100% { opacity: .7; } 50% { opacity: 1; } }
.v4s-tip p { margin: 0 !important; }

/* вопросы */
.v4s-qs { display: grid; gap: 12px; }
.v4s-q { border: 1px solid #ECE6DA; border-radius: 20px; background: #FBFAF7; transition: background .2s, box-shadow .2s; }
.v4s-q[open] { background: #fff; box-shadow: 0 12px 26px rgba(15,40,32,.07); }
.v4s-q summary { position: relative; display: block; padding: 20px 60px 20px 22px; list-style: none; cursor: pointer; font: 600 17px/1.35 Inter, system-ui, sans-serif; color: var(--s-ink); }
.v4s-q summary::-webkit-details-marker { display: none; }
.v4s-q summary::after { content: ""; position: absolute; right: 20px; top: 50%; width: 28px; height: 28px; margin-top: -14px; border-radius: 50%; background: #EEF3F0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F5C45' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center / 16px no-repeat; transition: transform .3s, background-color .2s; }
.v4s-q[open] summary::after { transform: rotate(45deg); background-color: #F3EBDB; }
.v4s-a { padding: 0 22px 18px; }
.v4s-a p { margin: 0 !important; }
.v4s-q[open] .v4s-a { animation: v4sUp .4s ease both; }

/* раскладка А: пояснения и таблица */
.v4s-info { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.v4s-infoCard { display: flex; flex-direction: column; gap: 4px; padding: 24px; border-radius: 24px; background: #FBFAF7; border: 1px solid #ECE6DA; }
.v4s-infoCard h2 { margin: 8px 0 6px !important; font-size: 26px !important; }
.v4s-infoCard p { margin: 0 !important; }
.v4s-tableWrap { overflow-x: auto; border-radius: 22px; border: 1px solid #ECE6DA; }
.v4s-tableWrap table { width: 100%; min-width: 420px; border-collapse: collapse; background: #fff; }
.v4s-tableWrap th { padding: 14px 18px; background: #F6F4EF; text-align: left; font: 700 13px/1.2 Inter, system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--s-mute); }
.v4s-tableWrap td { padding: 16px 18px; border-top: 1px solid #F0ECE3; font: 500 15.5px/1.4 Inter, system-ui, sans-serif; color: var(--s-ink); }
.v4s-tableWrap tr:hover td { background: #FBFAF7; }
.v4s-tableWrap td:first-child { font-weight: 700; }

/* помощь */
.v4s .v4s-help { position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; padding: clamp(24px, 4vw, 40px); border-radius: 32px; background: linear-gradient(135deg, #0F5C45, #1F7A5C); color: rgba(255,255,255,.88); }
.v4s-help .v4s-ico { background: rgba(255,255,255,.14); width: 56px; height: 56px; border-radius: 18px; }
.v4s-help .v4s-ico svg { stroke: #fff; width: 28px; height: 28px; }
.v4s-help > div { flex: 1 1 280px; }
.v4s-help h3 { color: #fff !important; font: 600 clamp(24px, 2.6vw, 32px)/1.15 var(--v4-cond), sans-serif !important; }
.v4s-help p { margin: 0 !important; color: rgba(255,255,255,.88) !important; }
.v4s-help a { color: #F2D79A !important; }
.v4s-help a.v4s-btn { background: #fff; color: var(--s-green) !important; box-shadow: none; margin: 0; }
.v4s-help a.v4s-btn:hover { background: #F3EBDB; }

@media (max-width: 1006px) {
  .v4s .v4s-hero { grid-template-columns: 1fr; }
  .v4s-heroArt { grid-column: 1; grid-row: auto; order: -1; }
  .v4s-art { max-width: 300px; }
  .v4s .v4s-facts { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .v4s .v4s-hero { padding: 24px 20px; border-radius: 24px; }
  .v4s-hero h2 { font-size: 38px !important; }
  .v4s .v4s-help { border-radius: 24px; }
  .v4s a.v4s-btn { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .v4s *, .v4s { animation: none !important; transition: none !important; }
  .v4s-sec, .v4s-cards, .v4s-info, .v4s-tableWrap, .v4s-help, .v4s-h2 { opacity: 1; transform: none; }
}
/* 18.10.2026, слово владельца: без хлебных крошек на этой странице */
html.v4s-page .ty-breadcrumbs, html.v4s-page .vs-breadcrumbs, html.v4s-page [class*="breadcrumbs"] { display: none !important; }
/* 18.10.2026, тест устройств: на телефоне кнопка во всю ширину вылезала за карточку (ширина + поля) */
.v4s a.v4s-btn { box-sizing: border-box; max-width: 100%; }