.compare-page{
color:#33252F;
}
.compare-page [hidden]{
display:none!important;
}
.compare-page .compare-hero{
display:block;
padding-block:var(--hero-top) var(--hero-bottom);
background:#FBF8F6;
color:#1A0E17;
}
.compare-hero>.container{
display:block;
}
.compare-hero-copy{
min-width:0;
text-align:left;
}
.compare-page .compare-kicker{
margin-bottom:var(--space-4);
line-height:1;
letter-spacing:0;
}
.compare-page .compare-hero h1{
max-width:none;
margin:0;
color:#1A0E17;
font-size:clamp(2.5rem,4vw,3.2rem);
line-height:1.25;
}
.compare-lead{
max-width:52rem;
margin-top:var(--space-4);
color:#655761;
font-size:var(--text-base);
line-height:var(--lh-body);
}
.compare-page .compare-hero-actions{
justify-content:flex-start;
margin-top:var(--space-5);
}
.compare-hero-note{
margin-top:var(--space-4);
color:#655761;
font-size:var(--text-sm);
font-variant-numeric:tabular-nums;
}
.compare-principles{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:var(--space-4);
margin-top:var(--space-7);
}
.compare-principles>div{
display:flex;
align-items:flex-start;
gap:var(--space-3);
min-width:0;
padding:var(--space-4);
border-radius:var(--r-m);
background:#F4EFEB;
color:#33252F;
}
.compare-index{
flex:none;
font:600 var(--text-sm)/var(--lh-body) var(--fm);
color:#655761;
}
.compare-principles p{
display:grid;
gap:var(--space-2);
min-width:0;
}
.compare-principles strong{
font-size:var(--text-base);
color:#1A0E17;
}
.compare-principles p>span{
font-size:var(--text-sm);
color:#655761;
}
.compare-section{
padding-block:var(--section-space);
}
.compare-paper{
background:#FFFFFF;
color:#33252F;
}
.compare-cream{
background:#F8EFD9;
color:#4F3A05;
}
.compare-ice{
background:#EAEFFB;
color:#1F3366;
}
.compare-head{
max-width:56rem;
margin-bottom:var(--space-6);
}
.compare-head h2{
font-size:clamp(2rem,3vw,2.5rem);
line-height:var(--lh-tight);
}
.compare-head>p{
margin-top:var(--space-3);
line-height:var(--lh-body);
}
.compare-cream .compare-head h2{
color:#352603;
}
.compare-ice .compare-head h2{
color:#132248;
}
.compare-page .compare-table{
display:table;
width:100%;
min-width:52rem;
table-layout:auto;
background:#FFFFFF;
color:#1A0E17;
}
.compare-table th,
.compare-table td{
text-align:left;
overflow-wrap:break-word;
}
.compare-table tbody td{
font-family:var(--fb);
}
.compare-table th:first-child{
width:12%;
min-width:8rem;
}
.compare-table td{
min-width:11rem;
}
.compare-page .compare-table .is-highlight{
background:#E6F2EE;
color:#14453A;
}
.compare-note{
margin-top:var(--space-4);
font-size:var(--text-sm);
line-height:var(--lh-body);
}
.compare-cost-layout{
display:grid;
grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
align-items:start;
gap:var(--space-6);
}
.compare-cost-layout>*{
min-width:0;
}
.compare-cost-card{
display:flex;
flex-direction:column;
align-items:stretch;
gap:var(--space-4);
padding:var(--card-padding);
border-radius:var(--r-m);
background:#FFFFFF;
color:#1A0E17;
}
.compare-cost-card h3{
font-size:var(--text-card);
}
.compare-cost-card .c-price-tiles{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.compare-cost-card .c-price-tiles dd{
font-size:var(--text-card);
}
.compare-cost-card>p{
color:#655761;
font-size:var(--text-sm);
}
.compare-cost-card>.c-btn{
margin-top:auto;
align-self:flex-start;
}
.compare-cost-explanation{
display:grid;
gap:var(--space-3);
align-content:start;
}
.compare-cost-explanation h3{
color:#352603;
}
.compare-formula{
padding:var(--space-4);
border-radius:var(--r-m);
background:#FFFFFF;
color:#4F3A05;
}
.compare-formula p{
margin-top:var(--space-2);
}
.compare-latency{
min-width:0;
}
.compare-data-notice{
display:grid;
gap:var(--space-2);
padding:var(--space-4);
margin-bottom:var(--space-4);
border-radius:var(--r-m);
background:#F4EFEB;
color:#33252F;
}
.compare-data-notice p{
font-size:var(--text-sm);
color:#655761;
}
.compare-page .compare-latency-table{
min-width:40rem;
}
.compare-page .compare-latency-table th,
.compare-page .compare-latency-table td{
text-align:left;
}
.compare-latency-table tbody td{
font-family:var(--fm);
font-variant-numeric:tabular-nums;
}
.compare-latency-table td{
min-width:6rem;
}
.compare-card-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));
gap:var(--space-4);
align-items:stretch;
}
.compare-network-cards{
margin-top:var(--space-6);
}
.compare-info-card{
display:flex;
flex-direction:column;
gap:var(--space-3);
height:100%;
min-width:0;
padding:var(--card-padding);
border-radius:var(--r-m);
background:#F4EFEB;
color:#33252F;
}
.compare-info-card h3{
color:#1A0E17;
font-size:var(--text-card);
line-height:var(--lh-card);
}
.compare-info-card p{
font-size:var(--text-base);
line-height:var(--lh-body);
}
.compare-card-foot{
display:block;
margin-top:auto;
color:#655761;
font-size:var(--text-sm);
line-height:var(--lh-body);
}
.compare-ice .compare-info-card{
background:#FFFFFF;
color:#33252F;
}
.compare-sla{
display:grid;
gap:var(--space-4);
}
.compare-sla-top{
display:grid;
grid-template-columns:minmax(0,.6fr) minmax(0,1fr);
align-items:start;
gap:var(--space-5);
}
.compare-sla-top>*{
min-width:0;
}
.compare-sla .compare-sla-label{
margin-bottom:var(--space-2);
color:#655761;
font-size:var(--text-sm);
}
.compare-sla .c-sla-number{
font-size:clamp(2.5rem,4vw,3.2rem);
}
.compare-sla .compare-sla-top>p{
font-size:var(--text-base);
color:#655761;
}
.compare-record-state{
display:grid;
gap:var(--space-2);
padding:var(--space-4);
border-radius:var(--r-m);
background:#F4EFEB;
color:#33252F;
}
.compare-record-state p{
color:#655761;
}
.compare-sla>.c-btn{
justify-self:start;
}
.compare-benchmark{
margin-top:var(--space-6);
}
.compare-benchmark-head{
display:grid;
gap:var(--space-2);
margin-bottom:var(--space-4);
}
.compare-benchmark-head h3{
color:#132248;
font-size:var(--text-card);
}
.compare-benchmark-head p{
color:#4A5C89;
}
.compare-benchmark .compare-table tbody td{
font-family:var(--fm);
font-variant-numeric:tabular-nums;
}
.compare-fit-card{
background:#FBF8F6;
color:#33252F;
}
.compare-closing-section{
padding-block:var(--section-space) var(--space-close);
background:#FBF8F6;
color:#33252F;
}
.compare-closing{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(12rem,.38fr);
align-items:center;
gap:var(--space-7);
padding:var(--space-7);
border-radius:var(--r-l);
background:#1A0E17;
color:#FBF8F6;
}
.compare-closing>*{
min-width:0;
}
.compare-closing-label{
display:block;
margin-bottom:var(--space-4);
font-size:var(--text-sm);
color:#B8A7B3;
}
.compare-closing h2{
color:#FBF8F6;
font-size:clamp(1.75rem,2.5vw,2.5rem);
line-height:1.3;
}
.compare-closing p{
max-width:44rem;
margin-top:var(--space-3);
color:#B8A7B3;
}
.compare-closing-actions{
display:flex;
flex-direction:column;
align-items:stretch;
gap:var(--space-3);
}
.compare-closing .c-btn--ghost{
background:#1A0E17;
color:#FBF8F6;
box-shadow:inset 0 0 0 1px rgba(251,248,246,.45);
}
.compare-closing .c-btn--ghost:hover{
background:#33252F;
color:#FBF8F6;
}
@media(max-width:64rem){
.compare-cost-layout{
grid-template-columns:minmax(0,1fr);
}
.compare-closing{
grid-template-columns:minmax(0,1fr);
}
.compare-closing-actions{
width:100%;
max-width:24rem;
}
}
@media(max-width:42rem){
.compare-principles{
grid-template-columns:minmax(0,1fr);
}
.compare-page .compare-hero h1{
font-size:2.5rem;
}
.compare-sla-top{
grid-template-columns:minmax(0,1fr);
}
.compare-closing{
padding:var(--space-4);
gap:var(--space-5);
}
.compare-page .compare-hero-actions{
align-items:stretch;
}
.compare-hero-actions>.c-btn{
width:100%;
}
.compare-closing-actions{
max-width:none;
}
}