.sc-page{
font-variant-numeric:tabular-nums;
}
.sc-page [hidden]{
display:none!important;
}
.sc-page :is(.sc-split,.sc-workloads,.sc-memory-grid,.sc-closing)>*{
min-width:0;
}
.sc-page .sc-hero{
display:block;
background:#F6F6F3;
color:#1C1D17;
text-align:center;
}
.sc-hero .c-kicker{
width:fit-content;
margin-inline:auto;
margin-bottom:var(--kicker-gap);
color:#3E3F36;
}
.sc-hero h1{
font-size:clamp(2.25rem,4vw,3.2rem);
line-height:var(--leading-display);
color:#1C1D17;
}
.sc-hero .c-lead{
max-width:var(--width-read);
margin-inline:auto;
margin-top:var(--space-4);
color:#626357;
}
.sc-hero .c-actions{
justify-content:center;
margin-top:var(--action-gap);
}
.sc-section-head{
display:grid;
gap:var(--space-3);
margin-bottom:var(--space-5);
}
.sc-section-head>p{
max-width:var(--width-read);
color:#3E3F36;
}
.sc-workloads{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
align-items:stretch;
gap:var(--space-4);
}
.sc-workloads .sc-workload{
display:flex;
flex-direction:column;
gap:var(--space-4);
height:100%;
padding:0;
overflow:hidden;
border-radius:var(--r-l);
background:#FFFFFF;
color:#1C1D17;
}
.sc-workload-head{
display:grid;
gap:var(--space-2);
padding:var(--space-5);
}
.sc-category{
font-size:var(--text-sm);
font-weight:700;
}
.sc-workload-head h3{
font-size:var(--text-lg);
line-height:1.35;
color:inherit;
}
.sc-page .sc-workload-head p{
color:inherit;
}
.sc-blue{
background:#E8EEF3;
color:#22384A;
--muted:#22384A;
--line:#E4E4DC;
}
.sc-purple{
background:#EEE9F2;
color:#3D2E52;
--muted:#3D2E52;
--line:#E4E4DC;
}
.sc-green{
background:#E6F0EC;
color:#1F4237;
--muted:#1F4237;
--line:#E4E4DC;
}
.sc-peach{
background:#F3E9E4;
color:#5A3324;
--muted:#5A3324;
--line:#E4E4DC;
}
.sc-workload-body{
display:grid;
gap:var(--space-3);
padding-inline:var(--space-5);
}
.sc-workload-foot{
margin-top:auto;
padding:0 var(--space-5) var(--space-5);
}
.sc-workload-foot .c-badge{
line-height:var(--leading-control);
letter-spacing:0;
}
.sc-split{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
align-items:start;
gap:var(--space-8);
}
.sc-copy{
display:grid;
gap:var(--space-3);
min-width:0;
}
.sc-copy>p{
color:#3E3F36;
overflow-wrap:break-word;
}
.sc-memory{
height:auto;
}
.sc-memory-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-3);
}
.sc-memory-item{
display:flex;
flex-direction:column;
gap:var(--space-2);
padding:var(--space-4);
border-radius:var(--r-m);
min-width:0;
}
.sc-memory-size{
font-size:var(--text-lg);
line-height:var(--leading-title);
overflow-wrap:break-word;
}
.sc-page .sc-memory-item p{
color:inherit;
}
.sc-page .sc-small{
font-size:var(--text-sm);
color:#626357;
}
.sc-comparison-section{
background:#E8EEF3;
color:#22384A;
--muted:#22384A;
--line:#E4E4DC;
}
.sc-comparison-section .sc-section-head>p{
color:#22384A;
}
.sc-comparison{
display:table;
width:100%;
min-width:48rem;
}
.sc-comparison th,
.sc-comparison td{
text-align:left;
}
.sc-comparison thead th:first-child{
width:16%;
}
.sc-comparison thead th:not(:first-child){
width:28%;
}
.sc-table-note{
margin-top:var(--space-4);
font-size:var(--text-sm);
color:#22384A;
}
.sc-network{
height:auto;
}
.sc-panel-caption{
font-size:var(--text-md);
font-weight:700;
color:#1C1D17;
}
.sc-bandwidth{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:var(--space-2);
}
.sc-bandwidth>div{
display:flex;
flex-direction:column;
gap:var(--space-2);
min-width:0;
padding:var(--space-4);
border-radius:var(--r-m);
background:#F6F6F3;
color:#1C1D17;
}
.sc-bandwidth strong{
font-size:var(--text-base);
overflow-wrap:break-word;
}
.sc-bandwidth span{
font-size:var(--text-sm);
color:#626357;
}
.sc-address{
padding:var(--space-4);
border-radius:var(--r-m);
}
.sc-address-list{
display:grid;
gap:var(--space-3);
margin-top:var(--space-3);
}
.sc-address-list>div{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,2fr);
align-items:start;
gap:var(--space-3);
}
.sc-address-list :is(dt,dd){
min-width:0;
overflow-wrap:break-word;
color:#1F4237;
}
.sc-address-list dt{
font-weight:700;
}
.sc-storage{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
align-items:start;
gap:var(--space-8);
padding:var(--space-6);
border-radius:var(--r-l);
}
.sc-storage .sc-copy>p{
color:#5A3324;
}
.sc-storage-checks{
display:grid;
gap:var(--space-3);
min-width:0;
}
.sc-storage-checks ul{
display:grid;
gap:var(--space-3);
padding-inline-start:var(--space-4);
margin:0;
}
.sc-storage-checks>p{
font-size:var(--text-sm);
}
.sc-closing{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,.48fr);
align-items:center;
gap:var(--space-8);
padding:var(--space-8) var(--space-6);
border-radius:var(--r-xl);
background:#1C1D17;
color:#F6F6F3;
--muted:#C4C5B8;
--line:color-mix(in srgb,#F6F6F3 18%,transparent);
}
.sc-close-copy{
display:grid;
gap:var(--space-3);
min-width:0;
}
.sc-close-copy h2{
color:#F6F6F3;
}
.sc-close-copy p{
color:#E2E2D8;
}
.sc-close-copy .sc-close-note{
font-size:var(--text-sm);
color:#C4C5B8;
}
.sc-close-actions{
display:flex;
flex-direction:column;
align-items:stretch;
gap:var(--space-3);
}
.sc-close-actions .sc-close-secondary{
border-radius:var(--radius-pill);
border-color:color-mix(in srgb,currentColor 35%,transparent);
background:#1C1D17;
color:#F6F6F3;
}
.sc-close-actions .sc-close-secondary:hover{
background:#3E3F36;
color:#FFFFFF;
}
@media(max-width:64rem){
.sc-split,
.sc-storage{
gap:var(--space-5);
}
.sc-bandwidth{
grid-template-columns:minmax(0,1fr);
}
.sc-bandwidth>div{
flex-direction:row;
flex-wrap:wrap;
align-items:baseline;
justify-content:space-between;
}
.sc-closing{
grid-template-columns:minmax(0,1fr) minmax(0,.7fr);
gap:var(--space-5);
}
}
@media(max-width:48rem){
.sc-workloads,
.sc-split,
.sc-storage,
.sc-closing{
grid-template-columns:minmax(0,1fr);
}
.sc-memory,
.sc-network{
height:auto;
max-width:none;
}
.sc-closing{
padding:var(--space-6) var(--space-4);
}
.sc-close-actions{
align-items:stretch;
}
}
@media(max-width:42rem){
.sc-workload-head{
padding:var(--space-4);
}
.sc-workload-body{
padding-inline:var(--space-4);
}
.sc-workload-foot{
padding:0 var(--space-4) var(--space-4);
}
.sc-memory-grid{
grid-template-columns:minmax(0,1fr);
}
.sc-storage{
padding:var(--space-4);
}
.sc-address-list>div{
grid-template-columns:minmax(0,1fr);
gap:var(--space-2);
}
}
