.compare-panel { overflow:hidden; border:1px solid var(--border-strong); border-radius:21px; background:var(--panel-solid); box-shadow:var(--shadow); }.compare-panel__header { display:grid; grid-template-columns:1fr auto; align-items:center; min-height:54px; padding:0 17px; border-bottom:1px solid var(--border); color:var(--muted-2); font-size:.55rem; font-weight:850; letter-spacing:.1em; }.compare-panel__header > div { display:flex; gap:9px; }.compare-panel__header b { padding:5px 8px; border-radius:7px; color:var(--text-soft); background:var(--accent-soft); font-size:.52rem; }.compare-panel__header b:last-child { background:var(--cyan-soft); }.compare-panel__row { display:grid; grid-template-columns:1fr 90px 90px; align-items:center; gap:10px; min-height:42px; padding:0 16px; border-bottom:1px solid rgba(130,173,220,.1); font-size:.59rem; }.compare-panel__row i { height:7px; border-radius:99px; background:var(--accent); opacity:.78; }.compare-panel__row i:last-child { width:84%; background:var(--accent-2); }.compare-panel__chart { height:190px; padding:15px; background-image:linear-gradient(rgba(130,173,220,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(130,173,220,.065) 1px,transparent 1px); background-size:100% 43px,70px 100%; }.compare-panel__chart svg { width:100%; height:100%; }.compare-panel__chart path { fill:none; stroke-width:3; vector-effect:non-scaling-stroke; }.compare-panel__chart .baseline { stroke:var(--accent); }.compare-panel__chart .candidate { stroke:var(--accent-2); stroke-width:2; }.compare-panel__legend { display:flex; gap:18px; padding:12px 16px; border-top:1px solid var(--border); color:var(--muted); font-size:.52rem; }.compare-panel__legend span { display:inline-flex; align-items:center; gap:6px; }.compare-panel__legend i { width:9px; height:2px; background:var(--accent); }.compare-panel__legend span:last-child i { background:var(--accent-2); }

/* EMV & cryptography */
.emv-visual { position:relative; min-height:500px; }.emv-card { position:absolute; z-index:3; top:60px; left:20px; width:390px; height:238px; padding:25px; overflow:hidden; border:2px solid rgba(118,191,255,.75); border-radius:25px; background:linear-gradient(145deg,#eef9ff,#a8d8ff 45%,#5e9ee5); color:#0b2d4f; box-shadow:0 35px 70px rgba(0,0,0,.38); transform:rotate(-7deg); }.emv-card__shine { position:absolute; top:-60px; left:-80px; width:350px; height:140px; border-radius:50%; background:rgba(255,255,255,.72); filter:blur(25px); transform:rotate(-18deg); }.emv-card__label { position:relative; display:block; font-size:.56rem; font-weight:900; letter-spacing:.14em; }.emv-chip { position:relative; display:grid; grid-template-columns:1fr 1fr; width:63px; height:49px; margin-top:40px; overflow:hidden; border:1px solid #725016; border-radius:9px; background:linear-gradient(145deg,#ffe99f,#c69835); }.emv-chip i { border-right:1px solid rgba(91,59,8,.6); border-bottom:1px solid rgba(91,59,8,.6); }.emv-card strong { position:relative; display:block; margin-top:27px; font-family:var(--font-mono); font-size:1rem; letter-spacing:.06em; }.emv-card small { position:relative; display:block; margin-top:7px; font-size:.51rem; font-weight:800; letter-spacing:.13em; }.emv-cryptogram { position:absolute; z-index:4; right:4px; bottom:48px; width:325px; padding:22px; border:1px solid var(--border-strong); border-radius:18px; background:rgba(5,16,29,.96); box-shadow:var(--shadow); }.emv-cryptogram > span { color:var(--muted-2); font-size:.52rem; font-weight:850; letter-spacing:.12em; }.emv-cryptogram > b { display:block; margin:11px 0 5px; color:var(--accent-2); font-family:var(--font-mono); font-size:.68rem; }.emv-cryptogram code { display:block; padding:13px; border:1px solid var(--border); border-radius:10px; background:#020b14; color:#9be8ff; font-family:var(--font-mono); font-size:.66rem; letter-spacing:.05em; }.emv-cryptogram > div { display:flex; gap:6px; margin-top:12px; }.emv-cryptogram i { padding:4px 7px; border:1px solid var(--border); border-radius:999px; color:var(--muted); font-size:.49rem; font-style:normal; font-weight:800; }.emv-link { position:absolute; z-index:1; top:240px; left:330px; width:140px; height:100px; border-top:2px dashed var(--accent-2); border-right:2px dashed var(--accent-2); border-radius:0 30px 0 0; transform:rotate(8deg); }.emv-link b { position:absolute; top:-6px; right:-4px; width:9px; height:9px; border-radius:50%; background:var(--accent-2); box-shadow:0 0 14px var(--accent-2); }
.profile-layer-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }.profile-layer { position:relative; min-height:285px; padding:25px; border:1px solid var(--border); border-radius:19px; background:var(--panel); }.profile-layer > span { display:grid; place-items:center; width:43px; height:43px; margin-bottom:55px; border-radius:12px; background:var(--accent-soft); color:var(--accent-2); }.profile-layer > b { position:absolute; top:29px; right:25px; color:var(--muted-2); font-family:var(--font-mono); font-size:.62rem; }.profile-layer h3 { margin-bottom:11px; }.profile-layer p { margin:0; color:var(--muted); font-size:.78rem; }.profile-output { display:grid; grid-template-columns:1fr 1.6fr 1fr; align-items:center; gap:20px; margin-top:22px; }.profile-output > div { display:flex; align-items:center; gap:10px; }.profile-output > div:first-child i { flex:1; height:1px; background:linear-gradient(90deg,transparent,var(--accent)); }.profile-output > div:last-child i { flex:1; height:1px; background:linear-gradient(90deg,var(--accent),transparent); }.profile-output span { display:inline-flex; align-items:center; gap:7px; color:var(--accent-2); font-size:.57rem; font-weight:850; letter-spacing:.1em; }.profile-output > strong { padding:17px; border:1px solid var(--border-strong); border-radius:13px; background:var(--accent-soft); text-align:center; font-size:.77rem; }
.section--cryptogram-flow { padding:130px 0; background:rgba(3,11,21,.34); }.cryptogram-grid { display:grid; grid-template-columns:.95fr 1.05fr; align-items:center; gap:80px; }.cryptogram-copy > p { color:var(--muted); }.cryptogram-copy .check-list { margin:25px 0; font-size:.81rem; }
:root[data-theme="light"] .section--cryptogram-flow { background:rgba(225,238,248,.58); }
.cryptogram-diagram { position:relative; display:grid; gap:32px; padding:27px; border:1px solid var(--border); border-radius:23px; background:var(--panel); box-shadow:var(--shadow); }.cryptogram-diagram__node { position:relative; display:grid; grid-template-columns:45px 1fr auto; align-items:center; column-gap:13px; min-height:92px; padding:14px; border:1px solid var(--border); border-radius:14px; background:rgba(148,168,199,.045); }.cryptogram-diagram__node > span { grid-row:1/4; display:grid; place-items:center; width:43px; height:43px; border-radius:12px; background:var(--accent-soft); color:var(--accent-2); }.cryptogram-diagram__node small { color:var(--muted-2); font-size:.49rem; font-weight:850; letter-spacing:.11em; }.cryptogram-diagram__node b { font-size:.82rem; }.cryptogram-diagram__node code { grid-column:3; grid-row:1/4; color:var(--accent-2); font-family:var(--font-mono); font-size:.55rem; }.cryptogram-diagram__node--host > span { background:var(--cyan-soft); }.cryptogram-diagram__node--verify { border-color:rgba(54,211,153,.28); background:var(--success-soft); }.cryptogram-diagram__node--verify > span { background:var(--success-soft); color:var(--success); }.cryptogram-diagram__node--verify code { color:var(--success); }.cryptogram-arrow { position:absolute; z-index:2; top:117px; left:50%; width:1px; height:28px; background:var(--accent-2); }.cryptogram-arrow::after { position:absolute; bottom:0; left:-3px; width:6px; height:6px; border-right:1px solid var(--accent-2); border-bottom:1px solid var(--accent-2); content:""; transform:rotate(45deg); }.cryptogram-arrow--back { top:241px; background:var(--success); }.cryptogram-arrow--back::after { border-color:var(--success); }
.section--crypto-tools { padding:130px 0; }.crypto-tool-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }.crypto-tool { min-height:280px; padding:26px; border:1px solid var(--border); border-radius:19px; background:var(--panel); }.crypto-tool > span { display:grid; place-items:center; width:44px; height:44px; margin-bottom:48px; border-radius:12px; background:var(--accent-soft); color:var(--accent-2); }.crypto-tool h3 { margin-bottom:12px; }.crypto-tool p { margin:0; color:var(--muted); font-size:.79rem; }
.section--security-boundary { padding:130px 0; background:rgba(3,11,21,.34); }.security-boundary { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:90px; }.security-boundary__copy > p { color:var(--muted); }.security-boundary__copy .check-list { margin-top:25px; font-size:.82rem; }
:root[data-theme="light"] .section--security-boundary { background:rgba(225,238,248,.58); }
.security-boundary__visual { position:relative; min-height:470px; }