/*
Theme Name: XGroup Theme
Theme URI: https://xgroup.am
Author: XGroup
Author URI: https://xgroup.am
Description: Professional corporate theme for XGroup Holdings — a diversified group of companies operating across multiple industries.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: Proprietary
Text Domain: xgroup-theme
*/

/* ================================================
   1. CSS Variables & Design Tokens
   ================================================ */
:root {
  /* Colors — XGroup Brand: Yellow #f5c200 on Deep Black */
  --clr-dark-900: #0a0907;
  --clr-dark-800: #121110;
  --clr-dark-700: #1a1816;
  --clr-dark-600: #22201c;
  --clr-dark-500: #2c2924;
  --clr-gold-500: #f5c200;
  --clr-gold-400: #f7cc30;
  --clr-gold-300: #fde47a;
  --clr-gold-600: #d4a800;
  --clr-white: #f7f4ef;
  --clr-gray-100: #f2efea;
  --clr-gray-200: #dcd8d1;
  --clr-gray-300: #bdb8b0;
  --clr-gray-400: #8e8880;
  --clr-gray-500: #9a948c;
  --clr-gray-600: #8f897f;

  /* Industry Colors */
  --clr-retail: #b4793a;
  --clr-poultry: #3e8f62;
  --clr-entertain: #7a5fa6;
  --clr-hotels: #3c8896;
  --clr-construction: #b2544a;

  /* Typography */
  /* Sans headings; Google Sans supplies the Armenian glyphs — its letters are
     geometric and straight (no calligraphic hooks), matching Montserrat */
  --font-display: 'Montserrat', 'Google Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Inter', 'Google Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Font Sizes */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --text-7xl: 4.5rem;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Borders & Radius */
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.2);
  --shadow: 0 6px 20px rgba(0,0,0,0.42);
  --shadow-lg: 0 14px 44px rgba(0,0,0,0.55);
  --shadow-xl: 0 26px 70px rgba(0,0,0,0.62);
  --shadow-gold: 0 8px 30px rgba(245,194,0,0.2);

  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition: 300ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Layout */
  --container-max: 1280px;
  --container-lg: 1100px;
  --container-md: 860px;
  --header-height: 80px;

  /* Glass */
  --glass-bg: rgba(255, 247, 232, 0.045);
  --glass-border: rgba(245, 194, 0, 0.18);
  --glass-hover-border: rgba(245, 194, 0, 0.55);
}

/* ================================================
   2. CSS Reset & Base
   ================================================ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

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

body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.7;
  color: var(--clr-gray-300);
  background-color: var(--clr-dark-800);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition-fast);
}

img, video {
  max-width: 100%;
  height: auto;
  display: block;
}

ul, ol { list-style: none; }

input, textarea, select, button {
  font-family: inherit;
  font-size: inherit;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.2;
  color: var(--clr-white);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  overflow-wrap: break-word;
}

p { margin-bottom: 1em; }
p:last-child { margin-bottom: 0; }

::selection {
  background-color: var(--clr-gold-500);
  color: var(--clr-dark-900);
}

/* ================================================
   3. Layout
   ================================================ */

.founder-grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 4rem;
  align-items: flex-start;
}

/* The message is long — keep the portrait in view instead of leaving
   an empty column beside it. */
.founder-photo {
  position: sticky;
  top: calc(var(--header-height) + var(--space-8));
}

@media (max-width: 900px) {
  .founder-grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }
  .founder-photo {
    position: static;
    max-width: 320px;
  }
}

/* Utilities */
.container {
  width: 100%;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--space-6);
}

.container--lg { max-width: var(--container-lg); }
.container--md { max-width: var(--container-md); }

.section {
  padding: var(--space-24) 0;
}

.section--dark {
  background-color: var(--clr-dark-900);
}

.section--darker {
  background-color: var(--clr-dark-700);
}

.section-header {
  text-align: center;
  margin-bottom: var(--space-16);
}

.section-label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--clr-gold-500);
  margin-bottom: var(--space-4);
}

.section-label::before,
.section-label::after {
  content: '';
  display: block;
  width: 24px;
  height: 1px;
  background-color: var(--clr-gold-500);
}

.section-title {
  font-size: clamp(var(--text-3xl), 4vw, var(--text-5xl));
  color: var(--clr-white);
  margin-bottom: var(--space-4);
}

.section-subtitle {
  font-size: var(--text-lg);
  color: var(--clr-gray-400);
  max-width: 600px;
  margin: 0 auto;
}

.grid {
  display: grid;
  gap: var(--space-6);
}

.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }
.grid--4 { grid-template-columns: repeat(4, 1fr); }
.grid--5 { grid-template-columns: repeat(5, 1fr); }

