@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@600;700&display=swap');
:root{--navy:#06243b;--blue:#0d4f91;--gold:#d7a72c;--cream:#f7f5f0;--line:#cfd5da;--muted:#64717d}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:#0d2035;font-family:"DM Sans",Arial,sans-serif}
a{color:inherit}.layout{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100vh}
.sidebar{background:linear-gradient(180deg,#06243b,#031a2c);color:white;padding:30px 28px;position:sticky;top:0;height:100vh;overflow:auto}
.brand{font:700 35px/1.02 "Playfair Display",serif;margin-bottom:10px}.tagline{color:#e3b63e;font:600 17px/1.4 "Playfair Display",serif;margin-bottom:24px}
.side-rule{height:1px;background:#ffffff2b;margin:18px 0 16px}.nav a{display:block;text-decoration:none;padding:9px 0;font-size:17px}.nav a.active,.nav a:hover{color:#f0bd35}.section-label{color:#93a1ad;font-size:14px;letter-spacing:.08em;margin:22px 0 7px}.tripnav a{display:block;text-decoration:none;padding:5px 0;font-size:16px}.tripnav a.active{background:#0d4f91;border-radius:5px;padding:6px 10px;margin-left:-10px;margin-right:-10px}
.main{min-width:0}.hero{width:100%;height:420px;object-fit:contain;object-position:center;background:#e9e5dc;display:block}.page{padding:0 36px 44px;max-width:1280px;margin:auto}.eyebrow{color:#b18519;font-weight:700;letter-spacing:.08em;margin:20px 0 6px}.title-row{display:flex;align-items:center;gap:16px}.flag{font-size:40px}.title{font:700 clamp(2.4rem,4vw,4rem)/1.05 "Playfair Display",serif;margin:0}.dates{font:700 21px "Playfair Display",serif;color:#0d4f91;margin:12px 0 18px}
.rule{height:1px;background:#aeb8c0}.flight-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:20px 0 16px}.flight h2,.overnights h2{font:700 20px "Playfair Display",serif;margin:0 0 12px;color:#123c69}.flight p{margin:0;line-height:1.55}.flight strong{display:block;margin-bottom:4px}.overnights{border-top:1px solid var(--line);padding-top:14px}.overnights h2{margin-bottom:10px}.stops{columns:2;column-gap:50px;margin:0;padding-left:25px}.stops li{padding:2px 0;break-inside:avoid;color:#354452}
.tiles{display:grid;grid-template-columns:repeat(5,1fr);margin-top:22px;border:1px solid var(--line);background:#fff}.tile{padding:19px 20px;border-right:1px solid var(--line);min-height:105px}.tile:last-child{border-right:0}.tile .icon{font-size:22px}.tile b{font:700 17px "Playfair Display",serif;margin-left:8px}.tile p{color:#566471;line-height:1.4;margin:10px 0 0;font-size:14px}
.pager{display:flex;justify-content:space-between;align-items:center;padding-top:18px;color:#0d4f91;font:700 16px "Playfair Display",serif}.pager a{text-decoration:none}.center{text-align:center}
.homehero{position:relative;height:520px}.homehero img{width:100%;height:100%;object-fit:contain}.homeoverlay{position:absolute;left:0;right:0;bottom:0;padding:48px 42px;color:white;background:linear-gradient(transparent,#000b)}.homeoverlay h1{font:700 clamp(3rem,6vw,6rem) "Playfair Display";margin:0}.homeoverlay p{font-size:18px;max-width:650px}.homepage{padding:40px}.homecards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.homecard{background:#fff;padding:25px;border:1px solid #e1ded7;text-decoration:none}.homecard b{font:700 25px "Playfair Display";display:block}.homecard span{color:var(--muted)}
@media(max-width:950px){.layout{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.tripnav{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.tiles{grid-template-columns:repeat(2,1fr)}.tile:nth-child(2){border-right:0}.tile{border-bottom:1px solid var(--line)}.homecards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.page{padding:0 18px 35px}.hero{height:260px}.flight-grid{grid-template-columns:1fr;gap:18px}.stops{columns:1}.tiles{grid-template-columns:1fr}.tile{border-right:0}.tripnav{grid-template-columns:repeat(2,1fr)}.homehero{height:420px}.homeoverlay{padding:25px}.homepage{padding:25px}.homecards{grid-template-columns:1fr}}

/* Version 2.1 — Övriga resor: restore the four-column card layout from the reference image. */
.homepage .homecards {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px !important;
  width: 100% !important;
}
.homepage .homecard {
  min-height: 180px !important;
  box-sizing: border-box !important;
}
@media (max-width: 1000px) {
  .homepage .homecards {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 600px) {
  .homepage .homecards {
    grid-template-columns: 1fr !important;
  }
}

/* Övriga resor — reference layout supplied by user */
body.other-trips-page {
  margin: 0;
  background: #f5f3ee;
  color: #10243a;
}
.other-trips {
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  padding: 72px 50px 50px;
}
.other-trips .eyebrow {
  color: #b58a16;
  font-weight: 700;
  letter-spacing: .03em;
  font-size: 20px;
  margin-bottom: 2px;
}
.other-trips h1 {
  margin: 0 0 8px;
  font: 700 clamp(3.4rem, 5.4vw, 5.4rem) "Playfair Display", Georgia, serif;
  line-height: .98;
  color: #10243a;
}
.other-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}
.other-card {
  box-sizing: border-box;
  min-height: 180px;
  padding: 35px 30px;
  background: #fff;
  border: 1px solid #ddd9d0;
}
.other-card b {
  display: block;
  margin: 0 0 4px;
  font: 700 28px/1.28 "Playfair Display", Georgia, serif;
  color: #10243a;
}
.other-card span {
  display: block;
  color: #667482;
  font: 18px/1.42 Arial, sans-serif;
}
@media (max-width: 1050px) {
  .other-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  .other-trips { padding: 35px 20px; }
  .other-grid { grid-template-columns: 1fr; }
}

/* Back link on Övriga resor */
.back-home {
  display: inline-block;
  margin: 4px 0 22px;
  color: #b58a16;
  font: 700 16px/1.2 Arial, sans-serif;
  text-decoration: none;
}
.back-home:hover {
  text-decoration: underline;
}

.map-link {
  display: inline-block;
  margin: 4px 0 22px;
  padding: 11px 16px;
  background: #fff;
  border: 1px solid #d8d2c6;
  color: #10243a;
  text-decoration: none;
  font-weight: 700;
}
.map-link:hover { text-decoration: underline; }

.other-map-link {
  display: inline-block;
  margin-top: 16px;
  padding: 9px 13px;
  background: #fff;
  border: 1px solid #d8d2c6;
  color: #10243a;
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
}
.other-map-link:hover { text-decoration: underline; }

/* Version 4.0 — Övriga resor: same overall structure as USA-resor, Vatican hero,
   text-only travel cards, all 16 trips on one page. */
.other-trips-overview .main { min-width: 0; }
.other-hero { position: relative; width: 100%; height: 340px; overflow: hidden; }
.other-hero img { width: 100%; height: 100%; object-fit: cover; object-position: center 50%; display: block; }
.other-hero-overlay {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  justify-content: center; padding: 48px 50px;
  background: linear-gradient(90deg, rgba(0,0,0,.62), rgba(0,0,0,.08) 65%, rgba(0,0,0,0));
  color: #fff;
}
.other-hero-overlay h1 {
  margin: 0 0 14px; font: 700 clamp(3rem,5vw,5rem)/1.0 Georgia, "Times New Roman", serif;
  letter-spacing: .01em;
}
.other-hero-overlay p {
  max-width: 620px; margin: 0; font: 20px/1.45 Arial, sans-serif;
}
.other-content { padding: 62px 48px 70px; background: #f7f5f0; }
.other-content h2 {
  margin: 2px 0 12px; color: #10243a;
  font: 700 clamp(3rem,5vw,4.7rem)/1.0 Georgia, "Times New Roman", serif;
}
.other-intro { margin: 0 0 30px; color: #18304a; font: 18px/1.5 Arial, sans-serif; }
.other-cards {
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px;
}
.other-card {
  box-sizing: border-box; min-height: 205px; padding: 30px;
  background: #fff; border: 1px solid #ddd9d0;
  display: flex; flex-direction: column;
}
.other-card h3 {
  margin: 0 0 18px; color: #10243a;
  font: 700 27px/1.2 Georgia, "Times New Roman", serif;
}
.other-country, .other-details {
  color: #667482; font: 16px/1.5 Arial, sans-serif; margin-bottom: 10px;
}
.other-map-link {
  margin-top: auto; padding-top: 12px; color: #0d3678;
  font: 700 15px/1.3 Arial, sans-serif; text-decoration: none;
}
.other-map-link:hover { text-decoration: underline; }
.other-trips-overview .back-home {
  display: inline-block; margin-top: 28px; color: #b58a16;
  font: 700 16px/1.2 Arial, sans-serif; text-decoration: none;
}
.other-trips-overview .back-home:hover { text-decoration: underline; }
@media (max-width: 1100px) {
  .other-cards { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .other-hero { height: 300px; }
  .other-hero-overlay { padding: 30px 25px; }
  .other-content { padding: 40px 25px 55px; }
  .other-cards { grid-template-columns: 1fr; }
}