:root {
  --orange: #f96332;
  --yellow: #ffd000;
  --cyan: #00e5ff;
  --paper: #d9d9d9;
  --ink: #000;
}

* { box-sizing: border-box; }
html { background: #111; scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: #111; color: #fff; font-family: "Nunito Sans", Arial, sans-serif; overflow-x: hidden; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
img { display: block; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.viewport { position: relative; width: 430px; height: 9285px; margin: 0 auto; background: #000; }
.canvas { position: relative; width: 430px; height: 9285px; overflow: hidden; background: #000; transform-origin: top center; }

.section-title { margin: 0; font-size: 34px; line-height: 1.022; font-weight: 900; text-align: center; background: linear-gradient(90deg, #ff622e 4%, #ffd000 96%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cta { display: flex; align-items: center; justify-content: center; border: 0; text-decoration: none; text-align: center; font-size: 23px; line-height: 1.013; font-weight: 900; color: #222; cursor: pointer; }
.cta--cyan { width: 317px; height: 70px; border-radius: 61px; background: var(--cyan); }
.cta--orange { background: var(--orange); color: #fff; border-radius: 11px; }
.pager { display: flex; align-items: center; justify-content: center; gap: 8px; height: 20px; }
.pager > * { display: block; width: 14px; height: 14px; border-radius: 50%; background: rgba(255,255,255,.55); }
.pager > b { width: 20px; height: 20px; background: #fff; }
.round-arrow { border: 5px solid var(--orange); width: 35px; height: 35px; border-radius: 50%; background: #fff; color: var(--orange); font-size: 29px; line-height: 20px; font-weight: 900; padding: 0 0 4px; cursor: pointer; }

.hero { position: absolute; inset: 0 0 auto; height: 928px; overflow: hidden; background: #000; }
.hero__photo { position: absolute; left: -53px; top: 25px; width: 515px; height: 772px; overflow: hidden; }
.hero__photo img { position: absolute; left: 50%; top: -18.53%; width: 100%; height: 118.53%; max-width: none; object-position: center; transform: translateX(-50%); }
.hero__photo img.hero__photo-img--fire { top: 58px; transform: translateX(-50%) scale(.9); transform-origin: top center; }
.hero__photo img[data-hero-model="Elyps Wall"][data-fire-state="off"] { transform: translateX(-50%) scale(1.15); }
.hero__photo img[data-hero-model="Attitude Wall"] { top: -5%; transform: translateX(-50%) scale(.86); transform-origin: top center; }
.hero__photo img[data-hero-model="Attitude Wall"][data-fire-state="off"] { left: 53%; }
.hero__photo img[data-hero-model="Attitude Wall"][data-fire-state="on"] { left: 50%; top: -3%; transform: translateX(-50%) scale(.85); }
.hero__photo img[data-hero-model="Panoramic Wall"][data-fire-state="off"] { transform: translateX(-50%) scale(.86); }
.hero__photo img[data-hero-model="Panoramic Wall"][data-fire-state="on"] { left: 50%; transform: translateX(-50%) scale(.87); }
.hero__photo img[data-hero-model="Linz Wall"] { top: -8%; transform: translateX(-50%) scale(.86); transform-origin: top center; }
.hero__photo img[data-hero-model="Linz Wall"][data-fire-state="on"] { top: -9%; }
.hero__shade { position: absolute; left: -151px; width: 725px; height: 259px; overflow: visible; pointer-events: none; }
.hero__shade img { position: absolute; left: -17.13%; top: -47.95%; width: 134.26206897%; height: 195.90733591%; max-width: none; }
.hero__shade--top { top: -8px; background: linear-gradient(180deg, #000 0 120px, transparent 259px); }
.hero__shade--bottom { top: 608px; }
.header { position: absolute; left: 0; top: 25px; width: 100%; height: 87px; background: #000; z-index: 2; }
.header__logo { position: absolute; left: 14px; top: 10px; width: 163px; height: 41px; object-fit: contain; }
.rating { position: absolute; left: 23px; top: 56px; width: 145px; height: 21px; }
.rating b { position: absolute; left: 0; top: 0; width: 35px; height: 21px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 23px; font-weight: 600; line-height: normal; }
.rating__star { position: absolute; top: 0; max-width: none; }
.rating__star--1 { left: 43.49px; width: 19.0211px; height: 18.0902px; }
.rating__star--2 { left: 67.49px; width: 19.0211px; height: 18.0902px; }
.rating__star--3 { left: 89.54px; width: 20.9232px; height: 18.0902px; }
.rating__star--4 { left: 113.49px; width: 19.0211px; height: 18.0902px; }
.rating__star--partial { left: 135.481px; width: 9.51855px; height: 18.1055px; }
.stock { position: absolute; left: 227px; top: 31px; width: 125px; height: 32px; display: flex; align-items: center; color: #fff; font-size: 16px; font-weight: 900; line-height: 18px; text-align: left; }
.stock__count { position: absolute; left: 360px; top: 31px; width: 52px; height: 32px; display: flex; align-items: center; justify-content: center; padding: 0; background: linear-gradient(90deg, #ff622e, #ffd000); border-radius: 0; text-align: center; font-size: 20px; font-weight: 900; line-height: .7428; }
.hero h1 { position: absolute; z-index: 2; left: 44px; top: 122px; width: 335px; margin: 0; text-align: center; }
.hero h1 strong { display: block; height: 65px; font-size: 64px; line-height: 65px; font-weight: 900; color: #fff; text-shadow: 0 4px 4px rgba(0,0,0,.87); }
.hero h1 span { display: block; height: 41px; font-size: 40px; line-height: 41px; font-weight: 900; background: linear-gradient(90deg, #ff622e, #ffd000); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 4px 4px rgba(0,0,0,.72)); }
.hero__mini { position: absolute; left: 14px; top: 266px; width: 109px; height: 108px; overflow: hidden; border-radius: 2px; filter: drop-shadow(2px 2px 9.4px rgba(0,0,0,.55)); }
.hero__mini img { position: absolute; left: -22.58%; top: -59.25%; width: 145.16%; height: 219.16%; max-width: none; }
.fire-switch { position: absolute; left: 335px; top: 320px; width: 77px; height: 91px; border: 0; border-radius: 8px; background: rgba(255,255,255,.51); box-shadow: -3px -3px 14px rgba(0,0,0,.57), 3px 3px 4px rgba(0,0,0,.77); cursor: pointer; }
.fire-switch img { position: absolute; width: 22px; height: 21px; object-fit: contain; left: 28px; top: 6px; }
.fire-switch span { position: absolute; left: 7px; top: 33px; width: 64px; height: 15px; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; line-height: 15px; text-shadow: 0 2px 4.3px rgba(0,0,0,.25); }
.fire-switch i { position: absolute; left: 13px; top: 56px; width: 52px; height: 24px; border-radius: 54px; background: #4b4b4b; }
.fire-switch i img { position: absolute; left: 4px; top: 3px; width: 18px; height: 18px; transition: transform .2s, filter .2s; }
.fire-switch[aria-pressed="true"] { border: 1px solid rgba(255,255,255,.3); background: linear-gradient(135deg, rgba(82,59,44,.88), rgba(38,23,14,.94)); }
.fire-switch[aria-pressed="true"] i { background: #ff4d0a; }
.fire-switch[aria-pressed="true"] i img { transform: translateX(26px); }
.product-strip { position: absolute; left: 20px; top: 501px; width: 384px; height: 159px; display: grid; grid-template-columns: repeat(4, 90px); gap: 8px; align-items: start; }
.mini-card { position: relative; width: 90px; height: 142px; margin-top: 10px; padding: 0; border: 0; background: var(--paper); color: #000; cursor: pointer; }
.mini-card.is-active { height: 159px; margin-top: 0; border-radius: 8px; box-shadow: 1px 1px 27.9px var(--orange); }
.mini-card__media { position: absolute; overflow: hidden; pointer-events: none; }
.mini-card__media img { position: absolute; max-width: none; }
.mini-card:nth-child(1) .mini-card__media { left: 16.5px; top: 16px; width: 57px; height: 77px; }
.mini-card:nth-child(1) .mini-card__media img { left: -13.12%; top: -7.69%; width: 128.83%; height: 119.23%; }
.mini-card:nth-child(2) .mini-card__media { left: 12px; top: 14px; width: 66px; height: 59px; }
.mini-card:nth-child(2) .mini-card__media img { left: -4.17%; top: -36.33%; width: 108.33%; height: 152.34%; }
.mini-card:nth-child(3) .mini-card__media { left: 8px; top: 14px; width: 73px; height: 56px; }
.mini-card:nth-child(3) .mini-card__media img { left: -5.13%; top: -43.75%; width: 110.26%; height: 179.17%; }
.mini-card:nth-child(4) .mini-card__media { left: 24px; top: 6px; width: 42px; height: 68px; }
.mini-card:nth-child(4) .mini-card__media img { left: -28.3%; top: -11.76%; width: 158.49%; height: 123.53%; }
.mini-card b, .mini-card s, .mini-card strong { position: absolute; left: 0; width: 100%; display: flex; align-items: center; justify-content: center; text-align: center; }
.mini-card b { top: 82px; height: 11px; font-size: 11px; line-height: .7428; }
.mini-card s { top: 102px; height: 10px; color: #434343; font-size: 10px; line-height: .7428; font-weight: 500; }
.mini-card strong { top: 112px; height: 20px; color: var(--orange); font-size: 20px; line-height: .7428; font-weight: 800; }
.mini-card.is-active b { top: 102px; }
.mini-card.is-active s { top: 122px; }
.mini-card.is-active strong { top: 132px; }
.mini-card .sale { position: absolute; left: 71px; top: -6px; z-index: 2; width: 22px; height: 22px; }
.mini-card .sale img { width: 100%; height: 100%; }
.use-cases { position: absolute; left: 0; top: 678px; width: 430px; height: 63px; background: linear-gradient(90deg, transparent 81px, rgba(255,255,255,.8) 82px, transparent 83px, transparent 155px, rgba(255,255,255,.8) 156px, transparent 157px, transparent 226px, rgba(255,255,255,.8) 227px, transparent 228px, transparent 287px, rgba(255,255,255,.8) 288px, transparent 289px, transparent 346px, rgba(255,255,255,.8) 347px, transparent 348px) 0 0 / 430px 40px no-repeat; }
.use-cases button { position: absolute; top: 0; width: 72px; height: 56px; padding: 0; border: 0; background: transparent; font-size: 11px; line-height: 11px; font-weight: 800; cursor: pointer; }
.use-cases button:nth-child(1) { left: 10px; }
.use-cases button:nth-child(2) { left: 83px; }
.use-cases button:nth-child(3) { left: 156px; }
.use-cases button:nth-child(4) { left: 223px; }
.use-cases button:nth-child(5) { left: 284px; }
.use-cases button:nth-child(6) { left: 341px; }
.use-cases img { position: absolute; object-fit: fill; }
.use-cases button:nth-child(1) img { left: 15px; top: 6px; width: 37px; height: 31px; }
.use-cases button:nth-child(2) img { left: 20px; top: 4px; width: 31px; height: 33px; }
.use-cases button:nth-child(3) img { left: 20px; top: 6px; width: 31.011px; height: 31px; }
.use-cases button:nth-child(4) img { left: 27px; top: 5px; width: 15px; height: 29px; }
.use-cases button:nth-child(5) img { left: 17px; top: 6px; width: 38px; height: 28px; }
.use-cases button:nth-child(6) img { left: 22px; top: 3px; width: 29px; height: 34px; }
.use-cases span { position: absolute; left: 0; top: 45px; width: 72px; height: 11px; text-align: center; }
.use-cases button.is-active img { filter: drop-shadow(0 0 7px var(--orange)); }
.offer { position: absolute; left: 0; top: 752px; width: 430px; height: 140px; }
.timer { display: flex; justify-content: center; align-items: center; gap: 7px; width: 178px; height: 33px; background: #e60000; font-size: 28px; line-height: 1; font-weight: 900; }
.timer i { font-style: normal; }
.offer > .timer { position: absolute; left: 123px; top: 0; }
.offer p { position: absolute; left: 42px; top: 43px; width: 340px; height: 15px; margin: 0; font-size: 15px; line-height: 15px; font-weight: 600; text-align: center; white-space: nowrap; }
.offer .cta { position: absolute; left: 53px; top: 70px; }

.video-section { position: absolute; top: 1012px; left: 0; width: 430px; height: 414px; }
.video-section .section-title { width: 350px; margin: 0 auto; }
.video-name { position: absolute; left: 133px; top: 94px; width: 163px; height: 30px; padding-top: 4px; border-radius: 14px; background: rgba(250,87,34,.33); text-align: center; font-size: 20px; font-weight: 700; }
.video-card { position: absolute; left: 24px; top: 148px; width: 381px; height: 215px; border: 0; padding: 0; background: none; cursor: pointer; }
.video-card > img, .video-card > iframe { width: 100%; height: 100%; border: 0; border-radius: 2px; object-fit: cover; }
.play { position: absolute; left: calc(50% - 27px); top: calc(50% - 27px); width: 54px; height: 54px; display: grid; place-items: center; padding-left: 4px; border-radius: 50%; background: rgba(255,98,46,.93); color: #fff; font-size: 25px; box-shadow: 0 0 20px rgba(249,99,50,.7); }
.video-section .pager { position: absolute; left: 172px; top: 387px; width: 86px; }
.video-section .pager > button { border: 0; padding: 0; cursor: pointer; }
.video-section .pager > .is-active { width: 20px; height: 20px; background: #fff; }
.video-nav { position: absolute; top: 380px; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; }
.video-nav img { width: 100%; height: 100%; }
.video-nav--prev { left: 123px; top: 380px; }
.video-nav--next { left: 273.542px; top: 380px; }
.video-nav--next img { transform: scaleX(-1); }

.space-section { position: absolute; left: 16px; top: 1536px; width: 398px; height: 653px; }
.space-section::before { content: ""; position: absolute; left: 0; top: 88px; width: 398px; height: 565px; background: linear-gradient(#000 0%, #733502 50%, #e66903 100%); z-index: 0; }
.space-section .section-title { position: relative; z-index: 1; font-size: 36px; }
.space-tabs { position: relative; z-index: 1; margin: 33px auto 0; width: 360px; display: grid; grid-template-columns: repeat(3, 106px); gap: 16px 21px; }
.space-tabs button { height: 30px; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 0 9px; border: 0; border-radius: 13px; background: rgba(232,186,148,.4); font-size: 15px; font-weight: 900; cursor: pointer; }
.space-tabs button.is-active { background: #733502; box-shadow: 0 0 8px var(--orange); }
.space-tabs img { width: 21px; height: 18px; object-fit: contain; }
.space-gallery { position: relative; z-index: 1; margin: 54px auto 0; width: 354px; }
.space-gallery__main { width: 354px; height: 264px; object-fit: cover; }
.space-gallery__label { position: absolute; left: 17px; top: 227px; z-index: 2; color: #fff; font-size: 24px; line-height: 25px; font-weight: 900; text-shadow: 4px 3px 3px rgba(0,0,0,.25); }
.space-gallery__thumbs { display: grid; grid-template-columns: repeat(3, 100px); gap: 24px; margin: 34px 3px 0; }
.space-gallery__thumbs button { position: relative; width: 100px; height: 100px; padding: 0; border: 0; background: none; cursor: pointer; overflow: hidden; }
.space-gallery__thumbs button.is-active { outline: 0; }
.space-gallery__thumbs img { width: 100%; height: 100%; object-fit: cover; }
.space-gallery__thumbs span { position: absolute; left: 0; right: 0; bottom: 3px; z-index: 2; color: #fff; font-size: 12px; line-height: 12px; font-weight: 700; text-align: center; text-shadow: 4px 3px 3px rgba(0,0,0,.25); }
.space-gallery .round-arrow { position: absolute; right: 244px; bottom: -6px; z-index: 3; width: 35px; height: 35px; padding: 0; border: 0; background: none; }
.space-gallery .round-arrow img { width: 35px; height: 35px; }
.space-hand { position: absolute; z-index: 4; left: 90px; top: 562px; width: 109px; height: 118px; display: grid; place-items: center; pointer-events: none; }
.space-hand img { width: 95px; height: 74px; transform: rotate(-116.8deg); }

.compare-section { position: absolute; left: 35px; top: 2309px; width: 359px; height: 649px; }
.compare-section .section-title { width: 350px; margin-left: 5px; }
.compare { position: absolute; left: 0; top: 118px; width: 359px; height: 479px; overflow: hidden; background: #81522c; box-shadow: 1px 1px 37px #9d3f20; touch-action: pan-y; }
.compare__before, .compare__after img { width: 359px; height: 479px; object-fit: cover; }
.compare__after { position: absolute; inset: 0 0 0 var(--split); overflow: hidden; }
.compare__after img { position: absolute; right: 0; top: 0; }
.compare__divider { position: absolute; left: var(--split); top: 0; width: 2px; height: 100%; background: #fff; transform: translateX(-1px); }
.compare__divider button { position: absolute; left: -35px; top: 332px; width: 71px; height: 71px; padding: 0; border: 5px solid var(--orange); border-radius: 50%; background: #fff; cursor: ew-resize; }
.compare__divider img { width: 37px; height: 16px; margin: auto; }
.compare input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; }
.compare__tag { position: absolute; top: 11px; height: 33px; display: flex; align-items: center; gap: 3px; padding: 0 8px; border-radius: 12px; background: #fff; color: #434343; font-size: 14px; font-weight: 900; }
.compare__tag img { width: 17px; height: 17px; object-fit: contain; }
.compare__tag--before { left: 11px; }
.compare__tag--after { right: 10px; }
.compare__hint { position: absolute; left: 9px; top: 615px; width: 341px; margin: 0; display: flex; justify-content: space-between; align-items: center; font-size: 20px; font-weight: 700; text-shadow: 4px 3px 3px rgba(0,0,0,.25); }
.compare__hint span { font-size: 32px; font-weight: 400; }

.why-section { position: absolute; left: 0; top: 3078px; width: 430px; height: 868px; overflow: visible; }
.why-section .section-title { position: absolute; z-index: 3; left: 86px; top: 0; width: 265px; height: 70px; margin: 0; }
.why-glow { position: absolute; z-index: 0; display: block; pointer-events: none; background: center / 100% 100% no-repeat; }
.why-glow--large { left: -179px; top: 26px; width: 276px; height: 276px; background-image: url('./public/assets/glow-large.svg'); }
.why-glow--right { left: 322px; top: 200px; width: 179px; height: 179px; background-image: url('./public/assets/glow-small.svg'); }
.why-glow--left { left: -101px; top: 545px; width: 179px; height: 179px; background-image: url('./public/assets/glow-small.svg'); }
.why-glow--orange { left: 364px; top: 490px; width: 241px; height: 268px; transform: rotate(22deg); background-image: url('./public/assets/glow-orange.svg'); }
.why-row { position: absolute; z-index: 2; left: 0; width: 430px; height: 129px; }
.why-row:nth-of-type(1) { top: 94px; }
.why-row:nth-of-type(2) { top: 223px; }
.why-row:nth-of-type(3) { top: 352px; }
.why-row:nth-of-type(4) { top: 481px; }
.why-row:nth-of-type(5) { top: 610px; }
.why-row:nth-of-type(6) { top: 739px; }
.why-photo { position: absolute; z-index: 2; top: 0; width: 129px; height: 129px; overflow: hidden; }
.why-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.why-row:first-of-type .why-photo img { left: -32.01%; top: -30.51%; width: 142%; height: 142%; max-width: none; }
.why-row.right .why-photo { left: 28px; }
.why-row.left .why-photo { left: 280px; }
.why-row b { position: absolute; z-index: 1; width: 303px; height: 81px; display: flex; align-items: center; margin: 0; font-size: 24px; line-height: 1.022; font-weight: 800; color: #000; }
.why-row b::before { content: ''; position: absolute; z-index: -1; inset: 0; background: center / 100% 100% no-repeat url('./public/assets/why-banner-r.svg'); }
.why-row.right b { left: 70px; top: 24px; padding: 0 12px 0 108px; text-align: left; }
.why-row:first-of-type b { top: 29px; }
.why-row.left b { left: 49px; top: 24px; padding: 0 92px 0 54px; justify-content: flex-end; text-align: right; }
.why-row.left b::before { transform: rotate(180deg); }

.order-section { position: absolute; left: 0; top: 4066px; width: 430px; height: 873px; }
.order-section .section-title { font-size: 34px; }
.selected-product { position: absolute; left: 50px; top: 59px; width: 330px; height: 504px; background: rgba(134,134,134,.74); overflow: hidden; }
.selected-product > img { position: absolute; left: 66px; top: 24px; width: 198px; height: 238px; object-fit: cover; border-radius: 0; }
.selected-product h3 { position: absolute; left: 0; top: 283px; width: 100%; margin: 0; text-align: center; font-size: 26px; line-height: 27px; }
.selected-price { position: absolute; left: 75px; top: 317px; width: 179px; height: 30px; display: flex; align-items: center; gap: 10px; }
.selected-price s { flex: 0 0 71px; width: 71px; white-space: nowrap; font-size: 20px; font-weight: 500; }
.selected-price strong { flex: 0 0 98px; width: 98px; height: 29px; display: flex; align-items: center; justify-content: center; padding: 0; background: #d80000; white-space: nowrap; font-size: 24px; line-height: 25px; }
.selected-product ul { position: absolute; left: 28px; top: 362px; margin: 0; padding: 0; list-style: none; font-size: 20px; line-height: 33px; white-space: nowrap; }
.product-nav { position: absolute; z-index: 3; top: 362px; width: 56px; height: 58px; padding: 0; border: 0; background: none; cursor: pointer; }
.product-nav img { width: 56px; height: 58px; }
.product-nav--prev { left: 22px; }
.product-nav--next { left: 352px; }
.product-nav--next img { transform: rotate(180deg); }
.order-pager { position: absolute; left: 175px; top: 579px; width: 86px; }
.order-pager > button { border: 0; padding: 0; cursor: pointer; }
.order-pager > .is-active { width: 20px; height: 20px; background: #fff; }
.order-note { position: absolute; left: 37px; top: 775px; width: 356px; height: 29px; margin: 0; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 15px; font-weight: 600; line-height: 1.013; }
.timer--small { position: absolute; left: 148px; top: 747px; width: 134px; height: 29px; display: block; background: transparent; font-size: 24px; line-height: 1.013; z-index: 2; }
.timer--small span { position: absolute; top: 0; width: 36px; height: 29px; min-width: 0; padding: 0; display: flex; align-items: center; justify-content: center; background: #ff0000; text-align: center; }
.timer--small span:nth-of-type(1) { left: 0; }
.timer--small span:nth-of-type(2) { left: 50px; }
.timer--small span:nth-of-type(3) { left: 98px; }
.timer--small i { position: absolute; top: 0; height: 29px; display: flex; align-items: center; font-style: normal; }
.timer--small i:nth-of-type(1) { left: 39px; }
.timer--small i:nth-of-type(2) { left: 87px; }
.order-form { position: absolute; left: 50px; top: 615px; width: 330px; }
.order-form label { display: block; margin-bottom: 12px; }
.order-form input { width: 330px; height: 52px; border: 0; border-radius: 0; padding: 0 25px; background: #d9d9d9; color: #434343; font-size: 20px; font-weight: 700; outline: none; }
.order-form input:focus { box-shadow: 0 0 0 3px var(--orange); }
.order-form button { position: absolute; left: 34px; top: 197px; width: 262px; height: 61px; overflow: hidden; border-radius: 92px; color: #000; font-size: 22px; font-weight: 900; line-height: 1.022; filter: drop-shadow(1px 1px 5px rgba(0,0,0,.25)); }
.order-form button { isolation: isolate; }
.order-form button::before { content: ""; position: absolute; left: 15px; width: 33.8px; height: 79.8px; background: center / 100% 100% no-repeat url('./public/assets/product-decor.svg'); pointer-events: none; transform: rotate(25deg); transform-origin: center; z-index: 0; }
.order-form button > span { position: relative; z-index: 1; }
.form-status { position: absolute; top: 260px; width: 100%; text-align: center; color: var(--cyan); font-size: 13px; }

.reviews-section { position: absolute; left: 0; top: 5056px; width: 430px; height: 746px; overflow: visible; }
.reviews-section .section-title { width: 318px; margin: 0 auto; }
.reviews-section::before { content: ""; position: absolute; left: 0; top: 143px; width: 430px; height: 531px; background: center / 430px 531px no-repeat url('./public/assets/reviews-background.svg'); pointer-events: none; }
.review-card { position: absolute; left: 34px; top: 94px; width: 362px; height: 608px; margin: 0; padding: 0; border-radius: 0; background: #fff; color: #111; box-shadow: 3px 3px 8px rgba(0,0,0,.26); }
.review-card header { position: absolute; left: 19px; top: 24px; display: flex; align-items: center; gap: 12px; height: 41px; }
.review-avatar { position: relative; width: 41px; height: 41px; flex: 0 0 41px; overflow: hidden; border-radius: 50%; }
.review-avatar img { width: 41px; height: 41px; display: block; object-fit: cover; }
.review-avatar i { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 24px; line-height: 1.022; font-style: normal; font-weight: 800; }
.review-avatar i:empty { display: none; }
.review-card header div { display: flex; flex-direction: column; gap: 3px; }
.review-card header b { font-size: 18px; }
.review-card header b { font-weight: 800; }
.review-card header div img { width: 100px; height: 20px; object-fit: contain; }
.review-card p { position: absolute; left: 19px; top: 77px; width: 336px; height: 108px; margin: 0; font-size: 18px; line-height: 1.022; font-weight: 500; }
.review-card__photo { position: absolute; left: 55px; top: 221px; width: 252px; height: 299px; margin: 0; overflow: hidden; }
.review-card__photo img { position: absolute; max-width: none; object-fit: initial; }
.review-score { position: absolute; left: 48px; top: 552px; display: flex; justify-content: center; gap: 24px; margin: 0; font-size: 20px; line-height: 20px; }
.review-score span { display: flex; gap: 8px; }
.review-card .round-arrow { position: absolute; right: -21px; top: 262px; width: 52px; height: 52px; padding: 0; border: 0; background: none; }
.review-card .round-arrow img { width: 52px; height: 52px; transform: rotate(180deg); }
.review-card .round-arrow--prev { right: auto; left: -21px; }
.review-card .round-arrow--prev img { transform: none; }
.reviews-pager { position: absolute; left: 161px; top: 726px; width: 108px; }
.reviews-pager > button { border: 0; padding: 0; cursor: pointer; }
.reviews-pager > .is-active { width: 20px; height: 20px; background: #fff; }
.review-card[data-review="roman"] .review-card__photo img { left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
.review-card[data-review="dmytro"] .review-card__photo img { left: .04%; top: -10.76%; width: 101.45%; height: 114%; }
.review-card[data-review="natalia"] .review-card__photo img { left: -17.54%; top: -25.1%; width: 123.69%; height: 139%; }
.review-card[data-review="oleg"] .review-card__photo img { left: -5.55%; top: -22.57%; width: 111.24%; height: 125%; }
.review-card[data-review="andriy"] .review-card__photo img { left: 0; top: -6.15%; width: 100%; height: 112.37%; }

.steps-section { position: absolute; left: 0; top: 5922px; width: 430px; height: 724px; overflow: hidden; }
.steps-glow { position: absolute; pointer-events: none; }
.steps-glow--one { left: 335px; top: 446px; width: 311px; height: 311px; }
.steps-glow--two { left: 328px; top: 118px; width: 311px; height: 157px; transform: rotate(54.1deg); }
.steps-glow--three { left: -181px; top: 247px; width: 311px; height: 224px; transform: rotate(-13.75deg); }
.steps-section .section-title { position: relative; z-index: 1; width: 318px; margin: 0 auto; }
.steps-section ol { position: relative; z-index: 1; margin: 47px 0 0 31px; padding: 0; list-style: none; }
.steps-section li { display: flex; align-items: center; gap: 16px; height: 90px; }
.steps-section li b { width: 66px; height: 66px; display: grid; place-items: center; background: linear-gradient(90deg, #ff622e, #ffd000); border-radius: 0; color: #fff; font-size: 48px; line-height: 1; font-weight: 900; }
.steps-section li span { font-size: 20px; font-weight: 900; }

.payment-section { position: absolute; left: 13px; top: 6774px; width: 398px; height: 741px; }
.payment-section::before { content: ""; position: absolute; top: 98px; left: 0; width: 398px; height: 643px; background: linear-gradient(rgba(0,0,0,.8), rgba(115,53,2,.8) 50%, rgba(230,105,3,.8)); filter: blur(86.75px); }
.payment-section .section-title { position: relative; z-index: 1; width: 318px; margin: 0 auto; }
.payment-box { position: absolute; z-index: 1; left: 30px; top: 134px; width: 337px; height: 555px; overflow: visible; background: transparent; color: #0f0f0f; }
.payment-box::before { content: ""; position: absolute; left: 0; top: 0; width: 337px; height: 340px; background: #fff; }
.payment-box > h3 { position: absolute; z-index: 1; left: 0; top: 16px; width: 337px; margin: 0; text-align: center; font-size: 28px; line-height: 29px; font-weight: 800; }
.payment-logos { position: absolute; z-index: 1; left: 54px; top: 85px; width: 230px; height: 201px; margin: 0; display: block; }
.payment-logos > img { position: absolute; object-fit: cover; }
.payment-logos > img:nth-child(1) { left: 0; top: 0; width: 102px; height: 42px; }
.payment-logos > img:nth-child(2) { left: 118px; top: 0; width: 112px; height: 42px; }
.payment-logos > img:nth-child(4) { left: 0; top: 139px; width: 104px; height: 62px; }
.payment-logos > img:nth-child(5) { left: 120px; top: 152px; width: 110px; height: 36px; }
.payment-logo--mono { position: absolute; left: 0; top: 66px; width: 230px; height: 48px; overflow: hidden; }
.payment-logo--mono img { position: absolute; left: -13.67%; top: -255.17%; width: 127.34%; height: 610.34%; max-width: none; }
.delivery { position: absolute; left: 0; top: 364px; width: 337px; height: 191px; padding: 0; background: #fff; border: 0; }
.delivery h3 { position: absolute; left: 0; top: 16px; width: 337px; margin: 0; text-align: center; font-size: 28px; line-height: 29px; font-weight: 800; }
.delivery-logo { position: absolute; left: 37px; top: 69px; width: 266px; height: 86px; overflow: hidden; }
.delivery-logo img { position: absolute; left: -6.92%; top: -18.6%; width: 112.71%; height: 137.21%; max-width: none; }

.faq-section { position: absolute; left: 0; top: 7603px; width: 430px; height: 915px; }
.faq-section .section-title { width: 318px; margin: 0 auto; }
.faq { position: absolute; left: 21px; top: 110px; width: 387px; display: flex; flex-direction: column; gap: 16px; }
.faq-item { border-radius: 0; overflow: hidden; background: var(--orange); color: #fff; }
.faq-item button { width: 100%; min-height: 83px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 13px 17px 15px; border: 0; background: var(--orange); text-align: left; font-size: 24px; line-height: 1.022; font-weight: 800; cursor: pointer; }
.faq-item button img { flex: 0 0 auto; width: 24px; height: 24px; }
.faq-item:not(.is-open) button img { transform: rotate(90deg); }
.faq-item.is-open button img { transform: rotate(-90deg); }
.faq-item p { display: none; margin: 0 15px 20px; font-size: 24px; line-height: 1.022; font-weight: 500; }
.faq-item.is-open { min-height: 211px; }
.faq-item.is-open { background: linear-gradient(90deg, #ff622e, #ffd000); }
.faq-item.is-open button { min-height: 69px; padding-top: 15px; padding-bottom: 8px; background: transparent; }
.faq-item.is-open p { display: block; margin: 0 15px 20px; }

.footer { position: absolute; left: 0; top: 8621px; width: 430px; height: 664px; background: linear-gradient(#000 0%, #733502 50%, #e66903 100%); text-align: center; }
.footer__brand { position: relative; width: 342px; height: 66px; margin: 57px auto 0; }
.footer__brand span { position: absolute; top: 0; height: 66px; overflow: hidden; }
.footer__brand img { position: absolute; max-width: none; }
.footer__brand-mark { left: 0; width: 71px; }
.footer__brand-mark img { left: -92.6px; top: .3px; width: 257.25px; height: 154.68px; }
.footer__brand-word { left: 92px; width: 250px; }
.footer__brand-word img { left: 0; top: -83.73px; width: 250px; height: 150px; }
.phones { margin-top: 47px; display: flex; flex-direction: column; gap: 7px; }
.phones a { color: #fff; text-decoration: none; font-size: 25px; line-height: 25px; font-weight: 700; }
.socials { width: 328px; height: 43px; margin: 32px auto 0; object-fit: contain; }
.footer nav { margin-top: 50px; display: flex; flex-direction: column; gap: 7px; }
.footer nav a { color: #fff; text-decoration: none; font-size: 25px; line-height: 26px; font-weight: 700; }
.footer p { width: 275px; margin: 67px auto 0; font-size: 25px; line-height: 1.3; font-weight: 700; }

@media (max-width: 429px) {
  .viewport { width: 100vw; height: calc(9285px * (100vw / 430px)); }
  .canvas { transform: scale(calc(100vw / 430px)); transform-origin: top left; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}