/* Trustpay / everyday payments. Shared, self-hosted identity for API and checkout. */
:root{color-scheme:light;--tp-bg:#fffdf9;--tp-panel:#fff;--tp-ink:#202522;--tp-muted:#59635f;--tp-line:#dcded7;--tp-accent:#2747d8;--tp-accent-ink:#fff;--tp-wash:#f0f2ff;--tp-soft:#f3f2eb;--tp-coral:#e97959}
html[data-bs-theme=dark]{color-scheme:dark;--tp-bg:#17201f;--tp-panel:#202b2a;--tp-ink:#f4f4ed;--tp-muted:#b5c1bc;--tp-line:#42514b;--tp-accent:#aabbff;--tp-accent-ink:#152047;--tp-wash:#283544;--tp-soft:#23302d}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}
body.tp-site,html body.tp-site{margin:0;background:var(--tp-bg)!important;color:var(--tp-ink)!important;font-family:"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
body.tp-site::before{display:none}.tp-site a{color:inherit;text-decoration:none}.tp-site a:hover{color:var(--tp-accent)}
.tp-site :is(a,button,input,summary):focus-visible{outline:3px solid var(--tp-accent);outline-offset:5px}
.tp-wrap{width:min(1200px,calc(100% - 96px));margin-inline:auto}
.tp-skip{position:absolute;top:-100px;left:20px;z-index:10;padding:12px;background:var(--tp-accent);color:var(--tp-accent-ink)!important}.tp-skip:focus{top:12px}
.tp-header{min-height:104px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.tp-brand{display:inline-flex;align-items:center;gap:9px;font-size:29px;letter-spacing:-1.3px;font-weight:750;line-height:1;min-width:0}
.tp-brand img.tp-mark{width:36px;height:36px;flex-shrink:0}.tp-brand-dot{color:var(--tp-coral)}
.tp-brand img.tp-merchant-logo{max-width:190px;max-height:48px;object-fit:contain}.tp-brand-name{overflow-wrap:anywhere}
.tp-brand .coin-header__brand{font-size:inherit;font-weight:inherit;letter-spacing:inherit;color:inherit}
.tp-header nav{display:flex;align-items:center;gap:32px;font-size:14px}.tp-nav-link{padding:14px 0}
.tp-nav-cta{display:inline-flex;align-items:center;gap:22px;font-size:13px;font-weight:650;padding:13px 18px;border:1px solid var(--tp-line);border-radius:7px}
.tp-header-tools{display:flex;gap:16px;align-items:center}.tp-portal-label{color:var(--tp-muted);font-size:12px}
html .tp-site #themeToggle{display:inline-flex;justify-content:center;align-items:center;width:42px;height:42px;min-width:42px;min-height:42px;border:1px solid var(--tp-line);border-radius:50%;color:var(--tp-ink);background:transparent;font-size:21px;cursor:pointer}
.tp-hero{padding:62px 0 84px;display:grid;grid-template-columns:1.06fr 1fr;align-items:center;gap:68px}
.tp-eyebrow{font-size:13px;line-height:1.6;font-weight:600;color:var(--tp-accent);margin:0 0 25px}
.tp-hero h1{font-size:clamp(48px,4.7vw,67px);line-height:1.08;letter-spacing:-3px;font-weight:650;margin:0 0 30px}
.tp-underline{color:var(--tp-accent);position:relative;display:inline-block;padding-bottom:9px}
.tp-underline::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:10px;border-top:3px solid var(--tp-coral);border-radius:50%;transform:rotate(-2deg)}
.tp-lead{font-size:17px;line-height:1.8;max-width:450px;color:var(--tp-muted);margin:0 0 30px}
.tp-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;padding:17px 22px;border-radius:7px;border:1px solid var(--tp-accent);background:var(--tp-accent);color:var(--tp-accent-ink)!important;font-size:14px;font-weight:600;transition:background .2s,transform .2s}
.tp-button:hover{transform:translateY(-2px);filter:brightness(.94)}.tp-hero-note{font-size:12px;line-height:1.7;color:var(--tp-muted);margin:22px 0 0;max-width:370px}
.tp-stage{position:relative;isolation:isolate;height:534px;margin:0;background:#f6d9c5;border-radius:140px 18px 18px 18px;overflow:hidden;color:#262e2b}
.tp-stage-checkout{background:#dde4f3}
.tp-stage-heading{position:relative;z-index:2;padding:35px 32px 0 95px;display:flex;align-items:center;justify-content:space-between;font-size:17px;font-weight:600;letter-spacing:-.4px}
.tp-stage-plus{font-size:43px;font-weight:400;line-height:1;color:#b34d32}.tp-stage-checkout .tp-stage-plus{color:#2747d8}
.tp-stage-orbit{position:absolute;width:420px;height:420px;left:37%;top:170px;border:56px solid #eeb597;border-radius:50%;transform:rotate(-22deg);z-index:-1}.tp-stage-checkout .tp-stage-orbit{border-color:#bbc9e8}
.tp-ticket{position:absolute;top:100px;left:54px;width:min(306px,72%);background:#fffdf9;border-radius:9px 9px 0 0;box-shadow:0 14px 30px #36211316;transform:rotate(-5deg);z-index:1}
.tp-ticket::after{content:"";position:absolute;left:0;top:100%;width:100%;height:12px;background:#fffdf9;clip-path:polygon(0 0,100% 0,100% 100%,96% 25%,92% 100%,88% 25%,84% 100%,80% 25%,76% 100%,72% 25%,68% 100%,64% 25%,60% 100%,56% 25%,52% 100%,48% 25%,44% 100%,40% 25%,36% 100%,32% 25%,28% 100%,24% 25%,20% 100%,16% 25%,12% 100%,8% 25%,4% 100%,0 25%)}
.tp-ticket-top{padding:18px 22px;display:flex;align-items:center;gap:12px;border-bottom:1px dashed #dcded7;font-size:8px;letter-spacing:.8px;color:#59635f}
.tp-ticket-top strong{display:block;font-size:11px;letter-spacing:0;margin-top:5px;color:#202522}
.tp-ticket-logo{display:grid;place-items:center;background:#2747d8;color:#fff;width:35px;height:35px;border-radius:9px;font-size:25px;font-weight:750;letter-spacing:-2px}
.tp-ticket-body{padding:20px 22px 17px}.tp-ticket-body>p{color:#59635f;font-size:10px;margin:0 0 9px}
.tp-ticket h2{color:#202522;font-size:28px;line-height:1.12;letter-spacing:-1px;margin:0 0 20px;font-weight:600}
.tp-ticket-row{display:flex;justify-content:space-between;gap:8px;padding:10px 0;border-top:1px solid #e8e8df;font-size:9px}.tp-ticket-row b{font-weight:500;color:#2747d8}
.tp-ticket-caption{background:#edf2e8;color:#334d36;padding:12px;font-size:10px;margin-top:12px;text-align:center;border-radius:4px}.tp-ticket-caption span{margin-right:5px}
.tp-bag{position:absolute;width:136px;height:146px;right:24px;top:267px;background:#2747d8;border-radius:4px 4px 18px 10px;transform:rotate(12deg)}
.tp-bag::after{content:"";position:absolute;height:100%;width:19px;right:0;top:0;background:#1c33a9;border-radius:0 4px 18px 0}
.tp-bag>span{display:block;position:absolute;top:-42px;left:30px;width:64px;height:76px;border:6px solid #172b98;border-radius:40px 40px 12px 12px;z-index:-1}
.tp-bag img{width:55px;height:55px;position:absolute;top:46px;left:34px;background:white;border-radius:14px;padding:3px}
.tp-stage figcaption{position:absolute;bottom:20px;left:0;right:0;text-align:center;font-size:9px;color:#575949}
.tp-ticket-steps{padding:0;margin:0;list-style:none}.tp-ticket-steps li{display:flex;gap:12px;align-items:center;padding:10px 0;border-top:1px solid #e5e5dc}
.tp-ticket-steps li>span{width:23px;height:23px;display:grid;place-items:center;background:#eef0fc;color:#2747d8;border-radius:50%;font-size:10px}
.tp-ticket-steps strong{display:block;font-size:11px;color:#202522;font-weight:600}.tp-ticket-steps small{display:block;font-size:9px;color:#59635f;margin-top:3px}
.tp-bridge{background:var(--tp-soft)}.tp-bridge .tp-wrap{padding-block:37px;display:flex;align-items:center;justify-content:space-between;gap:35px}
.tp-bridge p{font-size:22px;letter-spacing:-.5px;line-height:1.5;margin:0}.tp-bridge strong{font-weight:600}.tp-bridge span{max-width:230px;color:var(--tp-muted);font-size:14px;line-height:1.7}
.tp-editorial{display:grid;grid-template-columns:1fr 1.13fr;gap:110px;padding-block:110px}
.tp-section-intro h2,.tp-closing h2,.tp-help h2{font-size:clamp(34px,3vw,44px);letter-spacing:-1.6px;line-height:1.14;margin:0 0 22px;font-weight:600}
.tp-section-intro>p:last-child,.tp-help>div>p:last-child{max-width:325px;font-size:15px;line-height:1.8;color:var(--tp-muted)}
.tp-stories article{display:flex;align-items:flex-start;gap:22px;padding:27px 0;border-top:1px solid var(--tp-line)}.tp-stories article:first-child{padding-top:0;border-top:none}
.tp-story-icon{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border-radius:12px;background:var(--tp-wash);color:var(--tp-accent);font-size:21px}
.tp-stories h3{font-size:19px;letter-spacing:-.4px;font-weight:600;margin:0 0 12px;line-height:1.35}.tp-stories p{font-size:14px;line-height:1.9;color:var(--tp-muted);margin:0}
.tp-closing{background:var(--tp-wash);border-radius:18px;padding:52px 54px;display:grid;grid-template-columns:1fr 1fr;gap:85px;align-items:center;margin-bottom:80px}
.tp-closing h2{margin-bottom:0}.tp-closing>div>p{font-size:15px;line-height:1.85}.tp-closing .tp-eyebrow{margin-bottom:17px;font-size:13px}.tp-closing .tp-small{font-size:12px;color:var(--tp-muted);margin-top:24px;margin-bottom:0}
.tp-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;padding-block:31px;border-top:1px solid var(--tp-line);color:var(--tp-muted);font-size:12px;margin-top:auto}
.tp-footer-brand{font-size:25px;color:var(--tp-ink)!important;gap:0}.tp-footer-links{display:flex;align-items:center;gap:24px}
.tp-find-payment{background:var(--tp-soft)}.tp-find-inner{display:flex;align-items:center;gap:25px;padding-block:36px}
.tp-link-icon{font-size:30px;width:56px;height:56px;background:var(--tp-bg);border-radius:50%;display:grid;place-items:center;color:var(--tp-accent);flex-shrink:0}
.tp-find-inner h2{font-size:22px;letter-spacing:-.5px;margin:0 0 10px;font-weight:600}.tp-find-inner p{font-size:13px;line-height:1.8;color:var(--tp-muted);margin:0}
.tp-text-link{font-size:13px;font-weight:600;display:inline-flex;gap:15px;align-items:center;padding:14px 0}.tp-find-inner>a{margin-left:auto;white-space:nowrap}
.tp-help{border-top:1px solid var(--tp-line);display:grid;grid-template-columns:1fr 1.13fr;gap:110px;padding-block:72px 96px}
.tp-faq details{border-bottom:1px solid var(--tp-line);padding:22px 0}.tp-faq details:first-child{padding-top:0}
.tp-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:16px;font-weight:550;line-height:1.6}.tp-faq summary::-webkit-details-marker{display:none}
.tp-faq summary::after{content:"+";font-size:23px;color:var(--tp-accent);font-weight:400}.tp-faq details[open] summary::after{content:"−"}
.tp-faq p{color:var(--tp-muted);font-size:14px;line-height:1.85;margin:17px 30px 0 0}
/* Payment data, IDs and actions are owned by the existing payment templates. */
html .tp-site .checkout-shell{padding-top:38px!important;padding-bottom:60px!important}
html .tp-site .soft-card,html .tp-site .card-crypto{background:var(--tp-panel);color:var(--tp-ink);border:1px solid var(--tp-line);border-radius:14px;box-shadow:0 6px 24px #18261d05}
html .tp-site .soft-card .soft-card{background:var(--tp-bg);border-color:var(--tp-line);box-shadow:none}
html .tp-site .hero-badge{background:var(--tp-wash);border:0;color:var(--tp-accent);box-shadow:none;border-radius:5px;font-size:12px;letter-spacing:0}
html .tp-site .checkout-shell .display-6{font-weight:600!important;letter-spacing:-1.1px;color:var(--tp-ink)}
html .tp-site .btn-gradient,html .tp-site .btn-back{background:var(--tp-accent);color:var(--tp-accent-ink);border:0;border-radius:7px;box-shadow:none;font-weight:600}
html .tp-site .btn-gradient:hover,html .tp-site .btn-back:hover{filter:brightness(.94);box-shadow:none}
html .tp-site .qr-box{background:var(--tp-panel);border:1px solid var(--tp-line);box-shadow:none;border-radius:10px}
html .tp-site .qr-box::before{display:none}html .tp-site .qr-box img{background:#fff;padding:12px;border-radius:8px}
html .tp-site .form-control,html .tp-site .form-select{border-color:var(--tp-line);border-radius:7px;min-height:44px}
html .tp-site .check-icon{background:var(--tp-wash);color:var(--tp-accent);box-shadow:none}
html .tp-site .thank-text{color:var(--tp-ink);font-weight:600;letter-spacing:-1px}html .tp-site .desc-text{color:var(--tp-muted)}
html .tp-site .value-pill{background:var(--tp-bg);border-color:var(--tp-line)}
@media(max-width:1100px){.tp-wrap{width:calc(100% - 64px)}.tp-hero{gap:36px;padding-block:42px 64px}.tp-hero h1{font-size:53px;letter-spacing:-2.5px}.tp-stage{height:510px}.tp-ticket{left:28px;width:76%}.tp-bag{right:15px}.tp-stage-heading{padding-left:65px;font-size:15px}.tp-editorial,.tp-help{gap:65px}}
@media(max-width:800px){
.tp-wrap{width:calc(100% - 40px)}.tp-header{min-height:84px;gap:18px}.tp-header nav{gap:18px;font-size:12px}.tp-nav-cta,.tp-portal-label{display:none}
.tp-brand{font-size:26px}.tp-brand img.tp-mark{width:32px;height:32px}.tp-hero{grid-template-columns:1fr;gap:40px;padding-block:35px 48px}.tp-hero-copy{max-width:560px}
.tp-hero h1{font-size:clamp(42px,8vw,60px);letter-spacing:-2px;margin-bottom:22px}.tp-eyebrow{font-size:12px;margin-bottom:22px}.tp-lead{font-size:16px;max-width:470px;margin-bottom:25px}
.tp-stage{width:100%;max-width:560px;height:510px;justify-self:center;border-top-left-radius:100px}.tp-ticket{left:13%;width:65%}.tp-stage-heading{padding-left:75px}.tp-bag{right:7%}
.tp-bridge .tp-wrap{align-items:flex-start;gap:18px;flex-direction:column;padding-block:30px}.tp-bridge p{font-size:21px}.tp-bridge span{max-width:none;font-size:12px}
.tp-editorial,.tp-help{grid-template-columns:1fr;gap:32px;padding-block:58px}.tp-section-intro h2,.tp-closing h2,.tp-help h2{font-size:36px}.tp-section-intro>p:last-child,.tp-help>div>p:last-child{max-width:450px}
.tp-stories article{gap:18px;padding-block:24px}.tp-stories h3{font-size:18px}.tp-stories article:last-child{padding-bottom:0}
.tp-closing{grid-template-columns:1fr;padding:32px 28px;gap:22px;margin-bottom:48px}.tp-find-inner{gap:18px;flex-wrap:wrap;padding-block:28px}.tp-find-inner>div{flex:1;min-width:215px}
.tp-find-inner>a{margin-left:74px;padding-block:0}.tp-find-inner h2{font-size:20px;line-height:1.3}.tp-footer{padding-block:24px;gap:20px}.tp-faq summary{font-size:15px}
}
@media(max-width:440px){
.tp-header nav{gap:16px}.tp-header .tp-brand{font-size:24px}.tp-header-tools{gap:10px}.tp-header-checkout nav .tp-nav-link{display:none}
.tp-hero h1{font-size:44px;letter-spacing:-2px}.tp-hero .tp-eyebrow{max-width:280px}.tp-stage{height:490px}.tp-ticket{left:22px;width:77%;top:105px}.tp-ticket h2{font-size:27px}
.tp-bag{right:8px;width:110px;height:135px;top:264px}.tp-bag img{left:22px}.tp-stage-heading{padding-left:56px;padding-right:22px;font-size:14px}
.tp-ticket-body,.tp-ticket-top{padding-inline:18px}.tp-stage figcaption{font-size:8px}.tp-footer>span{font-size:11px}
}
@media(max-width:360px){.tp-wrap{width:calc(100% - 32px)}.tp-header nav{gap:12px;font-size:11px}.tp-header .tp-brand{font-size:22px;gap:6px}.tp-hero h1{font-size:38px}.tp-stage-heading{padding-left:40px;font-size:13px}.tp-find-inner>div{min-width:185px}.tp-link-icon{width:42px;height:42px}.tp-find-inner>a{margin-left:60px}.tp-ticket{width:80%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Keep the illustration in normal flow so zoom and narrow screens cannot clip its caption. */
.tp-stage{height:auto;min-height:534px}
.tp-ticket{position:relative;top:auto;left:auto;margin:28px 0 64px 54px}
@media(max-width:1100px){.tp-stage{min-height:510px}.tp-ticket{margin-left:28px}}
@media(max-width:800px){.tp-ticket{margin-left:13%}}
@media(max-width:440px){.tp-stage{min-height:490px}.tp-ticket{margin-left:22px}}
