/* ════════════════════════════════════════════
   GEL INSTRUMENTE AG — Global Styles
   Barlow Condensed + Barlow · Swiss Red
════════════════════════════════════════════ */
:root{
  --red:#C8102E;--red2:#a50d25;--red-pale:#fdf0f2;
  --ch:#1c2128;--ch2:#252c35;--ch3:#2e3741;
  --mid:#4a5568;--muted:#718096;--faint:#a0aab8;
  --border:#e8eaed;--border2:#d1d5db;
  --bg:#fff;--bg2:#f7f8fa;--bg3:#f0f2f5;
  --f-h:'Barlow Condensed',sans-serif;
  --f-b:'Barlow',sans-serif;
  --r:10px;--r2:16px;
  --sh:0 1px 3px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.05);
  --sh2:0 2px 8px rgba(0,0,0,.07),0 12px 40px rgba(0,0,0,.07);
  --sh3:0 4px 20px rgba(0,0,0,.09),0 20px 60px rgba(0,0,0,.08);
  --tr:.25s cubic-bezier(.4,0,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--f-b);background:var(--bg);color:var(--ch);line-height:1.6;overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{cursor:pointer;font-family:var(--f-b);border:none;background:none}
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:var(--bg2)}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}
::-webkit-scrollbar-thumb:hover{background:var(--red)}
.wrap{max-width:1220px;margin:0 auto;padding:0 40px}

