@font-face{font-family:"Archivo Black";src:url(fonts/archivo-black-latin.woff2) format("woff2");
  font-weight:400;font-style:normal;font-display:swap}
:root{
  --ink:#0E0B09; --cream:#F2ECE3; --muted:#A89F94; --line:rgba(242,236,227,.14);
  --lime:#C8F34B; --soon:rgba(242,236,227,.42);
  --display:"Archivo Black","Arial Black",system-ui,sans-serif;
  --text:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --gutter:20px; --wrap:1200px;
}
@media (min-width:768px){:root{--gutter:40px}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ink);color:var(--cream);font:17px/1.55 var(--text);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--lime);outline-offset:3px;border-radius:4px}
.wrap{max-width:calc(var(--wrap) + 2 * var(--gutter));margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:var(--gutter);top:12px;z-index:9;background:var(--cream);color:var(--ink);padding:10px 14px}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;height:76px}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;min-height:44px;flex-shrink:0}
.brand img{width:36px;height:36px;border-radius:22.5%}
.wm{font:19px/1 var(--display);letter-spacing:.02em;white-space:nowrap}
.wm b{font-weight:inherit;color:var(--lime)}
.nav{display:flex;align-items:center;gap:28px}
.nav a{font-size:15px;color:var(--muted);text-decoration:none;padding:12px 0}
.nav a:hover,.nav a[aria-current=page]{color:var(--cream)}
@media (max-width:640px){.nav .opt{display:none}.nav{gap:20px}}
@media (max-width:440px){.nav .opt2{display:none}}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,500px);column-gap:48px;align-items:end;
  min-height:clamp(640px,calc(100svh - 188px),960px)}
.hero-copy{align-self:center;padding:24px 0 48px}
h1,.h1{font:clamp(34px,4.7vw,72px)/1.02 var(--display);letter-spacing:-.012em;margin:0 0 28px}
.nw{white-space:nowrap}
@supports (font-size:1cqi){.hero-copy{container-type:inline-size}.hero-copy h1{font-size:min(72px,10.2cqi)}}
.tick{position:relative;isolation:isolate;display:inline-block;line-height:1;color:var(--ink);
  padding:0 .1em;margin:0 -.02em;transform-origin:50% 60%;
  animation:tap .34s cubic-bezier(.25,1.5,.5,1) .5s both}
.tick::before{content:"";position:absolute;z-index:-1;left:0;right:0;top:.06em;bottom:-.124em;
  background:var(--lime);border-radius:.1em;animation:tapbg .34s linear .5s both}
@keyframes tap{
  0%{color:var(--cream);transform:scale(1)}
  40%{color:var(--cream);transform:scale(.95)}
  41%{color:var(--ink);transform:scale(.95)}
  100%{color:var(--ink);transform:scale(1)}}
@keyframes tapbg{0%,40%{opacity:0}41%,100%{opacity:1}}
@media (prefers-reduced-motion:reduce){.tick,.tick::before{animation:none}}
.lead{font-size:clamp(18px,1.45vw,21px);line-height:1.5;color:var(--muted);max-width:27em;margin:0 0 32px;text-wrap:pretty}
p,li,dd{text-wrap:pretty}
.get{display:flex;flex-wrap:wrap;align-items:center;gap:8px 32px}
.soon{display:inline-flex;align-items:center;gap:12px;margin:0;min-height:44px;font-size:16px;font-weight:600;color:var(--cream)}
.ring{width:24px;height:24px;border-radius:50%;border:2px solid rgba(242,236,227,.4);flex:none}
.badge{display:inline-block;padding:12px 0}
.badge img{height:52px;width:auto}
.how{font-size:16px;font-weight:600;padding:12px 0;color:var(--cream)}
.how.big{font-size:19px;font-weight:700}
.note{font-size:14px;color:var(--muted);margin:12px 0 0}
.hero-phone{position:relative;margin:0}
.hero-phone img{width:100%}
.hero-phone .card{position:absolute;left:2.8125%;top:66.6667%;width:94.375%;z-index:1;
  filter:drop-shadow(0 22px 26px rgba(38,56,0,.42))}
.idea{background:var(--lime);color:var(--ink)}
.idea .wrap{padding-top:120px;padding-bottom:104px}
.statement{font:clamp(24px,3.45vw,50px)/1.08 var(--display);letter-spacing:-.01em;margin:0;max-width:21em;text-wrap:balance}
.idea :focus-visible{outline-color:var(--ink)}
.sec{padding-top:128px}
h2{font:clamp(26px,3.2vw,46px)/1.04 var(--display);letter-spacing:-.01em;margin:0;text-wrap:balance}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;align-items:end;margin-bottom:56px}
.sec-head p{margin:0;font-size:19px;color:var(--muted);max-width:28em}
.auto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;
  grid-template-areas:"h i" "hs l" "hs sc";border-bottom:1px solid var(--line)}
.auto h2{grid-area:h;margin-bottom:56px}
.auto .intro{grid-area:i;margin:0;font-size:19px;color:var(--muted);max-width:28em;align-self:end;padding-bottom:62px}
.auto .srcs{grid-area:l;margin:0 0 56px;padding:0;list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:24px;align-self:start}
.auto .srcs li{border-top:1px solid var(--line);padding:12px 0;font-size:16px}
.auto .s-health{grid-area:hs;align-self:end}
.auto .s-short{grid-area:sc;align-self:end}
.shot{margin:0;display:flex;flex-direction:column;justify-content:flex-end}
.shot h3,.row h3,.fact h3{font:600 20px/1.3 var(--text);margin:0 0 8px;color:var(--cream)}
.shot p{margin:0 0 36px;color:var(--muted);max-width:30em}
.frame{width:min(100%,420px);margin:0 auto}
.frame img{width:100%}
.row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;align-items:end;
  border-bottom:1px solid var(--line)}
