.seo-subpage { background: #fff; }
.subpage-hero { min-height: 620px; position: relative; display: grid; align-items: center; overflow: hidden; color: #fff; background: #071a33; }
.subpage-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.subpage-hero__overlay { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(3,14,29,.93), rgba(3,14,29,.65) 62%, rgba(3,14,29,.46)); }
.subpage-hero__content { position: relative; z-index: 2; padding-block: 76px 86px; }
.breadcrumbs { margin-bottom: 38px; display: flex; flex-wrap: wrap; gap: 7px; align-items: center; color: #c9d9e9; font-size: .74rem; font-weight: 700; }
.breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.breadcrumbs b { opacity: .5; }
.subpage-hero h1 { max-width: 940px; margin: 0 0 22px; font-size: clamp(2.5rem, 9vw, 5rem); }
.subpage-hero__content > p:not(.hero-kicker) { max-width: 780px; margin: 0; color: #e3edf7; font-size: 1.05rem; }
.subpage-hero__actions { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 12px; }
.seo-section { padding-block: 76px; }
.seo-section--soft { background: #f3f6fa; }
.section-heading { max-width: 900px; margin-bottom: 38px; }
.section-heading h2 { margin-bottom: 14px; }
.section-heading > p:last-child { color: #5c6677; }
.seo-two-col { display: grid; gap: 42px; }
.seo-two-col article > p { color: #3d4653; }
.check-list { margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; list-style: none; }
.check-list li { padding: 12px 14px 12px 40px; position: relative; color: #243247; background: #eff7ff; border: 1px solid #d6eaff; border-radius: 10px; font-weight: 750; }
.check-list li::before { content: "✓"; position: absolute; left: 15px; color: #0879ed; font-weight: 950; }
.signal-card { padding: 28px; align-self: start; background: #071a33; color: #fff; border-radius: 20px; box-shadow: 0 24px 64px rgba(7,26,51,.2); }
.signal-card h2 { font-size: 1.8rem; }
.signal-card p { padding: 10px 0; margin: 0; color: #dbe7f3; border-bottom: 1px solid rgba(255,255,255,.12); }
.signal-card .primary-button { width: 100%; margin-top: 24px; }
.process-grid { display: grid; gap: 14px; }
.process-grid article { padding: 26px; background: #fff; border: 1px solid #dce5ef; border-radius: 16px; }
.process-grid b { color: #0879ed; font-size: .78rem; letter-spacing: .12em; }
.process-grid h3 { margin: 22px 0 10px; font-size: 1.3rem; }
.process-grid p { margin: 0; color: #5c6677; font-size: .9rem; }
.seo-card-grid { display: grid; gap: 16px; }
.seo-content-card { min-height: 230px; padding: 25px; display: flex; flex-direction: column; color: #111827; background: #fff; border: 1px solid #dce5ef; border-radius: 16px; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.seo-content-card:hover { transform: translateY(-3px); border-color: #8bc7ff; box-shadow: 0 18px 42px rgba(7,26,51,.1); }
.seo-content-card > span { color: #0879ed; font-size: .7rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.seo-content-card h3 { margin: 24px 0 10px; font-size: 1.35rem; }
.seo-content-card p { margin: 0 0 20px; color: #5c6677; font-size: .88rem; }
.seo-content-card b { margin-top: auto; color: #0567ca; font-size: .8rem; }
.link-cloud { display: flex; flex-wrap: wrap; gap: 9px; }
.link-cloud a, .nearby-links a { padding: 8px 12px; color: #405069; background: #fff; border: 1px solid #d7e0ea; border-radius: 999px; font-size: .78rem; font-weight: 750; }
.link-cloud a:hover, .nearby-links a:hover { color: #fff; background: #0879ed; border-color: #0879ed; }
.nearby-links { margin-top: 34px; padding-top: 26px; display: flex; flex-wrap: wrap; gap: 9px; align-items: center; border-top: 1px solid #dce5ef; }
.nearby-links strong { width: 100%; margin-bottom: 4px; }
.article-layout { display: grid; gap: 40px; }
.guide-article { display: grid; gap: 38px; }
.guide-article section { padding-bottom: 38px; border-bottom: 1px solid #dce5ef; }
.guide-article section > span { color: #0879ed; font-size: .78rem; font-weight: 900; letter-spacing: .12em; }
.guide-article h2 { margin: 12px 0 16px; font-size: clamp(1.7rem, 5vw, 2.5rem); }
.guide-article p { margin: 0; color: #3f4855; }
.article-aside { padding: 28px; align-self: start; background: #eff7ff; border: 1px solid #d1e8ff; border-radius: 18px; }
.article-aside > strong { color: #071a33; font-size: 1.4rem; }
.article-aside p { color: #4e5e73; }
.article-aside .primary-button { width: 100%; }
.seo-contact { padding-block: 82px; color: #fff; background: linear-gradient(145deg, #0879ed, #0757c5); }
.seo-contact__grid { display: grid; gap: 38px; }
.seo-contact h2 { margin-bottom: 18px; }
.seo-contact a { font-weight: 900; }
.seo-contact ul { margin: 28px 0 0; padding-left: 22px; }
.seo-contact li { margin-bottom: 8px; }
.seo-lead-form { align-self: start; }

@media (min-width: 760px) {
  .subpage-hero h1 { font-size: clamp(3.4rem, 5.5vw, 5.4rem); }
  .seo-two-col { grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); gap: 70px; }
  .process-grid { grid-template-columns: repeat(4, 1fr); }
  .seo-card-grid { grid-template-columns: repeat(3, 1fr); }
  .article-layout { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 76px; }
  .article-aside { position: sticky; top: 155px; }
  .seo-contact__grid { grid-template-columns: .8fr 1.2fr; align-items: start; gap: 64px; }
}

@media (max-width: 620px) {
  .check-list { grid-template-columns: 1fr; }
  .subpage-hero__actions .primary-button { width: 100%; }
  .seo-card-grid { grid-template-columns: 1fr; }
}

/* --- Silnik treści (tools/seo-engine): karty sytuacji, listy ryzyka, pasek CTA --- */
.case-grid { margin-top: 26px; display: grid; gap: 14px; }
.case-card { padding: 22px; background: #fff; border: 1px solid #dce5ef; border-radius: 14px; }
.case-card h3 { margin: 0 0 8px; font-size: 1.12rem; }
.case-card p { margin: 0; color: #4b5565; font-size: .92rem; }
.case-card--ctx { background: #eff7ff; border-color: #d1e8ff; }
.plain-list { margin: 22px 0 0; padding: 0; display: grid; gap: 12px; list-style: none; }
.plain-list li { position: relative; padding-left: 26px; color: #3d4653; }
.plain-list li::before { content: ""; position: absolute; left: 3px; top: .6em; width: 10px; height: 10px; border-radius: 50%; background: #0879ed; }
.plain-list--warn li::before { background: #d9480f; }
.cta-strip { padding: 30px; display: grid; gap: 22px; align-items: center; background: #eff7ff; border: 1px solid #d1e8ff; border-radius: 20px; }
.cta-strip h2 { margin: 0 0 8px; font-size: clamp(1.5rem, 4vw, 2.1rem); }
.cta-strip p { margin: 0; color: #3d4653; }
.cta-strip__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.seo-group h3 a { color: inherit; }
.seo-group h3 a:hover { text-decoration: underline; }
@media (min-width: 760px) {
  .case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .case-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cta-strip { grid-template-columns: 1.2fr .8fr; padding: 38px 44px; }
}
@media (max-width: 620px) {
  .cta-strip__actions .primary-button { width: 100%; }
}
.guide-lead { margin: 0; color: #243247; font-size: 1.12rem; font-weight: 600; line-height: 1.6; }
.guide-article .plain-list { margin-top: 14px; }
.article-aside p a { text-decoration: underline; }

/* Konkretny Hydraulik Chorzów: adres biura, linki prawne, strony prawne */
.footer-address{font-style:normal;color:inherit;opacity:.82;margin-top:6px;font-size:.92rem}
.footer-bottom{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;align-items:center}
.footer-legal{display:inline-flex;flex-wrap:wrap;gap:6px 16px}
.footer-legal a{color:inherit;opacity:.82;text-decoration:underline}
.contact-address{margin:10px 0 0;opacity:.9;font-size:.95rem}
.legal-page{max-width:820px}
.legal-page h2{margin:28px 0 8px;font-size:1.25rem}
.legal-page p,.legal-page li{line-height:1.65}

/* Logo „Konkretny Hydraulik Chorzów” to układ pionowy z napisem – większy znak w nagłówku i jasne tło w ciemnej stopce. */
.logo-mark{width:52px;height:52px}
.footer-brand img{width:64px;height:64px;padding:4px;background:#fff;border-radius:12px;box-sizing:border-box}
@media (min-width:760px){.logo-mark{width:64px;height:64px}.header-inner{min-height:88px}}