/* ================================================
   4. Buttons
   ================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 0.875rem 2rem;
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  border: 2px solid transparent;
  transition: all var(--transition);
  text-decoration: none;
  white-space: nowrap;
}

.btn--primary {
  background: linear-gradient(135deg, var(--clr-gold-500), var(--clr-gold-600));
  color: #14110c;
  border-color: transparent;
  font-weight: 700;
  box-shadow: 0 4px 20px rgba(245,194,0,0.3);
}

.btn--primary:hover {
  background: linear-gradient(135deg, var(--clr-gold-400), var(--clr-gold-500));
  transform: translateY(-2px);
  box-shadow: 0 8px 35px rgba(245,194,0,0.45);
  color: #14110c;
}

.btn--outline {
  background: transparent;
  color: var(--clr-white);
  border-color: rgba(255,255,255,0.3);
}

.btn--outline:hover {
  background: rgba(255,255,255,0.08);
  border-color: var(--clr-white);
  color: var(--clr-white);
  transform: translateY(-2px);
}

.btn--gold-outline {
  background: transparent;
  color: var(--clr-gold-500);
  border-color: var(--clr-gold-500);
  font-weight: 700;
}

.btn--gold-outline:hover {
  background: var(--clr-gold-500);
  color: #14110c;
  transform: translateY(-2px);
}

.btn--sm {
  padding: 0.625rem 1.25rem;
  font-size: var(--text-xs);
}

.btn--lg {
  padding: 1.125rem 2.5rem;
  font-size: var(--text-base);
}

/* ================================================
   5. Badges
   ================================================ */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.3rem 0.75rem;
  border-radius: var(--radius-full);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.badge--retail    { background: rgba(180,121,58,0.16);   color: #e0b072; }
.badge--poultry   { background: rgba(62,143,98,0.16);   color: #84c29b; }
.badge--entertainment { background: rgba(122,95,166,0.16); color: #b9a3dc; }
.badge--hotels    { background: rgba(60,136,150,0.16);   color: #7fbecb; }
.badge--construction { background: rgba(178,84,74,0.16); color: #e09a93; }

/* ================================================
   6. Site Header & Navigation
   ================================================ */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  height: var(--header-height);
  display: flex;
  align-items: center;
  transition: all var(--transition);
}

.site-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: all var(--transition);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
}

.site-header.scrolled::before {
  background: rgba(10, 10, 10, 0.94);
  border-bottom-color: rgba(245,194,0,0.15);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.site-header .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}

/* Site Logo */
.site-logo {
  display: flex;
  align-items: center;
  text-decoration: none;
  z-index: 100;
}

.site-logo__img {
  height: 48px;
  width: auto;
  display: block;
  transition: transform 0.2s ease;
}

.site-logo:hover .site-logo__img {
  transform: scale(1.02);
}

/* User Uploaded Custom Logo (WP) */
/* Logo sits directly on the dark header — the gold X and the silver
   highlights on the wordmark carry enough contrast on their own. */
.custom-logo-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  padding: 0;
  transition: transform 0.2s ease, opacity 0.2s ease;
  z-index: 100;
  text-decoration: none;
}

.custom-logo-link:hover {
  transform: translateY(-1px);
  opacity: 0.9;
}

.custom-logo-link img.custom-logo {
  height: 56px; /* Constrain height to fit header */
  max-height: 56px;
  width: auto;
  max-width: 100%;
  display: block;
  object-fit: contain;
}

/* Primary Nav */
.primary-nav {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.primary-nav a {
  padding: var(--space-2) var(--space-3);
  font-size: var(--text-sm);
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  border-radius: var(--radius-sm);
  transition: all var(--transition-fast);
  position: relative;
}

.primary-nav a::after {
  content: '';
  position: absolute;
  bottom: 2px;
  left: var(--space-3);
  right: var(--space-3);
  height: 1px;
  background: var(--clr-gold-500);
  transform: scaleX(0);
  transition: transform var(--transition-fast);
}

.primary-nav a:hover,
.primary-nav .current-menu-item > a,
.primary-nav .current_page_item > a {
  color: var(--clr-white);
}

.primary-nav a:hover::after,
.primary-nav .current-menu-item > a::after,
.primary-nav .current_page_item > a::after {
  transform: scaleX(1);
}

/* WP nav menu wrapper */
.primary-nav ul {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  list-style: none;
}

/* Header Right */
.header-right {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}

/* Every header block is centred against the full height of the bar */
.site-header .container {
  height: 100%;
}

.site-header .site-branding,
.site-header .primary-nav,
.site-header .header-right {
  display: flex;
  align-items: center;
  height: 100%;
}

/* Language Switcher */
.lang-switcher {
  display: flex;
  align-items: center;
  gap: 2px;
}

/* Polylang items live in a <ul> — kill list markers and default spacing */
.lang-switcher ul,
.lang-switcher ol,
.footer-lang-switcher ul,
.pll-parent-menu-item ul {
  display: flex;
  align-items: center;
  gap: 2px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.lang-switcher li,
.footer-lang-switcher li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lang-switcher li::marker,
.footer-lang-switcher li::marker {
  content: '';
}

.lang-switcher ul li a,
.lang-switcher a {
  display: flex;
  align-items: center;
  padding: 0.3rem 0.6rem;
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.62);
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  transition: all var(--transition-fast);
}

.lang-switcher ul li a:hover,
.lang-switcher a:hover {
  color: var(--clr-gold-400);
  border-color: rgba(245,194,0,0.3);
}

.lang-switcher ul li.current-lang a,
.lang-switcher a.active,
.lang-switcher a[aria-current] {
  color: var(--clr-gold-500);
  border-color: rgba(245,194,0,0.4);
  background: rgba(245,194,0,0.08);
}

/* Mobile Menu Toggle */
.mobile-menu-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

.mobile-menu-toggle span {
  display: block;
  width: 24px;
  height: 2px;
  background-color: var(--clr-white);
  border-radius: 2px;
  transition: all var(--transition-fast);
  transform-origin: center;
}

.mobile-menu-toggle.active span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.mobile-menu-toggle.active span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.mobile-menu-toggle.active span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Mobile Nav Overlay */
.mobile-nav {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: var(--clr-dark-900);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  transform: translateX(100%);
  transition: transform var(--transition-slow);
}

.mobile-nav.open {
  transform: translateX(0);
}

.mobile-nav ul {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  list-style: none;
  padding: 0;
  margin: 0;
}

.mobile-nav li {
  margin: 0;
  padding: 0;
}

.mobile-nav a {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  color: rgba(255,255,255,0.7);
  padding: var(--space-3) var(--space-6);
  transition: color var(--transition-fast);
}

.mobile-nav a:hover {
  color: var(--clr-gold-400);
}

.mobile-nav .mobile-lang-switcher {
  display: flex;
  gap: var(--space-3);
  margin-top: var(--space-8);
}

.mobile-nav .mobile-lang-switcher a {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* ================================================
   7. Hero Section
   ================================================ */
.site-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--clr-dark-900);
}

/* Animated background */
.hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

/* Uploaded background image */
.hero-bg__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Image-only hero: the banner sits below the fixed header, full width,
   in normal flow so the artwork is never cropped. */
.site-hero--image {
  display: block;
  width: 100%;
  min-height: 0;
  height: auto;
  overflow: visible;
  margin-top: var(--header-height);
  background: var(--clr-dark-900);
}

.site-hero--image .hero-bg {
  position: static;
}

.site-hero--image .hero-bg__img {
  position: static;
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

/* Header bar takes the warm tone of the banner's top edge (--header-tint is
   sampled from the image in functions.php) so the two read as one piece. */
.site-header::before,
.site-header.scrolled::before,
body.has-hero-banner .site-header::before {
  background:
    linear-gradient(180deg,
      rgba(var(--header-tint, 10,10,10), 0.99) 0%,
      rgba(var(--header-tint, 10,10,10), 0.92) 65%,
      rgba(var(--header-tint, 10,10,10), 0.86) 100%);
  border-bottom-color: rgba(245,194,0,0.28);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

/* Thin gold hairline where the bar meets the artwork */
.site-header::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(245,194,0,0.55) 20%, rgba(245,194,0,0.55) 80%, transparent);
}


.hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(100px);
  pointer-events: none;
}

.hero-orb--gold {
  width: 700px;
  height: 700px;
  background: radial-gradient(circle at center, rgba(245,194,0,0.13), transparent 70%);
  top: -150px;
  right: -200px;
  animation: orbFloat 22s ease-in-out infinite;
}

.hero-orb--blue {
  width: 500px;
  height: 500px;
  background: radial-gradient(circle at center, rgba(32,28,22,0.6), transparent 70%);
  bottom: 0px;
  left: -100px;
  animation: orbFloat 28s ease-in-out infinite reverse;
}

.hero-orb--teal {
  width: 350px;
  height: 350px;
  background: radial-gradient(circle at center, rgba(245,194,0,0.06), transparent 70%);
  top: 40%;
  left: 40%;
  animation: orbFloat 18s ease-in-out infinite 5s;
}

/* Grid pattern overlay */
.hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(245,194,0,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(245,194,0,0.05) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 30%, transparent 100%);
}

/* Hero content */
.hero-content {
  position: relative;
  z-index: 1;
  text-align: center;
  max-width: 900px;
  padding: var(--space-20) var(--space-6);
  margin-top: var(--header-height);
}

.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--clr-gold-500);
  margin-bottom: var(--space-6);
}

.hero-eyebrow .eyebrow-line {
  width: 32px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--clr-gold-500));
}

.hero-eyebrow .eyebrow-line--right {
  background: linear-gradient(90deg, var(--clr-gold-500), transparent);
}

.hero-title {
  font-size: clamp(var(--text-4xl), 7vw, var(--text-7xl));
  font-weight: 700;
  line-height: 1.08;
  color: var(--clr-white);
  margin-bottom: var(--space-6);
  letter-spacing: -0.02em;
}

.hero-title .accent {
  background: linear-gradient(135deg, var(--clr-gold-500) 0%, var(--clr-gold-400) 40%, #fdefb4 70%, var(--clr-gold-500) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-description {
  font-size: clamp(var(--text-base), 2vw, var(--text-xl));
  color: var(--clr-gray-400);
  max-width: 620px;
  margin: 0 auto var(--space-12);
  line-height: 1.75;
}

/* Stats */
.hero-stats {
  display: flex;
  justify-content: center;
  gap: var(--space-12);
  margin-bottom: var(--space-12);
  flex-wrap: wrap;
}

.hero-stat {
  text-align: center;
}

.hero-stat__number {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(var(--text-4xl), 5vw, var(--text-5xl));
  font-weight: 700;
  color: var(--clr-white);
  line-height: 1;
  margin-bottom: var(--space-2);
}

.hero-stat__number .count {
  color: var(--clr-gold-500);
}

.hero-stat__label {
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 500;
}

.hero-divider {
  width: 1px;
  height: 60px;
  background: rgba(255,255,255,0.1);
  align-self: center;
}

/* Hero CTA */
.hero-actions {
  display: flex;
  justify-content: center;
  gap: var(--space-4);
  flex-wrap: wrap;
}

/* Scroll indicator */
.hero-scroll {
  position: absolute;
  bottom: var(--space-8);
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  color: var(--clr-gray-500);
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
}

.hero-scroll__arrow {
  width: 20px;
  height: 30px;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: var(--radius-full);
  position: relative;
  overflow: hidden;
}

.hero-scroll__arrow::after {
  content: '';
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  width: 3px;
  height: 6px;
  background: var(--clr-gold-500);
  border-radius: var(--radius-full);
  animation: scrollBounce 2s ease-in-out infinite;
}

/* ================================================
   8. About Preview Section
   ================================================ */
.about-preview {
  padding: var(--space-24) 0;
  background: var(--clr-dark-800);
}

.about-preview .container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-16);
  align-items: center;
}

