/* R21: one brand statement, a tactile experience entry, direct model selection. */
body.reference-r11 #hero .hero-center{top:57%;width:90%;max-width:1160px;transform:translate(-50%,var(--hero-lift,0px));color:#21495b}
body.reference-r11 #hero #hero-title{font-size:inherit;line-height:1.2;font-weight:380;letter-spacing:-.045em;text-shadow:none}
#hero-title .hero-mission{display:block;font-size:clamp(20px,1.85vw,31px);font-weight:360;line-height:1.5;letter-spacing:-.035em;text-wrap:balance;word-break:keep-all}
#hero-title .hero-company{display:block;font-size:clamp(44px,4.5vw,70px);font-weight:410;letter-spacing:-.06em;line-height:1.2;margin-top:5px}
body.reference-r11 #hero .hero-entry{left:50%;right:auto;bottom:15.5%;height:88px;width:min(355px,80vw);justify-content:center;transform:translateX(-50%);border:0}
#hero .hero-entry:before{display:none}
body.reference-r11 #hero #hero-explore{--entry-x:0px;display:flex;position:relative;top:auto;bottom:auto;align-items:center;justify-content:space-between;align-content:initial;gap:24px;width:100%;height:78px;padding:0 12px 0 27px;border:1px solid #f8ffffb8;border-radius:48px;background:linear-gradient(112deg,#f8fdffe8,#d5edf393 65%,#c9e8f078);color:#244d60;box-shadow:inset 0 1px 0 #ffffffc9,inset 0 -1px 0 #739dac30,0 8px 30px #245c7520;backdrop-filter:none;font-size:inherit;letter-spacing:0;scale:1;isolation:isolate;transition:transform .5s cubic-bezier(.2,.7,.2,1),background .4s,box-shadow .4s}
#hero-explore .explore-copy{display:flex;flex-direction:column;align-items:flex-start;gap:7px;position:relative;z-index:2;text-align:left}
#hero-explore .explore-label{font-size:18px;letter-spacing:-.025em;font-weight:450;line-height:1.25;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
#hero-explore .explore-caption{font-size:7px;letter-spacing:.13em;line-height:1.4;color:#597e8e;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
#hero-explore .explore-aperture{display:grid;place-items:center;position:relative;width:88px;height:88px;margin-right:-15px;flex:none;perspective:250px}
#hero-explore .explore-halo{position:absolute;inset:-14%;border-radius:50%;background:radial-gradient(circle,#fbffffc7,#a8dce36b 41%,transparent 70%);opacity:.6;transition:transform .6s,opacity .6s}
#hero-explore .explore-orbit{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#f4ffff;stroke-width:.65;animation:explore-orbit 11s linear infinite;transform-origin:center;pointer-events:none}
#hero-explore .explore-orbit path{stroke:#729fb2;stroke-width:1.25;stroke-linecap:round}
#hero-explore .explore-orbit circle:last-child{stroke:none;fill:#fbffff}
#hero-explore .explore-lens{position:relative;display:grid;place-items:center;width:62px;height:62px;border-radius:50%;border:1px solid #fff8;background:radial-gradient(ellipse at 28% 15%,#fff 0%,#e4f6fbe6 29%,#b6dce899 62%,#96c4d27d 87%);box-shadow:inset 0 2px 4px #fff,inset 0 -3px 5px #4d85952b,0 8px 16px #37798b29;transition:transform .55s cubic-bezier(.2,.7,.2,1),box-shadow .55s}
#hero-explore .explore-lens svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linejoin:round;stroke-linecap:round;transition:transform .5s}
body.reference-r11 #hero #hero-explore:is(:hover,:focus-visible){scale:1;transform:translateY(-3px);background:linear-gradient(112deg,#fff,#e2f7fbbb 70%,#c9e8f0aa);box-shadow:inset 0 1px 0 #fff,0 13px 35px #245c752b}
#hero-explore:is(:hover,:focus-visible) .explore-label{transform:translateX(4px)}
#hero-explore:is(:hover,:focus-visible) .explore-caption{transform:translateX(4px)}
#hero-explore:is(:hover,:focus-visible) .explore-lens{transform:translateZ(8px) rotateY(-12deg);box-shadow:inset 0 2px 5px #fff,inset 0 -3px 5px #4d85952b,0 11px 25px #37798b36}
#hero-explore:is(:hover,:focus-visible) .explore-lens svg{transform:translate(2px,-2px)}
#hero-explore:is(:hover,:focus-visible) .explore-halo{opacity:1;transform:scale(1.16)}
body.reference-r11 #hero #hero-explore:active{transform:translateY(0) scale(.98)}
#hero #hero-explore:focus-visible{outline:2px solid #356b83;outline-offset:7px}
#hero-explore.is-entering .explore-lens{transform:scale(1.15)}
#hero-explore.is-entering .explore-halo{opacity:1;transform:scale(2)}
@keyframes explore-orbit{to{transform:rotate(360deg)}}

