:root,
  html[data-theme="light"]{
    --bg:#f5f1e8;
    --bg-panel:#ffffff;
    --bg-panel-2:#faf7ef;
    --line:#e2ddce;
    --steel:#3f5c78;
    --steel-dim:#c7d0da;
    --accent:#ff6a1a;
    --accent-dim:#e0580f;
    --paper:#181d24;
    --paper-dim:#4a5361;
    --muted:#767f8c;
    --mono-num:#c14e14;
    --bg-header:rgba(245,241,232,.86);
    --radius:2px;
    --maxw:1180px;
  }
  html[data-theme="dark"]{
    --bg:#10141a;
    --bg-panel:#171d26;
    --bg-panel-2:#1c2430;
    --line:#262e3b;
    --steel:#5c7fa8;
    --steel-dim:#3a4a5e;
    --accent:#ff6a1a;
    --accent-dim:#c9531a;
    --paper:#eae7de;
    --paper-dim:#b7bcc6;
    --muted:#7c8798;
    --mono-num:#ffb27a;
    --bg-header:rgba(16,20,26,.86);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--paper);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    transition:background .25s ease, color .25s ease;
  }
  h1,h2,h3,.disp{
    font-family:'Space Grotesk',sans-serif;
    color:var(--paper);
    letter-spacing:-0.01em;
    margin:0;
  }
  .mono{font-family:'JetBrains Mono',monospace;}
  a{color:inherit;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
  img,svg{display:block;max-width:100%;}
  ::selection{background:var(--accent);color:#10141a;}

  /* subtle blueprint grid background */
  .grid-bg{
    position:fixed;inset:0;z-index:0;pointer-events:none;
    background-image:
      linear-gradient(var(--line) 1px, transparent 1px),
      linear-gradient(90deg, var(--line) 1px, transparent 1px);
    background-size:56px 56px;
    opacity:.35;
    mask-image:radial-gradient(ellipse 80% 60% at 50% 0%, #000 40%, transparent 90%);
  }

  /* header */
  header{
    position:sticky;top:0;z-index:50;
    background:var(--bg-header);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;height:72px;}
  .logo{font-family:'Space Grotesk';font-weight:700;font-size:20px;letter-spacing:.02em;display:flex;align-items:center;gap:10px;text-decoration:none;cursor:pointer;}
  .logo .dot{color:var(--accent);}
  .navlinks{display:flex;gap:28px;font-size:14px;color:var(--paper-dim);}
  .navlinks a{text-decoration:none;transition:color .15s;}
  .navlinks a:hover{color:var(--paper);}
  .nav-right{display:flex;align-items:center;gap:18px;}
  .phone-link{font-family:'JetBrains Mono';font-size:14px;color:var(--paper-dim);text-decoration:none;white-space:nowrap;}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:11px 20px;border-radius:var(--radius);
    font-size:14px;font-weight:600;text-decoration:none;
    border:1px solid transparent;cursor:pointer;
    transition:transform .15s ease, background .15s ease, border-color .15s ease;
    white-space:nowrap;
  }
  .btn-accent{background:var(--accent);color:#10141a;}
  .btn-accent:hover{background:#ff7d3a;transform:translateY(-1px);}
  .btn-ghost{background:transparent;color:var(--paper);border-color:var(--steel-dim);}
  .btn-ghost:hover{border-color:var(--steel);}
  .navlinks-hide{display:none;}
  @media(max-width:880px){.navlinks{display:none;} .phone-link{display:none;}}

  /* hero */
  .hero{position:relative;z-index:1;padding:88px 0 40px;}
  .hero-grid{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    grid-template-areas:
      "text diagram"
      "text salah";
    gap:24px 56px;
    align-items:start;
  }
  .hero-grid > .hero-text{align-self:center;}
  @media(max-width:980px){
    .hero-grid{
      grid-template-columns:1fr;
      grid-template-areas:
        "salah"
        "text"
        "diagram";
      gap:28px;
    }
  }
  .eyebrow{
    display:inline-flex;align-items:center;gap:10px;
    font-family:'JetBrains Mono';font-size:12px;color:var(--steel);
    border:1px solid var(--steel-dim);padding:6px 12px;border-radius:20px;
    margin-bottom:22px;
  }
  .eyebrow .pulse{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 2s infinite;}
  @keyframes pulse{0%,100%{opacity:1;}50%{opacity:.25;}}
  h1{font-size:clamp(32px,4.4vw,52px);line-height:1.08;font-weight:700;}
  h1 em{font-style:normal;color:var(--accent);}
  .hero-sub{font-size:17px;line-height:1.65;color:var(--paper-dim);max-width:52ch;margin:22px 0 32px;}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:34px;}
  .hero-meta{display:flex;gap:32px;flex-wrap:wrap;font-size:13px;color:var(--muted);}
  .hero-meta b{display:block;color:var(--paper);font-family:'JetBrains Mono';font-size:20px;font-weight:600;}

  /* diagram */
  .diagram-card{
    /* фиксированная тёмная "приборная" панель — не зависит от темы сайта, как экран датчика */
    --bg-panel:#171d26;
    --bg-panel-2:#1c2430;
    --line:#262e3b;
    --steel:#5c7fa8;
    --paper:#eae7de;
    --paper-dim:#b7bcc6;
    --muted:#7c8798;
    --mono-num:#ffb27a;
    --accent:#ff6a1a;
    background:var(--bg-panel);border:1px solid var(--line);border-radius:6px;
    padding:22px 22px 16px;position:relative;
  }
  .diagram-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
  .diagram-title{font-family:'JetBrains Mono';font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;}
  .diagram-readout{font-family:'JetBrains Mono';font-size:12px;color:var(--mono-num);text-align:right;}
  .diagram-readout b{font-size:22px;display:block;color:var(--accent);}
  .layer-label{font-family:'JetBrains Mono';font-size:10px;fill:var(--muted);}
  .layer-label-active{fill:var(--paper);}
  .depth-tick{font-family:'JetBrains Mono';font-size:10px;fill:var(--muted);}
  .soil-layer{transition:opacity .2s;cursor:default;}
  .soil-layer:hover{opacity:.85;}
  .pile-rod{stroke:var(--paper-dim);}
  .load-arrow{fill:var(--accent);}

  /* prayer times widget — compact, Sajda-style */
  .salah-card{
    background:var(--bg-panel);border:1px solid var(--line);border-radius:10px;
    padding:14px 16px;
  }
  .salah-top{display:flex;justify-content:space-between;align-items:flex-start;}
  .salah-next-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;}
  .salah-next-name{font-family:'Space Grotesk';font-weight:600;font-size:15px;color:var(--paper);margin-top:2px;}
  .salah-timer{font-family:'JetBrains Mono';font-weight:600;font-size:24px;color:var(--paper);letter-spacing:.02em;margin-top:2px;}
  .salah-city{text-align:right;}
  .salah-city b{font-family:'Space Grotesk';font-size:14px;color:var(--paper);display:block;}
  .salah-city span{font-size:11px;color:var(--muted);}
  .salah-row{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin-top:12px;}
  .salah-chip{
    background:var(--bg);border-radius:6px;padding:7px 2px;text-align:center;
    transition:background .2s;
  }
  .salah-chip.active{background:var(--accent);}
  .salah-chip.active .salah-chip-name,
  .salah-chip.active .salah-chip-time{color:#10141a;}
  .salah-chip-name{font-size:9.5px;color:var(--muted);display:block;}
  .salah-chip-time{font-family:'JetBrains Mono';font-size:11.5px;font-weight:600;color:var(--paper);display:block;margin-top:3px;}

  /* section shell */
  section{position:relative;z-index:1;padding:88px 0;}
  .section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:48px;flex-wrap:wrap;}
  .kicker{font-family:'JetBrains Mono';font-size:12px;color:var(--steel);letter-spacing:.06em;text-transform:uppercase;margin-bottom:10px;}
  h2{font-size:clamp(26px,3vw,36px);font-weight:600;max-width:20ch;}
  .section-note{max-width:42ch;font-size:14px;color:var(--muted);line-height:1.6;}
  hr.rule{border:none;border-top:1px solid var(--line);margin:0;}

  /* services */
  .services{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
  @media(max-width:900px){.services{grid-template-columns:1fr;}}
  .service{background:var(--bg-panel);padding:34px 30px;display:flex;flex-direction:column;gap:16px;}
  .service .code{font-family:'JetBrains Mono';font-size:11px;color:var(--accent);}
  .service h3{font-size:21px;font-weight:600;}
  .service p{font-size:14px;line-height:1.65;color:var(--paper-dim);margin:0;}
  .service ul{margin:0;padding:0;list-style:none;font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:8px;}
  .service li{padding-left:16px;position:relative;}
  .service li::before{content:'—';position:absolute;left:0;color:var(--steel);}
  .service .cta{margin-top:auto;padding-top:10px;font-size:13px;font-weight:600;color:var(--accent);text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
  .service .cta:hover{color:#ff7d3a;}

  /* process */
  .process{display:flex;flex-direction:column;border-top:1px solid var(--line);}
  .process-row{display:grid;grid-template-columns:80px 1fr 1fr;gap:24px;padding:26px 0;border-bottom:1px solid var(--line);align-items:baseline;}
  @media(max-width:760px){.process-row{grid-template-columns:44px 1fr;}.process-row .p-desc{grid-column:2;}}
  .p-num{font-family:'JetBrains Mono';font-size:13px;color:var(--steel);}
  .p-title{font-size:18px;font-weight:600;font-family:'Space Grotesk';}
  .p-desc{font-size:14px;color:var(--muted);line-height:1.6;}

  /* coverage */
  .coverage-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
  @media(max-width:900px){.coverage-grid{grid-template-columns:1fr;gap:32px;}}
  .city-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;}
  .city-tag{
    font-family:'JetBrains Mono';font-size:12px;color:var(--paper-dim);
    border:1px solid var(--line);padding:7px 13px;border-radius:20px;
  }
  .city-tag.hq{border-color:var(--accent);color:var(--accent);}
  .stat-list{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
  .stat{border-left:2px solid var(--steel-dim);padding-left:16px;}
  .stat b{display:block;font-family:'JetBrains Mono';font-size:30px;color:var(--paper);font-weight:600;}
  .stat span{font-size:13px;color:var(--muted);}

  /* cases / portfolio */
  .cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
  @media(max-width:980px){.cases-grid{grid-template-columns:repeat(2,1fr);}}
  @media(max-width:620px){.cases-grid{grid-template-columns:1fr;}}
  .case-row{
    background:var(--bg-panel);border:1px solid var(--line);border-radius:6px;
    overflow:hidden;cursor:zoom-in;
  }
  .case-thumb{
    width:100%;aspect-ratio:4/3;overflow:hidden;position:relative;
    background:var(--bg-panel-2);
  }
  .case-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease;}
  .case-row:hover .case-thumb img{transform:scale(1.05);}
  .case-thumb::after{
    content:'⤢';position:absolute;top:10px;right:10px;
    width:30px;height:30px;border-radius:50%;
    background:rgba(16,20,26,.55);color:#fff;
    display:flex;align-items:center;justify-content:center;font-size:15px;
    opacity:0;transition:opacity .2s ease;
  }
  .case-row:hover .case-thumb::after{opacity:1;}
  .case-info{padding:14px 16px 16px;}
  .case-title{font-family:'Space Grotesk';font-size:15px;font-weight:600;color:var(--paper);line-height:1.3;}
  .case-meta{font-family:'JetBrains Mono';font-size:12px;color:var(--muted);margin-top:6px;display:flex;flex-wrap:wrap;gap:8px;}
  .case-meta .tonnage{color:var(--accent-dim);}

  /* lightbox */
  .lightbox{
    position:fixed;inset:0;z-index:100;background:rgba(10,12,16,.92);
    display:none;align-items:center;justify-content:center;padding:32px;
    cursor:zoom-out;
  }
  .lightbox.open{display:flex;}
  .lightbox img{max-width:min(90vw,900px);max-height:85vh;border-radius:4px;box-shadow:0 20px 60px rgba(0,0,0,.5);display:block;}
  .lightbox-caption{
    position:absolute;bottom:28px;left:0;right:0;text-align:center;
    font-family:'JetBrains Mono';font-size:13px;color:#eae7de;
  }
  .lightbox-close{
    position:absolute;top:20px;right:24px;width:40px;height:40px;border-radius:50%;
    background:rgba(255,255,255,.1);color:#fff;border:none;font-size:20px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
  }
  .lightbox-close:hover{background:rgba(255,255,255,.2);}

  /* faq */
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-q{
    display:flex;justify-content:space-between;align-items:center;gap:20px;
    padding:22px 0;cursor:pointer;font-weight:600;font-size:16px;font-family:'Space Grotesk';
  }
  .faq-q .plus{font-family:'JetBrains Mono';color:var(--accent);font-size:18px;transition:transform .2s;flex-shrink:0;}
  .faq-item.open .plus{transform:rotate(45deg);}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;}
  .faq-a p{font-size:14px;color:var(--paper-dim);line-height:1.7;padding:0 0 22px;max-width:70ch;margin:0;}

  /* contact / footer */
  footer{border-top:1px solid var(--line);padding:64px 0 40px;position:relative;z-index:1;}
  .foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:40px;margin-bottom:48px;}
  @media(max-width:820px){.foot-grid{grid-template-columns:1fr;gap:32px;}}
  .foot-label{font-family:'JetBrains Mono';font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;}
  .foot-col p, .foot-col a{font-size:14px;color:var(--paper-dim);line-height:1.8;text-decoration:none;display:block;}
  .foot-col a:hover{color:var(--paper);}
  .foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--muted);padding-top:24px;border-top:1px solid var(--line);}

  /* sticky whatsapp */
  .wa-float{
    position:fixed;bottom:24px;right:24px;z-index:60;
    width:58px;height:58px;border-radius:50%;
    background:var(--accent);display:flex;align-items:center;justify-content:center;
    box-shadow:0 8px 24px rgba(255,106,26,.35);
    text-decoration:none;
  }
  .wa-float svg{width:28px;height:28px;}
  .wa-float{animation:float-pulse 2.6s infinite;}
  @keyframes float-pulse{0%,100%{box-shadow:0 8px 24px rgba(255,106,26,.35);}50%{box-shadow:0 8px 30px rgba(255,106,26,.6);}}

  /* theme toggle — stacked above the WhatsApp button, bottom right */
  .theme-toggle{
    position:fixed;bottom:94px;right:24px;z-index:60;
    width:50px;height:50px;border-radius:50%;
    background:var(--bg-panel);border:1px solid var(--line);
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.12);
    transition:border-color .15s ease, transform .15s ease;
    padding:0;
  }
  .theme-toggle:hover{border-color:var(--steel);transform:translateY(-1px);}
  .theme-toggle svg{width:22px;height:22px;stroke:var(--paper);}
  .theme-toggle .icon-sun{display:none;}
  html[data-theme="dark"] .theme-toggle .icon-sun{display:block;}
  html[data-theme="dark"] .theme-toggle .icon-moon{display:none;}

  @media(prefers-reduced-motion: reduce){
    *{animation:none !important; transition:none !important;}
  }