:root{
  color-scheme: light;
  --paper:#F1F2ED;
  --card:#FBFBF8;
  --ink:#1B2420;
  --ink-soft:#4A5751;
  --pine:#2C4A3E;
  --pine-deep:#1E3328;
  --water:#43686C;
  --red:#B4453A;
  --red-soft:#C67164;
  --leaf:#39956D;
  --bark:#8A6A45;
  --rule:#CDD3C9;
  --serif:"Fraunces", Georgia, "Times New Roman", serif;
  --sans:"Karla", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{animation:none!important;transition:none!important;}
}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.66;}
img{max-width:100%;display:block;}
a{color:var(--pine);text-underline-offset:3px;text-decoration-thickness:1px;}
a:focus-visible,button:focus-visible,img:focus-visible{outline:2px solid var(--bark);outline-offset:3px;}
.wrap{max-width:1040px;margin:0 auto;padding:0 28px;}
.col{max-width:760px;margin:0 auto;padding:0 28px;}
.skip{position:absolute;left:-9999px;}
.skip:focus{left:12px;top:12px;z-index:60;background:var(--card);padding:10px 14px;}

/* ---------- draft banner: delete this block before going live ---------- */
.draft{background:#F6E8C9;border-bottom:1px solid #DFC98F;color:#5A4414;font-size:.84rem;}
.draft .wrap{padding-top:10px;padding-bottom:10px;}
.draft p{margin:0;max-width:none;}

/* ---------- top bar on inner pages ---------- */
.topbar{background:var(--pine-deep);color:#D9E2DA;font-size:.86rem;
  padding-top:env(safe-area-inset-top,0px);}
.topbar .wrap{padding-top:12px;padding-bottom:12px;display:flex;justify-content:space-between;
  align-items:baseline;gap:10px 22px;flex-wrap:wrap;}
.topbar .brand{font-family:var(--serif);font-weight:600;font-size:1rem;color:#F2F5F0;text-decoration:none;}
.topbar nav{display:flex;flex-wrap:wrap;gap:8px 18px;}
.topbar a{color:#CFDCD2;text-decoration:none;}
.topbar a:hover{color:#fff;text-decoration:underline;}
.topbar .here{color:#8FA897;}
@media (max-width:560px){
  .topbar{font-size:.82rem;}
  .topbar .wrap{gap:8px 16px;}
  .topbar nav{gap:7px 14px;}
}

/* ---------- hero ---------- */
.hero{position:relative;min-height:90vh;display:flex;align-items:flex-start;
  background:var(--pine-deep);color:#fff;overflow:hidden;
  padding-top:env(safe-area-inset-top,0px);}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:46% 40%;}
.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(17,30,24,.80) 0%,rgba(17,30,24,.60) 26%,rgba(17,30,24,.16) 48%,rgba(17,30,24,0) 62%,rgba(17,30,24,.42) 100%);}
.hero .wrap{position:relative;z-index:1;width:100%;padding-top:68px;padding-bottom:40px;}
.hero h1{font-family:var(--serif);font-weight:500;
  font-size:clamp(2.9rem,10vw,5.6rem);line-height:.98;letter-spacing:-0.03em;
  margin:0 0 .3em;color:#FDFDFB;font-variation-settings:"opsz" 120,"SOFT" 30;
  text-shadow:0 1px 26px rgba(14,26,20,.42);}
.hero h1 em{font-style:normal;font-weight:300;}
.hero-when{font-size:clamp(1.02rem,2.5vw,1.26rem);line-height:1.5;color:#F0F4EE;margin:0;
  max-width:34ch;text-shadow:0 1px 18px rgba(14,26,20,.5);}
.hero-when b{display:block;font-weight:600;color:#fff;font-size:1.08em;}
.hero-cue{position:absolute;left:0;right:0;bottom:14px;z-index:2;text-align:center;
  color:rgba(255,255,255,.62);font-size:.74rem;letter-spacing:.06em;}
.hero-cue svg{margin:3px auto 0;display:block;}

/* ---------- page heads on inner pages ---------- */
.pagehead{padding:62px 0 6px;}
.pagehead h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.2rem,6.6vw,3.4rem);
  line-height:1.03;letter-spacing:-0.03em;margin:0 0 .4em;font-variation-settings:"opsz" 110,"SOFT" 30;}
.pagehead p{font-size:1.12rem;color:var(--ink-soft);margin:0;max-width:52ch;}

/* ---------- type ---------- */
section{padding:60px 0;}
h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.55rem,4.2vw,2.1rem);
  line-height:1.14;letter-spacing:-0.02em;margin:0 0 .6em;}
