/* it-t10-trainer.css: the personal trainer page, the owner's pack mockup scaled
   (tools/trades10/pack-professional/visual-references/personal-trainer.png, 824 wide).
   --u = one mockup pixel; every size and position below is the mockup's own, measured.
   Built by tools/trades10/trainer.py. */
main.t-trainer{container-type:inline-size;--u:calc(min(100cqw,1440px) / 824);
  --tr-ink:#0E1A22;--tr-sub:#5A676E;--tr-or:#F2620C;--tr-mist:#EFF5F5;--tr-rule:#E6EAEB;--tr-slate:#123440;
  font-family:Inter,'Inter Fallback',-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--tr-ink);background:#FCFCFB}
.t-trainer .tr-board{position:relative}
.t-trainer .tr-art{position:relative;width:calc(824 * var(--u));height:calc(var(--h) * var(--u));margin:0 auto}
.t-trainer .tr-a{position:absolute;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));width:calc(var(--w,100) * var(--u))}
.t-trainer .tr-t{font-size:calc(var(--f) * var(--u));line-height:calc(var(--l) * var(--u));letter-spacing:var(--ls,0)}
.t-trainer h1,.t-trainer h2,.t-trainer h3{font-weight:700;color:var(--tr-ink)}
.tr-center{text-align:center}
.tr-eyebrow{font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--tr-or)}
.tr-p,.tr-lede,.tr-step-p,.tr-pp{color:var(--tr-sub);font-weight:400}
.tr-hand{font-family:"Caveat","Segoe Script",cursive;font-weight:500;color:#2A3740}
.t-trainer .tr-btn{display:inline-flex;align-items:center;gap:calc(9 * var(--u));justify-content:center;
  height:calc(31 * var(--u));background:#F05A05;color:#fff!important;border-radius:calc(4 * var(--u));
  font-size:calc(11 * var(--u));font-weight:600;text-decoration:none!important;transition:background .15s;
  box-shadow:0 calc(6 * var(--u)) calc(14 * var(--u)) calc(-6 * var(--u)) rgba(200,70,5,.45)}
.t-trainer .tr-btn:hover{background:#D24E03}
.t-trainer .tr-btn svg{width:calc(12 * var(--u));height:calc(12 * var(--u));fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tr-logo{display:flex;align-items:center;gap:.36em;line-height:1;font-size:inherit}
.tr-logo svg{width:1.15em;height:1.15em;flex:none}
.tr-logo b{font-weight:700;letter-spacing:-.02em;color:var(--tr-ink)}

/* hero */
.tr-hero{overflow:hidden;background:#F4F4F3}
.tr-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.tr-hero .tr-h1{display:block}
.tr-kick{position:absolute;left:0;bottom:100%;margin-bottom:calc(10 * var(--u));white-space:nowrap;
  font-size:calc(7.6 * var(--u));line-height:calc(10 * var(--u));font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tr-or)}
.tr-big{display:block}
.tr-tag{color:#6C7A81}

/* the invoice the design paints in the hero, redrawn */
.tr-doc{position:absolute;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));
  width:calc(var(--w) * var(--u));height:calc(var(--h) * var(--u));background:#fff;
  box-shadow:0 calc(12 * var(--u)) calc(30 * var(--u)) calc(-14 * var(--u)) rgba(11,25,32,.32),0 0 0 1px rgba(11,25,32,.05)}
.tr-doc>*,.tr-tp>*{position:absolute;margin:0}
.tr-d-top{left:calc(15 * var(--u));right:calc(9 * var(--u));top:calc(13 * var(--u));display:flex;align-items:center;justify-content:space-between;font-size:calc(8 * var(--u))}
.tr-d-kind{font-size:calc(12.5 * var(--u));line-height:1;font-weight:700;letter-spacing:.01em;color:var(--tr-ink)}
.tr-d-h{left:calc(15 * var(--u));top:calc(36 * var(--u));font-size:calc(9.1 * var(--u));line-height:1;font-weight:700;letter-spacing:-.01em}
.tr-d-bill{left:calc(15 * var(--u));top:calc(60 * var(--u))}
.tr-d-bill b,.tr-d-bill span{display:block;font-size:calc(6.6 * var(--u));line-height:calc(11.5 * var(--u));color:#5D6B73;font-weight:400}
.tr-d-bill b{color:var(--tr-ink);font-weight:600}
.tr-d-meta{left:calc(132 * var(--u));top:calc(60 * var(--u));width:calc(99 * var(--u))}
.tr-d-meta div{display:flex;line-height:calc(11.5 * var(--u))}
.tr-d-meta dt{flex:1;font-size:calc(6.6 * var(--u));font-weight:400;color:#6C7A81}
.tr-d-meta dd{margin:0;width:calc(48 * var(--u));font-size:calc(6.6 * var(--u));color:var(--tr-ink)}
.tr-d-tbl{left:calc(15 * var(--u));top:calc(104 * var(--u));width:calc(216 * var(--u));border-collapse:collapse;table-layout:fixed}
.tr-d-tbl th{background:#F2F5F6;font-size:calc(6.4 * var(--u));font-weight:600;color:var(--tr-ink);text-align:right;
  height:calc(19 * var(--u));padding:0 calc(6 * var(--u));white-space:nowrap}
.tr-d-tbl td{font-size:calc(6.2 * var(--u));color:#4F5C64;text-align:right;height:calc(18 * var(--u));padding:0 calc(6 * var(--u));
  border-bottom:1px solid #EDF0F1;white-space:nowrap;overflow:hidden}
.tr-d-tbl th:first-child,.tr-d-tbl td:first-child{text-align:left;width:calc(104 * var(--u))}
.tr-d-tbl th:nth-child(2),.tr-d-tbl td:nth-child(2){width:calc(26 * var(--u));text-align:center}
.tr-d-tbl th:nth-child(3),.tr-d-tbl td:nth-child(3){width:calc(44 * var(--u))}
.tr-d-sum{left:calc(120 * var(--u));top:calc(216 * var(--u));width:calc(111 * var(--u))}
.tr-d-sum div{display:flex;justify-content:space-between;line-height:calc(15 * var(--u));font-size:calc(6.4 * var(--u));color:#5D6B73}
.tr-d-sum dd{margin:0;color:var(--tr-ink)}
.tr-d-total{left:calc(120 * var(--u));top:calc(250 * var(--u));width:calc(111 * var(--u));display:flex;justify-content:space-between;
  align-items:baseline;border-top:1px solid #E1E6E8;padding-top:calc(7 * var(--u))}
.tr-d-total span{font-size:calc(7.4 * var(--u));font-weight:700}
.tr-d-total b{font-size:calc(10.4 * var(--u));font-weight:700}
.tr-d-note{left:calc(15 * var(--u));top:calc(252 * var(--u));font-size:calc(10.5 * var(--u));line-height:calc(13 * var(--u))}

/* the program strip */
.tr-flow{background:#FCFCFB}
.tr-line{position:absolute;left:calc(88 * var(--u));top:calc(90 * var(--u));width:calc(645 * var(--u));height:calc(2.4 * var(--u));background:var(--tr-or)}
.tr-steps{position:absolute;inset:0}
.tr-disc{position:absolute;left:calc(var(--x) * var(--u));top:calc(67 * var(--u));width:calc(48 * var(--u));height:calc(48 * var(--u));
  border-radius:50%;background:linear-gradient(180deg,#F8792B 0,#EF5A06 100%);display:grid;place-items:center;
  box-shadow:0 calc(6 * var(--u)) calc(14 * var(--u)) calc(-6 * var(--u)) rgba(214,80,6,.55)}
.tr-disc-i{width:calc(24 * var(--u));height:calc(24 * var(--u));fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tr-step-h{font-weight:700}

/* training service summary */
.tr-sumsec{background:var(--tr-mist)}
.tr-sum{position:absolute;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));
  width:calc(var(--w) * var(--u));height:calc(var(--h) * var(--u));background:#fff;border-radius:calc(3 * var(--u));
  box-shadow:0 calc(14 * var(--u)) calc(34 * var(--u)) calc(-16 * var(--u)) rgba(11,25,32,.22),0 0 0 1px rgba(11,25,32,.04)}
.tr-sum>*{position:absolute;margin:0}
.tr-sum-rule{left:calc(26 * var(--u));top:calc(26 * var(--u));width:calc(26 * var(--u));height:calc(3 * var(--u));background:var(--tr-or)}
.tr-sum-h{left:calc(26 * var(--u));top:calc(40 * var(--u));font-size:calc(11.6 * var(--u));line-height:1;font-weight:700;
  letter-spacing:.03em;text-transform:uppercase;color:var(--tr-ink)}
.tr-sum-meta{left:calc(300 * var(--u));top:calc(34 * var(--u));width:calc(120 * var(--u))}
.tr-sum-meta div{display:flex;line-height:calc(16 * var(--u))}
.tr-sum-meta dt{width:calc(44 * var(--u));flex:none;font-size:calc(7.4 * var(--u));color:#6C7A81;font-weight:400}
.tr-sum-meta dd{margin:0;font-size:calc(7.4 * var(--u));color:var(--tr-ink)}
.tr-sum-dl{left:calc(26 * var(--u));top:calc(76 * var(--u));width:calc(391 * var(--u))}
.tr-sum-dl div{display:flex;gap:calc(14 * var(--u));align-items:flex-start;padding:calc(4.8 * var(--u)) 0;border-bottom:1px solid #EEF1F2}
.tr-sum-dl dt{width:calc(94 * var(--u));flex:none;font-size:calc(8 * var(--u));line-height:calc(12 * var(--u));font-weight:700;color:var(--tr-ink)}
.tr-sum-dl dd{margin:0;font-size:calc(8 * var(--u));line-height:calc(12 * var(--u));color:#4F5C64}
.tr-sum-foot{left:calc(26 * var(--u));right:calc(26 * var(--u));top:calc(240 * var(--u));display:flex;align-items:center;justify-content:space-between;font-size:calc(9.6 * var(--u))}
.tr-sum-tag{font-size:calc(7.4 * var(--u));font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#3E4C54}

/* pricing panels */
.tr-price{background:#FCFCFB}
.tr-panels{position:absolute;inset:0}
.tr-panel{position:absolute;left:calc(var(--x) * var(--u));top:calc(70 * var(--u));width:calc(var(--w) * var(--u));height:calc(90 * var(--u));
  background:#F4F7F8;border-radius:calc(8 * var(--u));padding:calc(20 * var(--u)) calc(24 * var(--u));
  display:grid;grid-template-columns:calc(46 * var(--u)) 1fr;column-gap:calc(16 * var(--u))}
.tr-panel-i{grid-row:span 3;width:calc(34 * var(--u));height:calc(34 * var(--u));fill:none;stroke:var(--tr-or);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;margin-top:calc(3 * var(--u))}
.tr-panel h3{font-size:calc(11.2 * var(--u));line-height:1.1;letter-spacing:-.01em}
.tr-panel p{margin-top:calc(6 * var(--u))!important;font-size:calc(9.4 * var(--u));line-height:calc(14 * var(--u));color:var(--tr-sub)}
.tr-panel-l{display:flex;flex-wrap:wrap;gap:calc(22 * var(--u));margin-top:calc(10 * var(--u))}
.t-trainer .tr-panel-a{display:inline-flex;align-items:center;gap:calc(8 * var(--u));font-size:calc(9.3 * var(--u));font-weight:600;color:var(--tr-or)!important}
.tr-panel-a svg{width:calc(11 * var(--u));height:calc(11 * var(--u));fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.t-trainer .tr-panel-a:hover{color:#C04E06!important}

/* template papers */
.tr-tpl{background:#FCFCFB}
.t-trainer .tr-tp{position:absolute;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));
  width:calc(var(--w) * var(--u));height:calc(var(--h) * var(--u));background:#fff;border-radius:calc(3 * var(--u));overflow:hidden;
  box-shadow:0 calc(10 * var(--u)) calc(26 * var(--u)) calc(-12 * var(--u)) rgba(11,25,32,.26),0 0 0 1px rgba(11,25,32,.05)}
.tr-tp2{z-index:2}
.tr-tp .tr-d-top{top:calc(14 * var(--u));left:calc(14 * var(--u));right:calc(12 * var(--u));font-size:calc(7.4 * var(--u))}
.tr-tp .tr-d-kind{font-size:calc(10.6 * var(--u))}
.tr-tp .tr-d-h{left:calc(14 * var(--u));top:calc(34 * var(--u));font-size:calc(11 * var(--u))}
.tr-tp .tr-d-bill{left:calc(14 * var(--u));top:calc(56 * var(--u))}
.tr-tp .tr-d-meta{left:calc(116 * var(--u));top:calc(56 * var(--u));width:calc(98 * var(--u))}
.tr-tp .tr-d-tbl{left:calc(14 * var(--u));top:calc(96 * var(--u));width:calc(200 * var(--u))}
.tr-tp .tr-d-tbl th:first-child,.tr-tp .tr-d-tbl td:first-child{width:calc(96 * var(--u))}
.tr-tp .t10-edit{bottom:calc(-16 * var(--u));font-size:calc(11 * var(--u));padding:calc(10 * var(--u)) calc(15 * var(--u));
  border-radius:calc(5 * var(--u));background:#F2620C;gap:calc(10 * var(--u));font-weight:700;white-space:nowrap;
  box-shadow:0 calc(7 * var(--u)) calc(16 * var(--u)) rgba(150,52,2,.35)}
.tr-tp .t10-edit svg{width:calc(12 * var(--u));height:calc(12 * var(--u))}
.tr-tp .t10-edit.tr-edit-on{opacity:1}
.tr-strip-s{background:#FCFCFB;padding-bottom:44px}
.tr-strip-s .t10-strip{margin-top:0}

/* payment band */
.tr-pay{background:#FCFCFB;color:#fff}
.tr-pay-band{position:absolute;left:calc(37 * var(--u));top:calc(3 * var(--u));width:calc(750 * var(--u));height:calc(111 * var(--u));
  background:var(--tr-slate);border-radius:calc(9 * var(--u))}
.tr-pay .tr-pay-h{color:#fff}
.tr-pay-m{color:#fff;font-weight:600}
.tr-pay-u{color:#CFDDDE}
.tr-qr{height:calc(82 * var(--u));background:#fff;border-radius:calc(5 * var(--u));padding:calc(5 * var(--u))}
.tr-qr-img{width:100%;height:100%}
.tr-hand-w{color:#F3F7F7;font-size:calc(17 * var(--u));line-height:calc(22 * var(--u));transform:rotate(-7deg);transform-origin:0 0}
.tr-swoosh{height:calc(14 * var(--u));fill:none;stroke:var(--tr-or);stroke-width:1.8;stroke-linecap:round;overflow:visible}

/* process */
.tr-proc{background:#FCFCFB}
.tr-proc-l{position:absolute;inset:0}
.tr-pi{height:calc(26 * var(--u));fill:none;stroke:var(--tr-ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.t-trainer .tr-pt{font-weight:700;color:var(--tr-ink)!important}
.t-trainer .tr-pt:hover{color:#C04E06!important}
.tr-chev{height:calc(20 * var(--u));fill:none;stroke:var(--tr-or);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* related tools, questions, resources */
.tr-links{background:#FCFCFB;padding-bottom:calc(16 * var(--u))}
.tr-links-in{width:calc(824 * var(--u));margin:0 auto;padding:calc(16 * var(--u)) calc(40 * var(--u)) 0;
  display:grid;grid-template-columns:calc(278 * var(--u)) calc(295 * var(--u)) 1fr}
.tr-col-h{font-weight:700;margin-bottom:calc(12 * var(--u))!important}
.tr-list{display:grid;gap:calc(11 * var(--u))}
.t-trainer .tr-link{font-size:calc(8.7 * var(--u));line-height:calc(13 * var(--u));color:#1F3D63!important;text-decoration:underline!important;text-underline-offset:2px}
.t-trainer .tr-link:hover{color:#C04E06!important}
.t-trainer .tr-faq details{border-bottom:0}
.t-trainer .tr-faq summary{padding:0 0 calc(11 * var(--u));min-height:0;font-size:calc(8.7 * var(--u));line-height:calc(13 * var(--u));
  color:#1F3D63;text-decoration:underline;text-underline-offset:2px}
.t-trainer .tr-faq summary::after{content:"";display:none}
.t-trainer .tr-faq .a{padding:0 calc(20 * var(--u)) calc(11 * var(--u)) 0}
.t-trainer .tr-faq .a p{font-size:calc(8.6 * var(--u));line-height:calc(13.5 * var(--u));color:var(--tr-sub)}

/* closing band */
.tr-end{overflow:hidden;background:#1A1A1C}
.tr-end-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.t-trainer .tr-end-h{color:#fff}
.tr-end .tr-eyebrow{color:#F7A166}

.t-trainer .t10-long{background:var(--tr-mist)}

/* phones and small tablets: the same blocks in the design's order, photo and copy still one picture */
@media (max-width:899px){
  main.t-trainer{--u:1px}
  .t-trainer .tr-art{width:auto;height:auto!important;padding:0 20px}
  .t-trainer .tr-a{position:static;width:auto}
  .t-trainer .tr-t{font-size:var(--fm,16px);line-height:var(--lm,1.5);letter-spacing:normal}
  .tr-hero{min-height:560px;display:flex}
  .tr-hero .tr-art{padding:28px 20px 32px;display:flex;flex-direction:column;align-items:flex-start;width:100%}
  .tr-hero-img{object-position:42% 40%;z-index:0}
  .tr-end-img{z-index:0}
  .tr-hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(252,252,251,.93) 0,rgba(252,252,251,.8) 34%,rgba(252,252,251,.35) 54%,rgba(252,252,251,0) 74%)}
  .tr-end::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(18,18,20,.82) 0,rgba(18,18,20,.6) 44%,rgba(18,18,20,.2) 66%,rgba(18,18,20,0) 84%)}
  .tr-hero .tr-art>*:not(img),.tr-end .tr-art>*:not(img){position:relative;left:auto;top:auto;width:auto;z-index:2}
  .tr-kick{position:static;display:block;white-space:normal;margin-bottom:10px;font-size:11px;letter-spacing:.12em}
  .tr-big{font-size:34px;line-height:1.1;letter-spacing:-.02em}
  .tr-big br,.tr-h2 br,.tr-lede br,.tr-p br,.tr-end-h br{display:none}
  .tr-lede{--fm:16px;--lm:1.5;margin-top:14px!important;max-width:30em}
  .t-trainer .tr-btn{margin-top:20px;height:48px;padding:0 22px;font-size:15px;border-radius:5px}
  .t-trainer .tr-btn svg{width:15px;height:15px}
  .tr-tag{--fm:14px;--lm:1.4;margin-top:14px!important}
  .t-trainer .tr-hero .tr-doc{position:relative;left:auto;top:auto;width:100%;max-width:330px;height:auto;margin-top:26px;align-self:flex-start;
    --u:calc(min(100vw - 40px,330px) / 246);min-height:calc(288 * var(--u))}
  .t-trainer .tr-doc>*{position:absolute}
  .tr-h2{--fm:28px;--lm:1.15;letter-spacing:-.02em;text-align:left}
  .tr-p{--fm:16px;--lm:1.55;margin-top:12px!important;text-align:left;max-width:34em}
  .tr-flow .tr-art,.tr-sumsec .tr-art,.tr-price .tr-art,.tr-tpl .tr-art,.tr-proc .tr-art{padding-top:40px;padding-bottom:40px;display:flex;flex-direction:column;align-items:flex-start}
  .tr-line{display:none}
  .tr-steps{position:relative;inset:auto;display:grid;gap:18px;margin-top:24px!important;width:100%}
  .tr-steps li{display:grid;grid-template-columns:48px 1fr;column-gap:16px;align-items:center}
  .tr-disc{position:static;grid-row:span 2;width:48px;height:48px}
  .tr-disc-i{width:24px;height:24px}
  .tr-step-h{--fm:19px;--lm:1.2;text-align:left}
  .tr-step-p{--fm:15px;--lm:1.45;text-align:left;margin-top:2px!important}
  .tr-step-p br{display:none}
  .t-trainer .tr-sum{position:relative;left:auto;top:auto;width:100%;max-width:443px;height:auto;margin-top:24px;
    --u:calc(min(100vw - 40px,443px) / 443);min-height:calc(266 * var(--u))}
  .t-trainer .tr-sum>*{position:absolute}
  .tr-panels{position:relative;inset:auto;display:grid;gap:18px;margin-top:24px!important;width:100%}
  .tr-panel{position:relative;left:auto;top:auto;width:100%;height:auto;padding:20px;grid-template-columns:44px 1fr;column-gap:14px}
  .tr-panel-i{width:32px;height:32px}
  .tr-panel h3{font-size:19px}
  .tr-panel p{font-size:15px;line-height:1.5}
  .tr-panel p br{display:none}
  .tr-panel-l{gap:14px;margin-top:12px}
  .t-trainer .tr-panel-a{font-size:15px}
  .tr-panel-a svg{width:15px;height:15px}
  .tr-tpl .tr-art{display:grid;gap:26px;justify-items:center}
  .t-trainer .tr-tp{position:relative;left:auto!important;top:auto!important;width:min(330px,100%);height:auto;aspect-ratio:227/222;
    --u:calc(min(100vw - 40px,330px) / 227)}
  .tr-tp2{order:0}
  .tr-tp .t10-edit{bottom:14%;font-size:13px;padding:10px 14px}
  /* the band's words are siblings of the band, so on a phone the section itself becomes the band */
  .tr-pay{padding:10px 20px}
  .t-trainer .tr-pay .tr-art{display:block;background:var(--tr-slate);border-radius:12px;padding:26px 22px}
  .tr-pay-band{display:none}
  .t-trainer .tr-pay .tr-art>*{position:relative;left:auto!important;top:auto!important;width:auto!important}
  .tr-pay-inner{}
  .tr-pay-h{--fm:24px;--lm:1.2}
  .tr-pay-m{--fm:17px;--lm:1.4;margin-top:8px!important}
  .tr-pay-u{--fm:15px;--lm:1.4;margin-top:4px!important}
  .tr-qr{width:112px!important;height:112px;margin-top:18px}
  .tr-hand-w{font-size:22px;line-height:1.2;transform:rotate(-4deg);margin-top:16px!important}
  .tr-swoosh{display:none}
  .tr-proc-l{position:relative;inset:auto;display:grid;gap:22px;margin-top:22px!important;width:100%}
  .tr-proc-l li{display:grid;grid-template-columns:30px 1fr;column-gap:14px;align-items:center}
  .tr-pi{width:26px;height:26px;grid-row:span 2}
  .tr-pt{--fm:18px;--lm:1.3;text-align:left}
  .tr-pp{--fm:15px;--lm:1.45;text-align:left;margin-top:2px!important}
  .tr-pp br{display:none}
  .tr-chev{display:none}
  .tr-links{padding:34px 0 30px}
  .t-trainer .tr-links-in{display:block;width:auto;padding:0 20px}
  .tr-col{margin-bottom:26px}
  .tr-col-h{--fm:20px;--lm:1.2}
  .t-trainer .tr-link{font-size:16px;line-height:1.5}
  .t-trainer .tr-faq summary{font-size:16px;line-height:1.5;padding-bottom:14px}
  .t-trainer .tr-faq .a p{font-size:15px;line-height:1.6}
  .tr-end{min-height:320px;display:flex}
  .tr-end-img{object-position:56% 50%}
  .tr-end .tr-art{padding:30px 20px 36px;display:flex;flex-direction:column;align-items:flex-start;width:100%}
  .tr-end-h{--fm:28px;--lm:1.15}
  .tr-end .tr-eyebrow{--fm:11px;--lm:1.3}
}

/* the papers show the real designs they link to, top of the page first */
.t-trainer .tr-tp{overflow:hidden}
.t-trainer .tr-tp .tr-shot{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;display:block}
@media (max-width:899px){.t-trainer .tr-tp .tr-shot{position:absolute}}

/* the second panel has two links; wrapped, the second fell below the fixed-height panel under the next section (23 Sep 2026) */
@media (min-width:900px){.tr-panel-l{flex-wrap:nowrap;gap:calc(14 * var(--u))}.t-trainer .tr-panel-a{white-space:nowrap}}