/* =====================================================================
   Monuments, shine, Instagram cards and the opening line art.
   Managed in Admin → Website → Monuments & shine / Opening animation / Instagram.
   ===================================================================== */

/* ---------- the metals: gold reads best on the dark look, silver on the light one ---------- */
:root,[data-metal=gold]{--m1:#8a6624;--m2:#f6dc95;--m3:#c99a3d;--m4:#fff4cf;--sheen:255,236,180}
[data-metal=silver]{--m1:#7c8496;--m2:#eef1f6;--m3:#a7aebd;--m4:#ffffff;--sheen:235,240,255}
[data-theme=light][data-metal=auto],[data-theme=light][data-metal=silver]{--m1:#3f4654;--m2:#8a93a5;--m3:#565e6e;--m4:#b9c1ce;--sheen:255,255,255}
[data-theme=light] .mon-l{stroke-width:1.45}
[data-theme=light][data-metal=gold]{--m1:#7a5714;--m2:#c99a3b;--m3:#9c7424;--m4:#e8c977;--sheen:255,248,220}

/* ---------- a drawing ---------- */
.mon{display:block;width:100%;height:auto;overflow:visible}
.mon path{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.mon-l{stroke:url(#mg-metal);stroke-width:1.3}
.mon-s{stroke:url(#mg-shine);stroke-width:2;opacity:0}
.lux-shine .mon-s{opacity:.9}
html:not(.lux-mon) .tm-mon,html:not(.lux-mon) .tt-mon,html:not(.lux-mon) .mon-frieze{display:none}

/* team page: the state's monument stands beside the team name */
.tm-hero{isolation:isolate}
.tm-mon{position:absolute;z-index:0;right:max(var(--gutter,24px),calc((100vw - var(--maxw,1320px)) / 2));bottom:30px;margin:0;width:min(28vw,400px);pointer-events:none;}
.tm-mon .mon-l{stroke-width:1.5}
.tm-mon figcaption{position:absolute;right:0;bottom:-20px;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--m3);opacity:.9}
.tm-hero-in{position:relative;z-index:1}
@media (max-width:860px){.tm-hero{display:flex;flex-direction:column}.tm-hero-in{width:100%}.tm-mon{order:2;position:relative;right:auto;bottom:auto;margin:22px auto 0;width:min(74%,320px)}.tm-mon figcaption{position:static;text-align:center;margin-top:8px}}

/* team cards: a faint drawing at the foot of each card */
.tt{isolation:isolate}
.lux-mon .tt{padding-bottom:78px}
.tt-mon{position:absolute;z-index:-1;left:18%;right:18%;bottom:12px;opacity:.6;pointer-events:none;transition:opacity .5s,transform .8s var(--ease)}
.tt:hover .tt-mon{transform:translateY(-3px)}
.tt-mon .mon{height:54px}
.tt:hover .tt-mon{opacity:1}
@media (max-width:560px){.lux-mon .tt{padding-bottom:62px}.tt-mon{left:12%;right:12%;bottom:8px}.tt-mon .mon{height:44px}}

/* footer: a row of monuments standing on the footer line */
.mon-frieze{display:flex;justify-content:center;align-items:flex-end;gap:clamp(4px,1.4vw,22px);width:min(100% - 2 * var(--gutter,24px),var(--maxw,1320px));margin:0 auto clamp(20px,4vw,40px);opacity:.85;pointer-events:none}
.mon-frieze .mon{flex:1 1 0;min-width:0;max-width:150px}
@media (max-width:640px){.mon-frieze .mon:nth-child(n+6){display:none}}

/* ---------- shine on the buttons: a soft glint passes now and then ---------- */
.lux-btn .btn:not(.live-btn)::after{content:"";position:absolute;inset:-1px;z-index:2;pointer-events:none;border-radius:inherit;
  background:linear-gradient(105deg,transparent 38%,rgba(var(--sheen),.55) 50%,transparent 62%);background-size:250% 100%;background-position:130% 0;
  animation:lux-glint var(--shine-s,6s) ease-in-out infinite}
.lux-btn .btn:not(.live-btn):hover::after{animation-duration:1.2s}
@keyframes lux-glint{0%,55%{background-position:130% 0}100%{background-position:-30% 0}}
/* a fine metal edge on the outline buttons */
.lux-btn .btn:not(.solid):not(.grad):not(.live-btn):not(.live-btn-inline){border-color:color-mix(in srgb,var(--m3) 55%,transparent)}
.lux-btn .btn.solid,.lux-btn .btn.grad{outline:1px solid color-mix(in srgb,var(--m2) 45%,transparent);outline-offset:2px}
.lux-btn .nav-right .btn.solid,.lux-btn .nav-right .btn.grad{outline-offset:1px}
@media (prefers-reduced-motion:reduce){.lux-btn .btn::after{animation:none;display:none}}

/* ---------- Instagram: Instagram's own post cards, side by side ---------- */
.igh-g{display:block}
.igh-g .ig-g{margin-bottom:14px}
.ig-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(min(86vw,300px),340px);gap:clamp(12px,2vw,20px);overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;justify-content:safe center;scrollbar-width:thin}
.ig-c{position:relative;scroll-snap-align:center;display:grid;gap:8px;align-content:start;animation:rise .8s var(--ease) both;animation-delay:var(--d,0s)}
.ig-f{display:block;width:100%;height:520px;border:0;border-radius:14px;background:#fff;box-shadow:0 0 0 1px color-mix(in srgb,var(--m3) 40%,transparent),0 20px 50px -30px rgba(0,0,0,.8)}
.ig-open{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:.78rem;letter-spacing:.06em;color:var(--ink2);text-decoration:none;padding:6px}
.ig-open svg{width:16px;height:16px}
.ig-open:hover{color:var(--hi)}

/* ---------- small neatness fixes ---------- */
.nav-pill{box-shadow:none!important;height:2px}
.nav.solid .nav-in{background:rgba(var(--sh),.94)}
[data-theme=light] .nav.solid .nav-in{background:rgba(250,249,254,.95)}
html,body{overflow-x:clip}
.sec-head{align-items:end}
/* optical centring: the ISCL mark carries a ™ on its right, so the word itself sat left of centre;
   wide-spaced capitals carry a trailing space that pushed centred labels left */
.hero-mark .hero-logo{translate:5.5% 0}
.hero-eyebrow{padding-left:.32em}
.cd-title{padding-left:.34em}
.cd small{padding-left:.3em}
@media (max-width:520px){.cd small{padding-left:.18em}}
.kicker[style*="center"],.sec-head.center .kicker{padding-left:.3em}