/* TOPBAR */
.topbar{background:var(--ch);color:rgba(255,255,255,.55);font-size:.75rem;font-weight:500;border-bottom:1px solid rgba(255,255,255,.06)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:36px}
.tb-l,.tb-r{display:flex;align-items:center;gap:20px}
.tb-l a,.tb-r>span{display:flex;align-items:center;gap:6px;color:rgba(255,255,255,.5);transition:color var(--tr)}
.tb-l a:hover{color:#fff}.tb-sep{color:rgba(255,255,255,.15)}
.lw{display:flex;align-items:center;gap:2px}
.lbtn{font-size:.73rem;font-weight:700;letter-spacing:.06em;color:rgba(255,255,255,.4);padding:3px 9px;border-radius:5px;transition:all var(--tr)}
.lbtn.on{color:#fff;background:rgba(255,255,255,.12)}.lbtn:hover{color:#fff}

/* NAVBAR */
.navbar{position:sticky;top:0;z-index:900;background:rgba(255,255,255,.96);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);transition:box-shadow var(--tr)}
.navbar.stuck{box-shadow:var(--sh)}
.ni{display:flex;align-items:center;height:70px}
.n-logo{display:flex;align-items:center;gap:13px;margin-right:48px;flex-shrink:0}
.n-mark{width:38px;height:38px;background:var(--red);border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:var(--f-h);font-weight:800;font-size:.95rem;color:#fff;letter-spacing:.05em}
.n-txt{display:flex;flex-direction:column;line-height:1.1}
.n-name{font-family:var(--f-h);font-size:1.05rem;font-weight:700;color:var(--ch);letter-spacing:.02em}
.n-sub{font-size:.65rem;color:var(--faint);letter-spacing:.12em;text-transform:uppercase}
.n-links{display:flex;align-items:center;gap:2px;flex:1}
.nl{padding:8px 14px;font-size:.875rem;font-weight:500;color:var(--muted);border-radius:7px;transition:all var(--tr);white-space:nowrap;display:flex;align-items:center;gap:3px}
.nl:hover{color:var(--ch);background:var(--bg2)}.nl.cur{color:var(--red)}
.ndrop{position:relative}
.ndp{position:absolute;top:calc(100% + 10px);left:0;background:#fff;border:1px solid var(--border);border-radius:var(--r2);padding:8px;min-width:250px;box-shadow:var(--sh3);opacity:0;pointer-events:none;transform:translateY(-8px);transition:all var(--tr);z-index:10}
.ndrop:hover .ndp{opacity:1;pointer-events:all;transform:translateY(0)}
.ndp a{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:8px;font-size:.875rem;color:var(--muted);transition:all var(--tr)}
.ndp a:hover{color:var(--ch);background:var(--bg2)}
.ndp .dot{width:6px;height:6px;border-radius:50%;background:var(--border2);flex-shrink:0;transition:background var(--tr)}
.ndp a:hover .dot{background:var(--red)}
.ndp .new-tag{font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--red);background:var(--red-pale);padding:2px 7px;border-radius:100px;margin-left:auto}
.n-cta{margin-left:auto;flex-shrink:0}
.ham{display:none;flex-direction:column;gap:5px;padding:8px;margin-left:auto}
.ham span{display:block;width:22px;height:2px;background:var(--ch2);border-radius:2px;transition:all var(--tr)}
.mob{display:none;flex-direction:column;padding:12px 24px 24px;border-top:1px solid var(--border);background:#fff;gap:4px}
.mob.open{display:flex}
.mob a{padding:11px 14px;font-size:.95rem;color:var(--muted);border-radius:8px;transition:all var(--tr)}
.mob a:hover{color:var(--ch);background:var(--bg2)}
.mob .m-cta{background:var(--red)!important;color:#fff!important;text-align:center;font-weight:700;margin-top:8px;font-family:var(--f-h);letter-spacing:.04em}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:var(--r);font-family:var(--f-h);font-size:.95rem;font-weight:700;letter-spacing:.04em;transition:all var(--tr)}
.btn-red{background:var(--red);color:#fff;border:2px solid var(--red)}
.btn-red:hover{background:var(--red2);border-color:var(--red2);transform:translateY(-2px);box-shadow:0 6px 20px rgba(200,16,46,.3)}
.btn-out{background:transparent;color:var(--ch);border:2px solid var(--border2)}
.btn-out:hover{border-color:var(--ch);transform:translateY(-2px)}
.btn-full{width:100%;justify-content:center}

/* SECTION LABELS */
.tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-h);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:14px}
.tag::before{content:'';width:24px;height:2px;background:var(--red)}
h2.sec{font-family:var(--f-h);font-size:clamp(1.8rem,3vw,2.6rem);font-weight:800;line-height:1.05;letter-spacing:-.01em;margin-bottom:14px}

/* REVEAL */
.rv{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease;transition-delay:var(--d,0ms)}
.rv.in{opacity:1;transform:translateY(0)}

/* PAGE HEADER */
.ph{background:var(--ch);color:#fff;padding:64px 0 56px;position:relative;overflow:hidden}
.ph-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:52px 52px;pointer-events:none}
.ph-glow{position:absolute;top:-100px;right:-100px;width:500px;height:500px;background:radial-gradient(circle,rgba(200,16,46,.12) 0%,transparent 65%);pointer-events:none}
.ph-inner{position:relative}
.ph-bc{display:flex;align-items:center;gap:8px;font-size:.78rem;color:rgba(255,255,255,.4);margin-bottom:16px}
.ph-bc a{color:rgba(255,255,255,.4);transition:color var(--tr)}.ph-bc a:hover{color:#fff}
.ph-bc span{color:rgba(255,255,255,.2)}
.ph h1{font-family:var(--f-h);font-size:clamp(2.2rem,4vw,3.4rem);font-weight:800;line-height:1;letter-spacing:-.01em;margin-bottom:10px}
.ph p{font-size:1rem;color:rgba(255,255,255,.55);max-width:560px;line-height:1.7}

/* FORM */
form{display:flex;flex-direction:column;gap:16px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.f-field{display:flex;flex-direction:column;gap:6px}
.f-field label{font-size:.78rem;font-weight:600;color:var(--mid)}
.f-field input,.f-field select,.f-field textarea{background:var(--bg2);border:1.5px solid var(--border);border-radius:8px;padding:10px 13px;font-size:.875rem;font-family:var(--f-b);color:var(--ch);outline:none;transition:all var(--tr);resize:vertical}
.f-field input::placeholder,.f-field textarea::placeholder{color:var(--faint)}
.f-field input:focus,.f-field select:focus,.f-field textarea:focus{border-color:var(--red);background:var(--bg);box-shadow:0 0 0 3px rgba(200,16,46,.09)}
.f-field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23a0aab8' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;cursor:pointer}
.f-note{font-size:.73rem;color:var(--faint);text-align:center;margin-top:4px}
.form-ok{display:none;flex-direction:column;align-items:center;text-align:center;padding:48px 20px;gap:14px}
.form-ok.show{display:flex}
.form-ok h4{font-family:var(--f-h);font-size:1.3rem;font-weight:700;color:var(--ch)}
.form-ok p{font-size:.88rem;color:var(--muted)}

/* FOOTER */
.footer{background:var(--ch);color:rgba(255,255,255,.5);padding-top:70px}
.fi{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:56px;padding-bottom:56px}
.fb-logo{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.fb-name{font-family:var(--f-h);font-size:1rem;font-weight:700;color:#fff;letter-spacing:.02em}
.fb-since{font-size:.65rem;color:rgba(255,255,255,.3);letter-spacing:.1em;text-transform:uppercase;display:block}
.fb-brand p{font-size:.86rem;color:rgba(255,255,255,.35);line-height:1.65;margin-bottom:18px}
.fb-bgs{display:flex;gap:6px;flex-wrap:wrap}
.fb-bgs span{font-size:.7rem;font-weight:600;color:rgba(255,255,255,.3);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:5px;padding:3px 9px}
.fc{display:flex;flex-direction:column;gap:10px}
.fc h5{font-family:var(--f-h);font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff;margin-bottom:6px}
.fc a{font-size:.86rem;color:rgba(255,255,255,.35);transition:color var(--tr);line-height:1.5}
.fc a:hover{color:#fff}
.fb-bot{border-top:1px solid rgba(255,255,255,.07)}
.fb-bot .wrap{display:flex;align-items:center;justify-content:space-between;height:52px;font-size:.78rem;color:rgba(255,255,255,.25)}
.fb-legal{display:flex;gap:24px}
.fb-legal a{color:rgba(255,255,255,.25);transition:color var(--tr)}.fb-legal a:hover{color:#fff}

/* PRODUCT DETAIL */
.prod-detail{padding:80px 0}
.pd-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.pd-visual{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r2);padding:48px;display:flex;align-items:center;justify-content:center;min-height:340px;position:relative}
.pd-vis-badge{position:absolute;bottom:20px;left:20px;background:var(--red);color:#fff;border-radius:8px;padding:8px 14px;font-family:var(--f-h);font-size:.8rem;font-weight:700;letter-spacing:.05em}
.pd-h2{font-family:var(--f-h);font-size:clamp(1.8rem,3vw,2.6rem);font-weight:800;line-height:1.05;letter-spacing:-.01em;margin-bottom:8px}
.pd-sub{font-family:var(--f-h);font-size:1.1rem;font-weight:600;color:var(--red);margin-bottom:16px;letter-spacing:.02em}
.pd-p{font-size:.95rem;color:var(--muted);line-height:1.8;margin-bottom:20px}
.pd-principle{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:20px 22px;margin-bottom:24px}
.pd-principle h4{font-family:var(--f-h);font-size:.85rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.pd-principle p{font-size:.88rem;color:var(--mid);line-height:1.65}
.pd-features{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.pd-features li{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;color:var(--mid)}
.pf-ic{width:20px;height:20px;border-radius:50%;background:var(--red-pale);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.pf-ic svg{width:10px;height:10px;color:var(--red)}
.pd-btns{display:flex;gap:12px;flex-wrap:wrap}

/* TECH TABLE */
.tech-table{padding:0 0 80px}
.tt-title{font-family:var(--f-h);font-size:1.2rem;font-weight:700;letter-spacing:.02em;color:var(--ch);margin-bottom:20px}
table{width:100%;border-collapse:collapse}
th{background:var(--ch);color:#fff;font-family:var(--f-h);font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:12px 18px;text-align:left}
td{padding:11px 18px;font-size:.875rem;border-bottom:1px solid var(--border)}
tr:nth-child(even) td{background:var(--bg2)}
tr:hover td{background:var(--red-pale)}

/* PROD GRID for listing */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.pc{background:var(--bg);border:1px solid var(--border);border-radius:var(--r2);padding:30px;display:flex;flex-direction:column;gap:14px;transition:all var(--tr);position:relative}
.pc:hover{box-shadow:var(--sh3);transform:translateY(-4px);border-color:var(--border2)}
.pc.hot{border-top:3px solid var(--red)}
.pc-num{font-family:var(--f-h);font-size:2.8rem;font-weight:800;color:var(--bg3);line-height:1;position:absolute;top:18px;right:22px}
.pc-icon{width:50px;height:50px;background:var(--red-pale);border-radius:11px;display:flex;align-items:center;justify-content:center;color:var(--red)}
.pc-icon svg{width:28px;height:28px}
.pc h3{font-family:var(--f-h);font-size:1.1rem;font-weight:700;letter-spacing:.02em;color:var(--ch)}
.pc p{font-size:.86rem;color:var(--muted);line-height:1.6;flex:1}
.pc-link{font-family:var(--f-h);font-size:.85rem;font-weight:700;color:var(--red);transition:color var(--tr);margin-top:auto}
.pc-link:hover{color:var(--red2)}
.pc-models{display:flex;flex-wrap:wrap;gap:5px}
.pc-model{font-family:'Courier New',monospace;font-size:.7rem;font-weight:600;background:var(--bg2);border:1px solid var(--border);border-radius:5px;padding:2px 9px;color:var(--mid)}

/* RESPONSIVE */
@media(max-width:1060px){
  .fi{grid-template-columns:1fr 1fr;gap:40px}
  .pd-grid{grid-template-columns:1fr;gap:48px}
  .prod-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .wrap{padding:0 20px}
  .n-links,.n-cta{display:none}
  .ham{display:flex}
  .tb-l{display:none}
  .prod-grid{grid-template-columns:1fr}
  .fi{grid-template-columns:1fr;gap:32px}
  .fb-bot .wrap{flex-direction:column;height:auto;padding:16px 0;gap:10px;text-align:center}
  .f-row{grid-template-columns:1fr}
}
