/* ════════════════════════════════════════════════════════════════════
   site.css — shared shell for acs-data.com (EN + HY)
   Tokens, reset, header, language switch, buttons, layout, footer,
   "calm" treatment base, and scroll-reveal base.
   Armenian font stacks kick in automatically via html[lang="hy"].
   ════════════════════════════════════════════════════════════════════ */

:root{
  /* ─ ink / surface (Excel-green direction "D") ─ */
  --ink:#0f1d18; --ink-soft:#3f514a; --ink-dim:#7e8f86;
  --navy:#0b2a1d; --navy-soft:#143b29;
  --paper:#f3f6f4; --paper-card:#ffffff; --paper-soft:#e7eee9; --paper-deep:#d9e3dc;
  --rule:#d6e0da; --rule-soft:#e6ece8;
  /* ─ accent: Excel green ─ */
  --rust:#107C41; --rust-hover:#0c5f31;
  --electric:#21A366; --bluez:#009BF7; --bluez-soft:#e6f4ff;
  --ok:#107C41; --ok-soft:#e2efe7; --err:#b23b2e; --err-soft:#f3e0dc;
  /* ─ type ─ */
  --sans:"IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --serif:"Newsreader",Georgia,serif;
  --mono:"IBM Plex Mono","Courier New",ui-monospace,monospace;
  /* ─ radii / borders ─ */
  --r-sm:3px; --r-md:4px; --r-lg:6px;
  --b-1:1px solid var(--rule); --b-soft:1px solid var(--rule-soft);
}

/* Armenian: Latin & numbers stay in Plex Mono, Armenian falls to Noto */
html[lang="hy"]{
  --sans:"Noto Sans Armenian","IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --serif:"Noto Serif Armenian","Newsreader",Georgia,serif;
  --mono:"IBM Plex Mono","Noto Sans Armenian","Courier New",ui-monospace,monospace;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;text-rendering:optimizeLegibility}
a{color:var(--rust);text-decoration:none;border-bottom:1px solid rgba(16,124,65,.3);transition:border-color .12s}
a:hover{border-bottom-color:var(--rust)}
img{display:block;max-width:100%}

/* ─── Header ─────────────────────────────────────────────────────── */
.site-header{position:sticky;top:0;z-index:50;background:rgba(243,246,244,.92);backdrop-filter:blur(8px);border-bottom:var(--b-1)}
.site-header__inner{max-width:1180px;margin:0 auto;padding:14px 32px;display:flex;align-items:center;gap:32px}
.site-header__mark{display:flex;align-items:center;border:0;flex-shrink:0}
.site-header__mark img{height:26px;width:auto;display:block}
.site-header__nav{display:flex;gap:24px;flex:1}
.site-header__nav a{font-family:var(--sans);font-size:14px;color:var(--ink-soft);font-weight:500;border:0;padding:6px 0;white-space:nowrap}
.site-header__nav a:hover{color:var(--ink)}
.site-header__nav a.active{color:var(--ink)}
.site-header__nav a.active::after{content:"";display:block;height:2px;background:var(--rust);margin-top:8px;margin-bottom:-12px}
.site-header__actions{display:flex;gap:10px;align-items:center}
@media (max-width:760px){.site-header__inner{padding:12px 18px;gap:14px}.site-header__nav{display:none}}

/* language switch */
.lang-switch{display:inline-flex;align-items:center;border:var(--b-1);border-radius:var(--r-sm);overflow:hidden;font-family:"IBM Plex Mono","Noto Sans Armenian",ui-monospace,monospace;font-size:12px;line-height:1}
.lang-switch a{border:0;padding:7px 10px;color:var(--ink-dim);font-weight:500;letter-spacing:.03em}
.lang-switch a + a{border-left:var(--b-1)}
.lang-switch a:hover{color:var(--ink);background:var(--paper-soft)}
.lang-switch a.active{color:var(--paper);background:var(--ink)}

/* ─── Buttons ────────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--sans);font-size:13px;font-weight:500;border:1px solid transparent;border-radius:var(--r-sm);padding:10px 16px;cursor:pointer;text-decoration:none;border-bottom:1px solid transparent;transition:all .12s;white-space:nowrap}
.btn--primary{background:var(--rust);color:var(--paper);border-color:var(--rust)}
.btn--primary:hover{background:var(--rust-hover);border-color:var(--rust-hover);color:var(--paper)}
.btn--electric{background:var(--electric);color:#fff;border-color:var(--electric);font-weight:600}
.btn--electric:hover{background:#1c8a56;border-color:#1c8a56;color:#fff}
.btn--electric:disabled{opacity:.5;cursor:not-allowed}
.btn--outline{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--outline:hover{background:var(--ink);color:var(--paper)}
.btn--ghost{background:transparent;color:var(--ink-soft);border-color:transparent}
.btn--ghost:hover{background:var(--paper-soft);color:var(--ink)}
.btn--lg{padding:14px 22px;font-size:15.5px}
.btn--block{width:100%}
.btn .ic{width:14px;height:14px;flex-shrink:0}
.btn--lg .ic{width:16px;height:16px}

/* ─── Layout ─────────────────────────────────────────────────────── */
.wrap{max-width:1180px;margin:0 auto;padding:0 32px}
@media (max-width:760px){.wrap{padding:0 18px}}
.eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim);font-weight:500}
.sec-num{font-family:var(--mono);font-size:12px;color:var(--rust);letter-spacing:.06em}

/* ─── Footer ─────────────────────────────────────────────────────── */
.site-foot{background:var(--paper-soft);color:var(--ink);padding:56px 32px 28px;border-top:var(--b-1)}
.site-foot__inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px}
@media (max-width:760px){.site-foot__inner{grid-template-columns:1fr;gap:32px}}
.site-foot h5{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim);margin:0 0 12px}
.site-foot a{display:block;color:var(--ink-soft);font-size:13.5px;padding:4px 0;border:0}
.site-foot a:hover{color:var(--rust)}
.site-foot__brand .mark{display:flex;align-items:center}
.site-foot__brand .mark img{height:30px;width:auto;display:block}
.site-foot__brand p{color:var(--ink-soft);font-size:13.5px;margin:14px 0 0;max-width:360px;line-height:1.55}
.site-foot__bottom{max-width:1180px;margin:32px auto 0;padding-top:20px;border-top:var(--b-soft);display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;color:var(--ink-dim);letter-spacing:.04em;flex-wrap:wrap;gap:12px}

/* ─── Scroll-reveal base (opt-in via body[data-anim]) ────────────── */
@media (prefers-reduced-motion: no-preference){
  body[data-anim] [data-reveal]{opacity:0;transform:translateY(16px);
    transition:opacity .7s cubic-bezier(.4,0,.2,1),transform .7s cubic-bezier(.4,0,.2,1)}
  body[data-anim] [data-reveal].in{opacity:1;transform:none}
}
@media print{ [data-anim] *{opacity:1 !important;transform:none !important;animation:none !important} }
