/* Klik's red, black and white identity, with an architectural exhibition rhythm. */
:root {
  --brand-red: #ed1c24;
  --red: #d51c24;
  --red-dark: #b3171e;
  --red-on-dark: #ff747a;
  --red-wash: #fff3f3;
  --muted: #555862;
  --header-height: 89px;
  --guide-height: 0px;
  --ui-ease: cubic-bezier(.22,.68,0,1.01);
}
html { scroll-padding-top: calc(var(--header-height) + var(--guide-height) + 24px); }
html:has(.jump-section) { --guide-height: 64px; }
h1, h2, h3 { text-wrap: pretty; }
.accent { color: var(--brand-red); }
.eyebrow, .eyebrow.red { color: var(--red); font-size: .875rem; letter-spacing: .12em; }
.eyebrow:before { width: 7px; height: 7px; background: var(--brand-red); }
.blue .eyebrow, .dark .eyebrow, .feature-tif .eyebrow,
.market-intro .eyebrow, .gallery-intro .eyebrow { color: var(--red-on-dark); }
.market-intro .accent, .gallery-intro .accent,
.blue .accent, .dark .accent, .tif-word span { color: var(--red-on-dark); }
.hero-copy h1 .hero-title-secondary { color: var(--red-on-dark); }
.hero-copy .eyebrow { color: #fff; font-size: .875rem; }
.home-hero:after { background: linear-gradient(90deg,rgba(10,12,19,.94),rgba(10,12,19,.86) 48%,rgba(10,12,19,.55) 72%,rgba(10,12,19,.24)),linear-gradient(0deg,rgba(10,12,19,.62),transparent 60%); }
.milestone-year, .project-card .number, .service-full .number { color: var(--red); }
.market-feature-list .list-item .number { color: var(--red-on-dark); }
.footer-heading { color: var(--red-on-dark); font-size: .875rem; }
.languages a.current { color: var(--red); }
.button, .text-link, .round-arrow, .circle-button {
  transition: background .22s, color .22s, border-color .22s, box-shadow .22s;
}
.button { border-radius: 3px; }
.button.light:hover { color: var(--red); background: #fff; border-color: #fff; }
.button.outline:hover { background: var(--red-wash); color: var(--red); border-color: var(--red); }
.button:focus-visible, .text-link:focus-visible, .voice-track:focus-visible,
a:focus-visible, button:focus-visible, summary:focus-visible { outline-color: var(--red); }
.field input:focus, .field select:focus, .field textarea:focus { outline-color: var(--red); }
.home-hero :focus-visible, .blue :focus-visible, .dark :focus-visible { outline-color: #fff; }

/* Desktop menus reveal a concise visual introduction and descriptive destinations. */
.site-header { border-bottom-color: #e2e3e8; box-shadow: 0 3px 18px #17182005; }
.header-inner { position: relative; }
.nav-group { position: static; }
.nav-link:after { transition: transform .2s; }
.nav-link.active:before { width: 100%; bottom: 19px; height: 2px; }
.nav-group summary:after { content: ''; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.nav-group[open] summary:after { transform: translateY(1px) rotate(225deg); }
.nav-group[open] summary { color: var(--red); }
.dropdown {
  top: 100%; left: auto; right: 0; width: 680px; max-width: 100%; padding: 12px;
  gap: 18px; grid-template-columns: 220px minmax(0,1fr); align-items: stretch;
  border: 1px solid var(--line); border-top: 3px solid var(--brand-red);
  background: #fff; box-shadow: 0 24px 48px #17182018;
}
.nav-group[open] .dropdown { display: grid; }
.dropdown-context { min-width: 0; background: var(--soft); padding: 12px; }
.dropdown-context img { width: 100%; height: 130px; object-fit: cover; }
.dropdown-context p { margin: 20px 3px 8px; font-size: 1.35rem; line-height: 1.35; letter-spacing: -.035em; color: var(--ink); }
.dropdown-links { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.dropdown-links a { display: flex; align-items: center; gap: 20px; justify-content: space-between; padding: 17px 15px; border-bottom: 1px solid var(--line); }
.dropdown-links a:last-child { border-bottom: 0; }
.dropdown-links a strong { display: block; font-size: .9375rem; line-height: 1.45; font-weight: 650; }
.dropdown-links a small { display: block; font-size: .875rem; line-height: 1.6; color: var(--muted); margin-top: 5px; }
.dropdown-links a .arrow { color: var(--red); flex-shrink: 0; }
.dropdown-links a:hover { background: var(--red-wash); }
.mobile-nav a { transition: color .2s; }
.mobile-nav a:hover { color: var(--red); }
.mobile-nav .mobile-sub { border-left: 2px solid var(--brand-red); margin-left: 2px; padding-left: 20px; }

/* A persistent, horizontal guide for the longer pages. */
.jump-section { position: sticky; top: var(--header-height); z-index: 20; background: #fffffff5; backdrop-filter: blur(14px); padding-block: 0; border-block: 1px solid var(--line); }
.section-jumps, .event-anchor-nav { margin: 0; padding: 0; border: 0; display: flex; gap: 32px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; overscroll-behavior-x: contain; }
.section-jumps a, .event-anchor-nav a { position: relative; flex-shrink: 0; margin: 0; padding: 19px 0; font-size: .875rem; line-height: 1.6; white-space: nowrap; border-bottom: 2px solid transparent; }
.section-jumps a[aria-current=location], .event-anchor-nav a[aria-current=location] { color: var(--red); border-bottom-color: var(--brand-red); }

/* Framed imagery, carefully offset captions, and clean exhibition surfaces. */
.page-hero.has-media { background: var(--paper); padding-block: 76px 88px; }
.page-hero.market-intro { background: var(--ink); }
.page-hero-grid { gap: 76px; align-items: center; }
.page-hero-grid figure { margin: 12px 0 16px 12px; min-height: 460px; align-self: stretch; }
.page-hero-grid>figure { justify-self:stretch; min-width:0; }
.page-hero-grid figure:before { content: ''; position: absolute; top: -12px; left: -12px; width: 64px; height: 64px; border-top: 3px solid var(--brand-red); border-left: 3px solid var(--brand-red); }
.page-hero-grid figure img { clip-path: polygon(0 0,calc(100% - 30px) 0,100% 30px,100% 100%,0 100%); }
.page-hero-grid figcaption { bottom: -16px; left: -12px; right: 28px; max-width: calc(100% - 16px); background: var(--paper); color: var(--ink); border-left: 3px solid var(--brand-red); box-shadow: 0 8px 30px #1718200b; padding: 14px 18px; font-size: .8125rem; }
.market-intro .page-hero-grid figcaption { color: var(--ink); }
.feature-tif { border-radius: 4px; }
.feature-tif .feature-content:before { content: ''; position: absolute; top: 0; left: 52px; width: 72px; height: 4px; background: var(--brand-red); }
.feature-picture>img { transition: transform 1.1s var(--ui-ease); }
.feature-picture .play-link { padding: 13px 19px 13px 13px; border: 1px solid #ffffff50; background: #1718208c; backdrop-filter: blur(12px); border-radius: 4px; }
.feature-picture .play-disc { width: 45px; height: 45px; }
.platform-card-visual { border-radius: 4px; }
.platform-card-label { background: #171820e8; border-left: 3px solid var(--brand-red); border-radius: 0 2px 2px 0; font-size: .8125rem; }
.platform-card-content { position: relative; padding-block: 28px 25px; }
.platform-card-content:after { content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 2px; background: var(--brand-red); transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ui-ease); }
.platform-card:hover .platform-card-content:after, .platform-card:focus-visible .platform-card-content:after { transform: scaleX(1); }
.platform-card:hover .round-arrow, .platform-card:focus-visible .round-arrow { color: #fff; background: var(--red); border-color: var(--red); }
.next-event { position: relative; }
.next-event:before { content: ''; position: absolute; top: 0; left: 0; height: 3px; width: 100%; background: var(--brand-red); }
.next-event .text-link { color: var(--red); }
.credential { position: relative; padding-block: 7px; }
.credential:hover b { color: var(--red); }
.credential b { transition: color .2s; }
.service-tile { padding: 32px 26px; background: var(--soft); border-top: 2px solid var(--line); border-radius: 3px; }
.soft .service-tile { background: #fff; }
.service-tile:focus-within { border-top-color: var(--brand-red); }
.services-grid { gap: 24px; }
.service-tile .text-link { margin-top: 23px; }
.project-card { border: 1px solid var(--line); border-radius: 3px; }
.project-card:before { top: -1px; width: 56px; }
.project-card .project-type { color: var(--red); }
.milestone-grid { gap: 46px 32px; }
.milestone { padding: 28px 0 0 22px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.milestone:before { top: -4px; left: -4px; width: 7px; height: 7px; }
.milestone-year { display: block; font-variant-numeric: tabular-nums; }
.milestone h3 { max-width: 340px; }
.network-group { border-top: 2px solid var(--ink); }
.network-group h3 { padding-left: 16px; border-left: 3px solid var(--brand-red); }
.network-group li { padding-left: 16px; }

/* Portrait-led testimonials, with a touch-friendly row of named selectors. */
.voice-heading { align-items: flex-end; }
.voice-controls { gap: 20px; }
.voice-count { color: var(--red); font-size: .875rem; font-weight: 650; }
.circle-button:hover:not(:disabled) { background: var(--red); color: #fff; border-color: var(--red); }
.voice-track { margin-top: 42px; border: 1px solid var(--line); border-top: 3px solid var(--brand-red); border-radius: 3px; background: #fff; }
.voice-slide { display: grid; grid-template-columns: 220px minmax(0,1fr); align-items: center; gap: 62px; padding: 48px; border: 0; min-height: 390px; }
.voice-statement { grid-column: 2; grid-row: 1; position: relative; padding-top: 47px; min-width: 0; }
.voice-slide .quote-mark { left: 0; top: -10px; font-family: Georgia,serif; font-size: 6rem; line-height: 1; color: var(--brand-red); }
.voice-slide blockquote { margin: 0; max-width: 920px; color: var(--ink); font-size: clamp(1.7rem,2.3vw,2.6rem); line-height: 1.48; font-weight: 450; letter-spacing: -.035em; }
.voice-slide figcaption { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 22px; margin: 0; max-width: 220px; padding-right: 24px; border-right: 1px solid var(--line); }
.voice-slide figcaption img { width: 112px; height: 112px; object-fit: cover; border-radius: 50%; border: 5px solid var(--soft); }
.voice-slide figcaption strong { color: var(--red); font-size: 1.125rem; font-weight: 700; line-height: 1.45; letter-spacing: -.02em; }
.voice-slide figcaption span { font-size: .875rem; line-height: 1.7; margin-top: 7px; }
.voice-dots { display: flex; align-items: stretch; gap: 8px; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; padding: 16px 2px 8px; margin: 0; }
.voice-dot { flex: 1 0 132px; width: auto; max-width: 180px; height: auto; padding: 14px 8px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 12px; border: 1px solid transparent; border-radius: 3px; color: var(--muted); background: transparent; transition: background .2s, border-color .2s, color .2s; }
.voice-dot:before { display: none; }
.voice-dot img { display: block; width: 44px; height: 44px; object-fit: cover; border-radius: 50%; }
.voice-dot span { display: block; text-align: center; font-size: .875rem; font-weight: 650; line-height: 1.5; }
.voice-dot:hover { background: #fff; color: var(--ink); border-color: var(--line); }
.voice-dot[aria-pressed=true] { background: var(--red-wash); color: var(--red); border-color: var(--red); }
.voice-dot:focus-visible { outline-offset: -3px; }
.voice-footer { display: flex; align-items: center; justify-content: space-between; border: 0; gap: 28px; padding-top: 17px; }
.voice-footer>p { max-width: 710px; font-size: .8125rem; }
.voice-swipe-hint { display: none; flex-shrink: 0; color: var(--muted); font-size: .8125rem; }
.voice-swipe-hint span { color: var(--red); margin-left: 9px; }

/* The gallery and supporting pages use the same restrained interaction language. */
.media-open, .news-image { border-radius: 3px; }
.media-open:focus-visible { outline-offset: 4px; }
.media-caption strong { line-height: 1.6; }
.media-open .media-action { transition: background .2s, color .2s, border-color .2s; }
.media-open:hover .media-action, .media-open:focus-visible .media-action { background: var(--red); color: #fff; border-color: var(--red); }
.media-badge { border-left: 3px solid var(--brand-red); }
.gallery-categories { gap: 5px; background: var(--soft); padding: 5px; border-radius: 4px; margin-left: 0; }
.gallery-category { border: 0; border-radius: 3px; font-size: .875rem; transition: color .2s, background .2s; }
.gallery-category[aria-pressed=true] { background: var(--red); color: #fff; }
.gallery-category:hover:not([aria-pressed=true]) { background: #fff; color: var(--red); }
.gallery-kind label { font-size: .875rem; }
.news-card { border-top: 0; }
.news-card .eyebrow { color: var(--red); font-size: .875rem; }
.news-card h3 a { text-decoration-color: transparent; text-decoration-thickness: 1px; text-underline-offset: 6px; transition: color .2s, text-decoration-color .2s; }
.news-card h3 a:hover { color: var(--red); text-decoration: underline; text-decoration-thickness: 1px; }
.faq details { padding: 0; border-bottom: 1px solid var(--line); }
.faq-layout>div:first-child { top: calc(var(--header-height) + var(--guide-height) + 28px); }
.faq summary { padding: 25px 20px; font-size: 1rem; line-height: 1.6; }
.faq summary:after { content: '+'; display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; background: var(--soft); color: var(--red); border: 1px solid var(--line); border-radius: 50%; font-size: 1.2rem; line-height: 1; }
.faq details[open] { border-left: 2px solid var(--brand-red); background: var(--soft); }
.faq details[open] summary { color: var(--red); padding-bottom: 17px; }
.faq details[open] summary:after { content: '−'; background: var(--red); color: #fff; border-color: var(--red); }
.faq details p { margin: 0; padding: 0 20px 25px; font-size: 1rem; }
.archive-table tbody th { color: var(--red); font-variant-numeric: tabular-nums; }
.archive-table tbody tr:hover { background: var(--red-wash); }
.catalogue-highlight { border-left: 3px solid var(--brand-red); }
.enquiry-form { border-top: 3px solid var(--brand-red); border-radius: 3px; }
.cta-section { background: var(--red); }
.cta-inner .button.light { color: var(--red); }
.footer-wordmark { color: #ffffff20; letter-spacing: -.065em; }

@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .feature-tif:hover .feature-picture>img { transform: scale(1.025); }
  .platform-card:hover .platform-card-visual img { transform: scale(1.04); }
  .service-tile { transition: border-color .25s, background .25s; }
  .service-tile:hover { border-color: var(--brand-red); }
}
@media (prefers-reduced-motion:no-preference) {
  @keyframes menu-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
  .nav-group[open] .dropdown { animation: menu-in .22s var(--ui-ease); }
}
@media (max-width:1250px) {
  .page-hero-grid { gap: 48px; }
  .voice-slide { grid-template-columns: 190px minmax(0,1fr); gap: 40px; padding: 38px; }
  .voice-dot { flex-basis: 125px; }
  .feature-tif .feature-content:before { left: 40px; }
}
@media (max-width:1024px) {
  :root { --header-height: 79px; }
  .page-hero.has-media { padding-block: 58px 70px; }
  .page-hero-grid { gap: 40px; }
  .page-hero-grid figure { min-height: 410px; }
  .voice-slide { grid-template-columns: 166px minmax(0,1fr); gap: 30px; padding: 32px; min-height: 440px; }
  .voice-slide blockquote { font-size: 1.8rem; }
  .voice-slide figcaption { padding-right: 18px; }
  .voice-slide figcaption img { width: 92px; height: 92px; }
  .voice-slide figcaption strong { font-size: 1rem; }
  .voice-swipe-hint { display: inline; }
  .feature-tif .feature-content:before { left: 32px; }
}
@media (max-width:720px) {
  :root { --header-height: 75px; }
  .eyebrow, .hero-copy .eyebrow { font-size: .875rem; letter-spacing: .075em; }
  .home-hero:after { background: linear-gradient(90deg,rgba(10,12,19,.94),rgba(10,12,19,.76)),linear-gradient(0deg,rgba(10,12,19,.7),transparent 70%); }
  .section-jumps, .event-anchor-nav { gap: 27px; }
  .section-jumps a, .event-anchor-nav a { padding-block: 15px; }
  .page-hero.has-media { padding-block: 48px 58px; }
  .page-hero-grid { gap: 35px; }
  .page-hero-grid figure { min-height: 0; aspect-ratio: 1.4; margin: 6px 0 12px 8px; }
  .page-hero-grid figure:before { width: 44px; height: 44px; top: -8px; left: -8px; }
  .page-hero-grid figcaption { left: -8px; bottom: -12px; padding: 11px 14px; font-size: .8125rem; }
  .feature-tif .feature-content:before { left: 27px; }
  .feature-picture .play-link { padding: 10px 14px 10px 10px; right: 20px; bottom: 20px; }
  .platform-card-label { font-size: .8125rem; right: 16px; max-width: fit-content; }
  .platform-card-content { padding-block: 22px; }
  .service-tile { padding: 27px 22px; gap: 16px; }
  .milestone { padding-left: 16px; }
  .milestone-grid.compact { gap: 30px 22px; }
  .milestone-year { font-size: 2.5rem; }
  .voice-heading { display: block; }
  .voice-controls { justify-content: flex-end; gap: 17px; margin-top: 25px; }
  .voice-track { margin-top: 20px; }
  .voice-slide { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; padding: 26px 24px 30px; gap: 29px; min-height: 460px; }
  .voice-slide figcaption { order: -1; display: flex; flex-direction: row; align-items: center; max-width: 100%; gap: 18px; padding: 0 0 24px; border-right: 0; border-bottom: 1px solid var(--line); }
  .voice-slide figcaption img { width: 64px; height: 64px; border-width: 3px; }
  .voice-slide figcaption strong { font-size: 1rem; }
  .voice-slide figcaption span { font-size: .875rem; line-height: 1.55; margin-top: 5px; }
  .voice-statement { padding-top: 36px; }
  .voice-slide .quote-mark { top: -9px; font-size: 4.6rem; }
  .voice-slide blockquote { font-size: 1.45rem; line-height: 1.6; letter-spacing: -.025em; }
  .voice-dots { gap: 7px; padding-top: 12px; }
  .voice-dot { flex: 0 0 120px; padding: 13px 8px; gap: 9px; }
  .voice-dot img { width: 38px; height: 38px; }
  .voice-dot span { font-size: .875rem; }
  .voice-footer { display: block; padding-top: 14px; }
  .voice-swipe-hint { display: block; margin-top: 12px; }
  .gallery-categories { gap: 4px; padding: 4px; }
  .gallery-category { padding: 11px 13px; font-size: .875rem; }
  .gallery-kind { flex-wrap: wrap; gap: 10px; }
  .faq summary { padding: 22px 13px; gap: 16px; }
  .faq details p { padding-inline: 13px; }
  .footer-heading { font-size: .875rem; }
}
@media (max-width:380px) {
  .voice-slide { padding-inline: 19px; }
  .voice-slide blockquote { font-size: 1.35rem; }
  .voice-slide figcaption { gap: 13px; }
  .voice-slide figcaption img { width: 54px; height: 54px; }
  .voice-dot { flex-basis: 110px; }
}
@media (prefers-reduced-motion:reduce) {
  *, *:before, *:after { animation: none!important; transition: none!important; scroll-behavior: auto!important; }
}
@media print {
  .jump-section, .voice-dots, .voice-swipe-hint { display: none!important; }
  .voice-track { overflow: visible; display: block; }
  .voice-slide { display: block; min-height: 0; padding: 24px 0; break-inside: avoid; }
  .voice-slide figcaption { border: 0; flex-direction: row; max-width: none; margin-top: 20px; }
  .voice-statement { padding-top: 0; }
  .voice-slide .quote-mark { display: none; }
}

/* Restrained movement: clear reading order, short accents, no perpetual effects. */
/* Connected exhibition areas: controls stay outside the illustrative SVG. */
.sector-prompt { margin: 0 0 22px; font-size: 1rem; color: var(--ink); }
.sector-map { position: relative; padding-bottom: 84px; }
.sector-lines { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.sector-lines path { fill: none; stroke: var(--red); stroke-width: 1.5px; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.sector-buttons { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px; position: relative; }
.sector-node { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px; min-width: 0; min-height: 96px; padding: 19px 16px; border: 1px solid var(--line); border-radius: 3px; background: #fff; text-align: left; color: var(--ink); cursor: pointer; }
.sector-node strong { font-size: .9375rem; line-height: 1.4; }
.sector-node span { font-size: .875rem; line-height: 1.45; color: var(--muted); }
.sector-node.is-related { border-color: #d51c2470; }
.sector-node:hover { border-color: var(--red); background: var(--red-wash); }
.sector-node[aria-pressed=true] { border-color: var(--red); background: var(--red); color: #fff; }
.sector-node[aria-pressed=true] span { color: #fff; }
.sector-node:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
.sector-status { margin: 0 0 28px; max-width: 80ch; font-size: .875rem; line-height: 1.75; color: var(--red); }
.sector-explorer.has-selection .connection-grid { grid-template-columns: repeat(var(--connection-count,3),minmax(0,1fr)); }
.sector-explorer .connection-grid { margin-bottom: 36px; }
.sector-explorer .connection-grid article { min-width: 0; }
.sector-explorer .connection-grid article[hidden] { display: none; }
.sector-explorer .connection-grid article p { max-width: 74ch; }

/* Chronology: a quiet continuous rail, with every milestone readable immediately. */
.history-timeline { position: relative; display: grid; grid-template-columns: 1fr; gap: 0; }
.history-timeline .milestone { position: relative; display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 36px; padding: 25px 0 28px 36px; border: 0; }
.history-timeline .milestone:before { display: none; }
.history-timeline .milestone-year { margin: 0; font-size: 3rem; line-height: 1.15; }
.history-timeline .milestone-copy { padding: 7px 0 27px; border-bottom: 1px solid var(--line); }
.history-timeline .milestone:last-child .milestone-copy { border: 0; }
.history-timeline .milestone h3 { max-width: none; font-size: 1.125rem; }
.history-timeline .milestone p { max-width: 76ch; margin-top: 12px; }
.timeline-dot { position: absolute; width: 9px; height: 9px; left: 3px; top: 36px; background: var(--paper); border: 1px solid var(--red); border-radius: 50%; z-index: 1; }
.timeline-rail { position: absolute; top: 40.5px; left: 7.5px; width: 1px; height: calc(100% - 105px); background: var(--line); pointer-events: none; }
.timeline-progress { position: absolute; inset: 0; display: block; background: var(--red); transform-origin: top left; }
.history-timeline .is-passed .timeline-dot { background: var(--red); }
.history-timeline .is-current .timeline-dot { box-shadow: 0 0 0 5px var(--red-wash); }
.history-timeline.compact { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 32px; }
.history-timeline.compact .milestone { display: block; padding: 32px 0 0; }
.history-timeline.compact .timeline-dot { left: 0; top: -4px; }
.history-timeline.compact .timeline-rail { top: .5px; left: 4.5px; width: calc(75% + 8px); height: 1px; }
.history-timeline.compact .milestone-year { margin-bottom: 16px; font-size: 2.7rem; }
.history-timeline.compact .milestone-copy { border: 0; padding: 0; }
.history-timeline.compact .milestone h3 { font-size: 1.0625rem; }

@media (max-width:1024px) {
  .history-timeline.compact { grid-template-columns: 1fr; gap: 0; }
  .history-timeline.compact .milestone { display: grid; grid-template-columns: 130px minmax(0,1fr); gap: 30px; padding: 24px 0 26px 36px; }
  .history-timeline.compact .timeline-dot { left: 3px; top: 36px; }
  .history-timeline.compact .timeline-rail { top: 40.5px; left: 7.5px; width: 1px; height: calc(100% - 105px); }
}
@media (max-width:900px) {
  .sector-map { padding: 0 0 0 58px; margin-bottom: 25px; }
  .sector-buttons { grid-template-columns: 1fr; gap: 10px; }
  .sector-node { min-height: 60px; padding: 13px 18px; flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; }
  .sector-node span { text-align: right; }
  .sector-explorer.has-selection .connection-grid { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width:720px) {
  .history-timeline .milestone, .history-timeline.compact .milestone { display: block; padding: 25px 0 20px 34px; }
  .history-timeline .milestone-year, .history-timeline.compact .milestone-year { font-size: 2.5rem; margin-bottom: 15px; }
  .history-timeline .milestone-copy { padding: 0 0 25px; }
  .history-timeline.compact .milestone-copy { padding-bottom: 22px; border-bottom: 1px solid var(--line); }
  .sector-map { padding-left: 48px; }
  .sector-node { flex-direction: column; align-items: flex-start; gap: 4px; padding: 12px 15px; }
  .sector-node span { text-align: left; }
}
@media (prefers-reduced-motion:no-preference) {
  @keyframes klik-connect { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
  .sector-lines .connection-draw { stroke-dasharray: 1; animation: klik-connect 420ms ease-out var(--connection-delay,0ms) backwards; }
  .sector-node { transition: background 160ms, border-color 160ms, color 160ms; }
  .timeline-dot { transition: background 160ms, box-shadow 160ms; }

  /* Native same-origin navigation: no click interception or artificial loading delay. */
  @view-transition { navigation: auto; }
  .site-header { view-transition-name: klik-header; }
  ::view-transition-group(*) { animation-duration: 180ms; }
  ::view-transition-old(root) { animation: klik-page-out 180ms ease-out both; }
  ::view-transition-new(root) { animation: klik-page-in 180ms ease-out both; }
  ::view-transition-old(klik-header) { animation: none; opacity: 0; }
  ::view-transition-new(klik-header) { animation: none; }
  @keyframes klik-page-out { to { opacity: 0; } }
  @keyframes klik-page-in { from { opacity: 0; } }
}
@media (prefers-reduced-motion:reduce) {
  @view-transition { navigation: none; }
  .timeline-progress { transform: none!important; }
  .sector-lines path { stroke-dasharray: none!important; }
}
@media print {
  .sector-controls { display: none!important; }
  .sector-explorer.has-selection .connection-grid { display: block; }
  .sector-explorer .connection-grid article[hidden] { display: block!important; }
  .timeline-progress { transform: none!important; }
  .history-timeline .milestone { break-inside: avoid; }
}

.motion-heading>span { display: inline-block; max-width: 100%; }
.market-scope .benefit-grid { gap: 24px; }
.market-scope .benefit {
  position: relative;
  padding: 30px 28px 32px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: #fff;
}
.market-scope .benefit .number {
  display: grid; place-items: center;
  width: 38px; height: 38px;
  margin-bottom: 24px;
  border: 1px solid #ed1c241c;
  border-radius: 50%;
  background: var(--red-wash);
  color: var(--red); font-size: .875rem;
}
.market-scope .benefit h3 { font-size: 1.35rem; line-height: 1.35; }
.market-scope .benefit p { font-size: 1rem; line-height: 1.85; }
.benefit, .step { position: relative; }
.benefit:before, .step:before {
  content: ''; position: absolute; top: -1px; left: 0;
  height: 2px; width: 42px;
  background: var(--brand-red); transform-origin: left;
  pointer-events: none;
}
.market-scope .benefit:before { left: 28px; }
.market-brief .split>div:last-child {
  padding: 30px 32px; background: var(--soft);
  border-left: 2px solid var(--brand-red); border-radius: 0 3px 3px 0;
}

@media (prefers-reduced-motion:no-preference) {
  @keyframes klik-rule-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  .benefit.motion-arrived:before, .step.motion-arrived:before {
    animation: klik-rule-draw 700ms var(--ui-ease) var(--motion-delay,0ms) backwards;
  }
  @keyframes klik-dialog-in {
    from { opacity: .4; transform: translateY(9px); }
    to { opacity: 1; transform: translateY(0); }
  }
  .media-dialog[open] { animation: klik-dialog-in 240ms var(--ui-ease); }
  @keyframes klik-answer-in {
    from { opacity: .4; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
  }
  .faq details[open]>p { animation: klik-answer-in 260ms var(--ui-ease); }
  .button:active { transform: translateY(1px); }
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .market-scope .benefit, .project-card, .service-tile {
    transition: transform .28s var(--ui-ease), border-color .28s, box-shadow .28s;
  }
  .market-scope .benefit:hover, .project-card:hover, .service-tile:hover {
    transform: translateY(-3px);
    border-color: #d2b7b9;
    box-shadow: 0 12px 24px #17182008;
  }
  .market-scope .benefit .number { transition: background .25s, color .25s; }
  .market-scope .benefit:hover .number { background: var(--red); color: white; }
  .voice-dot img { transition: transform .3s var(--ui-ease); }
  .voice-dot:hover img { transform: scale(1.06); }
  .desktop-nav .nav-link:not(.active):before {
    content: ''; position: absolute; bottom: 19px; left: 0;
    height: 2px; width: 100%; background: var(--brand-red);
    transform: scaleX(0); transform-origin: left;
    transition: transform .25s var(--ui-ease);
  }
  .desktop-nav .nav-link:not(.active):hover:before { transform: scaleX(1); }
  .text-link .arrow, .button .arrow { transition: transform .25s var(--ui-ease); }
  .text-link:hover .arrow, .button:hover .arrow { transform: translate(3px,-2px); }
}
@media (max-width:720px) {
  .market-scope .benefit-grid { gap: 20px; }
  .market-scope .benefit { padding: 26px 24px 28px; }
  .market-scope .benefit:before { left: 24px; }
  .market-scope .benefit .number { margin-bottom: 20px; }
  .market-brief .split>div:last-child { padding: 27px 24px; }
}
@media print {
  .market-scope .benefit, .market-brief .split>div:last-child { box-shadow: none; background: white; }
}

/* Current company identity: preserve the supplied square logo. */
.brand img{object-fit:contain;aspect-ratio:1;width:54px;height:54px}.footer-brand{display:inline-flex;align-items:center;gap:14px}.footer-brand .footer-logo{width:64px;height:64px;object-fit:contain;flex:none}.footer-brand span{display:block}

/* Browse by exhibition, then by the kind of experience. */
.gallery-tools{display:block;border-top:1px solid var(--line);padding-top:24px}
.gallery-categories{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.gallery-category{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;min-height:66px;padding:15px 18px;font-size:.9375rem}
.gallery-category-count{font-size:.75rem;font-weight:600;opacity:.75;font-variant-numeric:tabular-nums}
.gallery-refinements{display:flex;gap:24px;justify-content:flex-end;margin-top:23px}
.gallery-refinements .gallery-kind{display:flex;align-items:center;gap:12px}
.gallery-refinements select{min-height:46px;background:#fff;max-width:100%;font-size:.9375rem;border:1px solid var(--line);border-radius:0;padding:9px 30px 9px 13px}
.gallery-refinements label{font-size:.875rem;font-weight:600}
@media(max-width:1024px){.gallery-categories{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-category{min-height:59px;padding:13px}.gallery-refinements{justify-content:flex-start}}
@media(max-width:768px){.brand img{width:44px;height:44px}.footer-brand .footer-logo{width:58px;height:58px}.gallery-categories{display:flex;overflow:auto;flex-wrap:nowrap;scroll-snap-type:x proximity;padding:5px;gap:5px}.gallery-category{flex:0 0 auto;gap:16px;min-height:54px;scroll-snap-align:start;padding-inline:16px}.gallery-refinements{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:15px}.gallery-refinements .gallery-kind{display:grid;align-items:start;gap:8px;min-width:0}.gallery-refinements select{width:100%;font-size:.875rem;padding-left:10px;padding-right:18px}.gallery-tools{margin-bottom:28px}.opportunity-credit a{color:inherit}}

/* Keep mobile hero photography and its caption in normal document flow. */
@media(max-width:720px){
  .exhibitions-refined .page-hero .page-hero-grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .exhibitions-refined .page-hero .page-hero-grid>div{min-width:0}
  .exhibitions-refined .page-hero .page-hero-grid>figure{width:100%;min-width:0;min-height:0;aspect-ratio:auto;margin:8px 0 0;align-self:start;justify-self:stretch}
  .exhibitions-refined .page-hero .page-hero-grid>figure>img{position:static;inset:auto;display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
  .exhibitions-refined .page-hero .page-hero-grid>figure>figcaption{position:static;inset:auto;width:auto;max-width:none;margin:12px 0 0;padding:8px 0 8px 14px;line-height:1.6;overflow-wrap:break-word}
  .exhibitions-refined .page-hero .page-hero-grid .actions{align-items:stretch;gap:12px}
  .exhibitions-refined .page-hero .page-hero-grid .actions .button{min-width:0;max-width:100%;white-space:normal;justify-content:space-between;text-align:left}
}