/* HORSECHAMP global settings: one place for the content width, the heading scale and the shared control shapes.
   Loaded last (after system.css). Change a value here and it applies to all four brands. */
:root{
  /* content column (client mock-up .wrap, widened on request 25.10.2026) */
  --hc-max:1520px;
  --hc-gutter-desktop:40px;
  --hc-gutter-tablet:24px;
  --hc-gutter-phone:14px;

  /* heading scale: size, weight and line height for every page */
  --hc-h1-size:clamp(40px,4.9vw,78px);   --hc-h1-weight:500; --hc-h1-lh:1.05;
  --hc-h2-size:clamp(30px,3.3vw,54px);   --hc-h2-weight:500; --hc-h2-lh:1.1;
  --hc-h3-size:clamp(20px,1.6vw,26px);   --hc-h3-weight:500; --hc-h3-lh:1.25;
  --hc-h4-size:clamp(16px,1.15vw,19px);  --hc-h4-weight:600; --hc-h4-lh:1.3;
  --hc-serif-weight:400;                 /* ZOVII headings in Georgia */

  /* controls */
  --hc-btn-radius:999px;
  --hc-card-radius:22px;
}

/* the column is derived from the tokens above */
:root{--hc-col:max(var(--hc-gutter-desktop),calc((var(--hc-vw,100vw) - var(--hc-max)) / 2))}
@media (max-width:1000px){:root{--hc-col:var(--hc-gutter-tablet)}}
@media (max-width:650px){:root{--hc-col:var(--hc-gutter-phone)}}
body[class] #app .wrap{width:min(var(--hc-max),calc(100% - 2 * var(--hc-gutter-desktop)))!important}
@media (max-width:1000px){body[class] #app .wrap{width:calc(100% - 2 * var(--hc-gutter-tablet))!important}}
@media (max-width:650px){body[class] #app .wrap{width:calc(100% - 2 * var(--hc-gutter-phone))!important}}

/* one heading scale everywhere: section H2 (tagged .hc-h2 by app.js), card-level H2 and all H3 share the H3 step; device mock-ups keep their own scale */
body[class] #app h1{font-size:var(--hc-h1-size)!important;font-weight:var(--hc-h1-weight)!important;line-height:var(--hc-h1-lh)!important}
body[class] #main h2.hc-h2{font-size:var(--hc-h2-size)!important;font-weight:var(--hc-h2-weight)!important;line-height:var(--hc-h2-lh)!important}
body[class] #main h2:not(.hc-h2):not(:is([class*="phone"],[class*="screen"],[class*="monitor"],.ewr-doc,svg) *),
body[class] #main h3:not(:is([class*="phone"],[class*="screen"],[class*="monitor"],.ewr-doc,svg) *){font-size:var(--hc-h3-size)!important;font-weight:var(--hc-h3-weight)!important;line-height:var(--hc-h3-lh)!important}
body[class] #main h4:not(:is([class*="phone"],[class*="screen"],[class*="monitor"],.ewr-doc,svg) *){font-size:var(--hc-h4-size)!important;font-weight:var(--hc-h4-weight)!important;line-height:var(--hc-h4-lh)!important}
html body.zovii[class] #app :is(h1,h2,h3){font-weight:var(--hc-serif-weight)!important}

/* ---------- fixes 25.10.2026 (second client review) ---------- */
/* HC About "Gdzie chcesz pójść dalej": the arrow belongs inside the button; all four cards light */
.hca-go .hc-card-cta i{position:static!important;inset:auto!important;width:auto!important;height:auto!important;border:0!important;background:none!important;display:inline!important;transform:none;color:inherit!important;font-size:inherit}
.hca-go.hca-go-contact{background:#fff!important;color:#102148!important}
.hca-go.hca-go-contact b{color:#102148!important}.hca-go.hca-go-contact>span:not(.hca-go-ph){color:#5e6b80!important}
.hca-go .hc-card-cta,.hca-go:hover .hc-card-cta{background:#081f5c!important;color:#fff!important}
.hca-go-zovii .hc-card-cta,.hca-go-zovii:hover .hc-card-cta{background:#63001f!important}
.hca-go-emg .hc-card-cta,.hca-go-emg:hover .hc-card-cta{background:#7655e8!important}
/* HC Partners "Jak zaczynamy": all four steps on one line; the active step is marked by colour only */
.hpx-steps li,.hpx-steps li.is-on{transform:none!important;margin-top:0!important}
/* one shape for every button on every page (contact forms had 16px corners) and for every form field */
:root{--hc-field-radius:14px}
body[class] #app :is(.button,a.button,button.button,.thx-button,.emgx-btn,.zv-btn,.hc-btn,.hca-btn,.hcw-about-btn,.hcw-talk-btn,.hc-card-cta,.tp-mini-go,.config-json,.nav-cta,.emgsc2-go){border-radius:var(--hc-btn-radius)!important}
body[class] #main :is(input:not([type=radio]):not([type=checkbox]):not([type=range]),select,textarea){border-radius:var(--hc-field-radius)!important}
/* buttons rendered as <em> must not take the brand's italic-accent colour (TH "Zastosowania": blue on blue) */
body[class] #app :is(em.hc-card-cta,em.tp-mini-go,.hc-card-cta,.tp-mini-go),body[class] #app :is(em.hc-card-cta,em.tp-mini-go,.hc-card-cta,.tp-mini-go) *{color:#fff!important;font-style:normal!important}
body[class] #app .hc-card-cta.is-light,body[class] #app .hc-card-cta.is-light *{color:#102148!important}
/* TH water treadmill table card: footnote and button get the card's inner padding */
body.technohorse .thw-table-wrap{padding-bottom:24px!important}
body.technohorse .thw-table-wrap>:not(table){margin-left:22px!important;margin-right:22px!important}
body.technohorse .thw-table-wrap>:not(table):first-of-type{margin-top:16px}
body.technohorse .thw-table-wrap :is(a,button){margin-top:16px}
body.emg .emgsc2-go{width:max-content!important;max-width:100%;align-self:flex-start!important;justify-self:start!important}
/* reveal masks finish with room for shadows and rings on every element (EMG "Od zgłoszenia…" number rings were cut) */
#main [data-reveal].is-in{clip-path:inset(-56px)}
/* EMG six steps: the record sheet follows the figure's rounded corners, so its frame is not cut at the bottom */
body.emg .emgs-figure.hc-round .emgs-sheet{border-radius:0 0 24px 24px;overflow:hidden}
/* EMG subpage heroes: a wider copy column so the H1 gets room; the synthetic signal fills the rest up to the page column */
@media (min-width:1001px){body.emg .emp-hero .emp-hero-copy{width:min(1040px,64%)!important}body.emg .emp-hero .emp-hero-copy h1{max-width:none!important}body.emg .emp-hero .emp-hero-copy>p{max-width:60ch!important}}
/* EMG specialists "Co zyskujesz": photo cards keep the caption at the bottom of the photo, UI cards keep the copy at the bottom */
body.emg .esg-t{justify-content:flex-end!important}
body.emg .esg-t>.esg-copy{margin-top:auto}
body.emg .esg-t>.esg-ui{margin-bottom:18px}
@media (min-width:1101px){body.emg .esg-f{grid-column:span 4!important}body.emg .esg-a{min-height:460px!important}}
/* EMG fact strips (Badanie, Aplikacja): icon tile + step number, glass card with a full shadow */
body.emg .eap-facts ul{gap:18px}
body.emg .eap-facts li{position:relative;display:flex;flex-direction:column;gap:0;padding:26px 26px 28px!important;border-radius:var(--hc-card-radius)!important;background:rgba(255,255,255,.82)!important;-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);border:1px solid #fff;box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(16,24,40,.05),0 22px 44px -20px rgba(16,24,40,.28)!important;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
body.emg .eap-facts li:hover{transform:translateY(-3px)}
body.emg .eap-fact-ico{display:grid;place-items:center;width:52px;height:52px;margin-bottom:22px;border-radius:16px;background:linear-gradient(145deg,#efeaff,#e3dcff);color:#6a4fe0;box-shadow:inset 0 1px 0 #fff,0 8px 18px -10px rgba(106,79,224,.55)}
body.emg .eap-fact-ico svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
body.emg .eap-fact-n{position:absolute;top:26px;right:26px;font-size:12px;font-weight:600;letter-spacing:.08em;color:#9aa3c0}
body.emg .eap-facts b{font-size:19px!important}
body.emg .eap-facts+.ebv{margin-top:0!important;padding-top:0!important}
@media (min-width:1001px){body.emg .eap-facts+.ebv .ebv-pin{padding-top:60px!important}}
/* "Przebieg wizyty": pin hugs its content and sticks centred, so no empty band above the heading */
@media (min-width:901px){body.emg #main .eap-facts+.ebv{padding-top:16px!important}body.emg #main .ebv:not(.is-flat) .ebv-pin{height:auto!important;top:max(84px,calc(50svh - var(--ebv-h,700px)/2))!important;padding-top:24px!important;padding-bottom:24px!important;justify-content:flex-start!important}}
/* ---------- fixes after the independent verification (25.10.2026) ---------- */
/* TH water treadmill: the BASIC/PREMIUM table fits a phone */
@media (max-width:600px){body.technohorse .thw-table{width:100%!important;min-width:0!important;table-layout:fixed}body.technohorse .thw-table :is(th,td){padding-left:8px!important;padding-right:8px!important;font-size:13px!important;overflow-wrap:anywhere}}
/* TECHNOHORSE pages follow the shared column */
body.technohorse .tp .tp-shell{max-width:var(--hc-max)!important}
/* EMG "Ten sam zapis. Dwa ekrany": both cards share rows, so screens, titles and buttons line up */
@media (min-width:1001px){body.emg .emgsc2-grid{grid-template-rows:repeat(5,auto)}body.emg .emgsc2-card{display:grid!important;grid-row:1/6;grid-template-rows:subgrid;row-gap:0}body.emg .emgsc2-card.is-owner{grid-column:1}body.emg .emgsc2-card.is-pro{grid-column:3}body.emg .emgsc2-link{grid-row:1/6;grid-column:2}body.emg .emgsc2-card .emgsc2-go{align-self:end!important}}
/* EMG "Sześć kroków": one frame around the whole figure, drawn above the photo and the record sheet */
body.emg .emgs-figure.hc-round::after{content:"";position:absolute;inset:0;z-index:3;border:1px solid rgba(10,17,63,.22);border-radius:inherit;pointer-events:none}
body.emg .emgs.is-dark .emgs-figure.hc-round::after{border-color:rgba(230,239,233,.22)}
body.emg .emgs-figure.hc-round .emgs-sheet{border-left:0!important;border-right:0!important;border-bottom:0!important}
/* ---------- client review 25.10.2026 (round 3) ---------- */
/* EMG: no impulse animation in heroes on phones */
@media (max-width:760px){body.emg :is(.emp-scan,[data-emp-scan],.emgh-ring,.emgh-lens){display:none!important}}
/* outline buttons keep their own text colour on hover: only a light tint of that colour (contact heroes had dark text on a dark fill) */
body[class] #app .button.secondary:is(:hover,:focus-visible){background:color-mix(in srgb,currentColor 10%,transparent)!important;background-image:none!important}
/* HC Partners: the pinned brand rail starts right under the header, heading close to its cards */
@media (min-width:901px){body.portal .hpx-h .hpx-sticky{justify-content:flex-start;padding-top:96px;gap:28px}body.portal .hpx-h .hpx-h-head{margin-top:0!important;margin-bottom:0!important;padding-top:0!important}body.portal .hpq{padding-bottom:40px!important}body.portal .hpx-h+.hpx-merge{padding-top:16px!important}}
/* closing banners never sit glued to the panel above them */
body[class] #main :is(.thx-final,.emp-final2,.zs-final,.zv-final,.zvc-finale,.hpx-final){margin-top:clamp(28px,3vw,44px)!important}
/* TH Distribution "Kto odpowiada": every relay card and legend chip on one line (a global li+li margin pushed all but the first) */
body.technohorse :is(.tv-relay,.tv-relay-legend)>li{margin:0!important}
body.technohorse .tv-relay-legend>li{height:36px!important;min-height:0!important;padding-top:0!important;padding-bottom:0!important;display:inline-flex!important;align-items:center}
body.technohorse .tv-make>li{margin:0!important}
body.emg .emo-steps>li,body.zovii .zv2-grid>li{margin:0!important}
/* TH device pages: option list as tidy tiles (label left, status pill right, vertically centred) */
body.technohorse .tp-opts{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))!important;gap:12px!important;border-top:0!important;margin-top:28px!important}
body.technohorse .tp-opts li{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px;min-height:64px;padding:14px 16px 14px 18px!important;border:1px solid rgba(16,33,72,.1)!important;border-radius:16px!important;background:#fff;font-size:14px;line-height:1.35;color:#102148}
body.technohorse .tp-opts li i{flex:none;padding:5px 10px;border-radius:999px;background:rgba(54,93,202,.09);color:#2f4fae!important;font-size:10px;font-weight:600;letter-spacing:.08em;white-space:nowrap}
/* ZOVII trunk page: the comparison table sits below the spec section, outside the sticky drawing's reach */
body.zovii .zv-spec{padding-bottom:clamp(40px,4vw,64px)!important}
body.zovii .zv-spec-compare{margin-top:0!important;padding-bottom:clamp(64px,7vw,110px)}
body.zovii .zv-spec-compare .zv-table-wrap{overflow-x:auto}
body.zovii .zv-spec-compare table{width:100%;min-width:640px}
/* ZOVII L / XL toggles: labels centred in their pill */
body.zovii .zv-toggle button{display:inline-flex!important;align-items:center!important;justify-content:center!important;line-height:1!important}
/* HC home: H1 in two lines on desktop (client request), the intro column gives up a little width */
@media (min-width:1001px){body.portal .hcx-head{grid-template-columns:minmax(0,1fr) minmax(260px,24%)!important;column-gap:32px!important}}
@media (min-width:1001px) and (max-width:1250px){body.portal #app .hcx-head h1{font-size:4.4vw!important}}
/* HC About "Informacje o koniu są dziś rozproszone": pinned scene centred in the screen, shorter scroll runway (no empty half screen under it) */
@media (min-width:901px){body.portal .hca-problem{height:200vh!important}body.portal .hca-problem .hca-pin{align-items:center!important;padding-top:76px!important}body.portal .hca-problem .hca-pin>.wrap{margin-top:auto!important;margin-bottom:auto!important}}
@media (max-width:900px){body.portal .hca-problem{height:200vh!important}}
/* EMG subpage heroes: the copy column never shrinks; photo and signal are always background layers */
body.emg .emp-hero>:not(.emp-hero-copy){position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
body.emg .emp-hero>.emp-hero-copy{flex:0 0 auto!important;max-width:100%}
@media (min-width:1001px){body.emg .emp-hero>.emp-hero-copy{min-width:min(680px,100%)!important}}
/* after the second verification (26.10.2026) */
@media (max-width:600px){body.technohorse .tp-sec.hc-panel{padding-top:48px!important}body.technohorse .tp-faq{padding-top:56px!important}}
body.technohorse .tv-relay-legend{display:grid!important;grid-template-columns:repeat(3,minmax(0,max-content));gap:8px!important}
body.technohorse .tv-relay-legend>li{justify-content:center}
@media (max-width:600px){body.technohorse .tv-relay-legend{grid-template-columns:repeat(3,minmax(0,1fr))}body.technohorse .tv-relay-legend>li{font-size:12px!important;padding:0 8px 0 4px!important;gap:4px}}
@media (max-width:1000px){body.zovii .zv2-origin{padding-bottom:clamp(18px,4vw,33px)!important}}
body.zovii .zv3-faq{padding-bottom:24px!important}
body.emg .eap-roles .eap-role-copy{min-height:150px}
/* ZOVII trunk comparison: the table keeps its ZOVII styling after moving out of .zv-compare */
body.zovii .zv-spec-compare .zv-table-wrap{padding:8px clamp(16px,2.4vw,32px) 12px;margin-bottom:0}
body.zovii .zv-spec-compare table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5;table-layout:fixed}
body.zovii .zv-spec-compare :is(th,td){text-align:left!important;vertical-align:top;padding:16px 18px 16px 0;border-bottom:1px solid rgba(39,36,31,.12)}
body.zovii .zv-spec-compare tr:last-child :is(th,td){border-bottom:0}
body.zovii .zv-spec-compare thead th{padding-top:18px;font:400 20px/1.2 Georgia,'Times New Roman',serif!important;color:#27241f;border-bottom:1px solid #27241f}
body.zovii .zv-spec-compare thead th:first-child,body.zovii .zv-spec-compare tbody th{width:24%}
body.zovii .zv-spec-compare tbody th{font-weight:500;color:#27241f}
body.zovii .zv-spec-compare td{color:#6b6459}
@media (max-width:700px){body.zovii .zv-spec-compare table{min-width:560px;font-size:14px}body.zovii .zv-spec-compare thead th{font-size:17px!important}}
body.zovii .zv-spec-compare{padding-bottom:24px!important}
/* footnotes under card grids sit clear of the cards' shadows */
body[class] #main :is([class*="grid"],[class*="cards"],[class*="list"])+:is(.emp-fine,.hpq-fine,.tp-fine,.zv-fine,.hc-fine){margin-top:28px!important}
body[class] #main .emp-actions+.emp-fine{margin-top:20px!important}
body.emg .eap-sync-steps+.eap-sync-fine{margin-top:14px!important}
body.portal .hpq-panels+.hpq-fine{margin-top:30px!important}
/* EMG Technology "Czynniki zakłócające zapis": synthetic-data label in the screen's bottom-left corner, clear of the status line; description clear of the toggles */
body.emg .etd-screen .emp-syn{top:auto!important;bottom:12px!important;left:22px!important;right:auto!important}
body.emg .etd-btns+.etd-text{margin-top:20px!important}
/* EMG outline buttons: on light sections hover fills navy with white text (like the rest of the site); on dark heroes and banners a light tint keeps the white text */
body.emg #app .emgx-btn-outline:is(:hover,:focus-visible){background:#081f5c!important;border-color:#081f5c!important;color:#fff!important}
body.emg #app .emgx-btn-outline:is(:hover,:focus-visible) *{color:inherit!important}
body.emg #app :is(.emgh,.emp-hero,.emgx-hero,.emp-final2,.thx-dark,.emgs.is-dark) .emgx-btn-outline:is(:hover,:focus-visible){background:rgba(255,255,255,.14)!important;border-color:#fff!important;color:#fff!important}
/* EMG owners: wide context photos above the report and the limits sections (illustrations, not real results) */
body.emg .ewx-ph{position:relative;margin:0 0 clamp(20px,2.4vw,32px);aspect-ratio:21/8;border-radius:var(--hc-card-radius);overflow:hidden;background:#dfe4ee}
body.emg .ewx-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:760px){body.emg .ewx-ph{aspect-ratio:16/10}}
/* the five order steps share one image shape */
body.emg .emo-step figure{aspect-ratio:4/3!important}
/* context photos (28.10.2026 set v3): wide, rounded, in the column; illustrations only */
body[class] #main .hc-ctx-ph{position:relative;margin:clamp(20px,2.4vw,32px) 0;aspect-ratio:21/8;border-radius:var(--hc-card-radius);overflow:hidden;background:#dfe4ee}
body[class] #main .hc-ctx-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:760px){body[class] #main .hc-ctx-ph{aspect-ratio:16/10}}
/* inside the HC About split columns the photo is a 16:9 tile under the copy */
body.portal #main .hca-split .hc-ctx-ph{aspect-ratio:16/9;margin:24px 0 0;max-width:560px}
@media (max-width:760px){body.zovii .zvc-hero-foot{display:none!important}}
/* horizontal photo stories (ZOVII route, TH installation): every frame on one line and in one size */
.thh-story.is-pinned .thh-frame:nth-of-type(n){transform:none!important}
.thh-story.is-pinned .thh-frame.is-wide .ph{width:49.6vh!important}
.thh-frame.is-wide{width:min(78vw,420px)}.thh-frame.is-wide .ph{aspect-ratio:4/5}
/* EMG checklists: the tick is a two-sided check mark (a later border shorthand turned it into a rotated square) */
body.emg .emp-tick::after{border-style:solid!important;border-color:#fff!important;border-width:0 2px 2px 0!important;left:7px;top:3px;width:5px;height:10px}
body.emg .emp-check input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
/* HC home brand portals: titles use the card width and break into two balanced lines */
body.portal #main .hcx-door .hcx-copy h2{max-width:none!important;width:auto!important;text-wrap:balance}
/* horizontal photo stories: the photo itself carries the rounded corners (the figure is wider than the photo when the caption is long) */
body[class] #main .thh-frame{border-radius:0!important;overflow:visible!important}
body[class] #main .thh-frame .ph{border-radius:var(--hc-card-radius)!important;overflow:hidden!important}
/* horizontal photo stories: the caption never runs wider than its photo */
.thh-story.is-pinned .thh-frame{width:min-content!important}
.thh-frame figcaption{max-width:100%!important;box-sizing:border-box}
/* TH product pages: extra illustrations before the FAQ */
body.technohorse .tp-extras-grid{display:grid;grid-template-columns:1fr;gap:clamp(16px,2vw,24px)}
body.technohorse .tp-extras-grid.is-pair{grid-template-columns:1fr 1fr}
body.technohorse .tp-extras-ph{margin:0}
body.technohorse .tp-extras-ph img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--hc-card-radius)}
body.technohorse .tp-extras-grid:not(.is-pair) .tp-extras-ph img{aspect-ratio:21/9}
body.technohorse .tp-extras-ph figcaption{margin-top:10px;font-size:13px;color:#5e6b80}
@media (max-width:760px){body.technohorse .tp-extras-grid.is-pair{grid-template-columns:1fr}body.technohorse .tp-extras-ph img,body.technohorse .tp-extras-grid:not(.is-pair) .tp-extras-ph img{aspect-ratio:4/3}}
body.technohorse .tp-extras-grid.is-pair .tp-extras-ph img{aspect-ratio:4/3}
body.technohorse .tp-extras-grid:not(.is-pair){justify-items:center}
body.technohorse .tp-extras-grid:not(.is-pair) .tp-extras-ph img{aspect-ratio:auto!important;width:auto;max-width:100%;max-height:min(72vh,680px)}
/* single extra photos: landscape spans the column, portrait stays a 4:5 tile */
body.technohorse .tp-extras-grid:not(.is-pair) .tp-extras-ph{width:100%}
body.technohorse .tp-extras-grid:not(.is-pair) .tp-extras-ph img{width:100%!important;max-height:none!important;aspect-ratio:21/9!important}
body.technohorse .tp-extras-grid:not(.is-pair) .tp-extras-ph.is-tall{max-width:520px}
body.technohorse .tp-extras-grid:not(.is-pair) .tp-extras-ph.is-tall img{aspect-ratio:4/5!important}
@media (max-width:760px){body.technohorse .tp-extras-grid:not(.is-pair) .tp-extras-ph img{aspect-ratio:4/3!important}}
/* ZOVII trunk page: three construction details in one row (v3 set) */
body.zovii .zv7-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,24px);padding-top:clamp(24px,3vw,48px);padding-bottom:clamp(24px,3vw,48px)}
body.zovii .zv7-strip figure{margin:0}
body.zovii .zv7-strip img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--hc-card-radius)}
body.zovii .zv7-strip figcaption{margin-top:10px;font-size:14px;color:#6b6459}
@media (max-width:760px){body.zovii .zv7-strip{grid-template-columns:1fr}body.zovii .zv7-strip img{aspect-ratio:4/3}}
/* HC Partners hero: the scroll cue is a real button */
body.portal button.hpx-cue{background:none;border:0;padding:0;font:inherit;cursor:pointer}
body.portal button.hpx-cue:hover{color:#fff}
/* ---------- client fixes 29.10.2026 ---------- */
/* TH home "Urządzenia w codziennej pracy": numbers sit on the heading line; the closing button is the standard navy button */
.thh-frame figcaption span{line-height:calc(19px * 1.3)!important;align-self:start}
body.technohorse .thh-story .thx-button{background:var(--hc-navy)!important;color:#fff!important;border-color:var(--hc-navy)!important}
body.technohorse .thh-story .thx-button:hover{background:var(--hc-navy-2)!important;color:#fff!important}
body.technohorse .thh-story .thx-button *{color:inherit!important}
/* TH home "Opisz obiekt" step 02: every selected device button gets the same navy state (a white card class set on load overrode it) */
body.technohorse .thf :is(.thf-dev,.thf-type):has(input:checked){background:var(--hc-navy)!important;border-color:var(--hc-navy)!important;color:#fff!important}
body.technohorse .thf :is(.thf-dev,.thf-type):has(input:checked) *{color:#fff!important}
/* draggable rails */
.thj-rail{cursor:grab}.thj-rail.is-dragging{cursor:grabbing;user-select:none}
.thj-rail img{-webkit-user-drag:none;user-select:none}
/* TH Installation "Etapy instalacji": the pinned photo always fits the screen, and after step 7 the list gives a short runway so the photo stays pinned and whole before the page moves on */
@media (min-width:1001px){
 body.technohorse .ti-media{top:96px!important}
 body.technohorse .ti-frame{height:min(680px,calc(100vh - 150px))!important}
}
/* TH Wiedza "Słownik pojęć technicznych": the panel stands apart from the page (brand light-blue tint and a visible frame); terms are white cards */
body.technohorse #main .tp-gloss.hc-panel{background:#e9edf8!important;border:1px solid #b4c1e4!important}
body.technohorse #main .tp-gloss .hc-soft{background:#fff!important;border:1px solid var(--hc-line)!important}
/* ZOVII home "300 kg…" route: the closing note is readable on the cream background */
body.zovii .zv-route .thh-outro p{color:var(--muted)!important}
/* ZOVII trunk hero figures: lining numerals and real line height so the labels never touch the digits */
body.zovii .zvk-strip dt{line-height:1.25!important;font-variant-numeric:lining-nums tabular-nums;margin-bottom:6px}
body.zovii .zvk-strip dt span{line-height:inherit}
body.zovii .zvk-strip dd{margin:0;line-height:1.35}
/* ZOVII trunk "Rzeczy, które poczujesz w dłoni": only the photo is rounded, the caption below is never clipped */
body.zovii #main .zv-paka-detail figure{border-radius:0!important;overflow:visible!important}
body.zovii #main .zv-paka-detail figure>.ph{border-radius:var(--hc-card-radius);overflow:hidden}
/* EMG home "Kto odpowiada za kolejne etapy": one round arrow centred in each gap, vertically centred on the cards; pointing down when stacked */
body.emg .emgw2-flow li:not(:last-child)::before{content:none!important}
body.emg .emgw2-flow li:not(:last-child)::after{content:'→'!important;position:absolute;top:50%!important;bottom:auto!important;left:auto!important;right:-28px!important;transform:translateY(-50%);z-index:3;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--hc-surface)!important;color:var(--hc-navy)!important;border:1px solid var(--hc-line);font-size:16px;line-height:1}
@media (max-width:1000px){body.emg .emgw2-flow li:not(:last-child)::after{content:'↓'!important;top:auto!important;bottom:-28px!important;right:auto!important;left:50%!important;transform:translateX(-50%)}}

/* Client fix 17 (29.10.2026), EMG home "Przebieg badania w sześciu krokach": the light-to-blue switch at step 3 fades instead of jumping, the heading fades to white with it, and the L/P (and other) toggles are round pills with no square frame behind them. */
body.emg .emgs{transition:background-color .8s ease,color .8s ease!important}
body.emg .emgs :is(.emgs-head h2,.emgs-head h2 em,.emgs-head p,.emgx-kicker,.emgs-panel,.emgs-figure,.emgs-drawing,.emgs-sheet,.emgs-stepper button,.emgs-nav button,.emgs-toggle button){transition:color .8s ease,background-color .8s ease,border-color .8s ease!important}
body.emg #main .emgs.is-dark .emgs-head h2{color:#fff!important}
body.emg #main .emgs.is-dark .emgs-head h2 em{color:#c4b5fd!important}
body.emg .emgs-toggle{border:0!important;background:none!important;border-radius:0!important;gap:8px}
body.emg .emgs-toggle button{border-radius:999px!important;border:1px solid currentColor!important}
@media (prefers-reduced-motion:reduce){body.emg .emgs,body.emg .emgs *{transition:none!important}}

/* Client fix 19 (29.10.2026), EMG Aplikacja "Plan rozwoju aplikacji": item 8 kept the old dark-tile text colours on a light tile and read as disabled; it now matches items 1-7. */
body.emg .eap-road-list li:last-child b{color:var(--hc-ink)!important}
body.emg .eap-road-list li:last-child span{color:var(--hc-violet)!important}

/* Client fix 2 (29.10.2026), TH home strip under the hero: client chose version A, the original full-width light-blue strip with lines above and below (column margins removed from system.css). */

/* Client fix (29.10.2026), TH Instalacja "Etapy instalacji": each step number sits at the vertical middle of its step's text; the list's bottom spacing is now set in tech-experience.js so the photo lets go when step 7 is reached. */
body.technohorse .ti-step{align-items:center!important}
body.technohorse .ti-step .ti-dot{align-self:center!important}

/* Client fix (29.10.2026), ZOVII Paka hero: the copy block had both top and bottom pinned, so on shorter screens the measurement strip ran into the "ZOVII · Champion Pro L · Legend Pro XL" line. The copy now flows (the hero grows with it), the model line moves to the bottom-right, and the strip labels read clearly on the photo. */
@media (min-width:761px){body.zovii .zvh-hero.zvh-paka{height:auto!important;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end}
body.zovii .zvh-paka .zvh-copy{position:relative!important;top:auto!important;bottom:auto!important;padding-top:150px;padding-bottom:64px}
body.zovii .zvh-paka .zvh-foot{left:auto!important;right:var(--hc-side,40px)!important;width:auto!important;text-align:right}}
body.zovii .zvh-paka .zvk-strip dd{color:rgba(246,239,228,.92)!important;text-shadow:0 1px 2px rgba(0,0,0,.45)}
/* Client (30.10.2026): desktop hero ~75% of the screen, the first section peeks in below it */
@media (min-width:901px){body[class] #main .hc-hero-first{height:max(560px,75svh)!important;min-height:0!important;max-height:none!important;box-sizing:border-box!important}}
/* captions under hero CTAs removed so the copy fits the shorter hero */
.hc-hero-first :is(.emgh-facts,.tp-facts,.zvc-facts,.zvk-strip){display:none!important}
/* the first section under the hero appears at once (app.js marks it .hc-now): no reveal animation */
.hc-now:is([data-reveal],[data-reveal-text]),.hc-now :is([data-reveal],[data-reveal-text]),.hc-now:is([data-reveal-text])>*,.hc-now [data-reveal-text]>*,.hc-now [data-reveal] img{transition:none!important;animation:none!important}
.hc-now .hc-rv,.hc-now.hc-rv{opacity:1!important;transform:none!important;transition:none!important}/* Client (30.10.2026): HC About "Informacje o koniu…" less empty space; the pinned scene is as tall as its content and sticks centred (experience.js sizes the runway) */
body.portal .hca-problem:not(.is-still) .hca-pin{height:auto!important;top:max(84px,calc(50svh - var(--hca-h,600px)/2))!important;padding-top:24px!important;padding-bottom:24px!important;align-items:center!important}
body.portal .hca-problem:not(.is-still) .hca-pin>.wrap{margin-top:0!important;margin-bottom:0!important}
/* EMG "Ocena jakości zapisu przed analizą": smaller top padding of the panel, no gap left by the hidden kicker */
@media (min-width:901px){body.emg #main .emgx-section.emp-q{padding-top:72px!important}}
body.emg #main .emp-q .emp-head>h2{margin-top:0!important}
/* ---------- mobile section rhythm, HORSECHAMP + EMG (30.10.2026): one even gap between sections instead of 65-90px paddings ---------- */
@media (max-width:760px){
html body.emg #main :is(.emgx-section,.emgs){padding-top:40px!important;padding-bottom:40px!important}
html body.emg #main .emgx-section.hc-now{padding-top:40px!important}
html body.portal #main :is(.hcw-about,.hcw,.hcw-contact,.hco-origin,.hco-human,.hco-values,.hco-sell,.hca-eco,.hca-next,.hpq,.hpx-h,.hpx-merge,.hpx-steps){padding-top:40px!important;padding-bottom:40px!important}
html body:is(.portal,.emg) #main .subhero{padding-bottom:32px!important}
html body:is(.portal,.emg) #main .subhero+section{padding-top:40px!important}
}@media (max-width:760px){
html body:is(.portal,.emg) #main :is(.eyebrow,.emgx-kicker)+*{margin-top:0!important}
html body.portal #main .hpx.is-flat .hpx-sticky{padding:40px 0!important}
html body.portal #main .hpx-merge-row{align-items:start}
}@media (max-width:760px){html body.portal #main :is(.hpx-h,.hpx-merge){padding-top:0!important;padding-bottom:0!important}}@media (max-width:760px){html body.portal #main .hpx-h+.hpx-merge{padding-top:40px!important}}/* phones: chapter rows are a swipe strip, so the desktop scroll heights (60-70vh per chapter) left a screen of empty space under each card */
@media (max-width:900px){html body #main :is(.eap-chapters,.etl-chapters,.ewr-chapters) .eap-ch{min-height:0!important}}/* HORSECHAMP home h1 on phones: always two lines ("Trzy marki. Jeden cel." / "Dobrostan konia."), sized to the column width */
@media (max-width:600px){body.portal #main .hcx-head{container-type:inline-size}body.portal #main .hcx-head h1{font-size:calc((100vw - 32px)/10.5)!important;font-size:9.5cqw!important;line-height:1.08!important}html[lang=en] body.portal #main .hcx-head h1{font-size:calc((100vw - 32px)/11.4)!important;font-size:8.75cqw!important}}