/* DOMAKO – strony treści: Oferta, Realizacje, Serwis, Montaż dla firm (uzupełnia blog.css) */
.phero{position:relative;padding:70px 0 50px;overflow:hidden;isolation:isolate}
.phero .bg{position:absolute;inset:0;z-index:-1}
.phero .bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.38) saturate(.75)}
.phero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--navy) 10%,rgba(7,24,36,.55) 60%,rgba(7,24,36,.3)),linear-gradient(0deg,var(--navy),transparent 45%)}
.phero h1{font:700 clamp(2.8rem,7vw,5.8rem)/.92 'Barlow Condensed','Barlow Fallback',sans-serif;text-transform:uppercase;margin:16px 0 20px;max-width:980px}
.phero h1 span{color:var(--teal-2);display:block}
.phero .lead{font-size:1.12rem;color:#c3d8e0;max-width:720px}
.phero .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.ticks{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:26px;font-size:.9rem;color:#b8cdd6;list-style:none}
.ticks li{display:flex;gap:8px;align-items:center}
.ticks li::before{content:"";width:16px;height:16px;flex:none;border-radius:50%;background:var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' stroke='white' stroke-width='2' fill='none'/%3E%3C/svg%3E") center/12px no-repeat}

.pnav{position:sticky;top:84px;z-index:30;background:rgba(7,24,36,.92);backdrop-filter:blur(12px);border-block:1px solid var(--line)}
.pnav .container{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:12px 0}
.pnav .container::-webkit-scrollbar{display:none}
.pnav a,.gtabs button{flex:none;padding:8px 15px;border-radius:999px;border:1px solid var(--line);font:600 .84rem Manrope,'Manrope Fallback',sans-serif;color:#cfe3ea;background:none;cursor:pointer;white-space:nowrap;transition:.2s}
.pnav a:hover,.gtabs button:hover,.gtabs button.on{border-color:var(--teal-2);background:rgba(10,166,194,.16);color:#fff}
.gtabs button span{font:500 .7rem 'JetBrains Mono',monospace;opacity:.7;margin-left:6px}
html{scroll-padding-top:150px}

.osec{padding:80px 0 10px;scroll-margin-top:140px}
.osec+.osec{border-top:1px solid var(--line);margin-top:60px}
.ogrid{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:start}
.osec h2,.sec h2{font:700 clamp(2.2rem,4.6vw,3.6rem)/.95 'Barlow Condensed','Barlow Fallback',sans-serif;text-transform:uppercase;margin:14px 0 16px}
.osec h2 span,.sec h2 span{color:var(--teal-2)}
.osec .intro,.sec .intro{color:#b8cdd6;font-size:1.04rem;max-width:760px}
.oitems{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}
.oi{padding:22px;border-radius:16px;background:var(--card);border:1px solid var(--line);transition:border-color .3s,transform .35s var(--ease)}
.oi:hover{border-color:rgba(44,198,222,.45);transform:translateY(-3px)}
.oi h3{font:700 1.3rem/1.05 'Barlow Condensed','Barlow Fallback',sans-serif;text-transform:uppercase;margin-bottom:8px;color:#fff}
.oi h3 small{display:block;font:600 .68rem 'JetBrains Mono',monospace;letter-spacing:.14em;color:var(--teal-2);margin-bottom:6px}
.oi p{color:var(--muted);font-size:.92rem}
.oi ul{list-style:none;margin-top:10px;display:grid;gap:5px}
.oi li{font-size:.86rem;color:#cfe3ea;padding-left:16px;position:relative}
.oi li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:2px;background:var(--teal-2);transform:rotate(45deg)}
.oi.wide{grid-column:1/-1}
.oside{position:sticky;top:150px;display:grid;gap:14px}
.ogal{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ogal a{display:block;border-radius:12px;overflow:hidden;aspect-ratio:4/3;background:var(--navy-2)}
.ogal a:first-child{grid-column:1/-1;aspect-ratio:16/9}
.ogal img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease),filter .3s;filter:saturate(.9)}
.ogal a:hover img{transform:scale(1.06);filter:none}
.obox{padding:20px;border-radius:16px;background:linear-gradient(140deg,rgba(10,166,194,.18),rgba(8,26,38,.85));border:1px solid rgba(44,198,222,.3);display:grid;gap:10px}
.obox b{font:700 1.3rem/1 'Barlow Condensed','Barlow Fallback',sans-serif;text-transform:uppercase}
.obox p{color:#c3d8e0;font-size:.9rem}
.obox .links{display:flex;flex-wrap:wrap;gap:8px}
.obox .links a{font-size:.84rem;font-weight:700;color:var(--teal-3)}
.why{margin-top:22px;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 22px}
.why li{display:flex;gap:10px;font-size:.92rem;color:#cfe3ea}
.why li::before{content:"✓";color:var(--teal-2);font-weight:800}

.sec{padding:80px 0 0}
.sec .head{max-width:780px;margin-bottom:34px}
.sec .head.c{margin-inline:auto;text-align:center}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cards.c4{grid-template-columns:repeat(4,1fr)}
.cd{padding:24px;border-radius:18px;background:var(--card);border:1px solid var(--line);transition:.3s;position:relative}
.cd:hover{border-color:rgba(44,198,222,.45);transform:translateY(-4px)}
.cd .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(10,166,194,.15);border:1px solid rgba(44,198,222,.35);color:var(--teal-3);margin-bottom:16px}
.cd .ic svg{width:24px;height:24px}
.cd h3{font:700 1.3rem/1.05 'Barlow Condensed','Barlow Fallback',sans-serif;text-transform:uppercase;margin-bottom:8px}
.cd p{color:var(--muted);font-size:.92rem}
.cd .n{position:absolute;right:18px;top:14px;font:700 2.6rem/1 'Barlow Condensed',sans-serif;color:rgba(44,198,222,.18)}
.split2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.pic{border-radius:22px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3}
.pic img{width:100%;height:100%;object-fit:cover}
.chk{list-style:none;display:grid;gap:10px;margin-top:20px}
.chk li{display:flex;gap:12px;color:#cfe3ea}
.chk li::before{content:"";flex:none;width:20px;height:20px;margin-top:3px;border-radius:6px;background:var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' stroke='white' stroke-width='2' fill='none'/%3E%3C/svg%3E") center/14px no-repeat}
.banner2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.banner2 a{padding:30px;border-radius:20px;border:1px solid var(--line);background:linear-gradient(140deg,rgba(18,50,71,.85),rgba(8,26,38,.85));transition:.3s;display:grid;gap:10px}
.banner2 a:hover{border-color:var(--teal-2);transform:translateY(-4px)}
.banner2 b{font:700 1.8rem/1 'Barlow Condensed','Barlow Fallback',sans-serif;text-transform:uppercase}
.banner2 p{color:var(--muted)}
.banner2 span{color:var(--teal-3);font-weight:700}

/* FAQ */
.faq{max-width:860px;margin:0 auto;display:grid;gap:12px}
.qa{border-radius:16px;border:1px solid var(--line);background:var(--card);overflow:hidden}
.qa.open{border-color:rgba(44,198,222,.5)}
.qa button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 24px;background:none;border:0;color:#fff;font:700 1.02rem Manrope,'Manrope Fallback',sans-serif;text-align:left;cursor:pointer}
.qa .pm{flex:none;width:30px;height:30px;border-radius:50%;background:rgba(10,166,194,.15);position:relative;transition:.3s}
.qa .pm::before,.qa .pm::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;background:var(--teal-3);transform:translate(-50%,-50%);transition:.3s}
.qa .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
.qa.open .pm{background:var(--teal)}.qa.open .pm::after{transform:translate(-50%,-50%)}
.qa .ans{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease)}
.qa.open .ans{grid-template-rows:1fr}
.qa .ans>div{overflow:hidden}
.qa .ans p{padding:0 24px 22px;color:var(--muted)}

.band{margin-top:90px;border-radius:26px;padding:56px 40px;text-align:center;position:relative;overflow:hidden;background:linear-gradient(120deg,var(--teal-dark),var(--teal) 55%,#1b8fa8)}
.band::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(180deg,rgba(255,255,255,.07) 0 2px,transparent 2px 26px)}
.band>*{position:relative}
.band h2{font:700 clamp(2.2rem,4.6vw,3.8rem)/.95 'Barlow Condensed','Barlow Fallback',sans-serif;text-transform:uppercase}
.band p{max-width:640px;margin:12px auto 24px;opacity:.95}
.band .btn-primary{background:#fff;color:var(--teal-dark)}
.band .btn-ghost{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.08)}
.band .acts{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* galeria realizacji */
.gtabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 30px}
.ggroup{padding:40px 0 10px;scroll-margin-top:140px}
.ggroup h2{font:700 clamp(2rem,4vw,3rem)/1 'Barlow Condensed','Barlow Fallback',sans-serif;text-transform:uppercase;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.ggroup h2 small{font:500 .75rem 'JetBrains Mono',monospace;color:var(--teal-2);letter-spacing:.1em}
.ggroup>p{color:var(--muted);max-width:760px;margin:8px 0 20px}
.ggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));grid-auto-flow:dense;gap:10px}
.ggrid a{position:relative;display:block;border-radius:14px;overflow:hidden;background:var(--navy-2);aspect-ratio:4/3}
.ggrid a.tall{grid-row:span 2;aspect-ratio:auto}
.ggrid a.wide{grid-column:span 2;aspect-ratio:auto}
.ggrid img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease),filter .4s;filter:saturate(.92)}
.ggrid a:hover img{transform:scale(1.06);filter:none}
.ggrid a::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,24,36,.65),transparent 45%);opacity:0;transition:opacity .3s}
.ggrid a:hover::after{opacity:1}
.ggrid a span{position:absolute;left:12px;bottom:10px;z-index:1;font:600 .7rem 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:#fff;opacity:0;transform:translateY(6px);transition:.3s}
.ggrid a:hover span{opacity:1;transform:none}
.ggroup .more{margin-top:16px;display:inline-flex;gap:8px;color:var(--teal-3);font-weight:700}

/* formularz B2B */
.bform{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:30px;border-radius:22px;background:linear-gradient(160deg,rgba(18,50,71,.85),rgba(9,30,44,.85));border:1px solid var(--line)}
.bform .full{grid-column:1/-1}
.bform input,.bform textarea,.bform select{width:100%;padding:14px;border-radius:10px;background:rgba(7,24,36,.6);border:1px solid rgba(127,227,242,.2);color:#fff;font:inherit;font-size:.94rem;outline:none}
.bform input:focus,.bform textarea:focus,.bform select:focus{border-color:var(--teal-2)}
.bform textarea{min-height:120px;resize:vertical}
.bform label.c{display:flex;gap:10px;font-size:.8rem;color:var(--muted)}
.bform label.c input{width:auto;accent-color:var(--teal)}
.bform .msg{display:none;padding:12px;border-radius:10px;background:rgba(10,166,194,.15);border:1px solid var(--teal);color:var(--teal-3);font-weight:600}
.bform .msg.show{display:block}

.foot-links{display:flex;flex-wrap:wrap;gap:8px 22px;padding-bottom:26px;margin-bottom:30px;border-bottom:1px solid var(--line);font-weight:700;font-size:.9rem}
.foot-links a{color:#cfe3ea}.foot-links a:hover{color:var(--teal-3)}

@media (max-width:1024px){.ogrid,.split2{grid-template-columns:1fr}.oside{position:static}.cards,.cards.c4{grid-template-columns:1fr 1fr}.banner2{grid-template-columns:1fr}}
@media (max-width:860px){.pnav{top:72px}.nav .container{height:72px}}
@media (max-width:640px){.oitems,.why,.cards,.cards.c4,.bform{grid-template-columns:1fr}.ggrid{grid-template-columns:1fr 1fr}.ggrid a.wide{grid-column:span 2}.band{padding:40px 20px}.phero{padding:50px 0 34px}}