/* Figures for "What AI can now do for your most important customers".
   The figure shell comes from /essays/eth/figures.css. Uses the site tokens from Base.astro. */
.sc-fig button{font-family:'Inter',sans-serif;cursor:pointer;}
.sc-fig button:focus-visible{outline:2px solid var(--mark);outline-offset:2px;}
.sc-out{font-family:'Inter',sans-serif;font-size:14px;line-height:1.5;padding:12px 14px;border:1px solid var(--ink);border-radius:8px;background:var(--eth-card);margin:0;}
.sc-out b{font-weight:600;}
.sc-tog{display:flex;flex-wrap:wrap;gap:6px;}
.sc-tog button{font-size:13px;padding:6px 11px;border-radius:6px;border:1px solid var(--hair);background:none;color:var(--ink);}
.sc-tog button:hover{border-color:var(--ink);}
.sc-tog button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper);}

/* Figure 1 */
.sc-bars{display:flex;flex-direction:column;gap:12px;font-family:'Inter',sans-serif;font-size:13px;}
.sc-row{display:grid;grid-template-columns:104px 1fr 132px;gap:12px;align-items:center;}
.sc-lab{font-weight:600;}
.sc-track{display:block;height:22px;border-radius:4px;background:var(--eth-card);border:1px solid var(--hair);overflow:hidden;}
.sc-fill{display:block;height:100%;background:var(--ink);transition:width 1.1s cubic-bezier(.2,.8,.2,1);}
.sc-row:nth-child(2) .sc-fill{background:var(--mark);box-shadow:inset 0 0 0 1px var(--ink);}
.sc-val{font-variant-numeric:tabular-nums;color:var(--quiet);}
.sc-scale{position:relative;display:block;height:18px;border-top:1px solid var(--ink);font-size:11.5px;color:var(--quiet);}
.sc-scale span{position:absolute;top:4px;white-space:nowrap;}
.sc-scale span::before{content:"";position:absolute;left:0;top:-4px;height:4px;border-left:1px solid var(--ink);}
.sc-scale span.end::before{left:auto;right:0;}