h2 .when{display:block;font-family:var(--sans);font-size:.8rem;font-weight:600;
  letter-spacing:.02em;color:var(--bark);margin-bottom:.7em;}
.sect-head{font-family:var(--serif);font-weight:500;font-size:clamp(1.55rem,4vw,2.1rem);
  line-height:1.12;letter-spacing:-0.02em;margin:0 0 .5em;}
p{margin:0 0 1.15em;max-width:64ch;}
.lede{font-size:1.1rem;line-height:1.6;max-width:56ch;margin:0 0 1.2em;}
.first{font-size:1.1rem;}
.pull{font-family:var(--serif);font-size:clamp(1.3rem,3.6vw,1.75rem);line-height:1.28;
  letter-spacing:-0.015em;color:var(--pine);margin:32px 0 34px;max-width:28ch;font-weight:500;}

/* the crayon rule, mixed from the colours in the drawing */
.crayon{height:3px;border:0;margin:0;width:100%;border-radius:2px;opacity:.75;
  background:linear-gradient(90deg,var(--red-soft) 0 18%,#E0B35C 18% 34%,#A2C171 34% 52%,
  var(--leaf) 52% 68%,#7FA8D8 68% 84%,#9A7FB8 84% 100%);}

/* ---------- figures: never wider than the text ---------- */
figure{margin:30px 0 34px;}
figure img{width:100%;}
figcaption{font-size:.86rem;line-height:1.5;color:var(--ink-soft);margin-top:10px;max-width:58ch;}
.fig-land{max-width:600px;}
.fig-port{max-width:400px;}
.framed img{border:10px solid #FBFBF8;box-shadow:0 1px 0 var(--rule),0 0 0 1px var(--rule);}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start;max-width:620px;}
.pair figure{margin:0;}

/* ---------- video ---------- */
.clip{max-width:360px;}
.clip video{width:100%;height:auto;display:block;background:#111;}
.clip figcaption{margin-top:12px;}

/* ---------- dateline under a page title ---------- */
.dateline{font-size:.84rem;font-weight:600;letter-spacing:.02em;color:var(--bark);
  margin:14px 0 0;}

/* ---------- the album ---------- */
.album-intro{margin-top:46px;}
/* a grid rather than columns, so the pages read left to right in date order */
.album{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:30px 22px;align-items:start;margin-top:30px;}
@media (max-width:900px){ .album{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 18px;} }
@media (max-width:620px){ .album{grid-template-columns:1fr;gap:30px;} .apage figcaption{font-size:.9rem;} }
.apage{margin:0;width:100%;}
.apage img{width:100%;border:8px solid var(--card);box-shadow:0 0 0 1px var(--rule);}
.apage figcaption{font-size:.84rem;line-height:1.45;margin-top:9px;max-width:none;}
.apage .d{display:block;font-weight:600;color:var(--bark);letter-spacing:.01em;}
.apage.missing .slot{aspect-ratio:3/4;border:2px dashed var(--rule);background:var(--card);
  display:flex;align-items:center;justify-content:center;}
.apage.missing .slot span{font-size:.82rem;color:var(--bark);}

/* ---------- tap to enlarge ---------- */
.zoom{cursor:zoom-in;}
.zoomnote{display:block;margin-top:5px;font-size:.78rem;color:var(--bark);}
.lb[hidden]{display:none;}
.lb{position:fixed;inset:0;z-index:90;background:rgba(17,30,24,.95);
  display:flex;align-items:center;justify-content:center;padding:28px;}
.lb img{max-width:min(96vw,1000px);max-height:92vh;width:auto;height:auto;
  object-fit:contain;cursor:zoom-out;}
.lb-close{position:absolute;top:14px;right:16px;width:42px;height:42px;border:0;border-radius:50%;
  background:rgba(255,255,255,.12);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;}
.lb-close:hover{background:rgba(255,255,255,.22);}

/* ---------- home: intro ---------- */
.intro{background:var(--card);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.intro .wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:52px;align-items:start;}
.intro .lede:first-of-type{font-size:1.22rem;line-height:1.55;}
.inv-card{border:1px solid var(--rule);background:var(--paper);padding:12px;margin:0;}
.inv-card img{width:100%;}
.inv-card figcaption{margin-top:10px;}

/* ---------- home: days ---------- */
.days{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:26px;}
.day{border:1px solid var(--rule);background:var(--card);padding:14px 14px 16px;
  display:flex;flex-direction:column;}
.day .dow{font-family:var(--serif);font-weight:600;font-size:1.02rem;letter-spacing:-0.01em;}
.day .date{font-size:.8rem;color:var(--ink-soft);margin-bottom:8px;}
.day p{font-size:.88rem;line-height:1.45;margin:0;color:var(--ink-soft);max-width:none;}
.day .tag{font-size:.7rem;letter-spacing:.04em;color:var(--bark);margin-top:auto;padding-top:10px;}
.day.core{background:var(--pine);border-color:var(--pine);color:#F2F5F0;}
.day.core .date,.day.core p{color:#CFDCD2;}
.day.main{background:var(--pine-deep);border-color:var(--pine-deep);color:#fff;}
.day.main .dow{font-size:1.3rem;}
.day.main .date,.day.main p{color:#D7E3DA;}
.day.main .star{color:var(--red-soft);margin-top:auto;padding-top:10px;font-size:.72rem;letter-spacing:.04em;}

/* ---------- home: cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:8px;}
.card{border:1px solid var(--rule);background:var(--card);padding:24px 22px 26px;
  display:flex;flex-direction:column;}
.card h3{font-family:var(--serif);font-weight:600;font-size:1.22rem;margin:0 0 .45em;letter-spacing:-0.01em;}
.card p{font-size:.95rem;line-height:1.55;margin:0 0 1.1em;color:var(--ink-soft);max-width:none;}
.card .go{margin-top:auto;font-weight:600;font-size:.94rem;}
.card .pending{margin-top:auto;font-size:.86rem;color:var(--bark);}

/* ---------- home: story block ---------- */
.story{background:var(--pine-deep);color:#EAF0E8;}
.story .sect-head{color:#fff;}
.story p{color:#CFDCD2;}
.story a{color:#F3D7A6;}
.story .wrap{display:grid;grid-template-columns:320px minmax(0,1fr);gap:48px;align-items:center;}
.story figure{margin:0;}
.story figure img{width:100%;border:10px solid #F3F1E8;}

/* ---------- next-page link ---------- */
.onward{border-top:1px solid var(--rule);margin-top:46px;padding-top:26px;}
.onward a{font-family:var(--serif);font-size:1.3rem;font-weight:600;text-decoration:none;}
.onward a:hover{text-decoration:underline;}
.onward p{font-size:.92rem;color:var(--ink-soft);margin:.3em 0 0;}

.stub{background:var(--card);border:1px solid var(--rule);padding:26px 24px;margin:30px 0 10px;}
.stub h3{font-family:var(--serif);font-weight:600;font-size:1.2rem;margin:0 0 .5em;}
.stub p{font-size:.95rem;color:var(--ink-soft);margin:0;}

/* ---------- foot ---------- */
.foot{background:var(--pine-deep);color:#CFDCD2;padding:40px 0 54px;font-size:.9rem;margin-top:60px;}
.foot a{color:#F3D7A6;}
.foot p{max-width:58ch;margin:0 0 .7em;}
.colophon{background:var(--paper);padding:46px 0 60px;border-top:1px solid var(--rule);}
.colophon p{font-size:.9rem;color:var(--ink-soft);max-width:60ch;margin:0 0 .8em;}

@media (max-width:900px){
  .intro .wrap{grid-template-columns:1fr;gap:34px;}
  .inv-card{max-width:380px;}
  .days{grid-template-columns:repeat(3,minmax(0,1fr));}
  .cards{grid-template-columns:1fr;}
  .story .wrap{grid-template-columns:1fr;gap:28px;}
  .story figure{max-width:320px;}
}
@media (max-width:560px){
  body{font-size:16px;}
  .wrap,.col{padding:0 20px;}
  .hero{min-height:86vh;}
  .days{grid-template-columns:1fr 1fr;}
  section{padding:46px 0;}
  .pair{grid-template-columns:1fr;gap:26px;}
  .pagehead{padding-top:42px;}
}


/* ---------- quick links on the home page ---------- */
.quick{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px;}
.quick a{display:inline-block;padding:7px 14px;border:1px solid var(--rule);background:var(--paper);
  border-radius:999px;font-size:.9rem;text-decoration:none;color:var(--pine);}
.quick a:hover{background:var(--pine);border-color:var(--pine);color:#F2F5F0;}

/* ---------- two-column feature block ---------- */
.twocol .wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:center;}
.twocol figure{margin:0;}
.twocol figure img{width:100%;border:8px solid var(--card);box-shadow:0 0 0 1px var(--rule);}

/* ---------- mood block ---------- */
.mood{background:var(--card);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}

/* ---------- mood page ---------- */
.mood-h{font-family:var(--serif);font-weight:600;font-size:1.22rem;letter-spacing:-0.01em;
  margin:30px 0 .35em;}
.embed{margin:14px 0 4px;}
.embed iframe{width:100%;border:0;display:block;}
.embed-video{aspect-ratio:16/9;background:#111;}
.embed-video iframe{height:100%;}
.embed-audio iframe{height:152px;border-radius:12px;}
.moodlist{list-style:none;padding:0;margin:18px 0 0;}
.moodlist li{border-top:1px solid var(--rule);padding:14px 0;}
.moodlist li:last-child{border-bottom:1px solid var(--rule);}
.moodlist b{font-family:var(--serif);font-size:1.1rem;font-weight:600;display:block;}
.moodlist span{display:block;font-size:.92rem;color:var(--ink-soft);margin-top:2px;}

@media (max-width:900px){
  .twocol .wrap{grid-template-columns:1fr;gap:28px;}
  .twocol figure{max-width:300px;}
}


/* ---------- things to watch ---------- */
.watch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px;}
.wcard{display:block;text-decoration:none;color:var(--ink);}
.wthumb{display:block;aspect-ratio:3/4;overflow:hidden;border:1px solid var(--rule);background:var(--pine);}
.wthumb img{width:100%;height:100%;object-fit:cover;}
.wcard b{display:block;font-family:var(--serif);font-size:1.08rem;font-weight:600;margin-top:10px;}
.wcard .wmeta{display:block;font-size:.85rem;color:var(--ink-soft);margin-top:2px;}
.wcard:hover b{text-decoration:underline;}
@media (max-width:560px){ .watch{grid-template-columns:1fr 1fr;gap:14px;} }


/* ---------- travel page ---------- */
.addr{border:1px solid var(--rule);background:var(--card);padding:22px 24px;margin:6px 0 40px;}
.addr p{margin:0 0 .5em;max-width:none;}
.addr p:last-child{margin-bottom:0;}
.addr-main{font-family:var(--serif);font-size:1.18rem;line-height:1.45;font-weight:600;}
.addr-meta{font-size:.86rem;color:var(--ink-soft);}
.plainlist{list-style:none;padding:0;margin:0 0 1.15em;}
.plainlist li{border-top:1px solid var(--rule);padding:12px 0;font-size:.97rem;max-width:62ch;}
.plainlist li:last-child{border-bottom:1px solid var(--rule);}
.small{font-size:.86rem;color:var(--ink-soft);}
.embed-reel{max-width:400px;}
.embed-reel iframe{height:580px;border:1px solid var(--rule);background:var(--card);}

.warn-head{color:var(--red);}


/* ---------- berlin map ---------- */
.map{height:min(62vh,540px);min-height:380px;border:1px solid var(--rule);background:var(--card);
  margin:26px 0 10px;}
.map .leaflet-tile-pane{filter:saturate(.55) contrast(.95) brightness(1.03);}
.map .leaflet-container{font-family:var(--sans);}
.maphint{font-size:.84rem;color:var(--ink-soft);margin:0 0 10px;}
.pin{display:flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:50%;color:#fff;font-family:var(--serif);font-weight:600;font-size:.92rem;
  box-shadow:0 1px 4px rgba(14,26,20,.35);border:2px solid #FBFBF8;}
.pin-sight{background:var(--pine);}
.pin-food{background:var(--red);}
.leaflet-popup-content{font-size:.9rem;line-height:1.5;}
.leaflet-popup-content b{font-family:var(--serif);font-size:1rem;}

.stops{list-style:none;padding:0;margin:34px 0 0;counter-reset:none;}
.stop{display:flex;gap:16px;align-items:flex-start;border-top:1px solid var(--rule);padding:16px 0;}
.stop:last-child{border-bottom:1px solid var(--rule);}
.stop .pin{flex:none;margin-top:2px;}
.stop p{margin:.25em 0 0;font-size:.95rem;color:var(--ink-soft);max-width:58ch;}
.stopname{background:none;border:0;padding:0;cursor:pointer;text-align:left;
  font-family:var(--serif);font-weight:600;font-size:1.12rem;color:var(--pine);
  text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;}
.stopname:hover{color:var(--red);}
@media (max-width:560px){ .map{height:420px;} .stop{gap:12px;} }

.maphint{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between;}
.gbtn{display:inline-block;background:var(--pine);color:#F2F5F0;text-decoration:none;
  padding:8px 15px;border-radius:999px;font-size:.88rem;font-weight:600;}
.gbtn:hover{background:var(--pine-deep);color:#fff;}
.map-dead{position:relative;}
.map-dead::after{content:"The map could not load here \2014 the links below open each place in Google Maps.";
  position:absolute;inset:0;z-index:500;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:30px;background:var(--card);color:var(--ink-soft);font-size:.95rem;}

.formwrap{margin:8px 0 46px;}
.formwrap .cognito{max-width:100%;}

.laterline{font-size:.9rem;color:var(--bark);margin-top:22px;}
.mood.twocol figure figcaption{font-size:.82rem;margin-top:8px;}