/* ===== GTM Engineering page (solutions/gtm-engineering/page.css). Every class carries the gtx- prefix; kit classes are bmk-, page types pt-.
   T3 detail page: breadcrumb, family strip, split hero with one contained film (the page's only loop), then the body.
   Cut and veiled 11 Nov 2026 (brief 3): proof strip, the gate (three checks), day one, questions, close. The gate sits on
   white with a hairline. Ink text and tags, one amber spark per visual. Breakpoints follow the site: 1080, 820, 560 (640 for the film). */
.gtx-k{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--taupe)}
.gtx-cap{margin-top:14px;font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--taupe);text-align:center}
.gtx-side-lede{max-width:30ch}
.gtx-badge{display:inline-flex;align-items:center;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:6px;background:var(--ink);color:#FFFFFF;white-space:nowrap}

/* ---------- 1 · hero: the film frame (square 1000 x 1000; upright 720 x 1080 on phones) ---------- */
.gtx-hero .pt-hero-visual>.film{aspect-ratio:1/1}
@media (max-width:640px){.gtx-hero .pt-hero-visual>.film{aspect-ratio:720/1080}}

/* ---------- 2 · proof strip ---------- */
.gtx-proof-cell{padding-block:clamp(30px,3.6vw,48px)!important}
.gtx-proof-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.gtx-pf{display:flex;flex-direction:column;gap:14px;padding:4px clamp(16px,2.4vw,36px);border-left:1px solid var(--rule);min-width:0}
.gtx-pf:first-child{padding-left:0;border-left:0}
.gtx-pf>b{font-family:var(--mono);font-weight:500;font-size:clamp(34px,3.6vw,52px);letter-spacing:-.05em;line-height:1;white-space:nowrap}
.gtx-pf-l{font-size:15px;line-height:1.45;color:var(--fg2);max-width:34ch}
.gtx-pf-viz{display:flex;align-items:center;position:relative;height:34px}
/* 302 of 302: a row of ticks, every one lights */
.gtx-pf-ticks{width:min(100%,232px);background:repeating-linear-gradient(90deg,var(--sand2) 0 5px,transparent 5px 9px) 0 50%/100% 22px no-repeat}
.gtx-pf-ticks i{position:absolute;inset:6px 0;background:repeating-linear-gradient(90deg,var(--ink) 0 5px,transparent 5px 9px);clip-path:inset(0 100% 0 0);transition:clip-path 1.2s var(--bmk-move)}
.bmk-seen .gtx-pf-ticks i{clip-path:inset(0 0 0 0)}
/* 40 s: five conversations by length; the ones past the line are read */
.gtx-pf-len{width:min(100%,232px);flex-direction:column;align-items:stretch;justify-content:center;gap:3.5px}
.gtx-pf-len i{display:block;height:4px;border-radius:2px;background:var(--sand2);width:calc(var(--w) * 100%);transform-origin:0 50%;transform:scaleX(0);transition:transform .95s var(--bmk-move),background-color .4s ease .9s}
.gtx-pf-len i:nth-child(2){transition-delay:.07s,.9s}.gtx-pf-len i:nth-child(3){transition-delay:.14s,.9s}.gtx-pf-len i:nth-child(4){transition-delay:.21s,.9s}.gtx-pf-len i:nth-child(5){transition-delay:.28s,.9s}
.bmk-seen .gtx-pf-len i{transform:scaleX(1)}
.bmk-seen .gtx-pf-len i.gtx-on{background:var(--ink)}
.gtx-pf-len em{position:absolute;left:40%;top:-2px;bottom:-2px;width:0;border-left:1.5px dashed var(--taupe)}
/* v1 -> v3: three versions of one page */
.gtx-pf-pages{gap:8px}
.gtx-pf-pages i{position:relative;display:flex;flex-direction:column;justify-content:center;gap:3px;width:22px;height:28px;padding:0 4px;border-radius:4px;box-shadow:inset 0 0 0 1.5px var(--sand3);opacity:0;transform:translateY(6px);transition:opacity .45s ease,transform .55s var(--bmk-enter)}
.gtx-pf-pages i s{display:block;height:2px;border-radius:1px;background:var(--sand3)}
.gtx-pf-pages i s:last-child{width:60%}
.gtx-pf-pages i.gtx-on{box-shadow:none;background:var(--ink)}
.gtx-pf-pages i.gtx-on s{background:#FFFFFF}
.gtx-pf-pages u{display:block;width:12px;height:1.5px;background:var(--sand3);position:relative}
.gtx-pf-pages u::after{content:"";position:absolute;right:-1px;top:-3px;width:6px;height:6px;border-top:1.5px solid var(--sand3);border-right:1.5px solid var(--sand3);transform:rotate(45deg)}
.gtx-pf-pages i:nth-of-type(2){transition-delay:.18s}.gtx-pf-pages i:nth-of-type(3){transition-delay:.36s}
.bmk-seen .gtx-pf-pages i{opacity:1;transform:none}
.gtx-proof-src{margin-top:22px;font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--fg3)}
@media (max-width:820px){
  .gtx-proof-row{grid-template-columns:minmax(0,1fr)}
  .gtx-pf{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"b viz" "l l";column-gap:20px;row-gap:12px;align-items:center;padding:20px 0;border-left:0;border-top:1px solid var(--rule)}
  .gtx-pf:first-child{padding-top:0;border-top:0}
  .gtx-pf>b{grid-area:b}.gtx-pf-viz{grid-area:viz;justify-self:end}.gtx-pf-l{grid-area:l}
  .gtx-pf-ticks,.gtx-pf-len{width:min(100%,160px)}
}

/* ---------- 3 · the gate: three checks, the card rides through them ---------- */
.gtx-gt{--cw:220px;--m:20px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"h o" "lane lane";align-items:center;gap:20px 24px;padding:clamp(20px,3vw,44px);border-radius:24px;background:var(--paper);box-shadow:inset 0 0 0 1px var(--rule)}
.gtx-gt-head{grid-area:h}
.gtx-gt-out{grid-area:o;justify-self:end;min-height:50px;display:flex;align-items:center}
.gtx-gt-lane{grid-area:lane;--u:0;--e:0;--s:calc((100% - 2 * var(--cw) - 2 * var(--m)) / 2);position:relative;display:grid;grid-template-columns:calc(var(--cw) + var(--m) - var(--s) / 2) repeat(3,var(--s)) minmax(0,1fr);grid-template-rows:176px auto;min-width:0}
.gtx-gt-rail,.gtx-gt-trail{grid-row:1;grid-column:1/-1;align-self:center;height:4px;border-radius:2px}
.gtx-gt-rail{background:var(--sand3)}
.gtx-gt-trail{justify-self:start;background:var(--ink);width:calc(var(--u) * var(--s) + var(--e) * (var(--cw) + 2 * var(--m)) + var(--cw) / 2)}
.gtx-gt-g{grid-row:1;justify-self:center;align-self:center;position:relative;width:14px;height:136px}
.gtx-gt-g[data-i="0"],.gtx-gt-l[data-i="0"]{grid-column:2}
.gtx-gt-g[data-i="1"],.gtx-gt-l[data-i="1"]{grid-column:3}
.gtx-gt-g[data-i="2"],.gtx-gt-l[data-i="2"]{grid-column:4}
.gtx-gt-pin{position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:var(--paper)}
.gtx-gt-door{position:absolute;left:0;width:14px;height:68px;background:var(--ink)}
.gtx-gt-up{top:0;border-radius:7px 7px 2px 2px}
.gtx-gt-dn{bottom:0;border-radius:2px 2px 7px 7px}
.gtx-gt-l{grid-row:2;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:4px 6px 0;min-width:0}
.gtx-gt-st{position:relative;flex:none;width:34px;height:34px;border-radius:50%;background:var(--object);box-shadow:inset 0 0 0 1.5px var(--hair2)}
.gtx-gt-st i{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.gtx-gt-st svg{width:16px;height:16px}
.gtx-gt-ok{color:#FFFFFF}
.gtx-gt-no{color:var(--ink)}
.gtx-gt-seg{display:none}
.gtx-gt-lt{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0}
.gtx-gt-lt b{font-size:clamp(16px,1.35vw,19px);line-height:1.2;letter-spacing:-.02em;font-weight:600}
.gtx-gt-ld{font-size:14px;line-height:1.4;color:var(--fg3);max-width:24ch}
.gtx-gt-cw{position:absolute;grid-row:1/2;grid-column:1/-1;top:0;bottom:0;left:calc(var(--u) * var(--s) + var(--e) * (var(--cw) + 2 * var(--m)));width:var(--cw);display:flex;align-items:center;z-index:2}
.gtx-gt-card{width:100%;display:flex;flex-direction:column;gap:4px;padding:16px 18px 17px;border-radius:16px;background:var(--object);box-shadow:var(--bmk-lift)}
.gtx-gt-when{font-family:var(--mono);font-size:12.5px;letter-spacing:.03em;color:var(--taupe)}
.gtx-gt-co{font-size:19px;line-height:1.2;letter-spacing:-.022em;font-weight:700}
.gtx-gt-who{font-size:14px;line-height:1.35;color:var(--fg3)}
.gtx-gt-yes,.gtx-gt-nope{display:flex;align-items:center;gap:14px}
.gtx-gt-stamp{display:inline-flex;align-items:center;height:46px;padding:0 18px;border-radius:10px;background:var(--amber);font-family:var(--mono);font-size:15px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.gtx-gt-by{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--taupe)}
.gtx-gt-void{flex:none;display:inline-flex;align-items:center;height:46px;padding:0 16px;border-radius:10px;border:1.5px dashed #C4C7CD;background:#F2F3F4;font-family:var(--mono);font-size:13.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}
.gtx-gt-why{font-size:15px;line-height:1.4;color:var(--fg2);max-width:36ch}
@media (max-width:1239px){.gtx-gt{--cw:188px;--m:16px}.gtx-gt-ld{font-size:13.5px}}
/* below 1081 px the gate stands up: the meeting on the left, the checks as a list that fills on the right */
@media (max-width:1080px){
  .gtx-gt{grid-template-columns:minmax(0,250px) minmax(0,1fr);grid-template-areas:none;align-items:start;column-gap:clamp(20px,4vw,44px);row-gap:0}
  .gtx-gt-head{grid-column:1/-1;grid-row:1;padding-bottom:20px}
  .gtx-gt-lane{display:contents}
  .gtx-gt-rail,.gtx-gt-trail,.gtx-gt-g{display:none}
  .gtx-gt-cw{position:static;grid-column:1;grid-row:2/span 2;width:auto;display:block}
  .gtx-gt-out{grid-column:1;grid-row:4;justify-self:start;align-self:start;padding-top:18px;min-height:0}
  .gtx-gt-yes,.gtx-gt-nope{flex-direction:column;align-items:flex-start;gap:10px}
  .gtx-gt-l[data-i]{grid-column:2;flex-direction:row;align-items:flex-start;text-align:left;gap:16px;padding:0 0 24px}
  .gtx-gt-l[data-i="0"]{grid-row:2}.gtx-gt-l[data-i="1"]{grid-row:3}.gtx-gt-l[data-i="2"]{grid-row:4;padding-bottom:0}
  .gtx-gt-lt{align-items:flex-start;padding-top:5px}
  .gtx-gt-ld{max-width:none}
  .gtx-gt-l::before{content:"";position:absolute;left:16px;top:38px;bottom:4px;width:2px;border-radius:1px;background:var(--sand3)}
  .gtx-gt-seg{display:block;position:absolute;left:16px;top:38px;bottom:4px;width:2px;border-radius:1px;background:var(--ink)}
  .gtx-gt-l[data-i="2"]::before,.gtx-gt-l[data-i="2"] .gtx-gt-seg{display:none}
}
@media (max-width:560px){
  .gtx-gt{grid-template-columns:minmax(0,1fr)}
  .gtx-gt-cw{grid-column:1;grid-row:2;padding-bottom:22px}
  .gtx-gt-l[data-i]{grid-column:1}
  .gtx-gt-l[data-i="0"]{grid-row:3}.gtx-gt-l[data-i="1"]{grid-row:4}.gtx-gt-l[data-i="2"]{grid-row:5}
  .gtx-gt-out{grid-column:1;grid-row:6;padding-top:22px}
}

/* ---------- 4 · day one, and the page's one open question ---------- */
.gtx-dy{display:grid;grid-template-columns:minmax(0,5fr) auto minmax(0,7fr);gap:clamp(14px,2.2vw,32px);align-items:center}
.gtx-led,.gtx-memo{background:var(--object);border-radius:22px;box-shadow:var(--bmk-lift);padding:clamp(20px,2.8vw,40px);min-width:0}
.gtx-led{display:flex;flex-direction:column;gap:clamp(18px,2vw,26px)}
.gtx-led-top,.gtx-memo-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1.5px solid var(--ink)}
.gtx-led-r{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"n l" "b b";column-gap:16px;row-gap:12px;align-items:baseline}
.gtx-led-n{grid-area:n;font-family:var(--mono);font-size:clamp(46px,5.2vw,76px);font-weight:500;letter-spacing:-.055em;line-height:1;transform-origin:0 80%}
.gtx-led-l{grid-area:l;font-size:16.5px;line-height:1.35;color:var(--fg2)}
.gtx-led-bar{grid-area:b;display:block;height:14px;border-radius:7px;background:var(--sand0)}
.gtx-led-bar u{display:block;height:100%;border-radius:7px;background:var(--ink)}
.gtx-led-zero .gtx-led-bar{background:transparent;border:1.5px dashed var(--hair2)}
.gtx-dy-ar{display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--ink)}
.gtx-memo{position:relative;display:flex;flex-direction:column;gap:18px}
.gtx-memo-tab{position:absolute;left:clamp(20px,2.8vw,40px);top:0;width:56px;height:5px;border-radius:0 0 3px 3px;background:var(--amber)}
.gtx-memo-d{font-size:14px;color:var(--fg3)}
.gtx-ms{display:flex;flex-direction:column;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--hair)}
.gtx-ms:nth-last-of-type(1){border-bottom:0}
.gtx-ms-h{display:flex;align-items:baseline;gap:6px 12px;flex-wrap:wrap}
.gtx-ms-n{font-family:var(--mono);font-size:clamp(34px,3.4vw,48px);font-weight:500;letter-spacing:-.05em;line-height:1}
.gtx-ms-l{font-size:17px;font-weight:600;letter-spacing:-.015em}
.gtx-ms-tag{margin-left:auto;align-self:center;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:6px;background:var(--sand0);color:var(--taupe);white-space:nowrap}
.gtx-ms-bars{display:flex;flex-wrap:wrap;gap:7px}
.gtx-ms-bars i{display:block;width:var(--w);height:14px;border-radius:7px;background:var(--sand2)}
.gtx-ms-lines{flex-direction:column;gap:8px}
.gtx-ms-lines i{height:11px;border-radius:6px}
.gtx-memo-res{display:flex;flex-direction:column;gap:6px;padding-top:14px;border-top:1.5px solid var(--ink)}
.gtx-memo-res p{font-size:clamp(17px,1.5vw,21px);color:var(--fg);margin:0}
.gtx-memo-res b{font-family:var(--mono);font-weight:500;font-size:clamp(26px,2.6vw,36px);letter-spacing:-.04em}
.gtx-memo-res i{font-style:normal;color:var(--taupe);margin:0 6px}
.gtx-memo-foot{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--fg3)}
.gtx-ask{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;margin-top:clamp(20px,2.4vw,32px);padding:clamp(18px,2.2vw,28px) clamp(20px,2.6vw,36px);border-radius:20px;background:var(--sand0)}
.gtx-ask p{flex:1 1 300px;font-size:clamp(18px,1.6vw,21px);line-height:1.4;letter-spacing:-.015em;color:var(--fg2)}
.gtx-ask p b{color:var(--fg);font-weight:600}
.gtx-ask .btn{flex:none}
@media (max-width:1080px){
  .gtx-dy{grid-template-columns:minmax(0,1fr);justify-items:stretch}
  .gtx-dy-ar{flex-direction:row;justify-content:center;align-items:center;height:76px;gap:4px}
  .gtx-dy-ar svg{flex:none;transform:rotate(90deg);margin:0 -20px}
}

