:root {
    --canvas: #f5f4fc;
    --paper: #ffffff;
    --sky: #e3f4fa;
    --lavender: #e9e8fa;
    --honey: #f4cc6a;
    --azure: #387fa2;
    --royal: #5270ac;
    --gold: #b98123;
    --ink: #465e79;
    --quiet: #667d91;
    --line: #c5d7e4;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--canvas); color: var(--ink); font-family: "Segoe UI", "Trebuchet MS", Arial, sans-serif; line-height: 1.62; }
h1, h2, h3 { margin: 0; font-weight: 830; line-height: 1.16; letter-spacing: -.024em; }
h1 { font-size: 40px; }
h2 { font-size: 28px; }
h3 { font-size: 21px; }
p { margin: 0 0 15px; font-size: 16px; line-height: 1.7; }
strong { font-weight: 800; color: var(--royal); }
a { color: inherit; }
.wrap { width: min(calc(100% - 52px), 1160px); margin: 0 auto; }
.topline { height: 9px; background: repeating-linear-gradient(90deg, var(--gold) 0, var(--gold) 68px, var(--azure) 68px, var(--azure) 136px); }
.site-head { background: var(--paper); border-bottom: 1px solid var(--line); }
.site-head .wrap { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.signature { display: inline-flex; align-items: center; gap: 13px; white-space: nowrap; text-decoration: none; font-size: 23px; font-weight: 900; letter-spacing: -.045em; color: var(--royal); }
.signature-mark { display: inline-block; width: 38px; height: 38px; position: relative; border: 3px solid var(--azure); border-radius: 5px; background: var(--sky); }
.signature-mark:before { content: ""; position: absolute; width: 18px; height: 18px; border: 4px solid var(--royal); border-radius: 50%; top: 9px; left: 7px; }
.signature-mark:after { content: ""; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); top: 4px; left: 6px; }
.navigation { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.navigation a { padding: 8px 12px; border-bottom: 3px solid transparent; text-decoration: none; font-weight: 750; font-size: 14px; }
.navigation a:hover, .navigation a:focus-visible, .navigation a[aria-current="page"] { color: var(--azure); border-bottom-color: var(--gold); background: #f3f7fc; }
.eyeline { font-size: 12px; text-transform: uppercase; letter-spacing: .19em; color: var(--gold); font-weight: 900; }
.lede { padding: 55px 0 56px; background: var(--lavender); }
.title-rail { display: grid; grid-template-columns: 72px 1fr; gap: 20px; align-items: center; margin-bottom: 32px; }
.case-no { display: flex; align-items: center; justify-content: center; background: var(--honey); color: var(--royal); font-size: 26px; font-weight: 900; min-height: 70px; border-bottom: 6px solid var(--azure); }
.title-rail .eyeline { color: var(--azure); margin-bottom: 8px; display: block; }
.title-rail h1 { color: var(--royal); }
.lede-core { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(280px,.7fr); gap: 35px; align-items: stretch; }
.lede-body { border-left: 5px solid var(--gold); padding-left: 26px; }
.lede-body p:last-child { margin-bottom: 0; }
.graphic-board { background: var(--paper); min-width: 0; padding: 20px; border: 2px solid #bad1e5; display: flex; flex-direction: column; justify-content: space-between; gap: 17px; position: relative; }
.graphic-board .machine-label { display: flex; gap: 8px; align-items: center; justify-content: space-between; border-bottom: 2px solid var(--line); padding-bottom: 12px; color: var(--azure); font-size: 12px; letter-spacing: .14em; font-weight: 900; }
.waveform { display: flex; align-items: center; justify-content: center; gap: 6px; flex: 1; min-height: 150px; border-block: 1px dashed var(--line); }
.waveform span { display: block; width: 8%; background: var(--azure); border-radius: 2px; }
.waveform span:nth-child(1), .waveform span:nth-child(7) { height: 34px; }
.waveform span:nth-child(2), .waveform span:nth-child(6) { height: 75px; background: var(--gold); }
.waveform span:nth-child(3), .waveform span:nth-child(5) { height: 118px; background: var(--royal); }
.waveform span:nth-child(4) { height: 150px; background: var(--azure); }
.graphic-note { padding: 13px; background: var(--sky); border-left: 5px solid var(--gold); }
.graphic-note p { margin: 0; font-size: 16px; }
.cta-flow { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.cta { display: inline-flex; align-items: center; justify-content: center; padding: 12px 23px; min-height: 48px; font-weight: 900; line-height: 1.2; font-size: 15px; text-decoration: none; border: 2px solid transparent; transition: transform .15s, background .15s; }
.cta:hover, .cta:focus-visible { transform: translateY(-3px); }
.cta-phone { background: var(--royal); border-color: var(--royal); color: var(--paper); }
.cta-form { background: var(--paper); color: var(--azure); border-color: var(--azure); }
.local-work { background: var(--paper); border-bottom: 1px solid var(--line); padding: 36px 0 40px; }
.local-work h2 { color: var(--royal); margin-bottom: 19px; }
.area-columns { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 25px; }
.area-columns p { margin: 0; border-top: 4px solid var(--gold); padding-top: 17px; }
.workbench { padding: 62px 0 69px; background: var(--canvas); }
.workbench h2 { color: var(--royal); margin-bottom: 27px; }
.bench-entry { background: var(--paper); display: grid; grid-template-columns: minmax(190px,.34fr) minmax(0,1fr); gap: 28px; margin-bottom: 16px; border: 1px solid var(--line); }
.bench-title { border-right: 2px solid var(--line); padding: 24px; background: var(--sky); }
.bench-title .small-count { color: var(--gold); font-weight: 900; font-size: 25px; display: block; margin-bottom: 12px; line-height: 1; }
.bench-title h3 { color: var(--royal); }
.bench-text { display: grid; grid-template-columns: 1fr 1fr; gap: 23px; align-content: center; padding: 23px 25px 23px 0; }
.bench-text p { margin: 0; }
.inline-link { border-bottom: 1px dotted var(--azure); text-decoration: none; color: var(--royal); }
.inline-link:hover, .inline-link:focus-visible { border-bottom: 1px solid var(--royal); color: var(--azure); }
.service-note { background: var(--sky); padding: 63px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.service-note h2 { color: var(--royal); margin-bottom: 25px; }
.note-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; }
.note-cluster { border-top: 5px solid var(--azure); padding: 23px 25px 9px; background: var(--paper); }
.note-cluster:last-child { border-top-color: var(--gold); }
.note-cluster h3 { color: var(--royal); margin-bottom: 13px; }
.availability { padding: 59px 0 65px; background: var(--paper); }
.availability .wrap { display: grid; grid-template-columns: 1fr minmax(290px,.72fr); gap: 36px; align-items: stretch; }
.availability h2 { color: var(--royal); margin-bottom: 17px; }
.hours-paper { padding: 24px 27px; border: 2px solid var(--royal); background: var(--lavender); display: flex; flex-direction: column; justify-content: center; gap: 11px; }
.hours-paper h3 { margin-bottom: 7px; color: var(--azure); }
.hours-paper div { display: flex; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--line); padding: 7px 0 11px; }
.hours-paper strong { white-space: nowrap; color: var(--royal); }
.end-strip { padding: 42px 0 48px; background: var(--royal); color: var(--paper); }
.end-strip .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px; }
.end-strip h2 { color: var(--paper); margin-bottom: 11px; }
.end-strip p { color: #edf5ff; max-width: 66ch; margin: 0; }
.end-strip .cta-flow { margin: 0; }
.end-strip .cta-phone { background: var(--paper); color: var(--royal); border-color: var(--paper); }
.end-strip .cta-form { background: var(--honey); color: var(--ink); border-color: var(--honey); }
.bottom { padding: 24px 0; background: var(--paper); border-top: 1px solid var(--line); }
.bottom .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.bottom b { color: var(--royal); font-size: 18px; }
.bottom nav { display: flex; flex-wrap: wrap; gap: 18px; }
.bottom a { text-decoration: none; font-size: 14px; font-weight: 700; }
.bottom a:hover, .bottom a:focus-visible { color: var(--azure); }
.bottom .discreet { color: var(--quiet); font-size: 12px; font-weight: 400; }

/* Oddzielna kompozycja napraw */
.fault-cover { padding: 60px 0 56px; background: var(--sky); }
.fault-cover h1 { color: var(--royal); margin: 15px 0 22px; }
.fault-cover-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(240px,.48fr); gap: 38px; align-items: stretch; }
.cover-copy p { max-width: 82ch; }
.fault-ticket { background: var(--paper); border: 2px solid var(--royal); padding: 23px; display: flex; flex-direction: column; justify-content: space-evenly; }
.fault-ticket h2 { color: var(--royal); margin-bottom: 14px; }
.fault-ticket span { display: block; padding: 12px 0; font-size: 15px; font-weight: 750; border-bottom: 1px solid var(--line); }
.fault-ticket span:before { content: ""; display: inline-block; width: 10px; height: 10px; background: var(--gold); margin-right: 11px; }
.fault-catalog { padding: 65px 0; background: var(--paper); }
.fault-catalog h2 { color: var(--royal); margin-bottom: 24px; }
.fault-entry { display: grid; grid-template-columns: minmax(220px,.36fr) minmax(0,1fr); gap: 30px; border-top: 2px solid var(--line); padding: 24px 0 26px; }
.fault-entry:last-child { border-bottom: 2px solid var(--line); }
.fault-entry h3 { color: var(--azure); }
.fault-entry p:last-child { margin-bottom: 0; }
.fault-process { padding: 59px 0 62px; background: var(--lavender); }
.fault-process h2 { color: var(--royal); margin-bottom: 24px; }
.fault-process-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.fault-process-grid div { padding-top: 20px; border-top: 5px solid var(--gold); }

/* Oddzielna kompozycja oferty */
.offer-cover { padding: 59px 0; background: var(--paper); border-bottom: 1px solid var(--line); }
.offer-cover-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(270px,.52fr); gap: 32px; align-items: stretch; }
.offer-cover h1 { color: var(--royal); margin: 15px 0 23px; }
.offer-stamp { background: var(--honey); padding: 24px; border: 4px double var(--gold); display: flex; flex-direction: column; justify-content: space-between; gap: 15px; }
.offer-stamp h2 { color: var(--royal); }
.offer-stamp p { padding-bottom: 11px; border-bottom: 1px solid #cba552; margin: 0; }
.offer-ledger { padding: 65px 0; background: var(--canvas); }
.offer-ledger h2 { color: var(--royal); margin-bottom: 30px; }
.ledger-lines { border-top: 4px solid var(--royal); }
.ledger-row { display: grid; grid-template-columns: 58px 230px minmax(0,1fr); gap: 22px; align-items: start; padding: 23px 0; border-bottom: 1px solid var(--line); }
.ledger-row .ledger-index { color: var(--gold); font-size: 23px; font-weight: 900; }
.ledger-row h3 { color: var(--azure); }
.ledger-row p { margin-bottom: 0; }
.offer-condition { padding: 59px 0; background: var(--sky); }
.offer-condition h2 { color: var(--royal); margin-bottom: 25px; }
.condition-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.condition-grid section { background: var(--paper); border-top: 5px solid var(--gold); padding: 24px 26px 13px; }
.condition-grid section + section { border-top-color: var(--azure); }
.condition-grid h3 { color: var(--royal); margin-bottom: 15px; }

@media (max-width: 1040px) {
    .lede-core { grid-template-columns: minmax(0,1fr) minmax(250px,.68fr); gap: 23px; }
    .bench-entry { grid-template-columns: minmax(170px,.32fr) 1fr; gap: 20px; }
    .bench-text { gap: 15px; }
    .offer-cover-grid { gap: 24px; }
}
@media (max-width: 820px) {
    .wrap { width: min(calc(100% - 36px), 1160px); }
    .site-head .wrap { flex-wrap: wrap; justify-content: center; padding: 15px 0; gap: 9px 18px; }
    .navigation { justify-content: center; }
    .lede-core { grid-template-columns: 1fr; }
    .graphic-board { display: none; }
    .area-columns { grid-template-columns: 1fr; gap: 15px; }
    .bench-entry { grid-template-columns: 1fr; gap: 0; }
    .bench-title { border-right: none; border-bottom: 2px solid var(--line); padding: 17px 22px; display: flex; align-items: center; gap: 16px; }
    .bench-title .small-count { margin: 0; }
    .bench-text { padding: 22px; }
    .availability .wrap, .fault-cover-grid, .offer-cover-grid { grid-template-columns: 1fr; }
    .fault-ticket, .offer-stamp { gap: 12px; }
    .ledger-row { grid-template-columns: 44px minmax(0,1fr); gap: 10px 16px; }
    .ledger-row p { grid-column: 2; }
    .condition-grid { gap: 18px; }
}
@media (max-width: 600px) {
    .site-head .wrap { flex-direction: column; padding: 15px 0; gap: 9px; }
    .signature { font-size: 21px; }
    .navigation { justify-content: center; gap: 0; }
    .navigation a { font-size: 13px; padding: 8px 9px; }
    .title-rail { grid-template-columns: 50px 1fr; gap: 12px; }
    .case-no { font-size: 20px; min-height: 65px; }
    .lede, .workbench, .service-note, .availability, .fault-cover, .fault-catalog, .fault-process, .offer-cover, .offer-ledger, .offer-condition { padding: 40px 0; }
    .lede-body { padding-left: 17px; }
    .bench-text, .note-columns, .fault-process-grid, .condition-grid { grid-template-columns: 1fr; }
    .bench-text { gap: 16px; }
    .fault-entry { grid-template-columns: 1fr; gap: 12px; }
    .cta-flow { flex-direction: column; }
    .cta { width: 100%; }
    .end-strip .wrap, .bottom .wrap { flex-direction: column; align-items: stretch; }
    .bottom nav { justify-content: space-between; }
    .end-strip .cta-flow { width: 100%; }
    h1 { font-size: 40px; }
    h2 { font-size: 28px; }
    p { font-size: 16px; }
}
@media (max-width: 420px) {
    .signature { font-size: 17px; gap: 7px; }
    .signature-mark { width: 31px; height: 31px; }
    .signature-mark:before { width: 14px; height: 14px; border-width: 3px; top: 8px; left: 5px; }
    .signature-mark:after { width: 6px; height: 6px; top: 3px; left: 4px; }
}