.pr-page{
overflow-x:clip;
}
.pr-page [hidden]{
display:none!important;
}
.pr-page :is(article,aside,section,div,dt,dd){
min-width:0;
}
.pr-page :is(h1,h2,h3,p,dt,dd,li){
overflow-wrap:break-word;
}
.pr-page h3{
font-size:var(--text-lg);
line-height:1.35;
}
.pr-page .pr-hero{
padding-block:var(--hero-pad) var(--space-8);
background:var(--hero-gradient);
color:#E7EBEE;
--muted:#D6DDE4;
--line:rgba(255,255,255,.18);
--line-soft:rgba(255,255,255,.08);
}
.pr-page .pr-hero-grid{
display:grid;
grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
gap:var(--space-8);
align-items:start;
}
.pr-page .pr-hero-copy{
display:block;
min-width:0;
padding:0;
text-align:left;
}
.pr-hero-copy h1{
max-width:none;
margin-inline:0;
color:#F1F4F5;
}
.pr-hero-lead{
max-width:38.75rem;
margin-top:var(--space-4);
font-size:var(--text-md);
line-height:1.7;
color:#E7EBEE;
}
.pr-hero-lead strong{
font-weight:var(--weight-medium);
}
.pr-period-control{
margin-top:var(--space-5);
}
.pr-control-label{
font-size:var(--text-sm);
color:#E7EBEE;
}
.pr-periods{
display:inline-flex;
flex-wrap:wrap;
gap:var(--space-2);
margin-top:var(--field-gap);
}
.pr-period{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:2.75rem;
padding:var(--space-2) var(--space-4);
border:1px solid rgba(255,255,255,.45);
border-radius:var(--r-pill);
background:#14181D;
color:#E7EBEE;
font-size:var(--text-sm);
line-height:1.5;
transition:background var(--duration),border-color var(--duration);
}
.pr-period:hover{
background:#1C2127;
color:#E7EBEE;
}
.pr-period[aria-pressed="true"]{
border-color:#1B7F79;
background:#1B7F79;
color:#FFFFFF;
}
.pr-period[aria-pressed="true"]:hover{
background:#207F79;
color:#FFFFFF;
}
.pr-control-hint{
margin-top:var(--field-gap);
font-size:var(--text-xs);
color:#D6DDE4;
}
.pr-page .pr-hero-actions{
justify-content:flex-start;
margin-top:var(--action-gap);
margin-bottom:var(--action-gap);
}
.pr-hero-note{
max-width:38.75rem;
font-size:var(--text-sm);
color:#E7EBEE;
}
.pr-page .pr-hero-stage{
display:block;
height:auto;
min-height:0;
max-width:none;
padding:0;
background:none;
color:#14181D;
text-align:left;
}
.pr-checksheet{
width:100%;
height:auto;
border-radius:var(--r-card);
overflow:hidden;
background:#EEF0F2;
color:#14181D;
--muted:#545D67;
--line:rgba(20,24,29,.14);
--line-soft:rgba(20,24,29,.08);
}
.pr-checksheet-head{
padding:var(--card-pad);
}
.pr-sheet-code{
display:block;
font-size:var(--text-xs);
line-height:1.5;
color:#545D67;
}
.pr-checksheet-head h2{
margin-top:var(--space-3);
font-size:var(--text-lg);
line-height:1.35;
color:#14181D;
}
.pr-checksheet-head p{
margin-top:var(--field-gap);
color:#545D67;
}
.pr-sheet-facts{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-2);
padding:0 var(--card-pad) var(--card-pad);
}
.pr-sheet-facts>div{
display:flex;
flex-direction:column;
gap:var(--field-gap);
padding:var(--space-3);
border-radius:var(--r-inner);
background:#DDE1E5;
color:#14181D;
}
.pr-sheet-facts dt{
color:#545D67;
}
.pr-sheet-facts dd{
font-weight:var(--weight-medium);
color:#14181D;
}
.pr-checksheet-foot{
padding:var(--card-pad);
background:#1E2230;
color:#E6E9F2;
--muted:#A7ADC2;
--line:rgba(255,255,255,.18);
--line-soft:rgba(255,255,255,.08);
}
.pr-checksheet-foot ul{
margin:var(--field-gap) 0 0;
padding-left:var(--space-4);
color:#E6E9F2;
}
.pr-checksheet-foot .pr-sheet-caption{
margin-top:var(--space-3);
font-size:var(--text-xs);
color:#A7ADC2;
}
.pr-section{
padding-block:var(--space-section);
}
.pr-section-head{
margin-bottom:var(--space-5);
}
.pr-section-head h2{
max-width:none;
margin-inline:0;
}
.pr-section-head>p{
max-width:52rem;
margin-top:var(--space-3);
color:#A0A9B1;
}
.pr-plan-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
align-items:stretch;
}
.pr-page .pr-plan{
display:flex;
flex-direction:column;
align-items:stretch;
gap:var(--space-3);
height:100%;
padding:var(--card-pad);
}
.pr-plan h3{
font-size:var(--text-md);
}
.pr-price-line{
display:flex;
flex-wrap:wrap;
align-items:baseline;
gap:var(--space-2);
font-variant-numeric:tabular-nums;
}
.pr-page .pr-plan .pr-price-line{
color:#E7EBEE;
}
.pr-price-value{
font-family:var(--fm);
font-size:var(--text-section);
font-weight:var(--weight-medium);
line-height:1.25;
}
.pr-price-line>span{
font-size:var(--text-sm);
}
.pr-price-tiles{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-2);
width:100%;
}
.pr-price-tiles>div{
display:flex;
flex-direction:column;
gap:var(--field-gap);
padding:var(--space-3);
border-radius:var(--r-inner);
background:#303740;
color:#E7EBEE;
}
.pr-price-tiles dt{
color:#E7EBEE;
font-size:var(--text-xs);
}
.pr-price-tiles dd{
font-family:var(--fm);
font-size:var(--text-md);
line-height:1.5;
font-variant-numeric:tabular-nums;
color:#E7EBEE;
}
.pr-plan-foot{
display:flex;
flex-direction:column;
gap:var(--space-3);
margin-top:auto;
}
.pr-page .pr-plan-foot p{
font-size:var(--text-sm);
}
.pr-plan-foot .c-btn{
width:100%;
}
.pr-section-note{
margin-top:var(--space-4);
color:#A0A9B1;
font-size:var(--text-sm);
}
.pr-comparison,
.pr-region-table{
display:table;
width:100%;
}
.pr-comparison{
min-width:48rem;
}
.pr-region-table{
min-width:56rem;
}
.pr-page .pr-comparison :is(th,td),
.pr-page .pr-region-table :is(th,td){
text-align:left;
}
.pr-comparison td{
font-variant-numeric:tabular-nums;
}
.pr-hardware-notes{
margin-top:var(--space-4);
}
.pr-page .pr-hardware-sheet{
padding:var(--card-pad);
border-radius:var(--r-card);
background:#EEF0F2;
color:#14181D;
--muted:#545D67;
--line:rgba(20,24,29,.14);
--line-soft:rgba(20,24,29,.08);
}
.pr-hardware-sheet h3{
color:#14181D;
}
.pr-page .pr-hardware-fields{
display:grid;
grid-template-columns:minmax(0,1fr);
margin-top:var(--space-3);
}
.pr-page .pr-hardware-fields :is(dt,dd){
margin:0;
padding:0;
border:0;
font-family:inherit;
}
.pr-hardware-fields>div{
display:grid;
grid-template-columns:minmax(8rem,.28fr) minmax(0,1fr);
gap:var(--space-3);
padding-block:var(--space-3);
border-top:1px solid rgba(20,24,29,.14);
}
.pr-hardware-fields dt{
font-size:var(--text-base);
color:#14181D;
}
.pr-hardware-fields dd{
font-size:var(--text-base);
color:#545D67;
}
.pr-inline-link{
color:#BEE8EE;
text-decoration:underline;
text-underline-offset:.2em;
overflow-wrap:anywhere;
}
.pr-addon-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
.pr-page .pr-addon{
display:flex;
flex-direction:column;
gap:var(--space-3);
height:100%;
padding:var(--card-pad);
background:#241F27;
color:#ECE4EE;
--muted:#B8ACBB;
--line:rgba(255,255,255,.18);
--line-soft:rgba(255,255,255,.08);
}
.pr-addon>p{
color:#B8ACBB;
}
.pr-addon .pr-price-tiles{
margin-top:auto;
}
.pr-addon .pr-addon-foot{
font-size:var(--text-sm);
color:#B8ACBB;
}
.pr-region-notes{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-4);
margin-top:var(--space-4);
}
.pr-region-notes p{
color:#A0A9B1;
}
.pr-region-notes strong{
color:#E7EBEE;
font-weight:var(--weight-medium);
}
.pr-billing-grid{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
align-items:start;
gap:var(--space-5);
}
.pr-page .pr-invoice{
height:auto;
padding:0;
overflow:hidden;
border-radius:var(--r-card);
background:#EEF0F2;
color:#14181D;
--muted:#545D67;
--line:rgba(20,24,29,.14);
--line-soft:rgba(20,24,29,.08);
}
.pr-invoice-head,
.pr-invoice-body{
padding:var(--card-pad);
}
.pr-invoice-head h3{
margin-top:var(--space-3);
color:#14181D;
}
.pr-invoice-head p{
margin-top:var(--field-gap);
color:#545D67;
}
.pr-invoice-body{
padding-top:0;
}
.pr-invoice-lines>div{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:var(--space-3);
align-items:baseline;
padding-block:var(--space-3);
border-top:1px solid rgba(20,24,29,.14);
}
.pr-invoice-lines :is(dt,dd){
font-size:var(--text-base);
color:#14181D;
}
.pr-invoice-lines dd{
font-family:var(--fm);
font-variant-numeric:tabular-nums;
white-space:nowrap;
}
.pr-page .pr-invoice-total{
display:flex;
flex-wrap:wrap;
align-items:baseline;
justify-content:space-between;
gap:var(--space-3);
margin-top:var(--space-3);
padding:var(--space-4);
border-radius:var(--r-inner);
background:#DDE1E5;
color:#14181D;
}
.pr-invoice-total strong{
font-family:var(--fm);
font-size:var(--text-section);
line-height:1.25;
font-weight:var(--weight-medium);
font-variant-numeric:tabular-nums;
}
.pr-invoice-equation{
margin-top:var(--field-gap);
font-size:var(--text-sm);
color:#545D67;
}
.pr-invoice-foot{
padding:var(--card-pad);
background:#2A231C;
color:#F1E6DA;
--muted:#C3B4A2;
--line:rgba(255,255,255,.18);
--line-soft:rgba(255,255,255,.08);
}
.pr-invoice-foot p{
color:#F1E6DA;
}
.pr-billing-guide{
padding:var(--space-4) 0;
}
.pr-billing-fields{
margin-top:var(--space-3);
}
.pr-billing-fields>div{
display:grid;
grid-template-columns:minmax(6rem,.28fr) minmax(0,1fr);
gap:var(--space-3);
padding-block:var(--space-3);
border-top:1px solid rgba(255,255,255,.18);
}
.pr-billing-fields dt{
font-size:var(--text-base);
color:#E7EBEE;
}
.pr-billing-fields dd{
font-size:var(--text-base);
color:#A0A9B1;
}
.pr-cycle-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
.pr-page .pr-cycle{
display:flex;
flex-direction:column;
gap:var(--space-3);
height:100%;
padding:var(--card-pad);
background:#1E2230;
color:#E6E9F2;
--muted:#A7ADC2;
--line:rgba(255,255,255,.18);
--line-soft:rgba(255,255,255,.08);
}
.pr-cycle>p{
color:#A7ADC2;
}
.pr-calculation{
display:flex;
flex-direction:column;
gap:var(--field-gap);
margin-top:auto;
padding-top:var(--space-3);
border-top:1px solid rgba(255,255,255,.18);
}
.pr-calculation>p{
font-size:var(--text-sm);
color:#A7ADC2;
}
.pr-calculation>strong{
font-size:var(--text-md);
line-height:1.5;
font-weight:var(--weight-medium);
color:#E6E9F2;
}
.pr-payment-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
.pr-page .pr-payment{
display:flex;
flex-direction:column;
gap:var(--space-3);
height:100%;
padding:var(--card-pad);
background:#1C2127;
color:#E7EBEE;
--muted:#A0A9B1;
--line:rgba(255,255,255,.18);
--line-soft:rgba(255,255,255,.08);
}
.pr-payment>p{
color:#A0A9B1;
}
.pr-payment .pr-payment-foot{
margin-top:auto;
font-size:var(--text-sm);
color:#A0A9B1;
}
.pr-payment-help{
margin-top:var(--space-5);
}
.pr-payment-help>p{
max-width:52rem;
color:#A0A9B1;
}
.pr-page .pr-final{
padding-bottom:var(--space-close);
}
.pr-page .pr-closing{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,.48fr);
gap:var(--space-7);
align-items:center;
padding:var(--space-7) var(--card-pad);
border-radius:var(--r-card);
background:var(--close-gradient);
color:#E7EBEE;
--muted:#E7EBEE;
--line:rgba(255,255,255,.18);
--line-soft:rgba(255,255,255,.08);
}
.pr-closing-copy h2{
color:#F1F4F5;
font-size:var(--text-section);
}
.pr-closing-copy p{
max-width:42rem;
margin-top:var(--space-3);
color:#E7EBEE;
}
.pr-closing-actions{
display:flex;
flex-direction:column;
align-items:stretch;
justify-content:center;
gap:var(--space-3);
}
.pr-closing-actions .c-btn{
width:100%;
}
@media(max-width:64rem){
.pr-page .pr-hero-grid{
grid-template-columns:minmax(0,1fr);
gap:var(--space-6);
}
.pr-plan-grid,
.pr-addon-grid,
.pr-cycle-grid,
.pr-payment-grid{
grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));
}
.pr-billing-grid{
grid-template-columns:minmax(0,1fr);
}
.pr-page .pr-closing{
grid-template-columns:minmax(0,1fr) minmax(0,.6fr);
gap:var(--space-5);
}
}
@media(max-width:42rem){
.pr-page .pr-hero-grid{
gap:var(--space-5);
}
.pr-page .pr-hero-stage,
.pr-checksheet{
height:auto;
min-height:0;
}
.pr-page .pr-plan,
.pr-page .pr-addon,
.pr-page .pr-cycle,
.pr-page .pr-payment,
.pr-page .pr-hardware-sheet{
padding:var(--space-4);
}
.pr-checksheet-head,
.pr-checksheet-foot,
.pr-invoice-head,
.pr-invoice-body,
.pr-invoice-foot{
padding:var(--space-4);
}
.pr-sheet-facts{
padding:0 var(--space-4) var(--space-4);
}
.pr-invoice-body{
padding-top:0;
}
.pr-plan-grid,
.pr-addon-grid,
.pr-cycle-grid,
.pr-payment-grid,
.pr-region-notes{
grid-template-columns:minmax(0,1fr);
}
.pr-hardware-fields>div,
.pr-billing-fields>div{
grid-template-columns:minmax(0,1fr);
gap:var(--field-gap);
}
.pr-page .pr-closing{
grid-template-columns:minmax(0,1fr);
padding:var(--space-5) var(--space-4);
gap:var(--space-5);
}
.pr-hero-actions .c-btn,
.pr-payment-help .c-actions .c-btn{
width:100%;
}
}
@media(prefers-reduced-motion:reduce){
.pr-period{
transition:none;
}
}