:root{--navy:#252a2c;--orange:#516347;--ink:#292e2c;--muted:#727870;--line:#e0e3dd;--pale:#f0f2ec;--surface:#fff;--page:#fafaf8;--soft:#eef1e9;--accent:#d7ef9b}
body{background:var(--page)}header{background:var(--page)}.wrap{width:min(1100px,calc(100% - 64px))}.demo{background:#202624;font-size:10px;padding:6px 15px}.mainhead{gap:24px;padding-block:16px}.brand{font-size:18px}.brandicon{background:#262d29;border-radius:12px;width:40px;height:44px;font-size:38px;line-height:43px}.brandicon span{color:#7b9659}.brand small{font-size:14px}.brand small b{font-size:23px}.search{background:var(--surface);border-radius:30px}.search input{padding:13px 18px;color:var(--ink);font-size:12px}.search button{background:#2b332e;width:48px}.cartbtn{font-size:11px;gap:7px}.cartbtn b{background:var(--soft);color:var(--ink)}.theme-toggle{display:flex;gap:6px;align-items:center;padding:9px 12px;border:1px solid var(--line);border-radius:30px;color:var(--ink);background:var(--surface);font-size:11px}.theme-toggle>span:first-child{font-size:18px}nav{padding-block:11px;font-size:12px;gap:15px}nav button{font-size:12px;color:var(--ink)}
.hero{min-height:340px;grid-template-columns:1.1fr 1fr;background:radial-gradient(ellipse at 80% 50%,#454e45,#202722 67%);border-radius:17px;margin-top:16px;border:1px solid #384137}.herocopy{padding:34px 0 29px 37px;align-self:center}.hero .eyebrow{color:#c2d1b2;font-size:9px}.hero h1{font-size:43px;line-height:1.12;letter-spacing:-1.8px;color:#fff;margin:14px 0 14px}.hero h1 em{color:var(--accent)}.herocopy p{font-size:13px;max-width:350px;line-height:1.6;color:#c6cec5;margin-bottom:18px}.primary{background:#d7ef9b;color:#202820;padding:12px 19px;font-size:12px;gap:24px;border-radius:7px}.primary:hover{background:#c7e48a}.herocaption{margin-top:20px;font-size:8px;color:#b7c0b3}.heroart{min-height:340px;height:340px;transform:none;margin:0;background:radial-gradient(ellipse,#94ac712a,transparent 68%)}.heroart .phone{scale:.78;transform-origin:top left}.phone.back{left:70px;top:55px;background:linear-gradient(130deg,#9fa797,#c7cdbf 45%,#6e786c);border-color:#adb5a7}.phone.front{top:26px;left:206px}.screenorb{background:radial-gradient(circle at 20% 40%,#e1edc4,#82947a 40%,#334a3d 65%);box-shadow:0 0 12px #cddcbc}.screenorb.two{background:radial-gradient(circle at 60% 20%,#e8ecc6,#adbc82 45%,#3e584d 80%)}.phone.front{background:#172d23;border-color:#161c18}.phone.front>span{font-size:26px}.phone.back>b{color:#e1e6d9}.cameras{background:#8d9984}.cameras i{border-color:#5c6758;box-shadow:0 0 1px 2px #bbc4b6}.orbit{width:360px;height:360px;left:30px;top:-13px;border-color:#a0b28a2b}.o2{width:450px;height:450px;left:-15px;top:-57px}.artword{font-size:49px;color:#adc29419;top:17px;left:30px}.floating{bottom:26px;right:31px;background:#edf2e4;color:#2e3829;padding:12px 17px;font-size:11px;transform:rotate(-4deg);border:1px solid #fff5}.floating>span{font-size:27px;color:#536541}.benefits{padding:19px 0}.benefits p{font-size:12px}.benefits small{font-size:10px}.benefits>div>span{font-size:25px}.catalog{padding-top:31px}h2{font-size:26px}.sectionhead>p{font-size:12px}.eyebrow{color:var(--muted);font-size:9px}.filters{margin:6px 0 12px}.chips button{background:var(--surface);color:var(--ink);font-size:11px;padding:8px 17px}.chips button.active{background:#303a2e;color:#fff;border-color:#303a2e}.filters select{background:var(--surface);color:var(--ink)}.catalogmeta{margin:13px 0 12px}.products{gap:15px}.product{background:var(--surface);padding:14px;border-radius:12px}.productimage{background:#fff;border-radius:8px;padding:10px 0 7px;margin-top:9px}.productimage img{height:133px}.tag{background:var(--soft);color:var(--muted);font-size:8px}.product .brandlabel{margin-top:12px}.product h3{font-size:14px}.spec{margin-bottom:11px}.price{font-size:22px}.pricehint{margin-bottom:12px}.add{background:var(--soft);color:var(--ink);font-size:11px;padding:10px}.add:hover{background:#d7ef9b;color:#252d21}.banners{margin-top:30px;gap:18px}.banner{background:var(--soft);min-height:202px;padding:25px;border:1px solid var(--line)}.banner h2{font-size:23px}.miniphone{scale:.8;transform-origin:top right;top:25px;background:radial-gradient(circle at 20% 20%,#95a688,#273a2e 65%,#ccd5aa);border-color:#26342a}.headphones{scale:.8;transform-origin:top right;top:30px}.how{padding-block:43px;gap:40px}.faq{padding-bottom:40px}.faq details{padding:16px 0}.steps{padding-top:16px}.steps article>b{color:var(--muted)}footer{background:#202624;padding-top:33px}.footgrid>.brand .brandicon{background:#c5dba6;color:#242e20}.footgrid p,.footgrid>div a,.footbottom{color:#b9c3b7}.footbottom{margin-top:26px;padding-block:17px}dialog{background:var(--surface)}.detailgrid img,.cartline img{background:#fff;border-radius:9px}.checkoutnote{background:var(--soft)}.qty button{color:var(--ink)}.qty .remove{color:var(--muted)}#toast{background:#293728;color:#fff}
html[data-theme=dark]{color-scheme:dark;--navy:#f0f2eb;--ink:#e4e9df;--muted:#a8b1a3;--line:#343a34;--pale:#242a24;--surface:#202521;--page:#151916;--soft:#2d352b;--orange:#bbd395}.theme-toggle:hover{border-color:#81966f}html[data-theme=dark] .brandicon{background:#c5dba6;color:#243020}html[data-theme=dark] .brandicon span{color:#e3f0d0}html[data-theme=dark] .hero{border-color:#45513d}html[data-theme=dark] .search button{background:#c5dba6;color:#243020}html[data-theme=dark] .chips button.active{background:#c5dba6;color:#243020}html[data-theme=dark] .productimage{box-shadow:inset 0 0 0 1px #fff}html[data-theme=dark] .floating{color:#283225}html[data-theme=dark] .banner{background:linear-gradient(125deg,#293326,#202720)}html[data-theme=dark] .miniphone{color:#fff}html[data-theme=dark] footer{background:#101410}
@media(min-width:701px) and (max-height:760px){.hero{min-height:300px}.heroart{height:300px;min-height:300px}.herocopy{padding-block:24px}.hero h1{font-size:38px}.herocaption{margin-top:14px}.heroart .phone{scale:.7}.phone.back{top:46px}.phone.front{top:20px}.floating{bottom:18px}.benefits{padding:15px 0}}
@media(max-width:1000px) and (min-width:701px){.wrap{width:calc(100% - 40px)}.mainhead{gap:13px}.hero h1{font-size:35px}.herocopy{padding-left:27px}.heroart .phone{scale:.68}.phone.back{left:24px;top:60px}.phone.front{left:145px;top:30px}.floating{right:10px}.heroart{height:320px;min-height:320px}.theme-toggle{padding:8px}.theme-toggle #themeLabel{display:none}.banner h2{font-size:20px}}
@media(max-width:700px){.wrap{width:calc(100% - 28px)}.demo{font-size:8px}.mainhead{padding-block:12px;gap:10px}.brand{font-size:16px}.brandicon{width:35px;height:38px;font-size:33px;line-height:37px}.brand small b{font-size:20px}.theme-toggle{margin-left:auto;padding:7px 9px;font-size:10px}.cartbtn{padding:0}.cartbtn>span{display:none}.search input{padding:11px 15px}.hero{display:flex;margin-top:10px;min-height:0}.herocopy{padding:24px 23px 0;align-self:stretch}.hero h1{font-size:31px;letter-spacing:-1.3px;margin:11px 0 12px}.hero .eyebrow{font-size:8px;letter-spacing:1.2px}.herocopy p{font-size:12px;max-width:310px;line-height:1.55;margin-bottom:16px}.heroart{width:100%;min-height:240px;height:240px;margin:5px 0 0;transform:none}.heroart .phone{scale:.57}.phone.back{left:calc(50% - 101px);top:28px}.phone.front{left:calc(50% + 2px);top:9px}.floating{right:16px;bottom:14px;padding:9px 13px;font-size:9px}.floating>span{font-size:22px;margin-right:9px}.artword{font-size:36px;left:30px;top:15px}.orbit{width:285px;height:285px;top:-5px;left:calc(50% - 142px)}.o2{width:350px;height:350px;top:-37px;left:calc(50% - 175px)}.benefits{padding:16px 0}.benefits p{font-size:9px}.benefits>div>span{font-size:22px}.catalog{padding-top:25px}.sectionhead h2{font-size:23px}.sectionhead>p{font-size:11px;margin-bottom:16px}.chips{gap:5px}.chips button{padding:8px 11px;font-size:10px}.filters{gap:10px}.catalogmeta{font-size:9px}.products{gap:10px}.product{padding:10px}.productimage img{height:112px}.product h3{font-size:12px;min-height:32px}.spec{font-size:9px;line-height:1.4;min-height:25px}.price{font-size:20px}.pricehint{font-size:8px}.add{font-size:9px;padding:10px 3px}.banners{gap:12px;margin-top:25px}.banner{padding:22px;min-height:181px}.banner h2{font-size:21px}.miniphone{scale:.66;right:18px}.headphones{scale:.67;right:20px}.how{padding-block:32px;gap:0}.how h2{font-size:23px}.how>div>p{font-size:12px}.faq h2{font-size:21px}.footgrid{gap:22px}.footgrid p{font-size:11px}.steps{gap:13px}.steps h3{font-size:11px}.steps p{font-size:10px}.detailgrid .price{font-size:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
.hero,.banner{overflow:clip}
