/* Testamur site styles - v1.0 */

:root{
  --ink:#16171C; --paper:#F0F0EC; --card:#FBFBF9; --seal:#7A2E3B;
  --slate:#5A6068; --rule:#D3D4CE; --rule-soft:#E4E5E0; --measure:1040px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--measure);margin:0 auto;padding:0 24px;}
strong{font-weight:500;}

/* ---------- masthead ---------- */
.masthead{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:24px 0 14px;border-bottom:1px solid var(--ink);flex-wrap:wrap;}
.mark{font-family:"Spectral",Georgia,serif;font-weight:600;font-size:20px;
  letter-spacing:.02em;color:var(--ink);text-decoration:none;}
.mark span{color:var(--seal);}
nav a{font-size:14px;color:var(--slate);text-decoration:none;margin-left:22px;}
nav a:hover,nav a[aria-current]{color:var(--ink);}
nav a.cta-link{color:var(--seal);}

/* ---------- annotated grid ---------- */
.annot{display:grid;grid-template-columns:104px minmax(0,1fr);gap:0 30px;
  padding:34px 0;border-bottom:1px solid var(--rule-soft);}
.gutter{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--seal);line-height:1.7;padding-top:7px;}
.gutter .muted{color:var(--slate);display:block;margin-top:5px;}
.col p{margin:0 0 15px;max-width:66ch;}
.col p:last-child{margin-bottom:0;}
.col h2{font-family:"Spectral",Georgia,serif;font-weight:400;
  font-size:clamp(25px,3.4vw,33px);line-height:1.24;margin:0 0 16px;letter-spacing:-.005em;}
.col h3{font-family:"Spectral",Georgia,serif;font-weight:600;font-size:19px;margin:26px 0 8px;}
.lead{font-size:18px;color:var(--slate);}

/* ---------- hero ---------- */
.hero{padding:60px 0 50px;border-bottom:1px solid var(--ink);}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--seal);margin-bottom:22px;}
.hero h1{font-family:"Spectral",Georgia,serif;font-weight:400;
  font-size:clamp(35px,6vw,62px);line-height:1.09;margin:0 0 24px;
  max-width:18ch;letter-spacing:-.018em;}
.hero h1 em{font-style:italic;color:var(--seal);}
.hero .sub{font-size:18.5px;color:var(--slate);max-width:62ch;margin:0 0 32px;}
.hero .sub strong{color:var(--ink);}

/* ---------- buttons ---------- */
.btn{display:inline-block;font-family:inherit;font-weight:500;font-size:15.5px;
  padding:14px 28px;border:1px solid var(--ink);background:var(--ink);
  color:var(--paper);text-decoration:none;cursor:pointer;transition:opacity .15s;}
.btn:hover{opacity:.86;}
.btn.ghost{background:transparent;color:var(--ink);}
.btn:focus-visible{outline:2px solid var(--seal);outline-offset:2px;}
.btns{display:flex;gap:13px;flex-wrap:wrap;align-items:center;}

/* ---------- the loop (homepage signature) ---------- */
.loop{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));
  border:1px solid var(--ink);margin-top:8px;background:var(--card);}
.loop-step{padding:26px 24px 28px;border-right:1px solid var(--rule);position:relative;}
.loop-step:last-child{border-right:0;}
.loop-step .n{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--seal);margin-bottom:14px;}
.loop-step h3{font-family:"Spectral",Georgia,serif;font-weight:600;font-size:21px;margin:0 0 8px;}
.loop-step p{margin:0;font-size:15px;color:var(--slate);}
.loop-step.out{background:var(--ink);}
.loop-step.out .n{color:#C9A0A8;}
.loop-step.out h3{color:var(--paper);}
.loop-step.out p{color:#B9BCBE;}

/* ---------- tables ---------- */
table.t{width:100%;border-collapse:collapse;margin-top:6px;font-size:15px;}
table.t th{text-align:left;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.09em;text-transform:uppercase;color:var(--slate);font-weight:400;
  padding:0 14px 9px 0;border-bottom:1px solid var(--ink);}
table.t td{padding:13px 14px 13px 0;border-bottom:1px solid var(--rule-soft);vertical-align:top;}
table.t td:first-child{width:42%;color:var(--slate);}

/* ---------- pricing ---------- */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(266px,1fr));
  border:1px solid var(--ink);margin-top:8px;background:var(--card);}
