/* Mobile-only layer. Desktop layout/CSS/JS remain unchanged. */
:root{
  --m-gold:#c39035;
  --m-gold2:#e0b95f;
  --m-text:#f4eee5;
  --m-muted:#cfc4b2;
  --m-panel:rgba(15,14,12,.88);
  --m-line:rgba(255,255,255,.14);
  --m-ease:cubic-bezier(.65,0,.35,1);
  --m-dur:1040ms;
  --m-cut:14px;
}

html,body{width:100%;min-width:0!important;height:100%;overflow:hidden!important;background:#000!important;-webkit-text-size-adjust:100%}
body{color:var(--m-text);touch-action:none}
body.modal-open{touch-action:auto}

.site-bg{position:fixed!important;inset:0!important;z-index:-10!important;overflow:hidden!important;background:#000!important}
.site-bg::before{content:""!important;position:absolute!important;inset:-8%!important;background:url("/images/bg/dark_texture_upscaled_4x.webp") center/cover no-repeat!important;filter:brightness(1.18) contrast(1.08)!important;opacity:.88!important;transform:rotate(90deg) scale(1.2)!important;pointer-events:none!important}
.site-bg::after{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 0 0,rgba(195,135,45,.13),transparent 34%),radial-gradient(circle at 100% 0,rgba(195,135,45,.11),transparent 32%),linear-gradient(180deg,rgba(0,0,0,.14),rgba(0,0,0,.62))!important;pointer-events:none!important}

.site-header{position:fixed!important;inset:0 0 auto 0!important;height:0!important;padding:0!important;z-index:90!important;background:transparent!important;pointer-events:none!important}
.header-brand{position:fixed!important;top:16px!important;left:16px!important;width:78px!important;height:48px!important;display:block!important;opacity:0!important;pointer-events:auto!important;transform:translateY(-8px) rotate(-4deg)!important;transition:opacity 360ms ease,transform 520ms var(--m-ease)!important}
body.mobile-ready:not(.mobile-page-0) .header-brand{opacity:.92!important;transform:translateY(0) rotate(-4deg)!important}
.header-brand__head{display:block!important;width:78px!important;height:auto!important}.header-brand__word{display:none!important}

.menu-button{position:fixed!important;z-index:92!important;top:18px!important;right:16px!important;left:auto!important;min-width:116px!important;height:42px!important;padding:0 14px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:12px!important;border:1px solid rgba(195,144,53,.62)!important;background:rgba(0,0,0,.34)!important;color:#fff!important;text-transform:uppercase!important;letter-spacing:.1em!important;font-size:12px!important;font-weight:800!important;pointer-events:auto!important;transform:none!important;backdrop-filter:blur(8px)!important;transition:top 520ms var(--m-ease),left 520ms var(--m-ease),right 520ms var(--m-ease),transform 520ms var(--m-ease),opacity 260ms ease!important}
body.mobile-page-0 .menu-button{top:calc(50svh + 168px)!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important}
.menu-button i{width:25px!important;height:12px!important;display:block!important;position:relative!important}.menu-button i::before,.menu-button i::after{content:""!important;position:absolute!important;left:0!important;width:100%!important;height:2px!important;background:#fff!important;transition:.22s ease!important}.menu-button i::before{top:0!important}.menu-button i::after{bottom:0!important}.menu-button[aria-expanded="true"] i::before{top:5px!important;transform:rotate(45deg)!important}.menu-button[aria-expanded="true"] i::after{bottom:5px!important;transform:rotate(-45deg)!important}

.mobile-menu-backdrop{position:fixed;inset:0;z-index:84;background:rgba(0,0,0,.68);opacity:0;pointer-events:none;transition:.22s ease;backdrop-filter:blur(2px)}.mobile-menu-backdrop.open{opacity:1;pointer-events:auto}
.menu-panel{position:fixed!important;top:50%!important;left:50%!important;right:auto!important;width:min(330px,calc(100vw - 34px))!important;max-height:calc(100svh - 90px)!important;overflow:auto!important;z-index:100!important;background:rgba(5,4,3,.96)!important;border:1px solid rgba(195,144,53,.58)!important;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)!important;transform:translate(-50%,-46%) scale(.96)!important;opacity:0!important;pointer-events:none!important;transition:.24s ease!important;backdrop-filter:blur(10px)!important;box-shadow:0 28px 80px rgba(0,0,0,.65)!important}.menu-panel.open{transform:translate(-50%,-50%) scale(1)!important;opacity:1!important;pointer-events:auto!important}.menu-panel a,.menu-panel button{width:100%!important;min-height:54px!important;display:flex!important;align-items:center!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.08)!important;background:rgba(255,255,255,.035)!important;color:#fff!important;padding:0 18px!important;text-transform:uppercase!important;font-weight:800!important;letter-spacing:.08em!important;font-size:13px!important;text-align:left!important}.menu-panel button{color:var(--m-gold2)!important;background:rgba(195,144,53,.18)!important}

main{height:auto!important;min-height:0!important;width:100%!important;overflow:visible!important;transform:translate3d(0,0,0);transition:transform var(--m-dur) var(--m-ease)!important;will-change:transform}
.screen{width:100%!important;height:100svh!important;min-height:100svh!important;padding:72px 18px 46px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;overflow:hidden!important;position:relative!important;border-bottom:1px solid rgba(255,255,255,.08)!important}.screen::after{content:""!important;position:absolute!important;left:18px!important;right:18px!important;bottom:20px!important;height:1px!important;background:linear-gradient(90deg,transparent,rgba(195,144,53,.34),transparent)!important;opacity:.45!important;pointer-events:none!important}
.eyebrow{font-size:11px!important;letter-spacing:.16em!important;margin:0 0 10px!important;color:var(--m-gold2)!important}h1,h2,h3{text-wrap:balance!important}h2{font-size:clamp(38px,11vw,56px)!important;line-height:.9!important;letter-spacing:-.035em!important}h3{font-size:clamp(26px,8vw,40px)!important;line-height:.92!important}.btn{height:48px!important;padding:0 18px!important;font-size:11px!important}

/* Hero has two real mobile pages inside one desktop section */
.hero-screen{height:200svh!important;min-height:200svh!important;display:block!important;padding:0 18px!important}.hero-grid{width:100%!important;height:200svh!important;min-height:200svh!important;display:block!important;transform:none!important}.hero-logo-stack{height:100svh!important;min-height:100svh!important;display:grid!important;align-content:center!important;justify-items:center!important;gap:10px!important;padding-bottom:48px!important}.hero-head{width:min(86vw,400px)!important;margin:0 auto!important;transform:translateY(10px)!important;transition:opacity 360ms ease,transform 520ms var(--m-ease)!important}.hero-word{width:min(82vw,390px)!important;margin:0 auto!important;transform:translateY(-4px)!important}.hero-copy{height:100svh!important;min-height:100svh!important;width:100%!important;max-width:350px!important;margin:0 auto!important;padding:0!important;border:0!important;text-align:center!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important}.hero-title{font-size:clamp(56px,17vw,92px)!important;line-height:.82!important;letter-spacing:-.038em!important;max-width:100%!important;text-align:center!important}.hero-title span{letter-spacing:-.038em!important}.hero-lead{font-size:18px!important;max-width:310px!important;margin:22px auto 24px!important;color:var(--m-muted)!important}.hero-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;width:min(285px,100%)!important;margin:0 auto!important}body.mobile-page-0 .hero-screen::before{content:""!important;position:absolute!important;left:50%!important;top:calc(100svh - 72px)!important;width:28px!important;height:28px!important;transform:translateX(-50%) rotate(45deg)!important;border-right:2px solid var(--m-gold2)!important;border-bottom:2px solid var(--m-gold2)!important;animation:mobileArrowBounce 1.35s ease-in-out infinite!important;opacity:.9!important}@keyframes mobileArrowBounce{0%,100%{transform:translate(-50%,0) rotate(45deg);opacity:.52}45%{transform:translate(-50%,10px) rotate(45deg);opacity:1}}

/* Product has two real mobile pages */
.product-screen{height:200svh!important;min-height:200svh!important;display:block!important;padding:0 18px!important}.product-layout{width:100%!important;height:200svh!important;display:block!important}.product-copy,.texture-showcase{height:100svh!important;min-height:100svh!important;display:flex!important;flex-direction:column!important;justify-content:center!important}.product-copy h3{font-family:Montserrat,Arial,sans-serif!important;font-size:23px!important;line-height:1.15!important;letter-spacing:0!important;color:var(--m-gold2)!important;margin:16px 0 14px!important}.product-copy p{font-size:15px!important;line-height:1.46!important;margin:0 0 18px!important;color:#efe7da!important;font-weight:600!important}.mini-facts{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:22px 0 0!important}.mini-facts article{padding:16px!important;background:var(--m-panel)!important;border:1px solid var(--m-line)!important;clip-path:polygon(var(--m-cut) 0,100% 0,100% calc(100% - var(--m-cut)),calc(100% - var(--m-cut)) 100%,0 100%,0 var(--m-cut))!important}.mini-facts b{display:block!important;text-transform:uppercase!important;margin-bottom:7px!important}.mini-facts span{color:var(--m-muted)!important;font-size:13px!important}.texture-title{color:var(--m-gold2)!important;font-size:26px!important;line-height:1.12!important;text-align:center!important;margin:0 0 16px!important}.texture-strip{width:100%!important;height:auto!important;display:grid!important;grid-template-columns:repeat(2,1fr)!important;overflow:hidden!important;border:1px solid rgba(195,144,53,.24)!important;background:#050403!important;clip-path:polygon(13px 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%,0 13px)!important}.texture-strip figure{margin:0!important;display:grid!important;grid-template-rows:120px 50px!important;text-align:center!important;background:#050403!important;overflow:hidden!important}.texture-strip img{width:100%!important;height:120px!important;object-fit:cover!important;object-position:center bottom!important;background:#050403!important}.texture-strip figcaption{height:50px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:rgba(0,0,0,.76)!important;font-size:12px!important;font-weight:800!important;line-height:1.12!important;padding:8px!important}.texture-cta{width:100%!important;margin:18px 0 0!important}

/* Benefits */
.benefits-screen .section-inner{height:100%!important;width:100%!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:14px!important;overflow:hidden!important}.benefits-screen .section-head{align-self:stretch!important;margin:0!important}.benefits-screen h2{font-size:clamp(38px,11vw,56px)!important;line-height:.88!important;max-width:360px!important}.benefit-grid{display:grid!important;grid-auto-flow:column!important;grid-template-rows:repeat(2,minmax(0,1fr))!important;grid-template-columns:none!important;grid-auto-columns:calc(100vw - 36px)!important;gap:16px 36px!important;width:max-content!important;height:calc(100svh - 255px)!important;min-height:0!important;margin:0!important;transform:translate3d(calc(var(--mobile-benefit-page,0) * -100vw),0,0)!important;transition:transform var(--m-dur) var(--m-ease)!important}.benefit-grid article{min-height:0!important;padding:18px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;background:var(--m-panel)!important;border:1px solid var(--m-line)!important;clip-path:polygon(var(--m-cut) 0,100% 0,100% calc(100% - var(--m-cut)),calc(100% - var(--m-cut)) 100%,0 100%,0 var(--m-cut))!important}.benefit-grid article h3{font-size:clamp(28px,8.4vw,38px)!important;line-height:.9!important;letter-spacing:-.025em!important;margin:0!important}.benefit-grid article p{margin:0!important;font-size:14px!important;line-height:1.38!important;color:var(--m-muted)!important}.source-note{font-size:11px!important;margin:0!important;color:var(--m-muted)!important;line-height:1.25!important}

/* Characteristics */
.characteristics-screen{display:flex!important;padding:72px 18px 46px!important}.char-stage{height:100%!important;width:100%!important;overflow:hidden!important;padding:0!important;display:flex!important;flex-direction:column!important;justify-content:center!important}.char-top{height:auto!important;min-height:0!important;padding:0!important;display:block!important;margin:0 0 14px!important}.char-top h2{font-size:clamp(34px,10vw,48px)!important;line-height:.9!important;max-width:360px!important}.char-progress{display:flex!important;gap:8px!important;position:static!important;margin:14px 0 0!important;width:100%!important}.char-progress span{flex:1!important;width:auto!important;height:4px!important;background:rgba(255,255,255,.16)!important}.char-progress span.active{background:var(--m-gold2)!important;box-shadow:0 0 18px rgba(224,185,95,.22)!important}.char-viewport{height:calc(100svh - 210px)!important;min-height:0!important;overflow:hidden!important}.char-track{height:100%!important;display:flex!important;transition:transform var(--m-dur) var(--m-ease)!important;transform:translate3d(calc(var(--mobile-char-index,0) * -100%),0,0)!important}.char-panel{flex:0 0 100%!important;width:100%!important;height:100%!important;padding:0!important;overflow:hidden!important;display:block!important}.panel-shell{height:100%!important;width:100%!important;min-height:0!important;margin:0!important;padding:16px!important;overflow:auto!important;display:block!important;background:var(--m-panel)!important;border:1px solid var(--m-line)!important;clip-path:polygon(var(--m-cut) 0,100% 0,100% calc(100% - var(--m-cut)),calc(100% - var(--m-cut)) 100%,0 100%,0 var(--m-cut))!important}.panel-title{margin:0 0 14px!important}.panel-title h3{font-size:clamp(24px,7vw,34px)!important;line-height:.95!important;letter-spacing:-.025em!important}.sizes-layout,.lab-layout{display:block!important}.size-main{min-height:0!important;padding:16px!important;margin-bottom:10px!important}.size-main strong{font-size:26px!important;line-height:1!important;margin:14px 0 12px!important}.size-main p{font-size:13px!important}.size-cards,.metrics-grid,.ratio-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.size-cards article,.metrics-grid article,.ratio-grid article{min-height:96px!important;padding:12px!important}.size-cards b,.metrics-grid b,.ratio-grid b,.size-main b{font-size:11px!important}.size-cards span{font-size:15px!important}.metrics-grid article strong,.ratio-grid article strong{font-size:24px!important;line-height:.95!important}.comparison-table{display:grid!important;grid-template-columns:.68fr 1.06fr 1.06fr!important;gap:0!important;border:1px solid rgba(255,255,255,.12)!important}.comparison-table .th{display:block!important;background:rgba(255,255,255,.08)!important;color:#fff!important;font-size:10px!important;text-transform:uppercase!important}.comparison-table .accent{color:var(--m-gold2)!important}.comparison-table>div{min-height:0!important;padding:9px 7px!important;border:1px solid rgba(255,255,255,.09)!important;font-size:11px!important;line-height:1.28!important}.comparison-table>div:nth-child(3n+1):not(.th){color:var(--m-gold2)!important;font-weight:800!important;background:rgba(195,144,53,.10)!important}.panel-note{font-size:12px!important;margin-top:12px!important}

/* Applications */
.applications-screen .section-inner{height:100%!important;width:100%!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:16px!important;overflow:hidden!important}.applications-screen .section-head{margin:0!important;align-self:stretch!important}.applications-screen h2{font-size:clamp(34px,10vw,48px)!important}.application-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}.application-grid article{min-height:94px!important;padding:13px!important;background:var(--m-panel)!important;border:1px solid var(--m-line)!important;clip-path:polygon(var(--m-cut) 0,100% 0,100% calc(100% - var(--m-cut)),calc(100% - var(--m-cut)) 100%,0 100%,0 var(--m-cut))!important}.application-grid article b{display:block!important;color:var(--m-gold2)!important;text-transform:uppercase!important;margin-bottom:8px!important;font-size:14px!important;line-height:1.1!important}.application-grid article span{font-size:12px!important;color:var(--m-muted)!important;line-height:1.25!important}.applications-screen .source-note{display:none!important}

/* Supply */
.supply-screen .section-inner{height:100%!important;width:100%!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:18px!important}.supply-screen .section-head{margin:0!important}.supply-screen h2{font-size:clamp(34px,10vw,50px)!important}.supply-grid{display:grid!important;grid-template-columns:1fr!important;gap:22px!important;margin:0!important}.supply-grid article{min-height:168px!important;padding:24px 22px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;background:var(--m-panel)!important;border:1px solid var(--m-line)!important;clip-path:polygon(var(--m-cut) 0,100% 0,100% calc(100% - var(--m-cut)),calc(100% - var(--m-cut)) 100%,0 100%,0 var(--m-cut))!important}.supply-grid article b{font-size:17px!important;line-height:1.15!important;color:var(--m-gold2)!important;letter-spacing:.02em!important}.supply-grid article strong{font-size:clamp(26px,7.6vw,34px)!important;line-height:.95!important;margin:18px 0 14px!important;white-space:nowrap!important}.supply-grid article span{color:var(--m-muted)!important;font-size:18px!important;line-height:1.32!important}.supply-grid article em{display:none!important}

/* Terms */
.terms-screen .section-inner{height:100%!important;width:100%!important;display:block!important;position:relative!important;overflow:hidden!important}.terms-screen .section-head{position:absolute!important;left:0!important;right:0!important;top:7svh!important;margin:0!important}.terms-screen h2{font-size:clamp(34px,10vw,50px)!important;line-height:.9!important;max-width:340px!important}.terms-grid{position:absolute!important;left:0!important;right:0!important;top:29svh!important;height:50svh!important;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:1fr 1fr!important;gap:16px!important;margin:0!important;opacity:1!important;transform:translate3d(calc(var(--mobile-terms-page,0) * -100vw),0,0)!important;transition:transform var(--m-dur) var(--m-ease),opacity .28s ease!important}.steps-grid{position:absolute!important;left:0!important;top:29svh!important;height:50svh!important;display:grid!important;grid-auto-flow:column!important;grid-template-rows:repeat(2,minmax(0,1fr))!important;grid-template-columns:none!important;grid-auto-columns:calc(100vw - 36px)!important;gap:16px 36px!important;width:max-content!important;opacity:0!important;pointer-events:none!important;transform:translate3d(calc((var(--mobile-terms-page,0) - 1) * -100vw),0,0)!important;transition:transform var(--m-dur) var(--m-ease),opacity .28s ease!important}body.mobile-terms-1 .terms-grid,body.mobile-terms-2 .terms-grid{opacity:0!important;pointer-events:none!important}body.mobile-terms-1 .steps-grid,body.mobile-terms-2 .steps-grid{opacity:1!important;pointer-events:auto!important}.price-card,.steps-grid article{min-height:0!important;padding:18px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;background:var(--m-panel)!important;border:1px solid var(--m-line)!important;clip-path:polygon(var(--m-cut) 0,100% 0,100% calc(100% - var(--m-cut)),calc(100% - var(--m-cut)) 100%,0 100%,0 var(--m-cut))!important}.price-card--accent{background:rgba(195,144,53,.20)!important;border-color:rgba(195,144,53,.55)!important}.price-card strong{font-size:clamp(28px,8vw,36px)!important;line-height:.94!important;margin:10px 0 8px!important}.price-card span,.steps-grid article b{display:block!important;color:var(--m-gold2)!important;font-size:15px!important;line-height:1.12!important;text-transform:uppercase!important}.price-card p,.price-card b,.steps-grid article span{font-size:13px!important;color:var(--m-muted)!important;line-height:1.35!important}.steps-grid article b{margin-bottom:10px!important}.steps-grid article b::first-letter{color:var(--m-gold2)!important}.official-note{display:none!important}.mobile-terms-progress{display:flex;gap:8px;position:absolute;left:0;right:0;bottom:52px}.mobile-terms-progress span{flex:1;height:3px;background:rgba(255,255,255,.16)}.mobile-terms-progress span.active{background:var(--m-gold2)}

/* Catalog promo */
.catalog-screen .section-inner{height:100%!important;width:100%!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:20px!important}.catalog-promo-layout{display:flex!important}.catalog-promo-copy p:not(.eyebrow){color:var(--m-muted)!important;font-size:17px!important;margin:20px 0!important;line-height:1.45!important}.catalog-promo-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}.catalog-promo-series{display:none!important}.catalog-promo-selected{align-self:center!important;margin:0!important}

/* Lead */
.lead-layout{height:100%!important;min-height:0!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:18px!important}.lead-copy h2{font-size:clamp(40px,12vw,62px)!important}.lead-copy p:not(.eyebrow){color:var(--m-muted)!important;font-size:17px!important;margin:18px 0 0!important;line-height:1.45!important}.lead-badges{display:none!important}.lead-form{max-height:62svh!important;overflow:auto!important;overscroll-behavior:contain!important;padding:16px!important;background:rgba(5,4,3,.82)!important;border:1px solid rgba(195,144,53,.52)!important;clip-path:polygon(13px 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%,0 13px)!important}.field span,.form-section-label{font-size:11px!important}.field input,.field textarea{padding:13px!important;font-size:14px!important}.contact-choice{grid-template-columns:1fr!important;gap:8px!important}.contact-choice label{height:44px!important}.selected-box{padding:13px!important}.selected-items{max-height:150px!important}.selected-item{grid-template-columns:42px 1fr 32px!important;gap:9px!important}.selected-item img{width:42px!important;height:42px!important}

/* Fullscreen mobile catalog modal */
.catalog-modal{position:fixed!important;inset:0!important;z-index:120!important;padding:0!important;background:#000!important;display:flex!important;flex-direction:column!important}.catalog-modal[hidden]{display:none!important}.catalog-modal::before{content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;background:linear-gradient(180deg,rgba(0,0,0,.30),rgba(0,0,0,.72)),url("/images/bg/dark_texture_upscaled_4x.webp") center/cover no-repeat!important}.catalog-modal__panel{width:100%!important;height:100svh!important;max-width:none!important;display:flex!important;flex-direction:column!important;padding:0!important;background:transparent!important;border:0!important;clip-path:none!important;overflow:hidden!important}.catalog-modal__close{position:fixed!important;top:14px!important;right:14px!important;width:46px!important;height:46px!important;z-index:124!important;border:1px solid rgba(255,255,255,.18)!important;background:rgba(0,0,0,.55)!important;color:#fff!important;font-size:32px!important;transform:none!important}.catalog-modal__side{position:relative!important;flex:0 0 auto!important;width:100%!important;height:auto!important;border-right:0!important;border-bottom:1px solid rgba(195,144,53,.38)!important;padding:14px 68px 0 14px!important;overflow:visible!important;display:block!important}.catalog-modal__side h2{font-size:38px!important;line-height:.88!important}.catalog-modal__side>p:not(.eyebrow){font-size:12px!important;margin:8px 0 10px!important}.catalog-modal__side::after{content:"→";position:absolute;right:18px;bottom:14px;color:var(--m-gold2);font-size:20px;opacity:.8}.catalog-tabs{display:flex!important;gap:8px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:8px 34px 10px 0!important;scrollbar-width:none!important}.catalog-tabs::-webkit-scrollbar{display:none!important}.catalog-tabs button{flex:0 0 auto!important;height:38px!important;min-width:142px!important;padding:0 12px!important;font-size:10px!important}.catalog-modal__selected{display:none!important}.catalog-modal__content{flex:1 1 auto!important;min-height:0!important;width:100%!important;padding:14px!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}.catalog-heading h3{font-size:30px!important;line-height:.9!important;margin:0 0 8px!important}.catalog-heading p{font-size:12px!important;margin:0 0 12px!important}.catalog-scroll{flex:1 1 auto!important;min-height:0!important;overflow:auto!important;padding-right:0!important;overscroll-behavior:contain!important}.catalog-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;padding-bottom:170px!important}.color-card{min-height:0!important}.color-card__image{height:118px!important}.color-card__body{padding:10px!important;min-height:82px!important}.color-card__code,.color-card__title{font-size:11px!important}.color-card__add{height:36px!important;font-size:10px!important}.catalog-modal__cart{position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:122!important;height:auto!important;max-height:42svh!important;width:100%!important;border-left:0!important;border-top:1px solid rgba(195,144,53,.55)!important;padding:10px 14px 14px!important;background:rgba(5,4,3,.96)!important;overflow:hidden!important}.catalog-modal__cart .catalog-modal__selected{display:grid!important;height:100%!important;padding:0!important;grid-template-rows:auto minmax(0,1fr) auto!important}.catalog-modal__cart .selected-box__head span{font-size:34px!important;margin-right:18px!important}.selected-items--modal{max-height:120px!important;overflow:auto!important;align-content:start!important;grid-auto-rows:max-content!important}.btn-to-lead{height:44px!important;width:100%!important;margin-top:8px!important}.fly-clone{display:none!important}

@media (max-width:380px){h2{font-size:38px!important}.hero-title{font-size:58px!important}.texture-strip figure{grid-template-rows:108px 48px!important}.texture-strip img{height:108px!important}.metrics-grid,.ratio-grid,.size-cards{grid-template-columns:1fr!important}.catalog-grid{grid-template-columns:1fr!important}.application-grid{grid-template-columns:1fr!important}.benefit-grid{height:calc(100svh - 245px)!important}}


/* ===== MOBILE PATCH 4: final corrections after device check ===== */

/* Strong mobile background fallback */
@media (max-width: 820px){
  .site-bg{
    background:
      radial-gradient(circle at 0% 0%, rgba(195,135,45,.10), transparent 32%),
      radial-gradient(circle at 100% 0%, rgba(195,135,45,.09), transparent 30%),
      linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.58)),
      url("/images/bg/dark_texture_upscaled_4x.webp") center/cover no-repeat !important;
  }

  .site-bg::before{
    opacity:.58!important;
  }

  /* No moving menu on intro: original button is hidden; clone is shown under logo. */
  .menu-button{
    top:18px!important;
    right:16px!important;
    left:auto!important;
    transform:none!important;
    transition:opacity 300ms ease!important;
  }

  body.mobile-page-0 .menu-button:not(.mobile-intro-menu){
    opacity:0!important;
    pointer-events:none!important;
  }

  .mobile-intro-menu{
    position:absolute!important;
    top:calc(50svh + 138px)!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    opacity:1!important;
    pointer-events:auto!important;
    z-index:8!important;
  }

  body:not(.mobile-page-0) .mobile-intro-menu{
    opacity:0!important;
    pointer-events:none!important;
  }

  .hero-logo-stack{
    transform:translateY(-18px)!important;
    gap:10px!important;
  }

  .hero-head{
    width:min(86vw,410px)!important;
    transform:translateY(20px)!important;
  }

  .hero-word{
    width:min(82vw,400px)!important;
    transform:translateY(-10px)!important;
  }

  body.mobile-page-0 .hero-screen::before{
    bottom:26px!important;
    animation:mobileArrowBounce 1.15s ease-in-out infinite!important;
  }

  /* Textures: labels fixed, no sliding overlay */
  .texture-showcase{
    gap:14px!important;
  }

  .texture-title{
    font-size:24px!important;
    line-height:1.12!important;
    text-align:center!important;
  }

  .texture-strip{
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
  }

  .texture-strip figure{
    grid-template-rows:122px 46px!important;
    overflow:hidden!important;
    min-width:0!important;
  }

  .texture-strip img{
    height:122px!important;
    min-height:122px!important;
    max-height:122px!important;
    object-fit:cover!important;
    object-position:center bottom!important;
  }

  .texture-strip figcaption{
    position:static!important;
    width:100%!important;
    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;
    padding:5px 6px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    font-size:10px!important;
    line-height:1.05!important;
    background:rgba(0,0,0,.82)!important;
    overflow:hidden!important;
  }

  /* Benefits: one column, two cards per page, horizontal page shift */
  .benefits-screen .section-inner{
    gap:14px!important;
  }

  .benefits-screen .section-head{
    margin:0!important;
  }

  .benefits-screen h2{
    font-size:clamp(34px,10vw,48px)!important;
    line-height:.9!important;
    max-width:360px!important;
  }

  .benefit-grid{
    display:grid!important;
    grid-auto-flow:column!important;
    grid-template-columns:repeat(2, calc(100vw - 36px))!important;
    grid-template-rows:repeat(2, minmax(0, 1fr))!important;
    gap:16px 18px!important;
    width:max-content!important;
    height:calc(100svh - 250px)!important;
    transform:translate3d(calc(var(--mobile-benefit-page, 0) * -1 * (100vw - 18px)),0,0)!important;
  }

  .benefit-grid article{
    width:calc(100vw - 36px)!important;
    height:auto!important;
    padding:18px!important;
    overflow:hidden!important;
  }

  .benefit-grid article h3{
    font-size:clamp(26px,7.6vw,34px)!important;
    line-height:.93!important;
    max-width:100%!important;
    white-space:normal!important;
  }

  .benefit-grid article p{
    font-size:13px!important;
    line-height:1.35!important;
  }

  .source-note{
    font-size:10px!important;
    line-height:1.25!important;
  }

  /* Characteristics: keep heading in screen and make content meaningful */
  .characteristics-screen{
    padding-top:84px!important;
  }

  .char-stage{
    justify-content:center!important;
  }

  .char-top{
    margin:0 0 14px!important;
  }

  .char-top h2{
    font-size:clamp(32px,9.8vw,48px)!important;
    line-height:.9!important;
    max-width:360px!important;
    margin-left:0!important;
  }

  .char-viewport{
    height:calc(100svh - 245px)!important;
    min-height:360px!important;
  }

  .panel-title h3{
    font-size:clamp(24px,7.3vw,34px)!important;
    line-height:.96!important;
  }

  .comparison-table{
    display:grid!important;
    grid-template-columns:32% 34% 34%!important;
    gap:0!important;
    border:1px solid rgba(255,255,255,.10)!important;
  }

  .comparison-table .th{
    display:block!important;
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
    text-transform:uppercase!important;
    font-weight:800!important;
    font-size:10px!important;
  }

  .comparison-table .th.accent{
    color:var(--mobile-gold-2)!important;
  }

  .comparison-table > div{
    display:block!important;
    padding:9px 7px!important;
    min-height:42px!important;
    border:0!important;
    border-right:1px solid rgba(255,255,255,.10)!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;
    background:rgba(255,255,255,.025)!important;
    font-size:10.5px!important;
    line-height:1.25!important;
    overflow-wrap:anywhere!important;
    color:var(--mobile-text)!important;
    text-transform:none!important;
  }

  .comparison-table > div:nth-child(3n+1):not(.th){
    color:var(--mobile-gold-2)!important;
    font-weight:800!important;
    background:rgba(195,144,53,.10)!important;
  }

  .size-main strong{
    font-size:16px!important;
  }

  .size-main p,
  .size-cards article span,
  .metrics-grid article span,
  .ratio-grid article span{
    font-size:12px!important;
  }

  .metrics-grid article strong,
  .ratio-grid article strong{
    font-size:24px!important;
  }

  /* Applications: less shouting, cleaner card text */
  .applications-screen .section-inner{
    gap:18px!important;
  }

  .applications-screen h2{
    font-size:clamp(34px,10vw,48px)!important;
    line-height:.9!important;
  }

  .application-grid{
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
  }

  .application-grid article{
    min-height:104px!important;
    padding:14px 10px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    gap:8px!important;
  }

  .application-grid article b{
    font-size:14px!important;
    line-height:1.05!important;
    margin:0!important;
  }

  .application-grid article span{
    font-size:12px!important;
    line-height:1.25!important;
  }

  /* Supply */
  .supply-screen h2{
    font-size:clamp(34px,10vw,48px)!important;
    line-height:.92!important;
  }

  .supply-grid article{
    min-height:168px!important;
    padding:24px 22px!important;
  }

  .supply-grid article b{
    font-size:17px!important;
  }

  .supply-grid article strong{
    font-family:Montserrat,Arial,sans-serif!important;
    font-size:20px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
    margin:18px 0 12px!important;
  }

  .supply-grid article span{
    font-size:19px!important;
    line-height:1.2!important;
    color:#fff!important;
    font-weight:800!important;
  }

  /* Terms: all three pages slide horizontally, never fade */
  .terms-screen h2{
    font-size:clamp(34px,10vw,48px)!important;
    line-height:.92!important;
  }

  .terms-layout{
    position:relative!important;
    overflow:hidden!important;
  }

  .terms-grid{
    grid-template-columns:1fr!important;
    gap:16px!important;
    position:absolute!important;
    top:calc(50% + 18px)!important;
    left:0!important;
    width:100%!important;
    opacity:1!important;
    pointer-events:auto!important;
    transform:translateY(-50%) translateX(calc(var(--mobile-terms-page, 0) * -1 * 100vw))!important;
  }

  .steps-grid{
    grid-template-columns:repeat(4, calc((100vw - 54px) / 2))!important;
    gap:18px!important;
    width:max-content!important;
    position:absolute!important;
    top:calc(50% + 18px)!important;
    left:0!important;
    opacity:1!important;
    pointer-events:auto!important;
    transform:translateY(-50%) translateX(calc((1 - var(--mobile-terms-page, 0)) * 100vw))!important;
  }

  body.mobile-terms-1 .terms-grid,
  body.mobile-terms-2 .terms-grid{
    opacity:1!important;
    pointer-events:auto!important;
  }

  body.mobile-terms-1 .steps-grid,
  body.mobile-terms-2 .steps-grid{
    opacity:1!important;
    pointer-events:auto!important;
  }

  .price-card,
  .steps-grid article{
    min-height:170px!important;
    padding:22px 18px!important;
  }

  .steps-grid article{
    width:calc((100vw - 54px) / 2)!important;
  }

  .price-card strong{
    font-size:clamp(28px,8vw,36px)!important;
  }

  .steps-grid article b{
    display:block!important;
    font-size:14px!important;
    line-height:1.12!important;
    margin-bottom:10px!important;
  }

  .steps-grid article span{
    font-size:12px!important;
    line-height:1.32!important;
  }

  /* Catalog promo: only copy/buttons/counter on mobile */
  .catalog-screen h2{
    font-size:clamp(34px,10vw,48px)!important;
    line-height:.92!important;
  }

  .catalog-promo-layout{
    justify-content:center!important;
  }

  .catalog-promo-series{
    display:none!important;
  }

  .catalog-promo-copy p:not(.eyebrow){
    font-size:16px!important;
    line-height:1.42!important;
    margin:18px 0!important;
  }

  /* Mobile modal catalog */
  .catalog-tabs{
    position:relative!important;
    display:flex!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x!important;
    scroll-snap-type:x proximity!important;
    padding:10px 30px 10px 0!important;
  }

  .catalog-tabs::after{
    content:"→"!important;
    position:sticky!important;
    right:0!important;
    flex:0 0 24px!important;
    height:38px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:var(--mobile-gold-2)!important;
    background:linear-gradient(90deg, transparent, rgba(0,0,0,.85) 38%)!important;
    pointer-events:none!important;
  }

  .catalog-tabs button{
    min-width:128px!important;
    height:36px!important;
    font-size:9px!important;
    line-height:1.05!important;
    scroll-snap-align:start!important;
  }

  .catalog-heading h3{
    font-size:clamp(24px,7vw,32px)!important;
    line-height:.96!important;
    max-width:300px!important;
  }

  .catalog-heading p{
    font-size:11px!important;
    line-height:1.28!important;
  }

  .catalog-cart,
  .catalog-modal__cart{
    padding:10px 18px 14px!important;
  }

  .catalog-modal__cart .selected-box__head span,
  #modalSelectedCount{
    margin-right:14px!important;
  }

  .color-card__image{
    height:116px!important;
  }
}


