/* how-it-works page styles, ported from the signed-off master; every selector scoped under .xhow so it cannot clash with shell.css/tokens.css (BATCH 11 item 3). */
.xhow{background:var(--paper)}.xhow .pintro{background:#fff;border-bottom:1px solid var(--line)}.xhow .pintro .in{padding:44px 0 40px}.xhow .eyebrow{font:600 10px 'Inter';letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin-bottom:12px}.xhow .pintro h1{font:400 44px 'Playfair Display';color:var(--ink);letter-spacing:-.01em;max-width:760px}.xhow .pintro .sub{color:var(--mut);font-size:16px;line-height:1.6;margin-top:10px;max-width:620px}.xhow .pbody{padding:44px 0 90px}.xhow .card2{background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px 32px}.xhow .h2{font:400 28px 'Playfair Display';color:var(--ink);margin:0 0 8px}.xhow .lede2{color:var(--mut);font-size:15px;line-height:1.6;margin:0 0 22px;max-width:640px}.xhow .sec{margin-top:56px}.xhow .grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.xhow .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.xhow .tile{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px;text-decoration:none;color:inherit;display:block}.xhow a.tile:hover{border-color:#c9cfc6}.xhow .tile h3{font:600 16px 'Inter';color:var(--ink);margin:12px 0 6px}.xhow .tile p{font-size:14px;line-height:1.6;color:#3f453f;margin:0}.xhow .tile .go{font:600 13px 'Inter';color:var(--ivy);margin-top:14px;display:inline-block}.xhow .ic{width:38px;height:38px;border-radius:11px;background:var(--ivyt);color:var(--ivy);display:grid;place-items:center}.xhow .ic svg{width:19px;height:19px}.xhow .ic.al{background:#f6e3e1;color:#9d3630}.xhow .ic.br{background:#f6efe2;color:var(--brass)}.xhow .dark{background:var(--ivyd);color:#fff;border-radius:18px;padding:30px 32px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}.xhow .dark h2{font:400 26px 'Playfair Display';margin:0 0 6px}.xhow .dark p{color:rgba(255,255,255,.72);font-size:14.5px;line-height:1.6;margin:0}.xhow .btn{display:inline-flex;align-items:center;gap:8px;background:var(--ivy);color:#fff;border:0;border-radius:12px;padding:13px 20px;font:600 14px 'Inter';text-decoration:none;cursor:pointer}.xhow .btn.w{background:#fff;color:var(--ivy)}.xhow .btn.ghost{background:#fff;color:var(--ink);border:1px solid #dcdfd8}.xhow .note{font-size:12.5px;color:var(--soft);line-height:1.6}.xhow .qa{border-top:1px solid var(--line)}.xhow .qa details{border-bottom:1px solid var(--line);padding:18px 0}.xhow .qa summary{font:600 15.5px 'Inter';color:var(--ink);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}.xhow .qa summary::-webkit-details-marker{display:none}.xhow .qa summary::after{content:"+";font:400 22px 'Inter';color:var(--soft);line-height:1}.xhow .qa details[open] summary::after{content:"\2212"}.xhow .qa p{font-size:14.5px;line-height:1.7;color:#3f453f;margin:10px 0 0;max-width:720px}
@media(max-width:900px){.xhow .grid2,.xhow .grid3{grid-template-columns:1fr}.xhow .pintro h1{font-size:34px}.xhow .dark{grid-template-columns:1fr}.xhow .card2{padding:22px 20px}}.xhow .flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden}.xhow .flow .st{padding:28px 24px;border-right:1px solid var(--line);position:relative}.xhow .flow .st:last-child{border-right:0}.xhow .flow .sn{font:400 40px 'Playfair Display';color:var(--ivyt);line-height:1}.xhow .flow .st.us{background:var(--ivyd);color:#fff}.xhow .flow .st.us .sn{color:rgba(255,255,255,.18)}.xhow .flow .st.us p{color:rgba(255,255,255,.75)}.xhow .flow .tag{display:inline-block;font:700 9.5px 'Inter';letter-spacing:.14em;text-transform:uppercase;color:var(--livew);margin-top:14px}.xhow .flow h3{font:600 16px 'Inter';margin:10px 0 6px}.xhow .flow p{font-size:14px;line-height:1.6;color:#3f453f;margin:0}.xhow .not{display:grid;grid-template-columns:1fr 1fr;gap:18px}.xhow .not .tile p{margin-top:4px}.xhow .x{color:#9d3630}
@media(max-width:900px){.xhow .flow{grid-template-columns:1fr}.xhow .flow .st{border-right:0;border-bottom:1px solid var(--line)}.xhow .not{grid-template-columns:1fr}}