.sf-r07 .design-reference{color:#183a63;background:#fff;font-family:Be Vietnam Pro,system-ui,sans-serif}.sf-r07 .design-reference-intro,.sf-r07 .design-reference-section{border-bottom:1px solid #d8dcd8;max-width:1120px;margin:0 auto;padding:64px 32px}.sf-r07 .design-reference-intro{padding-top:80px}.sf-r07 .design-reference-kicker{color:#356a9f;letter-spacing:.12em;margin:0 0 12px;font-size:12px;font-weight:700}.sf-r07 .design-reference h1,.sf-r07 .design-reference h2,.sf-r07 .design-reference h3{color:#183a63;margin:0}.sf-r07 .design-reference h1{letter-spacing:-.04em;max-width:720px;font-size:48px;line-height:1.08}.sf-r07 .design-reference h2{letter-spacing:-.025em;font-size:30px;line-height:1.2}.sf-r07 .design-reference-intro>p:not(.design-reference-kicker),.sf-r07 .design-reference-section>div>p:not(.design-reference-kicker){color:#53677d;max-width:720px;font-size:15px;line-height:1.65}.sf-r07 .design-reference-intro nav{background:#d8dcd8;border:1px solid #d8dcd8;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:40px;display:grid}.sf-r07 .design-reference-intro nav a{color:#183a63;background:#fff;grid-template-columns:1fr auto;gap:4px 16px;padding:20px;text-decoration:none;display:grid}.sf-r07 .design-reference-intro nav a:hover{background:#f4f5f3}.sf-r07 .design-reference-intro nav strong{font-size:15px}.sf-r07 .design-reference-intro nav span{color:#53677d;grid-row:2;font-size:13px}.sf-r07 .design-reference-intro nav b{grid-area:1/2/3;align-self:center}.sf-r07 .design-reference-rules{grid-template-columns:repeat(3,1fr);gap:24px;margin-top:32px;display:grid}.sf-r07 .design-reference-rules article{border-top:2px solid #183a63;padding-top:16px}.sf-r07 .design-reference-rules h3{font-size:16px}.sf-r07 .design-reference-rules p{color:#53677d;font-size:14px;line-height:1.6}.sf-r07 .design-reference-colors{gap:16px;margin-top:32px;display:flex}.sf-r07 .design-reference-colors div{flex:1;gap:6px;display:grid}.sf-r07 .design-reference-colors i{border:1px solid #d8dcd8;height:64px}.sf-r07 .design-reference-colors span{font-size:13px;font-weight:700}.sf-r07 .design-reference-colors code{color:#53677d;font-size:12px}.sf-r07 .design-reference-cart-section{grid-template-columns:1fr 460px;align-items:start;gap:64px;display:grid}.sf-r07 .design-reference-cart{background:#fff;border:1px solid #d8dcd8;box-shadow:0 18px 48px #183a631f}.sf-r07 .design-reference-cart header{border-bottom:1px solid #d8dcd8;align-items:center;gap:12px;padding:20px;display:flex}.sf-r07 .design-reference-cart header h3{font-size:24px}.sf-r07 .design-reference-cart header span{text-transform:uppercase;background:#f4f5f3;border-radius:4px;padding:4px 8px;font-size:11px;font-weight:700}.sf-r07 .design-reference-cart button{color:#183a63;background:#fff;border:1px solid #d8dcd8;min-height:44px;font:700 13px inherit}.sf-r07 .design-reference-cart header button{border:0;margin-left:auto;font-size:20px}.sf-r07 .design-reference-reward{background:#f4f5f3;border-bottom:1px solid #d8dcd8;padding:20px}.sf-r07 .design-reference-reward strong{font-size:14px}.sf-r07 .design-reference-reward>div{background:#d8dcd8;border-radius:5px;height:5px;margin-top:14px;overflow:hidden}.sf-r07 .design-reference-reward>div i{background:#356a9f;width:100%;height:100%;display:block}.sf-r07 .design-reference-reward p{color:#53677d;justify-content:space-between;margin:8px 0;font-size:11px;display:flex}.sf-r07 .design-reference-reward small{color:#53677d;font-size:12px}.sf-r07 .design-reference-lines{padding:0 20px}.sf-r07 .design-reference-lines article{border-bottom:1px solid #d8dcd8;grid-template-columns:64px 1fr 44px;align-items:center;gap:14px;padding:16px 0;display:grid}.sf-r07 .design-reference-image{background:linear-gradient(135deg,#183a63 0 45%,#356a9f 45% 60%,#f4f5f3 60%);width:64px;height:76px;display:block}.sf-r07 .design-reference-image.second{background:linear-gradient(90deg,#183a63 0 24%,#f4f5f3 24% 40%,#356a9f 40% 58%,#183a63 58%)}.sf-r07 .design-reference-lines article div{flex-direction:column;gap:5px;display:flex}.sf-r07 .design-reference-lines strong{font-size:15px}.sf-r07 .design-reference-lines small{color:#53677d;font-size:12px}.sf-r07 .design-reference-lines b{font-size:14px}.sf-r07 .design-reference-lines button{border:0}.sf-r07 .design-reference-cart footer{padding:20px}.sf-r07 .design-reference-cart footer>div{justify-content:space-between;font-size:13px;display:flex}.sf-r07 .design-reference-total{align-items:end;margin-top:14px}.sf-r07 .design-reference-total strong{font-size:22px}.sf-r07 .design-reference-cart footer>p{color:#53677d;font-size:11px}.sf-r07 .design-reference-actions{gap:10px;margin-top:16px}.sf-r07 .design-reference-actions button{flex:1}.sf-r07 .design-reference-actions button:last-child{color:#fff;background:#356a9f;border-color:#356a9f}.sf-r07 .design-reference-states{background:#d8dcd8;grid-template-columns:repeat(3,1fr);gap:1px;margin:32px 0 0;padding:1px;list-style:none;display:grid}.sf-r07 .design-reference-states li{background:#fff;gap:12px;padding:18px;font-size:14px;display:flex}.sf-r07 .design-reference-states b{color:#356a9f;font-family:IBM Plex Mono,monospace}@media (width<=800px){.sf-r07 .design-reference-intro,.sf-r07 .design-reference-section{padding:40px 20px}.sf-r07 .design-reference h1{font-size:36px}.sf-r07 .design-reference-intro nav,.sf-r07 .design-reference-rules,.sf-r07 .design-reference-states{grid-template-columns:1fr}.sf-r07 .design-reference-colors{grid-template-columns:repeat(2,1fr);display:grid}.sf-r07 .design-reference-cart-section{flex-direction:column;display:flex}.sf-r07 .design-reference-cart{width:100%}}