/* Editorial layer for guides and comparisons. Uses only the shared brand tokens. */
.guide-hero{position:relative;padding:clamp(48px,9vw,104px) 0 36px;max-width:920px}.guide-hero::after{content:"";display:block;width:72px;height:4px;margin-top:32px;border-radius:999px;background:var(--primary)}.guide-hero h1{max-width:16ch;font-size:clamp(2.5rem,8vw,4.75rem);letter-spacing:-.065em}.guide-hero .lead{max-width:62ch;margin-top:20px}.guide-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin:24px 0 0;color:var(--muted);font-size:.82rem}.guide-meta span+span{padding-inline-start:18px;border-inline-start:1px solid var(--line)}.guide-meta a{font-weight:750}.guide-hero+.notice{max-width:920px}.guide-body{font-size:1.04rem;line-height:1.78;min-width:0}.guide-body>h2{scroll-margin-top:92px;margin:56px 0 16px;font-size:clamp(1.7rem,4vw,2.4rem);letter-spacing:-.055em}.guide-body>h2:first-child{margin-top:0}.guide-body h3{scroll-margin-top:92px;margin:32px 0 10px}.guide-body p{max-width:68ch}.guide-body ul,.guide-body ol{max-width:68ch;padding-inline-start:1.35rem;margin:0 0 1.5rem}.guide-body li{margin:.6rem 0}.guide-body .notice,.guide-body .callout{margin:28px 0;max-width:68ch}.guide-body .card{margin:28px 0}.article-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;align-items:start}.article-toc{order:-1}.article-toc details{border:1px solid var(--line);border-radius:var(--radius);padding:0;background:var(--surface)}.article-toc summary{min-height:48px;display:flex;align-items:center;padding:12px 16px;list-style:none}.article-toc summary::-webkit-details-marker{display:none}.article-toc summary::after{content:"+";margin-inline-start:auto;color:var(--primary);font-size:1.25rem}.article-toc details[open] summary::after{content:"−"}.article-toc nav{display:grid;gap:2px;padding:0 8px 10px}.article-toc a{display:block;padding:9px 8px;border-radius:var(--radius-sm);color:var(--muted);font-size:.86rem;line-height:1.35;text-decoration:none}.article-toc a:hover{background:var(--primary-soft);color:var(--primary)}.table-scroll{overflow-x:auto;margin:24px 0 32px;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);box-shadow:var(--shadow-soft)}.table-scroll table{width:100%;min-width:620px;border-collapse:collapse;font-size:.9rem;line-height:1.45}.table-scroll th,.table-scroll td{padding:14px 16px;text-align:start;vertical-align:top;border-bottom:1px solid var(--line)}.table-scroll th{color:var(--muted);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;background:var(--surface)}.table-scroll tr:last-child td{border-bottom:0}.example{border-inline-start:4px solid var(--primary);background:var(--surface)}.example-label{color:var(--primary);font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.correction{display:grid;gap:12px;max-width:68ch}.correction>div{padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}.do{color:var(--ok);font-weight:750}.avoid{color:var(--bad);font-weight:750}.sources{margin-top:56px;max-width:760px;background:var(--surface)}.sources h2{margin-top:0;font-size:1.65rem}.sources ol,.sources ul{padding-inline-start:1.4rem}.sources li{overflow-wrap:anywhere;margin:.7rem 0}.sources li::marker{color:var(--primary);font-weight:800}.cta-card{margin:48px 0 8px;max-width:760px;background:var(--night);color:var(--night-ink);border-color:var(--night);box-shadow:var(--shadow-raised)}.cta-card p{color:#C3CADB}.cta-card h2{margin:0 0 10px}.related{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.related a{display:inline-flex;min-height:44px;align-items:center;padding:8px 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none;background:var(--bg)}.hub-grid{grid-template-columns:1fr}.hub-grid .card{position:relative;min-height:150px;display:flex;align-items:flex-start;padding:22px;overflow:hidden}.hub-grid .card::before{content:"";width:32px;height:4px;margin-bottom:28px;border-radius:999px;background:var(--primary);position:absolute;inset-block-start:0;inset-inline-start:22px}.hub-grid .card.tap>span:first-child{padding-top:14px}.hub-grid h2{font-size:1.28rem;margin-bottom:8px}.hub-grid p{color:var(--muted);margin:0;max-width:34ch}.hub-grid [data-icon]{color:var(--primary);flex:0 0 auto;margin-top:16px}.back-link{display:inline-flex;min-height:44px;align-items:center;font-weight:700}.comparison-article .guide-body>h2{margin-top:48px}.comparison-article .table-scroll table{min-width:680px}.verdict{max-width:760px;margin:28px 0 8px;box-shadow:var(--shadow-soft)}.verdict strong{display:block;margin-bottom:4px;font-family:var(--font-heading);font-size:1.12rem}.verdict p:last-child{margin-bottom:0}
@media (min-width:700px){.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.article-layout{grid-template-columns:220px minmax(0,760px);gap:64px}.article-toc{order:0;position:sticky;top:92px}.article-toc details{background:transparent;border:0}.article-toc summary{padding:0 0 12px;min-height:0;color:var(--ink);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase}.article-toc summary::after{display:none}.article-toc nav{padding:0;border-inline-start:1px solid var(--line)}.article-toc a{padding:8px 12px;border-radius:0}.article-toc a:hover{border-inline-start:2px solid var(--primary);margin-inline-start:-1px}}
@media (max-width:699px){.guide-meta span+span{padding-inline-start:0;border-inline-start:0}}
@media (max-width:560px){.comparison-article .table-scroll{overflow:visible;border:0;box-shadow:none;background:transparent}.comparison-article .table-scroll table{min-width:0;display:block}.comparison-article .table-scroll thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.comparison-article .table-scroll tbody,.comparison-article .table-scroll tr,.comparison-article .table-scroll td{display:block}.comparison-article .table-scroll tr{margin:12px 0;padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);box-shadow:var(--shadow-soft)}.comparison-article .table-scroll td{display:grid;grid-template-columns:minmax(92px,.45fr) 1fr;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}.comparison-article .table-scroll td:last-child{border-bottom:0}.comparison-article .table-scroll td::before{content:attr(data-label);color:var(--muted);font-size:.7rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase}}

/* Content-page refinements: keep endcaps and hub cards aligned to the grid. */
.sources,.cta-card{margin-inline:auto}
.hub-grid .card{min-height:128px}
.hub-grid [data-icon]{display:none}
.comparison-index .guide-hero h1{font-size:clamp(2.5rem,6vw,4.25rem);max-width:20ch}
@media (max-width:560px){.article-page .table-scroll{overflow:visible;border:0;box-shadow:none;background:transparent}.article-page .table-scroll table{min-width:0;display:block}.article-page .table-scroll thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.article-page .table-scroll tbody,.article-page .table-scroll tr,.article-page .table-scroll td{display:block}.article-page .table-scroll tr{margin:12px 0;padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);box-shadow:var(--shadow-soft)}.article-page .table-scroll td{display:grid;grid-template-columns:minmax(92px,.45fr) 1fr;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}.article-page .table-scroll td:last-child{border-bottom:0}.article-page .table-scroll td::before{content:attr(data-label);color:var(--muted);font-size:.7rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase}}
@media (max-width:560px){.article-page .table-scroll{width:100%;max-width:100%;overflow:clip}.article-page .table-scroll tbody,.article-page .table-scroll tr,.article-page .table-scroll td{min-width:0}.article-page .table-scroll td{grid-template-columns:minmax(0,.45fr) minmax(0,1fr);overflow-wrap:anywhere}}
/* Card view on phones: each cell already shows its label, so drop the visually hidden header row from layout entirely. */
@media (max-width:560px){.article-page .table-scroll thead,.comparison-article .table-scroll thead{display:none}}
