/* About + Contact layer. Loads after style.css. Homepage visual language:
   app-window panels, working-paper rows, reviewer's tick, numbered circles. */

/* ---------- Shared ---------- */
.co-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:2.5rem;align-items:end;
  margin-bottom:clamp(2.25rem,5vw,3.25rem);}
.co-head h2{font-size:var(--fs-h2);max-width:18ch;margin:0;}
.co-head p{margin:0;max-width:46ch;font-size:1.0625rem;}
.co-head--center{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:0;}
.co-head--center h2{max-width:22ch;}
.section--ink .co-head p{color:#9DAAB9;}
.co-n{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;flex:none;
  border:2px solid var(--line);background:#fff;font:600 .8125rem/1 var(--sans);color:var(--ink);
  font-variant-numeric:tabular-nums;}
.co-ico{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
.card__icon{display:grid;place-items:center;color:var(--accent-dark);}
.card:hover .card__icon{color:var(--accent);}

/* App window: the homepage "stage" */
.co-stage{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 60px -40px rgba(13,27,42,.4);color:var(--slate);}
.co-stage__bar{display:flex;align-items:center;gap:6px;padding:.8rem 1rem;border-bottom:1px solid var(--line);background:#F8FAFB;}
.co-stage__bar i{width:9px;height:9px;border-radius:50%;background:var(--line);flex:none;}
.co-stage__bar span{margin-left:.5rem;font:500 .8125rem/1.3 var(--sans);color:var(--ink);min-width:0;}
.co-stage__bar b{font-weight:600;}
.co-stage__bar em{margin-left:auto;font:600 .75rem/1 var(--sans);font-style:normal;color:var(--slate);
  background:var(--surface);border-radius:6px;padding:.35rem .55rem;white-space:nowrap;}

/* Reviewer's stamp */
.co-stamp{display:inline-block;font:600 .8125rem/1 var(--sans);color:var(--positive);border:2px solid var(--positive);
  border-radius:6px;padding:.5rem .7rem;transform:rotate(-3deg);margin:0 0 1.5rem;}

/* ================= ABOUT ================= */
/* Opener: the problem */
.co-hero__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(2rem,5vw,4.5rem);align-items:center;}
.co-hero__copy .lead{font-size:1.1875rem;color:var(--ink);max-width:40ch;}
.co-hero__copy > p:not(.lead){max-width:52ch;}
.co-hero__copy .btn-row{margin-top:1.75rem;}
.co-vs{margin:0;display:grid;gap:12px;}
.co-vs__card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1.25rem 1.35rem;
  box-shadow:0 20px 40px -30px rgba(13,27,42,.35);}
.co-vs__card--ink{background:var(--ink);border-color:var(--ink);margin-left:clamp(0px,3vw,2rem);
  box-shadow:0 30px 60px -30px rgba(0,168,114,.45);}
.co-vs__who{margin:0 0 .75rem;font:600 .8125rem/1 var(--sans);color:var(--slate);}
.co-vs__card--ink .co-vs__who{color:#9DAAB9;}
.co-vs__row{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;padding-bottom:.75rem;
  border-bottom:1px dashed var(--line);font-size:.9375rem;color:var(--ink);}
.co-vs__row b{font:800 1.5rem/1 var(--display);font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap;}
.co-vs__card--ink .co-vs__row{color:#D6DDE6;border-bottom-color:#22364D;}
.co-vs__card--ink .co-vs__row b{color:#fff;}
.co-vs__tag{margin:.8rem 0 0;font-size:.875rem;color:var(--muted);}
.co-vs__tag--ok{color:#fff;font-weight:600;display:flex;gap:.5rem;align-items:center;}
.co-vs__tag--ok::before{content:"";width:18px;height:6px;border-block:2px solid var(--accent);flex:none;}
.co-vs figcaption{font-size:.75rem;color:var(--muted);text-align:right;}

/* Who signs off */
.co-sign{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.4fr);gap:clamp(2rem,5vw,5rem);align-items:center;}
.co-sign__card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:2rem;text-align:center;
  box-shadow:0 30px 60px -40px rgba(13,27,42,.4);}
.co-sign__ava{width:96px;height:96px;margin:0 auto 1.25rem;border-radius:50%;box-shadow:0 0 0 4px #fff,0 0 0 6px var(--accent);}
.co-sign__name{font:800 var(--fs-h3-lg)/1.2 var(--display);color:var(--ink);margin:0 0 .3rem;}
.co-sign__role{margin:0;font-size:.875rem;color:var(--slate);}
.co-sign__creds{margin:.2rem 0 1.1rem;font-size:.875rem;font-weight:600;color:var(--ink);}
.co-sign__card .ticks{text-align:left;border-top:1px solid var(--line);padding-top:1.25rem;}
.co-sign__copy h2{font-size:var(--fs-h2);max-width:16ch;}
.co-sign__copy > p{max-width:60ch;}
.co-quote{margin:2rem 0 0;padding:0;border:0;}
.co-quote p{margin:0;font:700 clamp(1.375rem,2.4vw,1.875rem)/1.25 var(--display);color:var(--ink);letter-spacing:-.005em;}
.co-quote::after{content:"";display:block;width:64px;height:7px;margin-top:1.1rem;border-block:2px solid var(--accent);}

/* How a close gets checked */
.co-review{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start;}
.co-review .co-stage{border-color:#22364D;}
.co-sheet__head,.co-sheet__row{display:grid;grid-template-columns:2.6rem minmax(0,1.2fr) minmax(0,.8fr) minmax(0,1fr) 5.5rem;
  gap:.9rem;align-items:center;padding:.95rem 1.25rem;}
.co-sheet__head{background:#142740;color:#9DAAB9;font:500 .8125rem/1 var(--sans);padding-block:.8rem;}
.co-sheet__head span:nth-child(3),.co-sheet__head span:nth-child(4){text-align:right;}
.co-sheet__row{border-top:1px solid var(--line);font-size:.9375rem;transition:background .3s;}
.co-ref{font-weight:600;font-size:.875rem;color:var(--negative);}
.co-acc{color:var(--ink);font-weight:600;}
.co-fig{text-align:right;color:var(--ink);font-variant-numeric:tabular-nums;}
.co-fig small{display:block;font-size:.75rem;color:var(--muted);}
.co-tick{display:flex;justify-content:flex-end;align-items:center;gap:.4rem;}
.co-tick svg{width:28px;height:28px;fill:none;stroke:var(--positive);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.co-tick svg path,.co-tick svg circle{stroke-dasharray:64;stroke-dashoffset:0;}
.co-flag{display:none;font:600 .75rem/1 var(--sans);font-style:normal;color:var(--negative);background:#FDF0EC;
  border-radius:6px;padding:.35rem .5rem;}
.co-signline{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;
  padding:1rem 1.25rem;border-top:1px dashed var(--line-strong);font-size:.875rem;color:var(--slate);}
.co-stamp--sheet{margin:0;}

/* With JS: undrawn until reviewed */
.is-js .co-tick svg path,.is-js .co-tick svg circle{stroke-dashoffset:64;transition:stroke-dashoffset .6s cubic-bezier(.4,0,.2,1);}
.is-js .co-tick svg path{transition-delay:.25s;}
.is-js .co-sheet__row.is-done .co-tick svg path,.is-js .co-sheet__row.is-done .co-tick svg circle{stroke-dashoffset:0;}
.is-js .co-sheet__row.is-now{background:var(--accent-soft);}
.is-js .co-sheet__row.is-now[data-step="2"]{background:#FDF0EC;}
.is-js .co-sheet__row.is-now .co-flag{display:inline-block;}
.is-js .co-sheet__row:not(.is-done):not(.is-now) .co-fig{color:#A7B1BE;}
.is-js .co-stamp--sheet{opacity:0;transform:rotate(-3deg) scale(1.4);transition:opacity .3s,transform .35s cubic-bezier(.2,1.4,.4,1);}
.is-js .co-stamp--sheet.is-done{opacity:1;transform:rotate(-3deg) scale(1);}

.co-checks{list-style:none;margin:0;padding:0;display:grid;gap:10px;}
.co-checks li{border:1px solid #22364D;border-radius:14px;background:var(--ink-800);transition:border-color .2s,background .2s;}
.co-checks__btn{all:unset;box-sizing:border-box;width:100%;display:flex;align-items:center;gap:.8rem;cursor:pointer;
  padding:1rem 1.15rem;font:600 1.0625rem/1.3 var(--sans);color:#fff;border-radius:14px;}
.co-checks__btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.co-checks .co-n{background:var(--ink);border-color:#22364D;color:#fff;transition:background .25s,border-color .25s,color .25s;}
.co-checks p{margin:0;padding:0 1.15rem 1.1rem calc(1.15rem + 28px + .8rem);font-size:.9375rem;color:#AFC0D2;}
.is-js .co-checks li:not(.is-on) p{display:none;}
.is-js .co-checks li.is-on{border-color:var(--accent);background:#142740;}
.co-checks li.is-done .co-n,.co-checks li.is-on.is-done .co-n{background:var(--accent);border-color:var(--accent);color:var(--ink);}
.co-walk__ctl{display:flex;align-items:center;gap:1rem;margin-top:1.25rem;}
.co-walk__count{font-size:.875rem;color:#9DAAB9;font-variant-numeric:tabular-nums;}

/* Principles */
.co-principles .card{padding:clamp(1.5rem,3vw,2rem);}

/* Trust question */
.co-trust{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:start;}
.co-trust h2{font-size:var(--fs-h2-card);max-width:20ch;}
.co-trust > div > p{max-width:60ch;}
.co-test{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 60px -40px rgba(13,27,42,.4);position:sticky;top:96px;}
.co-test__body{padding:1.5rem;}
.co-test__body > p{color:var(--ink);font-size:1.0625rem;}
.co-test__body strong{color:var(--accent-dark);}
.co-test__qs{list-style:none;margin:1.25rem 0 0;padding:0;counter-reset:q;}
.co-test__qs li{counter-increment:q;border-top:1px solid var(--line);padding:.9rem 0 .9rem 2.4rem;position:relative;}
.co-test__qs li::before{content:"0" counter(q);position:absolute;left:0;top:.9rem;font-weight:600;font-size:.875rem;color:var(--negative);}
.co-test__qs b{display:block;color:var(--ink);font-size:.9375rem;}
.co-test__qs span{font-size:.9375rem;}

/* Fit */
.co-fit{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.co-fit__card{background:var(--ink-800);border:1px solid #22364D;border-radius:14px;padding:clamp(1.5rem,3vw,2.1rem);}
.co-fit__card h3{display:flex;align-items:center;gap:.75rem;color:#fff;font-size:var(--fs-h3-lg);margin:0 0 1.25rem;}
.co-fit__mk{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:2px solid #3A5068;flex:none;}
.co-fit__mk svg{width:18px;height:18px;fill:none;stroke:#9DAAB9;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round;}
.co-fit__mk--yes{background:var(--accent);border-color:var(--accent);}
.co-fit__mk--yes svg{stroke:var(--ink);}
.co-fit .ticks li,.co-crosses li{color:#C3D0E2;font-size:.9688rem;}
.co-crosses{list-style:none;padding:0;margin:0;display:grid;gap:.6rem;}
.co-crosses li{position:relative;padding-left:1.55rem;line-height:1.55;margin:0;}
.co-crosses li::before{content:"";position:absolute;left:2px;top:.55em;width:11px;height:11px;
  background:linear-gradient(45deg,transparent 43%,#7F8DA0 43% 57%,transparent 57%),linear-gradient(-45deg,transparent 43%,#7F8DA0 43% 57%,transparent 57%);}

/* ================= CONTACT ================= */
.co-contact{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4.5rem);align-items:start;}
.co-contact__copy .lead{max-width:44ch;}
.co-lines{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.75rem 0 .5rem;}

/* Reply-time indicator */
.co-reply{margin-top:1.75rem;background:var(--ink);color:#C3CCD8;border-radius:14px;padding:1.35rem 1.4rem;
  box-shadow:0 30px 60px -30px rgba(0,168,114,.45);}
.co-reply__k{display:flex;align-items:center;gap:.55rem;margin:0 0 .6rem;font-size:.875rem;color:#9DAAB9;font-variant-numeric:tabular-nums;}
.co-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none;box-shadow:0 0 0 0 rgba(0,168,114,.5);animation:co-pulse 2s infinite;}
@keyframes co-pulse{70%{box-shadow:0 0 0 7px rgba(0,168,114,0);}100%{box-shadow:0 0 0 0 rgba(0,168,114,0);}}
.co-reply__big{margin:0;font:800 clamp(1.5rem,2.6vw,1.95rem)/1.12 var(--display);color:#fff;letter-spacing:-.01em;}
.co-week{list-style:none;margin:1.1rem 0 0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;}
.co-week li{text-align:center;border:1px solid #22364D;border-radius:10px;padding:.5rem .15rem .45rem;margin:0;}
.co-week span{display:block;font-size:.6875rem;color:#9DAAB9;}
.co-week b{display:block;font:800 1.125rem/1.2 var(--display);color:#fff;font-variant-numeric:tabular-nums;}
.co-week em{display:block;font-style:normal;font-size:.6875rem;line-height:1.3;min-height:1.3em;color:#7F8DA0;}
.co-week .is-off{opacity:.55;}
.co-week .is-today{border-color:#9DAAB9;}
.co-week .is-today em{color:#fff;}
.co-week .is-wait{background:#142740;}
.co-week .is-due{background:var(--accent);border-color:var(--accent);opacity:1;}
.co-week .is-due span,.co-week .is-due b,.co-week .is-due em{color:var(--ink);}
.co-week .is-due em{font-weight:600;}
.co-reply__fine{margin:.9rem 0 0;font-size:.75rem;line-height:1.5;color:#7F8DA0;}

/* Form as an app window */
.co-formcard__body{padding:clamp(1.35rem,3.5vw,2rem);}
.co-formcard__title{font-size:var(--fs-h3-lg);margin:0 0 .35rem;}
.co-formcard__sub{font-size:.9375rem;color:var(--muted);margin:0 0 1.25rem;}
.co-fs{border:0;margin:0 0 .5rem;padding:1.1rem 0 .25rem;border-top:1px solid var(--line);min-width:0;}
.co-fs legend{display:flex;align-items:center;gap:.6rem;padding:0 .6rem 0 0;font:600 .9375rem/1 var(--sans);color:var(--ink);}
.co-fs:focus-within .co-n{background:var(--accent);border-color:var(--accent);}
.co-fs legend + *{margin-top:.9rem;}
.co-formcard .btn--primary{margin-top:.5rem;}
.co-formcard .form-status{margin:0 0 1rem;}

/* Timeline note under step 1 */
.co-when{display:inline-block;margin-top:.8rem !important;font-size:.8125rem !important;font-weight:600;
  color:var(--ink) !important;background:var(--accent);border-radius:6px;padding:.35rem .55rem;}
.section--ink .step p{color:#AFC0D2;}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .co-hero__grid,.co-sign,.co-review,.co-trust,.co-contact{grid-template-columns:minmax(0,1fr);}
  .co-head{grid-template-columns:minmax(0,1fr);gap:1.1rem;}
  .co-test{position:static;}
  .co-vs{max-width:520px;}
}
@media (max-width:640px){
  .co-fit,.co-lines{grid-template-columns:minmax(0,1fr);}
  .co-sheet__head{display:none;}
  .co-sheet__row{grid-template-columns:2.2rem minmax(0,1fr) auto;gap:.3rem .75rem;padding:.85rem 1rem;}
  .co-sheet__row .co-fig{grid-column:2;text-align:left;font-size:.875rem;}
  .co-fig small{display:inline;margin-left:.3rem;}
  .co-tick{grid-column:3;grid-row:1 / span 3;}
  .co-week{gap:4px;}
  .co-week b{font-size:1rem;}
  .co-stage__bar span{font-size:.75rem;}
}
@media (prefers-reduced-motion:reduce){
  .co-dot{animation:none;}
  .is-js .co-tick svg path,.is-js .co-tick svg circle,.is-js .co-stamp--sheet{transition:none;}
}

