@font-face{font-family:Public Sans;src:url(fonts/publicsans-regular.otf) format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:Public Sans;src:url(fonts/publicsans-bold.otf) format('opentype');font-weight:700;font-display:swap}
:root{color-scheme:dark;--bg:#101717;--ink:#f6f6ef;--muted:#a5b3af;--mint:#c5f2d4;--line:#ffffff25;--font:'Public Sans',Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}
button{font:inherit;cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent}
button:focus-visible{outline:3px solid var(--mint);outline-offset:5px}
[hidden]{display:none!important}
.site-shell{position:relative;isolation:isolate;max-width:1800px;margin:auto;overflow:hidden;background:radial-gradient(ellipse at 72% 40%,#263230 0,transparent 48%),var(--bg)}
.site-shell:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:10;opacity:.024;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.8' filter='url(%23n)'/%3E%3C/svg%3E")}
.site-header{height:100px;margin:0 5%;display:flex;align-items:center;gap:30px;border-bottom:1px solid var(--line);position:relative;z-index:3}
.brand{display:flex;align-items:center;gap:12px;border:0;background:transparent;padding:0;text-align:left;font-size:16px;font-weight:700;letter-spacing:.025em;min-height:48px}
.brand-symbol{width:36px;height:36px;color:var(--mint)}
.brand-domain{display:block;font-size:10px;font-weight:400;letter-spacing:.08em;color:var(--muted);margin-top:4px}
.header-note{margin-left:auto;font-size:10px;letter-spacing:.14em;display:flex;align-items:center;gap:9px}
.status-dot{width:5px;height:5px;border-radius:50%;background:var(--mint)}
.motion-button{border:1px solid var(--line);background:transparent;border-radius:100px;display:flex;gap:8px;align-items:center;min-height:44px;padding:0 15px;font-size:11px;color:var(--muted)}
.motion-button svg{width:15px;height:15px}
.motion-button[aria-pressed=false]{border-color:#c5f2d470;color:var(--mint)}
.hero{min-height:calc(100svh - 163px);display:grid;grid-template-columns:39% 61%;grid-template-rows:1fr auto;padding:52px 5% 32px;position:relative;align-items:center}
.hero-copy{grid-column:1;grid-row:1;align-self:center;position:relative;z-index:2;padding-bottom:38px}
.eyebrow{font-size:10px;line-height:1.6;letter-spacing:.12em;margin:0 0 25px;color:var(--muted);display:flex;gap:8px;align-items:center}
.eyebrow>span{height:5px;width:5px;background:var(--mint);border-radius:50%;flex-shrink:0}
h1{font-size:clamp(44px,4.6vw,83px);letter-spacing:-.063em;line-height:1.13;font-weight:400;margin:0;white-space:nowrap}
h1>span{color:var(--mint)}
.hero-description{font-size:15px;line-height:1.65;color:var(--muted);margin:24px 0 0;max-width:330px}
.mobile-break{display:none}
.desktop-caption{margin-top:58px;display:flex;gap:16px;align-items:center;font-size:9px;line-height:1.6;letter-spacing:.12em;color:#7c8d86}
.caption-line{display:block;height:1px;width:40px;background:#698c7b}
.stage{grid-column:2;grid-row:1/3;position:relative;align-self:stretch;min-height:540px;isolation:isolate;overflow:visible;margin:-30px -8% -10px -9%;pointer-events:none}
.stage-wordmark{position:absolute;left:18%;top:5%;color:#ffffff04;font-size:clamp(120px,22vw,340px);font-weight:700;letter-spacing:-.08em;line-height:1;z-index:-1}
.ambient-light{position:absolute;inset:0;background:radial-gradient(ellipse at 60% 41%,#a6cabc14,transparent 63%);transition:background .8s}
.stage-floor{position:absolute;left:0;right:-12%;bottom:9%;height:55%;background:radial-gradient(ellipse at 49% 50%,#77877e17 0,transparent 60%);transform:perspective(450px) rotateX(32deg);border-radius:50%}
.floor-ring{position:absolute;border:1px solid #bbdbcc22;border-radius:50%;box-shadow:0 1px 10px #d1ffeb07,inset 0 0 20px #b8ffcf06}
.ring-back{width:82%;height:27%;left:22%;top:45%;transform:rotate(-9deg)}
.ring-front{width:64%;height:25%;left:0;top:68%;transform:rotate(-10deg);border-color:#d7f3dd30}
.canvas-mount{position:absolute;inset:0;opacity:0;transition:opacity 1s;z-index:0}
.canvas-mount.is-ready{opacity:.68}
.canvas-mount canvas{width:100%;height:100%;display:block}
.light-sweep{position:absolute;width:6%;height:85%;left:5%;top:0;transform:rotate(32deg);background:linear-gradient(90deg,transparent,#d2f9de10,transparent);filter:blur(15px);opacity:0;z-index:4}
.vehicle{position:absolute;transform-origin:50% 75%;z-index:2;will-change:transform,opacity;transition:left .7s cubic-bezier(.22,.7,.3,1),top .7s cubic-bezier(.22,.7,.3,1),width .7s cubic-bezier(.22,.7,.3,1),opacity .5s}
.vehicle img{display:block;width:100%;height:auto;max-width:none;filter:drop-shadow(0 24px 16px #00000045)}
.vehicle-car{width:92%;left:6%;top:12%;z-index:1}
.vehicle-bike{width:51%;left:3%;top:32%;z-index:3}
.stage-label{position:absolute;display:flex;align-items:flex-start;gap:10px;z-index:5;transition:opacity .4s,transform .6s}
.stage-label>span{color:#657e72;font-size:10px;line-height:1.8}
.stage-label>div{font-size:8px;letter-spacing:.1em;color:#93a89b;line-height:1.8}
.stage-label strong{display:block;font-weight:400;color:#dce9df;font-size:12px;letter-spacing:0}
.stage-label i{display:block;width:55px;height:1px;margin:10px 0 0 7px;background:linear-gradient(90deg,#739c83,transparent)}
.label-car{right:4%;top:9%}
.label-bike{left:2%;bottom:5%}
.stage-bottom{position:absolute;left:23%;right:5%;bottom:0;display:flex;align-items:center;justify-content:space-between;font-size:8px;letter-spacing:.2em;color:#667c70}
.stage-scale{display:flex;align-items:center;gap:7px;height:13px}
.stage-scale i{height:3px;width:1px;background:#7b998670}
.stage-scale i:nth-child(3n){height:8px}
.hero-actions{grid-column:1;grid-row:2;z-index:5;position:relative;max-width:540px}
.choice-question{font-size:12px;color:#b7c4bc;margin:0 0 13px}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choice{position:relative;display:flex;align-items:center;gap:13px;border:1px solid #8aa8954a;background:#c5f2d407;border-radius:3px;min-height:90px;padding:16px 17px;text-align:left;transition:background .25s,border-color .25s,color .25s}
.choice:hover{background:#c5f2d415;border-color:#c5f2d490}
.choice[aria-pressed=true]{background:var(--mint);color:#102d20;border-color:var(--mint)}
.choice strong{font-weight:400;display:block;font-size:23px;letter-spacing:-.055em;line-height:1.2;white-space:nowrap}
.choice small{display:block;font-size:10px;line-height:1.4;color:#94ac9c;margin-top:7px;white-space:nowrap}
.choice[aria-pressed=true] small{color:#3a5d47}
.choice-icon{display:none;flex-shrink:0;color:#c5f2d4}
.choice-icon svg{width:28px;height:24px;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.choice[aria-pressed=true] .choice-icon{color:#102d20}
.choice-arrow{font-size:25px;font-weight:400;margin-left:auto;align-self:flex-start;line-height:1}
.model-picker{margin-top:22px}
.picker-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.picker-heading h2{font-size:14px;font-weight:400;margin:0;outline:none}
.text-button{font-size:10px;min-height:44px;padding:0;border:0;background:transparent;color:#afc4b7;display:flex;align-items:center;gap:5px}
.model-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.model-card{position:relative;background:#d7e5d405;border:1px solid #93b19e32;border-radius:3px;padding:6px 11px 10px;min-height:108px;text-align:left;transition:background .25s,border-color .25s;overflow:hidden}
.model-card:hover{background:#c5f2d40c}
.model-card[aria-pressed=true]{border-color:#c5f2d4b0;background:#c5f2d40c}
.model-card img{height:65px;width:100%;object-fit:contain;display:block;margin:auto;pointer-events:none}
.model-card strong{font-size:12px;font-weight:400;line-height:1.4;display:block;padding-right:18px}
.model-card .selection-check{position:absolute;right:10px;bottom:11px;color:var(--mint);font-size:12px;opacity:0}
.model-card[aria-pressed=true] .selection-check{opacity:1}
.selection-status{font-size:12px;line-height:1.5;color:#b6cabd;margin:15px 0 0;display:flex;align-items:center;gap:7px}
.selection-status:before{content:'';width:5px;height:5px;display:block;border-radius:50%;background:var(--mint);flex-shrink:0}
.site-footer{height:63px;margin:0 5%;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:18px;color:#6f8879;font-size:8px;letter-spacing:.1em;position:relative;z-index:5}
.site-footer>div{display:flex;gap:24px;align-items:center}
.replay-button{min-height:44px;font-size:10px;letter-spacing:0;border:0;background:transparent;color:#a8bcb0;display:flex;align-items:center;gap:7px;padding:0}
.replay-button svg{width:14px;height:14px}
.replay-button:disabled{opacity:.5;cursor:default}
.preview-label{font-size:8px;letter-spacing:.1em}
.noscript-note{padding:20px;font-size:16px;background:#273a2e}
.noscript-note a{color:var(--mint)}
body[data-motion=off] *,body[data-motion=off] *::before,body[data-motion=off] *::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
body[data-motion=off] .vehicle{will-change:auto}
body[data-group] .hero-copy{padding-bottom:18px}
body[data-group] .hero-description{max-width:360px}
body[data-group] .desktop-caption{display:none}
body[data-group=bike] .vehicle-bike{left:12%;width:75%;top:9%}
body[data-group=bike] .vehicle-car{opacity:0;left:40%}
body[data-group=bike] .label-car{opacity:0}
body[data-group=bike] .label-bike{left:11%;bottom:4%}
body[data-group=car] .vehicle-car{left:1%;width:105%;top:23%}
body[data-group=car] .vehicle-bike{opacity:0;left:-25%}
body[data-group=car] .label-bike{opacity:0}
body[data-group=car] .label-car{right:12%;top:13%}
body[data-group] .stage-wordmark{opacity:.5}
@media(min-width:1450px){.choice-icon{display:block}.hero-actions{max-width:560px}.hero{padding-top:60px;padding-bottom:42px}.stage{min-height:640px}.model-card img{height:76px}}
@media(min-width:801px) and (max-height:780px){.hero{padding-top:30px}.stage{min-height:480px}.desktop-caption{margin-top:32px}.hero-copy{padding-bottom:26px}body[data-group] .hero{align-items:start}body[data-group] .hero-copy{padding-top:15px}}
@media(max-width:1050px) and (min-width:801px){.hero{grid-template-columns:42% 58%;padding-top:40px}.stage{margin-left:-15%;min-height:500px}.choice{padding:16px 13px}.choice strong{font-size:21px}h1{font-size:45px}.header-note{display:none}}
@media(max-width:800px){
  .site-shell{background:radial-gradient(ellipse at 75% 40%,#26362f 0,transparent 54%),var(--bg)}
  .site-header{height:76px;margin:0 6%;gap:15px}
  .brand{font-size:13px;gap:9px;letter-spacing:0}
  .brand-symbol{width:30px;height:30px}
  .brand-domain{font-size:9px;margin-top:3px}
  .header-note{display:none}
  .motion-button{margin-left:auto;min-width:44px;padding:0 12px}
  .motion-button span{display:none}
  .hero{display:flex;flex-direction:column;align-items:stretch;padding:28px 6% 23px;min-height:calc(100svh - 135px)}
  .hero-copy{padding:0;align-self:stretch;flex:none}
  .eyebrow{font-size:8px;letter-spacing:.07em;margin:0 0 16px}
  h1{font-size:clamp(34px,9.1vw,60px);letter-spacing:-.06em;line-height:1.14}
  .hero-description{font-size:13px;line-height:1.6;margin:16px 0 0;max-width:100%}
  .mobile-break{display:none}
  .desktop-caption{display:none}
  .stage{min-height:290px;flex:1;height:clamp(290px,42svh,425px);margin:4px -6.8% 0;align-self:auto;overflow:hidden}
  .stage-wordmark{font-size:39vw;left:15%;top:12%}
  .vehicle-car{width:84%;left:10%;top:6%}
  .vehicle-bike{width:59%;left:3%;top:28%}
  .ring-back{top:39%;height:24%;left:21%;width:91%}
  .ring-front{top:62%;height:27%;left:-5%;width:69%}
  .stage-floor{bottom:7%;height:56%}
  .label-car{top:3%;right:6%}
  .label-bike{bottom:6%;left:7%}
  .stage-label i{width:28px}
  .stage-label>div{font-size:7px}
  .stage-label strong{font-size:10px}
  .stage-label>span{font-size:9px}
  .stage-bottom{display:none}
  .hero-actions{max-width:none;flex:none;margin-top:4px}
  .choice-question{font-size:12px;margin-bottom:12px}
  .choices{gap:10px}
  .choice{min-height:82px;padding:15px 14px;border-radius:3px}
  .choice strong{font-size:24px;letter-spacing:-.055em}
  .choice small{font-size:10px;margin-top:5px}
  .choice-arrow{font-size:24px}
  .model-picker{margin-top:14px}
  .picker-heading{margin-bottom:8px}
  .picker-heading h2{font-size:14px}
  .model-card{min-height:106px;padding:5px 12px 10px}
  .model-card img{height:63px}
  .model-card strong{font-size:13px}
  .selection-status{font-size:12px;margin-top:13px}
  .site-footer{height:59px;margin:0 6%;font-size:7px;letter-spacing:.02em;gap:10px}
  .site-footer>div{gap:10px}
  .preview-label{display:none}
  .replay-button{font-size:10px}
  body[data-group] .hero{padding-top:25px;min-height:calc(100svh - 135px)}
  body[data-group] .hero-copy{padding:0}
  body[data-group] h1{font-size:clamp(33px,9vw,52px);line-height:1.15}
  body[data-group] .hero-description{font-size:12px;margin-top:10px}
  body[data-group] .stage{height:240px;min-height:240px;flex:none;margin-top:0}
  body[data-group] .hero-actions{margin-top:0}
  body[data-group] .choice{min-height:66px;padding:11px 14px}
  body[data-group] .choice strong{font-size:21px}
  body[data-group] .choice small{font-size:9px;margin-top:3px}
  body[data-group=bike] .vehicle-bike{width:68%;left:16%;top:-5%}
  body[data-group=bike] .label-bike{left:7%;bottom:3%}
  body[data-group=car] .vehicle-car{left:2%;width:96%;top:4%}
  body[data-group=car] .label-car{top:0;right:7%}
  body[data-model=feliz-ii] .vehicle-bike{width:90%;left:8%;top:8%}
}
@media(max-width:350px){
  .site-header{height:68px}.hero{padding-top:23px;min-height:calc(100svh - 120px)}
  .eyebrow{font-size:7px;letter-spacing:.02em}.hero-description{font-size:12px;margin-top:12px}
  h1{font-size:32px}.stage{height:285px;min-height:285px}.choice strong{font-size:23px}
  .choice{padding:13px 12px;min-height:76px}.choice small{font-size:9px}.site-footer{height:52px}
  body[data-group] .stage{height:207px;min-height:207px}body[data-group] .hero{min-height:calc(100svh - 120px)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.vehicle{will-change:auto}.light-sweep{display:none}}