
/* ── Design tokens (D2/D3) ──────────────────────────────────────────────────
   Colour keeps the shipped palette (indigo / purple / gold, white editorial
   base) — only --gray is darkened so body copy on white clears 7:1.
   Gold is 3:1 on white: use it for rules, outlines and focus, never for text
   on a light ground. */
:root{
  --indigo:#2e2a6e; --indigo-dark:#252060; --purple:#6a2c91; --purple-hover:#7d35a8;
  --gold:#c9860a; --gold-soft:#f4c96b; --green:#0d7a4f;
  --ink:#23232f; --gray:#494960; --muted:#5d5d74; --line:#e6e6ef; --line-strong:#cfd0e0;
  --bg:#fff; --soft:#f7f7fb; --soft-2:#eef0f7;
  --serif:'Playfair Display','Frank Ruhl Libre',Georgia,'Times New Roman',serif;
  --sans:'Assistant',system-ui,-apple-system,'Segoe UI',sans-serif;
  /* type scale: 18px root everywhere (owner: body ≥18px), so .89rem is 16px */
  --fs-xs:.78rem; --fs-sm:.89rem; --fs-base:1rem; --fs-md:1.12rem; --fs-lg:1.35rem; --fs-xl:1.7rem;
  --fs-h2:clamp(1.7rem,3.4vw,2.3rem); --fs-h1:clamp(1.9rem,4vw,2.8rem); --fs-hero:clamp(2.05rem,5vw,3.25rem);
  --lh-tight:1.15; --lh-body:1.65;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;
  --r-sm:6px; --r-md:10px; --r-lg:14px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(20,20,50,.05),0 2px 10px rgba(20,20,50,.07);
  --sh-2:0 10px 28px rgba(20,20,50,.14);
  --sh-3:0 18px 44px rgba(0,0,0,.34);
  --gutter:clamp(16px,4vw,22px);
}
/* Playfair Display has no Hebrew glyphs. On Hebrew pages the display face is
   Frank Ruhl Libre (loaded only there, see head()); Latin words inside Hebrew
   text then also use it, which reads as one face rather than two. */
/* Self-hosted web fonts (tools/selfhost-fonts.js downloads Google's own woff2 subsets into /fonts).
   Hosted on Google, the CSS was render-blocking (~800ms) and the fonts arrived after first paint; the
   swap then grew the hero and pushed CLS to 0.29 on Hebrew pages. Each page preloads the two files it
   paints first with (see fontLinks()). Frank Ruhl Libre 700 serves 700-900. */
