@font-face{font-family:Experiment Tight;src:url(assets/inter-tight.ttf) format("truetype");font-weight:100 900;font-display:swap}
.experiment-section,.experiment-checklist,.experiment-switch,.experiment-index-page{--exp-ink:#20231f;--exp-blue:#1b3bc5;--exp-paper:#fffef8;--exp-line:#bfc8b4}
.experiment-switch{display:flex;justify-content:space-between;align-items:center;gap:8px 20px;flex-wrap:wrap;padding:12px clamp(20px,4vw,56px);background:#e6e9dc;color:var(--exp-ink);font-size:13px;line-height:1.35}
.experiment-switch>span{font-weight:600}.experiment-switch>div{display:flex;flex-wrap:wrap;gap:8px 18px}.experiment-switch a{text-decoration:underline;text-underline-offset:3px}
.experiment-section,.experiment-checklist{padding-block:clamp(48px,7vw,112px);color:var(--exp-ink);background:#e9ecdf}
.experiment-section.journey{background:#e5eafb}
.experiment-section.handoff{background:#101a3a;color:#fffef8;--exp-line:#687699}
.experiment-inner{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,6vw,100px);align-items:start}
.experiment-heading h2{font-size:clamp(39px,5.5vw,82px);letter-spacing:-.04em;line-height:1.02;font-weight:550;text-wrap:balance;margin:0;scroll-margin-top:32px}
.experiment-heading p{font-size:clamp(16px,1.6vw,22px);max-width:35ch;line-height:1.5;margin:18px 0 0}
.experiment-heading a,.experiment-panel a{display:inline-flex;align-items:center;gap:12px;min-height:44px;color:var(--exp-blue);text-decoration:underline;text-underline-offset:4px;margin-top:12px;font-weight:550}
.experiment-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--exp-line);border-radius:4px;margin-bottom:12px}
.experiment-options[hidden],.experiment-panel[hidden]{display:none}
.experiment-options button{min-width:0;min-height:52px;padding:10px;color:inherit;font:inherit;font-size:clamp(12px,1.2vw,16px);line-height:1.25;background:transparent;border:0;cursor:pointer}
.experiment-options button+button{border-left:1px solid var(--exp-line)}
.experiment-options button[aria-pressed=true]{background:var(--exp-blue);color:#fffef8}
.handoff .experiment-options button[aria-pressed=true]{background:#e5eafb;color:#101a3a}
.hero-reviews:focus-visible{outline:2px solid var(--exp-blue,#1b3bc5);outline-offset:3px}
.experiment-options button:focus-visible,.experiment-detail summary:focus-visible,.experiment-panel a:focus-visible,.experiment-heading a:focus-visible,.experiment-switch a:focus-visible{outline:2px solid currentColor;outline-offset:3px;position:relative;z-index:1}
.experiment-panel{background:var(--exp-paper);color:var(--exp-ink);border:1px solid var(--exp-line);border-radius:4px;padding:clamp(20px,4vw,54px);min-height:256px}
.experiment-panel+.experiment-panel{margin-top:12px}
.experiment-panel[hidden]+.experiment-panel{margin-top:0}
.experiment-index{display:block;color:var(--exp-blue);font-size:13px;letter-spacing:.06em;margin-bottom:14px}
.experiment-panel h3{font-size:clamp(26px,3vw,44px);font-weight:550;line-height:1.06;letter-spacing:-.035em;margin:0;text-wrap:balance}
.experiment-panel p{margin:12px 0 0;font-size:16px;line-height:1.55;max-width:48ch}
.experiment-progress{height:3px;background:#c3cbe6;margin-bottom:12px}
.experiment-progress>span{display:block;height:100%;background:var(--exp-blue);transform-origin:left;transform:scaleX(var(--journey-progress,.333));transition:transform .45s var(--ease)}
.experiment-checklist{background:#f3f3ec;border-block:1px solid var(--exp-line)}
.experiment-checklist .experiment-heading h2{font-size:clamp(35px,4.3vw,65px)}
.experiment-details{border-top:1px solid var(--exp-line);counter-reset:experiment-details}
.experiment-detail{border-bottom:1px solid var(--exp-line);counter-increment:experiment-details}
.experiment-detail summary{display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:60px;font-size:clamp(18px,2.1vw,27px);line-height:1.2;cursor:pointer;list-style:none;padding:12px 0}
.experiment-detail summary::-webkit-details-marker{display:none}
.experiment-detail summary:before{content:counter(experiment-details, decimal-leading-zero);font-size:12px;color:var(--exp-blue)}
.experiment-detail summary:after{content:'+';font-size:25px;color:var(--exp-blue);transition:transform .3s var(--ease)}
.experiment-detail[open] summary:after{transform:rotate(45deg)}
.experiment-detail p{margin:0 22px 18px 37px;line-height:1.55;max-width:52ch}
@media(max-width:760px){.experiment-inner{grid-template-columns:1fr}.experiment-options button{padding:8px 4px}.experiment-panel{min-height:0}.experiment-switch>span{display:none}}
@media(max-width: 0px){.experiment-progress>span,.experiment-detail summary:after{transition:none}}

.experiment-index-page{margin:0;background:#f1f0e9;color:var(--exp-ink);font:16px/1.5 Experiment Tight,system-ui,sans-serif}
.experiment-index-page main{max-width:1080px;margin:auto;padding:clamp(24px,7vw,100px) clamp(20px,5vw,62px)}
.index-name{margin:0;font-size:12px;font-weight:600;letter-spacing:.13em;color:var(--exp-blue)}
.experiment-index-page h1{font-size:clamp(49px,9vw,110px);line-height:.93;letter-spacing:-.04em;font-weight:550;margin:30px 0 0}
.index-intro{max-width:49ch;font-size:clamp(16px,2vw,21px);margin:24px 0 44px}
.index-versions{border-top:1px solid var(--exp-line)}
.index-versions article{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:15px;align-items:center;padding:24px 0;border-bottom:1px solid var(--exp-line)}
.index-number{color:var(--exp-blue);font-size:13px}
.index-versions h2{font-size:clamp(24px,3.6vw,38px);line-height:1.03;letter-spacing:-.035em;font-weight:550;margin:0}
.index-versions p{margin:7px 0 0}
.index-versions a{color:var(--exp-blue);display:flex;align-items:center;gap:10px;min-height:44px;text-underline-offset:4px}
.index-versions a:focus-visible{outline:2px solid var(--exp-blue);outline-offset:4px}
@media(max-width:600px){.index-versions article{grid-template-columns:24px minmax(0,1fr);gap:7px 10px}.index-number{align-self:start}.index-versions a{grid-column:2}}

/* The diagnostic reads as a choice beside a working note. */
@media(min-width:1060px){
  .diagnostic .experiment-tool{display:grid;grid-template-columns:minmax(145px,.38fr) minmax(0,1fr);gap:12px;align-items:start}
  .diagnostic .experiment-options:not([hidden]){grid-template-columns:1fr;margin:0}
  .diagnostic .experiment-options button{padding-inline:14px;text-align:left}
  .diagnostic .experiment-options button+button{border-left:0;border-top:1px solid var(--exp-line)}
}
/* The handoff reads as a two-person agreement at each stage. */
.handoff-roles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;margin:22px 0 0}
.handoff-roles div{border-top:1px solid var(--exp-line);padding-top:10px}
.handoff-roles dt{font-size:13px;color:var(--exp-blue);font-weight:650}
.handoff-roles dd{margin:5px 0 0;font-size:15px;line-height:1.45}
@media(max-width:370px){.handoff-roles{grid-template-columns:1fr}}