/* Figure 2 */
.sc-ages{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;}
.sc-ages button{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:10px 10px 12px;min-height:74px;border:1px solid var(--hair);border-radius:6px;background:none;color:var(--ink);text-align:left;}
.sc-ages button:hover{border-color:var(--ink);}
.sc-ages button[aria-pressed="true"]{border-color:var(--ink);background:var(--eth-card);}
.sc-age-n{font-size:11px;font-weight:600;color:var(--quiet);}
.sc-age-t{font-family:'Fraunces Variable',Georgia,serif;font-size:17px;font-weight:500;line-height:1.15;}
.sc-here{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 5px;border-radius:3px;background:var(--mark);color:#1a1a17;}
.sc-panel{font-family:'Inter',sans-serif;font-size:14px;line-height:1.55;padding:12px 14px;border:1px solid var(--ink);border-radius:8px;background:var(--eth-card);margin:0;min-height:112px;}
.sc-panel b{font-weight:600;}
.sc-kam{display:block;margin-top:8px;}

/* Figure 3 */
.sc-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.sc-col{border:1px solid var(--hair);border-radius:6px;padding:10px 12px 12px;min-height:214px;}
.sc-colh{font-family:'Inter',sans-serif;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--quiet);margin:0 0 8px;}
article .sc-col ul,.sc-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
article .sc-col li,.sc-col li{margin:0;padding:7px 9px;border:1px solid var(--hair);border-radius:5px;font-family:'Inter',sans-serif;font-size:12.5px;line-height:1.4;color:var(--ink);}
.sc-col li b{font-weight:600;}
.sc-col li.in{animation:sc-in .45s ease-out;}
.sc-col[data-c="pages"] li{display:flex;justify-content:space-between;align-items:baseline;gap:8px;transition:background-color .3s,border-color .3s;}
.sc-upd{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#1a1a17;background:var(--mark);padding:1px 5px;border-radius:3px;opacity:0;transition:opacity .3s;white-space:nowrap;}
.sc-col[data-c="pages"] li.on{border-color:var(--ink);background:var(--eth-card);}
.sc-col[data-c="pages"] li.on .sc-upd{opacity:1;}
.sc-col[data-c="note"] li{border-style:dashed;border-color:var(--quiet);}
.sc-col[data-c="note"] li.flag{border-style:solid;border-color:var(--ink);background:var(--mark);color:#1a1a17;font-weight:500;}
.sc-schema{font-family:'Inter',sans-serif;font-size:13px;line-height:1.5;margin:0;padding:9px 12px;border:1px dashed var(--ink);border-radius:6px;}
.sc-schema b{font-weight:600;}
@keyframes sc-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Figure 4 */
.sc-map{display:flex;flex-direction:column;font-family:'Inter',sans-serif;font-size:13.5px;border-top:1px solid var(--ink);}
.sc-mr{display:grid;grid-template-columns:minmax(0,190px) 1fr;gap:12px;align-items:center;padding:9px 8px;border-bottom:1px solid var(--hair);min-height:44px;transition:background-color .3s;}
.sc-mr.flag{background:var(--eth-card);}
.sc-mn{font-weight:600;}
.sc-mv{display:flex;align-items:center;gap:9px;line-height:1.4;}
.sc-dots{display:inline-flex;gap:4px;flex:0 0 auto;}
.sc-dots i{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--ink);}
.sc-dots i.on{background:var(--ink);}
.sc-chip{flex:0 0 auto;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 6px;border-radius:3px;background:var(--mark);color:#1a1a17;}

/* Figure 5 */
article .sc-prop,.sc-prop{margin:0;padding:12px 14px;border:1px solid var(--hair);border-radius:6px;font-size:16px;line-height:1.5;font-style:normal;color:var(--ink);}
.sc-dl{display:grid;grid-template-columns:minmax(0,150px) 1fr;gap:0;margin:0;font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.5;border-top:1px solid var(--ink);min-height:236px;align-content:start;}
.sc-dl dt,.sc-dl dd{margin:0;padding:8px 8px;border-bottom:1px solid var(--hair);}
.sc-dl dt{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--quiet);padding-top:10px;}

/* Figure 6 */
.sc-quote{margin:0;padding:14px 16px;border:1px solid var(--ink);border-radius:8px;background:var(--eth-card);font-size:17px;line-height:1.55;min-height:148px;}
.sc-quote mark{background:var(--mark);color:#1a1a17;padding:1px 3px;border-radius:3px;}
.sc-note{font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.5;color:var(--quiet);margin:0;min-height:40px;}

/* Figure 7 */
.sc-claims{display:flex;flex-direction:column;gap:8px;}
.sc-claim{display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%;padding:11px 13px;border:1px solid var(--hair);border-radius:6px;background:none;color:var(--ink);text-align:left;min-height:86px;transition:border-color .3s,background-color .3s;}
.sc-claim:hover{border-color:var(--ink);}
.sc-claim.on{border-color:var(--ink);background:var(--eth-card);}
.sc-ct{font-family:'Fraunces Variable',Georgia,serif;font-size:16px;line-height:1.45;}
.sc-cc{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:11.5px;}
.sc-chk{padding:2px 7px;border-radius:3px;border:1px solid var(--hair);color:var(--quiet);}
.sc-chk i{font-style:normal;font-weight:700;}
.sc-chk.ok{border-color:var(--ink);color:var(--ink);}
.sc-ver{font-weight:700;letter-spacing:.05em;text-transform:uppercase;font-size:10.5px;color:var(--quiet);margin-left:2px;}
.sc-claim.on .sc-ver{background:var(--mark);color:#1a1a17;padding:2px 6px;border-radius:3px;}

@media (max-width:600px){
  .sc-row{grid-template-columns:1fr auto;gap:4px 10px;}
  .sc-row .sc-track,.sc-row .sc-scale{grid-column:1/-1;grid-row:2;}
  .sc-axis .sc-lab,.sc-axis .sc-val{display:none;}
  .sc-val{text-align:right;}
  .sc-ages{grid-template-columns:1fr 1fr;}
  .sc-ages button{min-height:0;}
  .sc-flow{grid-template-columns:1fr;}
  .sc-col{min-height:0;}
  .sc-mr{grid-template-columns:1fr;gap:4px;}
  .sc-dl{grid-template-columns:1fr;min-height:0;}
  .sc-dl dt{border-bottom:none;padding-bottom:0;}
  .sc-dl dd{padding-top:2px;}
}
@media (prefers-reduced-motion:reduce){.sc-fig *{transition:none!important;animation:none!important;}}
@media print{.sc-tog button[aria-pressed="false"]{display:none;}}
