@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}
*{box-sizing:border-box}
a{color:inherit;text-decoration:none}
/* =====================================================================
   Sayt dizayni (V4): ochiq fon, ko‘k/yashil urg‘u, kartalar, raqamlarga tayangan ko‘rinish.
   Barcha qoidalar .sm ichida va "sm-" prefiksi bilan: admin panel va eski app/globals.css ga tegmaydi.
   Eslatma: globals.css dagi h1, nav, footer kabi element qoidalari bu yerda ataylab qayta yozilgan.
   ===================================================================== */

body:has(.sm) { background: #fff; }

.sm {
  --sm-ink: #0e1726;
  --sm-text: #26324a;
  --sm-muted: #58637a;
  --sm-line: #e3e8f0;
  --sm-surface: #f5f7fb;
  --sm-tint: #eaf0ff;
  --sm-blue: #1d5cff;
  --sm-blue-2: #1546c8;
  --sm-teal: #0f9f9a;
  --sm-green: #16a34a;
  --sm-radius: 16px;
  --sm-shadow: 0 1px 2px rgba(14, 23, 38, 0.05), 0 14px 34px rgba(14, 23, 38, 0.08);
  min-height: 100vh;
  background: #fff;
  color: var(--sm-text);
  font-family: Inter, "Segoe UI", Roboto, system-ui, -apple-system, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
.sm *, .sm *::before, .sm *::after { box-sizing: border-box; }
.sm [id] { scroll-margin-top: 88px; }

/* Bazaviy tiklash: :where() nol o‘ziga xoslik beradi, shuning uchun komponent qoidalari doim ustun. */
:where(.sm) :is(h1, h2, h3, h4, p, ul, ol, dl, dd, figure) { margin: 0; }
:where(.sm) :is(ul, ol) { padding: 0; list-style: none; }
:where(.sm) :is(h1, h2, h3, h4) { color: var(--sm-ink); font-weight: 700; letter-spacing: -0.02em; line-height: 1.15; }

/* globals.css dagi h1 qoidasini bekor qiladi */
.sm h1 {
  margin: 0 0 20px;
  font-size: clamp(34px, 4.9vw, 58px);
  line-height: 1.07;
  letter-spacing: -0.035em;
  font-weight: 800;
  color: var(--sm-ink);
}
.sm-accent { color: var(--sm-blue); }
/* Rus so‘zlari uzunroq: sarlavha bir oz kichikroq, qatorlar soni kamroq bo‘ladi */
.sm[lang="ru"] h1 { font-size: clamp(30px, 4.1vw, 50px); letter-spacing: -0.03em; }
.sm[lang="ru"] .sm-article-page h1 { font-size: clamp(30px, 4.2vw, 46px); }

.sm-wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* ---------- Tugmalar va havolalar ---------- */
.sm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 22px;
  border: 1px solid var(--sm-blue); border-radius: 12px;
  background: var(--sm-blue); color: #fff;
  font: inherit; font-size: 15px; font-weight: 600; line-height: 1; text-align: center; cursor: pointer;
  box-shadow: 0 6px 16px rgba(29, 92, 255, 0.22);
  transition: background 0.15s, border-color 0.15s, transform 0.15s;
}
.sm-btn:hover { background: var(--sm-blue-2); border-color: var(--sm-blue-2); transform: translateY(-1px); }
.sm-btn:focus-visible, .sm-link:focus-visible, .sm-nav a:focus-visible, .sm-lang a:focus-visible, .sm-menu-btn:focus-visible,
.sm-faq-item summary:focus-visible { outline: 3px solid rgba(29, 92, 255, 0.4); outline-offset: 2px; }
.sm-btn:disabled { opacity: 0.6; cursor: wait; transform: none; }
.sm-btn-ghost { background: #fff; color: var(--sm-ink); border-color: var(--sm-line); box-shadow: none; }
.sm-btn-ghost:hover { background: var(--sm-surface); border-color: #cdd5e3; }
.sm-btn-sm { min-height: 40px; padding: 0 16px; font-size: 14px; border-radius: 10px; box-shadow: none; }
.sm-arrow { flex: 0 0 auto; }
.sm-link { display: inline-flex; align-items: center; gap: 6px; color: var(--sm-blue); font-weight: 600; font-size: 15px; }
.sm-link:hover { color: var(--sm-blue-2); text-decoration: underline; text-underline-offset: 3px; }
.sm-back { display: block; width: fit-content; margin-bottom: 22px; color: var(--sm-muted); font-size: 14px; font-weight: 600; }
.sm-back:hover { color: var(--sm-blue); }

/* ---------- Header ---------- */
.sm-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, 0.9); backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--sm-line);
}
.sm-header-in { display: flex; align-items: center; gap: 24px; min-height: 68px; }
.sm-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--sm-ink); font-size: 19px; font-weight: 800; letter-spacing: -0.02em; }
.sm-logo em { font-style: normal; color: var(--sm-blue); }
.sm-logo-mark { display: inline-flex; align-items: flex-end; gap: 3px; height: 20px; }
.sm-logo-mark b { display: block; width: 5px; border-radius: 2px; background: var(--sm-ink); }
.sm-logo-mark b:nth-child(1) { height: 10px; }
.sm-logo-mark b:nth-child(2) { height: 20px; background: var(--sm-blue); }
.sm-logo-mark b:nth-child(3) { height: 14px; background: var(--sm-teal); }
.sm-logo-light { color: #fff; }
.sm-logo-light .sm-logo-mark b:nth-child(1) { background: #fff; }
.sm-logo-light em { color: #7fa2ff; }

/* globals.css dagi nav qoidasini bekor qilish uchun barcha xususiyatlar aniq yozilgan */
.sm-nav { display: flex; align-items: center; gap: 26px; margin-left: 20px; font-size: 14px; font-weight: 500; color: var(--sm-text); }
.sm-nav a:hover { color: var(--sm-blue); }
.sm-header-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; }

.sm-lang { display: inline-flex; overflow: hidden; border: 1px solid var(--sm-line); border-radius: 10px; font-size: 13px; font-weight: 700; }
.sm-lang a, .sm-lang span { display: inline-block; padding: 8px 11px; line-height: 1; }
.sm-lang span { background: var(--sm-ink); color: #fff; }
.sm-lang a { color: var(--sm-muted); }
.sm-lang a:hover { background: var(--sm-surface); color: var(--sm-ink); }

.sm-menu { display: none; position: relative; }
.sm-menu-btn { display: inline-grid; place-items: center; width: 42px; height: 40px; padding: 0; border: 1px solid var(--sm-line); border-radius: 10px; background: #fff; cursor: pointer; }
.sm-burger { display: grid; gap: 4px; width: 18px; }
.sm-burger i { display: block; height: 2px; border-radius: 2px; background: var(--sm-ink); transition: transform 0.15s, opacity 0.15s; }
.sm-burger-open i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.sm-burger-open i:nth-child(2) { opacity: 0; }
.sm-burger-open i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.sm-menu-panel {
  position: absolute; top: calc(100% + 10px); right: 0; z-index: 60; display: grid; gap: 4px; width: min(280px, calc(100vw - 32px)); padding: 12px;
  border: 1px solid var(--sm-line); border-radius: 14px; background: #fff; box-shadow: var(--sm-shadow);
}
.sm-menu-panel a:not(.sm-btn) { padding: 12px; border-radius: 10px; color: var(--sm-ink); font-weight: 600; }
.sm-menu-panel a:not(.sm-btn):hover { background: var(--sm-surface); }
.sm-menu-panel .sm-btn { margin-top: 6px; }

/* ---------- Hero ---------- */
.sm-hero {
  padding: 72px 0 68px;
  background: radial-gradient(900px 420px at 88% -12%, #e3ecff 0%, rgba(227, 236, 255, 0) 70%), #fff;
  border-bottom: 1px solid var(--sm-line);
}
.sm-hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 56px; align-items: center; }
.sm-chip {
  display: inline-flex; align-items: center; gap: 8px; margin: 0 0 20px; padding: 6px 13px;
  border: 1px solid var(--sm-line); border-radius: 999px; background: #fff; color: var(--sm-muted); font-size: 13px; font-weight: 600; line-height: 1.3;
}
.sm-dot { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--sm-green); box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.15); }
.sm-lead { max-width: 580px; margin: 0 0 24px; font-size: 18px; line-height: 1.55; color: var(--sm-muted); }
.sm-checks { display: grid; gap: 12px; margin: 0 0 32px; }
.sm-checks li { display: flex; align-items: flex-start; gap: 12px; color: var(--sm-ink); font-weight: 500; }
.sm-check { display: grid; flex: 0 0 22px; place-items: center; width: 22px; height: 22px; margin-top: 1px; border-radius: 50%; background: rgba(22, 163, 74, 0.13); color: var(--sm-green); }
.sm-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.sm-proof { padding: 24px; border: 1px solid var(--sm-line); border-radius: 20px; background: #fff; box-shadow: var(--sm-shadow); }
.sm-proof-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--sm-ink); font-size: 15px; font-weight: 700; }
.sm-proof-head em { padding: 4px 10px; border-radius: 999px; background: var(--sm-tint); color: var(--sm-blue); font-size: 12px; font-style: normal; font-weight: 700; }
.sm-stat { display: flex; flex-direction: column; gap: 2px; padding: 16px 0; border-bottom: 1px solid var(--sm-line); }
.sm-stat strong { color: var(--sm-ink); font-size: clamp(28px, 3.3vw, 40px); line-height: 1.05; letter-spacing: -0.03em; font-weight: 800; }
.sm-stat-hl strong { color: var(--sm-blue); }
.sm-stat span { color: var(--sm-muted); font-size: 14px; line-height: 1.4; }
.sm-proof-note { margin: 14px 0 12px; color: var(--sm-muted); font-size: 12.5px; line-height: 1.5; }

/* ---------- Bo‘limlar ---------- */
.sm-section { padding: 88px 0; }
.sm-band { background: var(--sm-surface); border-top: 1px solid var(--sm-line); border-bottom: 1px solid var(--sm-line); }
.sm-head { max-width: 760px; margin-bottom: 44px; }
.sm-eyebrow { display: inline-block; margin-bottom: 12px; color: var(--sm-blue); font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.sm-eyebrow-light { color: #b9ccff; }
.sm-h2 { font-size: clamp(27px, 3.4vw, 40px); line-height: 1.13; letter-spacing: -0.03em; font-weight: 800; }
.sm-h2-sm { font-size: clamp(24px, 2.6vw, 30px); }
.sm-intro { margin-top: 14px; max-width: 640px; color: var(--sm-muted); font-size: 17px; line-height: 1.6; }
.sm-grid { display: grid; gap: 20px; }
.sm-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sm-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.sm-card { padding: 28px; border: 1px solid var(--sm-line); border-radius: var(--sm-radius); background: #fff; box-shadow: 0 1px 2px rgba(14, 23, 38, 0.03); }
.sm-card h3 { margin-bottom: 8px; font-size: 19px; line-height: 1.25; }
.sm-card-tight { padding: 22px; }
.sm-card-tight h3 { font-size: 17px; }
.sm-text { color: var(--sm-muted); font-size: 15.5px; line-height: 1.6; }
.sm-num { display: inline-grid; place-items: center; min-width: 36px; height: 36px; margin-bottom: 16px; padding: 0 8px; border-radius: 10px; background: var(--sm-tint); color: var(--sm-blue); font-size: 15px; font-weight: 800; }
.sm-tag { display: inline-block; margin-bottom: 12px; color: var(--sm-blue); font-size: 12.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.sm-note { margin: 12px 0 20px; color: var(--sm-muted); font-size: 13px; line-height: 1.5; }

/* Yechim: 3 bosqich */
.sm-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; counter-reset: none; }
.sm-step { position: relative; }
.sm-step-n { display: block; margin-bottom: 14px; color: var(--sm-blue); font-size: 14px; font-weight: 800; letter-spacing: 0.08em; }

/* Natijalar */
.sm-feature { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 40px; align-items: center; padding: 36px; border-radius: 20px; box-shadow: var(--sm-shadow); }
.sm-feature-copy h3 { font-size: 28px; margin-bottom: 10px; }
.sm-feature-stats .sm-stat:last-child { border-bottom: 0; }
.sm-cases { margin-top: 20px; }
.sm-case { display: flex; flex-direction: column; gap: 4px; }
.sm-case .sm-tag { margin-bottom: 8px; min-height: 3.2em; }
.sm-case strong { color: var(--sm-ink); font-size: 40px; line-height: 1.05; letter-spacing: -0.03em; font-weight: 800; }
.sm-case-label { color: var(--sm-text); font-size: 15px; font-weight: 500; line-height: 1.4; }
.sm-case-note { margin: 6px 0 14px; color: var(--sm-muted); font-size: 13px; }
.sm-case h3 { margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--sm-line); font-size: 16px; }
.sm-shots-block { margin-top: 44px; }
.sm-subhead { margin-bottom: 16px; font-size: 20px; }
.sm-shots { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin-top: 24px; }
.sm-shots figure { margin: 0; }
.sm-shots img { display: block; width: 100%; height: auto; border: 1px solid var(--sm-line); border-radius: 12px; box-shadow: var(--sm-shadow); }
.sm-shots figcaption { margin-top: 8px; color: var(--sm-muted); font-size: 13px; }
.sm-disclaimer { margin-top: 28px; color: var(--sm-muted); font-size: 13px; line-height: 1.5; }

/* Men haqimda */
.sm-about { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 56px; align-items: center; }
.sm-industries h3 { margin-bottom: 16px; font-size: 17px; }
.sm-industries ul { display: flex; flex-wrap: wrap; gap: 10px; }
.sm-industries li { padding: 8px 14px; border: 1px solid var(--sm-line); border-radius: 999px; background: var(--sm-surface); color: var(--sm-ink); font-size: 14px; font-weight: 600; }

/* Tajriba (Men haqimda ichida) */
.sm-xp { margin-top: 64px; }
.sm-xp .sm-subhead { margin-bottom: 20px; font-size: clamp(22px, 2.4vw, 28px); letter-spacing: -0.02em; }
.sm-xp-card { display: flex; flex-direction: column; }
.sm-xp-card h4 { margin: 0 0 8px; color: var(--sm-ink); font-size: 21px; line-height: 1.2; letter-spacing: -0.02em; font-weight: 800; }
.sm-xp-block { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--sm-line); }
.sm-xp-label { display: block; margin-bottom: 10px; color: var(--sm-muted); font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.sm-xp-projects { display: grid; gap: 12px; }
.sm-xp-projects li { display: grid; gap: 2px; color: var(--sm-muted); font-size: 14.5px; line-height: 1.5; }
.sm-xp-projects strong { color: var(--sm-ink); font-size: 15.5px; font-weight: 700; }
.sm-xp-works { display: flex; flex-wrap: wrap; gap: 8px; }
.sm-xp-works li { padding: 6px 12px; border-radius: 999px; background: var(--sm-tint); color: var(--sm-blue-2); font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.sm-xp-link { margin-top: 0; padding-top: 18px; }

/* Xizmatlar */
.sm-service { display: flex; flex-direction: column; }
.sm-service .sm-num { align-self: flex-start; }
.sm-points { display: grid; gap: 10px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--sm-line); }
.sm-points li { display: flex; align-items: flex-start; gap: 10px; color: var(--sm-ink); font-size: 14.5px; font-weight: 500; line-height: 1.45; }
.sm-callout { margin-top: 24px; padding: 18px 22px; border: 1px solid #cddcff; border-radius: 14px; background: var(--sm-tint); color: var(--sm-ink); font-size: 15px; font-weight: 500; }

/* Jarayon */
.sm-process { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 64px; align-items: start; }
.sm-process-side { position: sticky; top: 100px; }
.sm-process-side .sm-btn { margin-top: 26px; }
.sm-timeline { display: grid; gap: 14px; }
.sm-timeline li { display: flex; gap: 18px; padding: 20px 22px; border: 1px solid var(--sm-line); border-radius: var(--sm-radius); background: #fff; }
.sm-timeline-n { display: grid; flex: 0 0 36px; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--sm-blue); color: #fff; font-size: 15px; font-weight: 800; }
.sm-timeline h3 { margin-bottom: 4px; font-size: 18px; }

/* Maqolalar */
.sm-article { display: flex; flex-direction: column; color: inherit; transition: transform 0.15s, box-shadow 0.15s; }
.sm-article:hover { transform: translateY(-2px); box-shadow: var(--sm-shadow); }
.sm-article h3 { font-size: 20px; }
.sm-more { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 16px; color: var(--sm-blue); font-size: 14px; font-weight: 700; }

/* FAQ */
.sm-faq-wrap { max-width: 900px; }
.sm-faq { display: grid; gap: 12px; }
.sm-faq-item { border: 1px solid var(--sm-line); border-radius: 14px; background: #fff; }
.sm-faq-item summary {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 22px; cursor: pointer; list-style: none;
  color: var(--sm-ink); font-size: 17px; font-weight: 700; line-height: 1.35;
}
.sm-faq-item summary::-webkit-details-marker { display: none; }
.sm-faq-item summary::after { content: "+"; flex: 0 0 auto; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--sm-tint); color: var(--sm-blue); font-size: 20px; font-weight: 500; line-height: 1; }
.sm-faq-item[open] summary::after { content: "−"; }
.sm-faq-item .sm-text { padding: 0 22px 22px; }

/* Aloqa */
.sm-contact { background: var(--sm-tint); border-top: 1px solid #d5e1ff; }
.sm-contact-grid { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 56px; align-items: start; }
.sm-contact-copy .sm-link { margin-top: 24px; }
.sm-form-card { padding: 32px; border-radius: 20px; box-shadow: var(--sm-shadow); }

/* ---------- Forma ---------- */
.sm-form { display: grid; gap: 18px; }
.sm-field { display: grid; gap: 7px; color: var(--sm-ink); font-size: 14px; font-weight: 600; }
.sm-optional { color: var(--sm-muted); font-weight: 500; }
.sm-field input, .sm-field select, .sm-field textarea {
  width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid #cfd7e4; border-radius: 10px; background: #fff; color: var(--sm-ink);
  font: inherit; font-size: 15px; font-weight: 400;
}
.sm-field textarea { resize: vertical; line-height: 1.5; }
.sm-field select {
  appearance: none; padding-right: 42px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2358637a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center;
}
.sm-field input::placeholder, .sm-field textarea::placeholder { color: #8a94a8; }
.sm-field input:focus-visible, .sm-field select:focus-visible, .sm-field textarea:focus-visible { outline: 3px solid rgba(29, 92, 255, 0.25); border-color: var(--sm-blue); }
.sm-field [aria-invalid="true"] { border-color: #d92d20; }
.sm-error { color: #d92d20; font-size: 13px; font-style: normal; font-weight: 500; }
.sm-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sm-submit { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; }
.sm-form-note { flex: 1 1 200px; color: var(--sm-muted); font-size: 12.5px; line-height: 1.45; }
.sm-alert { padding: 12px 14px; border: 1px solid #f5c2c0; border-radius: 10px; background: #fff4f3; color: #b42318; font-size: 14px; line-height: 1.5; }
.sm-alert a { font-weight: 700; text-decoration: underline; }
.sm-success h3 { margin: 6px 0 10px; font-size: 26px; }
.sm-success > p { color: var(--sm-muted); font-size: 15.5px; }
.sm-success-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 20px; }

/* ---------- Maqola sahifasi ---------- */
.sm-article-page { padding: 56px 0 88px; }
.sm-article-wrap { max-width: 800px; }
.sm-article-cat { display: block; margin-bottom: 14px; }
.sm-article-page h1 { font-size: clamp(32px, 4.6vw, 52px); line-height: 1.1; }
.sm-article-meta { margin-bottom: 28px; color: var(--sm-muted); font-size: 14px; font-weight: 600; }
.sm-article-image { display: block; width: 100%; max-height: 460px; margin: 0 0 30px; border: 1px solid var(--sm-line); border-radius: var(--sm-radius); object-fit: cover; }
.sm-article-lead { margin-bottom: 30px; color: var(--sm-ink); font-size: 21px; font-weight: 500; line-height: 1.5; }
.sm-article-body { display: grid; gap: 22px; color: var(--sm-text); font-size: 18px; line-height: 1.75; }
.sm-article-cta { display: grid; justify-items: start; gap: 12px; margin-top: 56px; padding: 32px; border: 1px solid #cddcff; border-radius: 20px; background: var(--sm-tint); }
.sm-article-cta h2 { font-size: 24px; }
.sm-article-cta p { color: var(--sm-muted); }

/* ---------- Xizmat sahifalari (SEO): xizmatlar sahifasi va har bir xizmatning sahifasi ---------- */
.sm-crumbs { margin: 0 0 26px; }
.sm-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; color: var(--sm-muted); font-size: 14px; font-weight: 500; }
.sm-crumbs li { display: inline-flex; align-items: center; gap: 10px; }
.sm-crumbs li + li::before { content: "/"; color: #b3bccd; }
.sm-crumbs a { color: var(--sm-muted); }
.sm-crumbs a:hover { color: var(--sm-blue); text-decoration: underline; text-underline-offset: 3px; }
.sm-crumbs [aria-current="page"] { color: var(--sm-ink); font-weight: 600; }

.sm-svc-hero { padding-top: 40px; }
.sm-svc-hero h1 { font-size: clamp(32px, 4.3vw, 52px); }
.sm[lang="ru"] .sm-svc-hero h1 { font-size: clamp(28px, 3.7vw, 44px); }
.sm-svc-aside .sm-points { margin-top: 16px; }
.sm-svc-aside .sm-points li { font-size: 15px; }
.sm-svc-quick ul { margin-top: 6px; }
.sm-svc-quick li { border-bottom: 1px solid var(--sm-line); }
.sm-svc-quick li:last-child { border-bottom: 0; }
.sm-svc-quick a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 0; color: var(--sm-ink); font-size: 16px; font-weight: 600; }
.sm-svc-quick a:hover { color: var(--sm-blue); }

.sm-svc-answer { padding: 72px 0; }
.sm-svc-answer-in { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 56px; align-items: start; }
.sm-svc-answer-text { color: var(--sm-text); font-size: 18px; line-height: 1.7; }
.sm-svc-tools { margin-top: 28px; }
.sm-svc-tools .sm-xp-label { margin-bottom: 12px; }
.sm-svc-xp { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 56px; align-items: start; padding: 40px; border-radius: 20px; box-shadow: var(--sm-shadow); }
.sm-svc-xp .sm-link { margin-top: 20px; }
.sm-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sm-svc-all { margin-top: 28px; }

/* Xizmat kartalari: 3 + 2 tartibda (5 ta karta) */
.sm-svc-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; }
.sm-svc-grid > * { grid-column: span 2; }
.sm-svc-grid > *:nth-child(n + 4) { grid-column: span 3; }
.sm-service-link { position: relative; transition: transform 0.15s, box-shadow 0.15s; }
.sm-service-link:hover { transform: translateY(-2px); box-shadow: var(--sm-shadow); }
.sm-service-link h3 a::after { content: ""; position: absolute; inset: 0; border-radius: var(--sm-radius); }
.sm-service-link h3 a:hover { color: var(--sm-blue); }
.sm-service-link h3 a:focus-visible { outline: none; }
.sm-service-link h3 a:focus-visible::after { outline: 3px solid rgba(29, 92, 255, 0.4); outline-offset: 2px; }
.sm-service-link .sm-points { margin-bottom: 4px; }
.sm-choose .sm-link { margin-top: 14px; }

.sm-svc-cta { padding: 72px 0; background: var(--sm-tint); border-top: 1px solid #d5e1ff; }
.sm-svc-cta-in { display: flex; align-items: center; justify-content: space-between; gap: 28px 48px; }
.sm-svc-cta-in .sm-intro { max-width: 640px; }
.sm-svc-cta-in .sm-btn { flex: 0 0 auto; }

/* ---------- Footer (globals.css dagi footer qoidalari bekor qilingan) ---------- */
.sm-footer { display: block; padding: 0; background: var(--sm-ink); color: #c7d0e0; border-top: 0; font-size: 14px; }
.sm-footer-in { display: grid; grid-template-columns: 1.2fr 1fr auto; gap: 32px; align-items: center; padding-top: 44px; padding-bottom: 44px; }
.sm-footer-brand { display: grid; gap: 10px; }
.sm-footer-tag { margin: 0; color: #9aa6bd; font-size: 14px; letter-spacing: 0; }
.sm-footer-nav { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-left: 0; font-size: 14px; font-weight: 500; }
.sm-footer-nav a { color: #dbe3f2; }
.sm-footer-nav a:hover { color: #fff; }
.sm-footer-meta { display: grid; justify-items: end; gap: 12px; }
.sm-footer-meta .sm-lang { border-color: #34405a; }
.sm-footer-meta .sm-lang span { background: #fff; color: var(--sm-ink); }
.sm-footer-meta .sm-lang a { color: #b7c2d9; }
.sm-footer-meta .sm-lang a:hover { background: #1b2840; color: #fff; }
.sm-footer-copy { margin: 0; color: #8996b0; font-size: 13px; letter-spacing: 0; }
.sm-footer-services { padding-bottom: 36px; }
.sm-footer-services nav { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; padding-top: 24px; border-top: 1px solid #22304a; font-size: 14px; font-weight: 500; }
.sm-footer-services span { color: #8996b0; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.sm-footer-services a { color: #dbe3f2; }
.sm-footer-services a:hover { color: #fff; }

/* ---------- Moslashuvchanlik ---------- */
@media (max-width: 1040px) {
  .sm-nav { display: none; }
  .sm-menu { display: block; }
  .sm-hero-grid, .sm-about, .sm-contact-grid, .sm-feature { grid-template-columns: 1fr; gap: 36px; }
  .sm-process { grid-template-columns: 1fr; gap: 36px; }
  .sm-process-side { position: static; }
  .sm-grid-3, .sm-grid-4, .sm-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sm-svc-answer-in, .sm-svc-xp { grid-template-columns: 1fr; gap: 20px; }
  .sm-svc-grid > *, .sm-svc-grid > *:nth-child(n + 4) { grid-column: span 3; }
  .sm-svc-grid > *:last-child:nth-child(odd) { grid-column: span 6; }
  .sm-case .sm-tag { min-height: 0; }
  .sm-footer-in { grid-template-columns: 1fr; gap: 24px; }
  .sm-footer-meta { justify-items: start; }
}

@media (max-width: 720px) {
  .sm-wrap { padding: 0 16px; }
  .sm-hero { padding: 44px 0 48px; }
  .sm-section { padding: 56px 0; }
  .sm-head { margin-bottom: 30px; }
  .sm-grid-2, .sm-grid-3, .sm-grid-4, .sm-steps { grid-template-columns: 1fr; }
  .sm-svc-grid { grid-template-columns: 1fr; }
  .sm-svc-grid > *, .sm-svc-grid > *:nth-child(n + 4), .sm-svc-grid > *:last-child:nth-child(odd) { grid-column: auto; }
  .sm-svc-hero { padding-top: 28px; }
  .sm-svc-answer, .sm-svc-cta { padding: 48px 0; }
  .sm-svc-xp { padding: 24px; }
  .sm-svc-cta-in { flex-direction: column; align-items: flex-start; }
  .sm-svc-cta-in .sm-btn { width: 100%; }
  .sm-crumbs { margin-bottom: 20px; }
  .sm-card { padding: 22px; }
  .sm-feature { padding: 24px; }
  .sm-form-card { padding: 22px; }
  .sm-header-in { gap: 12px; min-height: 60px; }
  .sm-header-cta { display: none; }
  .sm-lead { font-size: 17px; }
  .sm-case .sm-tag { min-height: 0; }
  .sm-actions .sm-btn { width: 100%; }
  .sm-article-page { padding: 36px 0 64px; }
  .sm-article-lead { font-size: 19px; }
  .sm-article-body { font-size: 17px; }
  .sm-article-cta { padding: 24px; }
  .sm-faq-item summary { padding: 16px 18px; font-size: 16px; }
  .sm-faq-item .sm-text { padding: 0 18px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .sm *, .sm *::before, .sm *::after { transition: none !important; scroll-behavior: auto !important; }
}

/* ---- Statik sayt qo‘shimchalari ---- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .sm *, .sm *::before, .sm *::after { transition: none !important; } }
.sm-nf { display: grid; place-content: center; justify-items: center; gap: 14px; min-height: 100vh; padding: 48px 24px; text-align: center; }
.sm-nf .sm-actions { justify-content: center; }