@font-face{font-family:'Assistant';font-style:normal;font-weight:400;font-display:optional;src:url('/fonts/assistant-400-hebrew.woff2') format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}
@font-face{font-family:'Assistant';font-style:normal;font-weight:400;font-display:optional;src:url('/fonts/assistant-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Assistant';font-style:normal;font-weight:400;font-display:optional;src:url('/fonts/assistant-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Assistant';font-style:normal;font-weight:600;font-display:optional;src:url('/fonts/assistant-600-hebrew.woff2') format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}
@font-face{font-family:'Assistant';font-style:normal;font-weight:600;font-display:optional;src:url('/fonts/assistant-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Assistant';font-style:normal;font-weight:600;font-display:optional;src:url('/fonts/assistant-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Assistant';font-style:normal;font-weight:700;font-display:optional;src:url('/fonts/assistant-700-hebrew.woff2') format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}
@font-face{font-family:'Assistant';font-style:normal;font-weight:700;font-display:optional;src:url('/fonts/assistant-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Assistant';font-style:normal;font-weight:700;font-display:optional;src:url('/fonts/assistant-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Assistant';font-style:normal;font-weight:800;font-display:optional;src:url('/fonts/assistant-800-hebrew.woff2') format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}
@font-face{font-family:'Assistant';font-style:normal;font-weight:800;font-display:optional;src:url('/fonts/assistant-800-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Assistant';font-style:normal;font-weight:800;font-display:optional;src:url('/fonts/assistant-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600;font-display:optional;src:url('/fonts/playfair-display-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600;font-display:optional;src:url('/fonts/playfair-display-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:optional;src:url('/fonts/playfair-display-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:optional;src:url('/fonts/playfair-display-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:800;font-display:optional;src:url('/fonts/playfair-display-800-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:800;font-display:optional;src:url('/fonts/playfair-display-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Frank Ruhl Libre';font-style:normal;font-weight:700 900;font-display:optional;src:url('/fonts/frank-ruhl-libre-700-hebrew.woff2') format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}
@font-face{font-family:'Frank Ruhl Libre';font-style:normal;font-weight:700 900;font-display:optional;src:url('/fonts/frank-ruhl-libre-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
html[lang="he"]{--serif:'Frank Ruhl Libre','Playfair Display',Georgia,serif}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:18px;-webkit-text-size-adjust:100%}
body{font-family:var(--sans);color:var(--ink);background:var(--bg);line-height:var(--lh-body)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
/* No colour here on purpose: heroes and dark bands inherit white. Components set indigo themselves. */
h1,h2,h3{font-family:var(--serif);line-height:var(--lh-tight);font-weight:800;overflow-wrap:break-word}
.wrap{max-width:1180px;margin:0 auto;padding-inline:var(--gutter)}
/* Hidden ABOVE the page, not off to the left: in a right-to-left document
   a large negative left offset is inside the scrollable area, and every Hebrew page was
   11,264px wide — a sideways scrollbar, and a blank first screen in some
   browsers. Nothing scrolls upward past the top, so -100px hides it in both
   directions. */
.skip{position:absolute;top:-100px;inset-inline-start:12px}
.skip:focus{top:12px;z-index:99;background:#fff;padding:10px 16px;border:2px solid var(--purple)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
/* Directional glyphs: logical properties do not mirror an arrow, and → ← are
   not bidi-mirrored characters (› ‹ are, the browser flips those itself).
   Wrap any → or ← in <span class="arr"> and it flips in RTL. */
.arr{display:inline-block}
[dir="rtl"] .arr{transform:scaleX(-1)}

/* ── Header + nav ─────────────────────────────────────────────────────────
   The brand may shrink and the language <select> may not: at 390px the old
   fixed 1.6rem name plus 22px gutters pushed the select 2px past the edge. */
header.top{background:#fff;border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;gap:var(--s3);padding-block:var(--s3)}
.brand{display:flex;align-items:center;gap:var(--s3);min-width:0;flex:0 1 auto}
.brand svg{flex:0 0 auto}
.brand .name{font-family:var(--serif);font-size:clamp(1.2rem,4.4vw,1.6rem);font-weight:800;color:#33334a;line-height:1.05;white-space:nowrap}
.brand .name small{display:block;font-family:var(--sans);font-size:.67rem;letter-spacing:.13em;
  font-weight:700;color:var(--purple);text-transform:uppercase;margin-top:2px;white-space:normal}
.top .spacer{flex:1 1 0;min-width:4px}
.langsel{flex:0 0 auto;font:inherit;font-size:var(--fs-sm);font-weight:700;min-height:44px;padding:8px 12px;
  border:1px solid var(--line-strong);border-radius:var(--r-sm);background:#fff;color:var(--ink);cursor:pointer;max-width:46vw}

nav.bar{background:var(--indigo);position:sticky;top:0;z-index:50}
nav.bar .wrap{display:flex;align-items:center;gap:4px;min-height:54px;flex-wrap:wrap}
nav.bar a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;color:#fff;font-weight:700;font-size:.95rem;opacity:.92;padding:10px 12px;border-radius:var(--r-sm)}
nav.bar a:hover,nav.bar a:focus{opacity:1;background:rgba(255,255,255,.12)}
nav.bar a:focus-visible{outline-offset:-3px}
nav.bar a.on{background:var(--purple);opacity:1}

/* ── Sections, headings, buttons ──────────────────────────────────────── */
section{padding-block:clamp(44px,6vw,60px)}
section.soft{background:var(--soft)}
.sec-head{margin-bottom:var(--s6)}
.sec-head h2{font-size:var(--fs-h2);color:var(--indigo)}
.sec-head p{color:var(--gray);margin-top:6px;font-size:var(--fs-md)}
.sec-foot{margin-top:var(--s6);display:flex;flex-wrap:wrap;gap:var(--s3)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;background:var(--purple);color:#fff;
  font-weight:800;padding:12px 26px;border-radius:var(--r-md);text-align:center;line-height:1.25;border:2px solid var(--purple);cursor:pointer;font:inherit;font-weight:800}
.btn:hover{background:var(--purple-hover);border-color:var(--purple-hover)}
.btn.ghost{background:transparent;color:var(--purple)}
.btn.ghost:hover{background:var(--purple);color:#fff}
.btn.gold{background:var(--gold);border-color:var(--gold);color:#1c1608}
.btn.gold:hover{background:#b3760a;border-color:#b3760a}

/* Page header band (guides index, categories, places, info pages) */
.phead{background:var(--indigo);color:#fff;padding-block:clamp(34px,5vw,48px) clamp(28px,4vw,38px)}
.phead h1{color:#fff;font-size:var(--fs-h1)}
.phead p{opacity:.92;margin-top:10px;max-width:720px;font-size:var(--fs-md)}
.phead .count{display:inline-block;margin-top:14px;font-weight:800;font-size:var(--fs-sm);opacity:.9}

/* Breadcrumbs — one rule for every template (was three drifting copies) */
nav.crumbs{background:var(--soft);border-bottom:1px solid var(--line);font-size:var(--fs-sm);color:var(--gray)}
nav.crumbs .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;padding-block:var(--s3);white-space:normal}
nav.crumbs a{color:var(--purple);font-weight:700;padding:10px 6px;display:inline-block}
/* U+203A is a bidi-mirrored character: the browser already flips it in RTL, so no transform here. */
nav.crumbs .sep{color:var(--muted)}
nav.crumbs [aria-current]{color:var(--ink);font-weight:700}

/* Tags and chips */
.tag{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:3px 12px;border-radius:var(--r-pill);
  background:var(--soft-2);color:var(--indigo);font-weight:700;font-size:var(--fs-xs);letter-spacing:.02em}
.tag.green{background:var(--green);color:#fff}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border:1px solid var(--line-strong);
  border-radius:var(--r-pill);font-weight:700;font-size:var(--fs-sm);color:var(--ink);background:#fff;cursor:pointer;font-family:inherit}
.chip:hover,.chip:focus-visible{border-color:var(--purple);color:var(--purple)}
.chip.on,.chip[aria-pressed="true"]{background:var(--purple);border-color:var(--purple);color:#fff}

/* ── Cards ──────────────────────────────────────────────────────────────── */
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:var(--s6)}
.card{display:block;min-width:0}
.card .ph{aspect-ratio:16/10;overflow:hidden;background:#dfe3ee;border-radius:var(--r-md)}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover .ph img{transform:scale(1.04)}
.card .meta{color:var(--purple);font-weight:800;font-size:var(--fs-xs);text-transform:uppercase;
  letter-spacing:.06em;margin-top:14px}
.card .meta .hasit{display:inline-block;background:var(--green);color:#fff;border-radius:var(--r-pill);padding:2px 9px;font-weight:700}
.card h3{color:var(--indigo);font-size:var(--fs-lg);font-weight:700;margin:6px 0;line-height:1.25}
.card:hover h3{color:var(--purple)}
.card p{color:var(--gray);font-size:var(--fs-base)}
.card .price{margin-top:10px;font-family:var(--serif);font-size:1.45rem;font-weight:800;color:var(--ink)}
.card .price small{font-family:var(--sans);font-size:var(--fs-xs);color:var(--gray);font-weight:700}
.card .more{display:inline-block;margin-top:10px;color:var(--purple);font-weight:800;font-size:var(--fs-sm)}
.card:hover .more{text-decoration:underline}

/* ── Editorial components (guides, posts, places) ──────────────────────── */
.prose{max-width:760px}
.prose p,.prose li{font-size:var(--fs-md);line-height:1.7}
.prose p+p{margin-top:1.1em}
.prose h2{color:var(--indigo);font-size:var(--fs-xl);margin-block:1.6em .6em}
.prose h3{color:var(--indigo);font-size:var(--fs-lg);margin-block:1.3em .5em}
.prose ul,.prose ol{padding-inline-start:1.3em;margin-block:.8em 1.2em}
.prose li+li{margin-top:.35em}
.prose a{color:var(--purple);text-decoration:underline;text-underline-offset:3px;font-weight:700}
.note{background:var(--soft);border-inline-start:5px solid var(--gold);padding:18px 22px;margin-block:1.4em;
  border-start-end-radius:var(--r-md);border-end-end-radius:var(--r-md);font-size:var(--fs-base)}
.note b,.note strong{color:var(--indigo)}
.tablewrap{overflow-x:auto;margin-block:1.4em;border:1px solid var(--line);border-radius:var(--r-md)}
.tablewrap table,table.tbl{border-collapse:collapse;width:100%;font-size:var(--fs-base);line-height:1.45}
.tablewrap th,.tablewrap td,table.tbl th,table.tbl td{text-align:start;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.tablewrap th,table.tbl th{background:var(--soft-2);color:var(--indigo);font-weight:800;font-size:var(--fs-sm)}
.tablewrap tr:last-child td{border-bottom:0}
.sources{margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid var(--line);color:var(--gray);font-size:var(--fs-sm)}
.sources h2,.sources h3{font-family:var(--sans);font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:10px}
.sources ol{padding-inline-start:1.4em}
.sources li+li{margin-top:6px}
.sources a{color:var(--purple);text-decoration:underline;overflow-wrap:anywhere}
.checked{font-size:var(--fs-sm);color:var(--muted);font-weight:700}

/* Photography: grids, inline figures, credits */
.vg{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:var(--s4);margin-block:1.4em}
figure.vc,figure.vi{margin:0;min-width:0}
figure.vi{margin-block:1.6em}
figure.vc img,figure.vi img{width:100%;height:auto;border-radius:var(--r-md);background:#dfe3ee}
figure.vc img{aspect-ratio:4/3;object-fit:cover}
figcaption,.credit{font-size:var(--fs-sm);color:var(--gray);margin-top:8px;line-height:1.45}
.credit a,figcaption a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}

/* Fares / deals box at the end of a guide (kept everywhere, restyled only) */
.guide-deals{margin-top:var(--s7);padding:clamp(20px,3vw,32px);background:var(--soft);border:1px solid var(--line);border-radius:var(--r-lg)}
.guide-deals h2,.guide-deals h3{color:var(--indigo);font-size:var(--fs-xl);margin-bottom:6px}
.guide-deals>p{color:var(--gray);margin-bottom:var(--s4)}
.gd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));gap:var(--s3)}
a.gd{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;min-width:0;box-shadow:var(--sh-1)}
a.gd:hover,a.gd:focus-visible{border-color:var(--purple);box-shadow:var(--sh-2)}
.gd-line{font-size:var(--fs-xs);font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--purple)}
.gd-route{font-family:var(--serif);font-size:var(--fs-md);font-weight:700;color:var(--indigo);margin-top:4px;line-height:1.3}
.gd-meta{color:var(--gray);font-size:var(--fs-sm);margin-top:4px}
.gd-price{font-family:var(--serif);font-weight:800;font-size:var(--fs-lg);color:var(--ink);margin-top:6px}
a.gd-all{margin-top:var(--s4)}

/* Dark editorial band (homepage) */
.band{background:var(--indigo);color:#fff}
.band .wrap{display:grid;grid-template-columns:1fr 1.25fr;gap:44px;align-items:center;padding-block:58px}
.band h2{color:#fff;font-size:var(--fs-h2)}
.band p{opacity:.92;margin-top:10px}
.band ul{list-style:none;display:grid;gap:14px}
.band li{display:flex;gap:12px;align-items:flex-start;opacity:.96;font-size:var(--fs-base)}
.band li b{color:var(--gold-soft)}
.band li::before{content:'';flex:0 0 auto;width:9px;height:9px;margin-top:.55em;border-radius:50%;background:var(--gold-soft)}

footer{background:var(--indigo-dark);color:#d6d7ea;padding-block:44px;text-align:center}
footer .name{font-family:var(--serif);font-size:1.45rem;color:#fff;font-weight:700}
footer .links{margin:14px 0;display:flex;gap:6px 22px;justify-content:center;flex-wrap:wrap}
footer .links a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding-inline:6px;color:#fff;opacity:.9;font-weight:700}
footer .links a:hover{opacity:1;text-decoration:underline}
footer .fine{font-size:var(--fs-sm);opacity:.8;margin-top:10px}

/* Compact hero: .phead is shared by deals/places/info-pages/trip-page.
   Only deals render .price/.pp/.dflags inside it, so those three rules are
   a no-op everywhere else - the padding shrink is the only part that also
   tightens places/info/trip headers, which is a deliberate, wanted side
   effect of one shared component rather than a deal-page-only patch. */
.phead{padding-block:clamp(14px,2vw,18px) clamp(12px,1.8vw,16px)}
.phead h1{margin:0}
.phead .price{font-size:clamp(1.6rem,3.4vw,2.1rem);margin:var(--s2) 0 0}
.phead .pp{font-size:var(--fs-sm)}
.phead .kicker{margin:0}
.dflags{margin-top:var(--s3)}

@media(max-width:820px){
  .band .wrap{grid-template-columns:1fr;gap:24px}
  nav.bar a{padding:10px 9px;font-size:.9rem}
  .sec-head{margin-bottom:var(--s5)}
  .phead{padding-block:12px 10px}
  .phead .price{font-size:clamp(1.45rem,6vw,1.8rem);margin-top:6px}
  .dflags{margin-top:var(--s2)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

.phead .kicker{color:var(--gold-soft);font-weight:800;font-size:var(--fs-xs);letter-spacing:.09em;text-transform:uppercase;margin:0}
.phead .price{font-family:var(--serif);font-size:clamp(1.6rem,3.4vw,2.1rem);font-weight:800;color:var(--gold-soft);margin:var(--s2) 0 0}
.phead .pp{opacity:.85;font-size:var(--fs-sm)}
.dflags{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)}
@media(max-width:820px){
  .phead .price{font-size:clamp(1.45rem,6vw,1.8rem);margin-top:6px}
  .dflags{margin-top:var(--s2)}
}
.dhero{margin-block:var(--s6) 0}
.dhero picture{display:block}
.dhero img{width:100%;max-height:420px;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.acts{max-width:720px;margin:0 auto;padding:var(--s7) var(--gutter) 0;display:grid;gap:var(--s3)}
.acts .btn{width:100%}
.acts .btn small{display:block;font-weight:600;opacity:.85;font-size:var(--fs-xs);margin-top:3px}
.rel-guides{margin-top:var(--s5);padding:var(--s4) var(--s5);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--soft)}
.rel-guides h3{font-size:var(--fs-sm);font-weight:800;margin-bottom:var(--s2);color:var(--indigo);text-transform:uppercase;letter-spacing:.04em}
.rel-guides ul{list-style:none;margin:0;padding:0}
.rel-guides li{border-top:1px solid var(--line)}
.rel-guides li:first-child{border-top:0}
.rel-guides a{display:flex;align-items:center;min-height:44px;color:var(--purple);font-weight:700}
.dnote{max-width:720px;margin:var(--s4) auto 0;padding:0 var(--gutter);color:var(--gray);font-size:var(--fs-sm);text-align:center}
.dnote a{color:var(--purple);font-weight:700}
.facts{max-width:720px;margin:var(--s7) auto 0;padding:0 var(--gutter);display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s3)}
.fact{background:var(--soft);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s3) var(--s4);min-width:0;overflow-wrap:anywhere}
.fact b{display:block;color:var(--purple);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;margin-bottom:3px;font-weight:800}
.fact span{color:var(--ink);font-weight:700;font-size:var(--fs-md)}
.altbox{max-width:720px;margin:var(--s6) auto 0;padding:0 var(--gutter)}
.altbox .inner{background:var(--soft);border:1px solid var(--line);border-inline-start:4px solid var(--gold);border-radius:0 var(--r-md) var(--r-md) 0;padding:var(--s4) var(--s5)}
.altbox b{color:var(--indigo)}
.altbox p{color:var(--gray);font-size:var(--fs-sm);margin:4px 0 var(--s3)}
.altcard{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s3) var(--s4);min-height:44px}
.altcard:hover{border-color:var(--purple)}
.altcard .l{color:var(--purple);font-weight:800;font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em}
.altcard .r{font-family:var(--serif);font-size:var(--fs-lg);font-weight:700;color:var(--indigo);margin:2px 0}
.altcard .m{color:var(--gray);font-size:var(--fs-sm)}
.altcard .p{font-family:var(--serif);font-size:var(--fs-xl);font-weight:800;margin-top:6px}
.also{max-width:720px;margin:var(--s7) auto 0;padding:0 var(--gutter)}
.also h2{color:var(--indigo);font-size:var(--fs-xl);margin:0 0 var(--s3)}
.dback{max-width:720px;margin:var(--s7) auto 60px;padding:0 var(--gutter)}
.dai{max-width:720px;margin:var(--s4) auto 0;padding:0 var(--gutter);color:var(--gray);font-size:var(--fs-xs);text-align:center}
@media(max-width:820px){.dhero img{max-height:260px}}
/* The compact band still needs to earn its space: a real fact (departure
   season + embarkation port, both genuine per-deal fields - never invented
   copy) plus a booking CTA a reader does not have to scroll for. This row
   is its own flex container, not .wrap itself - .wrap already stacks the
   kicker/h1/price/pp vertically and turning THAT into a flex row would
   break it. */
.phead-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);margin-top:var(--s3)}
.phead-fact{margin:0;opacity:.85;font-size:var(--fs-sm)}
.phead-cta{margin-inline-start:auto}
@media(max-width:820px){
  .phead-cta{margin-inline-start:0;width:100%}
}
