/* =====================================================================================================
   PHOTO BANDS, PORTRAITS AND DOCUMENT COVERS (Structure B, stage S3, 15 Oct 2026). Drawn by public/tools/pictures.js.

   A separate file from brand.css on purpose: the brand sheet promises "no gradients", and a band needs ONE navy shade where white
   text sits on a photograph. That shade (figure.band[data-band]::after) is the only gradient here, and it is tuned so the white title and the
   small caption clear 4.5:1 against the photograph at every height (the shade is 84 to 93 per cent navy behind the words and
   clears to nothing at the top, so the picture still shows).

   Rollback: delete the one <link> to this file and the #sk-bandslot line; nothing else depends on it.
   ===================================================================================================== */

/* the slot: full width of the content area, outside every view */
#sk-bandslot{margin:-22px -24px 22px;padding:0}
#sk-bandslot[hidden]{display:none!important}
figure.band[data-band]{position:relative;margin:0;height:200px;overflow:hidden;background:#131b2d;color:#fff}
figure.band[data-band].hero{height:200px}
figure.band[data-band]>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block}
figure.band[data-band].cycle>img{opacity:0;transition:opacity 1.6s ease}
figure.band[data-band].cycle>img.on{opacity:1}
@media (prefers-reduced-motion:reduce){figure.band[data-band].cycle>img{transition:none}}
figure.band[data-band]::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(19,27,45,.9) 0%,rgba(19,27,45,.84) 55%,rgba(19,27,45,0) 100%);pointer-events:none}
.band-wrap{position:absolute;z-index:2;left:0;right:0;bottom:0;max-width:1408px;margin:0 auto;padding:0 24px 20px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px}
html[data-theme="light"] figure.band[data-band] .sk-label{margin:0;font:500 11px/1.2 var(--b-sans,Jost,sans-serif);letter-spacing:.16em;text-transform:uppercase;color:#e3bfbe}
html[data-theme="light"] figure.band[data-band] h1{margin:6px 0 0;font:500 50px/1.04 var(--b-display,'Cormorant Garamond',Garamond,serif);letter-spacing:0;color:#fff}
html[data-theme="light"] .band-sub{margin:6px 0 0;font:400 17px/1.5 var(--b-text,'EB Garamond',Georgia,serif);color:rgba(255,255,255,.92)}
figure.band[data-band] figcaption{flex:none;max-width:42%;display:flex;flex-direction:column;align-items:flex-end;text-align:right;font:italic 400 12px/1.4 var(--b-text,'EB Garamond',Georgia,serif);color:rgba(255,255,255,.88)}
.bctl{display:inline-flex;gap:14px}
html[data-theme="light"] .band-change{appearance:none;background:none;border:0;border-radius:0!important;cursor:pointer;font:400 12px/1 var(--b-sans,Jost,sans-serif);letter-spacing:.02em;color:#fff;text-decoration:underline;text-underline-offset:3px;min-height:44px;padding:0 2px;display:inline-flex;align-items:center;white-space:nowrap}
html[data-theme="light"] .band-change:focus-visible{outline:2px solid #e3bfbe;outline-offset:2px}

/* the page's own heading, hidden when the band says the same (sk-dup), or just its words when it also holds buttons (sk-part) */
.page-head.sk-dup{display:none!important}
.page-head.sk-part>.eyebrow-row,.page-head.sk-part>h1,.page-head.sk-part>.headline,.page-head.sk-part>p{display:none!important}

@media (max-width:640px){
  figure.band[data-band]{height:160px}figure.band[data-band].hero{height:160px}
  figure.band[data-band]::after{background:linear-gradient(to top,rgba(19,27,45,.93) 0%,rgba(19,27,45,.88) 66%,rgba(19,27,45,0) 100%)}
  .band-wrap{padding:0 16px 6px;flex-direction:column;align-items:flex-start;gap:0}
  html[data-theme="light"] figure.band[data-band] h1{font-size:36px}
  html[data-theme="light"] .band-sub{font-size:15px}
  figure.band[data-band] figcaption{max-width:100%;flex-direction:row;align-items:center;gap:14px;text-align:left}
}

/* portraits: a circle, wherever a person has one (the initials stay where there is none) */
.sk-pp{display:inline-block;width:20px;height:20px;border-radius:50%!important;object-fit:cover;flex:none;vertical-align:middle;margin-right:6px}
.tb-chip .sk-pp,.tk-chip .sk-pp{margin-left:-4px;margin-right:6px}
.hxc-act .sk-pp{width:14px;height:14px;margin-right:4px}
.tb-colhead .av.has-pp{background:none;padding:0;overflow:hidden}
.tb-colhead .av.has-pp .sk-pp{width:100%;height:100%;margin:0}

/* mini document covers: a page with a photograph, the Seeker mark and the title */
.dcov{position:relative;display:inline-block;flex:none;width:var(--w,44px);aspect-ratio:1/1.414;background:#fff;border:1px solid rgba(19,27,45,.13);overflow:hidden;vertical-align:middle}
.dc-ph{position:absolute;left:0;top:0;width:100%;height:55%;object-fit:cover;display:block}
.dc-mono{position:absolute;left:8%;top:60%;width:11%;height:auto}
.dc-t{position:absolute;left:8%;right:8%;bottom:7%;display:block;overflow:hidden;max-height:34%;font:500 calc(var(--w,44px)*.085)/1.12 var(--b-display,'Cormorant Garamond',Garamond,serif);color:#131b2d}
.dcov.lg .dc-t{font-size:calc(var(--w,44px)*.075)}
#view-marketing .mk-th .dcov{display:block;margin:0 auto}
#view-dataroom .dr-drow .dcov{align-self:center}
#view-dataroom .dr-dnc{display:flex;align-items:center;gap:12px;min-width:0}
#view-dataroom .dr-dnc .dcov{flex:none}
/* the mandate page's own dark bar keeps its buttons and its type line; its name is now the band's title */
.content:has(#sk-bandslot:not([hidden])) #mandate-dashboard .m-hero .m-hero-id{display:none}

/* The hero carries the greeting and the date, so the news strip under it keeps only the headlines (15/10). */
html[data-theme="light"] body:has(#sk-bandslot figure.band[data-band].hero) .rk-ticker .k{display:none}

/* ── The sign-in page (15 Oct 2026, Ava's version A, background 1: river mist at dawn) ── */
#login-gate.skl{background:var(--b-navy);flex-direction:column;align-items:stretch;justify-content:center;min-height:100%}
#login-gate .skl-bg{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;object-position:75% 50%;z-index:0}
#login-gate.skl::before{content:"";position:fixed;inset:0;z-index:1;background:linear-gradient(90deg,rgba(19,27,45,.88) 0%,rgba(19,27,45,.55) 48%,rgba(19,27,45,.12) 100%)}
#login-gate .skl-wrap{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,440px);gap:40px;align-items:center;max-width:1240px;width:100%;margin:auto;padding:56px 40px;box-sizing:border-box}
#login-gate .skl-intro{color:#fff;align-self:end;padding-bottom:20px}
#login-gate .skl-logo{width:220px;max-width:100%;height:auto;display:block;margin-bottom:56px}
#login-gate .skl-lbl{font:500 11px/1.4 var(--b-sans);letter-spacing:.22em;text-transform:uppercase;color:var(--b-rose-soft);margin:0}
#login-gate .skl-h{font:500 clamp(42px,6vw,72px)/1.02 var(--b-display);color:#fff;margin:14px 0 16px;letter-spacing:0}
#login-gate .skl-h em{font-style:italic;color:var(--b-rose-soft)}
#login-gate .skl-sub{font:400 19px/1.55 var(--b-text);color:rgba(255,255,255,.88);margin:0;max-width:38ch}
#login-gate .skl-panel{--cream:var(--b-body);--slate:var(--b-muted);--red:var(--b-oxblood);background:#fff;padding:40px 38px 32px;border:0;border-radius:0;box-shadow:none}
#login-gate .skl-lbl2{color:var(--b-rose-deep)}
#login-gate .skl-title{font:500 30px/1.15 var(--b-display);color:var(--b-navy);margin:8px 0 6px}
#login-gate .skl-panel [style*="font-size:15px"][style*="font-weight:600"]{font:500 30px/1.15 var(--b-display)!important;color:var(--b-navy)!important;margin:8px 0 6px!important}
#login-gate .skl-panel [style*="color:var(--cream)"]{font-family:var(--b-text)!important;font-size:17px!important;line-height:1.5!important}
#login-gate .skl-panel .form-label{font:500 10.5px/1.4 var(--b-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--b-muted)}
#login-gate .skl-panel .form-input{font:400 16px/1.4 var(--b-sans);color:var(--b-navy);background:#fff;border:1px solid var(--b-field,#868e9c);border-radius:0;padding:12px 14px;min-height:48px;box-shadow:none}
#login-gate .skl-panel .form-input:focus{outline:2px solid var(--b-navy);outline-offset:2px}
#login-gate .skl-panel .btn-gold{background:var(--b-navy)!important;color:#fff!important;border:0!important;border-radius:999px!important;font:500 14px/1 var(--b-sans)!important;letter-spacing:.06em;min-height:48px;padding:15px 22px!important}
#login-gate .skl-panel .btn-ghost{color:var(--b-oxblood)!important;background:none!important;border:0!important;text-decoration:underline;text-underline-offset:3px;padding:8px 0!important;min-height:44px}
#login-gate .skl-panel ol{font-family:var(--b-text)!important;font-size:15px!important;color:var(--b-body)!important}
#login-gate .skl-panel #login-setup-qr{border:1px solid var(--b-rule);border-radius:0!important}
#login-gate .skl-panel code{font:500 13px/1.4 var(--b-sans);letter-spacing:.1em;color:var(--b-navy);background:var(--b-mist);padding:6px 8px;display:inline-block}
#login-gate .skl-foot{position:fixed;z-index:2;left:40px;bottom:16px;font:500 10px/1.4 var(--b-sans);letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.7)}
#login-gate .skl-cap{position:fixed;z-index:2;right:24px;bottom:16px;font:italic 400 12px/1.4 var(--b-text);color:rgba(255,255,255,.8)}
@media (max-width:860px){
  #login-gate .skl-wrap{grid-template-columns:1fr;gap:24px;padding:28px 16px 64px;margin:0 auto}
  #login-gate .skl-intro{align-self:auto;padding:0}
  #login-gate .skl-logo{margin-bottom:24px;width:170px}
  #login-gate .skl-h{font-size:40px;margin:10px 0 8px}
  #login-gate .skl-sub{font-size:16px}
  #login-gate .skl-panel{padding:28px 22px}
  #login-gate .skl-foot{position:static;margin:0 16px 12px;z-index:2}
  #login-gate .skl-cap{display:none}
}

/* Ava 15/10: no details on the bands - no caption, no Change picture, no Pause or Next picture on Home. The photograph only. */
figure.band[data-band] figcaption{display:none!important}
/* The news strip inside the Home hero (Ava 15/10): white on the photograph, no box, under the greeting. */
html[data-theme="light"] #sk-bandslot .rk-ticker.in-hero{background:none!important;border-radius:0!important;border:0!important;box-shadow:none!important;margin:10px 0 0!important;padding:0!important;max-width:820px;min-height:0;gap:14px;align-items:center}
html[data-theme="light"] #sk-bandslot .rk-ticker.in-hero .k{display:none!important}
html[data-theme="light"] #sk-bandslot .rk-ticker.in-hero .items b{font:400 13px/1.4 var(--b-sans,Jost,sans-serif)!important;color:rgba(255,255,255,.9)!important}
html[data-theme="light"] #sk-bandslot .rk-ticker.in-hero .arw{border:1px solid rgba(255,255,255,.55);color:#fff;width:30px;height:30px;flex:none;display:inline-flex;align-items:center;justify-content:center}
html[data-theme="light"] #sk-bandslot .rk-ticker.in-hero .arw svg{width:15px;height:15px;stroke:#fff}
figure.band[data-band].hero .band-wrap{align-items:flex-end}
figure.band[data-band].hero .band-txt{flex:1;min-width:0}
/* Ava 15/10: the news strip runs the full width of the hero; the "Nothing is due today" line goes, its space stays empty. */
html[data-theme="light"] #sk-bandslot .rk-ticker.in-hero{max-width:none!important;width:100%}
figure.band[data-band].hero .band-sub{visibility:hidden}