/* The model index stays in the scene, instead of opening browser UI over it. */
#products .product-description{top:26%;bottom:auto;left:6%;width:27%;max-width:330px}
#products .product-description h2{font-size:clamp(28px,2.45vw,40px);line-height:1.27;font-weight:420;letter-spacing:-.045em;word-break:keep-all;min-height:1.27em}
#products .product-description>.eyebrow{font-size:9px;letter-spacing:.13em;margin-bottom:18px}
#products .product-description>p:not(.eyebrow){font-size:12px;line-height:1.7;margin:16px 0 23px;max-width:310px;min-height:3.4em}
.model-selector{position:relative;pointer-events:auto}
.model-selector-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;color:#395f72;font-size:9px;letter-spacing:.06em}
#model-selection-count{font-size:8px;letter-spacing:.12em;font-variant-numeric:tabular-nums;color:#54768a}
#model-choice{display:grid;gap:1px}
#model-choice .model-option{position:relative;width:100%;display:flex;align-items:center;gap:18px;min-height:34px;padding:7px 12px 7px 0;border:0;border-radius:0;text-align:left;background:transparent;color:#31556a;cursor:pointer;transition:background .3s,color .3s;isolation:isolate}
#model-choice .model-option:before{content:"";position:absolute;z-index:-1;inset:0 -12px;opacity:0;background:linear-gradient(90deg,#f3fdff9c,#d7f0f82e 83%,transparent);border-radius:2px 24px 24px 2px;transform:scaleX(.94);transform-origin:left;transition:opacity .3s,transform .4s}
#model-choice .model-code{font-size:8px;letter-spacing:.06em;width:33px;flex:none;color:#4d7284;font-variant-numeric:tabular-nums;transition:transform .35s}
#model-choice .model-name{font-size:12px;line-height:1.3;letter-spacing:.01em;transition:transform .35s}
#model-choice .model-state{margin-left:auto;position:relative;width:5px;height:5px;border:1px solid #7499a7;border-radius:50%;opacity:0;transition:opacity .3s,background .3s,box-shadow .3s}
#model-choice .model-option[aria-pressed=true]{color:#163d55}
#model-choice .model-option[aria-pressed=true] .model-name{font-weight:600}
#model-choice .model-option[aria-pressed=true]:before{opacity:.8;transform:scaleX(1)}
#model-choice .model-option[aria-pressed=true] .model-state{opacity:1;background:#6babbc;box-shadow:0 0 12px #8dd9e7;}
#model-choice .model-option:is(:hover,:focus-visible):before{opacity:1;transform:scaleX(1)}
#model-choice .model-option:is(:hover,:focus-visible) .model-name,#model-choice .model-option:is(:hover,:focus-visible) .model-code{transform:translateX(5px)}
#model-choice .model-option:focus-visible{outline:1px solid #38748b;outline-offset:3px}
#model-choice .model-option:active .model-name{transform:translateX(7px)}
#products #product-detail{margin-top:18px;font-size:10px;padding:8px 0;border:0;gap:14px}
#products #product-detail:hover{color:#3d859b}
@media(min-width:761px) and (max-height:780px){#products .product-description{top:21%}#products .product-description h2{font-size:28px;min-height:0}#products .product-description>p:not(.eyebrow){margin:12px 0 14px;min-height:0;font-size:11px}#model-choice .model-option{min-height:29px;padding:6px 12px 6px 0}#products #product-detail{margin-top:12px}body.reference-r11 #hero .hero-center{top:56%}#hero-title .hero-mission{font-size:22px}#hero-title .hero-company{font-size:48px}body.reference-r11 #hero .hero-entry{bottom:14%;height:78px}}
@media(max-width:1000px) and (min-width:761px){#products .product-description{left:4%;width:29%}#model-choice .model-option{gap:8px}#model-choice .model-name{font-size:11px}#products #family-choice{right:4%;width:165px}}
@media(max-width:760px){
 body.reference-r11 #hero .hero-center{top:55%;width:90%;max-width:430px}
 #hero-title .hero-mission{font-size:clamp(15px,4.3vw,19px);line-height:1.55;letter-spacing:-.035em}
 #hero-title .hero-mission>span{display:block}
 #hero-title .hero-company{font-size:clamp(35px,9vw,44px);margin-top:5px;letter-spacing:-.055em}
 body.reference-r11 #hero .hero-entry{width:280px;max-width:80vw;height:72px;bottom:15.5%}
 body.reference-r11 #hero #hero-explore{width:100%;height:65px;padding-left:23px;padding-right:8px;gap:8px}
 #hero-explore .explore-label{font-size:16px}#hero-explore .explore-caption{font-size:6px;letter-spacing:.09em}
 #hero-explore .explore-aperture{width:76px;height:76px;margin-right:-13px}#hero-explore .explore-lens{width:54px;height:54px}#hero-explore .explore-copy{gap:6px}
 html[lang=en] #hero-explore .explore-label{font-size:14px}
 #products .product-description{top:auto;bottom:17%;left:24px;right:24px;width:auto;max-width:none}
 #products .product-description>.eyebrow{font-size:8px;margin-bottom:8px;letter-spacing:.1em}
 #products .product-description h2{font-size:25px;min-height:0;line-height:1.25;max-width:none}
 #products .product-description>p:not(.eyebrow){font-size:11px;line-height:1.55;min-height:0;max-width:none;margin:9px 0 15px;text-wrap:pretty}
 .model-selector-heading{font-size:8px;margin-bottom:5px}
 #model-choice{display:flex;gap:13px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:3px 1px 8px;scroll-snap-type:x proximity;mask-image:linear-gradient(90deg,#000 0%,#000 95%,transparent)}
 #model-choice::-webkit-scrollbar{display:none}
 #model-choice .model-option{width:auto;flex:0 0 auto;min-width:126px;max-width:160px;min-height:56px;display:grid;grid-template-columns:1fr 6px;grid-template-rows:12px auto;align-content:center;gap:6px 10px;padding:7px 12px;scroll-snap-align:start}
 #model-choice .model-code{width:auto;grid-column:1;font-size:7px}#model-choice .model-name{grid-column:1;grid-row:2;font-size:11px;white-space:nowrap}
 #model-choice .model-state{grid-column:2;grid-row:1;margin:0}#model-choice .model-option:before{inset:0;border-radius:3px 25px 25px 3px}
 #model-choice .model-option:is(:hover,:focus-visible) .model-name,#model-choice .model-option:is(:hover,:focus-visible) .model-code{transform:translateX(2px)}
 #products #product-detail{margin-top:5px;font-size:9px;padding:4px 0}
 #products .collection-entry{bottom:9%;gap:7px;font-size:9px}#products .collection-entry a{padding-bottom:5px}#products .collection-entry p{font-size:6px}
}
@media(max-width:760px) and (max-height:730px){body.reference-r11 #hero .hero-center{top:51.5%}#hero-title .hero-mission{font-size:15px}#hero-title .hero-company{font-size:33px}body.reference-r11 #hero .hero-entry{bottom:15%}#products .product-description{bottom:16%}#products .product-description h2{font-size:22px}#products .product-description>p:not(.eyebrow){font-size:10px;margin:7px 0 10px}#model-choice .model-option{min-height:50px}#products .collection-entry{bottom:8%;gap:5px}}
@media(prefers-reduced-motion:reduce){#hero-explore,#hero-explore *,#model-choice *{animation:none!important;transition:none!important}body.reference-r11 #hero #hero-explore:hover{transform:none}}