.rates-page{
font-variant-numeric:tabular-nums;
}
.rates-page [hidden]{
display:none!important;
}
.rates-page .rates-hero{
display:block;
padding-block:var(--hero-top) var(--space-7);
background:#E4EFFB;
color:#1E3550;
--surface-bg:#E4EFFB;
--surface-heading:#1E3550;
--surface-body:#1E3550;
--surface-muted:#1E3550;
--surface-line:#C9D9EC;
}
.rates-page .rates-hero h1{
max-width:var(--wrap-narrow);
font-size:var(--text-section);
line-height:1.2;
color:#1E3550;
}
.rates-hero-lead{
max-width:var(--wrap-narrow);
margin-top:var(--space-3);
color:#1E3550;
}
.rates-hero-note{
margin-top:var(--space-3);
font-size:var(--text-sm);
color:#1E3550;
}
.rates-entry{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
align-items:start;
gap:var(--space-4);
margin-top:var(--space-6);
padding-top:var(--space-4);
border-top:1px solid #C9D9EC;
}
.rates-entry>div,
.rates-entry>p{
min-width:0;
}
.rates-entry>div{
display:flex;
flex-direction:column;
gap:var(--space-1);
}
.rates-entry span{
font-size:var(--text-sm);
}
.rates-entry strong{
font-family:var(--fm);
font-size:var(--text-section);
line-height:1.2;
font-weight:800;
color:#1C1B19;
overflow-wrap:break-word;
}
.rates-plan-grid,
.rates-period-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-3);
align-items:stretch;
}
.rates-plan{
display:flex;
flex-direction:column;
align-items:stretch;
gap:var(--space-3);
min-width:0;
height:100%;
padding:var(--space-4);
border-radius:var(--r-m);
background:#F5F4F1;
color:#4A4640;
--surface-bg:#F5F4F1;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.rates-plan h3{
margin-top:var(--space-2);
color:#1C1B19;
}
.rates-price{
color:#1C1B19;
font:800 var(--text-section)/1.2 var(--fm);
overflow-wrap:break-word;
}
.rates-price span{
margin-left:var(--space-1);
font:500 var(--text-sm)/1.5 var(--fb);
color:#4A4640;
}
.rates-spec-list{
display:grid;
gap:var(--space-1);
padding-left:var(--space-3);
}
.rates-plan .rates-plan-action{
margin-top:auto;
}
.rates-section-note{
margin-top:var(--space-3);
font-size:var(--text-sm);
line-height:var(--lh-body);
}
.rates-caption{
padding:var(--space-3);
background:#FFFFFF;
color:#4A4640;
text-align:left;
font-size:var(--text-sm);
}
.rates-os-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));
align-items:stretch;
gap:var(--space-3);
}
.rates-os-card{
display:flex;
flex-direction:column;
gap:var(--space-1);
min-width:0;
height:100%;
padding:var(--space-3);
border-radius:var(--r-m);
background:#FFFFFF;
color:#4A4640;
--surface-bg:#FFFFFF;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.rates-os-card h3{
color:#1C1B19;
}
.rates-os-card span{
margin-top:auto;
font-size:var(--text-xs);
color:#625D55;
}
.rates-page .rates-math{
display:grid;
grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
align-items:stretch;
gap:0;
padding:0;
border-radius:var(--r-m);
overflow:hidden;
background:#F5F4F1;
color:#1C1B19;
--surface-bg:#F5F4F1;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.rates-math-lines{
display:flex;
flex-direction:column;
min-width:0;
padding:var(--space-4);
}
.rates-math-lines>div{
display:flex;
flex:1;
flex-wrap:wrap;
justify-content:space-between;
align-items:center;
gap:var(--space-1) var(--space-3);
padding-block:var(--space-2);
min-width:0;
}
.rates-math-lines>div+div{
border-top:1px solid #E6E1D8;
}
.rates-math-lines strong,
.rates-math-total strong{
font-family:var(--fm);
font-variant-numeric:tabular-nums;
}
.rates-math-lines span{
min-width:0;
overflow-wrap:break-word;
}
.rates-math-total{
display:flex;
flex-direction:column;
justify-content:center;
gap:var(--space-3);
min-width:0;
padding:var(--space-4);
background:#FFF1D6;
color:#5A3A00;
--surface-bg:#FFF1D6;
--surface-heading:#5A3A00;
--surface-body:#5A3A00;
--surface-muted:#5A3A00;
--surface-line:#E4D3AF;
}
.rates-math-total>div{
display:flex;
flex-direction:column;
gap:var(--space-1);
min-width:0;
}
.rates-math-total strong{
font-size:var(--text-section);
line-height:1.2;
color:#1C1B19;
overflow-wrap:break-word;
}
.rates-math-total p{
font-size:var(--text-sm);
color:#5A3A00;
}
.rates-period-card{
display:flex;
flex-direction:column;
gap:var(--space-3);
min-width:0;
height:100%;
padding:var(--space-4);
border-radius:var(--r-m);
background:#FFFFFF;
color:#4A4640;
--surface-bg:#FFFFFF;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.rates-period-card h3{
color:#1C1B19;
}
.rates-period-tiles{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-2);
width:100%;
margin:0;
}
.rates-period-tiles>div{
display:flex;
flex-direction:column;
gap:var(--space-1);
min-width:0;
padding:var(--space-3);
border-radius:var(--r-m);
background:#F5F4F1;
color:#1C1B19;
--surface-bg:#F5F4F1;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.rates-period-tiles dt{
color:#4A4640;
overflow-wrap:break-word;
}
.rates-period-tiles dd{
font:800 var(--text-lg)/1.35 var(--fm);
color:#1C1B19;
overflow-wrap:break-word;
}
.rates-action-note{
margin-top:var(--space-3);
font-size:var(--text-sm);
}
.rates-faq details{
background:#FFFFFF;
color:#4A4640;
--surface-bg:#FFFFFF;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.rates-faq details[open] summary{
padding-bottom:var(--space-2);
}
.rates-faq .c-faq-body{
padding-top:var(--space-2);
border-top:1px solid #E6E1D8;
background:#FFFFFF;
color:#4A4640;
}
.rates-final{
padding-bottom:var(--space-close);
}
@media(max-width:64rem){
.rates-entry,
.rates-page .rates-math{
grid-template-columns:minmax(0,1fr);
}
}
@media(max-width:42rem){
.rates-page .rates-hero h1{
font-size:var(--text-section);
}
.rates-plan-grid,
.rates-period-grid{
grid-template-columns:minmax(0,1fr);
}
.rates-plan,
.rates-period-card,
.rates-math-lines,
.rates-math-total{
padding:var(--space-3);
}
.rates-entry strong,
.rates-price,
.rates-math-total strong{
font-size:var(--text-section);
}
.rates-period-tiles{
gap:var(--space-1);
}
.rates-period-tiles>div{
padding:var(--space-2);
}
.rates-period-tiles dd{
font-size:var(--text-base);
}
}