/* Homepage sections, shared by every site style: a light cream and sand palette, navy text and gold
   accents. Headings keep the font of the selected style. */
.home-hero,
.home-cities,
.home-formulas,
.home-hajj,
.home-reviews,
.home-explore,
.home-mosaic,
.home-final-cta {
    --home-cream: #f7f1e6;
    --home-sand: #efe4d0;
    --home-ink: #16283a;
    --home-muted: #5d6874;
    --home-gold: #80602f;
    --home-line: #e4d9c5;
    --home-card: #fffdf9;
    --home-shadow: 0 1px 2px rgba(22, 40, 58, .04), 0 16px 36px rgba(22, 40, 58, .08);
    --home-accent-soft: rgba(168, 131, 74, .1);
    --home-cta: #e2b467;
    --home-cta-ink: #1c1a14;
    --home-cta-bg: #e2b467;
    --home-hero-shade: rgba(20, 28, 38, .82);
    --home-hero-shade-mid: rgba(20, 28, 38, .45);
    --home-highlight-line: #d8c39a;
    --home-highlight-bg: #f8efdd;
    --home-glow-a: #f1dfbd;
    --home-glow-b: #dbe9ee;
    /* Colours of the flowing hero background, read by motion.js. */
    --home-flow-base: #f7f1e6;
    --home-flow-a: #f1dcb7;
    --home-flow-b: #d8e8ee;
    --home-flow-c: #dcebe0;
    color: var(--home-ink);
}
/* "Bleu et blanc" palette (Admin > Style du site), closer to the Hisar Europe blue. */
body.home-palette-blue :is(.home-hero, .home-cities, .home-formulas, .home-hajj, .home-reviews, .home-explore, .home-mosaic, .home-final-cta) {
    --home-cream: #f3f8fd;
    --home-sand: #e5f0fa;
    --home-ink: #0b3a66;
    --home-muted: #52677d;
    --home-gold: #0f5f9f;
    --home-line: #d5e3f0;
    --home-card: #fff;
    --home-shadow: 0 1px 2px rgba(11, 58, 102, .05), 0 16px 36px rgba(11, 58, 102, .09);
    --home-accent-soft: rgba(15, 95, 159, .09);
    --home-cta: #7cc4f4;
    --home-cta-ink: #fff;
    --home-cta-bg: #1170c2;
    --home-hero-shade: rgba(6, 45, 84, .84);
    --home-hero-shade-mid: rgba(6, 45, 84, .45);
    --home-highlight-line: #9cc6e6;
    --home-highlight-bg: #e8f3fc;
    --home-glow-a: #d4e8f8;
    --home-glow-b: #d9f0ee;
    --home-flow-base: #f6f9fd;
    --home-flow-a: #cfe4f6;
    --home-flow-b: #e2eefa;
    --home-flow-c: #d3eeeb;
}
.home-section-head { max-width: 680px; margin: 0 auto 38px; text-align: center; }
html body main section .home-section-head p.section-kicker { color: var(--home-gold); }
main .home-section-head h2 { margin: 0 0 12px; color: var(--home-ink); font-size: clamp(32px, 3.6vw, 48px); line-height: 1.12; }
.home-section-head > p:not(.section-kicker) { margin: 0; color: var(--home-muted); font-size: 17px; line-height: 1.7; }

