/* ───── Shared site styles (header / footer / typography) ───── */
:root{
  --bg:#f6f4ef; --surface:#fff;
  --ink:#0e1116; --ink-2:#3a3f47; --ink-3:#6b727b;
  --line:#e6e2d8; --line-strong:#d6d1c4;
  --accent: oklch(48% 0.16 252); --accent-ink: oklch(36% 0.13 252); --accent-soft: oklch(95% 0.03 252);
  --accent-2: oklch(52% 0.18 25); --accent-2-ink: oklch(40% 0.15 25); --accent-2-soft: oklch(95% 0.035 25);
  --container:1240px; --gutter:clamp(20px,4vw,40px);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:"Onest",system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-size:16px;line-height:1.55;letter-spacing:-0.005em}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:0.78em;letter-spacing:0.04em;text-transform:uppercase}
.container{max-width:var(--container);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:saturate(140%) blur(10px);-webkit-backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:32px;height:72px}
.brand{display:inline-flex;align-items:center;gap:10px}
.brand-logo{height:32px;width:auto;display:block}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:28px;align-items:center}
.nav ul a{color:var(--ink-2);font-size:15px;transition:color .15s}
.nav ul a:hover,.nav ul a.active{color:var(--ink)}
.nav .spacer{flex:1}
.nav .phone{font-variant-numeric:tabular-nums;font-weight:500;font-size:15px;color:var(--ink)}
.nav .cta{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:#fff;padding:11px 18px;border-radius:999px;font-size:14px;font-weight:500;transition:background .15s}
.nav .cta:hover{background:var(--accent-ink)}

/* Dropdown menu in header */
.nav ul li{position:relative}
.nav .has-dropdown > a{display:inline-flex;align-items:center;gap:6px}
.nav .has-dropdown > a::after{content:"";width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .15s, color .15s;opacity:0.7}
.nav .has-dropdown:hover > a::after,.nav .has-dropdown:focus-within > a::after{transform:rotate(225deg) translateY(-2px);opacity:1}
.dropdown{position:absolute;top:calc(100% + 4px);left:50%;transform:translateX(-50%) translateY(-8px);min-width:760px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 60px rgba(20,22,25,0.08);padding:28px 32px 24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease, transform .18s ease, visibility .18s}
.has-dropdown:hover .dropdown,.has-dropdown:focus-within .dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.dd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 40px}
.dd-col{display:flex;flex-direction:column}
.dd-col h6{margin:0 0 10px;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.dd-col h6:not(:first-child){margin-top:20px}
.dd-col a{color:var(--ink-2);font-size:14px;line-height:1.4;padding:5px 0;letter-spacing:-0.005em;border:0}
.dd-col a:hover{color:var(--ink)}
.dd-foot{margin-top:20px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.dd-foot a{color:var(--ink);font-size:13px;font-family:"JetBrains Mono",monospace;letter-spacing:0.04em;text-transform:uppercase;display:inline-flex;align-items:center;gap:8px}
.dd-foot a:hover{color:var(--accent-ink)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:12px;padding:16px 22px;border-radius:999px;font-size:15px;font-weight:500;transition:background .15s, color .15s, border-color .15s}
.btn .arr{width:14px;height:14px;transition:transform .2s ease}
.btn:hover .arr{transform:translateX(3px)}
.btn-primary{background:var(--ink);color:#fff}
.btn-primary:hover{background:var(--accent-ink)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line-strong)}
.btn-ghost:hover{border-color:var(--ink);background:#fff}

/* Crumbs */
.crumbs{padding-top:32px;color:var(--ink-3);font-size:13px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.crumbs a:hover{color:var(--ink)}
.crumbs .sep{opacity:0.5}
.crumbs .current{color:var(--ink)}

/* Section base */
section.s{padding:96px 0}
.s-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:48px;flex-wrap:wrap}
.s-head h2{font-size:clamp(32px,4vw,52px);font-weight:500;letter-spacing:-0.025em;line-height:1.05;margin:0;max-width:24ch}
.s-label{display:block;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:14px}

/* Page hero */
.page-hero{padding:48px 0 64px}
.page-hero h1{font-size:clamp(44px,6.4vw,96px);line-height:1;letter-spacing:-0.035em;font-weight:500;margin:0 0 24px;max-width:18ch}
.page-hero h1 em{font-style:normal;background:linear-gradient(92deg,var(--accent-2-ink) 0%,var(--accent-ink) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.page-hero .lede{font-size:20px;color:var(--ink-2);max-width:62ch;margin:0 0 32px;line-height:1.45}
.page-hero .actions{display:flex;flex-wrap:wrap;gap:14px}

/* Form (shared) */
form.contact{display:flex;flex-direction:column;gap:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:12px;color:var(--ink-3);letter-spacing:0.04em;text-transform:uppercase}
.field input,.field textarea{background:#fbfaf6;border:1px solid var(--line);border-radius:10px;padding:14px 16px;font:inherit;color:var(--ink);outline:none;transition:border-color .15s, background .15s}
.field input:focus,.field textarea:focus{border-color:var(--ink);background:#fff}
.field textarea{resize:vertical;min-height:96px}
form .submit{margin-top:8px;display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--ink);color:#fff;padding:16px 22px;border-radius:999px;font-size:15px;font-weight:500;transition:background .15s}
form .submit:hover{background:var(--accent-ink)}
.fineprint{font-size:12px;color:var(--ink-3);line-height:1.45;margin-top:4px}
.fineprint a{border-bottom:1px solid var(--line-strong)}

/* Footer */
footer.site-footer{padding:64px 0 32px;border-top:1px solid var(--line);margin-top:80px}
.f-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:48px}
.f-col h5{margin:0 0 16px;font-size:12px;color:var(--ink-3);letter-spacing:0.06em;text-transform:uppercase;font-weight:500}
.f-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.f-col a{color:var(--ink-2);font-size:15px;transition:color .15s}
.f-col a:hover{color:var(--ink)}
.f-brand p{color:var(--ink-3);font-size:14px;line-height:1.5;margin:12px 0 0;max-width:30ch}
.f-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;padding-top:24px;border-top:1px solid var(--line);color:var(--ink-3);font-size:13px}

/* Service detail page — common blocks (sub-nav, about, solutions table, equipment, delivery, bioinfo levels, samples) */
.subnav{position:sticky;top:72px;z-index:40;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:saturate(140%) blur(10px);-webkit-backdrop-filter:saturate(140%) blur(10px);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.subnav .container{display:flex;gap:6px;overflow-x:auto;padding-top:0;padding-bottom:0}
.subnav a{padding:18px 4px;margin-right:24px;color:var(--ink-3);font-size:14px;white-space:nowrap;border-bottom:2px solid transparent;transition:color .15s, border-color .15s}
.subnav a:hover{color:var(--ink)}
.subnav a.active{color:var(--ink);border-color:var(--accent)}
.hero-stats{margin-top:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);padding-top:24px}
.hero-stats .cell{padding-right:24px}
.hero-stats .k{font-size:22px;font-weight:500;letter-spacing:-0.015em;line-height:1.2}
.hero-stats .l{color:var(--ink-3);font-size:13px;margin-top:6px;line-height:1.4}
.s-anchor{scroll-margin-top:140px}
.about-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;align-items:start}
.about-grid .lede p{font-size:17px;color:var(--ink-2);line-height:1.65;margin:0 0 18px}
.about-grid .lede p strong{color:var(--ink);font-weight:500}
.facts{border-top:1px solid var(--line)}
.facts .row{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.facts .row .k{color:var(--ink-3);font-size:14px}
.facts .row .v{color:var(--ink);font-weight:500;font-size:14px;text-align:right;max-width:62%}
/* Solutions comparison table */
.sols{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface)}
.sols-head{display:grid;background:#fbfaf6;border-bottom:1px solid var(--line)}
.sols-head .cell{padding:24px 22px;border-right:1px solid var(--line)}
.sols-head .cell:last-child{border-right:0}
.sols-head .cell .tag{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:0.08em;color:var(--ink-3);text-transform:uppercase;margin-bottom:8px;display:block}
.sols-head .cell h3{margin:0;font-size:18px;font-weight:500;line-height:1.2;letter-spacing:-0.01em}
.sols-head .cell.meta{background:#fff;border-right:1px solid var(--line)}
.sols-head .cell.meta h3{color:var(--ink-3);font-size:13px;text-transform:uppercase;letter-spacing:0.08em;font-weight:500;font-family:"JetBrains Mono",monospace}
.sols-row{display:grid;border-bottom:1px solid var(--line)}
.sols-row:last-child{border-bottom:0}
.sols-row .cell{padding:18px 22px;border-right:1px solid var(--line);font-size:14px;color:var(--ink-2);line-height:1.5}
.sols-row .cell:last-child{border-right:0}
.sols-row .cell.k{color:var(--ink-3);background:#fbfaf6;font-family:"JetBrains Mono",monospace;font-size:13px;letter-spacing:0.04em}
.sols-row .cell strong{color:var(--ink);font-weight:500}
.sols-row.price .cell{font-weight:500;color:var(--ink);font-size:16px}
.pill-tech{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);font-size:12px;font-weight:500;letter-spacing:0.02em}
.pill-tech.red{background:var(--accent-2-soft);color:var(--accent-2-ink)}
.check{color:var(--accent)}
.dash{color:var(--ink-3)}
/* Equipment dark band */
.equip{background:var(--ink);color:#f1efe9;border-radius:24px;padding:64px 56px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.equip h3{font-size:34px;font-weight:500;letter-spacing:-0.02em;line-height:1.05;margin:0 0 14px;color:#fff}
.equip p{color:#a5acb4;margin:0 0 24px;font-size:16px;line-height:1.5;max-width:46ch}
.equip a.lnk{color:#fff;border-bottom:1px solid #444a52;padding-bottom:2px;font-size:15px}
.equip a.lnk:hover{border-color:#fff}
.equip-spec{display:grid;grid-template-columns:1fr 1fr;gap:24px;border-top:1px solid #232831;padding-top:24px}
.equip-spec .ss{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:0.08em;color:#7e8590;text-transform:uppercase}
.equip-spec .sv{color:#fff;font-size:18px;font-weight:500;margin-top:6px}
/* Delivery cards */
.delivery{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.deli{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:32px 28px;display:flex;flex-direction:column;gap:16px}
.deli .ic{width:40px;height:40px;border-radius:10px;background:var(--accent-soft);color:var(--accent-ink);display:grid;place-items:center}
.deli:nth-child(2) .ic{background:var(--accent-2-soft);color:var(--accent-2-ink)}
.deli h4{margin:0;font-size:20px;font-weight:500;letter-spacing:-0.01em}
.deli p{margin:0;color:var(--ink-2);font-size:15px;line-height:1.5}
/* Bioinformatics levels */
.levels{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface)}
.level{padding:28px 24px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:12px;min-height:240px}
.level:last-child{border-right:0}
.level .num{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:0.1em;color:var(--ink-3);text-transform:uppercase}
.level h4{margin:0;font-size:16px;font-weight:500;line-height:1.3;letter-spacing:-0.005em}
.level p{margin:0;color:var(--ink-2);font-size:13px;line-height:1.5}
.level p strong{color:var(--ink);font-weight:500}
.level .bar{height:4px;border-radius:2px;background:linear-gradient(90deg, var(--accent) 0% var(--w,20%), var(--line) var(--w,20%) 100%);margin-top:auto}
/* CTA form on service page */
.cta-section .grid{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:64px}
.cta-section h2{font-size:clamp(30px,3.6vw,44px);font-weight:500;letter-spacing:-0.025em;line-height:1.05;margin:0 0 20px}
.cta-section .lead{color:var(--ink-2);margin:0 0 28px;font-size:17px;line-height:1.5;max-width:38ch}
.cta-section ul.bullets{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.cta-section ul.bullets li{display:flex;align-items:center;gap:14px;color:var(--ink-2);font-size:15px}
.cta-section ul.bullets li svg{flex-shrink:0;color:var(--accent)}
/* Responsive */
@media (max-width:1024px){
  .hero-stats{grid-template-columns:repeat(2,1fr);row-gap:24px}
  .about-grid{grid-template-columns:1fr;gap:32px}
  .equip{grid-template-columns:1fr;padding:40px 28px;gap:24px}
  .delivery{grid-template-columns:1fr}
  .levels{grid-template-columns:1fr 1fr}
  .level{border-bottom:1px solid var(--line)}
  .level:nth-child(2n){border-right:0}
  .cta-section .grid{grid-template-columns:1fr;padding:40px;gap:32px}
  .sols-head, .sols-row{grid-template-columns:1fr 1fr !important}
  .sols-row .cell.k{grid-column:1/3;border-bottom:1px dashed var(--line);background:#fbfaf6}
}
@media (max-width:640px){
  .hero-stats{grid-template-columns:1fr}
  .levels{grid-template-columns:1fr}
  .level:nth-child(2n){border-right:0}
  .equip{padding:36px 24px}
  .cta-section .grid{padding:28px}
  .sols-head, .sols-row{grid-template-columns:1fr !important}
}

/* Form submission feedback */
form.contact .submit[disabled]{opacity:0.6;cursor:wait}
form.contact .form-msg{margin-top:14px;padding:14px 16px;border-radius:10px;font-size:14px;line-height:1.5;display:none}
form.contact .form-msg.show{display:block}
form.contact .form-msg.ok{background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent-ink);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}
form.contact .form-msg.err{background:color-mix(in srgb,var(--accent-2) 12%,transparent);color:var(--accent-2-ink);border:1px solid color-mix(in srgb,var(--accent-2) 30%,transparent)}
form.contact .hp{position:absolute;left:-10000px;width:1px;height:1px;opacity:0;pointer-events:none}

/* Cookie consent banner (152-ФЗ) */
.cookie-banner{position:fixed;left:20px;right:20px;bottom:20px;z-index:100;max-width:520px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px 28px;box-shadow:0 24px 60px rgba(20,22,25,0.12);display:none;font-size:14px;line-height:1.55;color:var(--ink-2)}
.cookie-banner.show{display:block;animation:cookieIn .25s ease}
@keyframes cookieIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.cookie-banner h6{margin:0 0 8px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.cookie-banner p{margin:0 0 16px;color:var(--ink-2)}
.cookie-banner p a{color:var(--ink);border-bottom:1px solid var(--line-strong)}
.cookie-banner p a:hover{border-color:var(--ink)}
.cookie-banner .actions{display:flex;gap:10px;flex-wrap:wrap}
.cookie-banner button{padding:11px 18px;border-radius:999px;font-size:14px;font-weight:500;cursor:pointer;font-family:inherit;transition:.15s}
.cookie-banner .accept{background:var(--ink);color:#fff;border:1px solid var(--ink)}
.cookie-banner .accept:hover{background:var(--accent-ink);border-color:var(--accent-ink)}
.cookie-banner .decline{background:transparent;color:var(--ink-2);border:1px solid var(--line-strong)}
.cookie-banner .decline:hover{border-color:var(--ink);color:var(--ink)}
@media(max-width:640px){.cookie-banner{left:12px;right:12px;bottom:12px;padding:20px 22px}}

/* Responsive base */
@media (max-width:1024px){
  .nav ul{display:none}
  .dropdown{display:none}
  .f-top{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  section.s{padding:64px 0}
  .nav{height:64px;gap:16px}
  .nav .phone{display:none}
  .f-top{grid-template-columns:1fr}
  .page-hero{padding:24px 0 32px}
}
