/* Extracted repeated page-family styles: xroad-consumer-category.css */

/* xroad-consumer-category */

/* body{line-height:1.55;} */
.wrap{max-width:1000px;margin:0 auto;padding:60px 28px 80px;}
.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:700;color:var(--purple-vivid);text-transform:uppercase;}
h1{font-size:36px;line-height:1.1;margin:10px 0 14px;font-weight:800;letter-spacing:-.02em;}
.sub{font-size:15.5px;color:var(--text-mid);max-width:780px;}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:32px 0 8px;}
.card{background:var(--bg-3);border:1px solid var(--line);border-radius:10px;padding:16px 18px;}
.card .k{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);font-weight:600;}
.card .v{font-size:25px;font-weight:800;margin-top:6px;color:var(--purple);font-variant-numeric:tabular-nums;}
h2{font-size:21px;font-weight:800;margin:46px 0 4px;letter-spacing:-.01em;}
.intro{font-size:14px;color:var(--text-dim);margin:0 0 18px;max-width:760px;}
.diet{display:flex;flex-direction:column;gap:9px;}
.diet .row{display:grid;grid-template-columns:240px 1fr 70px;gap:12px;align-items:center;font-size:13.5px;}
.diet .lbl{font-weight:600;color:var(--text);} .diet .lbl .flag{font-weight:500;color:var(--sunset);font-size:11px;}
.diet .barwrap{background:var(--bg-2);border-radius:5px;height:12px;overflow:hidden;}
.diet .bar{height:12px;background:linear-gradient(90deg,var(--purple),var(--purple-vivid));border-radius:5px;}
.diet .pct{text-align:right;font-variant-numeric:tabular-nums;color:var(--text-mid);font-weight:600;}
table.cons{width:100%;border-collapse:collapse;font-size:13.5px;margin-top:6px;}
table.cons thead th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);font-weight:700;padding:9px 12px;border-bottom:2px solid var(--line);}
table.cons thead th.r{text-align:right;}
table.cons tr.row{cursor:pointer;border-bottom:1px solid var(--line);transition:background .12s;}
table.cons tr.row:hover{background:var(--purple-tint);}
table.cons td{padding:10px 12px;vertical-align:middle;font-variant-numeric:tabular-nums;}
table.cons td.r{text-align:right;}
.rank{color:var(--text-dim);font-weight:600;}
.cname{font-weight:700;color:var(--purple);}
.badge{display:inline-block;font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;background:var(--bg-2);color:var(--text-mid);margin-left:6px;}
.badge.heur{background:#fdeee6;color:var(--sunset);}
.chev{display:inline-block;transition:transform .2s;color:var(--text-dim);margin-right:7px;font-size:10px;}
tr.row.open .chev{transform:rotate(90deg);color:var(--purple);}
tr.detail td{padding:0;border-bottom:1px solid var(--line);}
tr.detail .panel{max-height:0;overflow:hidden;transition:max-height .35s ease;background:var(--bg-3);}
tr.detail.open .panel{max-height:900px;}
.panel-inner{padding:18px 26px 24px;}
.panel-inner .ph{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);font-weight:700;margin:0 0 10px;}
.hourly{display:flex;align-items:flex-end;gap:3px;height:120px;margin-top:8px;}
.hourly .h{flex:1;background:linear-gradient(180deg,var(--purple-vivid),var(--purple));border-radius:3px 3px 0 0;min-height:2px;}
.hourly-x{display:flex;justify-content:space-between;font-size:10px;color:var(--text-dim);margin-top:4px;}
.insights{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:8px;}
.insight{background:var(--bg-3);border:1px solid var(--line);border-radius:10px;padding:18px 20px;}
.insight .num{font-size:22px;font-weight:800;color:var(--purple);}
.insight h4{margin:6px 0 6px;font-size:15px;}
.insight p{margin:0;font-size:13px;color:var(--text-mid);line-height:1.55;}
.back{display:inline-block;margin-top:34px;font-size:13px;color:var(--purple-vivid);text-decoration:none;font-weight:600;}
.back:hover{text-decoration:underline;}
#xr-lang a{padding:6px 10px;border-radius:4px;color:var(--purple);text-decoration:none;}
#xr-lang .xr-on{padding:6px 10px;border-radius:4px;background:var(--purple);color:#fff;}
.foot{margin-top:40px;border-top:1px dashed var(--line);padding-top:12px;font-size:11px;color:var(--text-dim);line-height:1.6;}
@media(max-width:760px){.cards{grid-template-columns:repeat(2,1fr);}.insights{grid-template-columns:1fr;}.diet .row{grid-template-columns:140px 1fr 54px;}h1{font-size:28px;}}
