*{box-sizing:border-box}html,body{color:#151827;background:#f6f7fb;margin:0;padding:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}.wrap{max-width:1100px;margin:auto;padding:24px}.nav{color:#fff;background:#111827;justify-content:space-between;align-items:center;padding:18px 24px;display:flex}.brand{font-size:22px;font-weight:900}.btn{cursor:pointer;border:0;border-radius:12px;justify-content:center;align-items:center;padding:12px 16px;font-weight:800;display:inline-flex}.primary{color:#fff;background:#7c3aed}.dark{color:#fff;background:#111827}.light{background:#fff;border:1px solid #e5e7eb}.danger{color:#991b1b;background:#fee2e2}.grid{gap:18px;display:grid}.grid2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}.card{background:#fff;border:1px solid #e7e9ef;border-radius:18px;padding:20px;box-shadow:0 8px 25px #11182708}.muted{color:#6b7280}.title{margin:10px 0;font-size:34px;font-weight:900}.input{border:1px solid #d9dce5;border-radius:10px;width:100%;margin:6px 0 14px;padding:13px 14px;font-size:16px}.label{font-size:13px;font-weight:800}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.stat{font-size:30px;font-weight:900}.center{text-align:center}.profile{max-width:560px;margin:30px auto}.avatar{object-fit:cover;border:4px solid #fff;border-radius:50%;width:92px;height:92px;box-shadow:0 5px 20px #0002}.cover{object-fit:cover;border-radius:20px;width:100%;height:190px}.profilebtn{color:#fff;background:#111827;border-radius:13px;justify-content:center;align-items:center;gap:9px;width:100%;margin:10px 0;padding:15px;font-weight:800;display:flex}.small{font-size:13px}.table{border-collapse:collapse;width:100%}.table th,.table td{text-align:left;border-bottom:1px solid #eee;padding:12px}.qr{background:#fff;border-radius:12px;width:max-content;padding:12px}.notice{color:#5b21b6;background:#ede9fe;border-radius:12px;margin:12px 0;padding:12px 14px}@media (max-width:700px){.grid2,.grid3{grid-template-columns:1fr}.wrap{padding:15px}.title{font-size:28px}}.profilelinks{margin-top:18px}.profilebtn{min-height:54px;transition:transform .15s,filter .15s}.profilebtn:hover{filter:brightness(1.08);transform:translateY(-2px)}.profilebtn:focus-visible{outline-offset:3px;outline:3px solid #7c3aed}.profilebtn svg{flex:none}.profilebtn-facebook{background:#1877f2}.profilebtn-instagram{background:#b72f84}.profilebtn-messenger{background:#087bff}.profilebtn-maps{background:#247752}.profilebtn-phone{background:#141c2b}.profilebtn-email{background:#374151}.profilebtn-website{background:#334155}.profilebtn-review{background:#a45e10}.gcash-section{background:#f5f9ff;border:1px solid #dfe8ff;border-radius:16px;max-width:430px;margin:24px auto 0;padding:22px}.gcash-section h2{color:#113c84;margin:0 0 4px;font-size:21px}.gcash-qr{border:10px solid #fff;border-radius:12px;width:min(100%,320px);height:auto;margin:16px auto;display:block;box-shadow:0 4px 18px #0924631a}.gcash-open{color:#fff;background:#1459b7;border-radius:10px;padding:10px 16px;font-weight:800;display:inline-block}.gcash-open:focus-visible{outline-offset:3px;outline:3px solid #7c3aed}.profile-surface{background-position:50%;background-size:cover;background-attachment:fixed;max-width:none;min-height:100vh;display:flow-root}.profile-surface .profile{margin:30px auto}.profile-theme-classic{background-color:#f6f7fb}.profile-theme-dark{background-color:#101827}.profile-theme-dark .card{color:#f8fafc;background:#182335;border-color:#344154;box-shadow:0 12px 35px #0004}.profile-theme-dark .muted{color:#c8d3e0}.profile-theme-dark .gcash-section{background:#213247;border-color:#476184}.profile-theme-dark .gcash-section h2{color:#e9f1ff}.profile-theme-ocean{background-color:#ccecf4}.profile-theme-ocean .card{background:#f6fdff;border-color:#9dd9e9}.profile-theme-ocean .gcash-section{background:#e3f5fb;border-color:#9dd9e9}.profile-surface .card{background:var(--profile-panel);border-color:var(--profile-border);color:var(--profile-text)}.profile-surface .muted{color:var(--profile-muted)}.profile-surface .gcash-section{background:var(--profile-panel);border-color:var(--profile-border)}.profile-surface .gcash-section h2{color:var(--profile-text)}.profile-surface .gcash-open{background:var(--profile-accent);color:var(--profile-on-accent)}.profile-surface .profilebtn:focus-visible{outline-color:var(--profile-accent)}.demo-page{color:var(--profile-text);padding:0 24px 48px}.demo-header{justify-content:space-between;align-items:center;gap:20px;max-width:1100px;margin:auto;padding:20px 0;display:flex}.demo-header>a:first-child{background:#fff;border-radius:12px;padding:6px 12px}.demo-header img{object-fit:contain}.demo-header>a:last-child{background:var(--profile-panel);color:var(--profile-text);border-radius:12px;padding:12px;font-size:13px;font-weight:700}.demo-heading{max-width:1100px;margin:20px auto 24px}.demo-heading h1{letter-spacing:-.035em;margin:10px 0;font-size:clamp(28px,4vw,42px)}.demo-eyebrow{letter-spacing:.16em;color:var(--profile-muted);font-size:10px;font-weight:800}.demo-plan-switch{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:1100px;margin:0 auto 26px;display:grid}.demo-plan-switch a{border:1px solid var(--profile-border);background:var(--profile-panel);color:var(--profile-text);border-radius:16px;flex-direction:column;gap:6px;padding:18px;display:flex}.demo-plan-switch a[aria-current=page]{border-color:#076ae0;box-shadow:0 0 0 2px #076ae0}.demo-plan-switch span{color:var(--profile-muted);font-size:12px}.demo-layout{grid-template-columns:minmax(260px,360px) minmax(0,1fr);align-items:start;gap:40px;max-width:1100px;margin:auto;display:grid}.demo-details{padding:26px;position:sticky;top:20px}.demo-details h2{margin:14px 0;font-size:32px}.demo-details h2 small{color:var(--profile-muted);font-size:12px;font-weight:500}.demo-details ul{gap:12px;padding:0;font-size:13px;line-height:1.5;list-style:none;display:grid}.demo-package-note{border:1px solid var(--profile-border);border-radius:10px;padding:12px;font-size:12px;line-height:1.5}.demo-profile.profile{width:100%;margin:0 auto}.demo-profile h2{letter-spacing:-.035em;overflow-wrap:anywhere;font-size:clamp(23px,3vw,32px);line-height:1.2}.demo-profile .card{padding:24px}.demo-profile button.profilebtn{font:inherit;cursor:pointer;border:0;font-weight:800}.demo-cover{color:#fff;letter-spacing:.18em;background:linear-gradient(135deg,#086ae0,#72b9fc);border-radius:14px;justify-content:center;align-items:flex-start;height:160px;padding:28px;font-size:12px;font-weight:800;display:flex}.demo-avatar{margin-top:8px}.demo-avatar.with-cover{margin-top:-44px;position:relative}.demo-nfc-card{color:#102035;background:#fff;border:1px solid #dde5f0;border-radius:14px;min-height:130px;margin-top:22px;padding:18px;position:relative}.demo-nfc-card>img:first-child{object-fit:contain;display:block}.demo-nfc-card strong{letter-spacing:.13em;margin-top:8px;font-size:10px;display:block}.demo-nfc-card span{margin-top:16px;font-size:11px;display:block}.demo-nfc-card .demo-profile-qr{border-radius:6px;position:absolute;bottom:14px;right:14px}.demo-order{color:#fff;background:#076ae0;width:100%;margin-top:10px}.demo-disclaimer{margin-top:24px;line-height:1.6}.demo-payment-title,.demo-profile .gcash-section h3{color:var(--profile-text)}.demo-page :focus-visible{outline-offset:3px;outline:3px solid #076ae0}@media (max-width:760px){.demo-page{padding:0 16px 32px}.demo-layout{grid-template-columns:1fr;gap:24px}.demo-details{position:static}.demo-profile{grid-row:1}.demo-plan-switch a{padding:12px 8px}.demo-plan-switch span{font-size:11px;line-height:1.5}.demo-header{gap:8px}.demo-header img{width:110px;height:auto}.demo-header>a:last-child{font-size:11px}.demo-profile .card{padding:18px}.demo-heading{margin-top:12px}}.profile-surface{background-color:#f6f7fb}.profile-card{isolation:isolate;color:var(--profile-text);border-color:var(--profile-border);background-position:50%;background-repeat:no-repeat;background-size:cover;overflow:hidden}.profile-surface .profile-card{background-color:var(--profile-panel)}.profile-card .muted{color:var(--profile-muted)}.profile-card .profilebtn{background:var(--profile-accent);color:var(--profile-on-accent);box-shadow:0 2px 8px #0000000a}.profile-card .gcash-section{background:var(--profile-panel);border-color:var(--profile-border)}.demo-profile.profile{max-width:390px}.demo-profile .profile-card{border:8px solid #102342;border-radius:34px;padding:24px 20px;box-shadow:0 22px 50px #12233e18}.demo-layout{grid-template-columns:minmax(260px,360px) minmax(0,1fr);gap:64px}.demo-nfc-card{margin:28px 0;transform:rotate(-3deg);box-shadow:0 12px 24px #10234212}.profile-card h1,.profile-card p{overflow-wrap:anywhere}.profile-card .gcash-section h2{color:var(--profile-text)}@media (max-width:760px){.demo-layout{grid-template-columns:1fr;gap:24px}.demo-profile .profile-card{padding:20px 16px}.demo-profile.profile{max-width:390px}}
