/* Innovative Protein — style.css */
@font-face{font-family:"IP Sans";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;
  src:url(../fonts/archivo-latin-wdth-normal.woff2) format("woff2-variations");
  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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IP Sans";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;
  src:url(../fonts/archivo-latin-ext-wdth-normal.woff2) format("woff2-variations");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IP Sans";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;
  src:url(../fonts/roboto-flex-cyrillic-wdth-normal.woff2) format("woff2-variations");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}

:root{
  --ink:#1E2328; --text:#3B434B; --muted:#5B6670; --line:#DCE0E4; --mist:#EEF1F3;
  --rail:#2B3036; --amber:#C88A2E; --amber-text:#8A5A0E; --amber-dark:#5E3D08; --white:#FFFFFF;
  --wrap:1200px; --pad:32px; --radius:3px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--white);color:var(--ink);font-family:"IP Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;font-size:17px;line-height:1.55;font-variant-numeric:tabular-nums}
img{display:block;max-width:100%;height:auto}
body{min-height:100vh;display:flex;flex-direction:column} main{flex:1 0 auto}
a{color:var(--amber-text)} a:hover{color:var(--amber-dark)}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;z-index:10}
.skip:focus{left:16px;top:16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

h1,h2,.display{font-weight:800;font-stretch:78%;letter-spacing:-.01em;margin:0}
h1{font-size:clamp(40px,6vw,68px);line-height:.98;font-stretch:75%}
h2{font-size:clamp(26px,3vw,32px);line-height:1.1;margin-bottom:10px}
h3{margin:0}
.lead{font-size:clamp(17px,1.6vw,19px);color:var(--text);max-width:34em;margin:22px 0 30px}
.intro{color:var(--text);max-width:46em;margin:0 0 36px}

.btn{display:inline-block;text-decoration:none;font-weight:700;border-radius:var(--radius);padding:15px 24px;font-size:17px;line-height:1.2}
.btn-primary{background:var(--amber);color:var(--ink)} .btn-primary:hover{background:#B57A22;color:var(--ink)}
.btn-ghost{border:2px solid var(--ink);color:var(--ink);padding:13px 22px} .btn-ghost:hover{background:var(--ink);color:#fff}
.btn-sm{padding:11px 16px;font-size:15px}


/* header */
.site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;padding-top:18px;padding-bottom:18px}
.brand{font-weight:800;font-stretch:78%;font-size:26px;letter-spacing:-.01em;color:var(--ink);text-decoration:none}
.nav{display:flex;flex-wrap:wrap;gap:6px 26px}
.nav a{color:var(--ink);text-decoration:none;font-size:16px}
.nav a:hover{text-decoration:underline}
.header-side{display:flex;align-items:center;gap:18px}
.langs{display:flex;gap:10px;font-size:14px}
.langs a{color:var(--muted);text-decoration:none}
.langs a[aria-current="page"]{color:var(--ink);font-weight:700}

/* hero */
.hero .wrap{display:flex;flex-wrap:wrap;gap:40px 48px;align-items:flex-end;padding-top:36px}
.hero-text{flex:1 1 500px;min-width:0}
.hero-img{flex:1 1 440px;min-width:0}
.hero-img img{width:100%;height:380px;object-fit:cover;border-radius:var(--radius)}
.actions{display:flex;flex-wrap:wrap;gap:12px}

/* delivery line */
.section{padding-top:72px;padding-bottom:24px}
.line-wrap{position:relative}
.line{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;margin:0;padding:4px 0 0}
.line::before{content:"";position:absolute;left:12.5%;right:12.5%;top:58px;height:3px;background:var(--rail)}
.line::after{content:"";position:absolute;left:12.5%;right:37.5%;top:64px;height:3px;background:var(--rail)}
.line-wrap .seg-road{position:absolute;left:62.5%;right:12.5%;top:68px;border-top:3px dashed #8B949C}
.seg{position:absolute;top:30px;transform:translateX(-50%);font-size:13px;color:var(--muted);white-space:nowrap;background:#fff;padding:0 6px}
.seg-1{left:25%}.seg-2{left:50%}.seg-3{left:75%}
.stop{text-align:center;padding:0 14px}
.stop .where{font-size:14px;color:var(--muted);height:22px}
.stop .dot{width:22px;height:22px;border-radius:50%;background:#fff;border:4px solid var(--rail);margin:22px auto 18px}
.stop.cleared .dot{background:var(--amber)}
.stop .term{font-weight:800;font-stretch:78%;font-size:30px;line-height:1.1}
.stop .place{font-weight:600;font-size:17px;margin:2px 0 8px}
.stop p{margin:0;font-size:15px;color:var(--text)}
/* customs zones: nieoclony | oclony */
.zoned{position:relative;padding-bottom:26px}
.zbg{position:absolute;top:0;bottom:0;left:0;width:50%;background:var(--mist);border-radius:var(--radius) 0 0 var(--radius)}
.zbg.y{left:50%;background:#F6EBD8;border:2px solid var(--amber);border-radius:0 var(--radius) var(--radius) 0}
.zh{position:relative;display:grid;grid-template-columns:1fr 1fr}
.zh>div{padding:20px 26px 6px;text-align:center}
.zh b{display:block;font-weight:800;font-stretch:78%;font-size:24px;line-height:1.1}
.zh span{display:block;font-size:15px;color:var(--text);margin:4px auto 0;max-width:30em}
.zh .y b{color:var(--amber-dark)}
.ghead{display:none}
.zoned .seg{background:transparent}
.zoned .seg-2{background:#fff;border:1px solid var(--line);border-radius:3px;padding:1px 8px}
.price-note{font-size:14px;color:var(--muted);margin-top:22px}
@media (max-width:820px){
  .line{grid-template-columns:1fr;gap:0;padding-left:34px}
  .line::before{left:10px;right:auto;top:8px;bottom:8px;width:3px;height:auto}
  .line::after,.line-wrap .seg-road,.seg{display:none}
  .stop{text-align:left;padding:0 0 26px;position:relative}
  .stop .where{height:auto}
  .stop .dot{position:absolute;left:-35px;top:2px;margin:0}
  .zbg,.zh{display:none}
  .zoned{padding-bottom:0}
  .line::before{z-index:1}
  .stop .dot{z-index:2;left:-1px}
  .stop,.ghead{margin-left:-34px;padding-left:34px;padding-right:16px;background:var(--mist)}
  .stop.cleared,.ghead.y{background:#F6EBD8}
  .ghead{display:block;position:relative;padding-top:16px;padding-bottom:16px;border-radius:var(--radius) var(--radius) 0 0}
  .ghead b{display:block;font-weight:800;font-stretch:78%;font-size:22px;line-height:1.1}
  .ghead.y b{color:var(--amber-dark)}
  .ghead span{display:block;font-size:14.5px;color:var(--text);margin-top:4px;line-height:1.4}
  .ghead.y{margin-top:16px}
  .line>li:nth-child(3),.line>li:nth-child(6){border-radius:0 0 var(--radius) var(--radius)}
  .line::before{top:24px;bottom:24px}
}

/* facts */
.facts{background:var(--mist);margin-top:48px}
.facts .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;padding-top:34px;padding-bottom:34px}
.fact b{display:block;font-weight:800;font-stretch:75%;font-size:40px;line-height:1}
.fact span{display:block;font-size:15px;color:var(--text);margin-top:6px}

/* products */
.products{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:40px}
.product img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius);margin-bottom:20px}
.product h3{font-size:26px;font-weight:800;font-stretch:78%;line-height:1.1}
.product .code{margin:6px 0 16px;color:var(--muted);font-size:15px}
.specs{width:100%;border-collapse:collapse;font-size:16px}
.specs tr{border-top:1px solid var(--line)} .specs tr:last-child{border-bottom:1px solid var(--line)}
.specs th{text-align:left;font-weight:400;padding:10px 12px 10px 0}
.specs td{text-align:right;padding:10px 0}
.specs .key{font-weight:700}
.links{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:18px;font-weight:600}

/* split */
.split{display:flex;flex-wrap:wrap;gap:40px 56px;align-items:center}
.split > *{flex:1 1 400px;min-width:0}
.split img{width:100%;height:360px;object-fit:cover;border-radius:var(--radius)}
.split p{color:var(--text);margin:0 0 14px}

/* quality */
.qlist{list-style:none;margin:0;padding:0}
.qlist li{padding:12px 0;border-top:1px solid var(--line)} .qlist li:last-child{border-bottom:1px solid var(--line)}
.docs h3{font-size:20px;margin:6px 0 14px}
.docs a,.docs .doc{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid var(--line);color:var(--ink);text-decoration:none}
.docs a:last-child,.docs .doc:last-child{border-bottom:1px solid var(--line)}
.docs a span:last-child{color:var(--amber-text);font-weight:600}
.docs .doc span:last-child{color:var(--muted);font-size:15px}
.docs a:hover span:first-child{text-decoration:underline}

/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px}
.steps .n{font-weight:800;font-stretch:75%;font-size:44px;line-height:1;color:var(--amber-text)}
.steps h3{font-size:19px;margin:10px 0 6px}
.steps p{margin:0;color:var(--text);font-size:16px}

/* contact */
.contact{background:var(--ink);color:#F2F4F5;margin-top:72px}
.contact .wrap{display:flex;flex-wrap:wrap;gap:40px 56px;padding-top:64px;padding-bottom:64px}
.contact .info{flex:1 1 340px;min-width:0}
.contact h2{font-size:clamp(32px,4vw,44px);line-height:1.02;font-stretch:75%;margin-bottom:16px}
.contact p,.contact address{color:#C3C9CE;font-style:normal}
.contact address strong{color:#F2F4F5}
.contact a{color:#F2C27A} .contact a:hover{color:#FFE0AE}
.contact .tel{font-size:24px;font-weight:700;color:#fff;text-decoration:none;display:inline-block;margin:6px 0 18px}
form.rfq{flex:1 1 520px;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
form.rfq label{display:flex;flex-direction:column;gap:6px;font-size:14px}
form.rfq .full{grid-column:1/-1}
form.rfq input,form.rfq select,form.rfq textarea{height:48px;border:0;border-radius:var(--radius);padding:0 12px;font:inherit;font-size:16px;color:var(--ink);background:#fff;width:100%}
form.rfq textarea{height:96px;padding:10px 12px;resize:vertical}
form.rfq button{height:54px;border:0;border-radius:var(--radius);background:var(--amber);color:var(--ink);font:inherit;font-weight:700;font-size:17px;cursor:pointer}
form.rfq button:hover{background:#D79A3E}
form.rfq .legal{font-size:13px;color:#AEB5BC;margin:0}
.hp{position:absolute;left:-9999px}
@media (max-width:560px){form.rfq{grid-template-columns:1fr}}

/* footer */
.site-footer{background:var(--ink);color:#9AA3AB;border-top:1px solid #343B42;font-size:14px}
.site-footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;padding-top:22px;padding-bottom:22px}
.site-footer a{color:#C3C9CE}

/* simple pages */
.page{padding-top:40px;padding-bottom:72px;max-width:820px}
.page h1{font-size:clamp(34px,5vw,52px);margin-bottom:20px}
.page h2{font-size:24px;margin:34px 0 8px}
.page p,.page li{color:var(--text)}

@media (max-width:600px){
  :root{--pad:18px}
  .hero-img img{height:240px}
  .split img{height:220px}
  .site-header .wrap{gap:10px 16px;padding-top:14px;padding-bottom:12px}
  .brand{font-size:22px;order:1}
  .header-side{order:2}
  .header-side .btn{display:none}
  .nav{order:3;width:100%;gap:6px 16px}
  .nav a{font-size:15px;white-space:nowrap}
}
a[href^="tel"]{white-space:nowrap}
.docs a small{display:block;color:var(--muted);font-size:14px;margin-top:2px}