.promises{background:var(--paper)}
.promises__header{margin-bottom:18px}
.promises__title{font-size:clamp(24px,6vw,28px);line-height:1.45}
.promises__title em{
  display:inline-block;
  padding:0 .05em;
  color:#f6d775;
  font-family:"Avenir Next",Rounded,sans-serif;
  font-size:1.28em;
  font-style:normal;
  font-weight:900;
  -webkit-text-stroke:1px var(--ink);
  paint-order:stroke fill;
}
.promise-tabs{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:6px;
  margin-bottom:14px;
}
.promise-tabs button{
  min-width:0;
  min-height:48px;
  padding:5px 0;
  border:1px solid #b8a68c;
  border-radius: 8px;
  background:var(--white);
  color:var(--ink);
  font:900 16px/1 "Avenir Next",Rounded,sans-serif;
  cursor:pointer;
}
.promise-tabs button[aria-selected="true"]{
  border-color:var(--red);
  background:var(--red);
  color:var(--white);
  box-shadow:0 3px #6e2922;
}
.promise-tabs button:focus-visible{outline:3px solid var(--data);outline-offset:3px}
.promise-panel{
  padding:clamp(14px,4vw,20px);
  border:1.5px solid #a78d72;
  border-radius: 14px;
  background:#fffdf6;
  box-shadow:2px 3px #e5d7c6;
}
.promise-panel[hidden]{display:none}
.promise-visual{
  display:grid;
  place-items:center;
  min-height:128px;
  margin-bottom:18px;
  padding:14px;
  overflow:hidden;
  border:1px solid #ead9c5;
  border-radius: 14px;
  background:var(--white);
}
.promise-visual__inner{width:min(100%,290px)}
.promise-visual__label{margin:0 0 9px;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.04em}
.promise-checks,.promise-broker{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
}
.promise-checks span,.promise-broker span{
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
  padding:6px;
  border:1px solid var(--line);
  border-radius: 8px;
  background:#fbf3e4;
  font-size:11px;
  font-weight:800;
  line-height:1.35;
}
.promise-checks span::before{
  content:"✓";
  display:grid;
  place-items:center;
  width:16px;
  height:16px;
  flex:none;
  border:1.5px solid var(--red);
  border-radius: 8px;
  color:var(--red);
}
.promise-checks span,.promise-broker span{animation-delay:calc(var(--step) * .35s)}
.promise-comparison{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.promise-comparison div{
  padding:10px;
  border:1px solid #bed2cf;
  border-radius: 8px;
  background:#e6f2ef;
  font-size:11px;
  font-weight:800;
}
.promise-comparison span{display:block;margin-top:7px;height:7px;border-radius: 8px;background:#87b5ae}
.promise-comparison div:nth-child(2){background:#f7e6d8;border-color:#e1c4ac}
.promise-comparison div:nth-child(2) span{background:#d0a884}
.promise-chart{display:block;width:100%;height:auto}
.promise-chart .chart-grid{stroke:#ded5ca;stroke-width:1}
.promise-chart .chart-line{fill:none;stroke:var(--data);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.promise-chart .chart-dd{fill:none;stroke:var(--red);stroke-width:2;stroke-dasharray:4 3}
.promise-chart text{fill:var(--muted);font:800 10px Rounded,sans-serif}
.promise-broker{grid-template-columns:repeat(3,minmax(0,1fr))}
.promise-broker span{justify-content:center;padding:7px 2px;text-align:center}
.promise-profit{display:grid;gap:8px}
.promise-profit div{display:grid;grid-template-columns:80px 1fr;align-items:center;gap:8px;font-size:11px;font-weight:800}
.promise-profit b{display:block;min-width:0;padding:5px 7px;border-radius: 8px;background:#e8f2ef;color:var(--data);font-size:12px;white-space:nowrap}
.promise-profit div:last-child b{background:#f7e3b3;color:#6b4c1f}
.promise-visual__note{margin:7px 0 0;color:var(--muted);font-size:10px}
.promise-panel__heading{display:flex;align-items:baseline;gap:9px;margin:0 0 10px}
.promise-panel__number{color:var(--red);font:900 24px/1 "Avenir Next",Rounded,sans-serif}
.promise-panel h3{font-size:clamp(18px,4.4vw,22px);line-height:1.45}
.promise-panel__gain{margin:0 0 10px;color:var(--red);font-size:14px;font-weight:800;line-height:1.6}
.promise-panel__body p{margin:0;color:var(--muted);font-size:14px;line-height:1.8}
.promise-panel__body p+p{margin-top:10px}
@keyframes promise-check{
  0%,10%{opacity:.38;transform:translateY(3px)}
  25%,82%{opacity:1;transform:translateY(0)}
  100%{opacity:.38;transform:translateY(3px)}
}
@keyframes promise-chart-draw{
  0%,10%{stroke-dasharray:500;stroke-dashoffset:500}
  72%,100%{stroke-dasharray:500;stroke-dashoffset:0}
}
@keyframes promise-bar{
  0%,10%{clip-path:inset(0 100% 0 0)}
  65%,100%{clip-path:inset(0)}
}
.promises[data-animate] .promise-checks span,
.promises[data-animate] .promise-broker span,
.promises[data-animate] .promise-comparison div{animation:promise-check 4s ease-in-out infinite;animation-delay:calc(var(--step,0) * .35s)}
.promises[data-animate] .promise-chart .chart-line{animation:promise-chart-draw 4s ease-in-out infinite}
.promises[data-animate] .promise-profit b{animation:promise-bar 4s ease-in-out infinite;animation-delay:calc(var(--step) * .35s)}
@media(prefers-reduced-motion:reduce){.promises *{animation:none!important;transition:none!important}}

/* Discovery demo recreated from the original investigation notebook. */
.discovery-demo{
  position:relative;
  margin-bottom:18px;
  overflow:hidden;
  border:2px solid #30261e;
  border-radius: 14px;
  color:#30261e;
}
.discovery-demo__header{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:30px;
  padding:4px 9px;
  border-bottom:2px solid #30261e;
  background:repeating-linear-gradient(-24deg,#fff5 0 1px,transparent 1px 5px),#ff9281;
}
.discovery-demo__file{
  display:flex;
  align-items:center;
  gap:6px;
  font:800 clamp(11px,3.2vw,15px)/1.3 ui-monospace,monospace;
}
.discovery-demo__file::before{
  content:"";
  width:13px;
  height:12px;
  flex:none;
  border:2px solid #30261e;
  border-radius: 8px;
  background:#ffd27d;
  transform:rotate(-8deg);
}
.discovery-demo__badge{
  margin-left:auto;
  padding:1px 5px;
  border:1px solid #30261e;
  border-radius: 8px;
  background:var(--white);
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}
.discovery-demo__sheet{
  position:relative;
  min-width:0;
  margin:12px;
  padding:12px 12px 0;
  overflow:hidden;
  border:2px solid #30261e;
  border-radius: 14px;
  background:var(--white);
  box-shadow:3px 4px #b97d755e;
}
.discovery-demo__sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.discovery-demo__title{
  margin:0;
  padding-bottom:8px;
  border-bottom:1px dashed #b8a68c;
  color:#9f352d;
  font-size:clamp(11px,3.4vw,14px);
  font-weight:800;
  line-height:1.5;
}
.discovery-demo__progress{
  display:flex;
  align-items:center;
  gap:6px;
  margin:8px 0;
  font:800 11px/1.4 ui-monospace,Rounded,sans-serif;
  white-space:nowrap;
}
.discovery-demo__track{flex:1;height:6px;overflow:hidden;border-radius: 8px;background:#ffe6dc}
.discovery-demo__track i{
  display:block;
  width:var(--discovery-progress,0%);
  height:100%;
  background:repeating-linear-gradient(-24deg,#fff5 0 1px,transparent 1px 5px),#ff9281;
  transition:width .32s ease;
}
.discovery-demo__rows{display:grid;gap:3px}
.discovery-demo__row{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:5px;
  border-radius: 8px;
  background:#ffe6dc;
  font-size:clamp(12px,3.6vw,15px);
  font-weight:800;
  line-height:1.4;
  cursor:pointer;
}
.discovery-demo__row input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.discovery-demo__row:focus-within{outline:3px solid var(--data);outline-offset:2px}
.discovery-demo__check{
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  flex:none;
  border:2px solid #30261e;
  border-radius: 8px;
  background:var(--white);
  transition:background .2s;
}
.discovery-demo__check svg{width:20px;height:20px;overflow:visible}
.discovery-demo__check path{fill:none;stroke:#30261e;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .28s ease-out}
.discovery-demo__row input:checked + .discovery-demo__check{background:#ffd27d}
.discovery-demo__row input:checked + .discovery-demo__check path{stroke-dashoffset:0}
.discovery-demo__index{margin-left:auto;color:#55463a;font:800 10px/1 ui-monospace,monospace}
.discovery-demo__finish{position:relative;height:57px;margin-top:5px;border-top:1px dashed #b8a68c}
.discovery-demo .discovery-character{
  position:absolute;
  right:3%;
  bottom:-93px;
  width:clamp(140px,58%,210px);
  height:auto;
  aspect-ratio:1107/1421;
  margin:0;
  pointer-events:none;
  transform-origin:50% 90%;
}
.discovery-demo .discovery-character img{width:100%;height:auto}
.discovery-demo.is-complete .discovery-character{animation:discovery-detective .7s ease-in-out}
@keyframes discovery-detective{30%{transform:translateY(-7px) rotate(-4deg)}65%{transform:translateY(-2px) rotate(2deg)}}
@media(prefers-reduced-motion:reduce){.discovery-demo *{animation:none!important;transition:none!important}}

/* The active tab stays clear while every tab responds to hover. */
.promise-tabs button{transition:transform .18s ease,box-shadow .18s ease}
@media (hover:hover) and (pointer:fine){.promise-tabs button:hover{transform:translateY(-2px);box-shadow:0 0 0 2px #f4ce70,0 0 14px #d799547f}.promise-tabs button[aria-selected="true"]:hover{box-shadow:0 3px #6e2922,0 0 0 2px #f4ce70,0 0 14px #d799547f}}
.promises__title em{font-family:inherit;font-size:1em;font-style:normal;font-weight:inherit;color:var(--red);-webkit-text-stroke:0;paint-order:normal}