*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Arial,Helvetica,sans-serif;background:#fff;color:#202735;font-size:14px}
button,input{font:inherit}
.page{max-width:1340px;margin:0 auto;padding:28px 0 32px}
.container{width:100%;max-width:1340px;margin:0 auto;padding:28px 20px 32px}
.layout{display:grid;grid-template-columns:205px minmax(0,1fr) 302px;gap:34px;align-items:start}
.sidebar h2,.packages-title{font-size:20px;font-weight:700;color:#29364d}
.sidebar h2{margin-bottom:38px}
.filter{margin-bottom:49px}
.filter-title{font-weight:600;color:#202735;margin-bottom:14px}
.pills{display:flex;gap:15px}
.pill{height:30px;padding:0 16px;border:1px solid #999;border-radius:18px;background:#fff;color:#555;cursor:pointer}
.pill:hover,.pill.active{border-color:#00a89f;color:#008f89;background:#f1fffd}
.flight-switch{display:inline-flex;border:1px solid #999;border-radius:18px;overflow:hidden}
.flight-switch button {
    height: 29px;
    padding: 0 10px;
    border: 0;
    background: #fff;
    color: #777;
    cursor: pointer;
    font-size: 13px;
}
.flight-switch button+button{border-left:1px solid #999}
.flight-switch button.active{background:#00a89f;color:#fff}
.range-wrap{margin:38px 4px 0}.range-wrap input{width:100%;accent-color:#00a69d;cursor:pointer}.range-values{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:11px;color:#777}.range-values strong{color:#00a69d;font-size:12px}
.package-area{min-width:0}
.packages-title{margin-bottom:27px}
.package-card{height:185px;border:1px solid #e2e2e2;border-radius:11px;overflow:hidden;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.12);display:grid;grid-template-columns:214px 1fr;margin-bottom:15px}
.package-img{width:214px;height:183px;object-fit:cover}
.package-info{position:relative;padding:14px}
.package-name{font-size:18px;font-weight:700;margin-bottom:9px}
.package-duration{font-size:13px;margin-bottom:12px;color:#202020}
.package-desc{font-size:13px;color:#4f4f4f;line-height:1.2;max-width:335px}
.package-price{position:absolute;right:23px;top:19px;font-size:21px;font-weight:700;color:#202735}
.negotiable{position:absolute;left:14px;bottom:16px;color:#00a69d;font-size:13px}
.select-btn{position:absolute;right:23px;bottom:15px;height:32px;padding:0 20px;border:1px solid #00a69d;border-radius:18px;background:#fff;color:#009b93;cursor:pointer}
.select-btn:hover,.select-btn.selected{background:#00a69d;color:#fff}
.timeline{height:522px;border:1px solid #e1e1e1;border-radius:11px;overflow:hidden;box-shadow:0 1px 5px rgba(0,0,0,.12)}
.timeline-head{padding:16px 20px;border-bottom:1px solid #eee;font-weight:700}
.timeline-section{padding:15px 20px;background:#f7f7f7}
.timeline-section.white{background:#fff}
.timeline-label{font-size:12px;color:#ff7a00;margin-bottom:11px}
.route{display:flex;align-items:center;gap:27px;font-size:14px;font-weight:600}
.route .edit,.date-row .edit{margin-left:auto;color:#00a69d;font-size:15px;border:0;background:transparent;cursor:pointer;padding:2px 4px}.route .edit:hover,.date-row .edit:hover{color:#007f78}
.date-row{display:flex;align-items:center;font-size:14px;font-weight:600}
.next-label{font-size:12px;margin-bottom:10px}
.add-itinerary{font-weight:700;font-size:14px;border:0;background:transparent;padding:0;color:#202735;cursor:pointer}.add-itinerary:hover{color:#00a69d}.itinerary-item{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:13px;color:#4f4f4f}.itinerary-item i{color:#00a69d}
@media(max-width:1100px){
  .container{padding:24px}
  .layout{grid-template-columns:190px minmax(0,1fr)}
  .timeline{grid-column:1/-1;height:auto}
}
@media(max-width:760px){
  .container{padding:18px 14px}
  .layout{display:block}
  .sidebar{margin-bottom:30px}
  .sidebar h2{margin-bottom:25px}
  .filter{margin-bottom:28px}
  .range-wrap{margin-top:25px}
  .packages-title{margin-bottom:18px}
  .package-card{height:auto;min-height:155px;grid-template-columns:135px 1fr}
  .package-img{width:135px;height:153px}
  .package-info{padding:12px}
  .package-name{font-size:15px;max-width:180px;padding-right:4px}
  .package-duration,.package-desc{font-size:12px}
  .package-price{right:12px;top:13px;font-size:17px}
  .negotiable{left:12px;bottom:13px}
  .select-btn{right:12px;bottom:10px;height:30px;padding:0 15px}
  .timeline{margin-top:25px}
}
@media(max-width:480px){
  .pills{gap:8px}
  .pill{padding:0 12px}
  .flight-switch button{padding:0 11px}
  .package-card{grid-template-columns:110px 1fr}
  .package-img{width:110px;height:153px}
  .package-name{padding-right:60px}
  .package-desc{max-width:160px}
  .package-price{font-size:15px}
}