/* journeydeal.com homepage — 2026-09-25 redesign (USER: "it looks more like an AI site"). Loaded ONLY by public/index.html, after styles.css / theme.css / jd-fd.css. Everything is scoped under html:root body.jdh: the site-wide "aurora" theme styles .hero / .search-card / .btn through html[data-theme="aurora"] … (0,2,1), and html:root body.jdh … beats it without !important. Colour tokens are set on because brand.js writes --brand inline on ; a descendant definition wins for everything below. Direction: a calm booking utility — solid evergreen, one marigold accent reserved for Special Fixed Departure fares, tabular figures for times and fares, no gradients-as-decoration, no emoji as icons. */ html:root body.jdh { --jh-ink: #122620; --jh-ink-2: #2b3d37; --jh-muted: #5d6d67; --jh-paper: #f4f6f5; --jh-surface: #ffffff; --jh-line: #dde4e1; --jh-brand: #0e5a45; --jh-brand-dk: #0a4535; --jh-brand-tint: #e7f1ed; --jh-gold: #d98a1b; --jh-gold-tint: #fbf1e1; --jh-radius: 12px; --jh-display: "Bricolage Grotesque", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --brand: var(--jh-brand); --accent: var(--jh-brand); --text: var(--jh-ink); --muted: var(--jh-muted); --border: var(--jh-line); background: var(--jh-paper); color: var(--jh-ink); } html:root body.jdh h1, html:root body.jdh h2, html:root body.jdh h3, html:root body.jdh h4 { font-family: var(--jh-display); letter-spacing: -0.01em; text-wrap: balance; } html:root body.jdh :focus-visible { outline: 2px solid var(--jh-brand); outline-offset: 2px; } /* ── header ─────────────────────────────────────────────────────────────────── */ html:root body.jdh .topbar { background: var(--jh-surface); border-bottom: 1px solid var(--jh-line); box-shadow: none; } html:root body.jdh .topbar-inner { min-height: 64px; gap: 8px 18px; flex-wrap: nowrap; } html:root body.jdh .nav-links { gap: 2px; flex-wrap: nowrap; } html:root body.jdh .nav-links a { white-space: nowrap; font-size: 14px; font-weight: 500; padding: 8px 10px; border-radius: 8px; color: var(--jh-ink-2); background: none; } html:root body.jdh .nav-links a:hover { background: var(--jh-paper); color: var(--jh-ink); } html:root body.jdh .nav-links a.active { color: var(--jh-brand); background: var(--jh-brand-tint); font-weight: 600; } html:root body.jdh .geo-ctl select { max-width: 132px; height: 34px; border: 1px solid var(--jh-line); border-radius: 8px; font-size: 13px; background: var(--jh-surface); color: var(--jh-ink-2); } @media (max-width: 1240px) { html:root body.jdh .geo-ctl #countrySel { display: none; } } @media (max-width: 760px) { html:root body.jdh .topbar-inner { min-height: 56px; padding: 8px 16px; flex-wrap: nowrap; } html:root body.jdh .geo-ctl { display: none; } } /* ── hero ───────────────────────────────────────────────────────────────────── */ html:root body.jdh .hero { background: var(--jh-ink); color: #f2f6f4; padding: 52px 20px 118px; } html:root body.jdh .hero-inner { max-width: 1180px; margin: 0 auto; } html:root body.jdh .hero .jh-eyebrow { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #9fc3b5; margin: 0 0 14px; } html:root body.jdh .hero h1 { font-size: clamp(30px, 4.2vw, 48px); line-height: 1.08; font-weight: 700; margin: 0 0 14px; max-width: 18ch; color: #fff; } html:root body.jdh .hero p { font-size: 17px; line-height: 1.55; color: #c9dad3; margin: 0; max-width: 60ch; opacity: 1; } html:root body.jdh .hero .jh-facts { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 22px 0 0; padding: 0; list-style: none; font-size: 14px; color: #dbe8e2; } html:root body.jdh .hero .jh-facts li { display: flex; align-items: center; gap: 8px; } html:root body.jdh .hero .jh-facts li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--jh-gold); flex: none; } /* ── search card ────────────────────────────────────────────────────────────── */ html:root body.jdh .search-card { max-width: 1180px; margin: -84px auto 0; position: relative; z-index: 5; background: var(--jh-surface); border: 1px solid var(--jh-line); border-radius: 16px; box-shadow: 0 14px 40px rgba(16, 38, 30, .10); padding: 0 24px 22px; } html:root body.jdh .jh-products { display: flex; gap: 4px; border-bottom: 1px solid var(--jh-line); margin: 0 -24px 18px; padding: 0 16px; overflow-x: auto; scrollbar-width: none; } html:root body.jdh .jh-products::-webkit-scrollbar { display: none; } html:root body.jdh .jh-products a { flex: none; padding: 16px 12px 14px; font-size: 15px; font-weight: 600; color: var(--jh-muted); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; } html:root body.jdh .jh-products a:hover { color: var(--jh-ink); } html:root body.jdh .jh-products a.on { color: var(--jh-brand); border-bottom-color: var(--jh-brand); } html:root body.jdh .trip-tabs { display: inline-flex; gap: 0; padding: 3px; background: var(--jh-paper); border: 1px solid var(--jh-line); border-radius: 10px; margin: 0 0 16px; } html:root body.jdh .trip-tab { border: 0; background: none; padding: 7px 14px; border-radius: 8px; font-size: 14px; font-weight: 600; color: var(--jh-muted); box-shadow: none; cursor: pointer; } html:root body.jdh .trip-tab:hover { color: var(--jh-ink); background: none; } html:root body.jdh .trip-tab.active { background: var(--jh-surface); color: var(--jh-ink); box-shadow: 0 1px 3px rgba(16, 38, 30, .12); } html:root body.jdh .search-fields { gap: 12px; } html:root body.jdh .field label { font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--jh-muted); margin: 0 0 6px; } html:root body.jdh .field input, html:root body.jdh .field select, html:root body.jdh .pax-trigger { height: 50px; border: 1px solid var(--jh-line); border-radius: 10px; font-size: 16px; color: var(--jh-ink); background: var(--jh-surface); box-shadow: none; } html:root body.jdh .field input:hover, html:root body.jdh .field select:hover, html:root body.jdh .pax-trigger:hover { border-color: #b9c7c1; } html:root body.jdh .field input:focus, html:root body.jdh .field select:focus, html:root body.jdh .pax-trigger:focus { border-color: var(--jh-brand); box-shadow: 0 0 0 3px rgba(14, 90, 69, .14); outline: none; } html:root body.jdh .swap-btn { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--jh-line); background: var(--jh-surface); color: var(--jh-brand); align-self: end; margin-bottom: 5px; } html:root body.jdh .swap-btn:hover { background: var(--jh-brand-tint); border-color: var(--jh-brand); transform: none; } html:root body.jdh .sf-submit, html:root body.jdh .search-card .btn-accent { height: 50px; min-width: 150px; border-radius: 10px; background: var(--jh-brand); border: 0; color: #fff; font-size: 16px; font-weight: 600; box-shadow: none; align-self: end; } html:root body.jdh .sf-submit:hover { background: var(--jh-brand-dk); } html:root body.jdh #couponBar { margin-top: 14px; font-size: 14px; color: var(--jh-muted); } html:root body.jdh #couponBar input { height: 38px; border: 1px solid var(--jh-line); border-radius: 8px; } html:root body.jdh #couponBar .btn { height: 38px; border-radius: 8px; border: 1px solid var(--jh-line); background: var(--jh-surface); color: var(--jh-ink); font-weight: 600; } @media (max-width: 760px) { html:root body.jdh .hero { padding: 30px 16px 96px; } html:root body.jdh .hero p { font-size: 15px; } html:root body.jdh .hero .jh-facts { font-size: 13px; gap: 6px 16px; } html:root body.jdh .search-card { margin: -72px 12px 0; padding: 0 16px 16px; border-radius: 14px; } html:root body.jdh .jh-products { margin: 0 -16px 14px; padding: 0 6px; } html:root body.jdh .jh-products a { padding: 14px 10px 12px; font-size: 14px; } html:root body.jdh .trip-tabs { display: flex; width: 100%; } html:root body.jdh .trip-tab { flex: 1; text-align: center; padding: 8px 6px; font-size: 13px; } /* From / To stacked, the swap button floats on the seam between them */ html:root body.jdh .sf-row-top { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 10px; position: relative; } html:root body.jdh .sf-row-top .field-ap { grid-column: 1 / -1; min-width: 0; } html:root body.jdh .sf-row-top .field-date { min-width: 0; } html:root body.jdh .sf-row-top .field-date { grid-column: 1 / -1; } html:root body.jdh .sf-row-top:has(#returnField:not([style*="none"])) .field-date { grid-column: auto; } html:root body.jdh .swap-btn { position: absolute; right: 12px; top: 58px; z-index: 2; margin: 0; background: var(--jh-surface); } html:root body.jdh .sf-row-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 10px; } html:root body.jdh .sf-row-bottom .field { min-width: 0; } html:root body.jdh .sf-submit { grid-column: 1 / -1; width: 100%; } html:root body.jdh .pax-trigger { font-size: 15px; white-space: nowrap; } html:root body.jdh .field select { font-size: 15px; padding-right: 26px; } } /* ── sections ───────────────────────────────────────────────────────────────── */ html:root body.jdh .jh-section, html:root body.jdh .dest-section { max-width: 1180px; margin: 44px auto 0; padding: 0 20px; } html:root body.jdh .dest-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; margin: 0 0 16px; } html:root body.jdh .dest-section-head h2 { margin: 0; font-size: 24px; font-weight: 700; color: var(--jh-ink); } html:root body.jdh .dest-section-head p { margin: 4px 0 0; color: var(--jh-muted); font-size: 15px; flex-basis: 100%; } html:root body.jdh .dest-section-head a { font-size: 14px; font-weight: 600; color: var(--jh-brand); text-decoration: none; white-space: nowrap; } html:root body.jdh .dest-section-head a:hover { text-decoration: underline; } /* photo cards (plan-your-trip + destinations) */ html:root body.jdh .dest-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; } html:root body.jdh .dest-card { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: var(--jh-radius); overflow: hidden; background: #cfd9d5; text-decoration: none; color: #fff; } html:root body.jdh .dest-card img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; } html:root body.jdh .dest-card:hover img { transform: scale(1.03); } html:root body.jdh .dest-card-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 20, 16, 0) 42%, rgba(8, 20, 16, .72) 100%); display: flex; flex-direction: column; justify-content: space-between; padding: 12px; } html:root body.jdh .dest-card-badge { align-self: flex-start; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; background: rgba(255, 255, 255, .92); color: var(--jh-ink); border-radius: 6px; padding: 3px 8px; border: 0; } html:root body.jdh .dest-card-info { margin-top: auto; } html:root body.jdh .dc-city { font-family: var(--jh-display); font-size: 18px; font-weight: 700; line-height: 1.2; } html:root body.jdh .dc-from { font-size: 13px; color: #e3ece8; margin-top: 2px; } @media (max-width: 1024px) { html:root body.jdh .dest-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 760px) { html:root body.jdh .jh-section, html:root body.jdh .dest-section { margin-top: 32px; padding: 0 16px; } html:root body.jdh .dest-section-head h2 { font-size: 20px; } html:root body.jdh .dest-section-head a { font-size: 13px; } /* a horizontal strip on phones instead of a 12-card wall */ html:root body.jdh .dest-grid { display: flex; overflow-x: auto; gap: 10px; scroll-snap-type: x mandatory; margin: 0 -16px; padding: 0 16px 6px; scrollbar-width: none; } html:root body.jdh .dest-grid::-webkit-scrollbar { display: none; } html:root body.jdh .dest-card { flex: 0 0 42%; scroll-snap-align: start; } } /* Special Fixed Departure routes (cards drawn by jd-fd.js) */ html:root body.jdh #fdHomeSection .dest-section-head h2 .jh-star { color: var(--jh-gold); } @media (max-width: 760px) { html:root body.jdh .fd-home-routes { display: flex; overflow-x: auto; gap: 10px; margin: 0 -16px; padding: 0 16px 6px; scroll-snap-type: x mandatory; scrollbar-width: none; } html:root body.jdh .fd-home-routes::-webkit-scrollbar { display: none; } html:root body.jdh .fd-home-route { flex: 0 0 68%; scroll-snap-align: start; } } /* honest how-it-works row */ html:root body.jdh .jh-how { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; background: var(--jh-surface); border: 1px solid var(--jh-line); border-radius: var(--jh-radius); } html:root body.jdh .jh-how > div { padding: 20px 22px; border-left: 1px solid var(--jh-line); } html:root body.jdh .jh-how > div:first-child { border-left: 0; } html:root body.jdh .jh-how b { display: block; font-family: var(--jh-display); font-size: 16px; font-weight: 700; margin: 0 0 4px; color: var(--jh-ink); } html:root body.jdh .jh-how span { font-size: 14px; line-height: 1.5; color: var(--jh-muted); } @media (max-width: 760px) { html:root body.jdh .jh-how { grid-template-columns: 1fr; } html:root body.jdh .jh-how > div { border-left: 0; border-top: 1px solid var(--jh-line); padding: 16px; } html:root body.jdh .jh-how > div:first-child { border-top: 0; } } /* airlines — a plain line of names, not a wall of chips */ html:root body.jdh .airlines-strip { background: none; border: 0; margin: 36px auto 0; max-width: 1180px; padding: 0 20px; } html:root body.jdh .airlines-strip-inner { display: flex; align-items: baseline; gap: 10px 18px; flex-wrap: wrap; padding: 16px 0; border-top: 1px solid var(--jh-line); border-bottom: 1px solid var(--jh-line); max-width: none; } html:root body.jdh .airlines-strip-label { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--jh-muted); margin: 0; } html:root body.jdh .airlines-logos { display: flex; flex-wrap: wrap; gap: 6px 18px; } html:root body.jdh .airline-chip { background: none !important; border: 0 !important; padding: 0 !important; font-size: 14px; font-weight: 500; color: var(--jh-ink-2) !important; box-shadow: none; } html:root body.jdh .airline-chip:hover { color: var(--jh-brand) !important; text-decoration: underline; } /* admin announcements + recent searches */ html:root body.jdh #annStrip .alert { background: var(--jh-gold-tint); color: #6b4308; border: 1px solid #efd6ab; border-radius: 10px; font-weight: 500; } html:root body.jdh #annStrip .alert b { font-weight: 700; } /* popular routes (main.js .route-row) */ html:root body.jdh #homeSections { max-width: 1180px; margin: 0 auto; padding: 0 20px; } html:root body.jdh .routes-2col { gap: 28px; margin-top: 0; } html:root body.jdh .routes-2col h3 { font-size: 17px; font-weight: 700; color: var(--jh-ink); border-bottom: 1px solid var(--jh-line); padding-bottom: 10px; margin: 0 0 4px; } html:root body.jdh .route-row { background: none; border: 0; border-bottom: 1px solid var(--jh-line); border-radius: 0; padding: 11px 0; margin: 0; box-shadow: none; } html:root body.jdh .rr-thumb { width: 36px; height: 36px; border-radius: 8px; } html:root body.jdh .route-row .rr-path { font-size: 15px; font-variant-numeric: tabular-nums; } html:root body.jdh .route-row .rr-path b { font-weight: 600; } html:root body.jdh .route-row .rr-btn { background: none; color: var(--jh-brand); border: 1px solid var(--jh-line); border-radius: 8px; padding: 7px 12px; font-size: 13px; font-weight: 600; } html:root body.jdh .route-row .rr-btn:hover { border-color: var(--jh-brand); background: var(--jh-brand-tint); filter: none; } @media (max-width: 760px) { html:root body.jdh #homeSections { padding: 0 16px; } html:root body.jdh .routes-2col { grid-template-columns: 1fr; gap: 24px; } } /* holiday packages: text tiles — the grid only had one stock aircraft photo to repeat */ html:root body.jdh .sec-title { text-align: left; font-size: 24px; font-weight: 700; color: var(--jh-ink); margin: 44px 0 16px; } html:root body.jdh .sec-title::after { display: none; } html:root body.jdh #holidayGrid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 0; } html:root body.jdh #holidayGrid .best-card { border: 1px solid var(--jh-line); border-radius: 10px; box-shadow: none; } html:root body.jdh #holidayGrid .best-card:hover { transform: none; border-color: var(--jh-brand); } html:root body.jdh #holidayGrid .best-card img, html:root body.jdh #holidayGrid .bc-img { display: none; } html:root body.jdh #holidayGrid .bc-body { padding: 14px; } html:root body.jdh #holidayGrid .bc-route { font-family: var(--jh-display); font-weight: 700; } html:root body.jdh #holidayGrid .bc-price { color: var(--jh-muted); font-weight: 500; } html:root body.jdh #holidayGrid .bc-btn { background: none; color: var(--jh-brand); padding: 0; text-align: left; margin-top: 6px; } html:root body.jdh #holidayGrid .bc-btn:hover { background: none; text-decoration: underline; color: var(--jh-brand); } @media (max-width: 760px) { html:root body.jdh #holidayGrid { grid-template-columns: 1fr 1fr; } } /* SEO intro + testimonials + newsletter + hub */ html:root body.jdh #seoIntro { margin: 44px 0 0 !important; padding: 26px 0 0; border-top: 1px solid var(--jh-line); } html:root body.jdh #seoIntro h2 { font-size: 22px !important; font-weight: 700 !important; } html:root body.jdh #seoIntro p { color: var(--jh-ink-2) !important; max-width: 72ch !important; } html:root body.jdh #seoIntro a { color: var(--jh-brand) !important; border-color: var(--jh-line) !important; border-radius: 8px !important; } html:root body.jdh #reviewsSection .why-grid { gap: 12px; } html:root body.jdh #reviewsSection .why-item { background: var(--jh-surface); box-shadow: none; } html:root body.jdh .jh-review-cta { margin: 20px 0 0; font-size: 14px; color: var(--jh-muted); } html:root body.jdh .jh-review-cta a { color: var(--jh-brand); font-weight: 600; } html:root body.jdh .newsletter { background: var(--jh-surface); border: 1px solid var(--jh-line); border-radius: var(--jh-radius); box-shadow: none; color: var(--jh-ink); margin: 40px 0 0; } html:root body.jdh .newsletter h3 { color: var(--jh-ink); font-size: 18px; } html:root body.jdh .newsletter p { color: var(--jh-muted); } html:root body.jdh .newsletter .nl-form input { height: 46px; border: 1px solid var(--jh-line); border-radius: 10px; } html:root body.jdh .newsletter .btn { height: 46px; border-radius: 10px; background: var(--jh-brand); border: 0; color: #fff; font-weight: 600; } html:root body.jdh .hub-section { max-width: 1180px !important; padding: 36px 20px 8px !important; } html:root body.jdh .hub-chip { background: var(--jh-surface) !important; border-color: var(--jh-line) !important; color: var(--jh-ink-2) !important; border-radius: 8px !important; } html:root body.jdh .hub-chip:hover { border-color: var(--jh-brand) !important; color: var(--jh-brand) !important; } /* ── results area (the rows themselves are styled in jd-fd.css) ─────────────── */ html:root body.jdh #resultsArea { max-width: 1180px; margin: 28px auto 0; padding: 0 20px; } @media (max-width: 760px) { html:root body.jdh #resultsArea { padding: 0 12px; margin-top: 18px; } } /* sticky "change search" bar */ html:root body.jdh #stickyBar { background: var(--jh-surface); border-bottom: 1px solid var(--jh-line); box-shadow: 0 4px 16px rgba(16, 38, 30, .08); } html:root body.jdh #stickyBar #stickyBackBtn { background: var(--jh-brand); color: #fff; border: 0; border-radius: 8px; } /* ── floating buttons: to the RIGHT on phones, clear of the price column ────── */ @media (max-width: 760px) { html:root body.jdh #cbFab { left: auto !important; right: 14px !important; bottom: 14px !important; width: 48px !important; height: 48px !important; } html:root body.jdh #ob-lang-wrap { left: auto !important; right: 14px !important; bottom: 72px !important; transform: scale(.9); transform-origin: bottom right; } html:root body.jdh { padding-bottom: 12px; } } @media (prefers-reduced-motion: reduce) { html:root body.jdh .dest-card img { transition: none; } html:root body.jdh .dest-card:hover img { transform: none; } } /* ── pass 2 (after the first preview) ─────────────────────────────────────────── */ /* holiday tiles: the one aircraft photo repeated, and "from ₹" figures that disagree with the package pages */ html:root body.jdh #holidayGrid .best-thumb, html:root body.jdh #holidayGrid .bc-price { display: none; } /* route rows: every domestic row showed the same aircraft thumbnail */ html:root body.jdh .rr-thumb { display: none; } html:root body.jdh .jh-how { margin-top: 28px; } html:root body.jdh #seoIntro { margin-top: 28px !important; } @media (max-width: 760px) { /* language pill becomes a globe-only circle stacked above the chat button (the word stays for screen readers) */ html:root body.jdh #ob-lang-wrap { transform: none; right: 14px !important; bottom: 70px !important; } html:root body.jdh #ob-lang-btn { font-size: 0 !important; width: 44px !important; height: 44px !important; padding: 0 !important; border-radius: 50% !important; display: inline-flex !important; align-items: center; justify-content: center; } html:root body.jdh #ob-lang-btn span { font-size: 18px !important; } } /* ── pass 3: hub, agent strip, fare alerts, footer ─────────────────────────────── */ html:root body.jdh .hub-section h2 { color: var(--jh-ink) !important; } html:root body.jdh .hub-section p { color: var(--jh-muted) !important; } html:root body.jdh .hub-section p a { color: var(--jh-brand) !important; } html:root body.jdh .jh-hub { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } html:root body.jdh .jh-hub a { display: block; text-decoration: none; background: var(--jh-surface); border: 1px solid var(--jh-line); border-radius: var(--jh-radius); padding: 18px 20px; } html:root body.jdh .jh-hub a:hover { border-color: var(--jh-brand); } html:root body.jdh .jh-hub b { display: block; font-family: var(--jh-display); font-size: 17px; font-weight: 700; color: var(--jh-ink); } html:root body.jdh .jh-hub span { display: block; margin-top: 4px; font-size: 14px; color: var(--jh-muted); } html:root body.jdh .jh-agent-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-top: 12px; background: var(--jh-brand-tint); border: 1px solid #cfe2da; border-radius: var(--jh-radius); padding: 18px 20px; } html:root body.jdh .jh-agent-cta b { display: block; font-family: var(--jh-display); font-size: 18px; color: var(--jh-ink); } html:root body.jdh .jh-agent-cta span { display: block; font-size: 14px; color: var(--jh-ink-2); margin-top: 2px; } html:root body.jdh .jh-agent-cta a { background: var(--jh-brand); color: #fff; font-weight: 600; text-decoration: none; border-radius: 10px; padding: 12px 20px; white-space: nowrap; } html:root body.jdh .jh-agent-cta a:hover { background: var(--jh-brand-dk); } html:root body.jdh .hub-chip { font-weight: 500 !important; } @media (max-width: 760px) { html:root body.jdh .jh-hub { grid-template-columns: 1fr; } html:root body.jdh .jh-agent-cta a { width: 100%; text-align: center; } } /* fare alerts: no clipped button, no decorative plane */ html:root body.jdh .newsletter { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; padding: 24px 26px; overflow: visible; } html:root body.jdh .newsletter::before, html:root body.jdh .newsletter::after { display: none; content: none; } html:root body.jdh .newsletter > div:first-child { flex: 1 1 360px; } html:root body.jdh .newsletter .nl-form { flex: 1 1 360px; max-width: 460px; min-width: 0; } html:root body.jdh .newsletter .nl-form input { background: var(--jh-surface); min-width: 0; } html:root body.jdh .newsletter .nl-form .btn { background: var(--jh-brand); padding: 0 20px; } @media (max-width: 760px) { html:root body.jdh .newsletter { padding: 18px; } html:root body.jdh .newsletter .nl-form { flex-basis: 100%; max-width: none; } } /* footer: the site's evergreen, not a second navy brand */ html:root body.jdh .site-footer { background: #0f211b; } html:root body.jdh .site-footer .sf-top { border-bottom-color: rgba(255, 255, 255, .08); } html:root body.jdh .site-footer .sf-trust { color: #b9cfc6; } html:root body.jdh .site-footer .sf-trust b { color: #fff; font-weight: 600; } html:root body.jdh .site-footer a:hover { color: #fff; } /* brand.js appends "🌐 Best Travel Portal in " to every footer — an unverifiable superlative */ html:root body.jdh .bp-geo { display: none !important; } /* footer trust items read as one line each ("Secure payments — UPI, cards and net banking") */ html:root body.jdh .site-footer .sf-trust { display: block; font-size: 13px; line-height: 1.5; } html:root body.jdh .site-footer .sf-trust b { display: inline; }