/* Canada page (owner 2026-10-26): maple leaf watermark, flag mark, GPT News ticker */
:root { --ca-red: #D52B1E; }

/* maple leaf watermark (real elements: the site's own .page-hero::after / ::before are taken) */
.ca-leaf { position: absolute; z-index: -1; pointer-events: none; background: url("../img/maple-leaf.svg") center / contain no-repeat; }
/* the Canadian flag as a faint watermark on the right of the hero (owner 2026-10-27), fading in from the left */
.ca-hero .ca-flagmark { position: absolute; z-index: -1; pointer-events: none; right: 0; top: 50%; transform: translateY(-50%); width: min(62%, 760px); aspect-ratio: 2 / 1;
    background: url("../img/flag-canada.svg") center / 100% 100% no-repeat; opacity: .16;
    -webkit-mask-image: radial-gradient(ellipse 60% 70% at 62% 50%, #000 35%, transparent 100%); mask-image: radial-gradient(ellipse 60% 70% at 62% 50%, #000 35%, transparent 100%); }
.ca-body { position: relative; isolation: isolate; }
.ca-body > .ca-leaf { left: 50%; top: 80px; width: 620px; height: 620px; transform: translateX(-50%); opacity: .05; }
@media (max-width: 760px) { .ca-hero .ca-flagmark { width: 90%; opacity: .12; } .ca-body > .ca-leaf { width: 340px; height: 340px; } }

/* small Canadian flag (an image, so it looks the same on Windows, where flag emoji show as "CA") */
.ca-flag { display: inline-block; width: 1.6em; height: .8em; vertical-align: -.05em; margin-right: .35em; background: url("../img/flag-canada.svg") center / 100% 100% no-repeat; box-shadow: 0 0 0 1px rgba(0,0,0,.12); }
.svc-card .ca-flag, .audience .ca-flag { font-size: 14px; }

/* GPT News: a slow scrolling line of dates and updates */
.gpt-news { background: var(--white); border-block: 1px solid var(--line); overflow: hidden; }
.gpt-news .container { display: flex; align-items: center; gap: 14px; padding-block: 10px; }
.gpt-news .tag { flex: none; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--white); background: var(--red); padding: 4px 10px; }
.gpt-news .track { flex: 1; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.gpt-news .run { display: inline-flex; gap: 40px; white-space: nowrap; animation: gpt-news 60s linear infinite; padding-left: 100%; }
.gpt-news:hover .run, .gpt-news:focus-within .run { animation-play-state: paused; }
.gpt-news .item { font-size: 14px; color: var(--ink); }
.gpt-news .item b { color: var(--navy); margin-right: 6px; }
.gpt-news .item .when { color: var(--red-dark); font-weight: 700; margin-right: 6px; }
@keyframes gpt-news { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
    .gpt-news .run { animation: none; padding-left: 0; white-space: normal; flex-wrap: wrap; row-gap: 6px; }
}
