.support-hero{
padding-block:var(--space-4) var(--space-5);
background:var(--c-base);
color:var(--c-ink)
}
.support-hero__grid{
display:grid;
grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
gap:var(--space-4);
align-items:center
}
.support-hero__grid>*{
min-width:0
}
.support-hero__copy{
display:flex;
flex-direction:column;
align-items:flex-start
}
.support-hero__copy .c-kicker{
width:fit-content;
max-width:100%;
align-self:flex-start
}
.support-hero__copy h1{
max-width:17ch;
margin-top:var(--space-2);
font-size:var(--fs-5);
line-height:1.18;
overflow-wrap:anywhere
}
.support-hero__copy .c-lead{
max-width:42rem;
margin-top:var(--space-2);
color:var(--c-muted)
}
.support-hero__facts{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
width:100%;
margin-top:var(--space-3);
border-top:1px solid var(--c-line);
border-bottom:1px solid var(--c-line)
}
.support-hero__facts div{
min-width:0;
padding:var(--space-2) var(--space-2) var(--space-2) 0
}
.support-hero__facts strong,
.support-hero__facts span{
display:block
}
.support-hero__facts strong{
font-family:var(--font-mono);
font-size:var(--fs-3);
line-height:1.25;
font-variant-numeric:tabular-nums
}
.support-hero__facts span{
margin-top:var(--space-1);
color:var(--c-muted);
font-size:var(--fs-1);
line-height:1.4
}
.support-hero__copy .c-actions{
justify-content:flex-start;
margin-block:var(--space-3) 0
}
.support-ledger{
min-width:0;
height:clamp(23rem,34vw,27rem);
display:flex;
flex-direction:column;
overflow:hidden;
border-radius:var(--radius-lg);
background:var(--c-dark);
color:#f8f3f2;
box-shadow:var(--shadow-float)
}
.support-ledger__head{
display:flex;
align-items:center;
justify-content:space-between;
gap:var(--space-2);
padding:var(--space-2) var(--space-3);
background:var(--c-primary);
color:#241b1a;
font-family:var(--font-head);
font-size:var(--fs-1);
line-height:1.35;
font-weight:700
}
.support-ledger__route{
display:flex;
flex:1;
flex-direction:column;
justify-content:center;
padding-inline:var(--space-3)
}
.support-ledger__route>div{
display:grid;
grid-template-columns:auto minmax(0,1fr);
align-items:center;
gap:var(--space-2);
padding-block:var(--space-2);
border-bottom:1px solid var(--c-line-dark)
}
.support-ledger__route>div:last-child{
border-bottom:0
}
.support-ledger__index{
display:inline-flex;
align-items:center;
justify-content:center;
width:2.25rem;
height:2.25rem;
border-radius:999px;
background:var(--c-accent);
color:#fff;
font-family:var(--font-mono);
font-size:var(--fs-1);
line-height:1
}
.support-ledger__route p{
min-width:0;
color:#f8f3f2
}
.support-ledger__route strong,
.support-ledger__route small{
display:block
}
.support-ledger__route small{
margin-top:var(--space-1);
color:#c6bec3
}
.support-ledger__foot{
display:flex;
align-items:center;
justify-content:space-between;
gap:var(--space-2);
padding:var(--space-2) var(--space-3);
background:var(--c-dark-surface);
color:#c6bec3;
font-size:var(--fs-0);
line-height:1.4
}
.support-ledger__foot strong{
color:#f8f3f2
}
.support-search{
display:grid;
gap:var(--space-1);
margin-top:var(--space-4);
padding:var(--space-3);
border-radius:var(--radius-md);
background:var(--c-surface);
color:var(--c-ink);
box-shadow:var(--shadow-soft)
}
.support-search__control{
display:grid;
grid-template-columns:auto minmax(0,1fr) auto;
align-items:center;
gap:var(--space-1)
}
.support-search__control svg{
width:1.25rem;
height:1.25rem;
color:var(--c-muted)
}
.support-search__control .c-input{
min-width:0
}
.support-search__hint,
.support-search__status{
color:var(--c-muted);
font-size:var(--fs-1)
}
.support-search__status{
font-weight:650
}
.support-categories{
background:var(--c-surface);
color:var(--c-ink)
}
.c-section-head{
display:flex;
flex-direction:column;
align-items:flex-start
}
.c-section-head .c-kicker{
width:fit-content;
max-width:100%;
align-self:flex-start
}
.c-section-head h2{
margin-top:var(--space-2);
max-width:22ch;
overflow-wrap:anywhere
}
.c-section-head .c-lead{
max-width:46rem;
margin-top:var(--space-2);
color:var(--c-muted)
}
.c-section-head.c-copy-center{
align-items:center;
text-align:center
}
.c-section-head.c-copy-center .c-kicker{
align-self:center
}
.c-section-head.c-copy-center .c-lead{
margin-inline:auto
}
.support-category-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));
gap:var(--space-3);
align-items:start;
margin-top:var(--space-4)
}
.support-category{
display:flex;
flex-direction:column;
align-items:flex-start;
min-width:0;
height:auto
}
.support-category__mark{
display:flex;
align-items:center;
gap:var(--space-2);
width:100%;
min-width:0
}
.support-category__icon{
display:inline-flex;
align-items:center;
justify-content:center;
width:2.25rem;
height:2.25rem;
flex:0 0 2.25rem;
border-radius:var(--radius-sm);
background:rgba(36,27,26,.06);
color:inherit
}
.support-category__icon svg{
display:block;
width:1.15rem;
height:1.15rem;
margin:0
}
.support-category .c-badge{
width:fit-content;
max-width:100%;
align-self:flex-start;
margin:0
}
.support-category h3{
margin-top:var(--space-2);
align-self:stretch;
font-size:var(--fs-3)
}
.support-category p{
margin-top:var(--space-1);
color:#5f575c
}
.support-category__action{
margin-top:var(--space-3);
color:#78391f;
font-family:var(--font-head);
font-size:var(--fs-1);
line-height:1.4;
font-weight:700
}
.support-knowledge{
background:var(--c-blue);
color:var(--c-ink)
}
.support-stream{
display:grid;
grid-template-columns:minmax(0,2fr) minmax(17rem,1fr);
grid-template-areas:"articles rail";
gap:var(--space-4);
align-items:start;
margin-top:var(--space-4)
}
.support-stream>*{
min-width:0
}
.support-stream__rail{
grid-area:rail;
position:sticky;
top:7.5rem
}
.support-rail-card{
padding:var(--space-3);
border-radius:var(--radius-md);
background:var(--c-surface);
color:var(--c-ink);
box-shadow:var(--shadow-soft)
}
.support-rail-card__head{
display:flex;
align-items:center;
justify-content:space-between;
gap:var(--space-2);
padding-bottom:var(--space-2);
border-bottom:1px solid var(--c-line);
font-family:var(--font-head)
}
.support-rail-card__head strong{
font-family:var(--font-mono);
font-size:var(--fs-1);
font-variant-numeric:tabular-nums
}
.support-rail-search{
display:grid;
gap:var(--space-1);
margin-top:var(--space-3)
}
.support-rail-search__control{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:var(--space-1)
}
.support-filter{
margin-top:var(--space-3)
}
.support-filter button{
border:1px solid color-mix(in srgb,currentColor 18%,transparent)
}
.support-rail-card__note{
margin-top:var(--space-3);
padding-top:var(--space-2);
border-top:1px solid var(--c-line);
color:var(--c-muted);
font-size:var(--fs-1)
}
.support-article-list{
grid-area:articles;
min-width:0;
background:var(--c-surface);
color:var(--c-ink);
border-radius:var(--radius-md);
padding-inline:var(--space-3)
}
.support-article{
min-width:0;
padding-block:var(--space-4);
border-bottom:1px solid var(--c-line);
transition:opacity .2s var(--ease),background .2s var(--ease)
}
.support-article:last-child{
border-bottom:0
}
.support-article.is-muted{
opacity:.42
}
.support-article.is-match,
.support-article.is-focused{
background:color-mix(in srgb,var(--c-peach) 52%,transparent)
}
.support-article__meta{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:var(--space-1);
color:var(--c-muted);
font-size:var(--fs-0);
line-height:1.4
}
.support-article__meta .c-badge{
width:fit-content;
max-width:100%;
align-self:flex-start
}
.support-article h3{
margin-top:var(--space-2);
font-size:var(--fs-4)
}
.support-article>p{
margin-top:var(--space-2);
color:#554e53
}
.support-article ul{
display:grid;
gap:var(--space-1);
margin-top:var(--space-2);
padding-left:1.2rem
}
.support-article a:not(.c-btn){
display:inline-flex;
margin-top:var(--space-3);
color:#78391f;
font-family:var(--font-head);
font-size:var(--fs-1);
line-height:1.4;
font-weight:700;
text-decoration:underline;
text-decoration-thickness:1px;
text-underline-offset:.2em
}
.terminal-section{
background:var(--c-dark);
color:#f8f3f2
}
.terminal-section .c-section-head .c-lead{
color:#c6bec3
}
.terminal-section__kicker{
background:var(--c-primary);
color:#241b1a
}
.terminal-section__kicker::before{
background:#241b1a
}
.terminal-layout{
display:grid;
grid-template-columns:minmax(0,1.5fr) minmax(17rem,.5fr);
gap:var(--space-3);
align-items:stretch;
margin-top:var(--space-4)
}
.terminal-layout>*{
min-width:0
}
.support-terminal{
min-width:0;
overflow:hidden;
border-radius:var(--radius-md);
background:var(--c-dark-surface);
color:#f8f3f2
}
.support-terminal__bar{
display:grid;
grid-template-columns:auto minmax(0,1fr) auto;
align-items:center;
gap:var(--space-2);
padding:var(--space-2) var(--space-3);
background:#302a30;
color:#f8f3f2;
font-size:var(--fs-0);
line-height:1.4
}
.support-terminal__lights{
display:flex;
gap:.4rem
}
.support-terminal__lights span{
width:.65rem;
height:.65rem;
border-radius:50%
}
.support-terminal__lights span:nth-child(1){
background:var(--c-primary)
}
.support-terminal__lights span:nth-child(2){
background:var(--c-accent)
}
.support-terminal__lights span:nth-child(3){
background:var(--c-success)
}
.support-terminal pre{
max-width:100%;
padding:var(--space-3);
overflow-x:auto;
background:var(--c-dark-surface);
color:#f8f3f2
}
.support-terminal code{
white-space:pre-wrap;
overflow-wrap:anywhere
}
.terminal-dim{
color:#bdb4bb
}
.terminal-ok{
color:#a9d2b7
}
.terminal-error{
color:#ffb38c
}
.terminal-note{
color:#cbb9eb
}
.terminal-notes{
display:grid;
grid-template-rows:repeat(3,minmax(0,1fr));
gap:var(--space-2)
}
.terminal-note-card{
display:flex;
flex-direction:column;
align-items:flex-start;
min-width:0;
padding:var(--space-3);
border-radius:var(--radius-md);
background:var(--c-surface);
color:var(--c-ink)
}
.terminal-note-card .c-badge{
width:fit-content;
align-self:flex-start;
background:var(--c-lilac);
color:#55415f
}
.terminal-note-card h3{
margin-top:var(--space-2);
font-size:var(--fs-3)
}
.terminal-note-card p{
margin-top:var(--space-1);
color:#5f575c
}
.troubleshooting-section{
background:var(--c-peach);
color:var(--c-ink)
}
.troubleshooting-steps{
list-style:none;
display:grid;
margin-top:var(--space-4);
padding:0;
border-radius:var(--radius-md);
background:var(--c-surface);
color:var(--c-ink)
}
.troubleshooting-step{
display:grid;
grid-template-columns:auto minmax(0,1fr);
gap:var(--space-3);
align-items:start;
padding:var(--space-3);
border-bottom:1px solid var(--c-line)
}
.troubleshooting-step:last-child{
border-bottom:0
}
.troubleshooting-step__number{
display:inline-flex;
align-items:center;
justify-content:center;
width:3rem;
height:3rem;
border-radius:999px;
background:var(--c-primary);
color:#241b1a;
font-family:var(--font-mono);
font-size:var(--fs-1);
line-height:1;
font-weight:700;
font-variant-numeric:tabular-nums
}
.troubleshooting-step h3{
font-size:var(--fs-3)
}
.troubleshooting-step p{
margin-top:var(--space-1);
color:#5f575c
}
.service-status-section{
background:var(--c-surface);
color:var(--c-ink)
}
.service-status-grid{
display:grid;
grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr);
gap:var(--space-4);
align-items:stretch
}
.service-status-grid>*{
min-width:0
}
.service-status-copy{
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center
}
.service-status-copy .c-kicker{
width:fit-content;
align-self:flex-start
}
.service-status-copy h2{
max-width:20ch;
margin-top:var(--space-2)
}
.service-status-copy p{
margin-top:var(--space-2);
color:var(--c-muted)
}
.service-evidence{
overflow:hidden;
border-radius:var(--radius-md);
background:var(--c-dark);
color:#f8f3f2
}
.service-evidence__head{
display:flex;
align-items:center;
justify-content:space-between;
gap:var(--space-2);
padding:var(--space-2) var(--space-3);
background:var(--c-accent);
color:#fff;
font-family:var(--font-head);
font-weight:700
}
.service-evidence__head strong{
font-family:var(--font-mono);
font-variant-numeric:tabular-nums
}
.service-evidence dl{
margin:0;
padding-inline:var(--space-3)
}
.service-evidence dl div{
display:grid;
grid-template-columns:minmax(5rem,.35fr) minmax(0,.65fr);
gap:var(--space-2);
padding-block:var(--space-2);
border-bottom:1px solid var(--c-line-dark)
}
.service-evidence dl div:last-child{
border-bottom:0
}
.service-evidence dt{
color:#f8f3f2
}
.service-evidence dd{
min-width:0;
color:#c6bec3;
overflow-wrap:anywhere
}
.service-status-note{
display:grid;
grid-template-columns:auto minmax(0,1fr);
gap:var(--space-2);
align-items:start;
margin-top:var(--space-4);
padding:var(--space-3);
border-radius:var(--radius-md);
background:var(--c-blue);
color:var(--c-ink)
}
.service-status-note svg{
width:1.25rem;
height:1.25rem;
margin-top:.15rem
}
.service-status-note a:not(.c-btn){
color:#71361d;
font-weight:700;
overflow-wrap:anywhere
}
.support-escalation{
background:var(--c-base);
color:var(--c-ink)
}
.escalation-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-3);
align-items:start;
margin-top:var(--space-4)
}
.escalation-card{
display:flex;
flex-direction:column;
align-items:flex-start;
min-width:0
}
.escalation-card .c-badge{
width:fit-content;
align-self:flex-start
}
.escalation-card h3{
margin-top:var(--space-2)
}
.escalation-card>p{
margin-top:var(--space-1);
color:#5f575c
}
.escalation-card ul{
display:grid;
gap:var(--space-1);
margin-top:var(--space-2);
padding-left:1.2rem
}
.escalation-card .c-btn{
margin-top:var(--space-3)
}
.support-closing{
padding-top:var(--space-5);
padding-bottom:var(--space-3);
background:var(--c-base);
color:var(--c-ink)
}
.support-closing .c-cta{
background:var(--c-dark);
color:#f8f3f2
}
.support-closing__copy{
display:flex;
flex-direction:column;
align-items:flex-start;
min-width:0
}
.support-closing__kicker{
width:fit-content;
align-self:flex-start;
background:var(--c-primary);
color:#241b1a
}
.support-closing__kicker::before{
background:#241b1a
}
.support-closing__copy h2{
margin-top:var(--space-2);
font-size:var(--fs-4)
}
.support-closing__copy p{
max-width:43rem;
margin-top:var(--space-1);
color:#c6bec3
}
.support-closing__actions{
display:flex;
flex-direction:column;
align-items:stretch;
flex:0 0 auto;
gap:var(--space-1)
}
.support-closing__actions .c-btn-ghost{
color:#f8f3f2;
border-color:color-mix(in srgb,currentColor 38%,transparent)
}
@media (max-width:64rem){
.support-hero__grid,
.terminal-layout,
.service-status-grid{
grid-template-columns:1fr
}
.support-ledger{
height:auto;
min-height:0;
overflow:visible
}
.support-stream{
grid-template-columns:1fr;
grid-template-areas:"rail" "articles"
}
.support-stream__rail{
position:static
}
.terminal-notes{
grid-template-columns:repeat(3,minmax(0,1fr));
grid-template-rows:none;
align-items:start
}
}
@media (max-width:44rem){
.support-hero{
padding-block:var(--space-3) var(--space-4)
}
.support-hero__facts{
grid-template-columns:1fr
}
.support-hero__facts div{
padding-inline:0;
border-bottom:1px solid var(--c-line)
}
.support-hero__facts div:last-child{
border-bottom:0
}
.support-search__control{
grid-template-columns:auto minmax(0,1fr)
}
.support-search__control .c-btn{
grid-column:1/-1
}
.support-ledger__head,
.support-ledger__foot{
align-items:flex-start;
flex-direction:column
}
.support-rail-search__control{
grid-template-columns:1fr
}
.support-article-list{
padding-inline:var(--space-2)
}
.support-article h3{
font-size:var(--fs-3)
}
.terminal-notes,
.escalation-grid{
grid-template-columns:1fr
}
.troubleshooting-step{
grid-template-columns:1fr
}
.service-evidence dl div{
grid-template-columns:1fr
}
.support-closing__actions{
width:100%
}
}
@media (max-width:24.375rem){
.support-search,
.support-rail-card,
.support-article-list,
.troubleshooting-step,
.service-status-note{
padding-inline:var(--space-2)
}
.support-ledger__route{
padding-inline:var(--space-2)
}
.support-ledger__route>div{
grid-template-columns:1fr
}
}