/* SONOMED — arkusz zbiorczy. Generowany przez build/assemble.py.
   Kolejność bloków jest istotna: klasy .sN zastępują dawne style inline,
   więc muszą wygrywać z regułami autorskimi tak, jak wygrywał inline. */

/* --- 0 · fonty z własnego serwera ---------------------------------------- */
/* Fonty z własnego serwera — żadnego połączenia z Google.
   Wygenerowane przez build/pobierz_fonty.py. Obie rodziny są zmienne,
   więc jeden plik obsługuje cały zakres grubości. */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:300 800;font-stretch:100%;font-display:swap;src:url('/assets/fonts/bricolage-grotesque-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:300 800;font-stretch:100%;font-display:swap;src:url('/assets/fonts/bricolage-grotesque-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Geomini';font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/geomini-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Geomini';font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/geomini-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}

/* --- 1 · reguły ze strony źródłowej ------------------------------------- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body { margin: 0px; }
@media (max-width: 640px) {
  .scope-grid { grid-template-columns: repeat(2, 1fr) !important; row-gap: 28px; }
.scope-grid > :nth-child(3) { border-left-width: medium !important; border-left-style: none !important; border-left-color: currentcolor !important; }
}
@media (max-width: 1020px) {
  .offer-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
  .offer-grid { grid-template-columns: 1fr !important; }
.device-feats { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  .foot-grid { grid-template-columns: 1fr !important; gap: 20px !important; padding: 26px 24px 16px !important; }
}
@media (max-width: 860px) {
  .contact-grid { grid-template-columns: 1fr !important; }
.contact-map { order: 2; min-height: 340px !important; }
.contact-info { order: 1; padding: 32px 28px !important; }
.contact-topcols { grid-template-columns: 1fr !important; gap: 24px !important; }
.contact-vsep { display: none; }
}
html, body { height: 100%; margin: 0px; }
#dc-root, #dc-root > .sc-host { height: 100%; }
html { scroll-behavior: smooth; scroll-padding-top: 128px; }
a { color: var(--accent,#0E7C6B); }
a:hover { color: color-mix(in srgb,var(--accent,#0E7C6B) 80%,#000); }
.mobile-cta { display: none; }
.grp-chevron { display: block; }
.panel-desk { display: block; }
.panel-mob { display: none; }
.ind-more { display: none; }
.prep-badge { min-width: 172px; }
.do-potwierdzenia { color: inherit; }
.exam-btn:focus { outline: none; }
.exam-btn:focus-visible { outline: 2px solid var(--accent,#0E7C6B); outline-offset: 4px; }
@media (min-width: 981px) {
  .grp-body { display: block !important; }
.grp-chevron { display: none !important; }
.grp-head { cursor: default; min-height: 0px !important; }
}
@media (max-width: 1240px) {
  .hdr-hours { display: none; }
.hdr-row { padding-left: 32px !important; padding-right: 32px !important; gap: 20px !important; }
}
@media (max-width: 1080px) {
  .hdr-logo span:last-child span:last-child { display: none; }
.hdr-logo img { height: 44px !important; }
.hdr-nav a { padding-left: 9px !important; padding-right: 9px !important; font-size: 14px !important; }
}
@media (max-width: 980px) {
  html { scroll-padding-top: 84px; }
.hdr-row { flex-wrap: wrap; padding: 10px 20px !important; gap: 10px 16px !important; }
.hdr-nav { order: 3; width: 100%; overflow-x: auto; scrollbar-width: none; border-top: 1px solid rgb(224, 234, 242); padding-top: 8px; gap: 2px !important; }
.hdr-nav::-webkit-scrollbar { display: none; }
.hdr-nav a { white-space: nowrap; }
.hdr-logo span:last-child span:last-child { display: inline !important; }
.grp-grid { grid-template-columns: 1fr !important; }
.prep-grid { grid-template-columns: repeat(2, 1fr) !important; }
.info-cols { grid-template-columns: 1fr !important; }
.cat-tiles { grid-template-columns: repeat(2, 1fr) !important; }
.subnav { display: none !important; }
.mobile-cta { display: grid !important; }
.exam-row { flex-wrap: wrap; }
.exam-main { flex-wrap: wrap; }
.prep-badge { min-width: 0px !important; }
.panel-desk { display: none !important; }
.panel-mob { display: block !important; }
.ind-list { columns: 1 !important; }
.ind-wrap[data-all="0"] .ind-extra { display: none; }
.ind-wrap[data-all="0"] .ind-more { display: inline-flex !important; }
.grp-head { cursor: pointer; }
.page-root { padding-bottom: 80px !important; }
.page-root section > div { padding-top: 42px !important; padding-bottom: 42px !important; }
}
@media (max-width: 600px) {
  .prep-grid { grid-template-columns: 1fr !important; }
.cat-tiles { grid-template-columns: 1fr !important; }
.cta-btns { flex-direction: column !important; }
.page-root section > div { padding: 34px 20px !important; }
}

body{margin:0;}
body.home{background:#f4f8fb;}
body.badania{background:#e9f1f7;}
body.doc{background:#fff;}

/* --- 2 · style przeniesione z atrybutów style="" ------------------------ */
.s0{position: relative; break-inside: avoid; margin: 0px 0px 8px; padding-left: 17px; font-size: 14.5px; line-height: 1.55; color: rgb(63, 91, 112); text-wrap: pretty;}
.s1{position: absolute; left: 0px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: color-mix(in srgb,var(--accent) 55%,#c8d8e4);}
.s2{}
.s3{margin: 0px; max-width: 78ch; font-size: 14.5px; line-height: 1.6; color: rgb(63, 91, 112); text-wrap: pretty;}
.s4{margin: 0px 0px 20px; max-width: 78ch; font-size: 14.5px; line-height: 1.65; color: rgb(63, 91, 112); text-wrap: pretty;}
.s5{position: absolute; top: 10px; right: 10px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; margin: 0px; color: rgb(157, 182, 203); cursor: pointer; border-radius: 11px;}
.s6{font-family: var(--hfont,'Newsreader',serif); font-size: 21px; font-weight: 600; letter-spacing: -0.01em; color: rgb(20, 48, 74); margin: 0px 52px 12px 0px;}
.s7{background: rgb(233, 241, 247); border-radius: 12px; padding: 16px 18px; margin: 18px 0px 0px;}
.s8{font-size: 11.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); margin: 0px 0px 7px;}
.s9{border-top: 1px solid rgb(219, 231, 240); margin-top: 18px; padding-top: 6px; display: flex; align-items: center; justify-content: space-between; gap: 4px 20px; flex-wrap: wrap;}
.s10{min-height: 44px; display: inline-flex; align-items: center; gap: 8px; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; margin: 0px; padding: 0px 2px; font-style: inherit; font-variant: inherit; font-weight: 600; font-stretch: inherit; font-size: 14.5px; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; color: var(--accent); cursor: pointer; transition: gap 0.15s;}
.s11{font-size: 11.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(138, 162, 182); margin: 0px 0px 12px;}
.s12{list-style: none; padding: 0px; margin: 0px; columns: 2; column-gap: 34px;}
.s13{min-height: 44px; align-items: center; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; margin: 0px; padding: 0px 2px; font-style: inherit; font-variant: inherit; font-weight: 600; font-stretch: inherit; font-size: 13.5px; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; color: var(--accent); cursor: pointer; text-decoration: underline; text-underline-offset: 3px;}
.s14{min-height: 44px; display: inline-flex; align-items: center; gap: 6px; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; margin: 0px; padding: 0px 2px; font-style: inherit; font-variant: inherit; font-weight: 500; font-stretch: inherit; font-size: 12.5px; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; color: rgb(107, 131, 153); cursor: pointer;}
.s15{transition: transform 0.18s;}
.s16{padding-top: 4px;}
.s17{border-bottom: 1px solid rgb(240, 244, 248);}
.s18{width: 100%; min-height: 44px; margin: 0px; display: flex; align-items: center; gap: 12px; border-width: 1px; border-style: solid; border-image: initial; font: inherit; text-align: left; cursor: pointer; border-radius: 8px; transition: background 0.15s, color 0.15s, border-color 0.15s, padding 0.15s;}
.s19{flex: 1 1 auto; min-width: 0px; display: flex; align-items: center; justify-content: space-between; gap: 6px 14px;}
.s20{width: 5px; height: 5px; border-radius: 50%; background: var(--pd);}
.s21{flex-shrink: 0; transition: transform 0.18s;}
.s22{position: relative; padding: 4px 2px 20px;}
.s23{flex: 1 1 auto; min-width: 0px; font-size: 15px; line-height: 1.4; text-wrap: pretty;}
.s24{grid-column: 1 / -1; box-sizing: border-box;}
.s25{position: relative; background: rgb(255, 255, 255); border: 1px solid rgb(221, 233, 242); border-radius: 18px; padding: 26px 30px 22px; box-shadow: rgba(20, 48, 74, 0.5) 0px 16px 44px -32px;}
.s26{margin: 0px 0px 9px; max-width: 78ch; font-size: 12.5px; line-height: 1.65; color: rgb(107, 131, 153); text-wrap: pretty;}
.s27{display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex-shrink: 0; pointer-events: none; font-size: 11px; font-weight: 600; letter-spacing: 0.02em; padding: 4px 12px; border-radius: 999px; white-space: nowrap; background: rgb(238, 242, 246); color: rgb(74, 96, 112); --pd: #9db6cb;}
.s28{flex-shrink: 0; transition: transform 0.2s;}
.s29{position: absolute; top: -7px; width: 12px; height: 12px; background: rgb(255, 255, 255); border-left: 1px solid rgb(221, 233, 242); border-top: 1px solid rgb(221, 233, 242); transform: rotate(45deg); left: calc(25% - 6px);}
.s30{display: flex; gap: 9px; font-size: 13.5px; color: rgb(106, 131, 153); line-height: 1.5;}
.s31{color: color-mix(in srgb,var(--accent) 55%,#9db6cb); flex-shrink: 0;}
.s32{position: absolute; top: -7px; width: 12px; height: 12px; background: rgb(255, 255, 255); border-left: 1px solid rgb(221, 233, 242); border-top: 1px solid rgb(221, 233, 242); transform: rotate(45deg); left: calc(75% - 6px);}
.s33{margin: 0px 0px 12px; font-size: 15px; line-height: 1.68; color: rgb(63, 91, 112); text-wrap: pretty;}
.s34{border-bottom: 1px solid rgb(228, 238, 245);}
.s35{width: 100%; min-height: 44px; margin: 0px; padding: 14px 4px; display: flex; align-items: center; gap: 16px; background: none; border: 1px solid transparent; font: inherit; color: rgb(34, 71, 95); text-align: left; cursor: pointer; border-radius: 8px; transition: color 0.15s;}
.s36{flex: 1 1 auto; min-width: 0px; font-size: 16.5px; font-weight: 500; line-height: 1.45; text-wrap: pretty;}
.s37{padding: 0px 4px 22px; max-width: 74ch;}
.s38{list-style: none; padding: 0px; margin: 0px;}
.s39{background: rgb(255, 255, 255); border: 1px solid rgb(221, 233, 242); border-radius: 18px; padding: 22px 28px; margin-bottom: 20px; box-shadow: rgba(20, 48, 74, 0.35) 0px 10px 30px -26px;}
.s40{background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; margin: 0px; width: 100%; min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0px 0px 6px; font: inherit; color: inherit; text-align: left;}
.s41{font-family: var(--hfont,'Newsreader',serif); font-size: 13px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent);}
.s42{display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex-shrink: 0; pointer-events: none; font-size: 11px; font-weight: 600; letter-spacing: 0.02em; padding: 4px 12px; border-radius: 999px; white-space: nowrap; background: rgb(247, 239, 224); color: rgb(138, 100, 32); --pd: #c1892f;}
.s43{font-size: 11.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(138, 162, 182); margin: 18px 0px 8px;}
.s44{width: 6px; height: 6px; border-radius: 50%; background: var(--accent);}
.s45{width: 100%; height: 100%; object-fit: cover; display: block;}
.s46{color:#8ba6bd;}
.s47{max-width: 1200px; margin: 0px auto; padding: 64px 32px;}
.s48{border-top: 1px solid rgb(219, 231, 240); margin: 18px 0px 0px; padding: 16px 0px 0px;}
.s49{font-size: 11.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(138, 162, 182); margin: 0px 0px 8px;}
.s50{text-decoration: none; color: rgb(34, 71, 95); font-size: 14.5px; font-weight: 600; padding: 8px 13px; border-radius: 8px;}
.s51{display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px;}
.s52{font-family: var(--hfont,'Newsreader',serif); font-size: 24px; font-weight: 600; line-height: 1.2;}
.s53{font-size: 13px; color: rgb(157, 182, 203); margin-top: 6px; letter-spacing: 0.02em;}
.s54{display: flex; flex-direction: column; background: rgb(247, 250, 252); border: 1px solid rgb(230, 239, 246); border-radius: 18px; padding: 26px 26px 22px; height: 100%; text-decoration: none; color: inherit; transition: background 0.16s, border-color 0.16s, box-shadow 0.16s, transform 0.16s;}
.s55{display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px;}
.s56{font-family: var(--hfont,'Newsreader',serif); font-size: 22px; font-weight: 600; margin: 0px; line-height: 1.2;}
.s57{flex-shrink: 0; font-size: 12.5px; color: rgb(130, 153, 171); letter-spacing: 0.01em; white-space: nowrap;}
.s58{list-style: none; padding: 0px; margin: 0px 0px 20px; display: flex; flex-direction: column; gap: 9px;}
.s59{margin-top: auto; display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 600; color: var(--accent);}
.s60{font-size: 15px; font-weight: 600; color: rgb(20, 48, 74); line-height: 1.35; margin-bottom: 6px;}
.s61{margin: 0px; font-size: 14px; color: rgb(106, 131, 153); line-height: 1.55; text-wrap: pretty;}
.s62{display: inline-flex; align-items: center; gap: 9px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 999px; padding: 9px 16px; font-size: 13.5px; color: rgb(219, 232, 242);}
.s63{grid-column: auto; border-radius: 16px; overflow: hidden; border: 1px solid rgb(219, 231, 240);}
.s64{text-decoration: none; font-size: 14.5px; font-weight: 600; padding: 8px 13px; border-radius: 8px; color: rgb(34, 71, 95);}
.s65{text-decoration: none; font-size: 14px; font-weight: 600; padding: 9px 14px; border-radius: 9px; white-space: nowrap; transition: background 0.15s, color 0.15s;}
.s66{display: flex; flex-direction: column; background: rgb(255, 255, 255); border: 1px solid rgb(221, 233, 242); border-radius: 18px; padding: 22px 24px; text-decoration: none; color: inherit; box-shadow: rgba(20, 48, 74, 0.35) 0px 10px 30px -24px; transition: transform 0.16s, box-shadow 0.16s, border-color 0.16s;}
.s67{display: flex; align-items: flex-start; justify-content: space-between; gap: 14px;}
.s68{font-family: var(--hfont,'Newsreader',serif); font-size: 21px; font-weight: 600; color: rgb(20, 48, 74); line-height: 1.15;}
.s69{flex-shrink: 0; margin-top: 3px;}
.s70{font-family: var(--hfont,'Newsreader',serif); font-weight: 600; font-size: 38px; line-height: 1.12; margin: 0px 0px 8px; letter-spacing: -0.01em;}
.s71{font-size: 16.5px; color: rgb(63, 91, 112); line-height: 1.6; margin: 0px; text-wrap: pretty;}
.s72{flex: 1 1 auto; min-width: 0px; font-size: 15.5px; line-height: 1.4; text-wrap: pretty;}
.s73{text-align: center; padding: 6px 20px; border-left: 1px solid rgba(255, 255, 255, 0.12); text-decoration: none; color: inherit; display: block; transition: color 0.16s;}
.s74{display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); margin-bottom: 16px;}
.s75{background: rgb(255, 255, 255); border-bottom: 1px solid rgb(219, 231, 240);}
.s76{max-width: 760px; margin: 0px 0px 16px;}
.s77{display: grid; grid-template-columns: repeat(2, 1fr); gap: 0px 20px; align-items: start;}
.s78{background: rgb(26, 53, 80); border: 1px solid rgba(255, 255, 255, 0.11); border-radius: 18px; padding: 30px; height: 100%;}
.s79{width: 40px; height: 40px; border-radius: 11px; background: color-mix(in srgb,var(--accent) 34%,#0f2438); color: color-mix(in srgb,var(--accent) 55%,#fff); display: flex; align-items: center; justify-content: center; font-family: var(--hfont,'Newsreader',serif); font-weight: 700; font-size: 16px; margin-bottom: 18px;}
.s80{font-family: var(--hfont,'Newsreader',serif); font-size: 22px; font-weight: 600; margin: 0px 0px 10px; line-height: 1.2; color: rgb(255, 255, 255);}
.s81{font-size: 15px; color: rgb(207, 224, 238); line-height: 1.6; margin: 0px; text-wrap: pretty;}
.s82{background: rgb(15, 36, 56); color: rgb(200, 220, 235); font-size: 13px; letter-spacing: 0.01em;}
.s83{max-width: 1200px; margin: 0px auto; padding: 9px 32px; display: flex; flex-wrap: wrap; gap: 8px 28px; align-items: center; justify-content: space-between;}
.s84{display: flex; flex-wrap: wrap; gap: 10px 60px; align-items: center;}
.s85{display: inline-flex; align-items: center; gap: 8px;}
.s86{color: rgb(200, 220, 235); text-decoration: none;}
.s87{color: rgb(143, 176, 201);}
.s88{position: sticky; top: 0px; z-index: 50; background: rgba(244, 248, 251, 0.88); backdrop-filter: blur(12px); border-bottom: 1px solid rgb(224, 234, 242);}
.s89{max-width: 1560px; margin: 0px auto; padding: 14px 48px; display: flex; align-items: center; justify-content: space-between; gap: 32px;}
.s90{display: flex; align-items: center; gap: 15px; text-decoration: none; color: inherit; flex-shrink: 0; margin-right: auto;}
.s91{height: 52px; width: auto; display: block; border-radius: 10px;}
.s92{display: flex; flex-direction: column; line-height: 1.05;}
.s93{font-family: var(--hfont,'Newsreader',serif); font-weight: 700; font-size: 23px; letter-spacing: 0.02em; color: var(--accent);}
.s94{font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: rgb(34, 71, 95);}
.s95{display: flex; align-items: center; gap: 16px; flex-shrink: 0;}
.s96{text-align: right; font-size: 11.5px; line-height: 1.45; color: rgb(106, 131, 153);}
.s97{display: flex; flex-direction: column; align-items: center; gap: 2px; background: var(--accent); color: rgb(255, 255, 255); text-decoration: none; padding: 9px 20px; border-radius: 11px; box-shadow: 0 8px 20px -8px color-mix(in srgb,var(--accent) 75%,transparent); line-height: 1.2;}
.s98{font-size: 11px; font-weight: 500; letter-spacing: 0.04em; opacity: 0.9;}
.s99{font-size: 15.5px; font-weight: 700; letter-spacing: 0.02em;}
.s100{display: inline-flex; align-items: center; gap: 8px; background: var(--accent); color: rgb(255, 255, 255); text-decoration: none; font-weight: 600; font-size: 16px; padding: 15px 30px; border-radius: 12px; box-shadow: 0 14px 30px -12px color-mix(in srgb,var(--accent) 80%,transparent);}
.s101{background: rgb(255, 255, 255); border-top: 1px solid rgb(234, 241, 247); border-bottom: 1px solid rgb(234, 241, 247);}
.s102{max-width: 1200px; margin: 0px auto; padding: 120px 32px;}
.s103{font-size: 17px; color: rgb(184, 206, 224); line-height: 1.7; margin: 0px 0px 18px; max-width: 620px;}
.s104{font-size: 12px; color: rgb(130, 153, 171); letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; margin-bottom: 10px;}
.s105{font-size: 15px; font-weight: 500; color: rgb(34, 71, 95); line-height: 1.6;}
.s106{background: rgb(15, 36, 56); color: rgb(176, 198, 216);}
.s107{max-width: 1200px; margin: 0px auto; padding: 28px 32px 17px; display: grid; grid-template-columns: 1fr auto; gap: 24px 64px; align-items: start;}
.s108{display: flex; align-items: center; gap: 11px; margin-bottom: 10px;}
.s109{height: 36px; width: auto; display: block; border-radius: 8px;}
.s110{font-family: var(--hfont,'Newsreader',serif); font-weight: 700; font-size: 20px; color: color-mix(in srgb,var(--accent) 45%,#fff); letter-spacing: 0.02em;}
.s111{font-size: 13.5px; line-height: 1.55; margin: 0px; max-width: 320px;}
.s112{font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.14em; color: rgb(95, 127, 152); font-weight: 600; margin-bottom: 10px;}
.s113{display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; line-height: 1.45;}
.s114{color: rgb(255, 255, 255); text-decoration: none; font-weight: 600; font-size: 15.5px; letter-spacing: 0.01em; margin-top: 2px;}
.s115{color: rgb(198, 217, 232); text-decoration: none;}
.s116{border-top:1px solid rgba(255,255,255,.09);}
.s117{max-width:1200px;margin:0 auto;padding:14px 32px;font-size:12.5px;color:#8ba6bd;display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;justify-content:space-between;}
.s118{display:flex;flex-wrap:wrap;gap:8px 18px;}
.s119{background:none;border:0;padding:0;font:inherit;color:#8ba6bd;text-decoration:underline;cursor:pointer;}
.s120{background: rgb(233, 241, 247); border-bottom: 1px solid rgb(219, 231, 240);}
.s121{margin: 0px 0px 10px; font-size: 14.5px; line-height: 1.6; color: rgb(63, 91, 112); text-wrap: pretty;}
.s122{margin: 0px; font-size: 14.5px; line-height: 1.6; color: rgb(63, 91, 112); text-wrap: pretty;}

/* --- 3 · stany, responsywność, zgody ------------------------------------ */
/* =============================================================
   SONOMED — warstwa dopisana przy migracji z Claude Design.
   Odtwarza stany, które w prototypie trzymał React (rozwijane
   badania, grupy, FAQ, sticky subnav), dokłada responsywność
   strony głównej i obsługę zgód na treści zewnętrzne.
   ============================================================= */

/* --- podstawy ----------------------------------------------------------
   Zmienne muszą siedzieć na :root, a nie tylko na kontenerze strony —
   baner cookies i „przejdź do treści” są poza nim i bez tego dostawały
   biały tekst na przezroczystym tle (przycisk zgody był niewidoczny).
   Font z tego samego powodu ustawiamy również na <body>. */
:root{--accent:#0E7C6B;--hfont:'Geomini',system-ui,sans-serif;}
body{font-family:'Bricolage Grotesque',system-ui,-apple-system,sans-serif;
  color:#14304a;line-height:1.55;-webkit-font-smoothing:antialiased;}

/* --- górny pasek kontaktowy (obie strony) ------------------------------- */
@media (max-width:980px){
  .topbar-inner{padding:7px 20px !important;gap:2px 18px !important;
    justify-content:flex-start !important;}
  .topbar-hours{display:none;}
}
@media (max-width:520px){
  .topbar{font-size:12px !important;}
  .topbar-mail{display:none;}
}

/* --- dostępność -------------------------------------------------------- */
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--accent);
  color:#fff;padding:12px 20px;border-radius:0 0 10px 0;font-weight:600;text-decoration:none;}
.skip-link:focus{left:0;}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;
    scroll-behavior:auto !important;}
}

/* --- wiersz badania ----------------------------------------------------- */
.exam-btn{background:none;border-color:transparent;color:#22475f;padding:9px 0;}
.exam-btn[data-exam-toggle][aria-expanded="true"]{
  background:color-mix(in srgb,var(--accent) 6%,transparent);
  border-color:color-mix(in srgb,var(--accent) 24%,transparent);
  color:var(--accent);padding:9px 11px;}
#faq .exam-btn{padding:14px 4px;}

.exam-chev,.faq-chev,.doc-chev,.grp-chevron{transform:rotate(0deg);}
[aria-expanded="true"] > .exam-chev,
[aria-expanded="true"] > .faq-chev,
[aria-expanded="true"] .doc-chev,
[aria-expanded="true"] .grp-chevron{transform:rotate(180deg);}

/* --- panele (badanie / FAQ / „zakres dla lekarzy”) ----------------------
   max-height ustawia JS na realną wysokość treści — prototyp miał tu sztywne
   1600px, przez co dłuższe opisy po rozwinięciu zakresu dla lekarzy się ucinały. */
.exam-panel,.faq-panel,.doc-panel{
  overflow:hidden;max-height:0;opacity:0;visibility:hidden;
  transition:max-height .18s ease,opacity .18s ease,visibility 0s linear .18s;}
.panel-desk{padding-top:0;margin-bottom:0;}
.exam-panel.is-open,.faq-panel.is-open,.doc-panel.is-open{
  max-height:none;opacity:1;visibility:visible;
  transition:max-height .18s ease,opacity .18s ease;transition-delay:0s;}
.panel-desk.is-open{padding-top:9px;margin-bottom:20px;}
.no-js .exam-panel,.no-js .faq-panel,.no-js .doc-panel{
  max-height:none;opacity:1;visibility:visible;}

/* --- grupy badań (zwijane tylko na wąskich ekranach) -------------------- */
[data-group-panel]{display:none;}
[data-group-panel].is-open{display:block;}
@media (min-width:981px){
  [data-group-panel]{display:block !important;}   /* w tym notki grup, które
     w prototypie na desktopie nie pokazywały się wcale — chevron był ukryty,
     więc nie dało się ich rozwinąć */
}
.no-js [data-group-panel]{display:block;}

/* --- sticky subnav ------------------------------------------------------ */
.subnav{top:0;transform:translateY(-140%);opacity:0;pointer-events:none;}
.subnav.is-visible{transform:translateY(0);opacity:1;pointer-events:auto;}
.subnav a[data-subnav]{background:transparent;color:#22475f;}
.subnav a[data-subnav].is-active{
  background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);}

/* =============================================================
   STRONA GŁÓWNA — responsywność (prototyp miał ją tylko na
   stronie badań; nagłówek i hero rozjeżdżały się na telefonie)
   ============================================================= */
.hdr-burger{display:none;}

@media (max-width:1240px){
  .home .hdr-row{padding-left:32px !important;padding-right:32px !important;gap:20px !important;}
  .home .hdr-hours{display:none;}
}
@media (max-width:1080px){
  .home .hdr-nav a{padding-left:9px !important;padding-right:9px !important;font-size:14px !important;}
  .home .hdr-logo img{height:44px !important;}
}
@media (max-width:980px){
  .home .hdr-row{padding:10px 16px !important;gap:8px 12px !important;flex-wrap:wrap;}
  .home .hdr-logo{gap:10px !important;}
  .home .hdr-logo img{height:40px !important;}
  .home .hdr-nav{order:3;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;border-top:1px solid #e0eaf2;padding-top:8px;gap:2px !important;
    flex-wrap:nowrap !important;}
  .home .hdr-nav::-webkit-scrollbar{display:none;}
  .home .hdr-nav a{white-space:nowrap;}
  .hdr-cta{flex-direction:row !important;padding:10px 14px !important;
    white-space:nowrap;}
  .hdr-cta span:first-child{display:none;}

  /* hero */
  .home .hero-grid{grid-template-columns:1fr !important;gap:32px !important;
    padding:44px 20px 52px !important;}
  .home .hero-grid h1{font-size:clamp(44px,13vw,76px) !important;}
  .home .hero-grid p{font-size:19px !important;}
  .home .hero-img{aspect-ratio:4/3 !important;max-height:420px;}
  .home .hero-btns a{flex:1 1 100%;justify-content:center;}

  /* sekcje */
  .home section > div{padding-top:52px !important;padding-bottom:52px !important;
    padding-left:20px !important;padding-right:20px !important;}
  .home h2{font-size:clamp(28px,7.5vw,40px) !important;}
  .home .about-grid{grid-template-columns:1fr !important;gap:32px !important;}
  .home .about-grid > div:first-child{max-width:340px;}
  .home .gallery-grid{grid-template-columns:repeat(2,1fr) !important;
    grid-auto-rows:200px !important;gap:12px !important;}
  .home .device-feats{gap:20px 24px !important;}
  .home .topbar-inner{padding-left:20px !important;padding-right:20px !important;
    justify-content:flex-start !important;}
  .home .topbar-hours{display:none;}
  /* miejsce na dolny pasek CTA */
  .home .page-root{padding-bottom:80px;}
}
/* Na wąskim ekranie logo i numer muszą zmieścić się w jednym rzędzie —
   inaczej nagłówek rośnie do trzech linii i zjada pierwszy ekran.
   Dotyczy obu stron. */
@media (max-width:620px){
  .hdr-logo img{height:34px !important;}
  .hdr-logo span:last-child span:first-child{font-size:18px !important;}
  .hdr-logo span:last-child span:last-child{display:none !important;}
  .hdr-cta{padding:9px 13px !important;}
  .hdr-cta span:first-child{display:none;}
  .hdr-cta span:last-child{font-size:15px;}
}
@media (max-width:600px){
  .home .gallery-grid{grid-template-columns:1fr !important;grid-auto-rows:230px !important;}
  .home .gallery-grid > div{grid-column:auto !important;}
  .home .scope-grid{row-gap:22px;}
}

/* --- dolny pasek CTA (obie strony) -------------------------------------- */
.mobile-cta{display:none;}
@media (max-width:980px){ .mobile-cta{display:grid !important;} }
.mobile-cta--solo{grid-template-columns:1fr !important;}

/* =============================================================
   ZGODY / TREŚCI ZEWNĘTRZNE (Mapy Google, rejestracja online)
   ============================================================= */
.consent-ph{position:relative;width:100%;height:100%;min-height:340px;display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;
  padding:32px 26px;background:#eef4f9;border:0;}
.consent-ph p{margin:0;max-width:44ch;font-size:14.5px;line-height:1.6;color:#3f5b70;}
.consent-ph .consent-title{font-weight:600;font-size:16px;color:#14304a;}
.consent-ph button{min-height:44px;display:inline-flex;align-items:center;gap:8px;
  background:var(--accent);color:#fff;border:0;border-radius:12px;padding:12px 24px;
  font:inherit;font-weight:600;font-size:15px;cursor:pointer;}
.consent-ph button:hover{filter:brightness(1.06);}
.consent-ph a{color:var(--accent);font-size:13px;}

.cookie-bar{position:fixed;left:0;right:0;bottom:0;z-index:120;
  background:#fff;border-top:1px solid #dbe7f0;box-shadow:0 -12px 34px -20px rgba(20,48,74,.5);
  padding:18px 24px calc(18px + env(safe-area-inset-bottom));}
.cookie-bar[hidden]{display:none;}
.cookie-bar__in{max-width:1200px;margin:0 auto;display:flex;gap:14px 28px;
  align-items:center;justify-content:space-between;flex-wrap:wrap;}
.cookie-bar p{margin:0;flex:1 1 340px;min-width:0;font-size:14px;line-height:1.6;color:#3f5b70;}
.cookie-bar__btns{flex:0 0 auto;}
@media (max-width:1100px){
  .cookie-bar p{flex:1 1 100%;}
  .cookie-bar__btns{width:100%;}
  .cookie-bar__btns button{flex:1 1 auto;min-width:0;justify-content:center;}
}
.cookie-bar__btns{display:flex;gap:10px;flex-wrap:wrap;}
/* Oba przyciski mają ten sam rozmiar, krój i grubość ramki. Odrzucenie nie jest
   ani mniejsze, ani wyblakłe — inaczej zgoda nie jest dobrowolna. */
.cookie-bar button{min-height:46px;min-width:190px;border-radius:11px;padding:12px 22px;
  font:inherit;font-weight:600;font-size:14.5px;cursor:pointer;
  border:2px solid var(--accent);background:#fff;color:var(--accent);}
.cookie-bar button.is-primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.cookie-bar button:hover{filter:brightness(1.04);}
@media (max-width:980px){
  .cookie-bar{padding:14px 18px calc(88px + env(safe-area-inset-bottom));}
  .cookie-bar p{font-size:13.5px;line-height:1.55;}
  .cookie-bar__btns{width:100%;}
  .cookie-bar__btns button{flex:1 1 auto;min-width:0;justify-content:center;}
}

/* =============================================================
   STRONY DOKUMENTÓW (polityka prywatności, regulamin, cookies)
   ============================================================= */
.doc-page{max-width:820px;margin:0 auto;padding:56px 24px 96px;}
.doc-page h1{font-family:var(--hfont);font-weight:600;font-size:clamp(30px,5vw,40px);
  line-height:1.15;letter-spacing:-.01em;margin:0 0 10px;}
.doc-page h2{font-family:var(--hfont);font-weight:600;font-size:clamp(20px,3.4vw,25px);
  line-height:1.25;margin:44px 0 12px;}
.doc-page h3{font-size:17px;font-weight:600;margin:28px 0 8px;color:#14304a;}
.doc-page p,.doc-page li{font-size:15.5px;line-height:1.7;color:#3f5b70;}
.doc-page ul,.doc-page ol{padding-left:22px;margin:0 0 16px;}
.doc-page li{margin-bottom:7px;}
.doc-page hr{border:0;border-top:1px solid #dbe7f0;margin:32px 0;}
.doc-page strong{color:#14304a;}
.doc-page .lead{font-size:16.5px;}
.doc-page .meta{font-size:14px;color:#6a8399;}
.doc-page .tablewrap{overflow-x:auto;margin:0 0 20px;}
.doc-page table{border-collapse:collapse;width:100%;min-width:520px;font-size:14.5px;}
.doc-page th,.doc-page td{border:1px solid #dbe7f0;padding:10px 13px;text-align:left;
  vertical-align:top;line-height:1.55;color:#3f5b70;}
.doc-page th{background:#eef4f9;color:#14304a;font-weight:600;}
.doc-page a{color:var(--accent);}
/* miejsca wymagające danych od klienta — mają rzucać się w oczy przed publikacją */
.todo{background:#fff2cc;border-bottom:2px solid #d9a520;color:#7a5400;
  padding:1px 6px;border-radius:4px;font-weight:600;font-size:.92em;}


/* --- 4 · :hover / :focus z prototypu ------------------------------------ */
.h-scp0:hover { background: color-mix(in srgb,var(--accent) 10%,transparent) !important; color: var(--accent) !important; }
.h-scp1:hover { filter: brightness(1.06) !important; }
.h-scp2:hover { color: rgb(79, 184, 166) !important; }
.h-scp3:hover { background: rgb(255, 255, 255) !important; border-color: color-mix(in srgb,var(--accent) 35%,#e6eff6) !important; box-shadow: rgba(20, 48, 74, 0.35) 0px 18px 40px -22px !important; transform: translateY(-3px) !important; }
.h-scp4:focus { outline: 3px solid color-mix(in srgb,var(--accent) 45%,transparent) !important; outline-offset: 2px !important; }
.h-scp5:hover { box-shadow: rgba(20, 48, 74, 0.4) 0px 18px 40px -22px !important; }
.h-scp6:hover { border-color: var(--accent) !important; color: var(--accent) !important; }
.h-scp7:hover { color: rgb(255, 255, 255) !important; }
.h-scp8:hover { color: rgb(220, 232, 242) !important; }
.o-scp0:hover { background: color-mix(in srgb,var(--accent) 10%,transparent) !important; color: var(--accent) !important; }
.o-scp1:hover { filter: brightness(1.06) !important; }
.o-scp2:hover { background: color-mix(in srgb,var(--accent) 8%,transparent) !important; color: var(--accent) !important; }
.o-scp3:hover { border-color: var(--accent) !important; box-shadow: rgba(20, 48, 74, 0.45) 0px 22px 46px -26px !important; transform: translateY(-3px) !important; }
.o-scp4:focus { outline: 3px solid color-mix(in srgb,var(--accent) 45%,transparent) !important; outline-offset: 2px !important; border-color: var(--accent) !important; }
.o-scp5:focus { outline: 2px solid color-mix(in srgb,var(--accent) 50%,transparent) !important; outline-offset: 3px !important; border-radius: 6px !important; }
.o-scp6:hover { color: var(--accent) !important; }
.o-scp7:hover { color: rgb(34, 71, 95) !important; background: rgb(233, 241, 247) !important; }
.o-scp8:focus { outline: 2px solid color-mix(in srgb,var(--accent) 45%,transparent) !important; outline-offset: 2px !important; }
.o-scp9:focus { outline: 2px solid color-mix(in srgb,var(--accent) 45%,transparent) !important; outline-offset: 2px !important; border-radius: 8px !important; }
.scpa:hover { gap: 12px !important; }
.scpb:focus { outline: 2px solid color-mix(in srgb,var(--accent) 50%,transparent) !important; outline-offset: 2px !important; border-radius: 8px !important; }
.scpc:hover { color: rgb(63, 91, 112) !important; }
.scpd:focus { outline: 2px solid color-mix(in srgb,var(--accent) 40%,transparent) !important; outline-offset: 2px !important; border-radius: 8px !important; }
.scpe:hover { color: rgb(255, 255, 255) !important; }