.about-preview__content .section-label {
  justify-content: flex-start;
}

.about-preview__content .section-label::before { display: none; }

.about-preview__title {
  font-size: clamp(var(--text-3xl), 4vw, var(--text-5xl));
  color: var(--clr-white);
  margin-bottom: var(--space-6);
  line-height: 1.15;
}

.about-preview__text {
  color: var(--clr-gray-400);
  font-size: var(--text-lg);
  margin-bottom: var(--space-8);
  line-height: 1.8;
}

.about-highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.about-highlight {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius);
}

.about-highlight__icon {
  width: 40px;
  height: 40px;
  background: linear-gradient(135deg, rgba(245,194,0,0.2), rgba(245,194,0,0.05));
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--clr-gold-500);
}

.about-highlight__text {
  font-size: var(--text-sm);
  color: var(--clr-gray-300);
  line-height: 1.5;
}

.about-highlight__text strong {
  display: block;
  color: var(--clr-white);
  font-weight: 600;
  margin-bottom: 2px;
}

.about-preview__visual {
  position: relative;
}

.about-card-stack {
  position: relative;
  height: 440px;
  /* room for the accent card hanging below the main one */
  margin-bottom: var(--space-8);
}

.about-card {
  position: absolute;
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-xl);
  padding: var(--space-8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.about-card--main {
  width: 85%;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  /* The country list stays in the upper part; the accent card hangs off the
     lower-left corner, well below it */
  justify-content: flex-start;
  padding-top: var(--space-10);
}

.about-card--accent {
  width: 48%;
  left: 0;
  top: auto;
  bottom: calc(-1 * var(--space-6));
  padding: var(--space-6) var(--space-8);
  background: linear-gradient(135deg, rgba(245,194,0,0.16), rgba(245,194,0,0.05));
  border-color: rgba(245,194,0,0.35);
  box-shadow: var(--shadow-lg);
}

.about-card__number {
  font-family: var(--font-display);
  font-size: var(--text-5xl);
  font-weight: 700;
  color: var(--clr-gold-500);
  line-height: 1;
  margin-bottom: var(--space-2);
  text-shadow: 0 0 30px rgba(245,194,0,0.4);
}

.about-card__label {
  font-size: var(--text-sm);
  color: var(--clr-gray-400);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.about-card__countries {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.about-card__country {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  font-size: var(--text-sm);
  color: var(--clr-gray-300);
  font-weight: 500;
}

.about-card__country .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--clr-gold-500);
  flex-shrink: 0;
}

/* ================================================
   9. Industries Section
   ================================================ */
.industries-section {
  padding: var(--space-24) 0;
  background: var(--clr-dark-900);
}

.industries-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-6);
}

.industries-grid > .industry-card {
  flex: 1 1 300px;
  max-width: 360px;
}

.industry-card {
  position: relative;
  padding: var(--space-8);
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  transition: all var(--transition);
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.industry-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  opacity: 0.6;
  transition: opacity var(--transition);
}

/* One accent across the section — the sector colours stay on company cards */
.industry-card::before {
  background: linear-gradient(90deg, rgba(245,194,0,0.25), var(--clr-gold-500), rgba(245,194,0,0.25));
}

.industry-card:hover {
  border-color: var(--glass-hover-border);
  transform: translateY(-6px);
  box-shadow: var(--shadow-gold);
  background: rgba(255,255,255,0.06);
}

.industry-card:hover::before {
  opacity: 1;
  height: 4px;
}

.industry-icon {
  width: 52px;
  height: 52px;
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.industry-card .industry-icon {
  background: linear-gradient(135deg, rgba(245,194,0,0.16), rgba(245,194,0,0.05));
  border: 1px solid rgba(245,194,0,0.22);
  color: var(--clr-gold-500);
}

.industry-card__name {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 600;
  color: var(--clr-white);
  line-height: 1.3;
  /* Long Armenian compounds must wrap instead of being clipped by the card */
  max-width: 100%;
  overflow-wrap: anywhere;
  hyphens: auto;
}

.industry-card__desc {
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  line-height: 1.6;
  flex: 1;
}

.industry-card__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--clr-gold-500);
  padding: var(--space-2) var(--space-4);
  border: 1px solid rgba(245,194,0,0.35);
  border-radius: var(--radius-full);
  transition: background var(--transition-fast), border-color var(--transition-fast);
}

.industry-card__cta svg {
  transition: transform var(--transition-fast);
}

.industry-card:hover .industry-card__cta {
  background: rgba(245,194,0,0.12);
  border-color: rgba(245,194,0,0.6);
}

.industry-card:hover .industry-card__cta svg {
  transform: translateX(3px);
}

/* ================================================
   10. Companies Section
   ================================================ */
.companies-section {
  padding: var(--space-24) 0;
  background: var(--clr-dark-800);
}

.companies-filter {
  display: flex;
  justify-content: center;
  gap: var(--space-3);
  margin-bottom: var(--space-12);
  flex-wrap: wrap;
}

.filter-btn {
  padding: 0.5rem 1.25rem;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius-full);
  background: transparent;
  color: var(--clr-gray-400);
  font-size: var(--text-sm);
  font-weight: 500;
  cursor: pointer;
  transition: all var(--transition-fast);
}

.filter-btn:hover,
.filter-btn.active {
  background: var(--clr-gold-500);
  border-color: var(--clr-gold-500);
  color: var(--clr-dark-900);
  font-weight: 600;
}

.companies-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-6);
}

.company-card {
  position: relative;
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all var(--transition);
  display: flex;
  flex-direction: column;
  text-decoration: none;
}

.company-card:hover {
  border-color: var(--glass-hover-border);
  transform: translateY(-4px);
  box-shadow: var(--shadow-gold);
}

.company-card__image {
  width: 100%;
  height: 200px;
  background: var(--clr-dark-600);
  overflow: hidden;
  position: relative;
}

.company-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slow);
}

.company-card:hover .company-card__image img {
  transform: scale(1.05);
}

.company-card__image-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: var(--text-4xl);
  font-weight: 700;
  color: rgba(255,255,255,0.1);
  letter-spacing: 0.05em;
}

.company-card__body {
  padding: var(--space-6);
  display: flex;
  flex-direction: column;
  flex: 1;
}


.company-card__name {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 600;
  color: var(--clr-white);
  margin-bottom: var(--space-3);
  line-height: 1.3;
}

.company-card__desc {
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  line-height: 1.7;
  flex: 1;
  margin-bottom: var(--space-4);
}

.company-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: var(--space-4);
  border-top: 1px solid rgba(255,255,255,0.06);
}

.company-card__link {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--clr-gold-500);
  transition: gap var(--transition-fast);
}

.company-card__link:hover {
  gap: var(--space-3);
  color: var(--clr-gold-400);
}

.company-card__link svg {
  flex-shrink: 0;
  transition: transform var(--transition-fast);
}

.company-card__link:hover svg {
  transform: translateX(3px);
}

/* Empty state */
.companies-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: var(--space-16);
  color: var(--clr-gray-500);
}

/* ================================================
   11. News Section
   ================================================ */
.news-section {
  padding: var(--space-24) 0;
  background: var(--clr-dark-900);
}

.news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-6);
}

.news-card {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all var(--transition);
  display: flex;
  flex-direction: column;
  text-decoration: none;
}

.news-card:hover {
  border-color: var(--glass-hover-border);
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}

.news-card__image {
  width: 100%;
  height: 200px;
  background: var(--clr-dark-600);
  overflow: hidden;
}

.news-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slow);
}

