/* Sinetech v1.5 — минималистичные стабильные стили */

:root{
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --txt:#1d1d1d; --muted:#6f6f6f; --bg:#fff;
  --accent:#006d44; --accent2:#00985e;
  --r:12px; --sh:0 4px 12px rgba(0,0,0,.06);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:var(--font);color:var(--txt);background:var(--bg);line-height:1.6}

img{max-width:100%;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent2)}

.container{width:min(1200px,92%);margin:0 auto;padding:1.5rem 0}

.hdr{position:sticky;top:0;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.05);z-index:100}
.hdr .nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0}
.brand{display:flex;align-items:center;gap:.6rem;color:var(--txt)}
.menu a{margin:0 .9rem;color:var(--txt);font-weight:500}
.cta-link{white-space:nowrap;font-weight:600}

.burger{display:none;background:0;border:0;cursor:pointer;color:var(--txt)}

.hero{background:#f8f9f9;padding:4.5rem 0 3.5rem;text-align:center}
.hero h1{margin:0 0 1rem;font-size:2.3rem}
.lead{max-width:760px;margin:0 auto 1.6rem;color:var(--muted);font-size:1.05rem}
.btns{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;align-items:center}
.btn{display:inline-block;padding:.8rem 1.6rem;border-radius:var(--r);font-weight:700;cursor:pointer;transition:.2s}
.btn.primary{background:var(--accent);color:#fff}
.btn.primary:hover{background:var(--accent2)}
.btn.ghost{border:2px solid var(--accent);color:var(--accent)}
.btn.ghost:hover{background:var(--accent);color:#fff}
.inline-mail{color:var(--muted);font-size:.95rem}

section{padding:3.2rem 0}
section h2{text-align:center;margin:0 0 2rem;font-size:1.8rem}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:#fff;border-radius:var(--r);padding:1.4rem;box-shadow:var(--sh);transition:.2s}
.card:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(0,0,0,.08)}
.card h3{margin:.1rem 0 1rem;font-size:1.12rem;min-height:2.8em}
.card p{margin:0;color:var(--muted);font-size:.98rem}

form.form{display:flex;flex-direction:column;gap:1rem;margin-top:1.4rem}
.row{display:flex;gap:1rem;flex-wrap:wrap}
.row label{flex:1}
label{display:block;font-weight:500}
input,textarea{width:100%;padding:.72rem .9rem;margin-top:.35rem;border:1px solid #ccc;border-radius:var(--r);font:inherit}
input:focus,textarea:focus{border-color:var(--accent);outline:0}
textarea{resize:vertical}
.muted{color:var(--muted);font-size:.92rem}
.center{text-align:center}
.quick-contacts{margin-top:1.6rem;text-align:center}
.quick-contacts .q{display:block;margin:.25rem 0;color:var(--txt)}
.quick-contacts .q:hover{color:var(--accent)}

.ftr{background:#f5f5f5;color:var(--muted);text-align:center;padding:1.4rem 0;font-size:.95rem}
.ftr a{color:inherit}
.ftr a:hover{color:var(--accent)}

.mobile-menu[hidden]{display:none}
.mobile-menu{position:fixed;inset:0;display:flex;z-index:120}
.mobile-menu__panel{background:#fff;width:84%;max-width:300px;height:100%;box-shadow:var(--sh);position:relative;z-index:2;padding:2rem 1rem}
.mobile-menu__nav a{display:block;margin:0 0 1rem;color:var(--txt);font-weight:500}
.mobile-menu__backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:1}
.mobile-menu__close{position:absolute;top:.8rem;right:.8rem;background:0;border:0;font-size:1.2rem;cursor:pointer}

.modal[hidden]{display:none}
.modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:130}
.modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.modal__dialog{position:relative;background:#fff;border-radius:var(--r);padding:2rem;z-index:2;text-align:center;width:min(92%,420px)}

@media (max-width: 900px){
  .menu{display:none}
  .burger{display:block}
  .hero h1{font-size:2rem}
  .lead{font-size:1rem}
}

.eyebrow {
  margin: 0 0 12px;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.7;
}

.projects-grid {
  margin-bottom: 40px;
}

.project-card p + p {
  margin-top: 16px;
}

.text-link {
  font-weight: 600;
  text-decoration: none;
}

.text-link:hover {
  text-decoration: underline;
}

.case-hero {
  padding-bottom: 36px;
}

.case-section {
  padding: 8px 0 64px;
}

.case-wrap {
  max-width: 920px;
}

.case-block {
  margin-bottom: 32px;
}

.case-block h2 {
  margin-bottom: 14px;
}

.case-block h3 {
  margin: 20px 0 8px;
}

.case-block p,
.case-note p {
  line-height: 1.75;
}

.case-note {
  margin-top: 36px;
  padding: 20px 24px;
  border-left: 3px solid rgba(255,255,255,0.18);
  border-radius: 14px;
  background: rgba(255,255,255,0.03);
}

.case-back {
  margin-top: 28px;
}

.case-gallery {
  padding: 24px 0 40px;
}

.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.gallery img {
  width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
}

.case-gallery {
  padding: 16px 0 40px;
}

.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
}

.gallery-item {
  margin: 0;
}

.gallery-btn {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.gallery-btn img {
  display: block;
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 18px;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.gallery-btn:hover img {
  transform: translateY(-2px);
  opacity: 0.96;
}

.gallery-item figcaption {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.5;
  opacity: 0.8;
}

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
}

.lightbox.is-open {
  display: block;
}

.lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.82);
}

.lightbox-dialog {
  position: relative;
  z-index: 1;
  width: min(92vw, 1200px);
  max-height: 90vh;
  margin: 5vh auto;
  padding: 20px;
  border-radius: 20px;
  background: #111;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
}

.lightbox-image {
  display: block;
  width: 100%;
  max-height: 72vh;
  object-fit: contain;
  border-radius: 14px;
}

.lightbox-caption {
  margin: 14px 0 0;
  line-height: 1.5;
  opacity: 0.85;
}

.lightbox-close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 999px;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

.lightbox-close:hover {
  background: rgba(255, 255, 255, 0.18);
}

@media (max-width: 640px) {
  .gallery-btn img {
    height: 190px;
  }

  .lightbox-dialog {
    width: 94vw;
    padding: 14px;
    border-radius: 16px;
  }
}

.case-gallery {
  padding: 12px 0 40px;
}

.case-gallery-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  align-items: start;
}

.case-gallery-item {
  margin: 0;
}

.case-gallery-btn {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.case-gallery-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 240px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(255,255,255,0.04);
  overflow: hidden;
}

.case-gallery-thumb img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.case-gallery-item figcaption {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.45;
  opacity: 0.8;
}

@media (max-width: 980px) {
  .case-gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .case-gallery-grid {
    grid-template-columns: 1fr;
  }

  .case-gallery-thumb {
    height: 210px;
  }
}