:root {
  --ink:#272336; --muted:#706b80; --purple:#6554e8; --coral:#ffb199; --line:#e9e6ef;
  --page-gutter:clamp(1.25rem,5.6vw,7rem); --section-gutter:max(var(--page-gutter),calc((100% - 1200px)/2));
  font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;
  color:var(--ink); background:#fff; font-synthesis:none; -webkit-font-smoothing:antialiased;
}
*{box-sizing:border-box} html{scroll-behavior:smooth;scroll-padding-top:6rem}
body{margin:0;font-size:1rem;line-height:1.75} main,section,header,footer,div{min-width:0}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
button,summary{font:inherit} img{display:block;max-width:100%} svg{display:block}
svg.icon{width:1.4rem;height:1.4rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
:focus-visible{outline:3px solid #eb896d;outline-offset:6px} ::selection{color:var(--ink);background:#ffcfb9}
h1,h2,h3,p{margin:0} h1,h2,h3{text-wrap:balance}
.skip-link{position:fixed;left:1rem;top:-6rem;z-index:100;padding:.6rem 1rem;color:#fff;background:var(--ink);border-radius:.6rem}
.skip-link:focus{top:6rem}

/* Brand navigation keeps the same optical baseline at every width. */
.topbar{position:fixed;z-index:50;inset:0 0 auto;min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.1rem var(--section-gutter);background:#fff;border-bottom:1px solid #2723360c}
.wordmark{display:flex;align-items:center;gap:.1rem;flex:none}
.wordmark img{width:147px;height:42px}
.wordmark>span{padding-left:.85rem;border-left:1px solid #d9d5e3;font-size:.9rem;font-weight:600;letter-spacing:.12em}
.topbar>nav{display:flex;gap:clamp(1.4rem,3vw,2.8rem);margin-inline:auto}
.topbar>nav a{position:relative;color:#736d81;font-size:.875rem;padding:.55rem .3rem;transition:color .2s}
.topbar>nav a::after{content:"";position:absolute;height:2px;left:.3rem;right:.3rem;bottom:.15rem;background:var(--purple);transform:scaleX(0);transition:transform .2s}
.topbar>nav a:hover,.topbar>nav a[aria-current]{color:var(--purple)}
.topbar>nav a:hover::after,.topbar>nav a[aria-current]::after{transform:scaleX(1)}
.top-status{display:flex;align-items:center;gap:1rem;padding:.65rem 1.05rem;border:1px solid #e7e3f4;border-radius:99px;color:var(--purple);font-size:.875rem;transition:background .2s;white-space:nowrap}
.top-status:hover{background:#f4f1ff}.top-status .icon{width:1rem;height:1rem}.mobile-menu{display:none}

/* Bounded columns adapt independently to window width and height. */
.hero{position:relative;isolation:isolate;overflow:clip;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,4vw,5rem);align-items:center;min-height:clamp(750px,100svh,1000px);padding:130px var(--section-gutter) 72px;color:#fff;background:radial-gradient(ellipse at 98% 92%,#c58dd0 0%,transparent 47%),linear-gradient(125deg,#6655df,#7764ec 55%,#9280ed)}
.hero::after{content:"";position:absolute;z-index:-1;right:-5%;top:23%;width:50%;aspect-ratio:1;border:1px solid #ffffff24;border-radius:50%}
.hero-orb{position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
.orb-one{inset:auto -15% -45% auto;width:55%;aspect-ratio:1;border:1px solid #ffffff1c}
.orb-two{width:70%;height:70%;top:-60%;left:-35%;background:#ffffff0c}
.hero-copy{position:relative;z-index:2;padding-bottom:1rem}
.hero-note{display:flex;align-items:center;flex-wrap:wrap;gap:.65rem;margin-bottom:1.65rem;color:#e4dffe;font-size:.8125rem;letter-spacing:.04em}
.hero-note>span{font-size:.75rem;letter-spacing:.08em;padding:.28rem .65rem;border:1px solid #ffffff4d;border-radius:99px}
h1{font-size:clamp(2.8rem,5.2vw,4.75rem);line-height:1.24;letter-spacing:-.035em;font-weight:750}
h1>span{display:block;white-space:nowrap}.hero-period{color:#ffc9b2}
.hero-lead{margin-top:1.55rem;color:#eee9ff;font-size:1.0625rem;line-height:1.95}
.hero-action{display:inline-flex;align-items:center;justify-content:space-between;gap:1.8rem;min-height:56px;margin-top:2.15rem;padding:.8rem 1.45rem;color:#5844bd;background:#fff;border:1px solid #ffffff80;border-radius:99px;font-size:.9375rem;font-weight:600;box-shadow:0 8px 20px #3e24991c;transition:transform .2s,box-shadow .2s}
.hero-action:hover{transform:translateY(-3px);box-shadow:0 12px 30px #35228535}
.hero-action .icon{width:1.15rem;height:1.15rem}
.release-note{margin-top:1rem;color:#e0d9fc;font-family:Arial,sans-serif;font-size:.75rem;letter-spacing:.06em}
.release-note span{margin-left:.8rem;opacity:.8;letter-spacing:.03em}
.hero-product{position:relative;width:100%;max-width:550px;min-height:600px;justify-self:center;display:grid;align-items:center;justify-items:center;padding:20px 0 28px}
.device{position:relative;z-index:2;color:var(--ink);background:#f8f9fc;border:6px solid #343040;border-radius:42px;box-shadow:inset 0 0 0 1px #77727c,0 26px 70px #39237138,0 6px 12px #39237112}
.device-main{width:min(302px,calc(100% - 24px));padding:15px 15px 13px;transform:rotate(2deg)}
.device-status{position:relative;display:flex;align-items:center;justify-content:space-between;height:24px;padding:0 8px;color:#45404f;font-family:Arial,sans-serif;font-size:.75rem;font-weight:700}
.camera-island{position:absolute;top:-2px;left:50%;transform:translateX(-50%);width:72px;height:19px;background:#282430;border-radius:99px}
.battery{width:18px;height:9px;border:1px solid #605b6b;border-radius:3px;padding:1px;background:linear-gradient(90deg,#605b6b 75%,transparent 75%) content-box}
.app-head{display:flex;align-items:center;justify-content:space-between;margin:14px 2px 13px}
.app-head small{display:block;color:#817b91;font-size:.75rem}
.app-head b{display:flex;align-items:center;gap:.3rem;margin-top:2px;font-size:1.0625rem}
.app-head b .icon{width:.85rem;height:.85rem;color:var(--purple)}
.notice{position:relative;padding:7px;border-radius:11px;background:#edeafa;color:var(--purple)}
.notice .icon{width:18px;height:18px}
.notice i{position:absolute;right:-2px;top:-4px;display:grid;place-items:center;width:16px;height:16px;color:#fff;background:#ed9079;border:2px solid #f8f9fc;border-radius:50%;font-size:12px;font-style:normal;line-height:1}
.search{display:flex;align-items:center;gap:7px;padding:10px;color:#817b91;background:#eeedf4;border-radius:10px;font-size:.75rem}
.search .icon{width:15px;height:15px}
.app-categories{display:flex;justify-content:space-between;padding:11px 7px 9px;color:#797387;font-size:.75rem}
.app-categories .selected{color:var(--purple);font-weight:700}
.app-categories .selected::after{content:"";display:block;width:12px;height:2px;margin:3px auto 0;background:var(--purple);border-radius:3px}
.map{position:relative;height:148px;overflow:clip;border:1px solid #e8e6ef;border-radius:15px;background:#f0eef6}
.map::before{content:"";position:absolute;inset:-20%;background:repeating-linear-gradient(28deg,transparent 0 50px,#fff 51px 56px,transparent 57px 100px),repeating-linear-gradient(112deg,transparent 0 40px,#fff 41px 46px,transparent 47px 92px)}
.map::after{content:"";position:absolute;width:160%;height:35px;top:40%;left:-20%;border-radius:100%;border-bottom:13px solid #ded9f3;transform:rotate(-35deg)}
.map-path{display:none}
.map-pin{position:absolute;z-index:2;display:grid;place-items:center;width:35px;height:35px;color:var(--purple);background:#fff;border:1px solid #fff;border-radius:11px;box-shadow:0 5px 12px #5347701a}
.map-pin .icon{width:19px;height:19px}
.pin-one{left:17%;top:28%;color:#c87257}.pin-two{right:16%;top:16%}.pin-three{left:51%;bottom:14%}
.map-street{position:absolute;z-index:1;color:#888099;bottom:12px;left:19px;font-size:.75rem}
.list-head{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:13px 2px 0}
.list-head b{font-size:.875rem}.list-head span{color:#817b91;font-size:.75rem}
.mini-event{display:flex;align-items:center;gap:9px;padding:10px 8px;border-bottom:1px solid #eeebf3}
.mini-event>i{flex:none;display:grid;place-items:center;width:36px;height:41px;color:#be785d;background:#f9ede6;border-radius:9px}
.mini-event:last-of-type>i{background:#ece9fb;color:#7761c5}.mini-event .icon{width:20px;height:20px}
.mini-event b{display:block;font-size:.75rem}
.mini-event p{color:#817b91;font-size:.75rem;line-height:1.5;margin-top:4px}
.app-tabbar{display:flex;align-items:center;justify-content:space-around;padding:11px 0 4px;color:#817b91;font-size:.75rem}
.app-tabbar>span{display:flex;flex-direction:column;align-items:center;gap:3px}
.app-tabbar .icon{width:19px;height:19px}.app-tabbar .selected{color:var(--purple)}
.app-tabbar .app-create{display:grid;place-items:center;width:33px;height:33px;color:#fff;background:var(--purple);border-radius:11px}
.float-tag{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:11px 14px 11px 10px;color:#4a425f;background:#ffffffed;border:1px solid #fff;border-radius:15px;box-shadow:0 14px 32px #47317520;font-size:.8125rem}
.float-tag i{display:grid;place-items:center;width:34px;height:38px;color:#b57b65;background:#fff1e8;border-radius:10px}
.float-tag small{display:block;color:#8e869b;font-size:.75rem}
.tag-run{left:0;top:18%;transform:rotate(-5deg)}
.tag-photo{right:-2%;top:44%;transform:rotate(5deg)}.tag-photo i{color:var(--purple);background:#eeeafb}
.match-toast{position:absolute;z-index:4;right:0;bottom:13%;display:flex;align-items:center;gap:10px;padding:14px;color:#494159;background:#fff;border-radius:15px;box-shadow:0 14px 32px #47317520;transform:rotate(-3deg)}
.match-toast>span{display:grid;place-items:center;width:33px;height:33px;color:#5b5098;background:#ede9fb;border-radius:50%}
.match-toast b,.match-toast small{display:block}.match-toast b{font-size:.8125rem;font-weight:600}
.match-toast small{color:#8e869b;font-size:.75rem}
.demo-caption{position:absolute;bottom:-5px;color:#e0d7f9;font-size:.75rem}
.scroll-tip{position:absolute;bottom:26px;left:var(--section-gutter);display:flex;align-items:center;gap:10px;color:#e0d9f6;font-size:.75rem}
.scroll-tip>span{width:16px;height:24px;border:1px solid #c3b8f4;border-radius:9px}
.scroll-tip>span::after{content:"";display:block;margin:5px auto;width:2px;height:5px;background:#e6ddff;border-radius:2px}

/* Quiet sections share spacing, type scale and a 1200px content boundary. */
.statement{display:grid;place-content:center;gap:1.5rem;padding:clamp(5rem,10vw,8.5rem) var(--page-gutter);text-align:center}
.statement p{color:var(--muted);font-size:1rem}
.statement h2{font-size:clamp(2.25rem,4vw,3.5rem);line-height:1.5;letter-spacing:-.02em;font-weight:600}
.statement em{color:var(--purple);font-style:normal}
.product-story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(3rem,8vw,8rem);align-items:center;padding:clamp(5rem,8vw,7.5rem) var(--section-gutter)}
.story-lilac{background:#f7f6fc}.story-coral{background:#fff}.story-copy{max-width:480px}
.section-index{display:flex;align-items:center;gap:.75rem;color:var(--purple);font-size:.8125rem;letter-spacing:.06em;margin-bottom:1.3rem}
.section-index::before{content:"";width:23px;height:1px;background:currentColor}
.story-copy h2,.safety-head h2{font-size:clamp(2.25rem,3.7vw,3.4rem);line-height:1.35;letter-spacing:-.025em;font-weight:650}
.story-copy>p:last-of-type{max-width:410px;color:var(--muted);margin-top:1.5rem;font-size:1rem;line-height:1.95}
.topic-row{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.75rem}
.topic-row span{padding:.35rem .85rem;color:#72658f;background:#eeeaf7;border-radius:99px;font-size:.8125rem}
.story-visual{position:relative;min-width:0}
.map-stage{width:100%;min-height:470px;aspect-ratio:1.04;overflow:clip;border:1px solid #e9e5f1;border-radius:28px;background:#eeebf4;box-shadow:0 20px 45px #5c4c7910}
.map-stage::before{content:"";position:absolute;inset:-20%;background:repeating-linear-gradient(28deg,transparent 0 85px,#faf9fc 87px 96px,transparent 98px 160px),repeating-linear-gradient(112deg,transparent 0 85px,#faf9fc 86px 93px,transparent 94px 180px)}
.map-stage::after{content:"";position:absolute;width:150%;height:38%;top:21%;left:-30%;border:24px solid #dfd9ef;border-radius:50%;transform:rotate(-33deg)}
.city-label{position:absolute;z-index:1;color:#8e859d;font-size:.75rem}
.city-a{left:12%;top:10%}.city-b{right:8%;top:18%}.city-c{left:8%;bottom:20%}.route{display:none}
.place-card{position:absolute;z-index:3;width:145px;padding:15px;background:#fff;border-radius:16px;box-shadow:0 10px 25px #71608615}
.place-card i{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;color:#8870c9;background:#efebfa}
.place-card b{display:block;margin-top:9px;font-size:.875rem}.place-card small{font-size:.75rem;color:#81788f}
.place-one{left:11%;top:21%;transform:rotate(-4deg)}
.place-two{right:8%;top:42%;transform:rotate(4deg)}.place-two i{color:#a97151;background:#f9eee5}
.place-three{left:17%;bottom:9%;transform:rotate(-2deg)}
.you-are-here{position:absolute;z-index:4;top:14%;right:12%;display:flex;align-items:center;gap:7px;padding:6px 11px;color:var(--purple);background:#fff;border:1px solid #e4ddf3;border-radius:99px;box-shadow:0 5px 15px #6c597611;font-size:.75rem}
.you-are-here span{width:8px;height:8px;background:var(--purple);border-radius:50%;box-shadow:0 0 0 3px #ede9fc}
.event-stage{min-height:555px;padding:24px 0;display:grid;place-items:center}
.event-stage::before{content:"";position:absolute;width:100%;aspect-ratio:1;background:#fbf0eb;border-radius:50%}
.event-phone{position:relative;z-index:2;width:min(304px,calc(100% - 36px));overflow:hidden;border:5px solid #3d3741;border-radius:35px;background:#fff;box-shadow:0 24px 45px #7957481c;transform:rotate(-3deg)}
.event-photo{min-height:280px;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;color:#fff;background:linear-gradient(to top,#211d30bd,transparent),url('./assets/dazi-city-companions.png') 64% center/cover}
.event-photo>span{font-size:.75rem}.event-photo>b{margin-top:8px;font-size:1.65rem;line-height:1.4;font-weight:600}
.event-info{padding:20px}.event-info>p{color:#81788f;font-size:.8125rem}
.members{display:flex;align-items:center;margin-top:15px}
.members i{display:grid;place-items:center;width:32px;height:32px;margin-right:-6px;color:#fff;border:2px solid #fff;border-radius:50%;background:#9485c6;font:600 .75rem Arial,sans-serif}
.members i:nth-child(2){background:#c28d7d}.members i:nth-child(3){background:#899f9d}
.members>span{color:#81788f;font-size:.75rem;margin-left:15px}
.demo-button{display:grid;place-items:center;margin-top:20px;padding:12px;color:#fff;background:var(--purple);border-radius:11px;font-size:.875rem}
.message-bubble{position:absolute;z-index:4;display:flex;align-items:center;gap:8px;padding:12px 15px;color:#796155;background:#fff;border:1px solid #f5e5dc;border-radius:14px;box-shadow:0 9px 24px #845a4111;font-size:.8125rem}
.message-bubble .icon{width:18px;height:18px}
.bubble-one{top:25%;left:0;transform:rotate(3deg)}.bubble-two{bottom:21%;right:0;transform:rotate(3deg)}
.real-life{position:relative;isolation:isolate;overflow:clip;height:clamp(430px,50vw,720px)}
.real-life>img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.real-life::after{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(0deg,#171725b3,transparent 80%)}
.life-overlay{position:absolute;z-index:2;bottom:clamp(2rem,6vw,5rem);left:var(--section-gutter);right:var(--section-gutter);color:#fff}
.life-overlay p{font-size:.875rem;letter-spacing:.1em;opacity:.85;margin-bottom:.75rem}
.life-overlay h2{font-size:clamp(2rem,4.5vw,4rem);line-height:1.35;letter-spacing:-.025em;font-weight:600}
.safety{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(3rem,7vw,7rem);padding:clamp(5rem,8vw,7.5rem) var(--section-gutter);color:#f8f6ff;background:#262236}
.safety-head{align-self:center}.safety-head .section-index{color:#b4a7f2}
.safety-head>p:last-child{color:#b4adc6;margin-top:1.5rem;font-size:1rem;line-height:1.95}
.safety-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem}
.safety-grid article{padding:1.5rem 0;border-top:1px solid #ffffff25}
.safety-grid article>.icon{width:26px;height:26px;color:#bdadef}
.safety-grid h3{font-size:1.0625rem;font-weight:500;margin-top:1.2rem}
.safety-grid p{color:#b4adc6;font-size:.875rem;line-height:1.9;margin-top:.55rem}
.about{display:flex;flex-direction:column;align-items:center;padding:clamp(5rem,9vw,8rem) var(--page-gutter);text-align:center}
.about-mark{width:172px;height:auto;margin-left:15px}
.about h2{margin-top:2.25rem;font-size:clamp(2.25rem,4vw,3.5rem);line-height:1.45;letter-spacing:-.02em;font-weight:600}
.about>p{max-width:540px;margin-top:1.6rem;color:var(--muted);font-size:1rem}
.company-pill{margin-top:1.6rem;color:#8e859d;font-size:.8125rem}
a.company-pill{display:inline-block;color:#5844bd;text-decoration:underline;text-underline-offset:3px}
footer{display:flex;align-items:center;gap:3rem;justify-content:space-between;padding:2.5rem var(--section-gutter);background:#f7f6fa;border-top:1px solid #efecf3}
.footer-brand{flex:none}.footer-brand img{width:126px;height:36px}
.footer-brand>span{display:block;color:#8c839b;font-size:.75rem;margin-top:10px}
.footer-legal{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px 20px;color:#8c839b;font-size:.75rem}
.footer-legal>span{flex-basis:100%;text-align:right}.footer-legal a{padding-block:5px}
.footer-legal a:hover{color:var(--purple)}

/* Portrait tablets stack before either column becomes cramped. */
@media(max-width:960px){
  .hero{gap:1rem}h1{font-size:clamp(2.6rem,5.3vw,3.4rem)}
  .float-tag{font-size:.75rem;padding:9px}.tag-run{left:-5%}.tag-photo{right:-5%}.match-toast{right:-3%}
  .product-story{gap:3rem}.map-stage{min-height:430px}.place-card{width:127px;padding:12px}
  .place-one{left:7%}.place-two{right:5%}.place-three{left:12%;bottom:7%}
  .safety{grid-template-columns:1fr;gap:3rem}.safety-head>p:last-child br{display:none}
}
@media(max-width:900px){
  .topbar{min-height:76px;padding-block:1rem;gap:1rem}.wordmark>span{display:none}.wordmark img{width:126px;height:36px}
  .topbar>nav{gap:1.1rem;margin:0 0 0 auto}.top-status{display:none}
  .hero{min-height:auto;grid-template-columns:1fr;padding-top:134px;padding-bottom:48px;gap:2rem}
  .hero-copy{text-align:center;padding-bottom:0}.hero-note{justify-content:center}
  h1{font-size:clamp(2.6rem,7.5vw,3.8rem)}.hero-lead{font-size:1rem}
  .hero-product{max-width:480px;min-height:590px}.tag-run{left:0}.tag-photo{right:0}.match-toast{right:0}.scroll-tip{display:none}
  .product-story{grid-template-columns:1fr;gap:2.75rem}.story-copy{width:100%;max-width:540px;justify-self:center}
  .story-copy>p:last-of-type{max-width:none}.story-visual{width:100%;max-width:540px;justify-self:center}
  .story-coral .story-visual{order:2}.map-stage{min-height:470px}.place-card{width:145px;padding:15px}
  .place-one{left:11%}.place-two{right:8%}.place-three{left:17%}
  .real-life{height:540px}.real-life>img{object-position:61% center}footer{align-items:flex-start;gap:2rem}
}
@media(max-width:640px){
  .topbar>nav{display:none}.wordmark>span{display:block;font-size:.8125rem}.mobile-menu{display:block}
  .mobile-menu summary{list-style:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:42px;height:42px;cursor:pointer;border:1px solid #ede9f4;border-radius:50%}
  .mobile-menu summary::-webkit-details-marker{display:none}
  .mobile-menu summary>span{width:17px;height:1.5px;background:#5e526f;transition:transform .2s}
  .mobile-menu[open] summary>span:first-child{transform:translateY(3.75px) rotate(45deg)}
  .mobile-menu[open] summary>span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
  .mobile-menu nav{position:absolute;top:calc(100% - 1px);left:0;right:0;display:grid;grid-template-columns:1fr 1fr;gap:.5rem;padding:1rem var(--page-gutter) 1.5rem;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 20px 30px #28184713}
  .mobile-menu nav a{padding:.7rem .85rem;color:#655877;background:#f7f5fc;border-radius:.5rem;font-size:.875rem}
  .hero-note{flex-direction:column;gap:.6rem;margin-bottom:1.25rem}.hero-action{margin-top:1.6rem}
  .hero-product{min-height:580px;padding-top:16px}.hero-note,.release-note{font-size:.75rem}
  .device-main{width:min(286px,calc(100% - 22px));padding-inline:12px;border-radius:38px}
  .float-tag,.match-toast{display:none}.demo-caption{bottom:0}
  .statement{gap:1.1rem}.statement p{font-size:.875rem}
  .statement h2,.about h2{font-size:clamp(1.75rem,7vw,2.5rem)}
  .story-copy h2,.safety-head h2{font-size:clamp(2rem,8.5vw,2.7rem)}
  .map-stage{min-height:420px;aspect-ratio:auto;border-radius:20px}.place-card{width:126px;padding:12px}
  .place-one{left:6%}.place-two{right:6%}.place-three{left:14%;bottom:7%}.city-b{display:none}.you-are-here{right:7%;top:10%}
  .event-stage{min-height:535px}.event-phone{width:min(290px,calc(100% - 24px))}
  .bubble-one{left:0;top:26%}.bubble-two{right:0;bottom:23%}.message-bubble{padding:10px;font-size:.75rem}
  .real-life{height:510px}.life-overlay h2{max-width:300px;font-size:clamp(1.8rem,7.5vw,2.6rem)}
  .safety-grid{gap:1.5rem}.safety-grid h3{font-size:1rem}.safety-grid p{font-size:.875rem}
  footer{flex-direction:column;gap:1.4rem}.footer-legal{justify-content:flex-start;gap:4px 12px}.footer-legal>span{text-align:left}
}
@media(max-width:360px){
  :root{--page-gutter:1rem}h1{font-size:2.4rem}.hero-lead{font-size:.9375rem}.float-tag{display:none}
  .device-main{width:calc(100% - 10px)}.match-toast{right:0;bottom:10%}
  .safety-grid{grid-template-columns:1fr;gap:.5rem}.place-card{width:116px}
}
@media(min-width:901px) and (max-height:720px){
  .hero{min-height:730px;padding-top:115px;padding-bottom:45px}.hero-product{min-height:570px}.scroll-tip{bottom:20px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}
}