/*
Theme Name: FOXCYBER
Theme URI: https://foxcyber.pl
Author: FOXCYBER.PL
Description: Ciemny, responsywny motyw marki FOXCYBER.PL (NIS2/KSC, RODO, ISO 27001, ISO 22301). Logo i kolory marki, bezpieczny formularz kontaktowy bez wtyczek, nagłówki bezpieczeństwa, dane strukturalne.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: foxcyber
*/
:root{--bg:#000916;--bg2:#041627;--card:#071F3B;--card2:#0D345C;--line:rgba(110,170,230,.22);--tx:#E6EEF8;--mut:#A3B7CC;--or:#FF681C;--btn:#C94B08;--cy:#27C3FF;--bl:#3B8CFF;--r:16px}
*,*:before,*:after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:radial-gradient(900px 500px at 85% -5%,rgba(39,120,255,.22),transparent 60%) no-repeat,radial-gradient(700px 420px at 0 30%,rgba(255,104,28,.08),transparent 60%) no-repeat,var(--bg);color:var(--tx);font:16px/1.65 "Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto}
a{color:var(--cy)}
h1,h2,h3{color:#fff;font-weight:800;line-height:1.15;margin:0 0 .5em;letter-spacing:.005em}
h2{font-size:clamp(1.55rem,3.4vw,2.35rem)}h3{font-size:1.15rem}
p{margin:0 0 1em}
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,32px)}
.lead{color:var(--mut);max-width:62ch;font-size:1.06rem}
section{padding:clamp(46px,7vw,86px) 0}
.alt{background:linear-gradient(180deg,rgba(7,31,59,.6),rgba(7,31,59,0))}
.sk{position:absolute;left:-9999px}.sk:focus{left:12px;top:12px;background:#fff;color:#000;padding:10px 14px;z-index:99}
:focus-visible{outline:3px solid var(--cy);outline-offset:3px;border-radius:6px}
.ic{width:1.5em;height:1.5em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
/* nagłówek */
.hd{position:sticky;top:0;z-index:50;background:rgba(0,9,22,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hd .wrap{display:flex;align-items:center;gap:20px;min-height:72px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.brand img{width:52px;height:52px}
.wm{font-weight:800;font-size:1.45rem;letter-spacing:.01em;color:#fff;line-height:1}
.wm b{color:var(--or)}.nv ul{display:flex;gap:4px 22px;list-style:none;margin:0;padding:0}
.nv a{white-space:nowrap;color:var(--mut);text-decoration:none;font-weight:600;font-size:.95rem;padding:10px 0;display:inline-block}
.nv a:hover{color:#fff}
.mb{display:none;background:none;border:1px solid var(--line);color:#fff;border-radius:10px;width:46px;height:46px;cursor:pointer;align-items:center;justify-content:center}
/* przyciski */
.btn{display:inline-flex;text-align:left;align-items:center;gap:10px;min-height:48px;padding:12px 26px;border-radius:999px;border:2px solid transparent;font:700 .98rem/1.2 inherit;text-decoration:none;cursor:pointer;color:#fff;transition:background .2s,border-color .2s}
.bo{background:var(--btn)}.bo:hover{background:#E0580F}
.bg{border-color:rgba(255,255,255,.5);background:transparent}.bg:hover{border-color:var(--or)}
.bs{white-space:nowrap;min-height:42px;padding:9px 20px;font-size:.9rem}
.btn .ic{width:1.15em;height:1.15em}
/* hero */
.hero{padding:clamp(34px,6vw,72px) 0 clamp(30px,5vw,56px)}
.hg{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,4vw,48px);align-items:center}
.hero h1{font-size:clamp(2rem,5.2vw,3.7rem);line-height:1.04;text-transform:uppercase;letter-spacing:.01em}
.hero h1 em{font-style:normal;color:var(--or)}
.hero .sub{color:#C5D4E4;font-size:clamp(1rem,1.6vw,1.15rem);max-width:54ch}
.tags{display:flex;flex-wrap:wrap;gap:6px 0;list-style:none;padding:0;margin:0 0 24px;font-weight:700;font-size:.95rem}
.tags li+li:before{content:"|";color:var(--or);margin:0 12px}
.cta{display:flex;flex-wrap:wrap;gap:12px}
.hv{position:relative}
.hv img{display:block;width:100%;border-radius:20px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 100%);filter:drop-shadow(0 0 36px rgba(39,140,255,.28))}
.five{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:clamp(28px,5vw,52px);padding:20px;border:1px solid var(--line);border-radius:var(--r);background:rgba(7,31,59,.55)}
.five div{display:flex;align-items:center;gap:12px;font-weight:600;font-size:.95rem}
.five .ic{color:var(--or);width:1.9em;height:1.9em}
/* karty */
.g{display:grid;gap:18px}
.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g6{grid-template-columns:repeat(3,1fr)}
.card{background:radial-gradient(120% 90% at 100% 0,rgba(255,255,255,.06),transparent 55%),var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column}
.svc{--ac:var(--bl)}.svc.rodo{--ac:#7FD3FF}.svc.i27{--ac:var(--cy)}.svc.i22{--ac:var(--or)}
.svc .k{color:var(--mut);font-size:.8rem;font-weight:700;letter-spacing:.14em;margin:0}
.svc h3{font-size:clamp(1.7rem,2.6vw,2.2rem);color:var(--ac);margin:.05em 0 .25em}
.svc .d{color:var(--ac);font-weight:600;margin-bottom:14px}
.ck{list-style:none;margin:0 0 20px;padding:0}
.ck li{position:relative;padding:5px 0 5px 30px;color:var(--tx);font-size:.96rem}
.ck li:before{content:"";position:absolute;left:0;top:8px;width:20px;height:20px;background:var(--ac,var(--cy));-webkit-mask:var(--chk) center/contain no-repeat;mask:var(--chk) center/contain no-repeat}
:root{--chk:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6l8-3z'/%3E%3Cpath d='M8.5 12l2.5 2.5L16 9.5'/%3E%3C/svg%3E")}
.card .btn{margin-top:auto;align-self:flex-start}
.med{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:start;padding:clamp(24px,4vw,40px);border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,rgba(13,52,92,.7),rgba(4,22,39,.9))}
.med>div{min-width:0}.med>.ic{width:76px;height:76px;color:var(--cy)}
.med .ck{columns:2;column-gap:32px}.med .ck li{break-inside:avoid}
.pk{border-top:4px solid var(--ac);--ac:var(--cy)}.pk:nth-child(2){--ac:var(--or)}.pk:nth-child(3){--ac:var(--bl)}
.pk .m{color:var(--mut);font-size:.9rem;margin:auto 0 0;padding-top:12px}
.why{display:flex;gap:14px;align-items:flex-start}
.why .ic{color:var(--or);width:2.1em;height:2.1em}.why b{display:block;color:#fff}.why span{color:var(--mut);font-size:.92rem}
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
table{border-collapse:collapse;width:100%;min-width:520px}
th,td{padding:13px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);font-size:.96rem}
thead th{background:rgba(13,52,92,.6);color:#fff}tbody th{color:#fff;background:rgba(7,31,59,.5)}tr:last-child>*{border-bottom:0}
.st{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:s}
.st li{counter-increment:s;padding:20px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.st .ic{color:var(--or);width:2em;height:2em;margin-bottom:10px}
.st b{display:block;color:#fff;font-size:1.05rem}.st span{color:var(--mut);font-size:.92rem}
.st li:after{content:counter(s);float:right;margin-top:-52px;color:var(--mut);font-weight:700;font-size:.85rem}
.who{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(22px,4vw,56px);align-items:center}
.who img{width:min(280px,70%);display:block;margin:auto}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.chips li{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:5px 14px;font-size:.9rem}
details{border:1px solid var(--line);background:var(--card);border-radius:12px;margin-bottom:10px;padding:0 20px}
summary{cursor:pointer;font-weight:700;color:#fff;padding:16px 0}
details p{color:var(--mut)}
.ko{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(22px,4vw,56px)}
form{display:grid;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(20px,3vw,32px)}
label{display:grid;gap:6px;font-weight:600;font-size:.94rem}
input,select,textarea{font:inherit;color:#fff;background:var(--bg2);border:1px solid #3A5A80;border-radius:10px;padding:12px 14px;width:100%;min-height:48px}
input::placeholder{color:#7C93AB}
label.cb{display:flex;gap:10px;font-weight:400;font-size:.85rem;color:var(--mut);align-items:flex-start}label.cb input{width:22px;min-height:22px;margin-top:2px}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.msg{border-radius:10px;padding:12px 14px;margin:0;font-size:.95rem}.msg.ok{background:#0B3B2A;color:#B8F2D2}.msg.er{background:#4A1620;color:#FFD0D6}
.ft{border-top:1px solid var(--line);padding:36px 0 44px;color:var(--mut);font-size:.9rem;background:#000611}
.ft .wrap{display:flex;flex-wrap:wrap;gap:24px 48px;justify-content:space-between;align-items:flex-start}
.ft a{color:var(--mut)}.ft a:hover{color:#fff}
.pg{padding:clamp(34px,6vw,64px) 0}.pg .card{margin-bottom:18px}.pg h1{font-size:clamp(1.7rem,4vw,2.4rem)}
@media(max-width:1060px){.g4{grid-template-columns:repeat(2,1fr)}.st{grid-template-columns:repeat(3,1fr)}.five{grid-template-columns:repeat(3,1fr)}}
@media(max-width:1080px){
.hd .wrap{flex-wrap:wrap}.js .mb{display:inline-flex}
.js .nv{display:none;order:5;flex-basis:100%;padding-bottom:12px}.js .nv.open{display:block}
.nv ul{flex-direction:column}.nv a{padding:12px 4px;width:100%;border-top:1px solid var(--line)}
.hd .bo{display:none}}
@media(max-width:960px){
.hg,.who,.ko{grid-template-columns:1fr}.hv{order:-1;max-width:560px}
.med{grid-template-columns:1fr}.med .ck{columns:1}.g3,.g6{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){
.g4,.g3,.g6,.st{grid-template-columns:1fr}.five{grid-template-columns:1fr 1fr;padding:14px}
.cta .btn{width:100%;justify-content:center}.brand img{width:44px;height:44px}
.tags li+li:before{margin:0 8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}