.row .copy{align-self:center;padding:56px 0}
.row .copy p{color:var(--muted);margin:20px 0 0;max-width:28em;font-size:19px}
.row ul{margin:28px 0 0;padding:0;list-style:none;max-width:28em}
.row .copy .proof{font-size:16px;color:var(--cream);margin:28px 0 0;padding:14px 0;border-top:1px solid var(--line);max-width:28em}
.facts-intro{margin:20px 0 0;font-size:19px;color:var(--muted);max-width:30em}
.row li{padding:14px 0;border-top:1px solid var(--line);color:var(--cream)}
.row.flip .copy{order:2}
.row + .row{margin-top:96px}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:64px;margin:48px 0 28px}
.fact{border-top:1px solid var(--line);padding:24px 0 30px}
.fact p{margin:0;color:var(--muted);max-width:30em}
.more{display:inline-block;font-weight:600;padding:12px 0}
.qa{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);column-gap:64px;align-items:start}
.qa .faq{margin-top:0;max-width:none}
.faq{max-width:840px;margin-top:40px;border-bottom:1px solid var(--line)}
.faq details{border-top:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;position:relative;padding:22px 48px 22px 0;
  font:600 19px/1.35 var(--text);color:var(--cream)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:10px;top:50%;width:10px;height:10px;
  border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:translateY(-70%) rotate(45deg);
  transition:transform .2s ease}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
@media (prefers-reduced-motion:reduce){.faq summary::after{transition:none}}
.faq .a{padding:0 48px 26px 0;color:var(--muted);max-width:42em}
.faq .a p{margin:0 0 12px}
.faq .a p:last-child{margin-bottom:0}
.faq .a ol,.faq .a ul{margin:0 0 12px;padding-left:22px}
.faq .a li{margin:4px 0}
.faq code,.doc code{font:inherit;color:var(--cream)}
.end .wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
.end-icon{width:128px;height:128px;border-radius:22.5%;margin-bottom:32px}
.end h2{font-size:clamp(28px,3.35vw,48px);margin-bottom:24px}
@media (max-width:480px){.end h2 .nw{display:block}}
.end .get{justify-content:center}
.foot{margin-top:128px;border-top:1px solid var(--line);padding:44px 0 56px;color:var(--muted);font-size:15px}
.foot-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.foot .brand img{width:28px;height:28px}
.foot .wm{font-size:16px;color:var(--cream)}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 28px}
.foot nav a{text-decoration:none;padding:12px 0}
.foot nav a:hover{color:var(--cream)}
.legal{margin:28px 0 0;font-size:13px;line-height:1.6;max-width:62em}
.doc{max-width:760px;padding-top:48px}
.doc h1{font-size:clamp(40px,5.4vw,68px);line-height:1;margin-bottom:20px}
.doc section[lang=vi] h1{font:800 clamp(32px,4.4vw,52px)/1.08 var(--text);letter-spacing:-.02em}
.doc .meta{color:var(--muted);margin:0 0 8px}
.doc h2{font:700 21px/1.3 var(--text);letter-spacing:0;margin:44px 0 10px}
.doc p,.doc li{max-width:40em}
.doc ul{padding-left:22px}
.doc li{margin:6px 0}
.doc li::marker{color:var(--muted)}
.doc strong{color:#fff}
.doc section + section{margin-top:80px;padding-top:24px;border-top:1px solid var(--line)}
.langs{display:flex;gap:24px;margin:0 0 8px}
.langs a{font-size:15px;color:var(--muted);text-decoration:none;padding:12px 0}
.langs a:hover{color:var(--cream)}
.mail{display:inline-block;font:clamp(24px,3.4vw,40px)/1.15 var(--display);letter-spacing:-.005em;
  text-decoration:none;border-bottom:3px solid var(--cream);padding-bottom:4px;margin:8px 0 12px;word-break:break-word}
.mail:hover{border-bottom-width:5px}
.doc .faq{margin-top:28px}
.doc h2.qhead{font:clamp(28px,3.2vw,40px)/1.05 var(--display);margin:72px 0 0}
@media (max-width:900px){
  .hero{grid-template-columns:minmax(0,1fr);min-height:0;padding-top:4px}
  .hero-copy{padding:12px 0 28px}
  h1,.h1{font-size:clamp(32px,9.3vw,60px)}
  .lead{margin-bottom:20px}
  .hero-phone{width:min(100%,420px);justify-self:center}
  .bd{display:none}
  .note{display:none}
  .sec{padding-top:96px}
  .sec-head{grid-template-columns:minmax(0,1fr);row-gap:16px;margin-bottom:40px}
  .auto{grid-template-columns:minmax(0,1fr);grid-template-areas:"h" "i" "l" "hs" "sc";border-bottom:0}
  .auto h2{margin-bottom:16px}
  .auto .intro{padding-bottom:28px}
  .auto .srcs{margin-bottom:56px}
  .auto .shot{border-bottom:1px solid var(--line)}
  .auto .s-short{margin-top:72px}
  .row{grid-template-columns:minmax(0,1fr)}
  .row .copy{padding:0 0 40px}
  .row.flip .copy{order:0}
  .facts{grid-template-columns:minmax(0,1fr)}
  .qa{grid-template-columns:minmax(0,1fr)}
  .qa .faq{margin-top:32px}
  .idea .wrap{padding-top:88px;padding-bottom:72px}
}
@media (max-width:480px){
  .auto .srcs{grid-template-columns:minmax(0,1fr)}
  body{font-size:16px}
  .faq summary{font-size:17px;padding-right:40px}
  .faq .a{padding-right:0}
  .foot-row{align-items:flex-start;flex-direction:column}
}