/* Regional portals (timeanddate.us.com, time-and-date.uk.com,
   timeanddate.eu.com): flag-colour top bar, centred wordmark, navy nav bar
   with dropdowns (the legacy nav was a 28-link wall), big clock card. */
body { font-family: "Inter", -apple-system, "Segoe UI", Roboto, sans-serif; }
.r-top { background: linear-gradient(90deg, var(--head), var(--head-2)); color: #fff; font-size: .88rem; border-bottom: 4px solid var(--c); }
.r-top-in { max-width: 1200px; margin: 0 auto; padding: 10px 16px; display: flex; gap: 24px; flex-wrap: wrap; }
.r-top-tag { margin-left: auto; opacity: .9; }
.r-mast { text-align: center; padding: 30px 16px 22px; }
.r-wordmark { font-size: clamp(2rem, 6vw, 3.4rem); font-weight: 900; letter-spacing: -.03em; color: var(--head); text-decoration: none; }
.r-wordmark em { font-style: normal; color: var(--c); }
.r-tag { margin: 8px 0 0; color: var(--mut); font-weight: 500; }
.g-header { background: var(--head); }
.g-brand { color: #fff; font-size: .95rem; }
.g-nav > a, .g-drop-btn { color: #fff; font-size: .92rem; font-weight: 500; }
.g-nav > a.is-main, .g-drop.is-active .g-drop-btn { text-decoration: underline; text-decoration-color: var(--c); text-underline-offset: 6px; text-decoration-thickness: 3px; }
.sr-only-if-home { font-size: 1.6rem; color: var(--head); }
.pt-home .sr-only-if-home { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.lc-card-xl { background: linear-gradient(135deg, var(--tint), #fff); border: 3px solid var(--head); border-radius: 20px; padding: 44px 24px; }
.lc-pill { background: var(--c); color: #fff; text-transform: uppercase; letter-spacing: .04em; }
.lc-time { color: var(--head); font-weight: 900; font-size: clamp(3.4rem, 12vw, 6.4rem); }
.lc-date { color: var(--ink); font-weight: 700; font-size: 1.6rem; }
.stat { border: 2px solid var(--head); text-align: center; }
.stat-v { color: var(--head); }
.section-h { color: var(--head); font-weight: 800; }
.hero-h1 { color: var(--head); font-weight: 900; }
.fact { border-top: 4px solid var(--c); }
.city-time { color: var(--head); }
.g-footer { background: var(--head); color: #dbe4f3; }
.g-footer h4, .g-footer .g-brand { color: #fff; }
.g-footer a { color: #dbe4f3; }
@media (max-width: 860px) { .r-top-tag { margin-left: 0; } }
