.plans-hero[data-hero-form="gradient-motion"]{
background:#2C3136;
background-image:linear-gradient(120deg,#2E6F8E 0%,#2C3136 62%,#22262A 100%);
color:#F3F5F6;
--mute-d:#D3DCE1;
--hair-d:rgba(243,245,246,.18);
padding-block:var(--hero-top) var(--space-5);
}
.plans-hero .plans-hero-grid{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
align-items:start;
gap:var(--space-4);
}
.plans-hero-grid>*{
min-width:0;
}
.plans-hero .plans-hero-copy{
min-width:0;
text-align:left;
}
.plans-hero .plans-hero-copy h1{
color:#F3F5F6;
font-size:clamp(2rem,3.5vw,3.2rem);
line-height:1.15;
}
.plans-hero .plans-hero-lead{
margin-top:var(--space-3);
color:#F3F5F6;
max-width:none;
}
.plans-product{
margin-top:var(--space-3);
}
.plans-product>svg{
width:100%;
height:auto;
}
.plans-product figcaption{
display:flex;
flex-wrap:wrap;
justify-content:space-between;
gap:var(--space-1) var(--space-2);
color:#F3F5F6;
}
.plans-product figcaption span{
color:#D3DCE1;
}
.plans-product figcaption strong{
font-weight:600;
}
.plans-hero .plans-hero-note{
margin-top:var(--space-3);
margin-bottom:var(--space-3);
font-size:var(--text-sm);
color:#D3DCE1;
}
.plans-hero .plans-rate-card{
height:auto;
max-width:none;
width:100%;
padding:var(--space-3);
border-radius:var(--r-m);
background:#FBFBFA;
color:#22262A;
--mute-l:#555B60;
--mute-d:#555B60;
--hair-l:rgba(34,38,42,.14);
--hair-d:rgba(34,38,42,.14);
text-align:left;
}
.plans-hero .plans-rate-card h2{
font-size:var(--text-section);
color:#22262A;
}
.plans-hero .plans-rate-heading>p{
margin-top:var(--space-1);
color:#555B60;
font-size:var(--text-sm);
}
.plans-period-field{
margin-top:var(--space-3);
padding:0;
border:0;
min-width:0;
}
.plans-period-field legend{
margin-bottom:var(--space-1);
font-size:var(--text-sm);
font-weight:700;
}
.plans-period-options{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.plans-period-options .c-choice{
flex-direction:column;
gap:var(--field-gap);
}
.plans-period-options .c-choice input{
margin:0;
}
.plans-period-options .c-choice>span{
min-width:0;
overflow-wrap:break-word;
}
.plans-selected{
display:grid;
gap:var(--field-gap);
margin-top:var(--space-3);
padding-top:var(--space-3);
border-top:1px solid rgba(34,38,42,.14);
}
.plans-hero .plans-selected>p{
color:#555B60;
}
.plans-hero .plans-selected .plans-selected-price{
display:flex;
flex-wrap:wrap;
align-items:baseline;
gap:var(--space-1);
font-family:var(--f-mono);
font-variant-numeric:tabular-nums;
font-size:var(--text-section);
line-height:var(--leading-title);
color:#22262A;
}
.plans-selected-price span+span{
font-size:var(--text-base);
}
.plans-selected #plans-period-note{
font-size:var(--text-sm);
}
.plans-hero .plans-rate-foot{
margin-top:var(--space-3);
font-size:var(--text-xs);
color:#555B60;
}
.plans-section-head{
margin-bottom:var(--space-4);
}
.plans-section-head>p{
max-width:54rem;
margin-top:var(--space-2);
}
.plans-spec-sheet{
display:grid;
grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
align-items:start;
gap:var(--space-4);
padding:var(--space-4);
border-radius:var(--r-m);
background:#F1EEE7;
color:#22262A;
--mute-l:#555B60;
--mute-d:#555B60;
--hair-l:rgba(34,38,42,.14);
--hair-d:rgba(34,38,42,.14);
}
.plans-spec-sheet>*{
min-width:0;
}
.plans-spec-label>p{
margin-top:var(--space-1);
font-size:var(--text-sm);
color:#555B60;
}
.plans-spec-list>div{
display:grid;
grid-template-columns:minmax(9rem,.75fr) minmax(0,1fr);
gap:var(--space-2);
padding-block:var(--space-2);
border-bottom:1px solid rgba(34,38,42,.14);
}
.plans-spec-list dt,.plans-spec-list dd{
min-width:0;
margin:0;
overflow-wrap:break-word;
}
.plans-spec-list dt{
font-size:var(--text-sm);
color:#555B60;
}
.plans-spec-list dd{
font-size:var(--text-sm);
color:#22262A;
}
.plans-section-note{
margin-top:var(--space-3);
font-size:var(--text-sm);
}
.plans-addon-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
.plans-addon-prices dd{
margin:var(--space-1) 0 0;
font-family:var(--f-mono);
font-variant-numeric:tabular-nums;
font-size:var(--text-base);
overflow-wrap:break-word;
}
.plans-addon-prices dt{
font-size:var(--text-xs);
color:#555B60;
}
.plans-card-foot{
margin-top:auto;
font-size:var(--text-sm);
overflow-wrap:break-word;
}
.plans-table-gap{
margin-top:var(--space-4);
}
.plans-page caption{
padding:var(--space-2) var(--space-3);
background:#FBFBFA;
color:#555B60;
text-align:left;
font-size:var(--text-sm);
line-height:var(--leading-small);
}
.plans-page .c-table td{
font-variant-numeric:tabular-nums;
}
.plans-page .plans-faq details{
background:#2C3136;
color:#F3F5F6;
}
.plans-page .plans-faq details[open]>summary{
padding-bottom:var(--space-2);
}
.plans-page .plans-faq details>div{
padding-top:var(--space-2);
border-top:1px solid rgba(243,245,246,.12);
background:#2C3136;
color:#C1C9CF;
}
.plans-page .plans-faq details>div p{
color:#C1C9CF;
}
.plans-final-section{
padding-bottom:var(--space-close);
}
.plans-closing.c-closing{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
align-items:center;
gap:var(--space-4);
padding:var(--space-4);
border-radius:var(--r-m);
background:#2C3136;
color:#F3F5F6;
--mute-d:#C1C9CF;
--hair-d:rgba(243,245,246,.12);
}
.plans-closing .plans-closing-copy{
min-width:0;
text-align:left;
}
.plans-closing-copy h2{
font-size:var(--text-section);
line-height:var(--leading-title);
color:#F3F5F6;
}
.plans-closing-copy p{
margin-top:var(--space-2);
font-size:var(--text-base);
color:#C1C9CF;
}
.plans-closing .plans-closing-actions{
flex-direction:column;
align-items:center;
justify-content:center;
margin-top:var(--space-3);
}
.plans-page main [hidden]{
display:none!important;
}
@media(max-width:64rem){
.plans-hero .plans-hero-grid{
grid-template-columns:minmax(0,1fr);
}
.plans-product{
max-width:40rem;
}
.plans-addon-grid{
grid-template-columns:minmax(0,1fr);
}
.plans-spec-sheet{
grid-template-columns:minmax(0,1fr);
}
}
@media(max-width:42rem){
.plans-hero .plans-rate-card{
padding:var(--space-3);
height:auto;
}
.plans-period-options{
grid-template-columns:minmax(0,1fr);
}
.plans-period-options .c-choice{
flex-direction:row;
}
.plans-spec-sheet{
padding:var(--space-3);
}
.plans-spec-list>div{
grid-template-columns:minmax(0,1fr);
gap:var(--field-gap);
}
.plans-closing.c-closing{
grid-template-columns:minmax(0,1fr);
padding:var(--space-3);
gap:var(--space-3);
}
.plans-closing .plans-closing-actions{
align-items:stretch;
margin-top:var(--space-3);
}
}