.news-card:hover .news-card__image img {
  transform: scale(1.05);
}

.news-card__body {
  padding: var(--space-6);
  flex: 1;
  display: flex;
  flex-direction: column;
}

.news-card__meta {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}

.news-card__date {
  font-size: var(--text-xs);
  color: var(--clr-gray-500);
  letter-spacing: 0.05em;
}

.news-card__title,
.company-card--post .company-card__name {
  font-family: var(--font-display);
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--clr-white);
  line-height: 1.45;
  letter-spacing: 0.03em;
  margin-bottom: var(--space-3);
  /* all-caps titles get long — cap them at three lines */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.news-card__title {
  flex: 0 0 auto;
}

.news-card__excerpt {
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  line-height: 1.7;
}

.news-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-4) var(--space-6);
  border-top: 1px solid rgba(255,255,255,0.06);
}

.news-card__read-more {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--clr-gold-500);
  transition: gap var(--transition-fast);
}

.news-card:hover .news-card__read-more { gap: var(--space-3); }

/* ================================================
   12. Contact CTA Section
   ================================================ */
.contact-cta {
  padding: var(--space-24) 0;
  background: linear-gradient(135deg, var(--clr-dark-800), var(--clr-dark-900));
  position: relative;
  overflow: hidden;
  text-align: center;
}

.contact-cta::before {
  content: '';
  position: absolute;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(245,194,0,0.1), transparent 70%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.contact-cta__title {
  font-size: clamp(var(--text-3xl), 4vw, var(--text-5xl));
  margin-bottom: var(--space-4);
  position: relative;
}

.contact-cta__text {
  font-size: var(--text-lg);
  color: var(--clr-gray-400);
  max-width: 520px;
  margin: 0 auto var(--space-10);
  position: relative;
}

.contact-cta .btn {
  position: relative;
}

/* ================================================
   13. Footer
   ================================================ */
.site-footer {
  background: #070605;
  border-top: 1px solid rgba(245,194,0,0.15);
}

.footer-main {
  padding: var(--space-16) 0 var(--space-12);
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: var(--space-10);
}

.footer-brand {}

.footer-logo {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  text-decoration: none;
  margin-bottom: var(--space-4);
}

.footer-brand__desc {
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  line-height: 1.7;
  margin-bottom: var(--space-6);
  max-width: 280px;
}

.footer-heading {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--clr-gold-500);
  margin-bottom: var(--space-4);
}

.footer-nav {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.footer-nav a {
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  transition: color var(--transition-fast);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.footer-nav a:hover {
  color: var(--clr-gold-400);
}

.footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
}

.footer-contact-item svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--clr-gold-600);
}

.footer-lang-switcher {
  display: flex;
  gap: var(--space-2);
  margin-top: var(--space-4);
}

.footer-lang-switcher ul {
  display: flex;
  gap: var(--space-2);
  list-style: none;
}

.footer-lang-switcher ul li a,
.footer-lang-switcher a {
  display: inline-block;
  padding: 0.3rem 0.625rem;
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--clr-gray-500);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius-sm);
  transition: all var(--transition-fast);
}

.footer-lang-switcher ul li a:hover,
.footer-lang-switcher a:hover {
  color: var(--clr-gold-400);
  border-color: rgba(245,194,0,0.3);
}

.footer-lang-switcher ul li.current-lang a {
  color: var(--clr-gold-500);
  border-color: rgba(245,194,0,0.4);
  background: rgba(245,194,0,0.08);
}

.footer-bottom {
  padding: var(--space-6) 0;
  border-top: 1px solid rgba(255,255,255,0.06);
}

.footer-bottom .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.footer-copyright {
  font-size: var(--text-sm);
  color: var(--clr-gray-600);
}

.footer-bottom-links {
  display: flex;
  gap: var(--space-6);
}

.footer-bottom-links a {
  font-size: var(--text-xs);
  color: var(--clr-gray-600);
  transition: color var(--transition-fast);
}

.footer-bottom-links a:hover { color: var(--clr-gold-400); }

/* ================================================
   14. Inner Pages — Page Header
   ================================================ */
/* Inner-page banner — same warm, spot-lit gold atmosphere as the homepage banner */
.page-hero {
  padding-top: calc(var(--header-height) + var(--space-16));
  padding-bottom: var(--space-16);
  background:
    radial-gradient(ellipse 55% 90% at 50% -25%, rgba(245,194,0,0.16), transparent 62%),
    radial-gradient(ellipse 35% 70% at 82% 55%, rgba(245,194,0,0.07), transparent 70%),
    linear-gradient(180deg, rgb(var(--header-tint, 22,18,11)) 0%, var(--clr-dark-900) 100%);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* Gold hairline where the banner ends */
.page-hero::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(245,194,0,0.55) 20%, rgba(245,194,0,0.55) 80%, transparent);
  z-index: 1;
}

/* Diagonal light beams, echoing the frame of the homepage artwork */
.page-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(118deg, transparent 58%, rgba(245,194,0,0.22) 58.15%, transparent 58.35%),
    linear-gradient(118deg, transparent 63%, rgba(245,194,0,0.10) 63.1%, transparent 63.3%),
    linear-gradient(62deg,  transparent 88%, rgba(245,194,0,0.16) 88.15%, transparent 88.35%);
  -webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0,0,0,0.35) 100%);
          mask-image: linear-gradient(180deg, #000 0%, rgba(0,0,0,0.35) 100%);
  pointer-events: none;
  z-index: -1;
}

.page-hero > .container {
  position: relative;
  z-index: 1;
}

/* Metallic gold watermark instead of flat grey */
.page-hero__bg-text {
  position: absolute;
  right: -2rem;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-display);
  font-size: clamp(80px, 12vw, 160px);
  font-weight: 700;
  color: transparent;
  background: linear-gradient(180deg, rgba(245,194,0,0.14) 0%, rgba(245,194,0,0.03) 70%);
  -webkit-background-clip: text;
          background-clip: text;
  white-space: nowrap;
  pointer-events: none;
  line-height: 1;
  z-index: 0;
}

.page-hero .section-label { justify-content: flex-start; }
.page-hero .section-label::before { display: none; }

.page-hero__title {
  font-size: clamp(var(--text-4xl), 6vw, var(--text-6xl));
  margin-bottom: var(--space-4);
}

.page-hero__description {
  font-size: var(--text-xl);
  color: var(--clr-gray-300);
  max-width: 600px;
}

/* Breadcrumb */
.breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  margin-bottom: var(--space-6);
}

.breadcrumb a {
  color: var(--clr-gray-500);
  transition: color var(--transition-fast);
}

.breadcrumb a:hover { color: var(--clr-gold-400); }
.breadcrumb span { color: var(--clr-gray-400); }

/* Page Content */
.page-content {
  padding: var(--space-16) 0 var(--space-24);
  background: var(--clr-dark-800);
}

.page-content .wp-block-group,
.page-content .entry-content {
  max-width: var(--container-md);
  margin: 0 auto;
}

.entry-content > * { margin-bottom: var(--space-6); }
.entry-content h2 { font-size: var(--text-3xl); margin-top: var(--space-10); }
.entry-content h3 { font-size: var(--text-2xl); margin-top: var(--space-8); }
.entry-content p  { color: var(--clr-gray-300); line-height: 1.8; }
.entry-content a  { color: var(--clr-gold-400); }
.entry-content a:hover { color: var(--clr-gold-300); text-decoration: underline; }
.entry-content ul, .entry-content ol {
  padding-left: var(--space-6);
  color: var(--clr-gray-300);
}
.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }
.entry-content li { margin-bottom: var(--space-2); }
.entry-content blockquote {
  border-left: 3px solid var(--clr-gold-500);
  padding: var(--space-4) var(--space-6);
  background: var(--glass-bg);
  border-radius: 0 var(--radius) var(--radius) 0;
  color: var(--clr-gray-300);
  font-style: italic;
}

/* ================================================
   15. About Page
   ================================================ */
.about-content {
  padding: var(--space-16) 0 var(--space-24);
  background: var(--clr-dark-800);
}

