.guide-page { background: #ece9df; color: #18211c; }
.guide-page .site-header { border-bottom-color: rgba(24,33,28,.16); background: rgba(236,233,223,.92); }
.guide-page .nav-links .is-current { color: #18211c; }
.guide-page .nav-links .is-current::after { right: 0; }
.guide-header__link { padding: 8px 10px; border: 1px solid rgba(24,33,28,.22); color: #18211c; font: 700 9px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.guide-header__link:hover, .guide-header__link:focus-visible { border-color: #183e73; background: #183e73; color: #fff; }
.guide-hero { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(260px,.55fr); gap: clamp(44px,10vw,160px); align-items: end; padding-top: clamp(84px,12vw,168px); padding-bottom: clamp(64px,9vw,122px); border-bottom: 1px solid rgba(24,33,28,.16); }
.guide-kicker, .guide-section__eyebrow { margin: 0 0 16px; color: #315dbe; font: 700 9px/1 var(--mono); letter-spacing: .16em; }
.guide-hero h1 { max-width: 790px; margin: 0; font: 430 clamp(58px,8.4vw,126px)/.82 var(--display); letter-spacing: -.085em; }
.guide-hero h1 em { color: #315dbe; font-style: normal; }
.guide-hero aside { position: relative; padding: 22px 0 0 30px; border-top: 4px solid #18211c; }
.guide-hero aside span { display: block; color: #315dbe; font: 500 clamp(40px,5vw,66px)/.82 var(--display); letter-spacing: -.05em; }
.guide-hero aside p { max-width: 260px; margin: 16px 0 23px; color: #5c625d; font-size: 14px; line-height: 1.6; }
.guide-hero aside a { color: #18211c; border-bottom: 1px solid #18211c; font: 700 10px/1.5 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.guide-hero aside a:hover, .guide-hero aside a:focus-visible { color: #315dbe; border-color: #315dbe; }
.guide-layout { display: grid; grid-template-columns: 180px minmax(0,760px); gap: clamp(42px,10vw,160px); padding-top: 56px; padding-bottom: 104px; }
.guide-rail { align-self: start; position: sticky; top: 104px; display: grid; gap: 13px; padding-top: 9px; }
.guide-rail p { margin: 0 0 8px; color: #6a716b; font: 700 8px/1 var(--mono); letter-spacing: .14em; }
.guide-rail a { color: #485149; font-size: 12px; line-height: 1.35; }
.guide-rail a:hover, .guide-rail a:focus-visible { color: #315dbe; }
.guide-article { min-width: 0; }
.guide-section { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 25px; padding: 13px 0 76px; }
.guide-section > div { min-width: 0; }
.guide-section > span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid rgba(24,33,28,.34); border-radius: 50%; color: #315dbe; font: 700 9px/1 var(--mono); }
.guide-section h2, .guide-faq h2 { max-width: 660px; margin: 0; font: 470 clamp(34px,4.8vw,60px)/.91 var(--display); letter-spacing: -.06em; }
.guide-section > div > p:not(.guide-section__eyebrow), .guide-faq > p { max-width: 660px; margin: 21px 0 0; color: #4f5851; font-size: 16px; line-height: 1.7; }
.guide-section code, .guide-faq code { color: #183e73; font: 500 .9em/1.4 var(--mono); }
.guide-callout { margin-top: 26px; padding: 23px; background: #183e73; color: #fff; box-shadow: 8px 8px 0 #b8ef85; }
.guide-callout p { margin: 0 0 12px; color: #b8ef85; font: 700 9px/1 var(--mono); letter-spacing: .14em; }
.guide-callout > code { display: block; overflow: auto; color: #fff; font: 600 15px/1.5 var(--mono); white-space: nowrap; }
.guide-callout small { display: block; margin-top: 12px; color: rgba(255,255,255,.75); font-size: 12px; }
.guide-callout small code { color: #fff; }
.guide-note { margin-top: 26px; padding: 18px 20px; border-left: 4px solid #315dbe; background: rgba(49,93,190,.08); }
.guide-note strong { display: block; color: #183e73; font: 700 9px/1 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
.guide-note ul { margin: 12px 0 0; padding-left: 18px; color: #37443c; font-size: 14px; line-height: 1.7; }
.guide-note--warning { border-left-color: #af452f; background: rgba(175,69,47,.09); }
.guide-note--warning strong { color: #913720; }
.guide-note--warning p { margin: 11px 0 0; color: #59473f; font-size: 14px; line-height: 1.55; }
.guide-steps { display: grid; gap: 1px; margin: 28px 0 0; padding: 0; list-style: none; background: rgba(24,33,28,.16); counter-reset: step; }
.guide-steps li { display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 13px; padding: 17px; background: #f5f3ec; counter-increment: step; }
.guide-steps li::before { content: counter(step, decimal-leading-zero); color: #315dbe; font: 700 9px/1 var(--mono); letter-spacing: .08em; }
.guide-steps li b { display: block; margin-bottom: 4px; font: 700 14px/1.35 var(--sans); }
.guide-steps li span { color: #59625b; font-size: 13px; line-height: 1.5; }
.guide-fineprint { color: #6a716b !important; font-size: 12px !important; }
.guide-client-grid { margin-top: 28px; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1px; border: 1px solid rgba(24,33,28,.2); background: rgba(24,33,28,.2); }
.guide-client-grid a { min-height: 116px; padding: 18px; display: grid; align-content: start; gap: 7px; color: #202a23; background: #f5f3ec; transition: background .18s ease, color .18s ease; }
.guide-client-grid a:hover, .guide-client-grid a:focus-visible { color: #fff; background: #183e73; }
.guide-client-grid span { color: #315dbe; font: 700 8px/1 var(--mono); }.guide-client-grid a:hover span { color: #b8ef85; }
.guide-client-grid b { font: 600 23px/.95 var(--display); letter-spacing: -.04em; }
.guide-client-grid small { color: #68716a; font: 500 8px/1.35 var(--mono); }.guide-client-grid a:hover small { color: rgba(255,255,255,.72); }
.guide-section--terminal { padding-top: 16px; }
.terminal { width: 100%; min-width: 0; max-width: 100%; margin-top: 28px; overflow: hidden; background: #10231b; box-shadow: 10px 10px 0 #315dbe; }
.terminal__bar { display: flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 13px; border-bottom: 1px solid rgba(239,245,238,.16); color: rgba(239,245,238,.55); font: 700 8px/1 var(--mono); letter-spacing: .1em; }
.terminal__bar i { width: 7px; height: 7px; border-radius: 50%; background: #e97562; }.terminal__bar i:nth-child(2){background:#e9c55f}.terminal__bar i:nth-child(3){background:#b8ef85}.terminal__bar span{margin-left:5px}.terminal__bar button{margin-left:auto;padding:5px 0;border:0;border-bottom:1px solid rgba(239,245,238,.45);background:transparent;color:#fff;cursor:pointer;font:700 8px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}.terminal__bar button:hover,.terminal__bar button:focus-visible{color:#b8ef85;border-color:#b8ef85}
.terminal pre { width: 100%; min-width: 0; max-width: 100%; overflow: auto; margin: 0; padding: 22px; color: #eff5ee; font: 12px/1.8 var(--mono); white-space: pre; }
.guide-prompt { margin-top: 30px; padding: 17px 20px; border: 1px dashed rgba(24,33,28,.38); }
.guide-prompt span { color: #315dbe; font: 700 8px/1 var(--mono); letter-spacing: .14em; }.guide-prompt p{margin:9px 0 0;font:500 16px/1.5 var(--display);letter-spacing:-.015em}
.guide-support-table { margin-top: 27px; border: 1px solid rgba(24,33,28,.2); background: rgba(24,33,28,.2); }
.guide-support-table > div { display: grid; grid-template-columns: minmax(125px,.45fr) minmax(100px,.3fr) 1fr; gap: 15px; align-items: center; min-height: 68px; padding: 13px 17px; background: #f5f3ec; border-bottom: 1px solid rgba(24,33,28,.2); }
.guide-support-table > div:last-child { border-bottom: 0; }
.guide-support-table__head { min-height: 34px !important; color: #f5f6f1; background: #183e73 !important; font: 700 8px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.guide-support-table b { font-size: 12px; }.guide-support-table p { margin: 0; color: #59625b; font-size: 11px; line-height: 1.5; }
.guide-support-table em { width: max-content; padding: 5px 7px; font: 700 7px/1 var(--mono); font-style: normal; letter-spacing: .08em; text-transform: uppercase; }
.guide-support-table .is-ready { color: #1e653d; background: #ddf0df; }.guide-support-table .is-next { color: #6e5421; background: #f2e4bd; }
.guide-faq { padding: 54px 0 0 65px; border-top: 1px solid rgba(24,33,28,.18); }
.guide-faq details { padding: 17px 0; border-bottom: 1px solid rgba(24,33,28,.18); }.guide-faq summary{cursor:pointer;font:650 15px/1.45 var(--sans)}.guide-faq p{max-width:610px;margin:10px 0 0;color:#59625b;font-size:14px;line-height:1.6}
.guide-footer { display: flex; justify-content: space-between; gap: 20px; padding-top: 25px; padding-bottom: 36px; border-top: 1px solid rgba(24,33,28,.16); color: #6a716b; font: 700 9px/1.5 var(--mono); letter-spacing: .08em; text-transform: uppercase; }.guide-footer a{color:#183e73}
@media (max-width:820px){.guide-hero{grid-template-columns:1fr;gap:44px}.guide-hero aside{max-width:420px}.guide-layout{grid-template-columns:1fr}.guide-rail{position:static;display:flex;flex-wrap:wrap;gap:10px 17px}.guide-rail p{width:100%;}.guide-section{padding-bottom:60px}.guide-faq{padding-left:0}.guide-support-table > div{grid-template-columns:1fr auto}.guide-support-table > div p{grid-column:1/-1}.guide-support-table__head span:last-child{display:none}}
@media (max-width:580px){.guide-page .nav-links{display:none}.guide-hero{padding-top:70px}.guide-section{grid-template-columns:1fr;gap:14px}.guide-section>span{width:28px;height:28px}.guide-callout{box-shadow:5px 5px 0 #b8ef85}.terminal{box-shadow:5px 5px 0 #315dbe}.terminal pre{padding:16px;font-size:10px}.guide-footer{flex-direction:column}.guide-header__link{font-size:8px}.guide-client-grid{grid-template-columns:1fr}.guide-support-table > div{padding:13px}.guide-support-table__head{display:none}}
