/* DURHEX — www v1.0 · kolory i kroje wg księgi znaku */
:root{--g:#1E2328;--g2:#2A3036;--s:#7C868F;--s2:#AEB4BA;--a:#F2A900;--a2:#B37E00;--p:#F4F2EC;--w:#fff;--l:#DDD9CE;--m:#5F646A;--r:4px;--max:1160px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--g);background:var(--p);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
h1,h2,h3,.btn,.kick,.nav a{font-family:Archivo,Inter,Arial,sans-serif}
h1{font-weight:900;font-size:clamp(36px,5.6vw,64px);line-height:1.04;letter-spacing:-.015em}
h2{font-weight:800;font-size:clamp(28px,3.6vw,42px);line-height:1.12;letter-spacing:-.01em}
h3{font-weight:800;font-size:21px;line-height:1.25}
.kick{font-size:13px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--a2)}
.lead{font-size:clamp(18px,1.9vw,21px);color:var(--m);max-width:680px}

/* nagłówek */
header{position:sticky;top:0;z-index:20;background:rgba(30,35,40,.97);backdrop-filter:blur(6px);border-bottom:3px solid var(--a)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:20px}
header .logo img{height:30px;width:auto}
.nav{display:flex;align-items:center;gap:26px}
.nav a{color:#D6DADE;text-decoration:none;font-size:15px;font-weight:600}
.nav a:hover{color:var(--a)}
.lang{display:flex;gap:4px}
.lang a{font-size:12px;padding:4px 7px;border:1px solid #4A525A;border-radius:3px;color:#AEB4BA;text-decoration:none;font-weight:700;letter-spacing:.06em}
.lang a.on{background:var(--a);border-color:var(--a);color:var(--g)}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--a);color:var(--g);font-weight:800;font-size:16px;padding:15px 26px;border-radius:var(--r);text-decoration:none;border:2px solid var(--a);cursor:pointer;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px);background:#FFBA1A}
.btn.ghost{background:transparent;color:#fff;border-color:#59616A}
.btn.ghost:hover{border-color:var(--a);color:var(--a)}
.nav .btn{padding:9px 16px;font-size:14px}

/* hero */
.hero{background:radial-gradient(900px 500px at 85% 10%,rgba(242,169,0,.13),transparent 60%),linear-gradient(160deg,#1E2328 0%,#15191D 100%);color:#fff;padding:90px 0 80px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center}
.hero .kick{color:var(--a)}
.hero h1{margin:16px 0 22px}
.hero h1 span{color:var(--a)}
.hero .lead{color:#C2C7CC}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}
.hero .mark{position:relative;justify-self:center}
.hero .mark img{width:min(330px,70vw);filter:drop-shadow(0 30px 60px rgba(0,0,0,.45))}
.facts{display:grid;grid-template-columns:repeat(4,1fr);margin-top:64px;border-top:1px solid rgba(255,255,255,.12)}
.facts div{padding:22px 20px 0 0}
.facts div+div{padding-left:20px;border-left:1px solid rgba(255,255,255,.08)}
.facts b{display:block;font-family:Archivo;font-size:23px;font-weight:800;color:#fff}
.facts span{font-size:14px;color:#9EA5AC}

section{padding:96px 0}
.head{max-width:760px;margin-bottom:48px}
.head h2{margin:12px 0 16px}

/* produkty */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.card{background:var(--w);border:1px solid var(--l);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.card:hover{box-shadow:0 18px 40px rgba(30,35,40,.10);transform:translateY(-2px)}
.card .pic{background:linear-gradient(180deg,#F8F7F3,#ECE9E1);padding:26px 30px;border-bottom:1px solid var(--l)}
.card .pic img{width:100%;height:150px;object-fit:contain}
.card .body{padding:26px 28px 28px;display:flex;flex-direction:column;gap:12px;flex:1}
.tag{align-self:flex-start;font-family:Archivo;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:5px 9px;border-radius:3px;background:var(--g);color:var(--a)}
.tag.soon{background:var(--l);color:var(--m)}
.card ul{list-style:none;margin-top:4px}
.card li{position:relative;padding:7px 0 7px 18px;border-top:1px solid #EEEBE3;font-size:15px}
.card li::before{content:'';position:absolute;left:0;top:15px;width:7px;height:7px;background:var(--a)}
.card p{color:var(--m);font-size:15.5px}

/* service-proven */
.proof{background:var(--g);color:#fff}
.proof .wrap{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.proof .kick{color:var(--a)}
.proof p{color:#C2C7CC}
.badge{border:2px solid var(--a);border-radius:8px;padding:34px;position:relative}
.badge .stamp{font-family:Archivo;font-weight:900;font-size:clamp(26px,3vw,34px);line-height:1.1;letter-spacing:.02em}
.badge .stamp span{color:var(--a)}
.badge ol{list-style:none;counter-reset:s;margin-top:22px}
.badge li{counter-increment:s;position:relative;padding:12px 0 12px 46px;border-top:1px solid rgba(255,255,255,.1);color:#D6DADE;font-size:16px}
.badge li::before{content:counter(s);position:absolute;left:0;top:10px;width:30px;height:30px;border-radius:50%;background:var(--a);color:var(--g);font-family:Archivo;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:15px}

/* proces */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:st}
.step{background:var(--w);border:1px solid var(--l);border-radius:6px;padding:26px 24px;position:relative;counter-increment:st}
.step::before{content:'0' counter(st);font-family:Archivo;font-weight:900;font-size:40px;color:var(--a);display:block;line-height:1;margin-bottom:14px}
.step p{color:var(--m);font-size:15px;margin-top:8px}

/* zaplecze */
.cap{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cap div{border-top:3px solid var(--g);padding-top:18px}
.cap p{color:var(--m);font-size:15.5px;margin-top:8px}

/* formularz */
.contact{background:linear-gradient(180deg,#ECE9E1,#F4F2EC)}
.contact .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
form{background:var(--w);border:1px solid var(--l);border-radius:8px;padding:34px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
form .full{grid-column:1/-1}
label{display:block;font-size:13px;font-weight:600;color:var(--m);margin-bottom:6px}
input,select,textarea{width:100%;font:inherit;font-size:16px;padding:12px 14px;border:1px solid #CFCAC0;border-radius:var(--r);background:#FDFCFA;color:var(--g)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--a);border-color:var(--a)}
textarea{min-height:130px;resize:vertical}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--m)}
.check input{width:auto;margin-top:4px}
.hp{position:absolute;left:-9999px}
.msg{grid-column:1/-1;padding:14px 16px;border-radius:var(--r);font-weight:600;display:none}
.msg.ok{background:#E7F4E8;color:#1E6B2A;display:block}
.msg.err{background:#FBE9E7;color:#A8322A;display:block}
.direct{margin-top:28px;display:grid;gap:12px}
.direct a{font-weight:700;text-decoration:none;font-size:18px}
.direct small{display:block;color:var(--m);font-weight:400;font-size:13px}

footer{background:#15191D;color:#9EA5AC;padding:48px 0 36px;font-size:14px}
footer .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px}
footer img{height:26px;width:auto;margin-bottom:14px}
footer a{color:#C2C7CC;text-decoration:none}
footer a:hover{color:var(--a)}
footer .legal{grid-column:1/-1;border-top:1px solid #2A3036;padding-top:22px;margin-top:8px;font-size:12.5px;color:#7C848C}

.doc{max-width:820px;margin:0 auto;padding:70px 24px}
.doc h1{font-size:40px;margin-bottom:24px}
.doc h2{font-size:22px;margin:28px 0 10px}
.doc p,.doc li{color:#3A4148;margin-bottom:10px}

@media (max-width:900px){
  .wrap>*{min-width:0}h1,h2,.lead,.kick{overflow-wrap:break-word;hyphens:auto}
  .nav .lang a{display:inline-block}
  .hero .mark img{width:140px}.hero .wrap{gap:28px}
  .hero{padding:60px 0}
  .hero .wrap,.proof .wrap,.contact .wrap{grid-template-columns:1fr}
  .hero .mark{order:-1}.hero .mark img{width:180px}
  .facts{grid-template-columns:1fr 1fr}.facts div:nth-child(3){padding-left:0;border-left:0}
  .grid,.cap{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .nav>a:not(.btn){display:none}
  form{grid-template-columns:1fr;padding:22px}
  footer .wrap{grid-template-columns:1fr}
  section{padding:68px 0}
}
@media (max-width:520px){.steps{grid-template-columns:1fr}.facts{grid-template-columns:1fr}.facts div+div{padding-left:0;border-left:0}.nav .btn{display:none}}