/* A warm TINTIN activity hub: product-led, playful, and easy to explore. */
.sahabat-hub-hero{position:relative;display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:4vw;min-height:790px;padding:170px var(--gutter) 70px;background:#ac2027;color:#fff3d8;overflow:hidden}
.sahabat-hub-hero:after{content:'';position:absolute;width:600px;height:600px;border:1px solid #f5d49226;border-radius:50%;right:-120px;top:80px;pointer-events:none}
.hub-hero-copy{position:relative;z-index:2;max-width:720px}
.hub-hero-copy>.eyebrow{font-size:10px;letter-spacing:.16em}
.hub-hero-copy h1{font-size:clamp(62px,6.6vw,112px);line-height:.98;letter-spacing:-.06em;margin:27px 0}
.hub-hero-copy h1 em{color:#f4cf72}
.hub-hero-copy>p{font-size:16px;max-width:405px;line-height:1.75;color:#f7e0cc}
.hub-hero-actions{display:flex;align-items:center;gap:25px;margin-top:30px;flex-wrap:wrap}
.hub-hero-actions .solid-action{background:#f4d276;color:#651b22;font-size:13px}
.hub-hero-actions>a:last-child{font-size:12px;border-bottom:1px solid #fff7;padding:8px 0}
.hub-preview{display:inline-block;font-size:9px;letter-spacing:.1em;margin-top:27px;opacity:.7}
.hub-hero-art{position:relative;z-index:1;height:540px;max-width:650px;width:100%;margin:auto}
.hub-hero-orbit{position:absolute;width:390px;height:390px;border:1px dashed #f9e4b85c;left:50%;top:49%;transform:translate(-50%,-50%);border-radius:50%}
.rasa-token{display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:50%;background:#f4d276;color:#9c2727;box-shadow:inset 0 0 0 9px #e8b85c,inset 0 0 0 11px #fff0b1,7px 12px 0 #741b2370;position:absolute;width:206px;height:206px;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-12deg);z-index:3}
.rasa-token svg{width:38px;height:38px;margin-bottom:9px}
.rasa-token strong{font:900 48px/1 var(--tintin-display);letter-spacing:-.04em}
.rasa-token small{font-size:8px;letter-spacing:.2em;margin-top:10px}
.hub-pack{position:absolute;filter:drop-shadow(0 13px 10px #4c141843)}
.hub-hero-art .hub-pack-0{height:290px;top:16px;left:9%;transform:rotate(-16deg)}
.hub-hero-art .hub-pack-1{height:175px;top:4%;right:9%;transform:rotate(15deg)}
.hub-hero-art .hub-pack-2{height:200px;bottom:20px;right:1%;transform:rotate(11deg)}
.hub-hero-art .hub-pack-3{height:190px;bottom:1%;left:24%;transform:rotate(-9deg)}
.hub-spark{position:absolute;width:44px;height:44px;color:#f4d276;top:7%;left:46%;transform:rotate(20deg)}
.hub-spark:last-child{top:auto;bottom:20%;left:5%;width:28px;height:28px}
.hub-quickbar{display:flex;align-items:center;justify-content:space-between;gap:30px;background:#fff9e9;border-bottom:1px solid var(--line);padding:20px var(--gutter)}
.hub-quickbar nav{display:flex;gap:30px;font-size:12px}
.hub-quickbar nav a{padding:7px 0}
.hub-quickbar nav a:hover{color:#ac2027}
.hub-balance{display:flex;align-items:center;gap:13px;font-size:12px;white-space:nowrap}
.mini-token{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#f4d276;color:#ac2027;border:1px solid #d9a54b}
.mini-token svg{width:16px;height:16px}
.hub-how{padding:65px var(--gutter) 70px;background:#f1e8d2;text-align:center}
.hub-how h2{font-size:clamp(38px,4.1vw,66px);margin:18px 0}
.hub-how>p{font-size:14px;color:#80564b}
.hub-how-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;max-width:1100px;margin:43px auto 0;text-align:left}
.hub-how-step{display:grid;grid-template-columns:47px 1fr;gap:17px;border-top:1px solid #571b2236;padding-top:22px}
.hub-how-step>span{width:43px;height:43px;display:grid;place-items:center;background:#ac2027;color:#fff3d8;border-radius:50%;font:400 24px var(--serif)}
.hub-how-step h3{font:400 28px/1.12 var(--serif);letter-spacing:-.04em;margin-bottom:9px}
.hub-how-step p{font-size:12px;color:#80564b;line-height:1.7}
.hub-daily{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:6vw;padding:80px var(--gutter);background:#e0e5d1;overflow:hidden}
.hub-daily-copy{max-width:560px}
.hub-daily h2{font-size:clamp(45px,5vw,82px);margin:22px 0;line-height:1.03}
.hub-daily h2 em{color:#316448}
.hub-daily-copy>p{font-size:15px;color:#5f6a55;max-width:400px;margin:20px 0 24px}
.hub-daily .form-feedback{color:#385b45;max-width:440px;min-height:45px}
.hub-daily-copy>.small-print{font-size:10px!important;max-width:410px;margin-top:14px;color:#64725a}
.wheel-stage{width:min(100%,420px);aspect-ratio:1;position:relative;justify-self:center;margin:15px}
.wheel-disc{position:absolute;inset:0;border-radius:50%;background:conic-gradient(#f2c765 0deg 60deg,#f9e8b0 60deg 120deg,#e5ad4d 120deg 180deg,#f9e8b0 180deg 240deg,#f2c765 240deg 300deg,#fbefc9 300deg 360deg);border:12px solid #fff4d2;box-shadow:0 0 0 2px #c69b50,0 18px 0 #385b4514;transition:transform 4s cubic-bezier(.12,.72,.12,1)}
.wheel-number{position:absolute;top:50%;left:50%;font:900 clamp(28px,3vw,43px)/1 var(--tintin-display);color:#973026;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-130px) rotate(calc(-1 * var(--angle)))}
.wheel-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:113px;height:113px;background:#ac2027;border:6px solid #fff4d2;border-radius:50%;color:#fff3d8;display:flex;align-items:center;justify-content:center;flex-direction:column;box-shadow:0 4px 12px #4c14182b}
.wheel-center svg{width:25px;height:25px;margin-bottom:5px}
.wheel-center span{font:900 25px/1 var(--tintin-display)}
.wheel-pointer{position:absolute;top:-10px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:17px solid transparent;border-right:17px solid transparent;border-top:38px solid #ac2027;z-index:3;filter:drop-shadow(0 3px 1px #671a1830)}
.hub-activities{padding:80px var(--gutter);background:#f9f6e6}
.hub-title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;margin-bottom:35px}
.hub-title-row h2{font-size:clamp(43px,4.5vw,76px);margin-top:18px}
.hub-title-row>p{font-size:13px;color:#80564b;max-width:340px}
.mission-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:23px}
.mission{background:#f0e5cc;display:flex;flex-direction:column;min-width:0}
.mission:nth-child(2){background:#e1e5d2}
.mission:nth-child(3){background:#efd8b7}
.mission:nth-child(4){background:#ebd6c9}
.mission-art{position:relative;aspect-ratio:1.45;overflow:hidden;display:grid;place-items:center}
.mission-art>img{width:120%;max-width:none;height:100%;object-fit:contain;object-position:center bottom}
.mission-badge{position:absolute;z-index:2;top:15px;left:15px;font-size:9px;letter-spacing:.06em;line-height:1.3;background:#fff7e6;padding:8px 11px;border-radius:20px;color:#8b2f2b}
.mission-copy{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1}
.mission-copy>.eyebrow{font-size:8px;letter-spacing:.12em}
.mission-copy h3{font:400 clamp(28px,2.3vw,40px)/1.05 var(--serif);letter-spacing:-.045em;margin:16px 0 12px}
.mission-copy>p{font-size:12px;color:#80564b;margin-bottom:20px;line-height:1.65}
.mission-copy .text-link{margin-top:auto;font-size:11px;align-self:flex-start;gap:10px;line-height:1.5}
.mission-status{font-size:10px!important;min-height:17px;margin-top:14px;margin-bottom:0!important}
.hub-rewards{padding:75px var(--gutter) 85px;background:#ac2027;color:#fff3d8}
.hub-rewards .hub-title-row>p{color:#f2d4bf}
.reward-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.reward-tile{min-width:0;color:#571b22;display:flex;flex-direction:column;background:#f4ead1}
.reward-art{position:relative;height:290px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#ead7b5}
.reward-tile:nth-child(2) .reward-art{background:#dfdfc7}
.reward-tile:nth-child(3) .reward-art{background:#f0d4a4}
.reward-art>.hub-pack{position:relative;left:auto;top:auto;right:auto;bottom:auto;height:210px;filter:drop-shadow(0 12px 7px #571b221c);transform:rotate(-8deg);margin:0 14px}
.reward-art>.hub-pack-1{height:175px;transform:rotate(9deg)}
.reward-art>img{width:120%;max-width:none;height:100%;object-fit:contain}
.reward-tag{position:absolute;z-index:2;top:18px;left:18px;padding:8px 11px;background:#fff7e6;font-size:8px;letter-spacing:.1em;border-radius:20px}
.reward-copy{padding:26px;display:flex;flex-direction:column;align-items:flex-start;flex:1}
.reward-copy h3{font:400 35px/1.07 var(--serif);letter-spacing:-.04em;margin-bottom:14px}
.reward-copy p{font-size:13px;line-height:1.65;color:#80564b;margin-bottom:24px}
.reward-copy .text-link{font-size:12px;margin-top:auto}
.rewards-note{font-size:11px;color:#f2d4bf;margin-top:25px;max-width:820px;line-height:1.7}
.hub-member.member-section{background:#f4efdc;padding-top:85px;padding-bottom:85px}
.hub-hunt{padding:70px var(--gutter);display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:center;background:#e0e5d1}
.hub-hunt h2{font-size:clamp(40px,4vw,68px);margin:20px 0}
.hub-hunt-copy>p{font-size:14px;color:#64725a;max-width:420px;margin-bottom:22px}
.hub-hunt-art>img{width:112%;max-width:none;transform:translateX(-4%)}
.hub-hunt .hunt-map a{background:#f8f1d8;border-color:#6c806d;color:#385b45}
.hub-hunt .hunt-map a[data-found=true]{background:#316448;color:#fff3d8}
.hub-hunt .hunt-count{font-size:11px;color:#385b45}
.hub-brandline{display:flex;justify-content:center;align-items:center;gap:5vw;padding:30px var(--gutter);background:#f4efdc;border-top:1px solid var(--line)}
.hub-brandline img{width:120px;max-height:70px;object-fit:contain}
.hub-reward-dialog{padding:0;width:min(750px,calc(100% - 32px));border:0;background:#f5eed8;color:#571b22;max-height:90svh;overflow:auto}
.hub-reward-dialog::backdrop{background:#28100fb3;backdrop-filter:blur(6px)}
.hub-reward-dialog>img{width:100%;height:280px;object-fit:contain;background:#e7dfc2}
.hub-reward-dialog-copy{padding:32px 40px 40px}
.hub-reward-dialog-copy h2{font-size:46px;margin:20px 0}
.hub-reward-dialog-copy p{font-size:14px;color:#80564b;line-height:1.75;margin-bottom:20px}
.hub-reward-dialog-copy>.small-print{padding-top:18px;border-top:1px solid var(--line)}
.hub-purchase-dialog h2{font-size:41px;margin:20px 0}
.hub-purchase-dialog>p{font-size:13px;color:#80564b}
@media(max-width:1200px){.mission-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.mission{display:grid;grid-template-columns:42fr 58fr}.mission-art{height:100%;min-height:270px;aspect-ratio:auto}.mission-art>img{width:170%;max-width:none}.mission-copy{padding:25px 22px}.mission-copy h3{font-size:34px}.hub-hero-art .hub-pack-0{height:250px;left:4%}.hub-hero-art .hub-pack-2{height:180px;right:-2%}.hub-hero-orbit{width:330px;height:330px}.rasa-token{width:180px;height:180px}.rasa-token strong{font-size:41px}.reward-art{height:250px}.reward-art>.hub-pack{height:180px;margin:0 10px}.reward-art>.hub-pack-1{height:150px}.reward-copy h3{font-size:31px}.wheel-stage{max-width:370px}.wheel-number{transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-113px) rotate(calc(-1 * var(--angle)))}}
@media(max-width:850px){.sahabat-hub-hero{padding-top:150px;grid-template-columns:1fr;gap:15px;min-height:0}.hub-hero-copy{max-width:640px}.hub-hero-copy h1{font-size:clamp(66px,10vw,90px)}.hub-hero-art{height:470px;max-width:520px}.hub-hero-art .hub-pack-0{height:260px;left:11%}.hub-hero-art .hub-pack-1{height:160px;right:11%}.hub-hero-art .hub-pack-2{height:185px;right:3%}.hub-hero-art .hub-pack-3{height:170px;left:25%}.hub-quickbar{flex-direction:column;align-items:stretch;gap:13px}.hub-quickbar nav{justify-content:space-between;gap:15px;font-size:11px}.hub-balance{justify-content:center;border-top:1px solid var(--line);padding-top:13px}.hub-how-steps{gap:25px}.hub-how-step{grid-template-columns:1fr}.hub-how-step h3{font-size:25px}.hub-daily{gap:20px}.hub-daily h2{font-size:50px}.wheel-stage{max-width:310px;margin:10px}.wheel-number{font-size:30px;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-92px) rotate(calc(-1 * var(--angle)))}.wheel-center{width:95px;height:95px}.reward-grid{gap:18px}.reward-art{height:215px}.reward-art>.hub-pack{height:145px;margin:0 8px}.reward-art>.hub-pack-1{height:125px}.reward-copy{padding:22px}.reward-copy h3{font-size:27px}.reward-copy p{font-size:12px}.hub-hunt{gap:20px}.hub-hunt h2{font-size:48px}.hub-brandline img{width:95px}}
@media(max-width:650px){.mission{display:flex}.mission-art{min-height:0;aspect-ratio:1.4}.mission-art>img{width:125%}.mission-copy{padding:22px}.mission-copy h3{font-size:32px}.reward-grid{grid-template-columns:1fr;gap:25px}.reward-tile{display:grid;grid-template-columns:42fr 58fr}.reward-art{height:100%;min-height:270px;display:flex;flex-direction:column}.reward-art>.hub-pack{height:145px;margin:13px 0 0}.reward-art>.hub-pack-1{position:absolute;height:130px;right:10px;bottom:17px;transform:rotate(12deg)}.reward-tile:nth-child(2) .reward-art>.hub-pack-1{right:25px}.reward-copy h3{font-size:30px}.reward-copy p{font-size:12px}.reward-art>img{width:180%}.reward-tag{font-size:7px;top:13px;left:11px;padding:6px 8px}.hub-daily{grid-template-columns:1fr;padding-top:60px;padding-bottom:60px;gap:30px}.hub-daily-copy{max-width:100%}.hub-daily h2{font-size:clamp(43px,8vw,60px)}.wheel-stage{width:310px;max-width:88vw;margin:12px}.hub-daily .form-feedback{min-height:0}.hub-title-row{display:block}.hub-title-row>p{margin-top:22px}.hub-hunt{grid-template-columns:1fr}.hub-hunt-art{max-width:500px;margin:auto}.hub-how-steps{grid-template-columns:1fr;gap:27px;text-align:left;margin-top:30px}.hub-how-step{grid-template-columns:43px 1fr}.hub-how-step h3{font-size:27px}.hub-how-step p{max-width:440px}}
@media(max-width:560px){.sahabat-hub-hero{padding:135px var(--gutter) 30px;gap:10px}.hub-hero-copy>.eyebrow{font-size:8px;letter-spacing:.12em}.hub-hero-copy h1{font-size:clamp(53px,13vw,73px);margin:25px 0}.hub-hero-copy>p{font-size:14px;max-width:360px}.hub-hero-actions{gap:20px}.hub-hero-actions .solid-action{font-size:11px}.hub-hero-actions>a:last-child{font-size:11px}.hub-preview{font-size:8px;margin-top:24px}.hub-hero-art{height:360px;width:100%;max-width:390px}.hub-hero-orbit{width:260px;height:260px}.rasa-token{width:145px;height:145px;box-shadow:inset 0 0 0 6px #e8b85c,inset 0 0 0 8px #fff0b1,5px 8px 0 #741b2370}.rasa-token svg{width:27px;height:27px;margin-bottom:7px}.rasa-token strong{font-size:33px}.rasa-token small{font-size:6px;margin-top:7px}.hub-hero-art .hub-pack-0{height:195px;left:7%;top:5px}.hub-hero-art .hub-pack-1{height:130px;top:1%;right:6%}.hub-hero-art .hub-pack-2{height:145px;bottom:20px;right:0}.hub-hero-art .hub-pack-3{height:135px;bottom:2%;left:23%}.hub-spark{width:25px;height:25px;left:47%;top:2%}.hub-spark:last-child{width:20px;height:20px;left:1%;bottom:19%}.hub-quickbar{padding-top:17px;padding-bottom:17px}.hub-quickbar nav{gap:13px;font-size:10px;overflow:auto;white-space:nowrap}.hub-balance{font-size:10px;gap:8px}.mini-token{width:24px;height:24px}.hub-how{padding-top:50px;padding-bottom:50px}.hub-how h2{font-size:39px}.hub-how>p{font-size:13px}.hub-daily{padding-top:50px;padding-bottom:50px}.hub-daily h2{font-size:43px}.hub-daily-copy>p{font-size:14px}.hub-activities,.hub-rewards{padding-top:55px;padding-bottom:55px}.hub-title-row h2{font-size:42px}.hub-title-row>p{font-size:13px}.mission-grid{gap:18px 14px}.mission-copy{padding:20px 16px}.mission-copy>.eyebrow{font-size:7px;letter-spacing:.07em}.mission-copy h3{font-size:29px;margin:13px 0}.mission-copy>p{font-size:11px}.mission-copy .text-link{font-size:10px}.mission-badge{font-size:7px;padding:6px 8px;left:10px;top:10px}.mission-status{font-size:9px!important}.reward-art{min-height:260px}.reward-copy{padding:23px 20px}.reward-copy h3{font-size:29px}.reward-copy .text-link{font-size:11px}.rewards-note{font-size:10px}.hub-member.member-section{padding-top:55px;padding-bottom:55px}.hub-hunt{padding-top:50px;padding-bottom:30px}.hub-hunt h2{font-size:43px}.hub-hunt-copy>p{font-size:13px}.hub-brandline{gap:6vw;padding-top:24px;padding-bottom:24px;flex-wrap:wrap}.hub-brandline img{width:63px;max-height:45px}.hub-reward-dialog>img{height:210px}.hub-reward-dialog-copy{padding:25px}.hub-reward-dialog-copy h2{font-size:37px}.hub-purchase-dialog h2{font-size:35px}}
@media(max-width:360px){.hub-hero-copy h1{font-size:50px}.hub-hero-art{height:320px}.hub-hero-art .hub-pack-0{height:170px;left:3%}.hub-hero-art .hub-pack-1{height:110px;right:3%}.hub-hero-art .hub-pack-2{height:130px;right:-1%}.hub-hero-art .hub-pack-3{height:120px}.hub-hero-orbit{width:220px;height:220px}.rasa-token{width:126px;height:126px}.rasa-token strong{font-size:29px}.rasa-token svg{width:23px;height:23px}.hub-balance{flex-wrap:wrap}.mission-grid{grid-template-columns:1fr}.mission{display:grid;grid-template-columns:40fr 60fr}.mission-art{height:100%;aspect-ratio:auto}.mission-art>img{width:180%;height:100%}.mission-copy h3{font-size:29px}.reward-tile{grid-template-columns:1fr}.reward-art{min-height:210px;flex-direction:row}.reward-art>.hub-pack{height:160px;margin:15px}.reward-art>.hub-pack-1{position:relative;right:auto!important;bottom:auto;height:135px}.reward-art>img{width:120%}.wheel-stage{max-width:84vw;width:280px}.wheel-number{transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-82px) rotate(calc(-1 * var(--angle)))}}
@media(prefers-reduced-motion:reduce){.wheel-disc{transition:none}.hub-pack,.hub-hunt-art>img{transform:none!important}}