/* Insights group: Perspectives index + article template. Page-specific only; everything else comes from site.css.
   Prefix .ins- (note: .ins-l / .ins-r are taken by the homepage insights section in site.css and are not reused here). */

/* ---- hero ---- */
.ins-hero .hero-main{padding-bottom:clamp(64px,7vw,112px)}
.ins-crumb{grid-column:1/-1;margin-bottom:clamp(28px,3vw,44px)}
.ins-crumb ol{display:flex;flex-wrap:wrap;gap:6px 0;font:500 12.5px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--on-3)}
.ins-crumb li{display:flex;align-items:center}
.ins-crumb li + li::before{content:"/";margin:0 12px;color:var(--on-3)}
.ins-crumb a{color:var(--on-2);text-decoration:none;display:inline-flex;align-items:center;min-height:32px;background:linear-gradient(currentColor,currentColor) 0 calc(100% - 6px)/0 1px no-repeat;transition:background-size .45s var(--ease),color .25s}
.ins-crumb a:hover{color:var(--on);background-size:100% 1px}
.ins-crumb [aria-current]{color:var(--on)}
.ins-eye{grid-column:1/-1;margin-bottom:24px;display:flex;flex-wrap:wrap;gap:8px 18px}
.ins-eye span + span{padding-left:18px;border-left:1px solid var(--rule-d2)}
.hero h1.ins-h1{grid-column:1/9;font-size:clamp(40px,4.9vw,74px);line-height:1.06;letter-spacing:-.028em}
.hero h1.ins-h1-x{grid-column:1/8}
.ins-hero .sub{grid-column:1/7;margin-top:clamp(28px,3.4vw,48px)}
.ins-meta{grid-column:1/7;margin:clamp(36px,4vw,56px) 0 0;display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:16px clamp(24px,3vw,44px);border-top:1px solid var(--rule-d2);padding-top:18px}
.ins-meta div{min-width:0}
.ins-meta dt{font:500 12.5px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--on-3)}
.ins-meta dd{margin:6px 0 0;font-size:15.5px;font-weight:500;color:var(--on)}
.ins-meta .ph{font-size:.92em}

/* ---- article frame ---- */
.ins-art{padding:clamp(72px,8vw,128px) 0 clamp(88px,10vw,160px)}
.ins-toc{grid-column:1/4}
.ins-toc .stick{position:sticky;top:100px}
.ins-toc nav{border-top:1px solid var(--ink);padding-top:18px}
.ins-toc ol{margin-top:14px;counter-reset:toc}
.ins-toc li{counter-increment:toc;border-bottom:1px solid var(--rule)}
.ins-toc nav a{display:grid;grid-template-columns:30px minmax(0,1fr);gap:8px;padding:10px 0;font-size:15px;line-height:1.4;color:var(--ink-2);text-decoration:none;transition:color .3s var(--ease)}
.ins-toc nav a::before{content:counter(toc,decimal-leading-zero);font:500 12.5px/1.75 var(--mono);color:var(--copper)}
.ins-toc nav a:hover{color:var(--copper)}
.ins-toc .side{margin-top:32px;border-top:1px solid var(--ink);padding-top:18px}
.ins-toc .side p:not(.mono){margin-top:10px;font-size:15px;color:var(--ink-2)}
.ins-toc .side .tl{margin-top:4px;font-size:15px}

.ins-body{grid-column:5/13;max-width:68ch;font-size:18.5px;line-height:1.72;color:var(--ink-2)}
.ins-body > * + *{margin-top:1.15em}
.ins-body > p:first-child{font-size:clamp(20px,1.6vw,23px);line-height:1.55;color:var(--ink)}
.ins-body h2{margin-top:2.6em;padding-top:28px;border-top:1px solid var(--ink);font:700 clamp(26px,2.5vw,36px)/1.18 var(--display);letter-spacing:-.014em;color:var(--ink);scroll-margin-top:100px}
.ins-body h2 .ins-n{display:block;margin-bottom:16px;font:500 12.5px/1 var(--mono);letter-spacing:.08em;color:var(--copper)}
.ins-body h3{margin-top:2em;font:700 clamp(20px,1.6vw,23px)/1.3 var(--display);letter-spacing:-.008em;color:var(--ink)}
.ins-body h2 + p,.ins-body h3 + p{margin-top:.8em}
.ins-body strong{font-weight:600;color:var(--ink)}
.ins-body em{font-style:italic}
.ins-body a{color:var(--copper);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .3s var(--ease)}
.ins-body a:hover{color:var(--ink)}

