/* index.html */
.route-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(220px, 1fr));
      gap: 14px 18px;
    }
    @media (max-width: 980px) {
      .route-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
    }
    @media (max-width: 600px) {
      .route-grid { grid-template-columns: 1fr; }
    }
    .route-grid .pill.gradient {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      min-height: 52px;
      font-weight: 700;
      letter-spacing: .2px;
    }


/* flights/calendar.html */
.pill-toggle.active{background:#111;color:#fff;border-color:#111}


/* flights/test.html */
body { padding: 20px; }
    .row { display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap: 12px; }
    .wide { grid-column: 1 / -1; }
    label { font-weight: 600; font-size: 0.9rem; }
    input, select, button { padding: 10px 12px; border-radius: 10px; border: 1px solid #e5e7eb; }
    button { background:#111; color:#fff; cursor:pointer }
    .card { border:1px solid #e5e7eb; border-radius:14px; padding:16px; margin:12px 0; }


/* img/index.html */
.hero-photo{position:relative;border-radius:var(--r-card);overflow:hidden;background:linear-gradient(135deg,rgba(106,0,255,.65),rgba(212,175,55,.45));min-height:260px}
    .hero-photo::before{content:"";position:absolute;inset:0;background:url('/img/hero-temple.jpg') center/cover no-repeat;filter:saturate(1.08) contrast(1.05) hue-rotate(8deg);opacity:.58}
    .hero-photo>.content{position:relative}
    .gold { color: var(--gold-classic); text-shadow: 0 2px 8px rgba(0,0,0,.18); }
    .pill-unified { display:inline-block; padding:10px 16px; border:none; border-radius:var(--r-pill); color:#fff;
      background:linear-gradient(135deg,var(--purple) 0%, var(--gold) 100%); box-shadow:0 8px 18px rgba(106,0,255,.25),0 4px 10px rgba(212,175,55,.25); text-decoration:none }
    .section{margin-top:1.5rem;background:var(--card);border:1px solid var(--br);border-radius:var(--r-card);box-shadow:var(--shadow-soft);padding:24px}
    .chips{display:flex;gap:10px;flex-wrap:wrap}


/* img/flights/calendar.html */
/* small helper for the header toggle */
    .pill-toggle.active { background:#111; color:#fff; border-color:#111 }


/* img/flights/test.html */
body { padding: 20px; }
    .row { display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap: 12px; }
    .wide { grid-column: 1 / -1; }
    label { font-weight: 600; font-size: 0.9rem; }
    input, select, button { padding: 10px 12px; border-radius: 10px; border: 1px solid #e5e7eb; }
    button { background:#111; color:#fff; cursor:pointer }
    .card { border:1px solid #e5e7eb; border-radius:14px; padding:16px; margin:12px 0; }


/* img/routes/bkk-hkt.html */
.hero { position: relative; border-radius: var(--r-card); overflow: hidden; }
    .hero::before {
      content: ""; position: absolute; inset: 0;
      background: url('/img/hero-temple.jpg') center/cover no-repeat;
      filter: saturate(1.05) contrast(1.05) hue-rotate(8deg);
      opacity: .45;
    }
    .hero .overlay {
      position: relative; padding: 28px;
      background: linear-gradient(135deg, rgba(106,0,255,.35), rgba(212,175,55,.25));
    }
    .section {
      margin-top: 1.5rem; background: var(--card);
      border: 1px solid var(--br); border-radius: var(--r-card);
      box-shadow: var(--shadow-soft); padding: 24px;
    }
    .facts { display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin-top:10px; }
    .fact { background:#fff; border:1px solid var(--br); border-radius:12px; padding:12px; }
    .chips a { margin-right:8px; margin-bottom:8px; }


/* img/routes/lon-bkk.html */
.hero { position: relative; border-radius: var(--r-card); overflow: hidden; }
    .hero::before {
      content: ""; position: absolute; inset: 0;
      background: url('/img/hero-temple.jpg') center/cover no-repeat;
      filter: saturate(1.05) contrast(1.05) hue-rotate(8deg);
      opacity: .45;
    }
    .hero .overlay {
      position: relative; padding: 28px;
      background: linear-gradient(135deg, rgba(106,0,255,.35), rgba(212,175,55,.25));
    }
    .section {
      margin-top: 1.5rem; background: var(--card);
      border: 1px solid var(--br); border-radius: var(--r-card);
      box-shadow: var(--shadow-soft); padding: 24px;
    }
    .facts { display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin-top:10px; }
    .fact { background:#fff; border:1px solid var(--br); border-radius:12px; padding:12px; }
    .chips a { margin-right:8px; margin-bottom:8px; }


/* img/routes/nyc-lon.html */
.hero { position: relative; border-radius: var(--r-card); overflow: hidden; }
    .hero::before {
      content: ""; position: absolute; inset: 0;
      background: url('/img/hero-temple.jpg') center/cover no-repeat;
      filter: saturate(1.05) contrast(1.05) hue-rotate(8deg);
      opacity: .45;
    }
    .hero .overlay {
      position: relative; padding: 28px;
      background: linear-gradient(135deg, rgba(106,0,255,.35), rgba(212,175,55,.25));
    }
    .section {
      margin-top: 1.5rem; background: var(--card);
      border: 1px solid var(--br); border-radius: var(--r-card);
      box-shadow: var(--shadow-soft); padding: 24px;
    }
    .facts { display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin-top:10px; }
    .fact { background:#fff; border:1px solid var(--br); border-radius:12px; padding:12px; }
    .chips a { margin-right:8px; margin-bottom:8px; }