/* The website's look over the Assan sections (planning/2026-10-27-assan). Loaded last, after zynim.css and site.css.
   Assan's own softer shapes (radii, soft shadows, blob-masked portraits, gradients), re-tinted to indigo and Tango,
   over the brand kit's colours, type and dark mode: the "B · relaxed" look, chosen 8 of 8 by the team (S1, Colin,
   2026-10-27). Never white text on Tango. Never edit Public/assan/; override here. */
/* ── Components the sections use ── */
.zy-tile{background:var(--zy-indigo-800,#2F3866);color:#C7CDE8}
.zy-tile .zy-figure{color:#FFFFFF}
.zy-tile-accent{background:#ED7A1C;color:#151718}
.zy-tile-accent .zy-figure,.zy-tile-accent .zy-tile-note{color:#151718}
.zy-tile-note{color:#9AA6D6}
/* every logo tile in the strip is the same height; its width follows the logo (Colin, 2026-10-28) */
.zy-logo{height:44px;width:auto;max-width:none;object-fit:contain;background:#FFFFFF;padding:6px 10px;border-radius:var(--bs-border-radius)}
.zy-logo-badge{width:9rem;height:auto}
/* Assan colours every .badge white via .badge:not(.bg-light):not(.bg-white):not(.bg-gradient-light) (0,4,0): out-rank it */
.badge.zy-chip.zy-chip.zy-chip.zy-chip,.badge.zy-chip{background:var(--bs-tertiary-bg);color:var(--bs-body-color);font-weight:400;font-size:.8125rem;padding:.5em .9em;border:1px solid var(--bs-border-color)}
.zy-persona-card{color:inherit}
.zy-persona-card:hover{color:inherit}
.zy-persona-q{font-weight:800;color:var(--bs-heading-color);line-height:1.4}
.zy-persona-link{color:var(--bs-link-color)}
.zy-persona{aspect-ratio:960/1140;object-fit:cover}
.zy-persona-placeholder{display:flex;align-items:center;justify-content:center;background:var(--bs-tertiary-bg);color:var(--bs-secondary-color);border:1px dashed var(--bs-border-color)}
.zy-persona-placeholder.zy-persona{font-size:5rem}
.avatar.zy-persona-placeholder{font-size:1.5rem}
.zy-sentence{font-size:1.25rem;font-weight:800;color:var(--bs-heading-color);border-left:2px solid #ED7A1C;padding-left:1rem}
.zy-num{font-weight:800;font-variant-numeric:tabular-nums;color:var(--bs-link-color)}
.zy-tile-fig img{max-width:160px;height:auto}
.zy-gate-n{font-weight:800}
.zy-gate-body{padding-top:5.5rem}
.list-timeline-v .timeline-icon{color:inherit}
.zy-era-here h3{color:#ED7A1C}
.zy-shot{display:block}
.zy-screen-placeholder{aspect-ratio:16/10}
/* Section headings in the Assan sections use .display-6; the brand weights every heading 800. */
.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{font-weight:800;letter-spacing:-.015em}

/* ── Assan’s softer shapes, re-tinted to indigo and Tango ── */
:root{
  --bs-border-radius:.375rem; --bs-border-radius-sm:.25rem; --bs-border-radius-lg:.5rem; --bs-border-radius-xl:1rem;
  --bs-border-radius-xxl:2rem; --bs-border-radius-2xl:2rem; --bs-border-radius-pill:50rem;
  --bs-box-shadow-sm:0 .125rem .25rem rgba(22,26,49,.075); --bs-box-shadow:0 .5rem 1rem rgba(22,26,49,.12); --bs-box-shadow-lg:0 1rem 3rem rgba(22,26,49,.16);
  /* gradients stay in the indigo family, so white text keeps its contrast (never white on Tango) */
  --as-accent:#22284A; --as-accent-rgb:34,40,74;
  --as-accent-2:#4A5590; --as-accent-2-rgb:74,85,144;
  --as-accent-3:#2F3866; --as-accent-3-rgb:47,56,102;
}
/* zynim.css’s .zy-ground-dark sets the background shorthand, which clears Assan’s gradient: restate it. Kept quiet, a
   lift from indigo-900 to indigo-700 and back, not out to indigo-600 (too loud as a background, Colin 2026-10-28) */
.zy-ground-dark.bg-gradient-primary{background-image:linear-gradient(155deg,var(--zy-indigo-900,#22284A) 20%,var(--zy-indigo-700,#2F3866) 60%,var(--zy-indigo-800,#2A3157) 95%)}
.bg-gradient-blur{background-image:linear-gradient(180deg,rgba(250,248,245,.01),#FAF8F5 85%),radial-gradient(ellipse at top left,rgba(74,85,144,.22),transparent 50%),radial-gradient(ellipse at center right,rgba(237,122,28,.16),transparent 50%)}
.btn{--bs-btn-border-radius:.5rem}
.card{background:var(--bs-body-bg)}
.card.bg-body-tertiary{background:var(--bs-tertiary-bg)!important}
.zy-screen-placeholder{border-radius:1rem}
html[data-bs-theme=dark] .bg-gradient-blur{background-image:linear-gradient(180deg,rgba(22,26,49,.01),#161A31 85%),radial-gradient(ellipse at top left,rgba(74,85,144,.6),transparent 50%),radial-gradient(ellipse at center right,rgba(237,122,28,.25),transparent 50%)}

/* ── A5 pages (About, Contact, Community) ── */
/* About’s leadership is text only — the team does not want photos (Colin, 2026-10-27) */
.zy-leader:hover{color:inherit}
.zy-leader .small{color:#C7CDE8}
.zy-bio-rule{width:48px;border-top:2px solid #ED7A1C}
.zy-fact-mark{min-width:3rem}
.zy-sticky{position:sticky;top:6rem}
.zy-bio p{max-width:68ch}
.zy-logo-panel{background:#FFFFFF;aspect-ratio:16/10}
.zy-partner-logo{max-width:70%}

/* ── A6 pages (Media, Gaming, legal, 404) ── */
.zy-illustration{max-height:260px;width:auto}
.zy-illus-panel{background:#FFFFFF}
.zy-landscape{aspect-ratio:3/1;object-fit:cover;object-position:center 60%}
.zy-overlap{margin-top:-4rem}
@media (max-width:991.98px){.zy-overlap{margin-top:-2rem}}
.zy-404-fig img{max-width:360px;width:100%;height:auto}
.zy-video{aspect-ratio:16/9}
.zy-video iframe{width:100%;height:100%;border:0;display:block}

.zy-role{color:var(--bs-secondary-color)}
.zy-hero-tile{margin-top:1rem}
/* Gaming hero: the two game images cropped to one size (Colin, 2026-10-28); the games band below shows them whole */
.zy-hero-crop{aspect-ratio:4/3;object-fit:cover}
@media (min-width:992px){.zy-hero-tile{position:absolute;right:0;bottom:0;width:50%;margin-top:0}}

/* ── Current page in the header menu (marked by the script after the menu in Template.htm) ── */
.zy-header .nav-link.active{color:var(--bs-heading-color);font-weight:800;box-shadow:inset 0 -2px 0 #ED7A1C}
.zy-header .dropdown-item.active,.zy-header .dropdown-item:active{background:var(--bs-tertiary-bg);color:var(--bs-body-color);box-shadow:inset 2px 0 0 #ED7A1C}
@media (max-width:991.98px){.zy-header .nav-link.active{box-shadow:inset 2px 0 0 #ED7A1C;padding-left:.75rem}}
/* With Contact in the menu (Colin, 2026-10-28) the one-line header is too wide just above the lg break: tighten it there */
@media (min-width:992px) and (max-width:1199.98px){.zy-header .navbar-nav .nav-link{--bs-navbar-nav-link-padding-x:.3rem;font-size:.875rem}.zy-header .zy-phone{font-size:.875rem}.zy-header-end{gap:.5rem}}

/* ── After review 2 (2026-10-27): the scrolling logo strip, case photo, staff portraits ── */
.zy-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.zy-marquee-track{width:max-content;animation:zy-marquee 40s linear infinite}
.zy-marquee:hover .zy-marquee-track{animation-play-state:paused}
.zy-marquee-item{flex:none;padding:.5rem 1.25rem;display:flex;align-items:center}
@keyframes zy-marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.zy-marquee-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}.zy-marquee-dup{display:none!important}.zy-marquee{-webkit-mask-image:none;mask-image:none}}
.zy-case-photo{aspect-ratio:16/10;object-fit:cover}
.zy-staff{object-fit:cover}

/* Live-system screens with a dark twin: .zy-shot sets display:block, so restate zynim.css's light/dark swap for it */
.zy-shot.zy-on-dark{display:none}
[data-bs-theme=dark] .zy-shot.zy-on-light,.zy-ground-dark .zy-shot.zy-on-light{display:none}
[data-bs-theme=dark] .zy-shot.zy-on-dark,.zy-ground-dark .zy-shot.zy-on-dark{display:block}