/* TASK 2 FIX V2: mobile hero arrow like desktop, but bound to the first mobile sub-screen.
   Hero on mobile is 200svh: first sub-screen is .hero-logo-stack, second is .hero-copy.
   Therefore the arrow must live inside .hero-logo-stack, not on .hero-screen bottom. */
@media (max-width: 820px){
  body.mobile-page-0 .hero-screen::before{
    content:none!important;
    display:none!important;
    animation:none!important;
  }

  .hero-logo-stack{
    position:relative!important;
  }

  .mobile-scroll-arrow{
    position:absolute!important;
    left:50%!important;
    bottom:28px!important;
    width:28px!important;
    height:28px!important;
    z-index:20!important;
    pointer-events:none!important;
    opacity:0!important;
    transform:translateX(-50%)!important;
    transition:opacity .24s ease!important;
  }

  body.mobile-page-0 .mobile-scroll-arrow{
    opacity:.95!important;
  }

  .mobile-scroll-arrow::before{
    content:""!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    border-right:2px solid var(--m-gold2, #e0b95f)!important;
    border-bottom:2px solid var(--m-gold2, #e0b95f)!important;
    transform:translateY(0) rotate(45deg)!important;
    animation:mobileScrollArrowBounce 1.18s ease-in-out infinite!important;
    will-change:transform, opacity!important;
  }

  @keyframes mobileScrollArrowBounce{
    0%,100%{
      transform:translateY(0) rotate(45deg);
      opacity:.5;
    }

    45%{
      transform:translateY(10px) rotate(45deg);
      opacity:1;
    }
  }
}


/* TASK 2 FIX V3: make the mobile hero arrow jump, not just blink.
   The arrow shape stays rotated inside ::before; the outer wrapper moves vertically.
   This avoids transform conflicts between rotate(45deg) and translateY() on mobile browsers. */
@media (max-width: 820px){
  body.mobile-page-0 .mobile-scroll-arrow{
    opacity:.95!important;
    animation:mobileScrollArrowWrapperBounce 1.18s ease-in-out infinite!important;
    will-change:transform, opacity!important;
  }

  .mobile-scroll-arrow::before{
    animation:none!important;
    opacity:1!important;
    transform:rotate(45deg)!important;
  }

  @keyframes mobileScrollArrowWrapperBounce{
    0%,100%{
      transform:translate3d(-50%,0,0)!important;
      opacity:.55;
    }

    45%{
      transform:translate3d(-50%,12px,0)!important;
      opacity:1;
    }
  }
}


/* TASK 2 FIX V4: mobile arrow jump + blink without transform/opacity conflicts.
   Reason: earlier rules use transform/opacity with !important, so keyframes cannot override them.
   This version keeps the wrapper fixed and animates only margin-top + filter on the arrow shape. */
@media (max-width: 820px){
  body.mobile-page-0 .mobile-scroll-arrow{
    opacity:.95!important;
    transform:translateX(-50%)!important;
    animation:none!important;
  }

  body:not(.mobile-page-0) .mobile-scroll-arrow{
    opacity:0!important;
    animation:none!important;
  }

  .mobile-scroll-arrow::before{
    transform:rotate(45deg)!important;
    opacity:1!important;
    animation:mobileScrollArrowShapeBounceV4 1.15s ease-in-out infinite!important;
    will-change:margin-top, filter!important;
  }

  @keyframes mobileScrollArrowShapeBounceV4{
    0%,100%{
      margin-top:0;
      filter:opacity(.48);
    }

    45%{
      margin-top:12px;
      filter:opacity(1);
    }
  }
}


/* TASK 3 FIX: mobile background visibility.
   The background layer was placed at z-index:-10, so on mobile it could sit behind the
   black body background. Keep it behind content, but above the page background. */
@media (max-width: 820px){
  .site-bg{
    z-index:0!important;
    pointer-events:none!important;
    background-color:#070605!important;
    background-image:
      radial-gradient(circle at 8% 0%, rgba(195,135,45,.16), transparent 34%),
      radial-gradient(circle at 100% 4%, rgba(195,135,45,.12), transparent 32%),
      linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.54)),
      url("/images/bg/dark_texture_upscaled_4x.webp")!important;
    background-position:center!important;
    background-size:cover!important;
    background-repeat:no-repeat!important;
  }

  .site-bg::before{
    content:""!important;
    position:absolute!important;
    inset:-10%!important;
    background:url("/images/bg/dark_texture_upscaled_4x.webp") center/cover no-repeat!important;
    transform:rotate(90deg) scale(1.24)!important;
    filter:brightness(1.22) contrast(1.08)!important;
    opacity:.54!important;
    mix-blend-mode:screen!important;
    pointer-events:none!important;
  }

  .site-bg::after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background:
      radial-gradient(circle at 0% 0%, rgba(195,135,45,.10), transparent 36%),
      radial-gradient(circle at 100% 0%, rgba(195,135,45,.08), transparent 34%),
      linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.50))!important;
    pointer-events:none!important;
  }

  main{
    position:relative!important;
    z-index:1!important;
  }

  .site-header,
  .menu-panel,
  .mobile-menu-backdrop,
  .catalog-modal{
    position:fixed!important;
  }
}


