/* /topup/ v2: full-width premium checkout. This page only (body.topup2); the rest of the site is unchanged. */
:root{--t2-gold:#e9c272;--t2-hi:#fff0c4;--t2-lo:#8a5f18;--t2-ink:#05101e;--t2-line:rgba(233,194,114,.35);--t2-text:#dfe7f3;--t2-mut:#93a4bd}
body.topup2 .portal-grid{display:block!important;max-width:1320px}
body.topup2 .left-rail,body.topup2 .right-rail{display:none!important}
body.topup2 .realm-body.t2-body{width:100%;max-width:none;background:none;border:0;box-shadow:none;padding:0}
body.topup2 .realm-body.t2-body:before,body.topup2 .realm-body.t2-body:after{display:none}
.t2{color:var(--t2-text);font-family:Inter,sans-serif}
.t2 h2,.t2 h3{font-family:Cinzel,serif;margin:0}
/* Hero */
.t2-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:center;padding:44px 48px;border-radius:16px;
 border:1px solid rgba(233,194,114,.55);
 background:radial-gradient(70% 120% at 85% 40%,rgba(233,194,114,.22),transparent 60%),radial-gradient(60% 90% at 0% 0%,rgba(29,120,200,.18),transparent 60%),linear-gradient(135deg,#0a1a30 0%,#060f1d 55%,#120c04 100%);
 box-shadow:0 0 0 1px rgba(0,0,0,.6) inset,0 30px 60px rgba(0,0,0,.55),0 0 60px rgba(233,194,114,.12)}
.t2-hero:before{content:'';position:absolute;inset:0;background:url(/assets/perf101-classic-hero-1440.webp) center 30%/cover no-repeat;opacity:.16;mix-blend-mode:screen;pointer-events:none}
.t2-hero:after{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#ffe3a1,transparent)}
.t2-hero-copy{position:relative;z-index:1}
.t2-chip{display:inline-block;padding:6px 14px;border-radius:99px;font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#1d1405;
 background:linear-gradient(180deg,#ffe3a1,#c8963c);box-shadow:0 0 20px rgba(233,194,114,.35)}
.t2 .t2-hero h2#t2-title{margin:16px 0 10px!important;font-size:clamp(2.2rem,4.4vw,3.6rem)!important;letter-spacing:.01em;line-height:1.05;background:linear-gradient(180deg,#fffaf0 0%,#f3d48a 55%,#c08a32 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.t2-lead{margin:0 0 22px;max-width:52ch;color:#c9d4e4;font-size:1.05rem;line-height:1.6}
.t2-rate{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;font-family:Cinzel,serif}
.t2-rate span{font-size:2rem;color:#fff}.t2-rate b{font-size:1.6rem;color:var(--t2-gold)}
.t2-rate strong{font-size:clamp(3.2rem,7vw,5.2rem);line-height:.9;background:linear-gradient(180deg,#fff3cf,#e9c272 55%,#a8782a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 18px rgba(233,194,114,.35))}
.t2-rate em{font-style:normal;font-size:1.3rem;color:var(--t2-gold);letter-spacing:.1em;text-transform:uppercase}
.t2-offer{margin:12px 0 0;color:var(--t2-mut)}
.t2-count{display:flex;gap:10px;margin-top:18px}
.t2-count div{min-width:70px;padding:10px 8px;text-align:center;border-radius:10px;background:rgba(0,0,0,.35);border:1px solid var(--t2-line)}
.t2-count b{display:block;font:700 1.6rem/1 'Barlow Condensed',Inter,sans-serif;color:#fff3cf}
.t2-count small{color:var(--t2-mut);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}
.t2-hero-art{position:relative;z-index:1;display:grid;place-items:center;min-height:250px}
.t2-medal{width:min(100%,270px);height:auto;filter:drop-shadow(0 18px 40px rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(233,194,114,.35));animation:t2-float 6s ease-in-out infinite}
.t2-crest{position:absolute;width:92px;height:auto;right:6%;bottom:4%;opacity:.9;filter:drop-shadow(0 6px 12px #000)}
@keyframes t2-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
/* Trust strip */
.t2-trust{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.t2-trust li{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:12px;background:linear-gradient(180deg,rgba(14,28,48,.92),rgba(6,14,28,.92));border:1px solid rgba(150,175,210,.18);box-shadow:0 10px 24px rgba(0,0,0,.35)}
.t2-trust b{flex:0 0 36px;height:36px;display:grid;place-items:center;border-radius:50%;color:#1d1405;font-size:1rem;background:linear-gradient(180deg,#ffe3a1,#c8963c)}
.t2-trust strong{display:block;color:#fff3cf;margin-bottom:3px;font-size:.92rem}
.t2-trust span{font-size:.82rem;line-height:1.45;color:var(--t2-mut)}
.t2 .t2-who{margin:20px 2px 0!important;color:var(--t2-mut)}.t2-who a{color:var(--t2-hi)}.t2-who strong{color:#fff}
/* Steps */
.t2-step{margin-top:30px}
.t2-step h3{display:flex;align-items:center;gap:12px;font-size:1.35rem;color:#fff3cf;margin-bottom:14px}
.t2-step h3 span{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;font:800 .95rem Inter,sans-serif;color:#1d1405;background:linear-gradient(180deg,#ffe3a1,#c8963c);box-shadow:0 0 16px rgba(233,194,114,.35)}
.t2-packs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.t2-pack{all:unset;box-sizing:border-box;cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:22px 14px 18px;border-radius:14px;
 background:linear-gradient(180deg,#12233c 0%,#081325 70%,#0b0904 100%);border:1px solid rgba(233,194,114,.28);box-shadow:0 14px 30px rgba(0,0,0,.45);transition:transform .18s,box-shadow .18s,border-color .18s}
.t2-pack:before{content:'';position:absolute;left:18px;right:18px;top:0;height:2px;background:linear-gradient(90deg,transparent,rgba(255,227,161,.8),transparent)}
.t2-tier{font-size:.7rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--t2-gold)}
.t2-coins{width:100%;max-width:170px;height:110px;margin:4px 0}
.t2-amt{font:700 1.65rem/1.05 Cinzel,serif;background:linear-gradient(180deg,#fff3cf,#e9c272 60%,#b8862f);-webkit-background-clip:text;background-clip:text;color:transparent}
.t2-amt small{display:block;font:700 .7rem Inter,sans-serif;letter-spacing:.16em;color:var(--t2-mut);-webkit-text-fill-color:var(--t2-mut)}
.t2-price{margin-top:6px;padding:6px 16px;border-radius:99px;font-weight:800;color:#fff;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
@media (hover:hover){.t2-pack:hover{transform:translateY(-5px);border-color:rgba(233,194,114,.7);box-shadow:0 22px 44px rgba(0,0,0,.55),0 0 30px rgba(233,194,114,.2)}}
.t2-pack[aria-pressed="true"]{border-color:#f1cf86;background:linear-gradient(180deg,#3a2c0e 0%,#140f05 75%);box-shadow:0 0 0 2px rgba(241,207,134,.75) inset,0 22px 44px rgba(0,0,0,.55),0 0 40px rgba(233,194,114,.3)}
.t2-pack[aria-pressed="true"] .t2-price{color:#1d1405;background:linear-gradient(180deg,#ffe3a1,#c8963c);border-color:#ffe7ae}
.t2-pack:focus-visible,.t2-method:focus-visible,.t2-cta:focus-visible,.t2-btn:focus-visible{outline:2px solid #fff3cf;outline-offset:3px}
.t2-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.t2-method{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;padding:18px 20px;border-radius:14px;
 background:linear-gradient(180deg,#10203a,#081325);border:1px solid rgba(150,175,210,.25);box-shadow:0 12px 26px rgba(0,0,0,.4);transition:border-color .18s,box-shadow .18s,transform .18s}
.t2-method b{color:#fff;font-size:1.1rem}.t2-method small{grid-column:2;color:var(--t2-mut)}
.t2-logo{grid-row:1/3;width:54px;height:54px;display:grid;place-items:center;border-radius:14px;font:900 1.6rem Inter,sans-serif;font-style:normal}
.t2-pp{color:#fff;background:linear-gradient(135deg,#1f7ae0,#003087)}.t2-usdt{color:#fff;background:linear-gradient(135deg,#2bd3a7,#0f8a6b)}
@media (hover:hover){.t2-method:hover{transform:translateY(-2px);border-color:rgba(233,194,114,.6)}}
.t2-method[aria-pressed="true"]{border-color:#f1cf86;box-shadow:0 0 0 2px rgba(241,207,134,.7) inset,0 0 30px rgba(233,194,114,.22)}
.t2-summary{position:relative;margin-top:26px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px 16px 24px;border-radius:14px;
 background:linear-gradient(90deg,rgba(26,20,6,.96),rgba(8,16,30,.96));border:1px solid rgba(233,194,114,.55);box-shadow:0 18px 40px rgba(0,0,0,.6),0 0 30px rgba(233,194,114,.15);backdrop-filter:blur(6px)}
.t2-summary-text{color:#dfe7f3;font-size:1rem}.t2-summary-text strong{color:#fff3cf}
.t2-cta,.t2-btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 30px;border-radius:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:.9rem;
 color:#1d1405;background:linear-gradient(180deg,#ffe8b0,#e9bd62 50%,#b88531);border:1px solid #ffe7ae;box-shadow:0 0 0 1px #5a3d0e inset,0 10px 24px rgba(216,162,65,.35)}
.t2-cta[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.t2-btn.ghost{color:#fff3cf;background:rgba(0,0,0,.35);border-color:rgba(233,194,114,.5);box-shadow:none;min-height:40px;padding:0 16px;font-size:.78rem}
@media (hover:hover){.t2-cta:not([disabled]):hover,.t2-btn:hover{filter:brightness(1.08)}}
.t2-status{min-height:1.4em;margin:12px 4px;color:#fff3cf}.t2-status.error{color:#ff9a8a}
.t2-pay,.t2-panel{margin-top:8px;padding:22px;border-radius:14px;background:linear-gradient(180deg,rgba(14,28,48,.94),rgba(6,14,28,.94));border:1px solid rgba(233,194,114,.3);box-shadow:0 14px 30px rgba(0,0,0,.4)}
.t2-pay h4,.t2-panel h4{margin:0 0 14px;font-family:Cinzel,serif;color:#fff3cf;font-size:1.15rem}
.t2-field{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;margin-bottom:10px;border-radius:10px;background:rgba(0,0,0,.35);border:1px solid rgba(150,175,210,.2)}
.t2-field span{color:var(--t2-mut);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase}
.t2-field code{color:#fff;font-size:1rem;word-break:break-all}.t2-field code.big{font-size:1.9rem;color:#fff3cf;font-weight:700}
.t2-warn{margin:12px 0;padding:12px 16px;border-left:3px solid var(--t2-gold);background:rgba(233,194,114,.08);line-height:1.55}
.t2-muted{color:var(--t2-mut)}
.t2-scroll{overflow-x:auto}
.t2-orders{width:100%;border-collapse:collapse;font-size:.9rem}.t2-orders.wide{min-width:860px;font-size:.82rem}
.t2-orders th,.t2-orders td{padding:10px 8px;border-bottom:1px solid rgba(150,175,210,.15);text-align:left;vertical-align:top}
.t2-orders th{color:var(--t2-mut);font-weight:600}.t2-orders a{color:var(--t2-hi)}
.t2-state{font-weight:800}.t2-state.credited{color:#7fe0a0}.t2-state.paid{color:#f3d48a}.t2-state.awaiting{color:#9fc6ff}.t2-state.expired{color:#8a96a8}.t2-state.review{color:#ff9a8a}
.t2-faq{margin-top:30px;display:grid;gap:10px}.t2-faq h3{font-size:1.35rem;color:#fff3cf;margin-bottom:6px}
.t2-faq details{border-radius:12px;background:rgba(6,14,28,.85);border:1px solid rgba(150,175,210,.18)}
.t2-faq summary{cursor:pointer;padding:16px 18px;font-weight:700;color:#fff}.t2-faq summary::marker{color:var(--t2-gold)}
.t2-faq p{margin:0;padding:0 18px 16px;color:#c9d4e4;line-height:1.6}.t2-faq a{color:var(--t2-hi)}
/* Tablet / phone */
@media (max-width:1100px){.t2-trust{grid-template-columns:repeat(2,minmax(0,1fr))}.t2-hero{padding:34px}}
@media (max-width:900px){.t2-packs{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(168px,42%);overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;margin:0 -4px}
 .t2-pack{scroll-snap-align:start}.t2-hero{grid-template-columns:1fr;padding:28px 22px}.t2-hero-art{min-height:0;order:-1}.t2-medal{width:150px}.t2-crest{display:none}}
@media (max-width:640px){.t2-trust{grid-template-columns:1fr}.t2-methods{grid-template-columns:1fr}.t2-summary{flex-direction:column;align-items:stretch;text-align:center}.t2-cta{width:100%}
 .t2-count div{min-width:0;flex:1}.t2-packs{grid-auto-columns:minmax(160px,62%)}}
@media (prefers-reduced-motion:reduce){.t2-medal{animation:none}.t2-pack,.t2-method{transition:none}}