/* ---------- 5 · questions ---------- */
.gtx-faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(24px,5vw,88px);align-items:start}
.gtx-faq-head{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
@media (max-width:820px){.gtx-faq-grid{grid-template-columns:minmax(0,1fr)}.gtx-faq-head{position:static}}

/* ---------- 6 · close: the reason to book ---------- */
.gtx-end-cell{padding-block:clamp(84px,10vw,150px)!important}
.gtx-end{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:end}
.gtx-end-head{display:flex;flex-direction:column;gap:22px}
.gtx-end-h{font-size:clamp(42px,6.2vw,96px);max-width:12ch}
.gtx-end-act{display:flex;flex-direction:column;align-items:flex-start;gap:20px;padding-bottom:10px}
.gtx-end-s{font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:var(--fg2);max-width:36ch}
.gtx-next{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:baseline;gap:8px 18px;margin-top:clamp(40px,5vw,64px);padding:22px 4px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);color:inherit}
.gtx-next:hover{text-decoration:none;background:var(--subtle)}
.gtx-next b{font-size:clamp(20px,1.9vw,26px);letter-spacing:-.025em}
.gtx-next span:not(.gtx-k){font-size:15px;color:var(--fg3)}
.gtx-next i{font-style:normal;font-size:22px;transition:transform .2s ease}
.gtx-next:hover i{transform:translateX(4px)}
@media (max-width:820px){.gtx-end{grid-template-columns:minmax(0,1fr);align-items:start}}
@media (max-width:560px){.gtx-next{grid-template-columns:auto minmax(0,1fr) auto}.gtx-next span:not(.gtx-k){grid-column:1/-1;grid-row:2}}