/* TASK 4 FIX: mobile "Ключевые преимущества".
   Required layout: 2 horizontal pages; each page has 2 vertical cards.
   This overrides the earlier column/grid mix that allowed the second page to peek in and
   made the second page look clipped after horizontal step. */
@media (max-width: 820px){
  .benefits-screen{
    padding-top:76px!important;
    padding-bottom:44px!important;
  }

  .benefits-screen .section-inner{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:14px!important;
    overflow:hidden!important;
    margin:0!important;
    padding:0!important;
  }

  .benefits-screen .section-head{
    flex:0 0 auto!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }

  .benefits-screen .section-head h2,
  .benefits-screen h2{
    font-size:clamp(32px,9.4vw,46px)!important;
    line-height:.92!important;
    letter-spacing:-.03em!important;
    max-width:330px!important;
    margin:0!important;
  }

  .benefits-screen .source-note{
    flex:0 0 auto!important;
    margin:0!important;
    font-size:11px!important;
    line-height:1.28!important;
    max-width:330px!important;
  }

  .benefit-grid{
    --benefit-page-width:calc(100vw - 36px);
    --benefit-page-gap:18px;

    flex:0 0 auto!important;
    width:max-content!important;
    max-width:none!important;
    height:calc(100svh - 250px)!important;
    min-height:390px!important;
    max-height:500px!important;

    display:grid!important;
    grid-auto-flow:column!important;
    grid-template-rows:repeat(2, minmax(0, 1fr))!important;
    grid-template-columns:none!important;
    grid-auto-columns:var(--benefit-page-width)!important;
    gap:16px var(--benefit-page-gap)!important;

    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    align-items:stretch!important;
    justify-items:stretch!important;
    transform:translate3d(
      calc(var(--mobile-benefit-page, 0) * -1 * (var(--benefit-page-width) + var(--benefit-page-gap))),
      0,
      0
    )!important;
    transition:transform var(--m-duration, 1040ms) var(--m-ease, cubic-bezier(.65,0,.35,1))!important;
    will-change:transform!important;
  }

  .benefit-grid article{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    box-sizing:border-box!important;

    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    gap:12px!important;

    padding:18px 18px 16px!important;
    overflow:hidden!important;
  }

  .benefit-grid article h3{
    font-size:clamp(22px,6.8vw,30px)!important;
    line-height:.96!important;
    letter-spacing:-.02em!important;
    max-width:100%!important;
    margin:0!important;
    white-space:normal!important;
    text-wrap:balance!important;
  }

  .benefit-grid article p{
    margin:0!important;
    font-size:clamp(14px,3.85vw,16px)!important;
    line-height:1.36!important;
    color:var(--m-muted, #cfc4b2)!important;
  }
}

@media (max-width: 380px){
  .benefit-grid{
    height:calc(100svh - 238px)!important;
    min-height:360px!important;
    gap:14px 18px!important;
  }

  .benefit-grid article{
    padding:16px!important;
  }

  .benefit-grid article h3{
    font-size:clamp(21px,6.4vw,28px)!important;
  }

  .benefit-grid article p{
    font-size:13.5px!important;
  }
}


/* TASK 4 FIX V2: hard-lock mobile benefits into 2 full-width horizontal pages.
   Page 1: cards 1-2. Page 2: cards 3-4.
   The previous grid still behaved like 2 narrow columns on some mobile browsers. */
@media (max-width: 820px){
  .benefits-screen{
    padding-left:18px!important;
    padding-right:18px!important;
    overflow:hidden!important;
  }

  .benefits-screen .section-inner{
    width:100%!important;
    max-width:none!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }

  .benefit-grid{
    --benefit-page-width:calc(100vw - 36px);
    --benefit-gap:18px;

    width:calc((var(--benefit-page-width) * 2) + var(--benefit-gap))!important;
    max-width:none!important;
    min-width:0!important;

    display:grid!important;
    grid-auto-flow:row!important;
    grid-template-columns:repeat(2, var(--benefit-page-width))!important;
    grid-template-rows:repeat(2, minmax(0, 1fr))!important;
    column-gap:var(--benefit-gap)!important;
    row-gap:16px!important;

    height:calc(100svh - 252px)!important;
    min-height:390px!important;
    max-height:500px!important;

    margin:0!important;
    padding:0!important;
    overflow:visible!important;

    transform:translate3d(
      calc(var(--mobile-benefit-page, 0) * -1 * (var(--benefit-page-width) + var(--benefit-gap))),
      0,
      0
    )!important;
    transition:transform var(--m-duration, 1040ms) var(--m-ease, cubic-bezier(.65,0,.35,1))!important;
    will-change:transform!important;
  }

  .benefit-grid article:nth-child(1){
    grid-column:1!important;
    grid-row:1!important;
  }

  .benefit-grid article:nth-child(2){
    grid-column:1!important;
    grid-row:2!important;
  }

  .benefit-grid article:nth-child(3){
    grid-column:2!important;
    grid-row:1!important;
  }

  .benefit-grid article:nth-child(4){
    grid-column:2!important;
    grid-row:2!important;
  }

  .benefit-grid article{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    padding:18px 18px 16px!important;
  }

  .benefit-grid article h3{
    font-size:clamp(22px,6.6vw,30px)!important;
    line-height:.96!important;
    letter-spacing:-.02em!important;
    margin:0!important;
    max-width:100%!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }

  .benefit-grid article p{
    font-size:clamp(14px,3.85vw,16px)!important;
    line-height:1.36!important;
    margin:0!important;
    max-width:100%!important;
  }
}

@media (max-width: 380px){
  .benefit-grid{
    height:calc(100svh - 240px)!important;
    min-height:360px!important;
  }

  .benefit-grid article h3{
    font-size:clamp(21px,6.2vw,28px)!important;
  }

  .benefit-grid article p{
    font-size:13.5px!important;
  }
}


/* TASK 5 FIX: mobile "Стоимость и условия".
   Required mobile structure:
   page 1: retail + wholesale;
   page 2: conditions 1 + 2;
   page 3: conditions 3 + 4.
   Earlier CSS placed all 4 condition cards on page 2 and left page 3 empty. */
@media (max-width: 820px){
  .terms-screen{
    padding-left:18px!important;
    padding-right:18px!important;
    overflow:hidden!important;
  }

  .terms-screen .section-inner,
  .terms-layout{
    --terms-page-width:calc(100vw - 36px);
    --terms-page-gap:18px;

    width:100%!important;
    max-width:none!important;
    height:100%!important;
    min-height:0!important;
    box-sizing:border-box!important;
    position:relative!important;
    overflow:hidden!important;
  }

  .terms-screen .section-head{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    position:relative!important;
    z-index:2!important;
  }

  .terms-grid,
  .steps-grid{
    position:absolute!important;
    left:0!important;
    right:auto!important;
    top:calc(50% + 24px)!important;

    height:calc(100svh - 315px)!important;
    min-height:360px!important;
    max-height:455px!important;

    margin:0!important;
    padding:0!important;
    opacity:1!important;
    pointer-events:auto!important;

    transition:transform var(--m-duration, 1040ms) var(--m-ease, cubic-bezier(.65,0,.35,1))!important;
    will-change:transform!important;
  }

  .terms-grid{
    width:var(--terms-page-width)!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:repeat(2, minmax(0, 1fr))!important;
    gap:16px!important;
    transform:translate3d(
      calc(var(--mobile-terms-page, 0) * -1 * (var(--terms-page-width) + var(--terms-page-gap))),
      -50%,
      0
    )!important;
  }

  .steps-grid{
    width:calc((var(--terms-page-width) * 2) + var(--terms-page-gap))!important;
    display:grid!important;
    grid-template-columns:repeat(2, var(--terms-page-width))!important;
    grid-template-rows:repeat(2, minmax(0, 1fr))!important;
    column-gap:var(--terms-page-gap)!important;
    row-gap:16px!important;
    transform:translate3d(
      calc((1 - var(--mobile-terms-page, 0)) * (var(--terms-page-width) + var(--terms-page-gap))),
      -50%,
      0
    )!important;
  }

  .steps-grid article:nth-child(1){
    grid-column:1!important;
    grid-row:1!important;
  }

  .steps-grid article:nth-child(2){
    grid-column:1!important;
    grid-row:2!important;
  }

  .steps-grid article:nth-child(3){
    grid-column:2!important;
    grid-row:1!important;
  }

  .steps-grid article:nth-child(4){
    grid-column:2!important;
    grid-row:2!important;
  }

  body.mobile-terms-0 .steps-grid,
  body.mobile-terms-1 .steps-grid,
  body.mobile-terms-2 .steps-grid,
  body.mobile-terms-0 .terms-grid,
  body.mobile-terms-1 .terms-grid,
  body.mobile-terms-2 .terms-grid{
    opacity:1!important;
    pointer-events:auto!important;
  }

  .price-card,
  .steps-grid article{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    box-sizing:border-box!important;

    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;

    padding:20px 18px!important;
    overflow:hidden!important;
  }

  .price-card strong{
    font-size:clamp(26px,7.8vw,36px)!important;
    line-height:.96!important;
    margin:12px 0 10px!important;
  }

  .price-card span,
  .steps-grid article b{
    font-size:14px!important;
    line-height:1.12!important;
  }

  .steps-grid article b{
    margin-bottom:10px!important;
  }

  .price-card p,
  .steps-grid article span{
    font-size:13px!important;
    line-height:1.32!important;
  }

  .mobile-terms-progress{
    left:0!important;
    right:0!important;
    bottom:72px!important;
    z-index:3!important;
  }
}

@media (max-width: 380px){
  .terms-grid,
  .steps-grid{
    height:calc(100svh - 300px)!important;
    min-height:340px!important;
  }

  .price-card,
  .steps-grid article{
    padding:17px 16px!important;
  }

  .price-card p,
  .steps-grid article span{
    font-size:12.5px!important;
  }
}


/* TASK 5 FIX V2: keep the "Стоимость и условия" heading at the top of the mobile screen.
   The cards are absolutely positioned; the heading must also be pinned explicitly,
   otherwise the old flex centering can place it between the cards. */
@media (max-width: 820px){
  .terms-screen .section-inner,
  .terms-layout{
    display:block!important;
    justify-content:initial!important;
    align-items:initial!important;
  }

  .terms-screen .section-head{
    position:absolute!important;
    top:92px!important;
    left:0!important;
    right:0!important;
    z-index:5!important;
    transform:none!important;
  }

  .terms-screen .section-head .eyebrow{
    margin:0 0 8px!important;
  }

  .terms-screen .section-head h2,
  .terms-screen h2{
    margin:0!important;
    max-width:330px!important;
  }

  .terms-grid,
  .steps-grid{
    top:calc(50% + 44px)!important;
  }
}

@media (max-width: 380px){
  .terms-screen .section-head{
    top:86px!important;
  }

  .terms-grid,
  .steps-grid{
    top:calc(50% + 50px)!important;
  }
}


/* TASK 6 FIX: mobile catalog series scroll indicator.
   Keep only one yellow chevron, remove the duplicated/white indicator and horizontal line. */
@media (max-width: 820px){
  .catalog-modal .catalog-tabs{
    position:relative!important;
    padding:10px 34px 10px 0!important;
  }

  .catalog-modal .catalog-tabs::before{
    content:none!important;
    display:none!important;
  }

  .catalog-modal .catalog-tabs::after{
    content:""!important;
    position:sticky!important;
    right:2px!important;
    top:2px!important;
    flex:0 0 28px!important;
    width:28px!important;
    height:36px!important;
    display:block!important;
    align-self:center!important;
    margin-left:0!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    pointer-events:none!important;
    z-index:5!important;
  }

  .catalog-modal .catalog-tabs::after{
    background:
      linear-gradient(135deg, transparent 42%, var(--m-gold2, #e0b95f) 43% 57%, transparent 58%),
      linear-gradient(45deg, transparent 42%, var(--m-gold2, #e0b95f) 43% 57%, transparent 58%)!important;
    background-size:14px 14px, 14px 14px!important;
    background-repeat:no-repeat!important;
    background-position:center 9px, center 19px!important;
    transform:translateY(-4px)!important;
  }
}


/* TASK 6 FIX V2: replace the original yellow series indicator, do not add a second one.
   The old yellow indicator was .catalog-modal__side::after. It must be hidden.
   The only remaining indicator is a clean right chevron in .catalog-tabs::after. */
@media (max-width: 820px){
  .catalog-modal__side::after{
    content:none!important;
    display:none!important;
  }

  .catalog-modal .catalog-tabs{
    position:relative!important;
    padding:10px 30px 10px 0!important;
  }

  .catalog-modal .catalog-tabs::before{
    content:none!important;
    display:none!important;
  }

  .catalog-modal .catalog-tabs::after{
    content:"›"!important;
    position:sticky!important;
    right:0!important;
    top:auto!important;

    flex:0 0 26px!important;
    width:26px!important;
    height:36px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    align-self:center!important;

    margin:0 0 0 -2px!important;
    padding:0!important;

    color:var(--m-gold2, #e0b95f)!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    font-family:Arial, sans-serif!important;
    font-size:34px!important;
    font-weight:400!important;
    line-height:1!important;

    transform:translateY(-3px)!important;
    pointer-events:none!important;
    z-index:6!important;
  }
}


/* TASK 6 FIX V3: chevron at the right edge + smaller mobile catalog series heading.
   The previous chevron was still a flex item inside the horizontal tabs flow, so it moved
   together with tabs. It now overlays the tabs row at the right edge. */
@media (max-width: 820px){
  .catalog-modal__side::after{
    content:none!important;
    display:none!important;
  }

  .catalog-modal .catalog-tabs{
    position:relative!important;
    padding:10px 42px 10px 0!important;
    margin-right:0!important;
  }

  .catalog-modal .catalog-tabs::before{
    content:none!important;
    display:none!important;
  }

  .catalog-modal .catalog-tabs::after{
    content:"›"!important;
    position:absolute!important;
    right:8px!important;
    top:50%!important;
    transform:translateY(-58%)!important;

    width:24px!important;
    height:28px!important;
    flex:none!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    margin:0!important;
    padding:0!important;

    color:var(--m-gold2, #e0b95f)!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    font-family:Arial, sans-serif!important;
    font-size:36px!important;
    font-weight:400!important;
    line-height:1!important;

    pointer-events:none!important;
    z-index:10!important;
  }

  .catalog-modal .catalog-heading h3{
    font-size:clamp(20px, 5.9vw, 27px)!important;
    line-height:1!important;
    letter-spacing:-.02em!important;
    max-width:100%!important;
    margin:0 0 6px!important;
  }

  .catalog-modal .catalog-heading p{
    font-size:11px!important;
    line-height:1.28!important;
    margin:0 0 10px!important;
  }
}


/* TASK 6 FIX V4: chevron is not a tab item anymore.
   Put the only scroll indicator on .catalog-modal__side, outside the horizontal buttons flow.
   Disable every indicator attached to .catalog-tabs. */
@media (max-width: 820px){
  .catalog-modal__side{
    position:relative!important;
  }

  .catalog-modal .catalog-tabs{
    position:relative!important;
    padding:10px 42px 10px 0!important;
    margin-right:0!important;
  }

  .catalog-modal .catalog-tabs::before,
  .catalog-modal .catalog-tabs::after{
    content:none!important;
    display:none!important;
  }

  .catalog-modal__side::after{
    content:"›"!important;
    display:flex!important;
    position:absolute!important;

    right:15px!important;
    bottom:18px!important;
    top:auto!important;
    left:auto!important;

    width:24px!important;
    height:34px!important;
    align-items:center!important;
    justify-content:center!important;

    color:var(--m-gold2, #e0b95f)!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    font-family:Arial, sans-serif!important;
    font-size:38px!important;
    font-weight:400!important;
    line-height:1!important;

    transform:none!important;
    opacity:.95!important;
    pointer-events:none!important;
    z-index:12!important;
  }

  .catalog-modal .catalog-heading h3{
    font-size:clamp(20px, 5.7vw, 26px)!important;
    line-height:1!important;
    letter-spacing:-.02em!important;
    max-width:100%!important;
    margin:0 0 6px!important;
  }
}


/* TASK 7 FIX: mobile catalog bottom safe area.
   When selected items are shown, the fixed bottom cart covers the last product cards.
   Add enough scrollable bottom space so the final row can be lifted above the cart. */
@media (max-width: 820px){
  .catalog-modal .catalog-scroll{
    padding-bottom:0!important;
    scroll-padding-bottom:calc(42svh + 150px)!important;
    overscroll-behavior:contain!important;
  }

  .catalog-modal .catalog-grid{
    padding-bottom:calc(42svh + 150px)!important;
  }

  .catalog-modal__cart{
    max-height:42svh!important;
  }

  .catalog-modal__cart .selected-items--modal{
    max-height:18svh!important;
  }
}

@media (max-width: 380px){
  .catalog-modal .catalog-grid{
    padding-bottom:calc(44svh + 150px)!important;
  }

  .catalog-modal__cart{
    max-height:44svh!important;
  }
}


/* TASK 8 FIX: mobile catalog series row visual polish.
   Keep the existing horizontal scroll and the separate right chevron.
   Make category buttons smaller, aligned and less visually overloaded. */
@media (max-width: 820px){
  .catalog-modal .catalog-tabs{
    gap:7px!important;
    height:44px!important;
    min-height:44px!important;
    padding:8px 46px 8px 0!important;
    align-items:center!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .catalog-modal .catalog-tabs::-webkit-scrollbar{
    display:none!important;
  }

  .catalog-modal .catalog-tabs button{
    flex:0 0 auto!important;
    min-width:112px!important;
    max-width:152px!important;
    height:34px!important;
    min-height:34px!important;

    padding:0 10px!important;
    box-sizing:border-box!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    font-size:8.5px!important;
    line-height:1!important;
    letter-spacing:.015em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;

    border-width:1px!important;
  }

  .catalog-modal .catalog-tabs button.active{
    min-width:126px!important;
  }

  .catalog-modal .catalog-tabs button:focus-visible{
    outline:1px solid var(--m-gold2, #e0b95f)!important;
    outline-offset:2px!important;
  }

  .catalog-modal__side::after{
    right:13px!important;
    bottom:17px!important;
    width:26px!important;
    height:34px!important;
    font-size:38px!important;
  }
}

@media (max-width: 380px){
  .catalog-modal .catalog-tabs button{
    min-width:104px!important;
    max-width:140px!important;
    font-size:8px!important;
    padding:0 8px!important;
  }

  .catalog-modal .catalog-tabs button.active{
    min-width:116px!important;
  }
}


/* TASK 9 FIX: mobile lead form scroll with selected products.
   The mobile full-screen swiper must not hijack the scroll inside the application form. */
@media (max-width: 820px){
  .lead-screen .lead-form{
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
  }

  .lead-screen #selectedItems,
  .lead-screen .selected-items{
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
    max-height:150px!important;
  }
}


/* TASK 20 MOBILE: no yellow chevron, compact tabs, looped catalog ribbon. */
@media (max-width: 820px){
  .catalog-modal__side{
    padding:12px 14px 10px!important;
    border-bottom:1px solid rgba(195,144,53,.30)!important;
  }

  .catalog-modal__side::after{
    content:none!important;
    display:none!important;
  }

  .catalog-modal__side h2,
  .catalog-modal__side>.eyebrow,
  .catalog-modal__side>p:not(.eyebrow){
    display:none!important;
  }

  .catalog-modal .catalog-tabs{
    margin-top:0!important;
    height:42px!important;
    min-height:42px!important;
    padding:4px 0 8px!important;
    gap:7px!important;
    scroll-behavior:auto!important;
  }

  .catalog-modal .catalog-tabs button{
    min-width:116px!important;
    max-width:152px!important;
    height:32px!important;
    min-height:32px!important;
    font-size:8.2px!important;
  }

  .catalog-modal__content{
    padding:10px 14px 14px!important;
  }

  .catalog-heading{
    display:none!important;
  }

  .catalog-scroll{
    padding:0!important;
    scroll-behavior:smooth!important;
  }

  #catalogGrid.catalog-loop{
    display:block!important;
    grid-template-columns:none!important;
    gap:0!important;
    padding:0 0 calc(42svh + 150px)!important;
  }

  .catalog-series-section{
    padding:0 0 26px!important;
  }

  .catalog-series-section + .catalog-series-section{
    padding-top:18px!important;
    border-top:1px solid rgba(255,255,255,.10)!important;
  }

  .catalog-series-title{
    margin:0 0 12px!important;
    color:#fff!important;
    font-size:clamp(20px,5.7vw,26px)!important;
    line-height:1!important;
    letter-spacing:-.02em!important;
  }

  .catalog-series-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }
}

@media (max-width: 380px){
  #catalogGrid.catalog-loop{
    padding-bottom:calc(44svh + 150px)!important;
  }

  .catalog-modal .catalog-tabs button{
    min-width:108px!important;
    max-width:140px!important;
    font-size:8px!important;
  }
}


/* TASK 21 MOBILE: close catalog by swipe down, no X button. */
@media (max-width: 820px){
  .catalog-modal .catalog-modal__close{
    display:none!important;
  }

  .catalog-modal__panel::before{
    content:""!important;
    position:absolute!important;
    top:7px!important;
    left:50%!important;
    width:46px!important;
    height:4px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.34)!important;
    transform:translateX(-50%)!important;
    z-index:20!important;
    pointer-events:none!important;
  }

  .catalog-modal__panel{
    touch-action:pan-y!important;
  }
}


/* TASK 22 MOBILE: repeated tab cycles are visible on mobile so the active series can be centered. */
@media (max-width: 820px){
  .catalog-modal .catalog-tabs{
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .catalog-modal .catalog-tabs::-webkit-scrollbar{
    display:none!important;
  }

  .catalog-modal .catalog-tabs button{
    display:flex!important;
    flex:0 0 auto!important;
  }
}


/* TASK 25/26 MOBILE: when the user opens the form area, collapse the lead intro and let the form fill the screen.
   The long application flow then scrolls inside .lead-form instead of being pushed below the viewport. */
@media (max-width: 820px){
  body.mobile-mode-lead.mobile-lead-expanded .lead-screen{
    padding-top:74px!important;
    padding-bottom:14px!important;
    justify-content:flex-start!important;
  }

  body.mobile-mode-lead.mobile-lead-expanded .lead-layout{
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    gap:0!important;
  }

  body.mobile-mode-lead.mobile-lead-expanded .lead-copy{
    height:0!important;
    max-height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    opacity:0!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }

  body.mobile-mode-lead.mobile-lead-expanded .lead-copy>*{
    display:none!important;
  }

  body.mobile-mode-lead.mobile-lead-expanded .lead-form{
    flex:1 1 auto!important;
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    margin:0!important;
    width:100%!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
  }
}

@media (max-width: 380px){
  body.mobile-mode-lead.mobile-lead-expanded .lead-screen{
    padding-top:68px!important;
    padding-bottom:10px!important;
  }

  body.mobile-mode-lead.mobile-lead-expanded .lead-form{
    padding:14px!important;
  }
}


/* TASK 27 MOBILE: add a bottom scroll buffer inside the expanded lead form.
   This lets the comment field be pulled higher than the screen center without moving the whole mobile page. */
@media (max-width: 820px){
  body.mobile-mode-lead.mobile-lead-expanded .lead-form{
    padding-bottom:calc(30svh + 16px)!important;
    scroll-padding-bottom:30svh!important;
  }

  body.mobile-mode-lead.mobile-lead-expanded .message-step{
    scroll-margin-bottom:30svh!important;
  }
}

@media (max-width: 380px){
  body.mobile-mode-lead.mobile-lead-expanded .lead-form{
    padding-bottom:calc(34svh + 14px)!important;
    scroll-padding-bottom:34svh!important;
  }

  body.mobile-mode-lead.mobile-lead-expanded .message-step{
    scroll-margin-bottom:34svh!important;
  }
}