/* callouts for the source lists */
.ins-call{margin:2em 0 0;background:var(--paper);border-top:1px solid var(--ink);border-radius:0 0 var(--r) var(--r);padding:22px clamp(18px,2.4vw,30px) 14px;box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 30px 60px -48px rgba(16,26,21,.45)}
.ins-call > .mono{display:block;margin-bottom:6px;color:var(--copper)}
.ins-call li{position:relative;padding:13px 0 13px 30px;border-top:1px solid var(--rule);font-size:17px;line-height:1.6}
.ins-call li:first-child{border-top:0}
.ins-call ul li::before{content:"";position:absolute;left:2px;top:calc(13px + .82em);width:14px;height:1px;background:var(--copper)}
.ins-call.ck ul li::before{top:calc(13px + .42em);width:13px;height:13px;border:1px solid var(--copper);background:repeating-linear-gradient(45deg,transparent 0 3px,rgba(142,74,32,.3) 3px 4px);border-radius:1px}
.ins-call ol{counter-reset:st}
.ins-call ol li{counter-increment:st;padding-left:46px}
.ins-call ol li::before{content:counter(st);position:absolute;left:0;top:9px;font:700 italic 26px/1 var(--display);color:var(--copper)}

/* pull quote, the homepage .q at article scale */
.ins-pq{margin:2.4em 0 0;padding:34px 0 30px;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.ins-pq .q{font-size:clamp(26px,2.6vw,38px);line-height:1.2;color:var(--ink)}
.ins-pq figcaption{margin-top:20px}

/* engraved figures and structured tables */
.ins-fig{margin:2.6em 0 0}
.ins-fig .plate-in{padding-top:clamp(36px,3.4vw,46px)}
.ins-fig figcaption{margin-top:14px}
.ins-tbl-w{margin:2.4em 0 0;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
.ins-tbl{width:100%;min-width:560px;border-collapse:collapse;font-size:15.5px;line-height:1.5}
.ins-tbl caption{text-align:left;padding-bottom:14px;font:500 12.5px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--copper)}
.ins-tbl th,.ins-tbl td{text-align:left;vertical-align:top;padding:14px 18px 14px 0;border-bottom:1px solid var(--rule)}
.ins-tbl thead th{border-top:1px solid var(--ink);border-bottom:1px solid var(--rule-2);font:500 12.5px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.ins-tbl tbody th{font:700 17px/1.35 var(--display);color:var(--ink);width:24%}
.ins-tbl td{color:var(--ink-2)}

/* ---- related ---- */
.ins-rel{background:radial-gradient(1000px 560px at 100% 0%,var(--copper-tint) 0,transparent 60%),var(--bone-2)}
.ins-rel-h{grid-column:1/-1;margin-bottom:clamp(48px,5vw,80px)}
.ins-rel-h .mono{margin-bottom:18px}
.ins-rel-p{grid-column:1/6}
.ins-rel-a{grid-column:7/13}
.ins-rel-p > .mono,.ins-rel-a > .mono{display:block;margin-bottom:16px}
.ins-rel-p .pr{border-top:1px solid var(--ink);grid-template-columns:64px minmax(0,1fr) 44px}
.ins-rel-p .pr::before{background:var(--paper)}
.ins-rel-p .pr h3{font-size:clamp(26px,2.6vw,38px)}
.ins-rel-p .tl{margin-top:8px}
.ins-rel-a .ir{grid-template-columns:minmax(0,1fr) 44px}
.ins-rel-a .ir:first-of-type{border-top:1px solid var(--ink)}

/* ---- closing band (no form here; the form lives on company/contact.html) ---- */
.ins-close .close-l .cta{display:flex;flex-wrap:wrap;gap:16px}
.ins-close-r{grid-column:8/13;align-self:end}
.ins-close-r .next{margin-top:0}
.ins-close .close-ph::after{background:linear-gradient(90deg,rgba(10,29,23,.96) 0%,rgba(10,29,23,.9) 45%,rgba(10,29,23,.84) 100%),linear-gradient(180deg,var(--night) 0,rgba(10,29,23,0) 25%,rgba(10,29,23,0) 80%,var(--night) 100%)}

/* ---- index: featured ---- */
.ins-feat-fig{grid-column:1/8}
.ins-feat-fig .plate-in{padding-top:clamp(36px,3.4vw,46px)}
.ins-feat-t{grid-column:8/13;align-self:center;padding-left:clamp(0px,1.5vw,24px)}
.ins-feat-t .mono{margin-bottom:20px}
.ins-feat-t h2 a{color:inherit;text-decoration:none;transition:color .3s var(--ease)}
.ins-feat-t h2 a:hover{color:var(--copper)}
.ins-feat-t .lede{margin-top:22px}
.ins-feat-t .tl{margin-top:22px}
.ins-feat-t .ins-meta{margin-top:28px;border-top-color:var(--rule-2);grid-template-columns:repeat(3,auto)}
.ins-feat-t .ins-meta dt{color:var(--ink-3)}
.ins-feat-t .ins-meta dd{color:var(--ink)}
.ins-sec-n{display:block;margin-bottom:22px;font:500 12.5px/1 var(--mono);letter-spacing:.08em;color:var(--copper)}

/* ---- index: editorial list ---- */
.ins-list-sec{background:radial-gradient(1000px 560px at 0% 0%,var(--copper-tint) 0,transparent 60%),var(--bone-2)}
.ins-list-h{grid-column:1/9;margin-bottom:clamp(48px,5vw,88px)}
.ins-list-h .lede{margin-top:24px}
.ins-list{grid-column:1/-1;border-top:1px solid var(--ink)}
.ins-row{display:grid;grid-template-columns:44px 150px minmax(0,1fr) 120px 44px;gap:clamp(16px,2vw,32px);align-items:start;padding:34px 0;border-bottom:1px solid var(--rule);text-decoration:none;color:inherit;position:relative;isolation:isolate}
.ins-row::before{content:"";position:absolute;left:-16px;right:-16px;top:0;bottom:-1px;background:var(--paper);opacity:0;transition:opacity .45s var(--ease);z-index:-1}
.ins-row:hover::before,.ins-row:focus-visible::before{opacity:1}
.ins-row .ix{font:400 italic 22px/1 var(--display);color:var(--copper);padding-top:6px}
.ins-row .dt{padding-top:8px}
.ins-row .cat{display:block;margin-bottom:12px;color:var(--copper)}
.ins-row h3{font:700 clamp(24px,2.4vw,34px)/1.14 var(--display);letter-spacing:-.016em;transition:color .3s var(--ease)}
.ins-row:hover h3,.ins-row:focus-visible h3{color:var(--copper)}
.ins-row p{margin-top:12px;max-width:62ch;font-size:16px;color:var(--ink-2)}
.ins-row .rt{padding-top:8px;text-align:right}
.ins-row .ar{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--rule-2);border-radius:var(--r);transition:background-color .4s var(--ease),color .4s,border-color .4s}
.ins-row .ar svg{width:16px;height:16px}
.ins-row:hover .ar,.ins-row:focus-visible .ar{background:var(--ink);color:var(--on);border-color:var(--ink)}

/* ---- index: provenance note with photograph ---- */
.ins-note-ph{grid-column:1/7;aspect-ratio:4/3}
.ins-note-t{grid-column:8/13;align-self:center}
.ins-note-t .d3{margin-bottom:22px}
.ins-note-t .terms{margin-top:32px}
.ins-note-t .terms div{border-top-color:var(--rule-2)}
.ins-note-t .terms b{color:var(--ink)}
.ins-note-t .terms span{color:var(--ink-2)}
.ins-note-t .tl{margin-top:20px}

/* ---- responsive ---- */
@media (max-width:1080px){
  .ins-toc{grid-column:1/-1;margin-bottom:56px}
  .ins-toc .stick{position:static}
  .ins-toc ol{columns:2;column-gap:32px}
  .ins-toc li{break-inside:avoid}
  .ins-body{grid-column:1/-1;margin-inline:auto;width:100%}
  .ins-row{grid-template-columns:40px 130px minmax(0,1fr) 44px}
  .ins-row .rt{display:none}
}
@media (max-width:900px){
  .hero h1.ins-h1,.hero h1.ins-h1-x,.ins-hero .sub,.ins-meta{grid-column:1/-1}
  .ins-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ins-rel-p,.ins-rel-a,.ins-feat-fig,.ins-feat-t,.ins-list-h,.ins-note-ph,.ins-note-t,.ins-close-r{grid-column:1/-1}
  .ins-rel-a{margin-top:56px}
  .ins-feat-t{margin-top:40px;padding-left:0}
  .ins-note-t{margin-top:40px}
  .ins-close-r{margin-top:56px}
  .ins-row{grid-template-columns:36px minmax(0,1fr) 44px;row-gap:8px}
  .ins-row .dt{grid-column:2;grid-row:1;padding-top:4px}
  .ins-row .ix{grid-row:1/3}
  .ins-row > div{grid-column:2}
  .ins-row .ar{grid-column:3;grid-row:1/3;align-self:center}
}
@media (max-width:560px){
  .ins-crumb li:last-child{display:none}
  .ins-crumb li:nth-last-child(2)::after{content:"/";margin-left:12px;color:var(--on-3)}
  .ins-toc ol{columns:1}
  .ins-body{font-size:17.5px}
  .ins-call li{font-size:16.5px}
  .ins-pq .q{text-indent:0}
  .ins-meta{grid-template-columns:1fr 1fr;gap:14px 20px}
  .ins-feat-t .ins-meta{grid-template-columns:1fr 1fr}
  .ins-close .close-l .cta .btn{width:100%;justify-content:space-between}
  .ins-row{grid-template-columns:minmax(0,1fr)}
  .ins-row .ix,.ins-row .ar{display:none}
  .ins-row .dt,.ins-row > div{grid-column:1;grid-row:auto}
  .ins-rel-p .pr{grid-template-columns:48px minmax(0,1fr)}
  .ins-rel-p .pr .ar{display:none}
  .ins-fig .eng text.sub,.ins-feat-fig .eng text.sub{display:none}
}