/* Two distinct hero compositions; shared controls stay with the introduction. */
.design-switch{position:fixed;bottom:18px;right:20px;z-index:40;padding:5px;background:#fff;box-shadow:0 4px 24px #10273f26;border:1px solid #c7d7e5;border-radius:8px;font-size:12px}
.design-switch>span{display:none}.design-switch a{min-height:38px;padding:9px 13px}
.design-switch a[aria-current]{background:#edf5ff;border-color:transparent}
.hero-action{margin-top:22px}.hero-action .button{border-radius:100px;padding:14px 27px;min-height:54px;font-size:17px;gap:22px}
.hero-action .hero-micro{margin:11px 0 0;font-size:12px;color:#435b71}
.header{min-height:94px;padding-top:15px;padding-bottom:15px}.header-cta{border-radius:100px}
.new-hero-copy h1{margin-bottom:24px}
.new-hero-copy>p:not(.eyebrow){margin-bottom:0}
.design-showcase .new-hero{min-height:430px;padding:28px 48px 22px;grid-template-columns:34% 66%;align-items:center}
.design-showcase .new-hero-copy{padding:0;align-self:center;z-index:3}
.design-showcase .new-hero-copy h1{font-size:clamp(48px,4.8vw,76px);line-height:1.05;letter-spacing:-.055em}
.design-showcase .new-hero-copy .eyebrow{display:none}
.design-showcase .new-hero-copy>p{font-size:18px;line-height:1.5;max-width:380px}
.design-showcase .character-stage{aspect-ratio:2.25;margin:20px 0 0}
.design-showcase .stage-label{font-size:25px;line-height:1;z-index:4}
.design-showcase .stage-bit{left:0%;bottom:5%;width:19%;height:57%}
.design-showcase .stage-lex{left:14%;bottom:41%;width:22%;height:54%}
.design-showcase .stage-pip{left:25%;bottom:3%;width:25%;height:67%}
.design-showcase .stage-dot{left:42%;bottom:42%;width:20%;height:55%}
.design-showcase .stage-tux{left:49%;bottom:4%;width:25%;height:77%}
.design-showcase .stage-zag{left:71%;bottom:5%;width:19%;height:71%}
.design-showcase .stage-patch{left:84%;bottom:0%;width:18%;height:57%}
.design-showcase .stage-bit .stage-label{top:-17%;left:0}
.design-showcase .stage-lex .stage-label{top:-10%;left:12%}
.design-showcase .stage-pip .stage-label{top:1%;left:36%}
.design-showcase .stage-dot .stage-label{top:-3%;left:78%}
.design-showcase .stage-tux .stage-label{top:0%;left:77%}
.design-showcase .stage-zag .stage-label{top:-13%;left:55%}
.design-showcase .stage-patch .stage-label{top:-18%;left:60%}
.design-showcase .plinth-one{left:17%;bottom:10%;height:32%;width:18%}
.design-showcase .plinth-two{left:44%;bottom:10%;height:34%;width:18%}
.design-showcase .collection{margin-top:8px}
.design-showcase .collection .section-heading h2{white-space:nowrap;font-size:34px}
.design-showcase .collection{grid-template-columns:210px 1fr;padding-top:26px;padding-bottom:22px}
.design-world .new-hero{position:relative;display:block;min-height:0;height:650px;max-width:none;padding:32px 24px 0;overflow:hidden;background:linear-gradient(#fff 0%,#f0faff 62%,#edf8ff 90%,#fff 100%)}
.design-world .new-hero-copy{position:relative;padding:0;text-align:center;max-width:680px;margin:auto;z-index:3}
.design-world .new-hero-copy .eyebrow{justify-content:center;font-size:11px;margin-bottom:12px}
.design-world .new-hero-copy h1{font-size:59px;line-height:1.04;letter-spacing:-.05em;margin-bottom:15px}
.design-world .new-hero-copy h1:after{display:none}
.design-world .new-hero-copy>p{max-width:460px;font-size:17px;line-height:1.5;margin:0 auto}
.design-world .hero-action{margin-top:16px}
.design-world .hero-action .hero-micro{display:none}
.design-world .character-stage{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:min(1160px,96%);height:345px;aspect-ratio:auto;margin:0;isolation:auto}
.design-world .pixel-setting{position:absolute;width:140%;max-width:none;height:560px;left:-20%;top:auto;bottom:-120px;object-fit:cover;object-position:center bottom;z-index:-2;mask-image:linear-gradient(transparent,#000 18%,#000 85%,transparent);opacity:.9}
.design-world .stage-bit{left:0;bottom:13%;width:19%;height:58%}
.design-world .stage-lex{left:15%;bottom:21%;width:18%;height:55%}
.design-world .stage-pip{left:28%;bottom:9%;width:24%;height:70%}
.design-world .stage-dot{left:46%;bottom:18%;width:16%;height:63%}
.design-world .stage-tux{left:60%;bottom:11%;width:21%;height:72%}
.design-world .stage-zag{left:76%;bottom:17%;width:16%;height:65%}
.design-world .stage-patch{left:86%;bottom:4%;width:17%;height:53%}
.design-world .collection{padding-top:35px}
.footer{padding-bottom:82px}
@media(min-width:1500px){.design-showcase .new-hero{min-height:470px}.design-world .new-hero{height:690px}.design-world .character-stage{height:380px;width:1250px}}
@media(max-width:1100px) and (min-width:901px){.design-showcase .new-hero{padding:30px;min-height:400px;grid-template-columns:35% 65%}.design-showcase .new-hero-copy h1{font-size:51px}.design-showcase .new-hero-copy>p{font-size:16px}.design-showcase .stage-label{font-size:21px}.design-showcase .collection{grid-template-columns:175px 1fr}.design-showcase .collection .section-heading h2{font-size:29px}.design-world .new-hero{height:610px}.design-world .character-stage{height:310px}}
@media(max-width:900px){.design-showcase .new-hero{position:relative;display:flex;flex-direction:column;padding:32px 24px 20px;min-height:0;gap:8px}.design-showcase .new-hero-copy{text-align:center;max-width:580px}.design-showcase .new-hero-copy h1{font-size:62px}.design-showcase .new-hero-copy h1:after{margin:12px auto 0}.design-showcase .new-hero-copy>p{max-width:440px;margin:auto;font-size:18px}.design-showcase .character-stage{width:100%;max-width:760px;aspect-ratio:2.3;margin:64px auto 0}.design-showcase .collection{display:block}.design-showcase .collection .section-heading h2{font-size:40px}.design-world .new-hero{height:620px}.design-world .new-hero-copy h1{font-size:56px}.design-world .character-stage{width:98%;height:300px}.design-world .pixel-setting{width:140%;height:480px;bottom:-90px}}
@media(max-width:600px){.header{min-height:78px;padding:12px 18px}.design-switch{bottom:10px;right:10px;padding:3px;border-radius:6px}.design-switch a{font-size:11px;padding:9px 11px;min-height:36px}.design-showcase .new-hero{padding:29px 20px 12px;gap:0}.design-showcase .new-hero-copy{text-align:left;max-width:none;width:100%}.design-showcase .new-hero-copy h1{font-size:clamp(43px,12vw,64px);line-height:1.04;margin-bottom:20px}.design-showcase .new-hero-copy h1:after{margin:12px 0 0;width:160px}.design-showcase .new-hero-copy>p{font-size:17px;max-width:none;margin:0;line-height:1.5}.hero-action{margin-top:18px}.hero-action .button{font-size:16px;min-height:50px;padding:12px 23px}.hero-action .hero-micro{font-size:11px;margin-top:10px}.design-showcase .character-stage{margin:55px 0 6px;aspect-ratio:1.8}.design-showcase .stage-label{font-size:16px}.design-showcase .stage-dot .stage-label{left:65%}.design-showcase .stage-patch .stage-label{left:36%;top:-15%}.design-showcase .stage-tux .stage-label{top:-3%}.design-showcase .stage-lex .stage-label{top:-14%}.design-showcase .stage-pip .stage-label{top:0%}.design-showcase .stage-zag .stage-label{top:-10%;left:42%}.design-showcase .stage-label>span{font-size:15px}.design-showcase .collection{margin-top:7px}.design-showcase .collection .section-heading h2{font-size:38px}.design-world .new-hero{height:630px;padding:29px 20px 0}.design-world .new-hero-copy{max-width:420px}.design-world .new-hero-copy h1{font-size:clamp(41px,11.3vw,57px);line-height:1.08;margin-bottom:17px;white-space:normal}.design-world .new-hero-copy .eyebrow{font-size:10px;margin-bottom:12px}.design-world .new-hero-copy>p{font-size:16px;max-width:330px}.design-world .hero-action{margin-top:20px}.design-world .character-stage{bottom:16px;height:290px;width:100%}.design-world .pixel-setting{height:400px;width:140%;bottom:-50px}.design-world .stage-bit{left:1%;bottom:8%;width:25%;height:42%}.design-world .stage-lex{left:11%;bottom:48%;width:26%;height:40%}.design-world .stage-pip{left:22%;bottom:3%;width:33%;height:48%}.design-world .stage-dot{left:47%;bottom:49%;width:25%;height:44%}.design-world .stage-tux{left:45%;bottom:8%;width:32%;height:53%}.design-world .stage-zag{left:73%;bottom:42%;width:22%;height:43%}.design-world .stage-patch{left:77%;bottom:3%;width:24%;height:39%}.design-world .collection{padding-top:29px}.design-showcase .hero-action .hero-micro{display:none}}
/* Terrain shares each character's responsive anchor; all ledges sit behind the cast. */
.design-world .terrain-anchor{position:absolute;z-index:0;pointer-events:none}
.design-world .pixel-ledge{position:absolute;left:50%;bottom:3px;width:92%;aspect-ratio:1;background:url('/assets/pixel-ledges.webp') var(--ledge) 0 / 300% 100% no-repeat;transform:translate(-50%,46%)}
.design-world .stage-pip .pixel-ledge{width:81%;bottom:4px}
.design-world .stage-tux .pixel-ledge{width:78%;bottom:3px}
.design-world .stage-patch .pixel-ledge{width:96%;bottom:3px}
/* Tux overlaps Zag; Patch grows 10% from her existing ground level. */
.design-world .stage-friend.stage-tux{z-index:3}
.design-world .stage-patch{left:84.3%;width:18.7%;height:58.3%}
@media(max-width:600px){.design-world .stage-patch{left:74.6%;width:26.4%;height:42.9%}}
