.qhero{background:linear-gradient(120deg,var(--navy) 0%,var(--navy2) 70%);color:#fff;padding:46px 0 64px}
.qhero h1{font-size:clamp(28px,4vw,42px);font-weight:800;letter-spacing:-.02em}
.qhero p{opacity:.85;margin-top:8px;max-width:620px;font-size:17px}
.qapp{display:grid;grid-template-columns:1fr 340px;gap:26px;margin-top:-34px;padding-bottom:70px;position:relative;z-index:2}
@media(max-width:960px){.qapp{grid-template-columns:1fr}}
.qdrop{background:#fff;border:2px dashed #c6d0db;border-radius:16px;padding:34px;text-align:center;cursor:pointer;box-shadow:0 14px 34px rgba(15,34,56,.12);transition:.15s}
.qdrop:hover,.qdrop.over{border-color:var(--accent);background:#fff8f3}
.qdrop-inner{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted)}
.qdrop-inner svg{color:var(--accent)}
.qdrop-inner strong{color:var(--ink);font-size:17px}
.qdrop-inner u{color:var(--accent);text-decoration:none}
.qdrop-actions{display:flex;justify-content:space-between;align-items:center;margin:12px 4px 4px;font-size:14px;flex-wrap:wrap;gap:8px}
.linkbtn{background:none;border:0;color:var(--accent2);font:inherit;font-weight:600;cursor:pointer;padding:0}
.units{color:var(--muted);display:flex;align-items:center;gap:8px}
.units select{padding:6px 8px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:13px}
.qmsg{margin-top:14px;padding:12px 14px;border-radius:10px;background:#fff4e5;border:1px solid #ffd7a8;font-size:14px}
.qmsg.err{background:#fdecec;border-color:#f5b5b5}
.qparts{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.pcard{display:grid;grid-template-columns:120px 1fr auto;gap:16px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px}
.pcard svg{width:120px;height:90px;background:var(--bg);border-radius:8px}
.pcard svg path{fill:#dfe6ee;stroke:var(--navy);stroke-width:1.2;vector-effect:non-scaling-stroke;fill-rule:evenodd}
.pcard h4{font-size:15px;margin-bottom:2px}
.pcard .dims{color:var(--muted);font-size:13px}
.pcard .flag{display:inline-block;margin-top:6px;font-size:12px;background:#fff4e5;color:#9a5a00;border-radius:6px;padding:2px 8px}
.pqty{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.pqty .stepper{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.pqty .stepper button{width:32px;height:32px;border:0;background:var(--bg);font-size:18px;cursor:pointer;color:var(--navy)}
.pqty .stepper input{width:56px;text-align:center;border:0;font:inherit;font-weight:600;height:32px}
.pqty .each{font-size:13px;color:var(--muted)}
.pqty .line{font-weight:700}
.pqty .rm{background:none;border:0;color:var(--muted);font-size:12px;cursor:pointer;text-decoration:underline}
@media(max-width:600px){.pcard{grid-template-columns:90px 1fr}.pcard svg{width:90px;height:70px}.pqty{grid-column:1/-1;flex-direction:row;justify-content:space-between;align-items:center}}

.qside{display:flex;flex-direction:column;gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 8px 22px rgba(15,34,56,.06)}
.card h3{font-size:16px;margin-bottom:12px}
.card label{display:block;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:10px 0 5px}
.card select{width:100%;padding:11px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:14px;background:#fff}
.fine{font-size:12.5px;color:var(--muted);margin-top:10px}
.summary .empty{color:var(--muted);font-size:14px}
.sumrows{font-size:14px;display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto}
.sumrows div{display:flex;justify-content:space-between;gap:10px}
.sumrows span{color:var(--muted)}
.total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
.total strong{font-size:28px;letter-spacing:-.01em}
.meta{font-size:13px;color:var(--muted);margin-top:4px;display:flex;flex-direction:column;gap:2px}
.review{margin-top:12px;font-size:13px;background:#fff4e5;border:1px solid #ffd7a8;border-radius:10px;padding:10px}
.wide{width:100%;justify-content:center;margin-top:14px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.help p{font-size:14px;color:var(--muted);margin-top:6px}.help b{color:var(--ink)}

.modal{position:fixed;inset:0;background:rgba(11,26,43,.55);display:grid;place-items:center;z-index:50;padding:20px}
.modal[hidden]{display:none}
.modal-box{background:#fff;border-radius:16px;max-width:520px;width:100%;padding:26px;position:relative}
.modal-box .x{position:absolute;right:14px;top:10px;border:0;background:none;font-size:26px;cursor:pointer;color:var(--muted)}
.modal-box h3{font-size:20px;margin-bottom:8px}
.modal-box p{color:var(--muted);font-size:15px;margin-bottom:10px}
.modal-box input,.modal-box textarea{width:100%;padding:11px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:14px;margin-bottom:10px}
.modal-box .row{display:grid;grid-template-columns:1fr 1fr;gap:10px}

.deliv{border-top:1px solid var(--line);margin-top:12px;padding-top:10px}
.deliv input#zip{width:100%;padding:10px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:14px}
.delivopts{display:flex;flex-direction:column;gap:6px;margin-top:10px;font-size:14px}
.delivopts label{display:flex;justify-content:space-between;gap:8px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:9px 11px;cursor:pointer;text-transform:none;letter-spacing:0;font-weight:500;color:var(--ink);margin:0;font-size:14px}
.delivopts label.on{border-color:var(--accent);background:#fff8f3}
.delivopts input{margin-right:8px;accent-color:var(--accent)}
.delivopts .fine{margin:2px 0 0}
.card label.chk{display:flex;gap:8px;align-items:flex-start;text-transform:none;letter-spacing:0;font-weight:500;font-size:13px;color:var(--ink);margin-top:10px}
.chk input{margin-top:3px;accent-color:var(--accent)}
.subrows{font-size:14px;display:flex;flex-direction:column;gap:5px;margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.subrows div{display:flex;justify-content:space-between}.subrows span{color:var(--muted)}
.modal-box label.f{display:block;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:4px 0 5px}