/* Final visual layer: preserve the original layout and blue/gold identity. */
.button { align-items: center; justify-content: center; }
.button-arrow { display: block; width: 18px; height: 18px; flex: 0 0 18px; align-self: center; }
/* Original filled hero typography; retain the entrance animation. */
.hero-title-entry { display: block; transform-origin: left center; animation: hero-title-arrive 1.1s .12s cubic-bezier(.16,.8,.25,1) both; }
@keyframes hero-title-arrive { from { opacity: 0; transform: translate3d(-24px,20px,0) scale(.94); } to { opacity: 1; transform: translate3d(0,0,0) scale(1); } }
.button > span[aria-hidden] { font-family: Arial,sans-serif; font-style: normal; transform: none; }
:root { --gold: #ffca00; }
.button:not(.outline) { background: #ffca00; color: #04102a; border-color: #ffca00; }
.marquee { background: #ffca00; border-color: #ffca00; }
.marquee { position: relative; isolation: isolate; background: linear-gradient(100deg,#eda900,#ffcf00 45%,#ffb900); }
.marquee::before { content: ''; position: absolute; z-index: -1; pointer-events: none; inset: -80px 0; background: radial-gradient(ellipse 180px 110px at center,#fff7bb 0%,#ffe557b3 35%,transparent 75%); animation: ribbon-glow-pass 9s ease-in-out infinite; }
.marquee .marquee-group { font-family: 'DM Sans',Arial,sans-serif; font-weight: 700; font-size: 17px; letter-spacing: .8px; line-height: 1.5; }
@keyframes ribbon-glow-pass { 0%,100% { transform: translate3d(-65%,0,0); } 50% { transform: translate3d(65%,0,0); } }
h2 em { color: #ffca00; background: none; filter: none; }
body { background: radial-gradient(ellipse at 78% 3%, #14346540, transparent 23%), var(--bg); }
.hero { background: radial-gradient(ellipse at 75% 30%, #17396655, transparent 60%), linear-gradient(120deg, #020714, #06122a); }
.mobile-section { background: radial-gradient(ellipse at 75% 40%, #173d6b55, transparent 62%), #030c1d; }
.responsible-section, footer { background-color: #020713; }
.withdrawal { background: radial-gradient(ellipse at 15% 50%, #17396950, transparent 60%), #061126; }
/* Only compositor-friendly properties change during entrances. */
.reveal { transition: opacity .65s ease, transform .75s cubic-bezier(.2,.7,.2,1); transition-delay: var(--reveal-delay, 0ms); }
.reveal.pending { opacity: 0; transform: translate3d(0, 42px, 0); }
h2.reveal.pending, .section-heading .reveal.pending { transform: translate3d(0, 48px, 0); }
.reveal:focus-within { opacity: 1; transform: none; transition-delay: 0ms; }
/* Keep the gold finish static instead of continuously repainting gradients. */
h2 em, .recharge-button { animation: none; }
.condition-icon { display: block; margin-bottom: 12px; }
.condition-icon svg { width: 25px; height: 25px; display: block; }
.conditions-row > div { padding-block: 12px; background: linear-gradient(100deg, #11234270, transparent); border-radius: 0 12px 12px 0; }
@keyframes withdrawal-float { 0%, 100% { transform: translate3d(0,0,0); } 50% { transform: translate3d(3px,-9px,0); } }
.motion-offscreen *, .motion-offscreen::before, .motion-offscreen::after,
.motion-offscreen *::before, .motion-offscreen *::after,
.page-hidden *, .page-hidden *::before, .page-hidden *::after { animation-play-state: paused !important; }
@media (max-width: 900px) and (min-width: 601px) {
  .withdrawal { grid-template-columns: minmax(190px,.65fr) minmax(0,1.35fr); }
  .withdrawal-float { width: 44px; height: 44px; border-radius: 14px; }
}
@media (max-width: 600px) {
  .withdrawal-art { width: min(100%, 300px); margin-inline: auto; min-height: 265px; }
  .withdrawal-orbit { width: min(100%, 255px); }
  .withdrawal-float { width: 46px; height: 46px; border-radius: 14px; }
  .withdrawal-float svg { width: 24px; height: 24px; }
  .withdrawal-art .seal { bottom: 20px; right: 7%; }
  .reveal { transition-delay: var(--reveal-delay, 0ms); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal.pending { opacity: 1; transform: none; }
  .pointer-glow { display: none; }
}

/* Reference-inspired withdrawal banner. Layers keep the chips behind the copy. */
.withdrawal-banner { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 1.15fr 1fr; gap: 38px; padding: clamp(28px,4.5vw,68px); border: 1px solid #ffca00; border-radius: 32px; background: linear-gradient(115deg,#1b39ad,#0c1650); }
.withdrawal-copy, .withdrawal-wordmark { position: relative; z-index: 1; min-width: 0; }
.withdrawal-banner .withdrawal-copy h2 { font-family: 'Anton',Impact,'Arial Narrow',sans-serif; font-size: clamp(38px,4.5vw,68px); font-weight: 400; line-height: 1.08; letter-spacing: -.6px; margin: 0 0 22px; color: #f8f8ff; }
.withdrawal-banner .withdrawal-copy > p { font-size: 16px; line-height: 1.65; color: #e6ebff; max-width: 560px; }
.withdrawal-banner .withdrawal-copy .fine-print { font-size: 12px; color: #bdcdf5; line-height: 1.6; margin-top: 22px; }
.withdrawal-banner .withdrawal-cta { background: #030a23; border: 2px solid #ffca00; color: #ffca00; border-radius: 999px; font-size: 15px; padding: 20px 26px; margin-top: 12px; box-shadow: none; }
.withdrawal-cta:hover { background: #ffca00 !important; color: #030a23 !important; }
.withdrawal-wordmark { display: grid; align-items: center; text-align: center; padding: 24px 8px; }
.withdrawal-pulse { animation: withdrawal-pulse 2.8s ease-in-out infinite; transform-origin: center; }
.withdrawal-pulse strong { display: block; font: 400 clamp(70px,7.5vw,112px)/1 'Anton',Impact,sans-serif; letter-spacing: -2px; color: #ffca00; }
.withdrawal-pulse > span { display: block; font: 400 clamp(24px,2.6vw,39px)/1.2 'Anton',Impact,sans-serif; color: #fff; }
.chip-rain { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; container-type: size; }
.falling-chip { position: absolute; top: 0; left: var(--x); width: var(--size); height: var(--size); display: grid; place-items: center; border-radius: 50%; border: 5px dashed currentColor; background: #2850c6; color: #a5b9ff; opacity: .28; animation: chip-fall var(--duration) var(--delay) linear infinite; }
.falling-chip b { display: grid; place-items: center; width: 75%; height: 75%; border: 1px dashed currentColor; border-radius: 50%; font: 700 18px 'Barlow Condensed',sans-serif; }
.chip-tone-1 { background: #be8c00; color: #ffca00; opacity: .4; }
.chip-tone-2 { background: #a5296a; color: #ec8cbc; }
@keyframes withdrawal-pulse { 0%,100% { transform: scale(.96); } 50% { transform: scale(1.035); } }
@keyframes chip-fall { from { transform: translate3d(-15px,-90px,0) rotate(-25deg); } to { transform: translate3d(20px,calc(100cqh + 90px),0) rotate(335deg); } }
@media (max-width: 900px) {
  .withdrawal-banner { grid-template-columns: 1fr; gap: 28px; padding: 36px; }
  .withdrawal-banner .withdrawal-copy h2 { font-size: clamp(35px,7vw,62px); }
  .withdrawal-wordmark { padding-block: 22px; }
  .withdrawal-pulse strong { font-size: clamp(70px,14vw,110px); }
  .withdrawal-pulse > span { font-size: clamp(26px,4.7vw,38px); }
}
@media (max-width: 600px) {
  .withdrawal-banner { padding: 30px 22px; border-radius: 24px; gap: 16px; }
  .withdrawal-banner .withdrawal-copy h2 { font-size: clamp(29px,8vw,46px); }
  .withdrawal-banner .withdrawal-copy > p { font-size: 14px; }
  .withdrawal-banner .withdrawal-cta { width: 100%; font-size: 12px; padding: 18px 12px; gap: 10px; }
  .withdrawal-pulse strong { font-size: clamp(58px,17vw,90px); letter-spacing: -1px; }
  .withdrawal-pulse > span { font-size: clamp(22px,6vw,32px); }
}
@media (prefers-reduced-motion: reduce) {
  .withdrawal-pulse { transform: none; }
  .falling-chip { top: var(--rest); transform: rotate(-15deg); }
}

/* Responsible play: compact badge, single heading and readable guidance. */
.responsible-section { padding-block: clamp(65px,8vw,120px); background: #050b22; }
.responsible-layout { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }
.responsible-layout .age-emblem { width: 64px; height: 64px; border: 2px solid #ffca00; box-shadow: none; font: 400 26px/1 'Anton',Impact,sans-serif; flex-shrink: 0; }
.responsible-copy { width: 100%; min-width: 0; }
.responsible-layout h2 { font: 400 clamp(32px,4.5vw,66px)/1.18 'Anton',Impact,sans-serif; letter-spacing: -.5px; margin: 0 0 28px; color: #f5f5ff; overflow-wrap: anywhere; }
.responsible-list { margin: 0; padding-left: 22px; color: #acbde2; font-size: 18px; line-height: 1.65; }
.responsible-list li { padding-left: 2px; margin-block: 8px; }
.responsible-layout .responsible-copy > p { max-width: 690px; font-size: 18px; line-height: 1.7; color: #acbde2; margin: 26px 0 0; }
@media (max-width:600px) {
  .responsible-list, .responsible-layout .responsible-copy > p { font-size: 16px; }
  .marquee .marquee-group { font-size: 14px; letter-spacing: .4px; }

}

/* One shared contact card with two clearly separated channel actions. */
.contact-heading { text-align: center; margin-bottom: 40px; }
.contact-heading h2 { font: 400 clamp(54px,9vw,120px)/1.2 'Anton',Impact,sans-serif; color: #ffca00; margin: 0 0 18px; letter-spacing: -1px; }
.contact-title-motion { display: inline-block; animation: contact-title-pulse 3.8s ease-in-out infinite; text-shadow: 0 0 32px #ffca0026; }
.contact-heading p { font-size: 16px; line-height: 1.7; color: var(--muted); margin: 0; }
.contact-hub { position: relative; overflow: hidden; border: 1px solid #ffca0090; border-radius: 28px; padding: 36px; background: radial-gradient(ellipse at 0 0,#214cc174,transparent 65%),linear-gradient(125deg,#0d2045,#060f26); box-shadow: 0 18px 60px #0004,0 0 32px #ffca000a; }
.contact-hub-intro { display: flex; align-items: center; gap: 16px; padding-bottom: 28px; }
.contact-hub-star { color: #ffca00; font-size: 40px; }
.contact-hub-intro div > span { font-size: 10px; font-weight: 700; letter-spacing: 2px; color: #ffca00; }
.contact-hub-intro p { margin: 5px 0 0; font-size: 20px; color: #f8f7f2; }
.contact-channels { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #ffffff20; }
.channel { display: flex; align-items: center; gap: 18px; min-width: 0; padding: 30px 24px 12px 0; transition: background .25s; }
.channel + .channel { padding-left: 30px; padding-right: 0; border-left: 1px solid #ffffff20; }
.channel-icon { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 19px; flex-shrink: 0; color: #032319; background: #38e892; box-shadow: 0 0 24px #38e89230; }
.channel-icon svg { width: 37px; height: 37px; }
.channel-facebook-icon { background: #2676ff; color: white; font: bold 48px/1 Arial,sans-serif; box-shadow: 0 0 24px #2676ff40; }
.channel-copy { display: grid; gap: 6px; min-width: 0; }
.channel-copy small { font-size: 9px; letter-spacing: 1.5px; color: #b3c7e9; }
.channel-copy strong { font: 700 clamp(24px,3vw,38px)/1.2 'Barlow Condensed',Arial,sans-serif; color: #fff; }
.channel-copy > span { font-size: 13px; color: #b3c7e9; }
.channel-go { margin-left: auto; display: grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; border: 1px solid #ffca0070; color: #ffca00; border-radius: 50%; transition: color .25s,background .25s; }
.channel:hover .channel-go,.channel:focus-visible .channel-go { background: #ffca00; color: #061126; }
.channel:focus-visible { outline: 2px solid #ffca00; outline-offset: 5px; border-radius: 8px; }
@keyframes contact-title-pulse { 0%,100% { transform: translate3d(0,0,0) scale(.98); } 50% { transform: translate3d(0,-5px,0) scale(1.02); } }
@media (max-width: 750px) {
  .contact-hub { padding: 26px; }
  .contact-channels { grid-template-columns: 1fr; }
  .channel, .channel + .channel { padding: 24px 0; border-left: 0; }
  .channel + .channel { border-top: 1px solid #ffffff20; padding-bottom: 0; }
}
@media (max-width: 400px) {
  .contact-hub { padding: 20px; }
  .channel { gap: 12px; }
  .channel-icon { width: 48px; height: 48px; border-radius: 14px; }
  .channel-icon svg { width: 29px; height: 29px; }
  .channel-facebook-icon { font-size: 36px; }
  .channel-go { width: 30px; height: 30px; }
  .channel-copy > span { font-size: 11px; }
  .channel-copy small { font-size: 8px; letter-spacing: .7px; }
}