.plan{padding:28px 24px 30px;border-right:1px solid var(--rule);display:flex;flex-direction:column;}
.plan:last-child{border-right:0;}
.plan.featured{background:var(--ink);}
.plan .tag{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--seal);margin-bottom:12px;min-height:16px;}
.plan.featured .tag{color:#D9A9B1;}
.plan h3{font-family:"Spectral",Georgia,serif;font-weight:600;font-size:22px;margin:0 0 4px;}
.plan.featured h3{color:var(--paper);}
.plan .price{font-family:"Spectral",Georgia,serif;font-size:33px;line-height:1.2;margin:8px 0 2px;}
.plan.featured .price{color:var(--paper);}
.plan .unit{font-size:13.5px;color:var(--slate);margin-bottom:18px;}
.plan.featured .unit{color:#9DA1A5;}
.plan ul{list-style:none;padding:0;margin:0 0 22px;flex:1;}
.plan li{font-size:14.5px;padding:7px 0;border-bottom:1px solid var(--rule-soft);color:var(--slate);}
.plan.featured li{border-bottom:1px solid #2C2E35;color:#B9BCBE;}
.plan li:last-child{border-bottom:0;}
.plan .btn{text-align:center;}
.plan.featured .btn{background:var(--paper);color:var(--ink);border-color:var(--paper);}

/* ---------- misc blocks ---------- */
.note{background:var(--card);border-left:2px solid var(--seal);padding:16px 18px;
  margin:22px 0 0;font-size:14.5px;color:var(--slate);max-width:64ch;}
.note strong{color:var(--ink);}
.stack{list-style:none;padding:0;margin:6px 0 0;}
.stack li{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--rule-soft);font-size:15.5px;}
.stack li .k{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--seal);
  flex:0 0 54px;padding-top:4px;letter-spacing:.05em;}
.stack li em{font-style:normal;color:var(--slate);display:block;font-size:14px;margin-top:2px;}

/* ---------- cta band ---------- */
.cta{background:var(--ink);color:var(--paper);padding:60px 0;}
.cta h2{font-family:"Spectral",Georgia,serif;font-weight:400;
  font-size:clamp(28px,4.2vw,42px);line-height:1.16;margin:0 0 18px;max-width:20ch;}
.cta h2 em{font-style:italic;color:#D9A9B1;}
.cta p{color:#B9BCBE;max-width:56ch;margin:0 0 30px;font-size:17px;}
.cta .btn{background:var(--paper);color:var(--ink);border-color:var(--paper);}
.cta .ghost{background:transparent;color:var(--paper);border-color:#4A4C52;}

/* ---------- footer ---------- */
footer{padding:34px 0 60px;font-size:13px;color:var(--slate);}
footer .cols{display:flex;gap:40px;flex-wrap:wrap;padding-bottom:24px;}
footer .cols a{display:block;color:var(--slate);text-decoration:none;padding:3px 0;}
footer .cols a:hover{color:var(--ink);}
footer .colhead{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink);margin-bottom:8px;}
footer .disc{max-width:70ch;line-height:1.65;padding-top:18px;border-top:1px solid var(--rule);}

@media (max-width:720px){
  .annot{grid-template-columns:1fr;gap:0;}
  .gutter{padding-top:0;margin-bottom:11px;}
  nav a{margin-left:0;margin-right:18px;}
  .masthead nav{margin-top:10px;}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}