/* Side-framed typography. Original app-file artwork is retained until the
   separate Brand Style Guide is available; these are not frame 16/18 assets. */
.hero{padding:88px 0 30px}
.hero-content{max-width:none}
.hero-title-stage{position:relative;isolation:isolate;padding:130px 0 126px}
.hero h1{font-size:clamp(42px,13vw,70px);max-width:calc(100% - 34px);line-height:1.02;letter-spacing:-.03em;text-align:center;pointer-events:none}
.hero h1 .juicy-word{pointer-events:auto}
.title-accent{margin-top:7px}
.object-universe{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;z-index:2;pointer-events:none}
.object-bubble{pointer-events:auto;background:#fffdfaeb;border-color:#ffffffc9;box-shadow:0 14px 28px #773a7117}
.object-bubble img{width:85%;height:85%}
.object-0{width:112px;height:112px;left:-19px;right:auto;top:3px;bottom:auto;--angle:-13deg}
.object-1{width:120px;height:120px;right:-23px;left:auto;top:5px;bottom:auto;--angle:12deg}
.object-2{width:75px;height:75px;right:85px;left:auto;top:22px;bottom:auto;--angle:-9deg}
.object-3{width:69px;height:69px;left:86px;right:auto;top:29px;bottom:auto;--angle:13deg}
.object-4{width:95px;height:95px;left:-12px;right:auto;top:auto;bottom:5px;--angle:-12deg}
.object-5{width:73px;height:73px;left:97px;right:auto;top:auto;bottom:12px;--angle:10deg}
.object-6{width:106px;height:106px;right:-7px;left:auto;top:auto;bottom:0;--angle:13deg}
.hero-offer{position:relative;z-index:4;margin-top:25px;padding-inline:16px}
.hero .scroll-cue{margin-top:22px}
.section-intro h2{font-size:clamp(50px,14.5vw,80px);letter-spacing:-.045em}
.section-intro{margin-bottom:30px}
.story-scene{padding-inline:22px}
.scene-art{height:365px}
.profile-card{width:min(285px,100%);min-height:295px;padding:23px 24px 25px;border-radius:31px}
.profile-hands{width:178px;height:153px;margin-top:-6px}
.profile-greeting{font-size:21px;margin-bottom:12px}
.profile-field{font-size:15px;padding-top:11px;margin-top:11px}
.profile-field b{width:24px;height:24px;font-size:14px}
.scene-word{font-size:clamp(106px,30vw,156px);bottom:0}
.choice-orbit{width:100%;max-width:350px;height:345px;transform:none}
.choice-item{width:155px;height:155px}
.choice-item:nth-child(1){width:180px;height:180px;top:3px;right:0}
.choice-item:nth-child(2){top:122px;left:0}
.choice-item:nth-child(3){width:148px;height:148px;top:190px;right:2px}
.choice-item b{width:36px;height:36px;font-size:20px}
.request-card{width:min(298px,100%);min-height:290px;padding:22px 18px;border-radius:31px}
.request-card img{width:175px;height:144px;margin-top:-18px;margin-bottom:8px}
.request-card>span{font-size:14px}
.request-card>strong{font-size:25px;margin:9px 0 22px}
.request-options{font-size:13px}
.scene-caption{padding-top:21px;min-height:245px}
.scene-caption h3{font-size:34px;line-height:1.08}
.scene-caption p{font-size:17px;line-height:1.4}
.is-enhanced .story-stage{min-height:638px}
.skills-intro h3{font-size:clamp(34px,9.5vw,48px)}
.skill-picker{--disc:148px;grid-template-rows:repeat(2,var(--disc));grid-auto-columns:var(--disc);gap:18px 14px;padding:10px 5px 20px;scroll-padding-inline:5px}
.skill-tile{width:var(--disc);height:var(--disc);min-height:0;aspect-ratio:1;border-radius:50%;padding:12px 11px 16px;gap:3px}
.skill-tile>img{width:80px;height:80px}
.skill-tile>span:last-child{max-width:112px;font-size:14px;line-height:1.15}
.tile-check{top:10px;right:10px;width:25px;height:25px;font-size:14px;border:2px solid var(--ink)}
.skill-tile.is-active{box-shadow:0 0 0 4px #ffcb9e22;transform:translateY(-3px)}
.skill-tile:focus-visible{outline-color:var(--mint);outline-offset:3px}
.skill-tile:active{transform:scale(.93)}
@media(hover:hover) and (pointer:fine){.skill-tile:hover{transform:translateY(-6px) rotate(-3deg);border-color:#ffffffb3}.skill-tile:hover>img{transform:rotate(8deg) scale(1.12)}}
@media(min-width:500px) and (max-width:1050px){
 .hero h1{max-width:80%;font-size:clamp(62px,10vw,88px)}
 .hero-title-stage{padding:140px 0 130px}
 .object-0{width:140px;height:140px;left:-12px}
 .object-1{width:143px;height:143px;right:-12px}
 .object-2{right:130px;top:12px;width:90px;height:90px}
 .object-3{left:145px;top:25px;width:85px;height:85px}
 .object-4{width:126px;height:126px}
 .object-5{left:125px;width:92px;height:92px}
 .object-6{width:136px;height:136px}
 .story-scene{display:block;padding-inline:35px}
 .scene-art{height:415px}
 .scene-caption{padding:20px 0 10px;max-width:520px;min-height:235px}
 .scene-caption h3{font-size:42px}
 .scene-word{font-size:150px}
 .is-enhanced .story-stage{min-height:688px}
 .skill-deck-layout{display:block}
 .skill-picker{--disc:160px;grid-template-columns:none;grid-auto-columns:var(--disc);grid-auto-flow:column;grid-template-rows:repeat(2,var(--disc));overflow-x:auto}
 .skill-showcase{margin-top:16px}
 .example p{min-height:2.6em}
}
@media(min-width:761px){
 .hero{padding-top:120px;padding-bottom:42px}
 .hero-offer{margin-top:32px}
 .section-intro h2{font-size:clamp(86px,9vw,132px)}
 .section-intro{margin-bottom:40px}
 .story-counter{font-size:16px;padding-bottom:12px}
 .skills-intro h3{font-size:55px}
}
@media(min-width:1051px){
 .hero-title-stage{padding:108px 0 122px}
 .hero h1{font-size:clamp(84px,8vw,138px);max-width:min(74vw,1250px);line-height:1.03}
 .object-0{width:clamp(160px,15.2vw,254px);height:auto;aspect-ratio:1;left:-4.5vw;top:0}
 .object-1{width:clamp(166px,16vw,266px);height:auto;aspect-ratio:1;right:-4.8vw;top:70px}
 .object-2{width:clamp(95px,9vw,155px);height:auto;aspect-ratio:1;right:8vw;top:-22px}
 .object-3{width:clamp(87px,8vw,135px);height:auto;aspect-ratio:1;left:11vw;top:-13px}
 .object-4{width:clamp(126px,12.5vw,205px);height:auto;aspect-ratio:1;left:-3.5vw;bottom:22px}
 .object-5{width:clamp(106px,9.5vw,164px);height:auto;aspect-ratio:1;left:12vw;bottom:-24px}
 .object-6{width:clamp(112px,10.5vw,181px);height:auto;aspect-ratio:1;right:8vw;bottom:-12px}
 .hero-offer{margin-top:35px}
 .offer-line{font-size:16px}
 .story-scene{grid-template-columns:1.2fr 1fr;gap:38px;padding:0 44px 12px}
 .scene-art{height:565px}
 .is-enhanced .story-stage{min-height:577px}
 .scene-caption{padding-top:0;min-height:0}
 .scene-caption h3{font-size:clamp(40px,3.8vw,57px)}
 .scene-caption p{font-size:19px}
 .scene-word{font-size:clamp(168px,16vw,238px);bottom:5px}
 .profile-card{width:min(370px,90%);min-height:383px;padding:28px 31px 32px;border-radius:37px}
 .profile-hands{width:230px;height:199px}
 .profile-greeting{font-size:26px;margin-bottom:17px}
 .profile-field{font-size:18px;padding-top:13px;margin-top:13px}
 .profile-field b{width:28px;height:28px;font-size:17px}
 .choice-orbit{width:100%;max-width:475px;height:462px;transform:none}
 .choice-item:nth-child(1){width:235px;height:235px;top:10px;right:0}
 .choice-item:nth-child(2){width:208px;height:208px;top:163px;left:0}
 .choice-item:nth-child(3){width:190px;height:190px;top:265px;right:7px}
 .choice-item b{width:43px;height:43px;font-size:24px}
 .request-card{width:min(395px,95%);min-height:361px;padding:28px 26px;border-radius:36px}
 .request-card img{width:220px;height:181px}
 .request-card>span{font-size:17px}
 .request-card>strong{font-size:32px;margin-bottom:25px}
 .request-options{font-size:15px}
 .request-options span{padding:12px 10px}
 .skill-deck-layout{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:32px}
 .skill-picker{--disc:auto;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto auto;grid-auto-flow:row;grid-auto-columns:auto;gap:18px 13px;overflow:visible}
 .skill-tile{width:100%;height:auto;aspect-ratio:1;padding:12px 9px 16px;gap:4px}
 .skill-tile>img{width:52%;height:auto;aspect-ratio:1;max-height:105px}
 .skill-tile>span:last-child{font-size:14px;max-width:110px}
 .skill-showcase{border-radius:32px}
}
@media(max-width:370px){
 .hero h1{font-size:12.7vw;max-width:calc(100% - 32px)}
 .hero-title-stage{padding:116px 0 111px}
 .object-0{width:97px;height:97px}
 .object-1{width:105px;height:105px}
 .object-2{right:77px;width:62px;height:62px;top:15px}
 .object-3{left:73px;width:60px;height:60px}
 .object-4{width:86px;height:86px}
 .object-5{width:65px;height:65px;left:90px}
 .object-6{width:94px;height:94px}
 .section-intro h2{font-size:14vw}
 .scene-art{height:338px}
 .profile-card{min-height:275px;padding-inline:19px}
 .profile-hands{height:139px}
 .choice-item:nth-child(1){width:163px;height:163px}
 .choice-item:nth-child(2){width:145px;height:145px}
 .choice-item:nth-child(3){width:138px;height:138px;top:187px}
 .choice-orbit{height:325px}
 .scene-caption h3{font-size:30px}
 .scene-caption p{font-size:16px}
 .is-enhanced .story-stage{min-height:611px}
 .skill-picker{--disc:139px}
 .skill-tile>img{width:77px;height:77px}
 .skill-tile>span:last-child{font-size:13px}
}
