@font-face{font-family:PackNeue;src:url("assets/HelveticaNeue-Bold.ttf");font-weight:700}
.packs{max-width:1240px;padding-bottom:50px}
.pack-intro{display:flex;justify-content:space-between;align-items:center;gap:6%;padding:clamp(30px,5vw,70px) 0}
.pack-intro h1{font:700 clamp(44px,6vw,88px)/1 PackNeue,Arial,sans-serif;letter-spacing:-.045em;margin:12px 0 20px}
.pack-intro p{max-width:46ch;font-size:clamp(18px,1.6vw,23px);margin:0}
.pack-intro img{width:min(38%,440px);height:auto}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card{display:flex;flex-direction:column;border:1px solid #a6a8a3;border-radius:16px;padding:clamp(16px,2vw,32px)}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .card:hover{animation:pack-hop 320ms ease-out}
  @keyframes pack-hop{
    0%,100%{transform:translateY(0)}
    45%{transform:translateY(-7px)}
    75%{transform:translateY(-2px)}
  }
}
.card h2{font:700 clamp(26px,2.5vw,38px)/1.15 PackNeue,Arial,sans-serif;letter-spacing:-.035em;margin:12px 0}
.rate{margin:0 0 20px}.rate strong{font:700 clamp(30px,3vw,46px)/1 PackNeue,Arial,sans-serif}
.card dl,.custom{margin:0 0 24px;border-top:1px solid #b8bbb4;padding-top:12px}
.card dl div{display:flex;justify-content:space-between;padding:5px 0}.card dd{margin:0}
.card .pill{margin-top:auto;text-align:center;font:700 16px PackNeue,Arial,sans-serif;color:inherit;text-decoration:none;padding:12px}
.card .pill:hover,.card .pill:focus-visible{background:#122948;color:#fcf7ed}
.size,.units{font-size:16px}.scope{margin:24px 0;max-width:72ch}.contact{color:inherit}
@media(max-width:800px){.cards{grid-template-columns:1fr}.pack-intro{flex-wrap:wrap}.pack-intro img{width:min(68%,300px);margin:20px auto 0}.card{padding:24px}.card h2{font-size:32px}}
.complexity{border:0;margin:0 0 24px;padding:0;min-width:0}
.complexity legend{padding:0;margin-bottom:10px;font-family:inherit;font-size:inherit;font-weight:bold}
.complexity>div{display:grid;width:100%;border-block:1px solid #c5c6bd}
.complexity label{display:flex;align-items:center;justify-content:space-between;min-height:46px;padding:0 10px;font:700 17px/1.3 PackNeue,"Helvetica Neue",Arial,sans-serif;cursor:pointer}
.complexity label+label{border-top:1px solid #d9d9d0}
.complexity label:has(input:checked){background:#1229480a}
.complexity input{order:1;appearance:none;width:17px;height:17px;margin:0 3px;border:1.5px solid #687582;border-radius:50%;background:transparent;cursor:pointer}
.complexity input:checked{border-color:#122948;background:radial-gradient(circle,#122948 0 44%,transparent 48%)}
.complexity input:focus-visible{outline:2px solid #122948;outline-offset:3px}
.complexity label:hover input{border-color:#122948}
@media(forced-colors:active){.complexity input{appearance:auto}}
.complexity-info{vertical-align:middle;border:1px solid currentColor;border-radius:50%;padding:0;width:16px;height:16px;margin-left:3px;background:transparent;color:inherit;font:bold 11px/1 Georgia,serif;cursor:pointer}
#scope-note{width:min(88vw,340px);box-sizing:border-box;padding:20px;border:1px solid #122948;border-radius:16px;color:#122948;background:#fcf7ed}
#scope-note::backdrop{background:#12294866}
#scope-note h2{font:700 21px/1.15 PackNeue,Arial,sans-serif;letter-spacing:-.02em}
#scope-note p{font-size:16px;margin:12px 0 16px}
#scope-note button{padding:6px 16px;border:0;border-radius:22px;background:#122948;color:#fcf7ed;font:700 16px PackNeue,Arial,sans-serif;cursor:pointer}
