@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(../fonts/roboto-latin-ext-400-normal.woff2) format('woff2');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(../fonts/roboto-latin-400-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(../fonts/roboto-latin-ext-500-normal.woff2) format('woff2');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(../fonts/roboto-latin-500-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(../fonts/roboto-latin-ext-700-normal.woff2) format('woff2');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(../fonts/roboto-latin-700-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(../fonts/roboto-condensed-latin-ext-700-normal.woff2) format('woff2');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(../fonts/roboto-condensed-latin-700-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(../fonts/roboto-mono-latin-ext-500-normal.woff2) format('woff2');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(../fonts/roboto-mono-latin-500-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(../fonts/roboto-mono-latin-ext-700-normal.woff2) format('woff2');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(../fonts/roboto-mono-latin-700-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:#0b0e16; color:#f6f4f1; font-family:Roboto, system-ui, Arial, sans-serif; font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased}
a{color:#5fd08a} a:hover{color:#8fe0ad}
h1,h2,h3,h4{font-family:'Roboto Condensed', Arial, sans-serif; margin:0; line-height:1.05; letter-spacing:-.005em}
p{margin:0}
.wrap{max-width:1200px; margin:0 auto; padding:0 32px}
.kick{font:700 13px/1.3 Roboto, Arial, sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#43b972}
.kick.gray{color:#8a8987} .kick.oc{color:#ff8038}
.h2{font-size:48px; font-weight:800}
.lead{font-size:19px; line-height:1.55; color:#c9c7c4}
.muted{color:#8a8987}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:0 24px; border-radius:11px; font:700 16px/1 Roboto, Arial, sans-serif; text-decoration:none; border:0; cursor:pointer; white-space:nowrap}
.btn-p{background:#43b972; color:#052414} .btn-p:hover{background:#5fd08a; color:#052414}
.btn-s{background:#181a22; color:#f6f4f1; border:1px solid #30313a} .btn-s:hover{background:#262935; color:#f6f4f1}
.btn-lg{min-height:58px; font-size:17px; padding:0 28px}
.mono{font-family:'Roboto Mono', monospace}
.card{background:#13151d; border:1px solid #262935; border-radius:16px; padding:26px; display:flex; flex-direction:column; gap:10px}
.card h3{font-size:23px; font-weight:700; line-height:1.2}
.card p{color:#c9c7c4; font-size:16px}
.shot{border:1px solid #30313a; border-radius:14px; overflow:hidden; background:#070910; box-shadow:0 30px 60px -30px rgba(0,0,0,.9)}
.shot img{display:block; width:100%; height:auto}
.sec{padding:112px 0 0}
.sec-head{display:flex; flex-direction:column; gap:14px; max-width:820px; margin-bottom:44px}
.g2{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px}
.g3{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px}
.g4{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px}
.split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center}
.glow{position:absolute; border-radius:50%; pointer-events:none}

/* nav */
.nav{position:sticky; top:0; z-index:20; background:rgba(11,14,22,.88); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid #1c1e27}
.nav .wrap{display:flex; align-items:center; justify-content:space-between; gap:24px; height:72px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:#f6f4f1}
.brand b{font:800 22px/1 'Roboto Condensed', Arial, sans-serif; letter-spacing:.03em}
.nav-links{display:flex; gap:26px; font-size:15px}
.nav-links a{color:#c9c7c4; text-decoration:none} .nav-links a:hover{color:#f6f4f1}

/* hero */
.hero{position:relative; padding:76px 0 88px; overflow:hidden}
.hero-grid{display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); gap:56px; align-items:center; position:relative}
.hero h1{font-size:60px; font-weight:800; line-height:.96}
.hero h1 em{font-style:normal; color:#43b972}
.badge-new{display:inline-flex; align-items:center; gap:10px; align-self:flex-start; background:#12291a; border:1px solid #1f5136; color:#5fd08a; border-radius:999px; padding:8px 14px 8px 8px; font:700 14px/1 Roboto, Arial, sans-serif}
.badge-new span{background:#43b972; color:#052414; border-radius:999px; padding:5px 9px; font-size:12px; letter-spacing:.06em; text-transform:uppercase}
.price-inline{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap}
.price-inline b{font:800 44px/1 'Roboto Condensed', Arial, sans-serif; color:#43b972}
.price-inline span{color:#c9c7c4; font-size:16px}

/* transform visual */
.tf{display:grid; grid-template-columns:minmax(0,.9fr) 46px minmax(0,1.1fr); gap:14px; align-items:center}
.photo{position:relative; aspect-ratio:3/4; border-radius:16px; overflow:hidden; background:linear-gradient(160deg,#2a2d36 0%,#16181f 70%); border:1px solid #30313a; box-shadow:0 30px 60px -25px rgba(0,0,0,.9)}
.photo .lbl{position:absolute; left:12px; top:12px; background:rgba(11,14,22,.8); border:1px solid #30313a; border-radius:8px; padding:6px 9px; font:700 11px/1 Roboto, Arial, sans-serif; color:#c9c7c4; letter-spacing:.06em; text-transform:uppercase}
.photo svg.part{position:absolute; left:8%; top:20%; width:84%; height:auto}
.scan{position:absolute; left:16%; bottom:15%; width:60%; border:2px solid #43b972; border-radius:8px; padding:8px 10px; background:rgba(5,36,20,.55); box-shadow:0 0 0 6px rgba(67,185,114,.15)}
.scan small{display:block; font:700 9px/1 Roboto, Arial, sans-serif; color:#8fd3a8; letter-spacing:.1em; text-transform:uppercase; margin-bottom:5px}
.scan b{font:700 16px/1 'Roboto Mono', monospace; color:#f6f4f1; letter-spacing:.02em}
.stk{position:absolute; right:10px; top:44%; transform:rotate(6deg); background:#f6f4f1; color:#0b0e16; border-radius:6px; padding:6px 8px; font:700 12px/1 'Roboto Mono', monospace; box-shadow:0 6px 14px rgba(0,0,0,.5)}
.arrow{display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:#43b972; color:#052414; box-shadow:0 0 0 8px rgba(67,185,114,.15)}
.offer{background:#13151d; border:1px solid #1f5136; border-radius:16px; padding:20px; display:flex; flex-direction:column; gap:12px; box-shadow:0 30px 60px -25px rgba(0,0,0,.9), inset 0 3px 0 #43b972}
.offer-top{display:flex; justify-content:space-between; align-items:center; gap:10px}
.pill{display:inline-flex; align-items:center; gap:6px; font:700 12px/1 Roboto, Arial, sans-serif; border-radius:999px; padding:6px 10px; border:1px solid; white-space:nowrap}
.pill::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor}
.pill.ok{color:#5fd08a; background:#12291a; border-color:#1f5136}
.offer h4{font:700 19px/1.25 'Roboto Condensed', Arial, sans-serif}
.kv{display:grid; grid-template-columns:auto 1fr; gap:7px 14px; font-size:14px}
.kv dt{color:#8a8987} .kv dd{margin:0; color:#f6f4f1}
.kv dd .new{color:#5fd08a; font-weight:700}
.offer-foot{display:flex; justify-content:space-between; align-items:center; gap:10px; border-top:1px solid #262935; padding-top:12px}
.offer-foot b{font:800 24px/1 'Roboto Condensed', Arial, sans-serif; white-space:nowrap}
.chips{display:flex; flex-wrap:wrap; gap:6px}
.chip{font-size:12px; color:#c9c7c4; background:#181a22; border:1px solid #30313a; border-radius:6px; padding:4px 8px}

/* what you get */
.gets{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px}
.get{background:#0e1016; border:1px solid #262935; border-radius:14px; padding:18px; display:flex; gap:12px; align-items:flex-start}
.get svg{flex:none; color:#43b972; margin-top:2px}
.get b{display:block; font-size:16px} .get span{display:block; font-size:14px; color:#8a8987; line-height:1.45; margin-top:2px}

/* steps */
.steps3{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px; counter-reset:s}
.step{border-top:2px solid #43b972; padding-top:22px; display:flex; flex-direction:column; gap:10px}
.step .n{font:700 34px/1 'Roboto Mono', monospace; color:#43b972}
.step h3{font-size:24px; font-weight:700; line-height:1.2}
.step p{color:#c9c7c4; font-size:16px}

/* compare */
.cmp{border:1px solid #262935; border-radius:18px; overflow:hidden}
.cmp-row{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr); border-bottom:1px solid #262935}
.cmp-row:last-child{border-bottom:0}
.cmp-row > div{padding:18px 22px; font-size:16px}
.cmp-row > div:first-child{font-weight:700; background:#0e1016}
.cmp-row > div:nth-child(2){color:#8a8987; background:#11131a}
.cmp-row > div:nth-child(3){background:#0d1f15; color:#f6f4f1; display:flex; gap:10px; align-items:flex-start}
.cmp-row > div:nth-child(3) svg{flex:none; color:#5fd08a; margin-top:3px}
.cmp-head > div{font:700 13px/1.3 Roboto, Arial, sans-serif !important; letter-spacing:.1em; text-transform:uppercase; color:#8a8987 !important}
.cmp-head > div:nth-child(3){color:#43b972 !important}

/* advantages */
.adv{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px}
.adv .card{padding:28px; gap:12px}
.adv .num{font:800 46px/1 'Roboto Condensed', Arial, sans-serif; color:#43b972}
.adv .card.big{grid-column:span 2; background:linear-gradient(135deg,#0f2618 0%,#13151d 70%); border-color:#1f5136}
.adv .card.big .num{font-size:64px}
.adv .card.oc .num{color:#fe6d20}

/* oc */
.oc{position:relative; padding:96px 0; background:#120d0a; border-top:1px solid #3a2414; border-bottom:1px solid #3a2414; overflow:hidden; margin-top:112px}
.oc .card{background:#1a120c; border-color:#3a2414}
.oc .card h3{color:#ffb27f; font-size:20px}
.oc .card p{color:#d8c9bd; font-size:15px}

/* pricing */
.price{display:grid; grid-template-columns:minmax(0,1.2fr) repeat(3, minmax(0,1fr)); gap:16px}
.price .card{gap:8px}
.price .v{font:800 52px/1 'Roboto Condensed', Arial, sans-serif; color:#43b972}
.price .card.hl{border-color:#1f5136; box-shadow:inset 0 3px 0 #43b972; background:linear-gradient(160deg,#0f2618 0%,#13151d 75%)}
.price .card.hl .v{font-size:64px}

/* download + form */
.dl{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; align-items:start}
.dlcard{background:#13151d; border:1px solid #1f5136; border-radius:18px; padding:32px; display:flex; flex-direction:column; gap:20px; box-shadow:inset 0 3px 0 #43b972}
.dlcard h3{font-size:32px; font-weight:800}
.dlmeta{display:flex; flex-wrap:wrap; gap:8px}
.dlmeta span{font-size:14px; color:#c9c7c4; background:#181a22; border:1px solid #30313a; border-radius:999px; padding:6px 12px}
.form{background:#13151d; border:1px solid #262935; border-radius:18px; padding:32px; display:flex; flex-direction:column; gap:18px}
.form h3{font-size:28px; font-weight:800}
.fgrid{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px 16px}
.field{display:flex; flex-direction:column; gap:6px}
.field.full{grid-column:1 / -1}
.field label{font:700 14px/1.2 Roboto, Arial, sans-serif; color:#c9c7c4}
.field input, .field select{height:50px; border-radius:10px; border:1px solid #30313a; background:#0b0e16; color:#f6f4f1; padding:0 14px; font:400 16px/1 Roboto, Arial, sans-serif}
.field input::placeholder{color:#6d6c6a}
.field input:focus, .field select:focus{outline:2px solid #43b972; outline-offset:1px; border-color:#43b972}
.check{display:flex; gap:12px; align-items:flex-start; font-size:14px; line-height:1.45; color:#c9c7c4}
.check input{width:20px; height:20px; margin:1px 0 0; accent-color:#43b972; flex:none}
.isteps{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px; counter-reset:st}
.isteps li{counter-increment:st; display:grid; grid-template-columns:40px 1fr; gap:14px; align-items:start}
.isteps li::before{content:counter(st); display:grid; place-items:center; width:38px; height:38px; border-radius:10px; background:#181a22; border:1px solid #30313a; color:#43b972; font:700 16px/1 'Roboto Mono', monospace}
.isteps b{display:block; font-size:18px} .isteps span{color:#c9c7c4}

/* faq */
.faq{display:flex; flex-direction:column; gap:10px; max-width:920px}
.faq details{background:#13151d; border:1px solid #262935; border-radius:12px; padding:18px 20px}
.faq summary{cursor:pointer; list-style:none; font-weight:700; font-size:18px; position:relative; padding-right:30px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; position:absolute; right:0; top:-2px; font:700 22px/1 'Roboto Mono', monospace; color:#43b972}
.faq details[open] summary::after{content:"–"}
.faq p{margin-top:12px; color:#c9c7c4}

.cta{background:#43b972; color:#052414; border-radius:24px; padding:56px; display:flex; flex-wrap:wrap; gap:32px; align-items:center; justify-content:space-between}
.cta h2{font-size:50px; font-weight:800}
.foot{border-top:1px solid #1c1e27; padding:40px 0 56px; margin-top:96px; font-size:14px; color:#8a8987}
.foot .wrap{display:flex; justify-content:space-between; gap:32px; flex-wrap:wrap}


.chain{border-top:1px solid #1c1e27; border-bottom:1px solid #1c1e27; background:#0e1016; padding:44px 0 40px}
.chain-head{display:flex; flex-direction:column; gap:10px; margin-bottom:24px}
.chain-head h2{font-size:30px; font-weight:800}
.chain-row{display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:10px; counter-reset:c}
.lk{position:relative; background:#13151d; border:1px solid #262935; border-radius:14px; padding:16px 14px 14px; display:flex; flex-direction:column; gap:6px}
.lk:not(:last-child)::after{content:""; position:absolute; right:-9px; top:50%; width:8px; height:2px; background:#30313a}
.lk-n{font:700 12px/1 'Roboto Mono', monospace; color:#6d6c6a}
.lk b{font:700 17px/1.2 'Roboto Condensed', Arial, sans-serif; color:#f6f4f1}
.lk span{font-size:13px; line-height:1.4; color:#8a8987}
.lk i{font-style:normal; margin-top:auto; padding-top:6px; font:700 10.5px/1.2 Roboto, Arial, sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#43b972}
.lk.lk-oc i{color:#ff8038}
.lk.star{background:linear-gradient(160deg,#14361f 0%,#13151d 85%); border-color:#43b972; box-shadow:0 0 0 4px rgba(67,185,114,.14)}
.lk.star b{color:#5fd08a} .lk.star span{color:#c9c7c4}
.lk.star .lk-n{color:#43b972}
.chain-note{margin-top:18px; color:#c9c7c4; font-size:15.5px}
@media (max-width: 1100px){ .chain-row{grid-template-columns:repeat(4, minmax(0,1fr))} .lk::after{display:none} }
@media (max-width: 640px){ .chain-row{grid-template-columns:repeat(2, minmax(0,1fr))} .chain-head h2{font-size:24px} }


.also{display:block; text-decoration:none; color:#c9c7c4; font-size:15px; line-height:1.5; border-top:1px solid #262935; padding-top:16px; max-width:560px}
.also span{color:#8a8987} .also b{color:#5fd08a} .also:hover b{color:#8fe0ad}
.mkts{display:flex; gap:6px}
.mods{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px}
.mod{background:#13151d; border:1px solid #262935; border-radius:16px; padding:20px; display:grid; grid-template-columns:44px 1fr; gap:14px; align-items:start}
.mod-ic{display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:#12291a; color:#43b972; border:1px solid #1f5136}
.mod h3{font:700 19px/1.2 'Roboto Condensed', Arial, sans-serif}
.mod p{color:#c9c7c4; font-size:15px; line-height:1.5; margin-top:4px}
.mod i{display:block; font-style:normal; margin-top:8px; font:700 10.5px/1.2 Roboto, Arial, sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#43b972}
.mod.mod-oc .mod-ic{background:#2a1607; color:#ff8038; border-color:#5a3112} .mod.mod-oc i{color:#ff8038}
.mod.star{background:linear-gradient(160deg,#14361f 0%,#13151d 85%); border-color:#43b972; box-shadow:0 0 0 4px rgba(67,185,114,.12)}
.mod.star .mod-ic{background:#43b972; color:#052414; border-color:#43b972}
.mod.star h3{color:#5fd08a}
.fig{margin:0; display:flex; flex-direction:column; gap:10px}
.fig figcaption{font-size:14px; color:#8a8987}
@media (max-width:1000px){ .mods{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (max-width:640px){ .mods{grid-template-columns:minmax(0,1fr)} }

@media (max-width: 1000px){
  .hero-grid, .split, .dl{grid-template-columns:minmax(0,1fr); gap:40px}
  .hero h1{font-size:54px}
  .h2{font-size:38px}
  .g3, .steps3, .adv{grid-template-columns:minmax(0,1fr)}
  .adv .card.big{grid-column:auto}
  .gets, .g4{grid-template-columns:repeat(2, minmax(0,1fr))}
  .price{grid-template-columns:repeat(2, minmax(0,1fr))}
  .price .card.hl{grid-column:1 / -1}
  .nav-links{display:none}
  .wrap{padding:0 16px}
  .cmp-row{grid-template-columns:minmax(0,1fr)}
  .cmp-row > div:first-child{padding-bottom:6px}
  .cmp-head{display:none}
  .cta{padding:32px} .cta h2{font-size:36px}
  .fgrid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width: 560px){ .gets{grid-template-columns:minmax(0,1fr)} .tf{grid-template-columns:minmax(0,1fr)} .arrow{transform:rotate(90deg); justify-self:center} .photo{max-width:300px; justify-self:center; width:100%} }

[hidden]{display:none!important}
.hp{position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden}
.field textarea{min-height:130px; border-radius:10px; border:1px solid #30313a; background:#0b0e16; color:#f6f4f1; padding:12px 14px; font:400 16px/1.5 Roboto, Arial, sans-serif; resize:vertical}
.field textarea:focus{outline:2px solid #43b972; outline-offset:1px; border-color:#43b972}
.foot a{color:#c9c7c4} .foot a:hover{color:#f6f4f1}
.foot-links{display:flex; flex-wrap:wrap; gap:8px 18px}
.linklike{all:unset; cursor:pointer; color:#c9c7c4; text-decoration:underline; text-underline-offset:3px}
.linklike:hover{color:#f6f4f1}
.linklike:focus-visible{outline:2px solid #43b972; outline-offset:2px; border-radius:4px}
/* strony tekstowe */
.doc-hero{padding:64px 0 32px; border-bottom:1px solid #1c1e27}
.doc-hero h1{font-size:52px; font-weight:800}
.doc-hero p{margin-top:14px}
.doc-wrap{display:grid; grid-template-columns:260px minmax(0,1fr); gap:56px; padding-top:40px}
.toc{position:sticky; top:96px; align-self:start; display:flex; flex-direction:column; gap:4px; font-size:14px}
.toc a{color:#8a8987; text-decoration:none; padding:6px 10px; border-radius:8px} .toc a:hover{background:#181a22; color:#f6f4f1}
.prose{max-width:780px; color:#c9c7c4; font-size:16.5px; line-height:1.7}
.prose h2{font-size:28px; font-weight:800; color:#f6f4f1; margin:44px 0 14px; scroll-margin-top:96px}
.prose h2:first-of-type{margin-top:8px}
.prose h3{font-size:21px; font-weight:700; color:#f6f4f1; margin:28px 0 10px}
.prose p{margin:0 0 14px}
.prose ol, .prose ul{margin:0 0 16px; padding-left:22px; display:flex; flex-direction:column; gap:8px}
.prose li ul{margin-top:8px}
.prose b{color:#f6f4f1}
.prose .meta{font-size:14px; color:#8a8987}
.prose .defs{display:grid; grid-template-columns:180px 1fr; gap:10px 20px; margin:0 0 16px}
.prose .defs dt{font-weight:700; color:#f6f4f1} .prose .defs dd{margin:0}
.prose .tbl{overflow-x:auto; border:1px solid #262935; border-radius:12px; margin:0 0 16px}
.prose table{border-collapse:collapse; width:100%; min-width:640px; font-size:14.5px}
.prose th{text-align:left; font:700 12px/1.3 Roboto, Arial, sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#8a8987; background:#0e1016; padding:12px 14px; border-bottom:1px solid #262935}
.prose td{padding:12px 14px; border-bottom:1px solid #262935; vertical-align:top; background:#13151d}
.prose tr:last-child td{border-bottom:0}
.prose code{font-family:'Roboto Mono', monospace; font-size:13.5px; color:#f6f4f1}
.art-cta{margin-top:36px; background:#13151d; border:1px solid #1f5136; border-radius:16px; padding:24px; display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between; box-shadow:inset 0 3px 0 #43b972}
.art-cta b{font:700 22px/1.2 'Roboto Condensed', Arial, sans-serif; color:#f6f4f1}
.arts{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px}
.arts a{text-decoration:none; color:inherit}
.arts .card:hover{border-color:#43b972}
.crumbs{font-size:14px; color:#8a8987} .crumbs a{color:#8a8987}
/* baner cookies */
.ck{position:fixed; z-index:60; left:16px; right:16px; bottom:16px; max-width:560px; background:#13151d; border:1px solid #30313a; border-radius:16px; padding:22px; box-shadow:0 30px 70px -20px rgba(0,0,0,.9); display:flex; flex-direction:column; gap:14px; color:#c9c7c4; font-size:15px; line-height:1.5}
.ck[hidden]{display:none}
.ck h2{font:800 22px/1.1 'Roboto Condensed', Arial, sans-serif; color:#f6f4f1}
.ck-row{display:flex; flex-wrap:wrap; gap:10px}
.ck .btn{min-height:46px; font-size:15px; padding:0 18px}
.ck-opt{display:flex; gap:12px; align-items:flex-start; background:#0e1016; border:1px solid #262935; border-radius:12px; padding:12px 14px}
.ck-opt input{width:20px; height:20px; margin:2px 0 0; accent-color:#43b972; flex:none}
.ck-opt b{display:block; color:#f6f4f1}
.ck-more[hidden]{display:none}
.ty{min-height:60vh; display:grid; place-items:center; text-align:center; padding:96px 0}
@media (max-width:1000px){ .doc-wrap{grid-template-columns:minmax(0,1fr)} .toc{position:static; flex-direction:row; flex-wrap:wrap} .arts{grid-template-columns:minmax(0,1fr)} .prose .defs{grid-template-columns:1fr} .doc-hero h1{font-size:38px} }

.testbar{background:#2a2211;border-bottom:1px solid #5a4a1f;color:#e6c07a;font:400 13px/1.5 Roboto,system-ui,Arial,sans-serif;text-align:center;padding:8px 16px}
.testbar b{color:#f6f4f1}