@charset "UTF-8";

:root {
  color-scheme: light;
  --background: #e9e7e2;
  --ink: #292a27;
  --muted: #666760;
  --line: #c9c8bf;
  --accent: #f2cf39;
  font-family: "Segoe UI Variable", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  color: var(--ink);
  background: var(--background);
  font-synthesis: none;
}

* { box-sizing: border-box; }
body { margin: 0; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { color: var(--ink); background: var(--accent); }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 6px; }
[hidden] { display: none !important; }

.page { max-width: 1600px; min-height: 100svh; margin: auto; padding: 0 5.5%; display: flex; flex-direction: column; }
.header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 30px 0; border-bottom: 1px solid var(--line); }
.header-note { color: var(--muted); font-size: 12px; }
main { flex: 1; display: grid; align-items: center; }
.intro { display: grid; grid-template-columns: 1.12fr 1fr; gap: 5%; align-items: center; padding: 72px 0 68px; }
.eyebrow, .map-topline, .link-number, .detail-eyebrow, .map-side-note, .map-watermark {
  font-family: "Cascadia Code", Consolas, monospace;
  font-size: 10px;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.eyebrow { display: flex; align-items: center; gap: 10px; color: var(--muted); margin: 0 0 30px; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px #d9d5bd; }
h1 { margin: 0; color: #000; font-size: clamp(38px, 4.5vw, 68px); font-weight: 600; letter-spacing: -.065em; line-height: 1.02; }
.welcome { display: flex; align-items: flex-start; gap: 18px; margin: 38px 0 36px; }
.welcome-line { width: 28px; height: 3px; margin-top: 11px; background: var(--accent); flex-shrink: 0; }
.welcome p { color: var(--muted); line-height: 1.7; font-size: 15px; margin: 0; }
.contact-links { max-width: 420px; }
.contact-link { display: flex; align-items: center; gap: 22px; padding: 18px 0; border-top: 1px solid var(--line); }
.contact-link:last-child { border-bottom: 1px solid var(--line); }
.link-number { color: var(--muted); font-size: 10px; }
.link-content { flex: 1; display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline; }
.link-label { font-size: 16px; font-weight: 500; }
.link-detail { color: var(--muted); font-size: 12px; }
.link-arrow { display: grid; place-items: center; height: 30px; width: 30px; border-radius: 50%; font-size: 22px; transition: background .2s, transform .2s; }
.contact-link:hover .link-arrow, .contact-link:focus-visible .link-arrow { background: var(--accent); transform: translate(2px, -2px); }
.map-panel { margin: 0; min-width: 0; align-self: stretch; display: flex; flex-direction: column; justify-content: center; }
.map-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 9px; }
.map-topline > :last-child { font-size: 12px; white-space: nowrap; }
.map-art { position: relative; width: 100%; max-width: 510px; margin: 6px auto 0; }
.ireland-map { display: block; width: 100%; height: auto; overflow: visible; }
.map-orbit { fill: none; stroke: #d3d1c8; stroke-width: .8; }
.inner-orbit { stroke-dasharray: 2 7; }
.map-axis { stroke: #d3d1c8; stroke-width: .7; stroke-dasharray: 3 6; }
.island-fill { fill: #deddd5; }
.island-grid { color: #b7b7aa; }
.island-outline { fill: none; stroke: #999d8b; stroke-width: 1.2; stroke-linejoin: round; }
.map-contour { fill: none; stroke: #c7c8bb; stroke-width: 1; }
.location-halo { fill: var(--accent); fill-opacity: .18; transition: r .3s, fill-opacity .3s; }
.location-ring { fill: var(--accent); fill-opacity: .3; stroke: #9c8319; stroke-width: .8; }
.location-core { fill: var(--ink); }
.location-leader { stroke: #9c8319; stroke-width: .8; }
.map-watermark { fill: var(--muted); font-size: 9px; letter-spacing: .3em; }
.map-pin { position: absolute; left: 68.542%; top: 48.776%; transform: translate(-50%, -50%); width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--accent); color: var(--ink); display: grid; place-items: center; cursor: pointer; box-shadow: 0 0 0 6px #f2cf3926; transition: box-shadow .2s; }
.pin-cross { font-size: 24px; font-weight: 300; transition: transform .2s; }
.map-pin:hover, .map-pin:focus-visible, .map-pin[aria-expanded="true"] { box-shadow: 0 0 0 12px #f2cf3933; }
.map-pin[aria-expanded="true"] .pin-cross { transform: rotate(45deg); }
.map-art:has(.map-pin:hover) .location-halo, .map-art:has(.map-pin:focus-visible) .location-halo, .map-art.is-active .location-halo { r: 38; fill-opacity: .3; }
.location-detail { position: absolute; top: 57%; right: 3%; padding: 16px 20px; border: 1px solid var(--line); border-left: 3px solid var(--accent); background: var(--background); box-shadow: 0 10px 24px #292a270a; z-index: 1; }
.location-detail span, .location-detail strong { display: block; }
.detail-eyebrow { color: var(--muted); font-size: 8px; margin-bottom: 10px; }
.location-detail strong { font-size: 20px; font-weight: 700; letter-spacing: -.04em; }
.location-detail > :last-child { color: var(--muted); font-size: 12px; margin-top: 4px; }
.map-side-note { position: absolute; right: -9px; top: 30%; writing-mode: vertical-rl; color: var(--muted); font-size: 8px; }
.footer { display: flex; justify-content: flex-end; align-items: center; gap: 20px; border-top: 1px solid var(--line); padding: 23px 0; color: var(--muted); font-size: 10px; }
.footer-note { display: flex; align-items: center; gap: 16px; }
.footer-square { width: 7px; height: 7px; background: var(--accent); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

@media (max-width: 900px) {
  .page { padding: 0 6%; }
  .intro { gap: 3%; padding: 56px 0; }
  .eyebrow { font-size: 8px; }
  .map-topline { font-size: 8px; }
  .link-content { flex-direction: column; gap: 3px; }
}

@media (max-width: 650px) {
  .header { padding: 24px 0; }
  .intro { grid-template-columns: 1fr; gap: 48px; padding: 44px 0 34px; }
  .eyebrow { font-size: 9px; margin-bottom: 24px; }
  h1 { font-size: clamp(36px, 9vw, 56px); }
  .welcome { margin: 28px 0; }
  .contact-links { max-width: none; }
  .link-content { flex-direction: row; gap: 6px 16px; }
  .map-panel { width: 100%; max-width: 430px; margin: auto; }
  .map-topline { font-size: 8px; }
  .map-art { width: 90%; }
  .map-side-note { right: -12px; }
  .footer { font-size: 9px; padding: 20px 0; flex-wrap: wrap; gap: 12px; }
  .footer-note { gap: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}

@media (forced-colors: active) {
  .map-pin { border: 2px solid ButtonText; }
  .status-dot, .footer-square, .welcome-line { background: CanvasText; }
}