.about-mission {
  padding: var(--space-20) 0;
  background: var(--clr-dark-800);
}

.about-mission .container {
  display: grid;
  grid-template-columns: 2.5fr 1fr;
  column-gap: var(--space-16);
  row-gap: 0;
  align-items: start;
}

/* Label + title span the full width; text and stats start on the same line */
.mission-head {
  grid-column: 1 / -1;
}

.mission-head h2,
.mission-text h2 {
  font-size: clamp(var(--text-3xl), 4vw, var(--text-5xl));
  margin-bottom: var(--space-6);
}

.mission-text p:not(.section-label) {
  color: var(--clr-gray-300);
  font-size: var(--text-lg);
  line-height: 1.8;
  margin-bottom: var(--space-4);
}

.values-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.value-card {
  padding: var(--space-6);
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  transition: all var(--transition);
}

.value-card:hover {
  border-color: var(--glass-hover-border);
  transform: translateY(-2px);
}

.value-card__icon {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, rgba(245,194,0,0.2), rgba(245,194,0,0.05));
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--clr-gold-500);
  margin-bottom: var(--space-4);
}

.value-card h3 {
  font-size: var(--text-lg);
  font-family: var(--font-display);
  color: var(--clr-white);
  margin-bottom: var(--space-2);
}

.value-card p {
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  line-height: 1.6;
}

/* About Timeline */
.about-timeline {
  padding: var(--space-24) 0;
}

.timeline {
  position: relative;
  max-width: 760px;
  margin: 0 auto;
}

.timeline::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(to bottom, transparent, rgba(245,194,0,0.4), transparent);
  transform: translateX(-50%);
}

.timeline-item {
  display: grid;
  grid-template-columns: 1fr 40px 1fr;
  gap: var(--space-6);
  align-items: center;
  margin-bottom: var(--space-10);
}

.timeline-item:nth-child(even) .timeline-content { order: 3; }
.timeline-item:nth-child(even) .timeline-empty   { order: 1; }

.timeline-dot {
  width: 40px;
  height: 40px;
  background: var(--clr-dark-900);
  border: 2px solid var(--clr-gold-500);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--clr-gold-500);
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

.timeline-content {
  padding: var(--space-5);
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius);
}

.timeline-content__year {
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--clr-gold-500);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--space-1);
}

.timeline-content h3 {
  font-size: var(--text-lg);
  margin-bottom: var(--space-2);
}

.timeline-content p {
  font-size: var(--text-sm);
  color: var(--clr-gray-500);
  line-height: 1.6;
}

/* ================================================
   16. Contact Page
   ================================================ */
.contact-page {
  padding: var(--space-16) 0 var(--space-24);
  background: var(--clr-dark-800);
}

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: var(--space-16);
  align-items: start;
}

.contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  margin-bottom: var(--space-6);
}

.contact-info__icon {
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, rgba(245,194,0,0.15), rgba(245,194,0,0.05));
  border: 1px solid rgba(245,194,0,0.2);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--clr-gold-500);
}

.contact-info__label {
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--clr-gold-600);
  margin-bottom: var(--space-1);
}

.contact-info__value {
  font-size: var(--text-base);
  color: var(--clr-gray-300);
  line-height: 1.6;
}

/* Contact Form */
.contact-form {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-xl);
  padding: var(--space-10);
}

.contact-form h2 {
  font-size: var(--text-2xl);
  margin-bottom: var(--space-8);
}

.form-group {
  margin-bottom: var(--space-5);
}

.form-group label {
  display: block;
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--clr-gray-300);
  margin-bottom: var(--space-2);
}

.form-group input,
.form-group textarea,
.form-group select {
  width: 100%;
  padding: 0.875rem var(--space-4);
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius);
  color: var(--clr-white);
  font-size: var(--text-sm);
  transition: border-color var(--transition-fast);
  outline: none;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
  color: var(--clr-gray-600);
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  border-color: rgba(245,194,0,0.5);
  background: rgba(255,255,255,0.06);
}

.form-group textarea {
  min-height: 140px;
  resize: vertical;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.form-submit {
  margin-top: var(--space-6);
}

.form-success {
  padding: var(--space-4) var(--space-6);
  background: rgba(22,163,74,0.1);
  border: 1px solid rgba(22,163,74,0.3);
  border-radius: var(--radius);
  color: #84c29b;
  font-size: var(--text-sm);
  display: none;
  margin-top: var(--space-4);
}

/* ================================================
   17. Single Company Page
   ================================================ */
.company-single {
  padding: var(--space-16) 0 var(--space-24);
  background: var(--clr-dark-800);
}

.company-single .container {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: var(--space-12);
  align-items: start;
}

.company-single__main {}

.company-featured-image {
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: var(--radius-xl);
  overflow: hidden;
  margin-bottom: var(--space-8);
}

.company-featured-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.company-single__content {
  color: var(--clr-gray-400);
  font-size: var(--text-lg);
  line-height: 1.8;
}

.company-single__content h2 {
  font-size: var(--text-3xl);
  color: var(--clr-white);
  margin: var(--space-8) 0 var(--space-4);
}

.company-single__content p { margin-bottom: var(--space-4); }

/* Sidebar */
.company-sidebar {
  position: sticky;
  top: calc(var(--header-height) + var(--space-6));
}

.company-info-card {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-xl);
  padding: var(--space-8);
  margin-bottom: var(--space-6);
}

/* Logos range from 4.85:1 to 0.79:1 — give them room instead of a square box */
.company-logo-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  max-width: 100%;
  margin-bottom: var(--space-5, 1.25rem);
}

.company-logo-wrapper img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 80px;
  object-fit: contain;
}

.company-info-card h2 {
  font-size: var(--text-2xl);
  margin-bottom: var(--space-2);
}

.company-info-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.company-info-item {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.company-info-item:last-child { border-bottom: none; padding-bottom: 0; }

.company-info-item__label {
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--clr-gold-600);
}

.company-info-item__value {
  font-size: var(--text-sm);
  color: var(--clr-gray-300);
}

/* ================================================
   18. Archive Companies
   ================================================ */
.archive-companies {
  padding: var(--space-12) 0 var(--space-24);
  background: var(--clr-dark-800);
}

.industry-filter-tabs {
  display: flex;
  gap: var(--space-3);
  margin-bottom: var(--space-12);
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  padding-bottom: var(--space-6);
}

/* ================================================
   19. 404 Page
   ================================================ */
.page-404 {
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--space-20) var(--space-6);
}

.page-404__number {
  font-family: var(--font-display);
  font-size: clamp(100px, 20vw, 200px);
  font-weight: 700;
  color: rgba(245,194,0,0.15);
  line-height: 1;
  display: block;
  margin-bottom: var(--space-4);
}

.page-404 h1 {
  font-size: clamp(var(--text-3xl), 4vw, var(--text-5xl));
  margin-bottom: var(--space-4);
}

.page-404 p {
  color: var(--clr-gray-400);
  font-size: var(--text-lg);
  margin-bottom: var(--space-8);
}

/* ================================================
   20. Scroll Animation
   ================================================ */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}

.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
.reveal-delay-5 { transition-delay: 0.5s; }

/* ================================================
   21. Keyframes
   ================================================ */
@keyframes orbFloat {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%       { transform: translate(30px, -40px) scale(1.05); }
  66%       { transform: translate(-20px, 20px) scale(0.97); }
}

