/* Стили такие же, как раньше (современный чистый вид) */
:root{
  --accent:#0b8bff;
  --accent-soft:#e3f2ff;
  --bg:#f3f5fb;
  --card:#ffffff;
  --muted:#6b7280;
  --text:#111827;
  --radius-lg:18px;
  --shadow-soft:0 14px 40px rgba(15,23,42,0.14);
}
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
}
button,input,select,textarea{font-family:inherit;}

/* Hero */
.hero{
  background:radial-gradient(circle at top left,#c4e2ff 0,#e5edff 40%,#f3f5fb 100%);
  padding:32px 16px 24px;
  border-bottom:1px solid #e5e7eb;
}
.hero-inner{
  max-width:1080px;
  margin:0 auto;
}
.hero h1{
  margin:0 0 8px;
  font-size:2.2rem;
  font-weight:800;
}
.hero-lead{
  margin:0 0 18px;
  max-width:700px;
  color:#374151;
  font-size:1rem;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:16px;
}
.primary{
  background:var(--accent);
  border:none;
  color:#fff;
  padding:10px 18px;
  border-radius:999px;
  font-weight:600;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(37,99,235,0.35);
}
.primary:hover{filter:brightness(1.05);}
.ghost{
  background:transparent;
  border:1px solid #d1d5db;
  color:#111827;
  padding:9px 17px;
  border-radius:999px;
  cursor:pointer;
}
.primary-outline{
  background:var(--accent-soft);
  border:1px solid #bfdbfe;
  color:#1d4ed8;
  padding:9px 16px;
  border-radius:999px;
  cursor:pointer;
  font-weight:600;
}

.hero-contacts{
  margin-top:12px;
  padding:14px 16px;
  background:rgba(255,255,255,0.9);
  border-radius:var(--radius-lg);
  box-shadow:0 10px 28px rgba(15,23,42,0.12);
}
.hero-contacts h2{
  margin:0 0 6px;
  font-size:1.1rem;
}
#contact-block{
  font-size:0.95rem;
  color:#111827;
}
#contact-block p{margin:3px 0;}
.small-link{
  margin-top:6px;
  background:none;
  border:none;
  color:#2563eb;
  font-size:0.85rem;
  cursor:pointer;
  padding:0;
  text-decoration:underline;
}

/* Main layout */
main{
  max-width:1080px;
  margin:0 auto;
  padding:18px 16px 40px;
}

.info-section{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:16px;
  margin-bottom:24px;
}
.info-card{
  background:var(--card);
  border-radius:var(--radius-lg);
  padding:16px 18px;
  box-shadow:0 8px 22px rgba(15,23,42,0.08);
}
.info-card h2{margin:0 0 8px;font-size:1.1rem;}
.info-card ul{margin:0;padding-left:18px;font-size:0.95rem;}
.info-card li{margin-bottom:4px;}
.info-card.accent{
  background:linear-gradient(135deg,#0f172a,#1e293b);
  color:#e5e7eb;
}
.info-card.accent p{margin:0;font-size:0.95rem;}

/* Cases list */
.section-header h2{margin:0 0 4px;}
.section-header p{margin:0 0 8px;color:var(--muted);font-size:0.94rem;}
.controls{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:12px 0;
}
.controls input,
.controls select,
.controls button,
.file-label{
  padding:8px 10px;
  border-radius:999px;
  border:1px solid #d1d5db;
  font-size:0.9rem;
}
.controls input{
  min-width:180px;
  flex:1 1 220px;
}
.controls select{flex:0 0 190px;}
.controls button{cursor:pointer;}
.file-label{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#fff;
  cursor:pointer;
}
.file-label input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
  border:none;
  padding:0;
}

