/* Shared refinements for the five approved sadik.kz designs. */

html {
  scroll-behavior: smooth;
  text-size-adjust: 100%;
}

body {
  min-width: 320px;
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.container {
  width: 100%;
  max-width: none;
  margin-inline: auto;
  padding-inline: 96px;
}

.site-header,
.hero,
.stats,
.section,
.att-section,
.news-section,
.page-hero,
.footer {
  width: 100%;
}

.brand small { font-size: 12px; }
.brand strong { font-size: 20px; }
.main-nav a { font-size: 14px; }
.att-top, .feedback, .btn { font-size: 13px; }
.phone b { font-size: 13px; }
.phone small { font-size: 11px; }
.welcome, .eyebrow, .crumb { font-size: 12px; }

.hero h1 { font-size: clamp(46px, 3.35vw, 64px); }
.hero p {
  max-width: 610px;
  font-size: 16px;
  line-height: 1.7;
}

.stat small, .fact small { font-size: 12px; }
.stat b, .fact b { font-size: 14px; }
.stat .tiny, .fact p { font-size: 11px; line-height: 1.45; }

.about-copy h2, .director-copy h2 {
  font-size: clamp(28px, 2vw, 36px);
}
.about-copy > p, .director-copy > p {
  font-size: 15px;
  line-height: 1.72;
}
.value b { font-size: 13px; }
.value p { font-size: 12px; }

.att-box h2 { font-size: 26px; }
.att-box p { font-size: 14px; }
.director-name { font-size: 14px; }
.director-role { font-size: 12px; }

.section-title h2, .news-head h2 { font-size: 27px; }
.section-title a, .news-head a, .news-meta, .news-body a { font-size: 12px; }
.news-body h3 { font-size: 14px; line-height: 1.35; }
.news-body p { font-size: 12px; line-height: 1.5; }

.page-hero h1 { font-size: clamp(36px, 3vw, 52px); }
.page-hero p { font-size: 15px; }
.person h3, .doc h3, .ach-card h3, .ach h3, .filters h3 { font-size: 15px; }
.person p, .doc > p, .doc-list a, .filter-group b, .filter-check,
.ach-meta, .contact-row small { font-size: 12px; }
.contact-row b { font-size: 14px; }

.feedback-card label {
  display: grid;
  gap: 7px;
  margin-bottom: 13px;
  color: var(--ink, var(--ink));
  font-size: 13px;
  font-weight: 750;
}

.feedback-card input,
.feedback-card select,
.feedback-card textarea {
  width: 100%;
  min-height: 46px;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--line, #e1e6e8);
  border-radius: 9px;
  background: var(--white);
  color: var(--ink, var(--ink));
  font-size: 14px;
}

.feedback-card textarea {
  min-height: 150px;
  resize: vertical;
}

.contact-map {
  min-height: 230px;
  margin-top: 24px;
  padding: 32px;
  border: 1px solid var(--line, #e1e6e8);
  border-radius: 20px;
  background:
    linear-gradient(45deg, rgba(var(--shadow-rgb), .09) 25%, transparent 25% 75%, rgba(var(--shadow-rgb), .09) 75%),
    linear-gradient(45deg, rgba(var(--shadow-rgb), .09) 25%, var(--white) 25% 75%, rgba(var(--shadow-rgb), .09) 75%);
  background-position: 0 0, 22px 22px;
  background-size: 44px 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  text-align: left;
}

.contact-map > span {
  color: var(--secondary, #2f9b61);
  font-size: 46px;
}

.contact-map h2 { margin: 0 0 4px; font-size: 24px; }
.contact-map p { margin: 0; font-size: 14px; }

.footer h4, .footer-col h4 { font-size: 14px; }
.footer p, .footer a, .footer-col p, .footer-col a { font-size: 12px; }
.footer-brand small { font-size: 12px; }
.footer-brand strong { font-size: 21px; }
.footer-bottom, .footer-bottom-row { font-size: 11px; }

.burger, .btn, .feedback, .att-top, .main-nav a, .mobile-menu a,
.filter-check, input, select, textarea, button {
  touch-action: manipulation;
}

a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--secondary, #3aa96c) 55%, white);
  outline-offset: 3px;
}

/* The attestation pages use the earlier internal interface stylesheet. */
.top-strip, .nav-links a, .contact-line span, .field label,
.public-doc-card p, .public-doc-list a, .login-note, .inspector strong,
.inspector span, .meta-chip, .doc-row, .review-choice b,
.review-choice small, .audit-item {
  font-size: max(13px, 0.82rem);
}

.login-card input, .login-card select, .login-card textarea,
.workspace-shell input, .workspace-shell select, .workspace-shell textarea {
  min-height: 44px;
  font-size: 14px;
}

@media (min-width: 1680px) {
  .container { padding-inline: 200px; }
}

@media (max-width: 1280px) {
  .container { padding-inline: 64px; }
  .main-nav { gap: 18px; }
  .phone { display: none; }
}

@media (max-width: 1024px) {
  .container { padding-inline: 36px; }
  .hero-grid, .about-grid, .director-grid, .contact-grid {
    grid-template-columns: 1fr;
  }
  .about-img { min-height: 360px; }
  .director-photo { width: min(100%, 420px); }
  .stats-grid, .facts-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mobile-menu a { font-size: 14px; }
}

@media (max-width: 768px) {
  .container { padding-inline: 24px; }
  .hero-copy { padding-top: 40px; }
  .hero h1 { font-size: clamp(36px, 10vw, 46px); }
  .hero-art { min-height: 330px; }
  .stats-grid, .facts-grid, .team-grid, .docs-grid, .ach-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .att-box, .filter-inner { grid-template-columns: 1fr; }
  .att-box .btn { width: 100%; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .container { padding-inline: 18px; }
  .brand strong { font-size: 17px; }
  .brand small { font-size: 10px; }
  .hero h1 { font-size: 34px; }
  .hero p, .about-copy > p, .director-copy > p, .page-hero p {
    font-size: 14px;
  }
  .hero-art { min-height: 270px; }
  .stats-grid, .facts-grid, .team-grid, .docs-grid, .ach-grid, .news-grid,
  .values, .footer-grid { grid-template-columns: 1fr; }
  .news-card { grid-template-columns: 120px 1fr; }
  .news-card img { width: 120px; }
  .panel, .contact-info, .feedback-panel { padding: 20px; }
  .footer-bottom { flex-direction: column; gap: 8px; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}