@keyframes scrollBounce {
  0%   { opacity: 1; transform: translateX(-50%) translateY(0); }
  80%  { opacity: 0; transform: translateX(-50%) translateY(12px); }
  100% { opacity: 0; transform: translateX(-50%) translateY(12px); }
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* ================================================
   22. Responsive Design
   ================================================ */
@media (max-width: 1200px) {
  .industries-grid > .industry-card {
    flex-basis: 280px;
  }
  .footer-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .about-preview .container {
    gap: var(--space-10);
  }
}

@media (max-width: 1024px) {
  .companies-grid { grid-template-columns: repeat(2, 1fr); }
  .news-grid      { grid-template-columns: repeat(2, 1fr); }
  .about-preview .container { grid-template-columns: 1fr; }
  /* Below the desktop layout the cards stack — no overlap, so any
     text length (Armenian names wrap to two lines) stays readable */
  .about-card-stack {
    height: auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-bottom: 0;
  }
  .about-card {
    position: static;
    width: 100%;
  }
  .about-card--main { padding-top: var(--space-8); }
  .about-card--accent { width: 100%; }
  .about-mission .container { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
  .company-single .container { grid-template-columns: 1fr; }
  .company-sidebar { position: relative; top: 0; }
}

@media (max-width: 768px) {
  :root { --header-height: 68px; }

  .custom-logo-link img.custom-logo { height: 44px; max-height: 44px; }

  .industries-grid > .industry-card { flex-basis: 260px; max-width: none; }
  .companies-grid  { grid-template-columns: 1fr; }
  .news-grid       { grid-template-columns: 1fr; }
  .footer-grid     { grid-template-columns: 1fr 1fr; }
  .about-highlights { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .values-grid { grid-template-columns: 1fr; }
  .hero-divider { display: none; }
  .hero-stats { gap: var(--space-6); }

  .footer-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .industries-grid > .industry-card { flex-basis: 100%; }
  .hero-actions { flex-direction: column; align-items: center; }
  .btn { width: 100%; justify-content: center; }
  .hero-stats { flex-direction: column; gap: var(--space-6); }
  .hero-divider { display: none; }
  .grid--2 { grid-template-columns: 1fr; }
}

/* ================================================
   23. Gutenberg / WP Admin Compat
   ================================================ */
.wp-block-image { margin: var(--space-8) 0; border-radius: var(--radius); overflow: hidden; }
.wp-block-quote { 
  border-left: 3px solid var(--clr-gold-500);
  padding: var(--space-4) var(--space-6);
  background: var(--glass-bg);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-style: italic;
  color: var(--clr-gray-300);
  margin: var(--space-8) 0;
}
.wp-block-separator {
  border: none;
  height: 1px;
  background: rgba(255,255,255,0.08);
  margin: var(--space-8) 0;
}

/* Screen reader only */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Business-area cards on the About page link to the sector archive.
   Three per row (the last two centred), two on tablets, one on phones. */
.about-area-card {
  flex: 0 1 calc((100% - 3rem) / 3);
  min-width: 0;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.about-area-card:hover {
  border-color: var(--glass-hover-border) !important;
  transform: translateY(-3px);
  box-shadow: var(--shadow-gold);
}

.about-area-card h3 {
  transition: color var(--transition-fast);
}

.about-area-card:hover h3 {
  color: var(--clr-gold-500);
}

/* First stat sits on the same line as the first paragraph */
.mission-stats-grid > div:first-child {
  padding-top: 0.4rem !important;
}

@media (max-width: 900px) {
  .about-area-card { flex-basis: calc((100% - 1.5rem) / 2); }
}

@media (max-width: 560px) {
  .about-area-card { flex-basis: 100%; }
}

/* Stats: one row of three under the text on tablets and phones */
@media (max-width: 1024px) {
  .mission-stats-grid {
    flex-direction: row !important;
    gap: var(--space-4);
    margin-top: var(--space-8);
    border-top: 1px solid rgba(255,255,255,0.08);
  }
  .mission-stats-grid > div,
  .mission-stats-grid > div:first-child {
    flex: 1 1 0;
    min-width: 0;
    padding-top: 1.25rem !important;
    border-bottom: none !important;
  }
}

@media (max-width: 560px) {
  .mission-stats-grid > div > div:last-child {
    letter-spacing: 0.04em !important;
    font-size: 0.68rem !important;
    overflow-wrap: anywhere;
  }
}

/* iOS zooms into inputs under 16px — keep form fields at 16px on phones */
@media (max-width: 768px) {
  .form-group input,
  .form-group textarea,
  .form-group select {
    font-size: 16px;
  }
}

/* Agency credit in the footer bar */
.footer-credit {
  font-size: var(--text-sm);
  color: var(--clr-gray-600);
  margin: 0;
}

.footer-credit a {
  color: var(--clr-gray-500);
  transition: color var(--transition-fast);
}

.footer-credit a:hover {
  color: var(--clr-gold-400);
}

/* ------------------------------------------------
   Careers page
   ------------------------------------------------ */
.careers-page {
  padding: var(--space-16) 0 var(--space-24);
}

.careers-layout {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: var(--space-16);
  align-items: start;
}

.careers-text {
  font-size: var(--text-lg);
  line-height: 1.8;
  color: var(--clr-gray-300);
  position: sticky;
  top: calc(var(--header-height) + var(--space-8));
}

.careers-text p + p {
  margin-top: var(--space-4);
}

.form-required { color: var(--clr-gold-500); }
.form-optional { color: var(--clr-gray-600); font-weight: 400; }

.form-hint {
  display: block;
  margin-top: var(--space-2);
  font-size: var(--text-xs);
  color: var(--clr-gray-500);
}

.form-group select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23f5c200' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
  cursor: pointer;
}

.form-group select option {
  background: var(--clr-dark-700);
  color: var(--clr-white);
}

/* Styled file picker — the real input covers the box, invisible */
.file-input {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: 0.875rem var(--space-4);
  border: 1px dashed rgba(245,194,0,0.35);
  border-radius: var(--radius);
  background: rgba(245,194,0,0.03);
  color: var(--clr-gold-500);
  cursor: pointer;
  transition: border-color var(--transition-fast), background var(--transition-fast);
}

.file-input:hover,
.file-input:focus-within {
  border-color: rgba(245,194,0,0.7);
  background: rgba(245,194,0,0.07);
}

.file-input input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  width: 100%;
}

.file-input__name {
  font-size: var(--text-sm);
  color: var(--clr-gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.file-input.has-file {
  border-style: solid;
}

.file-input.has-file .file-input__name {
  color: var(--clr-white);
}

.form-error {
  padding: var(--space-4) var(--space-6);
  background: rgba(178,84,74,0.12);
  border: 1px solid rgba(178,84,74,0.4);
  border-radius: var(--radius);
  color: #e09a93;
  font-size: var(--text-sm);
  display: none;
  margin-top: var(--space-4);
}

@media (max-width: 1024px) {
  .careers-layout { grid-template-columns: 1fr; gap: var(--space-10); }
  .careers-text { position: static; }
}

/* Seven menu items don't fit next to the logo and languages below this width —
   switch to the burger. Same specificity as the desktop centring rule. */
@media (max-width: 1180px) {
  .primary-nav,
  .site-header .primary-nav { display: none; }
  .mobile-menu-toggle { display: flex; }
}

/* Company card: the logo fades in over the photo on hover */
.company-card__logo {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-8);
  background: rgba(10, 9, 7, 0.78);
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity var(--transition);
  pointer-events: none;
}

.company-card__logo img,
.company-card:hover .company-card__logo img {
  width: auto;
  height: auto;
  max-width: 65%;
  max-height: 70%;
  object-fit: contain;
  transform: scale(0.92);
  transition: transform var(--transition);
  filter: drop-shadow(0 4px 14px rgba(0,0,0,0.5));
}

.company-card:hover .company-card__logo,
.company-card:focus-within .company-card__logo {
  opacity: 1;
}

.company-card:hover .company-card__logo img,
.company-card:focus-within .company-card__logo img {
  transform: scale(1);
}

/* ------------------------------------------------
   Pagination (companies, news, industries)
   ------------------------------------------------ */
.pagination,
.navigation.pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--space-2);
}

.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 var(--space-3);
  border: 1px solid rgba(245,194,0,0.2);
  border-radius: var(--radius-full);
  background: var(--glass-bg);
  color: var(--clr-gray-300);
  font-size: var(--text-sm);
  font-weight: 600;
  text-decoration: none;
  transition: color var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast);
}

.pagination a.page-numbers:hover {
  color: var(--clr-gold-500);
  border-color: rgba(245,194,0,0.6);
  background: rgba(245,194,0,0.06);
}