.list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:14px;
  margin-top:10px;
}
.card{
  background:var(--card);
  border-radius:16px;
  padding:12px 14px;
  box-shadow:0 10px 26px rgba(15,23,42,0.1);
  border:1px solid rgba(148,163,184,0.25);
}
.card h3{margin:0 0 4px;font-size:1.02rem;}
.card .badge{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  font-size:0.75rem;
  font-weight:600;
}
.badge.missing{background:#fef3c7;color:#92400e;}
.badge.found{background:#dcfce7;color:#166534;}
.badge.confirmed_dead{background:#fee2e2;color:#b91c1c;}
.card .meta{
  font-size:0.8rem;
  color:var(--muted);
  margin:2px 0 4px;
}
.card p{margin:3px 0;font-size:0.9rem;}
.card .actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}
button.small{
  padding:5px 9px;
  border-radius:999px;
  font-size:0.8rem;
  border:1px solid #d1d5db;
  background:#f9fafb;
  cursor:pointer;
}

/* Success stories */
.success-section{margin-top:32px;}
.success-gallery{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:14px;
  margin-top:10px;
}
.success-card{
  background:var(--card);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 12px 32px rgba(15,23,42,0.14);
  display:flex;
  flex-direction:column;
}
.success-card img{
  width:100%;
  height:190px;
  object-fit:cover;
}
.success-body{
  padding:10px 12px 12px;
}
.success-body h3{margin:0 0 4px;font-size:1rem;}
.success-body p{margin:2px 0;font-size:0.9rem;color:#374151;}

/* Thanks */
.thanks-section{margin-top:32px;}
.thanks-gallery{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:14px;
  margin-top:10px;
}
.thanks-card{
  background:var(--card);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(15,23,42,0.16);
  display:flex;
  flex-direction:column;
}
.thanks-photo{
  width:100%;
  height:190px;
  object-fit:cover;
}
.thanks-body{padding:10px 12px 12px;}
.thanks-quote{
  font-style:italic;
  font-size:0.92rem;
  margin:4px 0 6px;
}
.thanks-name{
  font-size:0.9rem;
  font-weight:600;
}
.thanks-role{
  font-size:0.8rem;
  color:var(--muted);
}

.small-note{
  margin-top:8px;
  font-size:0.8rem;
  color:var(--muted);
}

/* Modal */
.modal{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,0.45);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px;
  z-index:50;
}
.modal.hidden{display:none;}
.modal-inner{
  background:var(--card);
  padding:16px 18px;
  border-radius:20px;
  max-width:720px;
  width:100%;
  max-height:90vh;
  overflow:auto;
  box-shadow:var(--shadow-soft);
}
.modal-inner h2{margin:0 0 10px;}
label{display:block;margin:6px 0;font-size:0.9rem;}
input[type="text"],
input[type="date"],
input[type="email"],
textarea,
select{
  width:100%;
  padding:8px 9px;
  border-radius:10px;
  border:1px solid #d1d5db;
  margin-top:3px;
  font-size:0.9rem;
}
textarea{min-height:80px;resize:vertical;}
.form-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:10px;
}

/* Footer */
footer{
  border-top:1px solid #e5e7eb;
  padding:12px 16px 18px;
  text-align:center;
  font-size:0.8rem;
  color:var(--muted);
}

/* Print */
@media print{
  body{background:#fff;}
  .hero, .info-section, .success-section, .thanks-section, footer, .modal, .controls{display:none !important;}
  main{max-width:none;padding:6mm;}
  .list{grid-template-columns:1fr;}
}


/* Блок про Костенка Миколу Ігоровича */
.person-section{
  max-width:1080px;
  margin:32px auto 0;
  padding:0 16px 8px;
}
.person-card{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin-top:10px;
  background:var(--card);
  border-radius:18px;
  padding:14px 16px;
  box-shadow:0 10px 30px rgba(15,23,42,0.14);
}
.person-photo-wrap{
  flex:0 0 220px;
  max-width:220px;
}
.person-photo{
  width:100%;
  border-radius:16px;
  object-fit:cover;
}
.person-text{
  flex:1 1 260px;
  font-size:0.96rem;
  color:#111827;
}
.person-thanks-section{
  max-width:1080px;
  margin:16px auto 0;
  padding:0 16px;
}

@media (max-width:768px){
  .person-card{
    flex-direction:column;
    align-items:flex-start;
  }
  .person-photo-wrap{
    width:100%;
    max-width:none;
  }
}


.hero-subtitle{
  margin:0 0 8px;
  font-size:1.02rem;
  font-weight:600;
  color:#1f2933;
}