/* Buttons */
.home-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    border: 1px solid var(--home-line);
    border-radius: 999px;
    padding: 0 24px;
    color: var(--home-ink);
    background: var(--home-card);
    font-weight: 600;
    transition: translate .25s ease, box-shadow .25s ease, background .25s ease;
}
.home-button svg { width: 19px; height: 19px; flex: 0 0 19px; fill: currentColor; }
.home-button.is-primary { border-color: var(--home-cta-bg, #e2b467); color: var(--home-cta-ink); background: var(--home-cta-bg, #e2b467); box-shadow: 0 10px 26px rgba(0, 0, 0, .14); }
.home-button.is-whatsapp { border-color: #137a3e; color: #fff; background: #137a3e; }
.home-button.is-whatsapp svg { fill: #fff; }
.home-button:hover { translate: 0 -2px; box-shadow: var(--home-shadow); }
.home-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* 1. Hero: the photo fills the screen (slow zoom, drifts with the scroll), title in large white type,
   two glass badges. The overlay uses the palette ink so the text stays readable on any photo. */
.home-hero {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: min(86vh, 780px);
    overflow: hidden;
    isolation: isolate;
    padding: clamp(56px, 7vw, 96px) 0 clamp(96px, 9vw, 130px);
    color: #fff;
    background: var(--home-ink);
}
.home-hero.is-height-medium { min-height: min(92vh, 860px); }
.home-hero.is-height-high { min-height: 100vh; }
.home-hero-photo { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.home-hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.home-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, var(--home-hero-shade) 0%, var(--home-hero-shade-mid) 42%, transparent 78%),
        linear-gradient(0deg, var(--home-hero-shade-mid) 0%, transparent 35%);
}
.home-hero-inner { width: min(1220px, 90vw); margin: 0 auto; }
.home-hero-copy { max-width: 700px; }
html body main .home-hero p.home-hero-kicker { margin: 0 0 18px; color: var(--home-cta); font-size: 15px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
html body main .home-hero h1 { margin: 0 0 22px; color: #fff; font-size: clamp(46px, 6.6vw, 96px); line-height: 1.02; text-shadow: 0 2px 30px rgba(0, 0, 0, .25); }
.home-hero-text { max-width: 580px; margin: 0 0 32px; color: rgba(255, 255, 255, .9); font-size: clamp(18px, 1.5vw, 21px); line-height: 1.7; }
.home-hero .home-button:not(.is-primary):not(.is-whatsapp) { border-color: rgba(255, 255, 255, .6); color: #fff; background: transparent; }
.home-hero-proof { display: inline-flex; align-items: center; gap: 12px; margin: 30px 0 0; border: 1px solid rgba(216, 182, 95, .55); border-radius: 16px; padding: 10px 18px 10px 12px; color: #fff; background: rgba(7, 20, 42, .42); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.home-hero-proof svg { flex: 0 0 34px; width: 34px; height: 34px; fill: none; stroke: #d8b65f; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.home-hero-proof span { display: grid; gap: 2px; }
.home-hero-proof strong { font-size: 17px; font-weight: 600; line-height: 1.25; }
.home-hero-proof small { color: rgba(255, 255, 255, .82); font-size: 14px; line-height: 1.3; }
.home-hero-scroll {
    position: absolute;
    left: 50%;
    bottom: 64px;
    display: inline-flex;
    gap: 8px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    translate: -50% 0;
}
.home-hero-scroll span { display: inline-block; animation: home-bounce 1.8s ease-in-out infinite; }
@keyframes home-bounce { 50% { transform: translateY(6px); } }

/* 3. Departure cities */
.home-cities { padding: clamp(72px, 9vw, 110px) 5vw clamp(56px, 7vw, 90px); background: #fff; }
.home-city-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; width: min(1220px, 100%); margin: 0 auto; }
.home-city-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 250px;
    border: 1px solid var(--home-line);
    border-radius: 120px 120px 20px 20px;
    padding: 34px 26px 26px;
    color: var(--home-ink);
    background: linear-gradient(180deg, var(--home-cream), var(--home-card) 60%);
    text-align: center;
    transition: translate .3s ease, box-shadow .3s ease, border-color .3s ease;
}
a.home-city-card:hover { translate: 0 -6px; border-color: var(--home-gold); box-shadow: var(--home-shadow); }
.home-city-icon { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 6px; border-radius: 50%; color: var(--home-gold); background: var(--home-accent-soft); transition: rotate .4s ease, translate .4s ease; }
.home-city-icon svg { width: 22px; height: 22px; }
a.home-city-card:hover .home-city-icon { rotate: -12deg; translate: 3px -3px; }
.home-city-label { color: var(--home-gold); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.home-city-name { font-family: inherit; font-size: clamp(30px, 3vw, 40px); font-weight: 600; line-height: 1.1; }
main .home-city-card .home-city-name { font-family: var(--theme-heading, var(--prestige-serif, inherit)); }
.home-city-meta { color: var(--home-muted); font-size: 14px; }
.home-city-price { margin-top: auto; font-size: 15px; color: var(--home-muted); }
.home-city-price strong { color: var(--home-ink); font-size: 26px; }
.home-city-go { position: absolute; right: 22px; bottom: 20px; color: var(--home-gold); font-size: 22px; transition: translate .3s ease; }
a.home-city-card:hover .home-city-go { translate: 4px 0; }
.home-city-card.is-other { border-style: dashed; background: var(--home-cream); text-align: left; border-radius: 20px; padding: 26px; }
.home-city-card.is-other .home-city-name { font-size: 26px; }
.home-city-card.is-other label { display: grid; gap: 4px; color: var(--home-muted); font-size: 13px; font-weight: 600; }
.home-city-card.is-other input { min-height: 42px; border: 1px solid var(--home-line); border-radius: 10px; padding: 0 12px; background: #fff; font: inherit; color: var(--home-ink); }
.home-city-card.is-other button { min-height: 46px; margin-top: 4px; border: 0; border-radius: 999px; color: #fff; background: var(--home-ink); font: inherit; font-weight: 600; cursor: pointer; }
.home-city-card.is-other small { color: var(--home-muted); font-size: 12px; line-height: 1.5; }

/* 4. Formulas */
.home-formulas { padding: clamp(64px, 8vw, 100px) 5vw; background: var(--home-cream); }
.home-formula-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; width: min(1040px, 100%); margin: 0 auto; }
.home-formula-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--home-line); border-radius: 24px; padding: 32px; background: var(--home-card); box-shadow: var(--home-shadow); }
.home-formula-card.is-comfort { border-color: var(--home-highlight-line); background: linear-gradient(160deg, var(--home-card), var(--home-highlight-bg)); }
.home-formula-tag { margin: 0 0 6px; color: var(--home-gold); font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
main .home-formula-card h3 { margin: 0 0 18px; color: var(--home-ink); font-size: 24px; }
.home-formula-card ul { display: grid; gap: 12px; margin: 0 0 24px; padding: 0; list-style: none; color: var(--home-muted); font-size: 15px; line-height: 1.5; }
.home-formula-card li { display: flex; gap: 12px; }
.home-formula-card li svg { width: 20px; height: 20px; flex: 0 0 20px; color: var(--home-gold); }
.home-formula-card a { margin-top: auto; color: var(--home-ink); font-weight: 600; }
.home-formulas-more { margin: 26px 0 0; text-align: center; }
.home-formulas-more a { color: var(--home-ink); font-weight: 600; border-bottom: 1px solid var(--home-gold); }

/* 6. Hajj 2027 */
.home-hajj {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 0;
    width: min(1220px, 90vw);
    margin: clamp(56px, 7vw, 90px) auto;
    overflow: hidden;
    border: 1px solid var(--home-line);
    border-radius: 28px;
    background: var(--home-sand);
}
.home-hajj-copy { padding: clamp(32px, 5vw, 64px); }
html body main section.home-hajj p.section-kicker { color: var(--home-gold); }
main .home-hajj h2 { margin: 0 0 14px; color: var(--home-ink); font-size: clamp(30px, 3.4vw, 44px); line-height: 1.12; }
.home-hajj-copy > p:not(.section-kicker) { margin: 0 0 26px; color: var(--home-muted); line-height: 1.7; }
.home-hajj-photo { overflow: hidden; min-height: 280px; }
.home-hajj img { width: 100%; height: 100%; min-height: 280px; object-fit: cover; }

/* 7. Categories after the Hajj block, and the final call to action */
.home-explore { padding: 10px 5vw 0; }
.home-explore .home-section-head { margin-bottom: 26px; }
main .home-explore + .home-categories { margin-top: 0; margin-bottom: clamp(56px, 7vw, 90px); }
.home-final-cta { padding: clamp(64px, 8vw, 100px) 5vw; text-align: center; background: linear-gradient(180deg, var(--home-cream), var(--home-sand)); }
html body main section.home-final-cta p.section-kicker { color: var(--home-gold); }
main .home-final-cta h2 { margin: 0 0 12px; color: var(--home-ink); font-size: clamp(32px, 3.6vw, 48px); }
.home-final-cta > p:not(.section-kicker) { max-width: 560px; margin: 0 auto 28px; color: var(--home-muted); line-height: 1.7; }
.home-final-cta .home-hero-actions { justify-content: center; }

@media (max-width: 960px) {
    .home-formula-grid, .home-hajj { grid-template-columns: 1fr; }
    .home-hajj img { max-height: 280px; }
}
@media (max-width: 560px) {
    .home-hero-actions .home-button { flex: 1 1 auto; }
    .home-city-card { min-height: 200px; }
    .home-formula-card { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
    .home-button, .home-city-card, .home-city-go { transition: none; }
}

/* Existing homepage sections follow the blue palette too (stronger selectors than the style sheets). */
body.home-palette-blue main section.home-journal { background: #eef5fb; }
body.home-palette-blue main section.reviews-section { background: #f3f8fd; }
html body.home-palette-blue > main { --page: #f6f9fd; background: #f6f9fd; }
html body.home-palette-blue main section .home-journal-copy p.section-kicker { color: #0f5f9f; }

/* Readability: larger text, labels and images across the homepage (desktop and phones). */
html body main :is(.home-hero, .home-cities, .home-formulas, .home-hajj, .home-reviews, .home-explore, .home-final-cta) p.section-kicker,
html body main section.home-journal p.section-kicker { font-size: 14px; letter-spacing: .14em; }
.home-button { min-height: 56px; padding: 0 28px; font-size: 17px; }
.home-section-head > p:not(.section-kicker) { font-size: 18px; }
.home-city-label { font-size: 13px; }
.home-city-meta { font-size: 16px; }
.home-city-price { font-size: 17px; }
.home-city-price strong { font-size: 30px; }
.home-city-card.is-other .home-city-label { font-size: 14px; letter-spacing: .08em; }
.home-city-card.is-other label { font-size: 15px; }
.home-city-card.is-other input { min-height: 48px; font-size: 16px; }
.home-city-card.is-other button { min-height: 52px; font-size: 17px; }
.home-city-card.is-other small, .home-city-card.is-other small a { font-size: 14px; }
.home-formula-tag { font-size: 14px; }
main .home-formula-card h3 { font-size: 27px; }
.home-formula-card ul { font-size: 17px; }
.home-formula-card a, .home-formulas-more a { font-size: 17px; }
.home-hajj-copy > p:not(.section-kicker), .home-final-cta > p:not(.section-kicker) { font-size: 17px; }
.home-hajj img { min-height: 380px; }
main section.reviews-section :is(.review-maps-link, .review-write-link) { font-size: 15px; }
main section.reviews-section .review-card p { font-size: 16px; }
main section.home-journal .home-journal-highlights li { font-size: 15px; }
main section.home-journal .home-journal-photo figcaption { font-size: 16px; }
main section.home-journal .home-journal-experience > span { font-size: 14px; }
main section.home-journal .home-journal-experience strong span { font-size: 16px; }
main .home-categories img { height: 190px; }
main .home-categories strong { font-size: 19px; }
@media (max-width: 960px) {
}
@media (max-width: 560px) {
    .home-button { font-size: 17px; }
    .home-hajj img { min-height: 300px; }
    main .home-categories img { height: 150px; }
    main .home-categories strong { font-size: 17px; }
}

/* Richer homepage: city cards with photos, a strong colour band and a photo mosaic. */
a.home-city-card {
    overflow: hidden;
    justify-content: flex-end;
    min-height: 380px;
    border: 0;
    border-radius: 28px;
    padding: 28px;
    color: #fff;
    background: var(--home-ink);
    text-align: left;
    box-shadow: var(--home-shadow);
}
.home-city-photo { position: absolute; inset: 0; z-index: 0; }
.home-city-photo img { width: 100%; height: 100%; object-fit: cover; transition: scale .8s var(--motion-ease, ease); }
.home-city-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .05) 20%, var(--home-hero-shade) 100%); }
a.home-city-card > :not(.home-city-photo, .home-city-go) { position: relative; z-index: 1; }
a.home-city-card .home-city-go { z-index: 1; }
a.home-city-card:hover .home-city-photo img { scale: 1.08; }
a.home-city-card:hover { translate: 0 -8px; box-shadow: 0 24px 50px rgba(0, 0, 0, .2); }
a.home-city-card .home-city-icon { margin: 0 0 auto; color: var(--home-cta-ink); background: var(--home-cta-bg); }
a.home-city-card .home-city-label { color: rgba(255, 255, 255, .85); }
html body main a.home-city-card .home-city-name { color: #fff; font-size: clamp(38px, 3.6vw, 52px); }
a.home-city-card .home-city-meta { color: rgba(255, 255, 255, .85); }
a.home-city-card .home-city-price { margin-top: 10px; color: rgba(255, 255, 255, .85); }
a.home-city-card .home-city-price strong { color: #fff; font-size: 38px; }
a.home-city-card .home-city-go { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: var(--home-cta-ink); background: var(--home-cta-bg); right: 24px; bottom: 26px; }


.home-mosaic { padding: clamp(64px, 8vw, 100px) 5vw; background: #fff; }
.home-mosaic-grid { display: grid; grid-auto-flow: dense; grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(150px, 16vw, 230px); gap: 14px; width: min(1220px, 100%); margin: 0 auto; }
.home-mosaic-grid figure { margin: 0; overflow: hidden; border-radius: 20px; background: var(--home-sand); }
.home-mosaic-grid figure:nth-child(1) { grid-column: span 2; grid-row: span 2; }
/* Seven photos fill four columns and three rows: one large, four small, two wide. */
.home-mosaic-grid figure:nth-child(6), .home-mosaic-grid figure:nth-child(7) { grid-column: span 2; }
.home-mosaic-grid img { width: 100%; height: 100%; object-fit: cover; transition: scale .8s ease; }
.home-mosaic-grid figure:hover img { scale: 1.06; }

@media (max-width: 960px) {
    .home-hero { min-height: auto; padding-top: 64px; }
    .home-hero::before { background: linear-gradient(0deg, var(--home-hero-shade) 0%, var(--home-hero-shade-mid) 60%, rgba(0, 0, 0, .15) 100%); }
    .home-mosaic-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 170px; }
    .home-mosaic-grid figure:nth-child(6), .home-mosaic-grid figure:nth-child(7) { grid-column: auto; }
}
@media (max-width: 560px) {
    .home-hero { padding: 56px 0 110px; }
    a.home-city-card { min-height: 320px; }
    .home-hero-scroll { display: none; }
    .home-hero { padding-bottom: 72px; }
    .home-mosaic-grid { grid-auto-rows: 140px; gap: 10px; }
    .home-mosaic-grid figure:nth-child(n + 6) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .home-hero-scroll span { animation: none; }
    .home-city-photo img, .home-mosaic-grid img { transition: none; }
}
@media (max-width: 560px) {
    .home-hero-proof::before { display: none; }
}

/* Formula cards open on a destination photo. */
.home-formula-photo { overflow: hidden; height: 200px; margin: -32px -32px 24px; }
.home-formula-photo img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 560px) {
    .home-formula-photo { height: 170px; margin: -24px -24px 20px; }
}
/* Six photos: the last one runs across the full width so the grid has no gap. */
.home-mosaic-grid figure:nth-child(6):last-child { grid-column: 1 / -1; }

/* Duration under the city price. */
a.home-city-card .home-city-price small { display: block; margin-top: 2px; color: rgba(255, 255, 255, .85); font-size: 15px; }

/* Reviews: one large review beside four shorter ones, all in the homepage palette. */
.home-reviews { padding: clamp(64px, 8vw, 100px) 5vw; background: var(--home-cream); }
/* Masonry columns: each card takes the height of its own text, so no card is left half empty. */
.home-reviews-grid { columns: 3; column-gap: 18px; width: min(1220px, 100%); margin: 0 auto; }
.home-review { display: flex; flex-direction: column; gap: 16px; margin: 0 0 18px; break-inside: avoid; border: 1px solid var(--home-line); border-radius: 22px; padding: 26px; background: var(--home-card); box-shadow: var(--home-shadow); }
.home-review.is-featured { padding: clamp(28px, 3vw, 40px); }
.home-review figcaption { padding-top: 4px; }
.home-review-stars { color: #d9a640; font-size: 18px; letter-spacing: .12em; }
.home-review blockquote { margin: 0; }
.home-review blockquote p { display: -webkit-box; margin: 0; overflow: hidden; color: var(--home-ink); font-size: 16px; line-height: 1.65; -webkit-line-clamp: 5; -webkit-box-orient: vertical; }
.home-review.is-open blockquote p { display: block; -webkit-line-clamp: unset; }
/* Every review is cut to the same number of lines so the cards stay even; "Lire la suite" opens the rest. */
.home-review.is-featured blockquote p { font-size: clamp(19px, 1.6vw, 22px); line-height: 1.6; -webkit-line-clamp: 9; }
.home-review.is-featured blockquote::before { content: '“'; display: block; height: 46px; color: var(--home-gold); font-family: Georgia, serif; font-size: 80px; line-height: 1; }
.home-review-more { align-self: flex-start; margin-top: -6px; border: 0; padding: 0; color: var(--home-gold); background: none; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
.home-review figcaption { display: flex; align-items: center; gap: 12px; }
.home-review-avatar { display: grid; flex: 0 0 44px; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: #fff; background: var(--home-ink); font-weight: 600; }
.home-review figcaption strong { display: block; color: var(--home-ink); font-size: 16px; }
.home-review figcaption small { color: var(--home-muted); font-size: 14px; }
.home-reviews-link { margin: 28px 0 0; text-align: center; }
.home-reviews-link a { color: var(--home-ink); font-size: 17px; font-weight: 600; border-bottom: 1px solid var(--home-gold); }
@media (max-width: 960px) {
    .home-reviews-grid { columns: 2; }
}
@media (max-width: 560px) {
    /* Phones: the reviews become a row to swipe through. */
    .home-reviews-grid { display: flex; columns: auto; gap: 14px; width: auto; margin: 0 -5vw; padding: 4px 5vw 14px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
    .home-reviews-grid::-webkit-scrollbar { display: none; }
    .home-reviews-grid { align-items: flex-start; }
    .home-review { flex: 0 0 86%; margin: 0; scroll-snap-align: center; }
    .home-review.is-featured blockquote p { font-size: 18px; -webkit-line-clamp: 6; }
    .home-review figcaption { margin-top: 4px; }
}
/* Confirmation shown next to the city cards after "Être prévenu" (the page returns to this section). */
.home-cities-flash { width: min(1220px, 100%); margin: 0 auto 18px; border-radius: 14px; padding: 14px 18px; color: #166534; background: #e9f9ee; font-weight: 600; }

/* Link from the departure cities to the calendar of departures. */
.home-cities-calendar { margin: 0; }
.home-cities-calendar a { color: var(--home-ink); font-size: 17px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }

/* City cards: a darker shade under the words so the city reads on any photo, and the city name larger than the price. */
a.home-city-card .home-city-photo::after { background: linear-gradient(180deg, rgba(6, 22, 40, 0) 22%, rgba(6, 22, 40, .55) 48%, rgba(6, 22, 40, .93) 100%); }
a.home-city-card :is(.home-city-label, .home-city-name, .home-city-meta, .home-city-price) { text-shadow: 0 1px 12px rgba(0, 0, 0, .45); }
a.home-city-card .home-city-label { color: #fff; font-weight: 600; }
html body main a.home-city-card .home-city-name { font-size: clamp(46px, 4.4vw, 62px); font-weight: 600; }
a.home-city-card .home-city-meta { color: #fff; }
a.home-city-card .home-city-price { color: rgba(255, 255, 255, .9); font-size: 16px; }
a.home-city-card .home-city-price strong { font-size: 28px; }
a.home-city-card .home-city-price small { display: block; margin-top: 2px; }
a.home-city-card .home-city-price { padding-right: 56px; }

/* Phones show a narrow slice of the wide hero photo. It is moved right and up so the green dome of the Prophet's Mosque
   sits beside the title, where no button covers it; the lower part fades into the dark blue behind the buttons. */
@media (max-width: 760px) {
    .home-hero-photo { background: #0a2a4a; }
    .home-hero-photo img { object-position: 74% 50%; transform: translateY(-30%); -webkit-mask-image: linear-gradient(180deg, #000 56%, transparent 74%); mask-image: linear-gradient(180deg, #000 56%, transparent 74%); }
}