.pagination .page-numbers.current {
  background: var(--clr-gold-500);
  border-color: var(--clr-gold-500);
  color: #14110c;
}

.pagination .page-numbers.dots {
  border-color: transparent;
  background: none;
  min-width: auto;
}

.pagination .prev,
.pagination .next {
  font-size: var(--text-lg);
}

/* Single news / charity posts: a calmer title than the section banners */
.page-hero__title--post {
  font-size: clamp(1.625rem, 3.2vw, 2.375rem);
  line-height: 1.3;
  max-width: 900px;
}

/* Contact page: the form stays in view while the long contact list scrolls.
   Only on screens tall enough to show the whole form, otherwise the submit
   button would be out of reach until the end of the list. */
@media (min-width: 1025px) and (min-height: 860px) {
  .contact-grid > .contact-form {
    position: sticky;
    top: calc(var(--header-height) + var(--space-6));
  }
}

/* ------------------------------------------------
   Homepage newsroom: impact stories + news list
   ------------------------------------------------ */
.newsroom {
  padding: var(--space-24) 0;
  background:
    radial-gradient(ellipse 50% 60% at 15% 30%, rgba(245,194,0,0.05), transparent 70%),
    var(--clr-dark-900);
}

.newsroom__grid {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: var(--space-10);
  align-items: start;
}

.newsroom__impact,
.newsroom__news {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

/* Featured story — photo with the text laid over its lower part */
.impact-feature {
  position: relative;
  display: block;
  min-height: 420px;
  border-radius: var(--radius-xl);
  overflow: hidden;
  border: 1px solid var(--glass-border);
  text-decoration: none;
  isolation: isolate;
}

.impact-feature__media,
.impact-feature__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
  transition: transform var(--transition-slow);
}

.impact-feature::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(10,9,7,0.05) 0%, rgba(10,9,7,0.55) 45%, rgba(10,9,7,0.95) 100%);
}

.impact-feature:hover .impact-feature__media img {
  transform: scale(1.04);
}

.impact-feature__body {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: var(--space-8);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
}

.impact-badge {
  display: inline-block;
  padding: 0.35rem 0.8rem;
  border-radius: var(--radius-full);
  background: rgba(245,194,0,0.14);
  border: 1px solid rgba(245,194,0,0.45);
  color: var(--clr-gold-500);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.impact-feature__title {
  font-size: clamp(1.25rem, 2vw, 1.625rem);
  line-height: 1.3;
  margin: 0;
}

.impact-feature__excerpt {
  color: var(--clr-gray-300);
  font-size: var(--text-sm);
  line-height: 1.7;
  max-width: 560px;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Two smaller stories under the feature */
.impact-minis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
}

.impact-mini {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-3);
  border-radius: var(--radius-lg);
  border: 1px solid var(--glass-border);
  background: var(--glass-bg);
  text-decoration: none;
  transition: border-color var(--transition-fast), transform var(--transition-fast);
}

.impact-mini:hover {
  border-color: var(--glass-hover-border);
  transform: translateY(-2px);
}

.impact-mini__media {
  flex: 0 0 88px;
  height: 88px;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--clr-dark-600);
}

.impact-mini__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.impact-mini__title,
.news-list__title {
  font-size: var(--text-sm);
  line-height: 1.45;
  letter-spacing: 0.03em;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color var(--transition-fast);
}

.impact-mini:hover .impact-mini__title,
.news-list__item:hover .news-list__title {
  color: var(--clr-gold-500);
}

/* News column */
.newsroom__column-label {
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--clr-gold-500);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid rgba(245,194,0,0.35);
  margin: 0;
}

.news-list {
  list-style: none;
  margin: calc(-1 * var(--space-6)) 0 0;
  padding: 0;
}

.news-list li + li {
  border-top: 1px solid rgba(255,255,255,0.07);
}

.news-list__item {
  display: flex;
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-6) 0;
  text-decoration: none;
}

.news-list__media {
  flex: 0 0 104px;
  height: 78px;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--clr-dark-600);
}

.news-list__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slow);
}

.news-list__item:hover .news-list__media img {
  transform: scale(1.06);
}

.news-list__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  min-width: 0;
}

.news-list__date {
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--clr-gold-500);
}

/* "All …" links and the feature's call to action */
.newsroom__all,
.newsroom__more {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--clr-gold-500);
  text-decoration: none;
}

.newsroom__all {
  align-self: flex-start;
  padding-top: var(--space-2);
}

.newsroom__all svg,
.newsroom__more svg {
  transition: transform var(--transition-fast);
}

.newsroom__all:hover svg,
.impact-feature:hover .newsroom__more svg {
  transform: translateX(4px);
}

@media (max-width: 1024px) {
  .newsroom__grid { grid-template-columns: 1fr; gap: var(--space-16); }
}

@media (max-width: 560px) {
  .impact-feature { min-height: 380px; }
  .impact-feature__body { padding: var(--space-6); }
  .impact-minis { grid-template-columns: 1fr; gap: var(--space-4); }
  .news-list__media { flex-basis: 88px; height: 66px; }
}

/* ------------------------------------------------
   Industry cards — quieter, editorial treatment:
   bare line icon, text link, sharper corners
   ------------------------------------------------ */
.industry-card {
  border-radius: var(--radius-sm);
  border-color: rgba(255,255,255,0.08);
  background: rgba(255,247,232,0.025);
  padding: var(--space-8);
  gap: var(--space-4);
}

.industry-card:hover {
  transform: none;
  box-shadow: none;
  border-color: rgba(245,194,0,0.45);
  background: rgba(245,194,0,0.035);
}

.industry-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  margin-bottom: var(--space-4);
}

.industry-card .industry-icon {
  width: auto;
  height: auto;
  background: none;
  border: none;
  border-radius: 0;
  justify-content: flex-start;
}

.industry-card .industry-icon svg {
  width: 40px;
  height: 40px;
}

/* Long Armenian words in caps: never split a word, size down instead */
.industry-card__name {
  font-size: clamp(1rem, 1.3vw, 1.2rem);
  letter-spacing: 0.04em;
  overflow-wrap: normal;
  hyphens: manual;
  word-break: keep-all;
}

.industry-card__desc {
  color: var(--clr-gray-400);
}

/* Text link instead of a pill button, with a rule above it */
.industry-card__cta {
  width: 100%;
  padding: var(--space-4) 0 0;
  border: none;
  border-top: 1px solid rgba(255,255,255,0.08);
  border-radius: 0;
  justify-content: space-between;
  background: none;
  transition: border-color var(--transition-fast);
}

.industry-card:hover .industry-card__cta {
  background: none;
  border-top-color: rgba(245,194,0,0.35);
}

@media (max-width: 560px) {
  .industry-card__name { font-size: 1.05rem; }
}

/* Phones: tighter vertical rhythm — every section pads with these tokens */
@media (max-width: 768px) {
  :root {
    --space-24: 4rem;
    --space-20: 3.5rem;
  }
}

/* Consent note above form buttons */
.form-consent {
  margin-top: var(--space-4);
  font-size: var(--text-xs);
  line-height: 1.6;
  color: var(--clr-gray-500);
}

.form-consent a {
  color: var(--clr-gold-500);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.form-consent a:hover {
  color: var(--clr-gold-300);
}

/* ------------------------------------------------
   Cookie consent banner
   ------------------------------------------------ */
.cookie-banner {
  position: fixed;
  left: var(--space-6);
  right: var(--space-6);
  bottom: var(--space-6);
  z-index: 1100;
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-5, 1.25rem) var(--space-6);
  background: rgba(18, 17, 16, 0.96);
  border: 1px solid rgba(245,194,0,0.35);
  border-radius: var(--radius);
  box-shadow: var(--shadow-xl);
  -webkit-backdrop-filter: blur(12px);
          backdrop-filter: blur(12px);
}

.cookie-banner[hidden] { display: none; }

.cookie-banner__text {
  margin: 0;
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--clr-gray-300);
}

