/* ==========================================================================
   Weekend guide (PREVIEW): this page has its own design system, so it gets its own
   re-skin. Same brand colours and fonts as redesign.css, applied through the page's
   own variables. Loaded last on munich-with-kids-this-weekend.html only.
   ========================================================================== */

/* Fonts are hosted on this site (open-licence Poppins and Caprasimo, Latin letters only): no third-party request, no layout jump */
@font-face { font-family: 'Caprasimo'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/caprasimo-400.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: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/poppins-400.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: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/poppins-600.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: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/poppins-700.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; }

:root {
  --cream:#F4EBDD; --terra:#C1602E; --pine:#3A4A32; --char:#2B2018; --plate:#FBF6EC; --oat:#E6D9C3;
  --dot: rgba(244,235,221,.10);

  --ground: var(--cream);  --ground-deep: var(--oat);  --paper: var(--plate);
  --ink: var(--char);  --ink-soft: #5E4E3E;  --muted: #7A6650;
  --line: #DCCDB3;  --line-firm: #B9A687;

  /* day tickets: tints of the brand colours, still easy to tell apart */
  --fri: #D5DEC9;  --fri-ink: #2A3724;
  --sat: #F3D3BD;  --sat-ink: #8E4320;
  --sun: #E8DCC0;  --sun-ink: #5A4636;
  --run: #F0E3B8;  --run-ink: #6B4E12;
  --all: #E3E8DC;  --all-ink: #3A4A32;

  --berry: #AE531E;  --berry-deep: #8E4320;  --berry-soft: #F6E3D6;
  --tip: #F3E3C6;  --tip-ink: #5A3A12;
  --english: var(--pine);  --english-soft: #E3E8DC;
  --shadow: var(--char);
}
html, body { background: var(--cream); }
body, button, input, select, textarea, .card h3, h1 { font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
body::before { background-image: radial-gradient(circle at 1px 1px, rgba(58,74,50,.10) 1.2px, transparent 1.6px); }
:focus-visible { outline-color: var(--terra); }

/* masthead: a light beveled plate, so the events stay close to the top of a phone screen */
.masthead {
  --c: 16px; position: relative; isolation: isolate; margin-top: 14px; padding: 18px 18px 18px; gap: 10px;
  background: var(--pine);
  clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c));
}
.masthead::before {
  content: ""; position: absolute; inset: 2px; z-index: -1; background: var(--plate);
  clip-path: polygon(calc(var(--c) - 2px) 0, 100% 0, 100% calc(100% - var(--c) + 2px), calc(100% - var(--c) + 2px) 100%, 0 100%, 0 calc(var(--c) - 2px));
}
.masthead .brand { color: var(--pine); }
.masthead .brand .blob { background: var(--terra); box-shadow: 14px 0 0 var(--pine), 28px 0 0 var(--oat); }
h1 {
  font-family: 'Caprasimo', 'Cooper Black', Georgia, serif; font-weight: 400; letter-spacing: .01em; line-height: 1.04;
  font-size: clamp(2rem, 8vw, 3.2rem); color: var(--char); -webkit-text-stroke: 0; text-shadow: 3px 3px 0 var(--oat);
}
h1 .squiggle { background: linear-gradient(transparent 66%, #F0C9AE 66%, #F0C9AE 92%, transparent 92%); }
.standfirst { color: var(--ink-soft); font-size: .92rem; line-height: 1.5; }
.standfirst strong { color: var(--char); }
.update-note { transform: none; border-radius: 2px; border-color: var(--pine); background: var(--pine-soft, #E3E8DC); color: var(--pine); }
.fb-btn { transform: none; border-radius: 2px; text-transform: uppercase; letter-spacing: .05em; font-size: 12px; box-shadow: 0 3px 0 var(--char); }
.fb-btn:hover { background: var(--tip); }
.fb-panel { border-radius: 0; box-shadow: none; border-left: 5px solid var(--terra); }
.fb-actions a, .fb-actions button { border-radius: 2px; }

/* controls: rectangular and beveled to match */
.ticket, .chip, .pill, .cal-btn, .card, .plan-bar, .cal-panel, .day-head, .tip {
  border-radius: 2px !important;
}
.tickets-bar { border-bottom: 3px solid var(--pine); }
.ticket { box-shadow: 0 3px 0 var(--char); }
.card { box-shadow: 0 3px 0 var(--pine); }
.card.picked { box-shadow: 0 3px 0 var(--terra); border-color: var(--terra); }

/* footer note: readable ink on cream, never light-on-light */
footer { color: var(--ink-soft); border-top: 3px dotted var(--pine); }
footer .sign { font-family: 'Poppins', sans-serif; font-weight: 700; color: var(--berry-deep); font-size: 15px; }
footer a { color: var(--berry-deep); }

/* accessibility: visible keyboard focus, 44px targets, reduced motion */
:focus-visible { outline: 3px solid var(--berry-deep); outline-offset: 3px; }
.ticket:focus-visible, .chip:focus-visible, .pill:focus-visible { outline-offset: -5px; }
.ticket, .chip, .pill, .fb-btn, .fb-actions a, .fb-actions button { min-height: 44px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
.heart { min-width: 44px; min-height: 44px; }
.cal-btn, .plan-btn { min-height: 44px; }

/* the page's old display and handwriting fonts are gone: use the brand pair instead */
.day-head h2 { font-family: 'Caprasimo', 'Cooper Black', Georgia, serif; font-weight: 400; }
.ticket .t-date, .stub .s-time, .empty strong, .plan-text .n { font-family: 'Poppins', sans-serif; font-weight: 700; }
.ticket .stamp, .tip .tip-label, footer .sign { font-family: 'Poppins', sans-serif; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-style: normal; }
.tip .tip-label { font-size: .8rem; }

/* plain-text "at a glance" list under the interactive cards (also read by search engines) */
.glance { margin-top: 36px; padding: 20px 18px 8px; background: var(--paper); border: 2px solid var(--pine); }
.glance h2 { font-family: 'Caprasimo', 'Cooper Black', Georgia, serif; font-weight: 400; font-size: 1.5rem; margin: 0 0 6px; }
.glance h3 { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--pine); margin: 20px 0 6px; padding-bottom: 4px; border-bottom: 2px dotted var(--pine); }
.glance-meta { margin: 0 0 6px; font-size: .9rem; color: var(--ink-soft); }
.glance ul { list-style: none; margin: 0; padding: 0; }
.glance li { margin: 0 0 10px; font-size: .92rem; line-height: 1.5; color: var(--ink-soft); }
.glance li a { color: var(--berry-deep); }
.glance .glance-name { font-weight: 700; color: var(--ink); text-decoration-color: var(--berry-deep); }
.glance-short li { margin-bottom: 6px; }