/* Scoped implementation of the supplied 36-section UX audit. */
:root { --surface:#fff;--muted:#646c60;--success:#35522c;--warning:#715214;--error:#973b35;--disabled:#65705f; }
.content-page > h1,.article-heading h1 { font-size:clamp(34px,4vw,52px);line-height:1.1;letter-spacing:-.035em; }
.content-page h2 { font-size:clamp(26px,3vw,34px);line-height:1.18;letter-spacing:-.025em; }
.content-page h3 { font-size:24px;line-height:1.25;letter-spacing:-.015em; }
.content-page p { line-height:1.6; }
.content-page { padding-top:34px; }
.content-page > .page-intro { margin-bottom:26px; }
.article-heading { margin-bottom:28px; }
.reading-body .article-toc { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px;padding:22px;margin-bottom:28px; }
.article-toc > b { grid-column:1/-1; }
.article-toc a { display:block;line-height:1.5; }
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid #657b36;outline-offset:4px; }
button:disabled { cursor:not-allowed;opacity:.65; }
.content-page .caption { font-size:14px;color:var(--muted); }
.product-badge { display:inline-block;align-self:flex-start;font-size:12px;font-weight:700;background:var(--pale,#edf1e6);padding:6px 10px;border-radius:20px; }
.purchase-options .product { position:relative; }
.purchase-options .product h3 { font-size:24px;line-height:1.25;letter-spacing:-.015em;min-height:2.5em;margin-bottom:12px; }
.purchase-options .product .price { font-size:38px;margin:18px 0 0; }
.purchase-options .product .price small { font-size:12px; }
.purchase-options .product .subtitle { margin:6px 0 18px;min-height:3.2em; }
.catalog-content > .product-grid { margin:30px 0; }
.product-availability { display:none; }
.product.recommended-option::before { content:'Recommended for you';position:absolute;top:-14px;left:20px;border-radius:20px;padding:6px 12px;background:var(--lime);color:var(--ink);font-size:12px;font-weight:700; }
.card-tone-graphite .approved-card-art { filter:grayscale(.85) brightness(1.3); }
.order-steps { display:flex;gap:16px;list-style:none;padding:0;flex-wrap:wrap;font-size:14px;color:var(--muted);margin:26px 0; }
.order-steps li:first-child { font-weight:700;color:var(--ink); }
#configure-card { scroll-margin-top:120px; }
.compact-comparison { margin:36px 0; }
.comparison-scroll { overflow:auto;border:1px solid var(--line);border-radius:18px;background:var(--surface); }
.comparison-scroll table { width:100%;border-collapse:collapse;font-size:14px; }
.comparison-scroll th,.comparison-scroll td { text-align:left;padding:15px;vertical-align:top;border-bottom:1px solid var(--line);min-width:140px; }
.comparison-scroll th { color:var(--ink);background:#eef1e6;font-weight:600; }
.comparison-scroll tbody th { min-width:155px; }
.comparison-mobile { display:none; }
.network-breakdown { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;border-block:1px solid var(--line);padding:22px 0; }
.network-breakdown dt { color:var(--muted);font-size:14px; }
.network-breakdown dd { font-size:21px;font-weight:600;margin:12px 0 0; }
body[data-page="/fees/"] .fee-section { margin-top:20px; }
body[data-page="/help/"] .help-search { margin:20px 0; }
.help-format { display:flex;gap:8px;margin:20px 0;flex-wrap:wrap; }
.help-format button { background:#eef1e6;min-height:44px;padding:10px 18px;border-radius:24px; }
.help-format button[aria-pressed="true"] { background:var(--ink);color:white; }
.help-faq { border-bottom:1px solid var(--line);padding:18px 0; }
.help-faq summary { font-size:20px;line-height:1.35;font-weight:600;cursor:pointer; }
.help-faq p { max-width:75ch; }
body[data-page="/help/"] .help-result { padding:22px;margin:14px 0; }
body[data-page="/help/"] .help-result h2 { font-size:25px;margin:0 0 10px; }
body[data-page="/help/"] .help-result p { margin:10px 0; }
.guide-grid,.contact-grid,.responsibility-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:24px 0; }
.guide-tile { background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:28px;display:flex;flex-direction:column; }
.guide-tile h2 { font-size:26px;line-height:1.25;letter-spacing:-.015em;margin:18px 0 12px; }
.guide-tile a { margin-top:auto;min-height:44px;display:flex;align-items:center;text-decoration:underline; }
.about-purpose { max-width:72ch;margin:30px 0; }
.about-flow,.principle-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:32px 0;list-style:none;padding:0; }
.about-flow li,.principle-grid article { background:#eef1e6;padding:28px;border-radius:20px; }
.about-flow strong { font-size:24px;display:block; }
.about-flow span { font-size:15px;display:block;margin-top:12px; }
.contact-email { overflow-wrap:anywhere;font-size:20px; }
.contact-grid > .panel { margin:0; }
body[data-page="/about/"] .content-page,body[data-page="/contact/"] .content-page { max-width:1200px; }
.auth-help { font-size:14px;line-height:1.5; }
.auth-card-summary { display:grid;gap:6px;padding:16px;margin:0 0 16px;border:1px solid var(--line);border-radius:12px;background:#f8f9f5; }
.auth-card-summary > span { font-size:13px;color:var(--muted); }
.auth-card-summary > strong { font-size:17px;line-height:1.35; }
.auth-page .auth-card-summary p { margin:0;line-height:1.5; }
.auth-card-summary #auth-card-price { white-space:nowrap; }
.auth-page .auth-create-account { width:100%; }
.password-checks { display:flex;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:0; }
.password-checks span { padding:4px 8px;border:1px solid var(--line);border-radius:8px; }
.password-checks .passed { background:#e5efdc;color:#35522c; }
footer { grid-template-columns:1.3fr repeat(4,1fr);gap:26px; }
footer .footer-bottom { grid-column:1/-1; }
@media(max-width:900px){footer { grid-template-columns:repeat(2,minmax(0,1fr)); }.footer-brand { grid-column:1/-1; }.network-breakdown { grid-template-columns:repeat(2,minmax(0,1fr)); }}
@media(max-width:650px){
 .guide-grid,.contact-grid,.responsibility-grid,.principle-grid,.about-flow { grid-template-columns:1fr;gap:16px; }
 .reading-body .article-toc { grid-template-columns:1fr;padding:18px; }
 .content-page h2 { font-size:28px; }.content-page h3 { font-size:23px; }
 .purchase-options .product h3 { min-height:0; }.purchase-options .product .subtitle { min-height:0; }
 .guide-tile { padding:22px; }.guide-tile h2 { font-size:25px; }
 .comparison-scroll th,.comparison-scroll td { min-width:145px;padding:12px; }
 .network-breakdown { grid-template-columns:1fr 1fr;gap:20px; }.network-breakdown dd { font-size:18px; }
 .help-faq summary { font-size:18px; }
 footer { gap:24px 16px; }
}

/* Compact card choices precede the static preview on mobile. */
@media (max-width:650px) {
 .content-page:has(.catalog-content) > .page-intro { margin-bottom:18px; }
 .content-page:has(.catalog-content) > .catalog-start,
 .catalog-content > .card-picker,
 .catalog-content .catalog-finish-switch { display:none; }
 .catalog-content { display:flex;flex-direction:column; }
 .catalog-content > .purchase-options { order:-1;grid-template-columns:1fr;gap:10px;margin:0 0 22px; }
 .catalog-content > .catalog-card-hero { width:100%; }
 .catalog-content .purchase-options .product { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px 12px;padding:15px; }
 .catalog-content .purchase-options .product h3 { grid-column:1/-1;font-size:19px;line-height:1.25;margin:0; }
 .catalog-content .purchase-options .product .product-badge,
 .catalog-content .purchase-options .product .mini-card,
 .catalog-content .purchase-options .product ul { display:none; }
 .catalog-content .purchase-options .product .subtitle { grid-area:2/1/3/2;font-size:13px;line-height:1.4;margin:0; }
 .catalog-content .purchase-options .product .price { grid-area:2/2/3/3;text-align:right;font-size:20px;line-height:1.2;letter-spacing:-.02em;margin:0; }
 .catalog-content .purchase-options .product .price small { display:block;margin:2px 0 0; }
 .catalog-content .purchase-options .product .product-availability { display:block;grid-column:1/-1;font-size:13px;line-height:1.4;color:var(--muted);margin:0; }
 .catalog-content .purchase-options .product .product-conditions { display:flex;align-items:center;min-height:44px;margin:0; }
 .catalog-content .purchase-options .product [data-buy] { min-height:44px;padding:8px 12px;margin:0; }
 .compact-comparison .comparison-scroll { display:none; }
 .comparison-mobile { display:grid;gap:12px; }
 .comparison-mobile article { padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:18px; }
 .comparison-mobile article h3 { font-size:18px;margin:0 0 10px; }
 .comparison-mobile dl { margin:0; }
 .comparison-mobile dl > div { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;border-top:1px solid var(--line);padding:7px 0;font-size:13px; }
 .comparison-mobile dt { color:var(--muted); }
 .comparison-mobile dd { margin:0;text-align:right;font-weight:600; }
}
@media(prefers-reduced-motion:reduce){html { scroll-behavior:auto!important; }}
.order-edit summary { cursor:pointer;font-weight:600;padding:12px 0; }
.order-edit .form-stack { margin-top:14px; }
#modal .first-purchase .purchase-math { grid-template-columns:1fr; }
.first-purchase { margin-top:28px; }
header button,header a.button,.filter-buttons button,.catalog-finish-switch button { min-height:44px; }
body[data-page="/help/"] .help-search { padding:0; }
.compact-comparison { padding:20px 0; }
body[data-page="/about/"] .about-purpose { padding:0; }
body[data-page="/about/"] .content-page > section:not(.panel) { padding:20px 0; }
.responsibility-grid { padding:24px 0; }
/* Keep the approved ribbon logo unchanged on the graphite option. */
.card-tone-graphite .approved-card-art { filter:none; }
.card-tone-graphite { box-shadow:inset 0 0 0 1px #bcc3b7,0 15px 25px -22px #20251f66; }
.product[data-product="wallet"] .mini-card::before { content:'';position:absolute;left:0;right:0;bottom:22%;height:3px;z-index:2;background:linear-gradient(90deg,transparent,#c9d0c09c,transparent);pointer-events:none; }
.safety-icon { width:28px;height:28px;fill:none;stroke:var(--ink);stroke-width:1.5;display:block;margin-bottom:16px;stroke-linecap:round;stroke-linejoin:round; }

/* AI label extends the approved wordmark without changing the raster artwork. */
.product .mini-card,.catalog-card-hero .visual-card { container-type:inline-size; }
.card-ai-mark { position:absolute;left:28%;top:10.8%;z-index:3;color:#fff;font:800 7cqw/1 Manrope,sans-serif;letter-spacing:-.04em;pointer-events:none; }

/* Account navigation stays within the workspace. */
body.account-mode .header-buy { display:none; }
body.mini-app #primary-nav,body.mini-app #nav-toggle,body.mini-app .header-buy,body.mini-app footer,body.mini-app #back-home { display:none !important; }
body.mini-app { padding-bottom:env(safe-area-inset-bottom,0px); }

/* Account card details: preserve the approved logo/chip; cover raster demo digits. */
#dashboard .financial-card { container-type:inline-size; }
#dashboard .financial-card .card-private-fields { position:absolute;inset:58% 0 0;z-index:3;background:linear-gradient(115deg,#283323,#1e281f);padding:3% 7% 5%;display:grid;grid-template-columns:1fr 1fr;gap:3% 8%;color:#f3f5ef; }
#dashboard .financial-card .card-private-field { min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-content:start;align-items:center;column-gap:5px; }
#dashboard .financial-card .card-private-number { grid-column:1/-1; }
#dashboard .financial-card .card-private-label { grid-column:1/-1;font-size:clamp(8px,2.6cqw,11px);line-height:1.2;opacity:.68;letter-spacing:.04em; }
#dashboard .financial-card .card-private-value { font:500 clamp(12px,4.6cqw,21px)/1.35 ui-monospace,SFMono-Regular,monospace;letter-spacing:.02em;white-space:nowrap;user-select:text; }
#dashboard .financial-card .card-private-number .card-private-value { font-size:clamp(11px,4.4cqw,20px); }
#dashboard .financial-card .card-eye,#dashboard .financial-card .card-copy { display:grid;place-items:center;margin:0;padding:5px;width:28px;height:28px;min-width:0;border:0;border-radius:7px;background:transparent;color:#f3f5ef;box-shadow:none; }
#dashboard .financial-card .card-eye { position:absolute;right:25%;top:10%;z-index:4;background:#1e281f80; }
#dashboard .financial-card .card-eye:hover,#dashboard .financial-card .card-copy:hover:not(:disabled) { background:#ffffff1a; }
#dashboard .financial-card .card-eye svg,#dashboard .financial-card .card-copy svg { width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round; }
#dashboard .financial-card .card-copy { width:24px;height:24px;padding:4px; }
#dashboard .financial-card .card-copy:disabled { opacity:.25; }
#dashboard .financial-card .card-copy-status { position:absolute;right:7%;top:48%;z-index:4;font-size:clamp(8px,2.7cqw,12px);color:#f3f5ef; }
#dashboard .financial-card .card-network { position:absolute;left:7.5%;top:25%;z-index:3;width:15%;height:10%;color:#f3f5ef; }
#dashboard .financial-card .card-network svg { display:block;width:100%;height:100%; }
#dashboard .financial-card .card-network[data-network="mastercard"] { width:10%;height:10%; }
#dashboard .card-actions { display:flex;align-items:center;gap:10px;flex-wrap:wrap; }
#dashboard [data-live-wallet] { overflow-wrap:anywhere; }