.cookie-banner__text a {
  color: var(--clr-gold-500);
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}

.cookie-banner__actions {
  display: flex;
  gap: var(--space-3);
  flex-shrink: 0;
}

.cookie-banner__btn {
  padding: 0.6rem 1.2rem;
  font-size: var(--text-xs);
}

.footer-credit__sep {
  margin: 0 var(--space-2);
}

@media (max-width: 640px) {
  .cookie-banner {
    left: var(--space-4);
    right: var(--space-4);
    bottom: var(--space-4);
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-4);
  }
  .cookie-banner__actions > * { flex: 1; }
}

/* ------------------------------------------------
   Mobile typography
   Armenian words are long and headings are uppercase, so the desktop
   scale overflows on phones — step the sizes down.
   ------------------------------------------------ */
@media (max-width: 640px) {
  .page-hero__title        { font-size: 1.5rem; line-height: 1.25; }
  .page-hero__title--post  { font-size: 1.25rem; }
  .section-title,
  .about-preview__title    { font-size: 1.35rem; line-height: 1.3; }
  .contact-form h2,
  .careers-form h2         { font-size: 1.25rem; }
  .company-card__name,
  .impact-feature__title,
  .industry-card__name     { font-size: 1.05rem; }
  .about-card__number      { font-size: 2rem; }

  .section-subtitle,
  .about-preview__text,
  .page-hero__description,
  .careers-text,
  .mission-text p:not(.section-label) { font-size: 1rem; line-height: 1.7; }

  .page-hero__bg-text      { font-size: 64px; }
  .entry-content h2        { font-size: 1.375rem; }
  .entry-content h3        { font-size: 1.15rem; }
}

@media (max-width: 400px) {
  .page-hero__title        { font-size: 1.3rem; }
  .section-title,
  .about-preview__title    { font-size: 1.2rem; }
  .section-label           { font-size: 0.7rem; letter-spacing: 0.1em; }
}

/* Industry filter on phones: one swipeable row instead of a ragged stack */
@media (max-width: 768px) {
  .industry-filter-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: var(--space-2);
    margin: 0 calc(-1 * var(--space-6)) var(--space-8);
    padding: 0 var(--space-6) var(--space-4);
  }

  .industry-filter-tabs::-webkit-scrollbar { display: none; }

  .filter-btn {
    flex: 0 0 auto;
    scroll-snap-align: start;
    font-size: 0.8125rem;
    padding: 0.45rem 1rem;
    white-space: nowrap;
  }
}

/* The whole company card is clickable: the title link is stretched over it,
   while the website link stays on top so it keeps its own target. */
.company-card {
  position: relative;
}

.company-card__name a::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}

.company-card:hover {
  cursor: pointer;
}

.company-card__footer a,
.company-card__logo {
  position: relative;
  z-index: 2;
}

/* Featured images are never upscaled past their real size — a small original
   stays small and sharp instead of being blown up and blurry. */
.entry-featured-image {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto var(--space-8);
  border-radius: var(--radius-lg);
}

.company-featured-image {
  aspect-ratio: auto;
  height: auto;
  text-align: center;
}

.company-featured-image img {
  width: auto;
  height: auto;
  max-width: 100%;
  object-fit: contain;
}

/* No sideways scrolling: decorative elements (banner watermark, glow orbs)
   sit outside the viewport, so clamp both html and body. */
html {
  overflow-x: hidden;
  max-width: 100%;
}

body {
  overflow-x: clip;
  max-width: 100vw;
}

/* Watermark must never widen the page */
.page-hero {
  max-width: 100vw;
}

.page-hero__bg-text {
  max-width: 100vw;
  overflow: hidden;
}

/* ------------------------------------------------
   Social responsibility: text on one side,
   initiative titles on the other
   ------------------------------------------------ */
.social-page {
  padding: var(--space-16) 0 var(--space-24);
}

.social-layout {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: var(--space-16);
  align-items: start;
}

.social-intro {
  font-size: var(--text-lg);
  line-height: 1.8;
  position: sticky;
  top: calc(var(--header-height) + var(--space-8));
}

.social-intro p + p {
  margin-top: var(--space-4);
}

.initiative-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(245,194,0,0.25);
}

.initiative-list li + li {
  border-top: 1px solid rgba(255,255,255,0.07);
}

.initiative-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
  padding: var(--space-5, 1.25rem) var(--space-2) var(--space-5, 1.25rem) 0;
  text-decoration: none;
  color: var(--clr-gray-200);
  transition: color var(--transition-fast);
}

.initiative-item__title {
  font-family: var(--font-display);
  font-size: var(--text-base);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.01em;
  /* transform, not padding — shifting padding would re-wrap long titles */
  transition: transform var(--transition-fast);
}

.initiative-item svg {
  flex: 0 0 auto;
  color: rgba(245,194,0,0.45);
  transition: transform var(--transition-fast), color var(--transition-fast);
}

.initiative-item:hover,
.initiative-item:focus-visible {
  color: var(--clr-gold-500);
}

.initiative-item:hover .initiative-item__title,
.initiative-item:focus-visible .initiative-item__title {
  transform: translateX(6px);
}

.initiative-item:hover svg,
.initiative-item:focus-visible svg {
  color: var(--clr-gold-500);
  transform: translateX(4px);
}

.social-initiatives .pagination {
  margin-top: var(--space-8);
  justify-content: flex-start;
}

@media (max-width: 1024px) {
  .social-layout {
    grid-template-columns: 1fr;
    gap: var(--space-10);
  }
  .social-intro { position: static; }
}

/* ------------------------------------------------
   Native lightbox in the site's dark palette
   (core paints the backdrop white by default)
   ------------------------------------------------ */
.wp-lightbox-overlay .scrim {
  background-color: #0a0907 !important;
  opacity: 0.97;
}

.wp-lightbox-overlay .wp-lightbox-close-button,
.wp-lightbox-overlay .wp-lightbox-navigation-button-prev,
.wp-lightbox-overlay .wp-lightbox-navigation-button-next {
  color: var(--clr-gray-200);
  transition: color var(--transition-fast), background-color var(--transition-fast);
}

.wp-lightbox-overlay .wp-lightbox-close-button:hover,
.wp-lightbox-overlay .wp-lightbox-close-button:focus-visible,
.wp-lightbox-overlay .wp-lightbox-navigation-button-prev:hover,
.wp-lightbox-overlay .wp-lightbox-navigation-button-prev:focus-visible,
.wp-lightbox-overlay .wp-lightbox-navigation-button-next:hover,
.wp-lightbox-overlay .wp-lightbox-navigation-button-next:focus-visible {
  color: var(--clr-gold-500);
}

/* Icons inherit the button colour whichever way core draws them */
.wp-lightbox-overlay .wp-lightbox-close-icon svg,
.wp-lightbox-overlay .wp-lightbox-navigation-icon svg {
  fill: currentColor;
  stroke: currentColor;
}

/* Keep a faint round backdrop so the arrows read over any photo */
.wp-lightbox-overlay .wp-lightbox-navigation-button-prev,
.wp-lightbox-overlay .wp-lightbox-navigation-button-next,
.wp-lightbox-overlay .wp-lightbox-close-button {
  background-color: rgba(10, 9, 7, 0.55) !important;
  border-radius: var(--radius-full);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.wp-lightbox-overlay .wp-lightbox-navigation-button-prev:hover,
.wp-lightbox-overlay .wp-lightbox-navigation-button-next:hover,
.wp-lightbox-overlay .wp-lightbox-close-button:hover {
  background-color: rgba(10, 9, 7, 0.85) !important;
}

/* Enlarge button on the image itself, in gold rather than grey */
.wp-lightbox-container button.lightbox-trigger {
  background-color: rgba(10, 9, 7, 0.55) !important;
  color: var(--clr-gold-500);
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  transition: background-color var(--transition-fast);
}

.wp-lightbox-container button.lightbox-trigger:hover {
  background-color: rgba(10, 9, 7, 0.8) !important;
}

.wp-lightbox-container button.lightbox-trigger svg {
  fill: currentColor;
}