.compare-hub{max-width:1180px;margin-inline:auto;padding:28px 24px 64px;color:#182235}
.compare-shortlist{--site-h2:19px}.compare-hub .compare-shortlist h2{font-size:19px;line-height:1.3;letter-spacing:-.015em}.compare-mobile-action{display:none}
.compare-hub [hidden]{display:none!important}.compare-hub .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.compare-hub-header{max-width:780px;margin:32px 0}.compare-hub-header h1{font-size:clamp(30px,3.5vw,46px);line-height:1.12;letter-spacing:-.04em;margin:12px 0 16px}.compare-hub-header>p:last-child{color:#58687e;font-size:18px;line-height:1.65;max-width:650px}
.compare-hub fieldset{border:0;padding:0;margin:0}.compare-category-field legend{font-size:18px;font-weight:700;margin-bottom:16px}.compare-category-field legend>span{display:inline-grid;place-items:center;border:1px solid #dce1e8;border-radius:50%;width:28px;height:28px;margin-right:8px;font-size:14px}
.compare-categories{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}.compare-category{position:relative;display:flex;align-items:flex-start;gap:12px;padding:22px;border:1px solid #dce1e8;border-radius:14px;background:#fff;cursor:pointer}.compare-category:has(input:checked){border-color:#2563eb;box-shadow:0 0 0 1px #2563eb}.compare-category input{width:18px;height:18px;flex:none;margin-top:4px;accent-color:#2563eb}.compare-category>span{display:grid;grid-template-columns:1fr auto;gap:7px 16px;min-width:0}.compare-category strong{font-size:19px;line-height:1.4}.compare-category small{align-self:center;font-size:13px;white-space:nowrap;color:#58687e}.compare-category>span>span{grid-column:1/-1;color:#58687e;font-size:14px;line-height:1.6}
.compare-hub .portfolio-bar{margin:24px 0 36px;padding:16px 20px;box-shadow:none}.compare-hub .portfolio-bar>p{font-size:13px}.compare-picker-layout{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:28px;align-items:start}.compare-picker-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}.compare-picker-heading h2{font-size:25px;line-height:1.25;margin:6px 0 0;letter-spacing:-.025em}.compare-picker-heading .eyebrow{font-size:11px;margin:0;color:#58687e}.compare-picker-heading>span{font-size:13px;white-space:nowrap;color:#58687e}
.compare-search{display:block;font-size:14px;font-weight:650;margin-bottom:20px}.compare-search input{display:block;box-sizing:border-box;width:100%;min-height:46px;margin-top:8px;padding:10px 14px;border:1px solid #cbd5e1;border-radius:9px;background:#fff;font:inherit;color:#182235}
.compare-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.compare-option{display:flex;flex-direction:column;border:1px solid #dce1e8;border-radius:12px;background:#fff;min-width:0;overflow:hidden}.compare-option:has(input:checked){border-color:#2563eb;box-shadow:0 0 0 1px #2563eb}.compare-option>label{display:flex;gap:12px;align-items:flex-start;padding:18px 18px 10px;cursor:pointer;flex:1}.compare-option input{width:18px;height:18px;flex:none;accent-color:#2563eb;margin-top:7px}.compare-option-content{display:flex;flex-direction:column;gap:10px;min-width:0}.compare-option-content img{object-fit:contain;object-position:left;width:88px;height:36px}.compare-option-content strong{font-size:16px;line-height:1.35}.compare-option-content>span{font-size:13px;line-height:1.6;color:#58687e}.compare-option>a{margin:0 18px 8px 48px;display:inline-flex;align-items:center;min-height:44px;font-size:13px;width:fit-content}.compare-option:has(input:disabled):not(:has(input:checked)){background:#f8fafc}.compare-option:has(input:disabled)>label{cursor:default}
.compare-shortlist{position:sticky;top:24px;border:1px solid #dce1e8;border-radius:14px;padding:22px;background:#fff}.compare-shortlist-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.compare-shortlist h2{font-size:19px;margin:0}.compare-shortlist button:not(.button),.compare-empty button{border:0;background:none;color:#2563eb;min-height:44px;font:inherit;cursor:pointer;padding:8px}.compare-shortlist button:disabled{cursor:default;opacity:.55}.compare-shortlist [data-hub-count]{color:#58687e;font-size:13px;margin:4px 0 18px}.compare-shortlist ul{list-style:none;padding:0;margin:0}.compare-shortlist li{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #e7ebf0;padding:8px 0;font-size:14px;font-weight:600}.compare-shortlist li button{font-size:24px!important;min-width:44px}.compare-shortlist [data-hub-help]{font-size:14px;color:#58687e;line-height:1.6;min-height:45px;margin:20px 0 16px}.compare-shortlist .button{width:100%;justify-content:center;min-height:48px;border-radius:9px;font-weight:650}.compare-shortlist-note{font-size:12px;line-height:1.5;color:#58687e;text-align:center;margin:12px 0 0}.compare-empty{padding:30px;border:1px dashed #cbd5e1;border-radius:12px;background:#fff}.compare-empty h3{margin:0 0 8px}.compare-browse{border-top:1px solid #e4e7eb;padding-top:28px;margin-top:40px}.compare-browse h2{font-size:20px}.compare-browse ul{padding-left:20px;line-height:2}.compare-hub :is(input,button,a):focus-visible{outline:3px solid #2563eb;outline-offset:4px}
@media(max-width:850px){.compare-picker-layout{grid-template-columns:minmax(0,1fr)}.compare-shortlist{position:static}.compare-shortlist ul{display:flex;flex-wrap:wrap;gap:6px 18px}.compare-shortlist li{flex:1 1 180px}.compare-shortlist .button{max-width:100%}.compare-categories{grid-template-columns:1fr 1fr}.compare-category{padding:16px}.compare-category>span{display:flex;flex-direction:column;gap:4px}.compare-category small{align-self:flex-start}}
@media(max-width:560px){.compare-hub{padding:20px 18px 40px}.compare-hub-header{margin:24px 0}.compare-hub-header>p:last-child{font-size:16px}.compare-categories,.compare-options{grid-template-columns:1fr}.compare-category strong{font-size:17px}.compare-category>span{display:grid;grid-template-columns:1fr auto;width:100%}.compare-category small{align-self:center}.compare-category>span>span{grid-column:1/-1}.compare-picker-heading{align-items:flex-start}.compare-picker-heading h2{font-size:23px}.compare-picker-heading>span{padding-top:3px}.compare-shortlist{padding:18px}.compare-hub .portfolio-bar{padding:16px}.compare-option-content img{height:32px}.compare-option-content>span{font-size:14px}}
@media(max-width:850px){.compare-hub{padding-bottom:110px}.compare-mobile-action{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:20;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px max(12px,env(safe-area-inset-bottom));background:#fff;border-top:1px solid #dce1e8;box-shadow:0 -4px 16px #18223508}.compare-mobile-action>span{font-size:13px;white-space:nowrap}.compare-mobile-action .button{min-height:46px;font-size:14px;flex:1;max-width:270px;justify-content:center}.compare-hub input{scroll-margin-block:100px}.compare-hub:has(.compare-mobile-action:not([hidden])){scroll-padding-bottom:100px}}

/* Shared comparison layout: no directory navigation. */
body .directory-layout.comparison-layout{display:block;grid-template-columns:minmax(0,1fr)}
body .comparison-layout>.directory-layout-content{min-width:0;padding:0}
body .comparison-layout>.directory-layout-content>main{display:block;width:100%;max-width:none;margin:0;padding:24px 0 64px}
body .comparison-layout main>.site-breadcrumbs{padding:0;margin:0 0 24px}
body .comparison-layout main>:is(.comparison-hero,.hero.compact){padding:0;margin:0 0 32px}
body .comparison-layout main .table-scroll{max-width:100%;overflow-x:auto}
@media(max-width:600px){
body .comparison-layout>.directory-layout-content>main{padding-top:16px}
body .comparison-layout main .table-scroll{container-type:inline-size;scroll-padding-left:104px}
body .comparison-layout .table-scroll>table{
  --comparison-label:clamp(88px,28cqw,104px);
  --comparison-product:clamp(160px,calc(100cqw - var(--comparison-label) - 32px),200px);
  width:calc(var(--comparison-label) + var(--comparison-product)*var(--products,2));
  min-width:0;table-layout:fixed
}
body .comparison-layout .table-scroll>table th,body .comparison-layout .table-scroll>table td{padding:16px 12px;overflow-wrap:anywhere}
body .comparison-layout .table-scroll>table thead th:first-child{width:var(--comparison-label);padding-inline:10px}
body .comparison-layout .table-scroll>table tbody th[scope=row]{padding-inline:10px}
body .comparison-layout .table-scroll>table thead th:not(:first-child){width:var(--comparison-product);font-size:16px}
body .comparison-layout .table-scroll>table :is(thead th:first-child,tbody th[scope=row]){box-shadow:3px 0 6px #0000000a}
body .comparison-layout .table-scroll>table .table-section td{padding:12px}
body .comparison-layout .table-scroll>table .table-section strong{display:block;position:sticky;left:12px;width:max-content;max-width:calc(100cqw - 24px)}
}
/* End shared comparison layout. */
