/* ═══════════════════════════════════════════════════════
   AsreIOE - Main Stylesheet
   Design: Modern, Professional, High-Tech, Dark Navy
   ═══════════════════════════════════════════════════════ */

/* ── Variables ── */
:root {
  --primary: #1a2f50;
  --primary-light: #243b6b;
  --primary-dark: #0f1e35;
  --accent: #00c2a8;
  --accent-light: #00dfc0;
  --accent-alt: #f0a500;
  --text-primary: #1a1f2e;
  --text-secondary: #4a5568;
  --text-muted: #718096;
  --bg-white: #ffffff;
  --bg-light: #f7f9fc;
  --bg-alt: #eef2f8;
  --border: #e2e8f0;
  --border-light: #f0f4f8;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.10);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.12);
  --shadow-xl: 0 20px 60px rgba(0,0,0,0.15);
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 30px;
  --font-fa: 'Vazirmatn', 'Tahoma', sans-serif;
  --font-en: 'Inter', 'Segoe UI', sans-serif;
  --transition: all 0.25s ease;
  --transition-slow: all 0.4s ease;
}

/* ── 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-fa);
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-primary);
  background: var(--bg-white);
  overflow-x: hidden;
}

body.ltr { font-family: var(--font-en); }
body.rtl { direction: rtl; text-align: right; }

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: var(--transition); }
a:hover { color: var(--accent); }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
ul { list-style: none; }
.bi-arrow-left,
.bi-arrow-right,
.bi-arrow-up,
.bi-arrow-down { display: none !important; }

/* ── Container ── */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}
.container-wide { max-width: 1400px; }
.container-narrow { max-width: 860px; }

/* ── Typography ── */
h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  line-height: 1.3;
  color: var(--primary);
}
h1 { font-size: clamp(1.8rem, 4vw, 2.8rem); }
h2 { font-size: clamp(1.4rem, 3vw, 2rem); }
h3 { font-size: clamp(1.1rem, 2.5vw, 1.4rem); }
h4 { font-size: 1.1rem; }

.section-title {
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 800;
  color: var(--primary);
  margin-bottom: 12px;
}
.section-subtitle {
  font-size: 1rem;
  color: var(--text-secondary);
  max-width: 600px;
  margin: 0 auto 48px;
}
.section-header { text-align: center; margin-bottom: 48px; }
.section-header.text-right, .rtl .section-header { text-align: right; }
.rtl .section-header .section-subtitle { margin-right: 0; }

/* ── Navbar ── */
.navbar {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(26, 47, 80, 0.97);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,0.07);
  padding: 0;
  transition: var(--transition);
}
.navbar .container { display: flex; align-items: center; gap: 24px; min-height: 68px; }
.navbar-brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand-logo {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  object-fit: contain;
}
.brand-name {
  font-size: 1.3rem;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: -0.5px;
}
.brand-name span { color: var(--accent); }

.nav-menu { display: flex; align-items: center; gap: 4px; flex: 1; justify-content: flex-end; }
.rtl .nav-menu { justify-content: flex-start; }

.nav-links { display: flex; align-items: center; gap: 2px; flex: 1; justify-content: center; }
.nav-links .nav-link {
  color: rgba(255,255,255,0.82);
  padding: 8px 14px;
  border-radius: var(--radius-sm);
  font-size: 0.9rem;
  font-weight: 500;
  transition: var(--transition);
  white-space: nowrap;
}
.nav-links .nav-link:hover, .nav-links .nav-link.active {
  color: #ffffff;
  background: rgba(255,255,255,0.1);
}

.nav-dropdown { position: relative; }
.nav-dropdown .dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  min-width: 200px;
  padding: 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: var(--transition);
  z-index: 100;
}
.ltr .nav-dropdown .dropdown-menu { right: auto; left: 0; }
.nav-dropdown:hover .dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.dropdown-menu li a, .dropdown-menu li .dropdown-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  color: var(--text-primary);
  font-size: 0.9rem;
  border-radius: var(--radius-sm);
  transition: var(--transition);
  width: 100%;
  text-align: inherit;
  background: none;
}
.dropdown-menu li a:hover, .dropdown-menu li .dropdown-btn:hover {
  background: var(--bg-light);
  color: var(--primary);
}
.dropdown-menu .divider { border-top: 1px solid var(--border); margin: 6px 8px; }

.nav-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.btn-outline-nav {
  color: rgba(255,255,255,0.85);
  border: 1.5px solid rgba(255,255,255,0.25);
  padding: 7px 18px;
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  font-weight: 500;
  transition: var(--transition);
}
.btn-outline-nav:hover { border-color: white; color: white; background: rgba(255,255,255,0.08); }
.btn-primary-nav {
  background: var(--accent);
  color: var(--primary-dark);
  padding: 8px 20px;
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  font-weight: 700;
  transition: var(--transition);
}
.btn-primary-nav:hover { background: var(--accent-light); transform: translateY(-1px); }
.btn-nav-user {
  display: flex; align-items: center; gap: 8px;
  color: rgba(255,255,255,0.85);
  font-size: 0.875rem;
  padding: 7px 12px;
  border-radius: var(--radius-sm);
  transition: var(--transition);
}
.btn-nav-user:hover { color: white; background: rgba(255,255,255,0.1); }
.btn-cart { color: rgba(255,255,255,0.8); font-size: 1.1rem; padding: 6px 10px; }
.btn-cart:hover { color: var(--accent); }
.btn-lang-switch {
  color: rgba(255,255,255,0.75);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: var(--radius-sm);
  padding: 4px 10px;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-decoration: none;
  transition: var(--transition);
}
.btn-lang-switch:hover { color: var(--accent); border-color: var(--accent); }

.navbar-toggler { display: none; flex-direction: column; gap: 5px; padding: 8px; border: 0; background: transparent; cursor: pointer; }
.navbar-toggler span { width: 24px; height: 2px; background: white; border-radius: 2px; transition: var(--transition); }
.navbar-toggler.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.navbar-toggler.open span:nth-child(2) { opacity: 0; }
.navbar-toggler.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Consistent native file chooser */
.file-chooser { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 10px; width: 100%; }
.file-chooser input[type="file"] { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.file-chooser-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 9px 15px; border: 1px solid var(--accent); border-radius: var(--radius-sm); color: #fff; background: var(--accent); font: 600 .78rem inherit; cursor: pointer; transition: var(--transition); }
.file-chooser-button:hover { filter: brightness(.94); transform: translateY(-1px); }
.file-chooser-button:focus-visible { outline: 3px solid rgba(0,194,168,.24); outline-offset: 2px; }
.file-chooser-name { min-width: 0; overflow: hidden; color: var(--text-muted); font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.media-library-trigger { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; margin-top: 7px; padding: 8px 13px; border: 1px solid #cbd5e1; border-radius: var(--radius-sm); color: #334155; background: #fff; font: 600 .74rem inherit; cursor: pointer; transition: var(--transition); }
.media-library-trigger:hover { border-color: var(--accent); color: #007f70; background: #f0fdfa; }
.file-chooser .media-library-trigger { grid-column: 1/-1; justify-self: start; margin-top: 0; }
body.media-library-open { overflow: hidden; }
.media-library-modal[hidden] { display: none; }
.media-library-modal { position: fixed; inset: 0; z-index: 5000; display: grid; place-items: center; padding: 24px; direction: rtl; }
.media-library-backdrop { position: absolute; inset: 0; background: rgba(3,12,24,.72); backdrop-filter: blur(4px); }
.media-library-dialog { position: relative; display: flex; flex-direction: column; width: min(1040px,100%); max-height: min(780px,calc(100dvh - 48px)); overflow: hidden; border: 1px solid #dbe4ea; border-radius: 18px; background: #fff; box-shadow: 0 30px 80px rgba(2,12,27,.35); }
.media-library-dialog > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 20px 24px; border-bottom: 1px solid #e8edf2; }
.media-library-dialog h2 { margin: 0 0 4px; color: #14263e; font-size: 1.1rem; }
.media-library-dialog header p { margin: 0; color: #64748b; font-size: .72rem; }
.media-library-close { display: grid; place-items: center; width: 38px; height: 38px; border: 0; border-radius: 9px; color: #64748b; background: #f1f5f9; cursor: pointer; }
.media-library-toolbar { display: flex; align-items: center; gap: 12px; padding: 14px 24px; border-bottom: 1px solid #edf1f4; background: #f8fafc; }
.media-library-toolbar label { position: relative; flex: 1; }
.media-library-toolbar label i { position: absolute; top: 50%; right: 13px; color: #94a3b8; transform: translateY(-50%); }
.media-library-toolbar input { width: 100%; min-height: 42px; padding: 9px 40px 9px 12px; border: 1px solid #d9e2e8; border-radius: 10px; background: #fff; font: inherit; }
.media-library-toolbar a { display: inline-flex; align-items: center; gap: 6px; min-height: 42px; padding: 9px 14px; border-radius: 10px; color: #fff; background: #0f766e; font-size: .73rem; font-weight: 700; white-space: nowrap; }
.media-library-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; padding: 20px 24px 28px; overflow-y: auto; background: #f8fafc; }
.media-library-item { display: flex; flex-direction: column; min-width: 0; padding: 0; overflow: hidden; border: 1px solid #dce5eb; border-radius: 13px; text-align: right; background: #fff; cursor: pointer; transition: .2s; }
.media-library-item:hover { transform: translateY(-2px); border-color: #5eead4; box-shadow: 0 12px 26px rgba(15,23,42,.1); }
.media-library-preview { display: grid; place-items: center; width: 100%; aspect-ratio: 16/10; overflow: hidden; color: #0f766e; background: #e8f1f3; font-size: 2.5rem; }
.media-library-preview img { width: 100%; height: 100%; object-fit: cover; }
.media-library-meta { display: block; min-width: 0; padding: 11px 12px 8px; }
.media-library-meta strong,.media-library-meta small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-library-meta strong { color: #26384e; font-size: .75rem; }
.media-library-meta small { margin-top: 5px; color: #94a3b8; font-size: .61rem; direction: ltr; text-align: right; }
.media-library-select { display: flex; align-items: center; justify-content: center; gap: 5px; margin-top: auto; padding: 9px; border-top: 1px solid #edf1f4; color: #087f71; background: #f0fdfa; font-size: .68rem; font-weight: 700; }
.media-library-state { grid-column: 1/-1; padding: 70px 20px; color: #64748b; text-align: center; }
.media-library-state.error { color: #b91c1c; }

/* ── Alerts ── */
.alert-banner {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 24px;
  font-size: 0.9rem;
  font-weight: 500;
}
.alert-success { background: #d1fae5; color: #065f46; border-bottom: 3px solid #10b981; }
.alert-error { background: #fee2e2; color: #991b1b; border-bottom: 3px solid #ef4444; }
.alert-close { margin-right: auto; font-size: 1.2rem; opacity: 0.7; }
.rtl .alert-close { margin-right: 0; margin-left: auto; }

/* ── Hero Section ── */
.hero {
  position: relative;
  min-height: calc(100svh - 68px);
  display: flex;
  align-items: center;
  background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 40%, var(--primary-light) 100%);
  overflow: hidden;
  padding: 48px 0;
}
.hero::before {
  content: '';
  position: absolute; inset: 0;
  background: url('/images/grid-pattern.svg') repeat;
  opacity: 0.04;
}
.hero-content { position: relative; z-index: 2; max-width: 680px; }
.rtl .hero-content { text-align: right; }
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(0,194,168,0.15);
  border: 1px solid rgba(0,194,168,0.3);
  color: var(--accent);
  padding: 6px 16px;
  border-radius: 100px;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 24px;
}
.hero-title {
  font-size: clamp(2rem, 5vw, 3.2rem);
  font-weight: 800;
  color: #ffffff;
  line-height: 1.2;
  margin-bottom: 20px;
}
.hero-title .accent { color: var(--accent); }
.hero-subtitle {
  font-size: clamp(1rem, 2vw, 1.15rem);
  color: rgba(255,255,255,0.75);
  margin-bottom: 40px;
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-word;
}
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.rtl .hero-actions { justify-content: flex-start; }

/* ── Buttons ── */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 28px;
  border-radius: var(--radius-sm);
  font-size: 0.95rem;
  font-weight: 600;
  transition: var(--transition);
  cursor: pointer;
  border: none;
  line-height: 1;
}
.btn-primary {
  background: var(--accent);
  color: var(--primary-dark);
}
.btn-primary:hover { background: var(--accent-light); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,194,168,0.35); color: var(--primary-dark); }
.btn-outline {
  background: transparent;
  color: #ffffff;
  border: 2px solid rgba(255,255,255,0.35);
}
.btn-outline:hover { border-color: white; background: rgba(255,255,255,0.08); color: white; }
.btn-secondary {
  background: var(--bg-light);
  color: var(--primary);
}
.btn-secondary:hover { background: var(--bg-alt); }
.btn-dark { background: var(--primary); color: white; }
.btn-dark:hover { background: var(--primary-light); transform: translateY(-2px); box-shadow: var(--shadow-md); color: white; }
.btn-sm { padding: 8px 18px; font-size: 0.85rem; }
.btn-lg { padding: 15px 36px; font-size: 1rem; }
.btn-block { width: 100%; justify-content: center; }

/* ── Section Padding ── */
.section { padding: 80px 0; }
.section-sm { padding: 48px 0; }
.section-lg { padding: 120px 0; }
.bg-light { background: var(--bg-light); }
.bg-dark { background: var(--primary); }
.bg-alt { background: var(--bg-alt); }
.bg-gradient { background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%); }

/* ── Cards ── */
.card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: var(--transition-slow);
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: transparent; }
.card-body { padding: 28px; }
.card-img { width: 100%; height: 200px; object-fit: cover; }
.card-icon {
  width: 52px; height: 52px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, rgba(0,194,168,0.12), rgba(26,47,80,0.08));
  border-radius: var(--radius-md);
  font-size: 1.5rem;
  color: var(--accent);
  margin-bottom: 20px;
}
.card-title { font-size: 1.05rem; font-weight: 700; margin-bottom: 10px; }
.card-text { font-size: 0.9rem; color: var(--text-secondary); line-height: 1.7; }

/* ── Service Cards ── */
.services-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.service-card { display: flex; flex-direction: column; height: 100%; }
.service-card .card-body { flex: 1; display: flex; flex-direction: column; }
.service-card .card-text { flex: 1; }
.service-link { color: var(--accent); font-weight: 600; font-size: 0.875rem; margin-top: 16px; display: flex; align-items: center; gap: 6px; }
.service-link:hover { color: var(--accent-light); }

/* ── Article Cards ── */
.articles-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 28px; }
.article-card .card-body { display: flex; flex-direction: column; }
.article-meta { display: flex; align-items: center; gap: 12px; font-size: 0.82rem; color: var(--text-muted); margin-bottom: 10px; flex-wrap: wrap; }
.article-category {
  background: rgba(0,194,168,0.1);
  color: var(--accent);
  padding: 3px 10px; border-radius: 100px;
  font-size: 0.78rem; font-weight: 600;
}
.article-title { font-size: 1rem; font-weight: 700; margin-bottom: 10px; line-height: 1.5; }
.article-excerpt { font-size: 0.875rem; color: var(--text-secondary); flex: 1; }
  .article-read-more { margin-top: 16px; color: var(--accent); font-size: 0.875rem; font-weight: 600; }

  /* Blog experience */
  .blog-hero { position:relative; overflow:hidden; padding:82px 0 72px; background:
    radial-gradient(circle at 15% 25%, rgba(0,194,168,.18), transparent 28%),
    radial-gradient(circle at 82% 75%, rgba(52,100,174,.25), transparent 32%),
    linear-gradient(135deg,#0b1f38 0%,#15385e 100%); }
  .blog-hero::after { content:""; position:absolute; inset:0; opacity:.12; background-image:linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.15) 1px,transparent 1px); background-size:42px 42px; }
  .blog-hero-content { position:relative; z-index:1; max-width:760px; margin:auto; text-align:center; color:white; }
  .blog-kicker { display:inline-flex; align-items:center; gap:8px; margin-bottom:18px; padding:7px 15px; border:1px solid rgba(0,194,168,.35); border-radius:100px; background:rgba(0,194,168,.12); color:#62e4d2; font-size:.77rem; font-weight:700; }
  .blog-hero h1 { margin:0 0 17px; font-size:clamp(2rem,5vw,3.25rem); line-height:1.35; letter-spacing:-.035em; }
  .blog-hero h1 span { color:#52d9c7; }
  .blog-hero p { max-width:630px; margin:auto; color:rgba(255,255,255,.76); font-size:1rem; line-height:1.9; }
  .blog-filter-bar { display:flex; gap:14px; align-items:center; flex-wrap:wrap; margin:-78px 0 38px; padding:18px 20px; position:relative; z-index:2; background:rgba(255,255,255,.96); border:1px solid var(--border); border-radius:15px; box-shadow:0 16px 45px rgba(15,35,60,.12); backdrop-filter:blur(12px); }
  .blog-result-count { margin-right:auto; padding-right:14px; color:var(--text-muted); font-size:.78rem; border-right:1px solid var(--border); }
  .blog-result-count strong { color:var(--primary); font-size:1rem; }
  .blog-listing .articles-grid { grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:24px; }
  .blog-listing .article-card { overflow:hidden; border:1px solid var(--border); border-radius:15px; background:var(--surface); box-shadow:0 6px 24px rgba(15,35,60,.05); transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; }
  .blog-listing .article-card:hover { transform:translateY(-5px); border-color:rgba(0,194,168,.35); box-shadow:0 18px 40px rgba(15,35,60,.11); }
  .blog-listing .article-card-img { width:100%; height:210px; object-fit:cover; transition:transform .4s ease; }
  .blog-listing .article-card:hover .article-card-img { transform:scale(1.025); }
  .blog-listing .article-card-body { padding:20px; }
  .blog-listing .article-card-category { display:inline-flex; padding:4px 10px; border-radius:100px; background:rgba(0,194,168,.1); color:var(--accent-dark); font-size:.7rem; font-weight:700; text-decoration:none; }
  .blog-listing .article-card-title { margin:12px 0 9px; font-size:1.04rem; line-height:1.65; }
  .blog-listing .article-card-title a { color:var(--text-primary); text-decoration:none; }
  .blog-listing .article-card-excerpt { min-height:48px; color:var(--text-muted); font-size:.82rem; line-height:1.75; }
  .blog-listing .article-card-meta { display:flex; gap:13px; flex-wrap:wrap; padding-top:14px; margin-top:16px; border-top:1px solid var(--border); color:var(--text-muted); font-size:.7rem; }
  .blog-detail-page > header h1 { font-size:clamp(1.7rem,4vw,2.5rem)!important; letter-spacing:-.025em; }
  .blog-detail-page .article-content { font-size:1.02rem; line-height:2.05; }
  @media(max-width:680px){.blog-hero{padding:62px 18px 82px}.blog-filter-bar{margin-top:-64px}.blog-result-count{border:0;margin:0}.blog-filter-bar form{width:100%}.blog-filter-bar .form-control{max-width:none!important;width:100%}}

/* ── Product Cards ── */
.products-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px; }
.product-card { display: flex; flex-direction: column; height: 100%; }
.product-thumb { height: 200px; background: var(--bg-alt); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.product-thumb img { width: 100%; height: 100%; object-fit: cover; }
.product-thumb .thumb-placeholder { font-size: 3rem; color: var(--primary); opacity: 0.3; }
.product-badge {
  position: absolute; top: 12px;
  right: 12px;
  background: var(--accent); color: var(--primary-dark);
  padding: 3px 10px; border-radius: 100px;
  font-size: 0.75rem; font-weight: 700;
}
.rtl .product-badge { right: 12px; left: auto; }
.ltr .product-badge { right: auto; left: 12px; }
.product-price {
  font-size: 1.2rem; font-weight: 800; color: var(--primary);
  margin: 8px 0;
}
.product-price .price-original { font-size: 0.875rem; text-decoration: line-through; color: var(--text-muted); font-weight: 400; }
.product-price .price-free { color: var(--accent); }

/* ── Hero Stats ── */
.stats-bar {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius-md);
  padding: 24px 32px;
  display: flex;
  gap: 32px;
  flex-wrap: wrap;
  margin-top: 48px;
}
.stat-item { text-align: center; }
.stat-value { font-size: 2rem; font-weight: 800; color: var(--accent); line-height: 1; }
.stat-label { font-size: 0.8rem; color: rgba(255,255,255,0.65); margin-top: 4px; }

/* ── Pillars / Axes Section ── */
.pillars-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 28px; }
.pillar-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px 32px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: var(--transition-slow);
}
.pillar-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--accent), var(--accent-alt));
}
.pillar-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-xl); }
.pillar-icon { font-size: 2.5rem; color: var(--accent); margin-bottom: 20px; }
.pillar-title { font-size: 1.15rem; font-weight: 700; margin-bottom: 12px; color: var(--primary); }
.pillar-text { color: var(--text-secondary); font-size: 0.9rem; }

/* ── Trust Badges ── */
.trust-section { background: var(--primary); padding: 60px 0; }
.trust-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 32px; }
.trust-item { text-align: center; color: rgba(255,255,255,0.8); }
.trust-icon { font-size: 2rem; color: var(--accent); margin-bottom: 12px; }
.trust-title { font-size: 1rem; font-weight: 600; color: white; }
.trust-text { font-size: 0.85rem; margin-top: 4px; }

/* ── CTA Section ── */
.cta-section {
  background: linear-gradient(135deg, var(--primary-dark), var(--primary-light));
  padding: 80px 0;
  text-align: center;
  color: white;
}
.cta-title { font-size: clamp(1.5rem, 4vw, 2.5rem); font-weight: 800; color: white; margin-bottom: 16px; }
.cta-text { color: rgba(255,255,255,0.75); margin-bottom: 36px; font-size: 1rem; }

/* ── FAQ ── */
.faq-list { max-width: 800px; margin: 0 auto; }
.faq-item { border-bottom: 1px solid var(--border); }
.faq-question {
  width: 100%; text-align: inherit; background: none; border: none;
  padding: 20px 0; display: flex; justify-content: space-between;
  align-items: center; gap: 16px; cursor: pointer;
  font-size: 0.95rem; font-weight: 600; color: var(--primary);
  font-family: inherit;
}
.faq-question i { transition: var(--transition); flex-shrink: 0; }
.faq-item.open .faq-question i { transform: rotate(180deg); color: var(--accent); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.35s ease; }
.faq-answer p { padding: 0 0 20px; color: var(--text-secondary); font-size: 0.9rem; line-height: 1.8; }

/* ── Forms ── */
.form-group { margin-bottom: 20px; }
.form-label { display: block; font-size: 0.875rem; font-weight: 600; color: var(--text-primary); margin-bottom: 6px; }
.form-control {
  width: 100%; padding: 11px 14px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 0.9rem; font-family: inherit;
  color: var(--text-primary);
  background: var(--bg-white);
  transition: var(--transition);
}
.form-control:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(0,194,168,0.12); }
.form-control::placeholder { color: var(--text-muted); }
textarea.form-control { min-height: 120px; resize: vertical; }
select.form-control { appearance: none; }
.form-error { color: #dc2626; font-size: 0.8rem; margin-top: 4px; }
.input-required { color: #dc2626; margin-right: 2px; }

.form-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
  box-shadow: var(--shadow-md);
}

/* ── Breadcrumb ── */
.breadcrumb {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.85rem; color: var(--text-muted); flex-wrap: wrap;
  padding: 16px 0;
}
.breadcrumb a { color: var(--text-muted); }
.breadcrumb a:hover { color: var(--accent); }
.breadcrumb .separator { opacity: 0.4; }

/* ── Pagination ── */
.pagination { display: flex; align-items: center; gap: 6px; justify-content: center; margin-top: 40px; flex-wrap: wrap; }
.page-btn {
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  font-size: 0.875rem; color: var(--text-primary);
  transition: var(--transition);
}
.page-btn:hover, .page-btn.active { background: var(--primary); color: white; border-color: var(--primary); }

/* ── Tags / Badges ── */
.tag {
  display: inline-flex; align-items: center;
  padding: 4px 12px; border-radius: 100px;
  font-size: 0.8rem; font-weight: 600;
  background: var(--bg-alt); color: var(--text-secondary);
  transition: var(--transition);
}
.tag:hover { background: rgba(0,194,168,0.12); color: var(--accent); }
.tag-accent { background: rgba(0,194,168,0.12); color: var(--accent); }

/* ── Admin Layout ── */
.admin-layout { display: flex; min-height: 100vh; }
.admin-sidebar {
  width: 260px;
  background: var(--primary-dark);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0; bottom: 0;
  overflow-y: auto;
  z-index: 100;
}
.rtl .admin-sidebar { right: 0; left: auto; }
.ltr .admin-sidebar { left: 0; right: auto; }
.admin-content {
  flex: 1;
  margin-right: 260px; /* RTL */
  padding: 24px;
  background: var(--bg-light);
  min-height: 100vh;
}
.ltr .admin-content { margin-right: 0; margin-left: 260px; }
.sidebar-logo {
  padding: 24px 20px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  font-size: 1.1rem; font-weight: 800; color: white;
}
.sidebar-logo span { color: var(--accent); }
.sidebar-nav { padding: 16px 12px; flex: 1; }
.sidebar-section-title {
  font-size: 0.72rem; font-weight: 700; text-transform: uppercase;
  color: rgba(255,255,255,0.35); letter-spacing: 1px;
  padding: 12px 8px 6px;
}
.sidebar-link {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: var(--radius-sm);
  color: rgba(255,255,255,0.7); font-size: 0.875rem;
  transition: var(--transition); margin-bottom: 2px;
}
.sidebar-link i { width: 18px; text-align: center; }
.sidebar-link:hover, .sidebar-link.active { background: rgba(255,255,255,0.1); color: white; }
.sidebar-link.active { color: var(--accent); }
.sidebar-badge {
  margin-right: auto; /* RTL: pushes to left */
  background: var(--accent); color: var(--primary-dark);
  font-size: 0.7rem; font-weight: 700;
  padding: 2px 8px; border-radius: 100px;
}
.rtl .sidebar-badge { margin-right: auto; margin-left: 0; }
.ltr .sidebar-badge { margin-left: auto; margin-right: 0; }

.admin-topbar {
  background: white; border-bottom: 1px solid var(--border);
  padding: 0 24px; height: 64px;
  display: flex; align-items: center; justify-content: space-between;
  margin: -24px -24px 24px; position: sticky; top: 0; z-index: 50;
}
.admin-topbar-title { font-size: 1.1rem; font-weight: 700; color: var(--primary); }

/* ── Admin Cards / Stats ── */
.stats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; margin-bottom: 28px; }
.stat-card {
  background: white; border: 1px solid var(--border);
  border-radius: var(--radius-md); padding: 24px;
  display: flex; align-items: flex-start; gap: 16px;
}
.stat-card-icon {
  width: 48px; height: 48px; border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; flex-shrink: 0;
}
.stat-card-icon.blue { background: rgba(26,47,80,0.1); color: var(--primary); }
.stat-card-icon.green { background: rgba(0,194,168,0.1); color: var(--accent); }
.stat-card-icon.orange { background: rgba(240,165,0,0.1); color: var(--accent-alt); }
.stat-card-icon.red { background: rgba(239,68,68,0.1); color: #ef4444; }
.stat-card-value { font-size: 1.6rem; font-weight: 800; color: var(--primary); line-height: 1; }
.stat-card-label { font-size: 0.8rem; color: var(--text-muted); margin-top: 4px; }

/* ── Tables ── */
.table-wrapper { background: white; border: 1px solid var(--border); border-radius: var(--radius-md); overflow: hidden; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { padding: 12px 16px; text-align: inherit; font-size: 0.875rem; border-bottom: 1px solid var(--border-light); }
.table th { background: var(--bg-light); font-weight: 600; color: var(--text-secondary); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.5px; }
.table tr:last-child td { border-bottom: none; }
.table tr:hover td { background: var(--bg-light); }
.table .status-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: 100px; font-size: 0.78rem; font-weight: 600;
}
.badge-success { background: #d1fae5; color: #065f46; }
.badge-warning { background: #fef3c7; color: #92400e; }
.badge-danger { background: #fee2e2; color: #991b1b; }
.badge-info { background: #dbeafe; color: #1e40af; }
.badge-gray { background: var(--bg-alt); color: var(--text-secondary); }

/* ── Footer ── */
.site-footer {
  background: var(--primary-dark);
  color: rgba(255,255,255,0.75);
  padding-top: 64px;
}
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 40px; margin-bottom: 48px; }
.footer-logo { font-size: 1.3rem; font-weight: 800; color: white; margin-bottom: 12px; }
.footer-tagline { font-size: 0.875rem; color: rgba(255,255,255,0.55); line-height: 1.7; margin-bottom: 20px; }
.footer-social { display: flex; gap: 12px; }
.footer-social a {
  width: 36px; height: 36px;
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.65); font-size: 0.9rem;
  transition: var(--transition);
}
.footer-social a:hover { border-color: var(--accent); color: var(--accent); }
.footer-col h4 { color: white; font-size: 0.9rem; font-weight: 700; margin-bottom: 16px; }
.footer-col ul { display: flex; flex-direction: column; gap: 8px; }
.footer-col ul li a { font-size: 0.875rem; color: rgba(255,255,255,0.6); transition: var(--transition); }
.footer-col ul li a:hover { color: var(--accent); }
.footer-contact li { display: flex; align-items: center; gap: 10px; font-size: 0.875rem; }
.footer-contact li i { color: var(--accent); width: 16px; }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.07);
  padding: 20px 0;
  display: flex; align-items: center; justify-content: space-between;
  font-size: 0.82rem; color: rgba(255,255,255,0.45);
}
.footer-legal { display: flex; gap: 16px; }
.footer-legal a { color: rgba(255,255,255,0.45); }
.footer-legal a:hover { color: rgba(255,255,255,0.8); }

/* ── Auth Pages ── */
.auth-page {
  min-height: 100vh; display: flex; align-items: center;
  background: var(--bg-light); padding: 48px 24px;
}
.auth-card {
  width: 100%; max-width: 440px; margin: 0 auto;
  background: white; border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl); padding: 48px 40px;
}
.auth-logo { text-align: center; margin-bottom: 32px; }
.auth-title { font-size: 1.5rem; font-weight: 800; color: var(--primary); text-align: center; margin-bottom: 8px; }
.auth-subtitle { font-size: 0.875rem; color: var(--text-muted); text-align: center; margin-bottom: 28px; }
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 20px 0; }
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.auth-footer-text { text-align: center; font-size: 0.875rem; color: var(--text-muted); margin-top: 20px; }
.auth-footer-text a { color: var(--accent); font-weight: 600; }

/* ── Responsive ── */
@media (max-width: 992px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .admin-sidebar { transform: translateX(100%); }
  .rtl .admin-sidebar { transform: translateX(100%); }
  .ltr .admin-sidebar { transform: translateX(-100%); }
  .admin-content { margin-right: 0 !important; margin-left: 0 !important; }
  .admin-sidebar.open { transform: translateX(0); }
}

@media (max-width: 992px) {
  body.mobile-menu-open { overflow: hidden; }
  .navbar-toggler { display: flex; }
  .navbar .container { position: relative; justify-content: space-between; }
  .nav-menu {
    display: none;
    position: absolute;
    top: 68px;
    right: 0;
    left: 0;
    max-height: calc(100vh - 68px);
    max-height: calc(100dvh - 68px);
    background: var(--primary);
    flex-direction: column;
    align-items: flex-start;
    padding: 18px 20px 26px;
    gap: 0;
    overflow-y: auto;
    box-shadow: 0 18px 30px rgba(6, 18, 34, 0.28);
  }
  .nav-menu.open { display: flex; }
  .nav-links { flex-direction: column; align-items: stretch; width: 100%; gap: 2px; }
  .nav-links .nav-link { padding: 12px 8px; width: 100%; font-size: 1rem; }
  .nav-dropdown { width: 100%; }
  .nav-dropdown .dropdown-menu,
  .nav-dropdown:hover .dropdown-menu {
    position: static;
    display: grid;
    width: 100%;
    min-width: 0;
    margin: 0 0 7px;
    padding: 4px 12px;
    border: 0;
    border-radius: 8px;
    background: rgba(255,255,255,.07);
    box-shadow: none;
  }
  .nav-dropdown .dropdown-menu a { padding: 10px 12px; color: rgba(255,255,255,.85); }
  .nav-actions { flex-direction: column; align-items: stretch; width: 100%; padding-top: 16px; border-top: 1px solid rgba(255,255,255,0.1); }
  .nav-actions > a, .nav-actions > .nav-dropdown { width: 100%; text-align: center; }
  .btn-nav-user { justify-content: center; }
  .hero { min-height: calc(100svh - 68px); padding: 34px 0 44px; }
  .hero-actions { flex-direction: column; }
  .stats-bar { flex-direction: column; text-align: center; }
  .services-grid, .articles-grid, .products-grid, .pillars-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
  .form-card { padding: 24px; }
  .auth-card { padding: 32px 24px; }
  .section { padding: 56px 0; }
}

@media (max-width: 480px) {
  .container { padding: 0 16px; }
  .navbar .container { min-height: 62px; }
  .brand-logo { width: 38px; height: 38px; flex-basis: 38px; }
  .brand-name { max-width: 190px; font-size: 1rem; line-height: 1.35; }
  .nav-menu { top: 62px; max-height: calc(100dvh - 62px); }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .file-chooser { grid-template-columns: 1fr; }
  .file-chooser-name { text-align: center; }
}
@media (max-width: 900px) { .media-library-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 650px) {
  .media-library-modal { padding: 0; }
  .media-library-dialog { width: 100%; max-height: 100dvh; height: 100dvh; border-radius: 0; }
  .media-library-toolbar { align-items: stretch; flex-direction: column; }
  .media-library-toolbar a { justify-content: center; }
  .media-library-grid { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 14px; }
}

/* ── Utility ── */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.text-accent { color: var(--accent); }
.text-muted { color: var(--text-muted); }
.text-primary { color: var(--primary); }
.text-white { color: white; }
.font-bold { font-weight: 700; }
.font-semibold { font-weight: 600; }
.d-flex { display: flex; }
.align-center { align-items: center; }
.justify-between { justify-content: space-between; }
.gap-8 { gap: 8px; }
.gap-12 { gap: 12px; }
.gap-16 { gap: 16px; }
.mt-8 { margin-top: 8px; }
.mt-16 { margin-top: 16px; }
.mt-24 { margin-top: 24px; }
.mt-32 { margin-top: 32px; }
.mb-8 { margin-bottom: 8px; }
.mb-16 { margin-bottom: 16px; }
.mb-24 { margin-bottom: 24px; }
.mb-32 { margin-bottom: 32px; }
.w-100 { width: 100%; }

/* ── Loading ── */
.spinner {
  width: 40px; height: 40px;
  border: 3px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  margin: 40px auto;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Hero Background Pattern ── */
.hero-bg-dots {
  background:
    radial-gradient(rgba(255,255,255,0.08) 1px, transparent 1px),
    linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 44%, var(--primary-light) 100%);
  background-size: 24px 24px;
}
.hero-bg-image {
  background:
    linear-gradient(90deg, rgba(10, 24, 42, 0.94) 0%, rgba(10, 24, 42, 0.72) 52%, rgba(10, 24, 42, 0.32) 100%),
    var(--hero-bg-image) center / cover no-repeat;
}
.rtl .hero-bg-image {
  background:
    linear-gradient(270deg, rgba(10, 24, 42, 0.94) 0%, rgba(10, 24, 42, 0.72) 52%, rgba(10, 24, 42, 0.32) 100%),
    var(--hero-bg-image) center / cover no-repeat;
}
.hero-bg-image::before { display: none; }
@media (max-width: 680px) {
  .hero-bg-image, .rtl .hero-bg-image {
    background:
      linear-gradient(rgba(10, 24, 42, 0.82), rgba(10, 24, 42, 0.9)),
      var(--hero-bg-image-mobile, var(--hero-bg-image)) center / cover no-repeat;
  }
}

/* ── Feature List ── */
.feature-list { display: flex; flex-direction: column; gap: 12px; }
.feature-item { display: flex; align-items: flex-start; gap: 12px; font-size: 0.9rem; }
.feature-check { color: var(--accent); font-size: 1rem; flex-shrink: 0; margin-top: 2px; }

/* ── Highlight Box ── */
.highlight-box {
  background: linear-gradient(135deg, rgba(0,194,168,0.08), rgba(26,47,80,0.05));
  border: 1px solid rgba(0,194,168,0.2);
  border-radius: var(--radius-md);
  padding: 24px 28px;
}
.highlight-box-dark {
  background: rgba(26,47,80,0.06);
  border: 1px solid rgba(26,47,80,0.12);
  border-radius: var(--radius-md);
  padding: 24px 28px;
}

/* Public showcase: services, projects, case studies and solutions */
.showcase-public-detail { background:#fff; }
.showcase-hero,.showcase-list-hero { position:relative; overflow:hidden; color:#fff; background:linear-gradient(125deg,#0b1729 0%,#142c49 58%,#123c4a 100%); }
.showcase-hero { padding:34px 0 78px; }
.showcase-list-hero { padding:34px 0 82px; text-align:center; }
.showcase-hero-grid { position:absolute; inset:0; opacity:.28; background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(to bottom,#000,transparent); }
.showcase-hero-glow { position:absolute; width:520px; height:520px; top:-270px; left:-130px; border-radius:50%; background:rgba(0,194,168,.2); filter:blur(35px); }
.showcase-hero .container,.showcase-list-hero .container { position:relative; z-index:1; }
.showcase-breadcrumb { display:flex; align-items:center; gap:8px; margin-bottom:48px; overflow:hidden; color:rgba(255,255,255,.48); font-size:.73rem; white-space:nowrap; }
.showcase-breadcrumb a { color:rgba(255,255,255,.7); }
.showcase-breadcrumb a:hover { color:#5eead4; }
.showcase-breadcrumb i { font-size:.55rem; opacity:.45; }
.showcase-breadcrumb span { overflow:hidden; text-overflow:ellipsis; }
.showcase-hero-content { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(340px,.82fr); gap:64px; align-items:center; }
.showcase-hero-copy { max-width:720px; }
.showcase-hero-meta { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.showcase-hero-meta span { display:inline-flex; align-items:center; gap:7px; padding:6px 11px; border:1px solid rgba(94,234,212,.2); border-radius:100px; color:#99f6e4; background:rgba(0,194,168,.08); font-size:.7rem; }
.showcase-hero-copy h1 { max-width:750px; margin:0 0 19px; color:#fff; font-size:clamp(2rem,4.3vw,3.55rem); line-height:1.28; letter-spacing:-.035em; }
.showcase-hero-copy > p { max-width:680px; margin:0; color:rgba(255,255,255,.68); font-size:1rem; line-height:2; }
.showcase-hero-actions { display:flex; align-items:center; gap:12px; margin-top:29px; }
.showcase-hero-actions .btn { min-height:46px; padding-inline:20px; }
.showcase-outline-btn { display:inline-flex; align-items:center; gap:8px; min-height:46px; padding:0 18px; border:1px solid rgba(255,255,255,.2); border-radius:var(--radius-sm); color:#fff; font-size:.8rem; font-weight:600; transition:.2s; }
.showcase-outline-btn:hover { border-color:rgba(94,234,212,.55); color:#5eead4; background:rgba(255,255,255,.04); }
.showcase-hero-visual { position:relative; padding:10px; border:1px solid rgba(255,255,255,.12); border-radius:24px; background:rgba(255,255,255,.055); box-shadow:0 30px 70px rgba(0,0,0,.24); transform:rotate(-1.5deg); }
.showcase-hero-visual:before { content:""; position:absolute; inset:22px -18px -18px 22px; z-index:-1; border:1px solid rgba(0,194,168,.22); border-radius:24px; }
.showcase-hero-visual img,.showcase-visual-placeholder { display:block; width:100%; aspect-ratio:4/3; border-radius:16px; object-fit:cover; background:#e8eef3; }
.showcase-visual-placeholder { display:grid; place-items:center; color:#0f766e; font-size:4rem; }
.showcase-visual-label { position:absolute; right:-24px; bottom:28px; display:flex; align-items:center; gap:8px; padding:10px 14px; border-radius:10px; color:#1e293b; background:#fff; box-shadow:0 12px 30px rgba(0,0,0,.2); font-size:.72rem; font-weight:700; }
.showcase-visual-label i { color:#10b981; }
.showcase-detail-body { padding:82px 0 92px; background:linear-gradient(#fff,#fbfcfd); }
.showcase-detail-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:62px; align-items:start; }
.showcase-main-content { min-width:0; }
.showcase-eyebrow { display:inline-flex; align-items:center; gap:8px; color:#009f8a; font-size:.72rem; font-weight:800; letter-spacing:.02em; }
.showcase-eyebrow:before { content:""; width:22px; height:2px; border-radius:2px; background:#00c2a8; }
.showcase-eyebrow.light { color:#5eead4; }
.showcase-list-hero .showcase-eyebrow { justify-content:center; }
.showcase-intro { padding-bottom:56px; border-bottom:1px solid #e8edf2; }
.showcase-intro h2,.showcase-story-heading h2 { margin:9px 0 17px; color:#14263e; font-size:1.65rem; }
.showcase-intro p { margin:0; color:#526176; font-size:.94rem; line-height:2.1; }
.showcase-story { padding:56px 0; }
.showcase-story-heading { margin-bottom:29px; }
.showcase-story-line { position:relative; display:grid; gap:18px; }
.showcase-story-line:before { content:""; position:absolute; top:28px; bottom:28px; right:26px; width:1px; background:linear-gradient(#f59e0b,#f97316,#10b981,#3b82f6); opacity:.35; }
.ltr .showcase-story-line:before { right:auto; left:26px; }
.showcase-story-step { position:relative; display:grid; grid-template-columns:54px 1fr; gap:17px; padding:22px 20px 22px 12px; border:1px solid #e5ebf0; border-radius:15px; background:#fff; box-shadow:0 5px 18px rgba(15,23,42,.025); transition:.22s; }
.showcase-story-step:hover { transform:translateY(-2px); box-shadow:0 14px 30px rgba(15,23,42,.06); }
.step-marker { z-index:1; display:grid; place-items:center; width:54px; height:54px; border:5px solid #fff; border-radius:15px; font-size:1.05rem; box-shadow:0 3px 12px rgba(15,23,42,.09); }
.showcase-story-step.problem .step-marker { color:#b45309; background:#fffbeb; }
.showcase-story-step.challenge .step-marker { color:#c2410c; background:#fff7ed; }
.showcase-story-step.solution .step-marker { color:#047857; background:#ecfdf5; }
.showcase-story-step.outcome .step-marker { color:#1d4ed8; background:#eff6ff; }
.showcase-story-step > div:last-child > span { color:#94a3b8; font:700 .66rem monospace; }
.showcase-story-step h3 { margin:2px 0 7px; color:#1e293b; font-size:1rem; }
.showcase-story-step p { margin:0; color:#64748b; font-size:.82rem; line-height:1.95; }
.showcase-detail-sidebar { position:sticky; top:88px; display:grid; gap:16px; }
.showcase-side-card { padding:21px; border:1px solid #e4eaf0; border-radius:15px; background:#fff; box-shadow:0 8px 25px rgba(15,23,42,.04); }
.showcase-side-title { display:flex; align-items:center; gap:9px; margin-bottom:16px; }
.showcase-side-title i { display:grid; place-items:center; width:34px; height:34px; border-radius:9px; color:#009f8a; background:#ecfdf5; }
.showcase-side-title h2 { margin:0; color:#1e293b; font-size:.85rem; }
.showcase-tech-list { display:flex; flex-wrap:wrap; gap:7px; }
.showcase-tech-list span,.showcase-tags span { padding:6px 9px; border:1px solid #e2e8f0; border-radius:7px; color:#526176; background:#f8fafc; font-size:.68rem; }
.showcase-consult-card { position:relative; overflow:hidden; border-color:#14314a; color:#fff; background:linear-gradient(145deg,#10243a,#173b4a); }
.showcase-consult-card:before { content:""; position:absolute; width:180px; height:180px; left:-90px; bottom:-100px; border-radius:50%; background:rgba(0,194,168,.22); }
.consult-icon { display:grid; place-items:center; width:46px; height:46px; margin-bottom:14px; border-radius:13px; color:#5eead4; background:rgba(0,194,168,.13); font-size:1.2rem; }
.showcase-consult-card h2 { position:relative; margin:0 0 9px; color:#fff; font-size:1.05rem; }
.showcase-consult-card p { position:relative; margin:0 0 18px; color:rgba(255,255,255,.62); font-size:.75rem; line-height:1.85; }
.showcase-consult-card .btn { position:relative; justify-content:center; white-space:normal; }
.showcase-tags { padding:5px 4px; }
.showcase-tags strong { display:block; margin-bottom:10px; color:#475569; font-size:.75rem; }
.showcase-tags > div { display:flex; flex-wrap:wrap; gap:6px; }
.showcase-gallery { padding-top:10px; }
.showcase-gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.showcase-gallery-grid figure { margin:0; overflow:hidden; border-radius:14px; background:#e8eef3; }
.showcase-gallery-grid img { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; transition:.3s; }
.showcase-gallery-grid figure:hover img { transform:scale(1.03); }
.showcase-bottom-cta { padding:50px 0; color:#fff; background:#0c1e31; }
.showcase-bottom-cta .container { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.showcase-bottom-cta span { color:#5eead4; font-size:.7rem; font-weight:700; }
.showcase-bottom-cta h2 { max-width:720px; margin:7px 0 0; color:#fff; font-size:1.45rem; line-height:1.6; }
.showcase-bottom-cta .btn { flex:0 0 auto; }
.showcase-list-hero .showcase-breadcrumb { margin-bottom:42px; text-align:right; }
.showcase-list-hero h1 { margin:11px 0 13px; color:#fff; font-size:clamp(2rem,4vw,3.25rem); }
.showcase-list-hero p { max-width:680px; margin:0 auto; color:rgba(255,255,255,.65); font-size:.92rem; line-height:1.9; }
.showcase-public-list { padding:78px 0 96px; background:#f8fafc; }
.showcase-public-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.showcase-public-card { overflow:hidden; border:1px solid #e2e8f0; border-radius:17px; background:#fff; box-shadow:0 7px 24px rgba(15,23,42,.04); transition:.25s; }
.showcase-public-card:hover { transform:translateY(-5px); border-color:rgba(0,194,168,.32); box-shadow:0 18px 38px rgba(15,23,42,.09); }
.showcase-card-image { position:relative; display:block; overflow:hidden; aspect-ratio:16/10; background:linear-gradient(145deg,#dbe7ee,#edf3f6); }
.showcase-card-image img { width:100%; height:100%; object-fit:cover; transition:.35s; }
.showcase-public-card:hover .showcase-card-image img { transform:scale(1.045); }
.showcase-card-image > span { display:grid; place-items:center; width:100%; height:100%; color:#0f766e; font-size:2.8rem; }
.showcase-card-image small { position:absolute; top:13px; left:13px; padding:5px 9px; border-radius:7px; color:#fff; background:rgba(9,24,40,.72); backdrop-filter:blur(5px); font-size:.68rem; }
.showcase-card-content { padding:21px; }
.showcase-card-category { display:inline-flex; margin-bottom:10px; color:#009f8a; font-size:.67rem; font-weight:700; }
.showcase-card-content h2 { margin:0 0 9px; font-size:1.02rem; line-height:1.65; }
.showcase-card-content h2 a { color:#1e293b; }
.showcase-card-content p { display:-webkit-box; min-height:49px; margin:0 0 15px; overflow:hidden; color:#64748b; font-size:.76rem; line-height:1.85; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.showcase-card-tech { display:flex; flex-wrap:wrap; gap:5px; min-height:26px; margin-bottom:15px; }
.showcase-card-tech span { padding:4px 7px; border-radius:5px; color:#64748b; background:#f1f5f9; font-size:.6rem; }
.showcase-card-link { display:flex; align-items:center; justify-content:space-between; padding-top:13px; border-top:1px solid #edf1f4; color:#008f7d; font-size:.73rem; font-weight:700; }
.showcase-card-link i { transition:.2s; }
.showcase-card-link:hover i { transform:translateX(-4px); }
.showcase-public-empty { padding:70px 20px; text-align:center; color:#64748b; }
.showcase-public-empty i { color:#00a991; font-size:3rem; }
.showcase-public-empty h2 { font-size:1rem; }
@media (max-width:992px) {
  .showcase-hero-content { grid-template-columns:1fr; gap:46px; }
  .showcase-hero-visual { max-width:650px; transform:none; }
  .showcase-detail-layout { grid-template-columns:1fr; gap:35px; }
  .showcase-detail-sidebar { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .showcase-public-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px) {
  .showcase-hero { padding:24px 0 56px; }
  .showcase-list-hero { padding:24px 0 60px; }
  .showcase-breadcrumb { margin-bottom:32px; }
  .showcase-hero-content { gap:38px; }
  .showcase-hero-copy h1 { font-size:2rem; }
  .showcase-hero-copy > p { font-size:.86rem; }
  .showcase-hero-actions { align-items:stretch; flex-direction:column; }
  .showcase-hero-actions > * { justify-content:center; }
  .showcase-visual-label { right:10px; bottom:18px; }
  .showcase-detail-body { padding:58px 0; }
  .showcase-story-step { grid-template-columns:44px 1fr; padding:17px 13px; }
  .step-marker { width:44px; height:44px; }
  .showcase-story-line:before { right:21px; }
  .ltr .showcase-story-line:before { left:21px; }
  .showcase-detail-sidebar { grid-template-columns:1fr; }
  .showcase-gallery-grid,.showcase-public-grid { grid-template-columns:1fr; }
  .showcase-bottom-cta .container { align-items:stretch; flex-direction:column; }
  .showcase-bottom-cta .btn { justify-content:center; }
  .showcase-public-list { padding:52px 0 68px; }
}

/* Contact, consultation, newsletter and lead magnets */
.hp-field { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; clip-path:inset(50%)!important; white-space:nowrap!important; border:0!important; opacity:0!important; pointer-events:none!important; }
.engagement-page { padding:72px 0 92px; background:#f8fafc; }
.engagement-layout { display:grid; grid-template-columns:330px minmax(0,1fr); gap:28px; align-items:start; max-width:1050px; }
.engagement-info { padding:32px; border-radius:18px; color:#fff; background:linear-gradient(145deg,#10243a,#173b4a); box-shadow:0 18px 45px rgba(15,23,42,.12); }
.engagement-info > span { display:grid; place-items:center; width:52px; height:52px; border-radius:14px; color:#5eead4; background:rgba(0,194,168,.14); font-size:1.3rem; }
.engagement-info h2 { margin:20px 0 10px; color:#fff; font-size:1.35rem; }
.engagement-info p { color:rgba(255,255,255,.65); font-size:.8rem; line-height:1.9; }
.engagement-info ul { display:grid; gap:12px; margin-top:25px; padding:0; }
.engagement-info li { display:flex; gap:9px; color:rgba(255,255,255,.8); font-size:.75rem; }
.engagement-info li i { color:#5eead4; }
.engagement-form-card { padding:32px; border:1px solid #e2e8f0; border-radius:18px; background:#fff; box-shadow:0 10px 35px rgba(15,23,42,.06); }
.consultation-form-card { max-width:920px; margin:0 auto; }
.engagement-form-card h2 { margin:0 0 22px; font-size:1.15rem; }
.engagement-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.engagement-form-card .form-group { margin-bottom:17px; }
.engagement-form-card label { display:block; margin-bottom:7px; color:#334155; font-size:.76rem; font-weight:650; }
.engagement-form-card [data-valmsg-for]:not(:empty) { display:block; margin-top:5px; color:#dc2626; font-size:.68rem; }
.engagement-success { display:flex; align-items:center; gap:10px; margin-bottom:22px; padding:13px 15px; border:1px solid #a7f3d0; border-radius:10px; color:#047857; background:#ecfdf5; font-size:.78rem; }
.engagement-success i { font-size:1.15rem; }
.engagement-success strong,.engagement-success span { display:block; }
.engagement-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; max-width:920px; margin:0 auto 22px; }
.engagement-benefits > div { display:flex; align-items:center; gap:11px; padding:15px; border:1px solid #e2e8f0; border-radius:13px; background:#fff; }
.engagement-benefits i { display:grid; place-items:center; width:38px; height:38px; border-radius:10px; color:#009f8a; background:#ecfdf5; }
.engagement-benefits strong,.engagement-benefits small { display:block; }
.engagement-benefits strong { color:#334155; font-size:.75rem; }
.engagement-benefits small { margin-top:2px; color:#94a3b8; font-size:.63rem; }
.engagement-form-heading { display:flex; align-items:center; gap:12px; margin-bottom:25px; padding-bottom:18px; border-bottom:1px solid #edf1f4; }
.engagement-form-heading > span { display:grid; place-items:center; width:42px; height:42px; border-radius:11px; color:#009f8a; background:#ecfdf5; }
.engagement-form-heading h2 { margin:0 0 3px; }
.engagement-form-heading p { margin:0; color:#94a3b8; font-size:.68rem; }
.engagement-submit { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:5px; padding-top:19px; border-top:1px solid #edf1f4; }
.engagement-submit > span { color:#64748b; font-size:.68rem; }
.engagement-submit > span i { color:#10b981; }
.engagement-result { display:grid; place-items:center; min-height:65vh; padding:60px 20px; text-align:center; background:#f8fafc; }
.engagement-result > div { max-width:560px; padding:45px; border:1px solid #e2e8f0; border-radius:18px; background:#fff; }
.engagement-result i { color:#10b981; font-size:3rem; }
.engagement-result h1 { margin:15px 0 25px; font-size:1.25rem; }
.lead-magnet-detail { padding:85px 0; background:linear-gradient(145deg,#f8fafc,#eef6f5); }
.lead-magnet-layout { display:grid; grid-template-columns:minmax(0,1fr) 410px; gap:65px; align-items:center; max-width:1050px; }
.lead-magnet-copy h1 { margin:13px 0 18px; color:#14263e; font-size:2.4rem; line-height:1.4; }
.lead-magnet-copy > p { color:#64748b; line-height:2; }
.lead-magnet-copy ul { display:grid; gap:10px; margin-top:25px; padding:0; }
.lead-magnet-copy li { color:#475569; font-size:.82rem; }
.lead-magnet-copy li i { margin-left:7px; color:#10b981; }
.newsletter-consent { display:flex!important; align-items:center; gap:8px; margin:12px 0 18px!important; font-weight:400!important; }
.footer-newsletter { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-bottom:52px; padding:20px 24px; border:1px solid rgba(255,255,255,.1); border-radius:15px; background:rgba(255,255,255,.045); }
.footer-newsletter > div { display:flex; align-items:center; gap:12px; }
.footer-newsletter > div > i { color:#5eead4; font-size:1.5rem; }
.footer-newsletter strong,.footer-newsletter small { display:block; }
.footer-newsletter strong { color:#fff; font-size:.82rem; }
.footer-newsletter small { margin-top:3px; color:rgba(255,255,255,.5); font-size:.68rem; }
.footer-newsletter form { position:relative; display:flex; width:min(100%,430px); }
.footer-newsletter input[type=email] { width:100%; min-height:43px; padding:9px 13px; border:1px solid rgba(255,255,255,.15); border-radius:9px; color:#fff; background:rgba(255,255,255,.06); font:inherit; }
.footer-newsletter button { min-width:100px; margin-right:7px; border:0; border-radius:9px; color:#062a27; background:#5eead4; font:700 .75rem inherit; cursor:pointer; }
@media(max-width:800px){.engagement-layout,.lead-magnet-layout{grid-template-columns:1fr}.engagement-info{order:2}.footer-newsletter{align-items:stretch;flex-direction:column}.footer-newsletter form{width:100%}}
@media(max-width:600px){.engagement-page{padding:48px 0 65px}.engagement-grid,.engagement-benefits{grid-template-columns:1fr}.engagement-form-card{padding:22px}.engagement-submit{align-items:stretch;flex-direction:column}.engagement-submit .btn{justify-content:center}.lead-magnet-copy h1{font-size:1.8rem}}

/* Digital products and ICT Toolkit Store */
.store-hero,.store-account-hero{position:relative;overflow:hidden;padding:72px 0;color:#fff;text-align:center;background:linear-gradient(125deg,#09182a,#173853 65%,#12505a)}
.store-account-hero{padding:48px 0}.store-hero .container,.store-account-hero .container{position:relative}.store-hero h1,.store-account-hero h1{margin:12px 0;color:#fff;font-size:clamp(2rem,4vw,3.2rem)}.store-hero p,.store-account-hero p{max-width:690px;margin:auto;color:rgba(255,255,255,.65);line-height:1.9}.store-trust{display:flex;justify-content:center;gap:22px;margin-top:27px;color:#99f6e4;font-size:.72rem}.store-trust span{display:flex;align-items:center;gap:6px}
.store-catalog,.store-cart-page,.store-account-page{padding:65px 0 90px;background:#f8fafc}.store-filter{display:flex;align-items:center;gap:10px;margin-bottom:30px;padding:12px;border:1px solid #e2e8f0;border-radius:13px;background:#fff}.store-filter label{position:relative;flex:1}.store-filter label i{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#94a3b8}.store-filter input,.store-filter select{width:100%;min-height:42px;padding:9px 38px 9px 12px;border:1px solid #e2e8f0;border-radius:9px;background:#f8fafc;font:inherit}.store-filter select{width:210px;padding:9px}.store-filter>span{color:#64748b;font-size:.72rem}
.store-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.store-product-card{overflow:hidden;border:1px solid #e2e8f0;border-radius:17px;background:#fff;box-shadow:0 7px 24px rgba(15,23,42,.04);transition:.25s}.store-product-card:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(15,23,42,.09)}.store-product-image{position:relative;display:grid;place-items:center;aspect-ratio:16/10;overflow:hidden;color:#0f766e;background:linear-gradient(145deg,#dce8ee,#edf4f5);font-size:3rem}.store-product-image img{width:100%;height:100%;object-fit:cover;transition:.3s}.store-product-card:hover img{transform:scale(1.04)}.store-product-image b{position:absolute;top:12px;right:12px;padding:5px 9px;border-radius:7px;color:#fff;background:#00a991;font-size:.64rem}.store-product-body{padding:20px}.store-product-body>span{color:#009f8a;font-size:.65rem;font-weight:700}.store-product-body h2{margin:8px 0;font-size:1rem;line-height:1.6}.store-product-body h2 a{color:#1e293b}.store-product-body p{display:-webkit-box;min-height:47px;overflow:hidden;color:#64748b;font-size:.74rem;line-height:1.8;-webkit-line-clamp:2;-webkit-box-orient:vertical}.store-product-body footer{display:flex;align-items:end;justify-content:space-between;margin-top:15px;padding-top:14px;border-top:1px solid #edf1f4}.store-product-body footer div{display:grid}.store-product-body del{color:#94a3b8;font-size:.65rem}.store-product-body strong{color:#14263e;font-size:.9rem}.store-product-body strong small{font-size:.6rem}.store-product-body footer>a{color:#008f7d;font-size:.7rem;font-weight:700}
.store-empty{padding:80px 20px;text-align:center;color:#64748b}.store-empty>i{display:block;margin-bottom:13px;color:#00a991;font-size:3rem}.store-empty h2{margin-bottom:20px;font-size:1rem}
.store-detail{padding:38px 0 90px;background:#fff}.store-breadcrumb{display:flex;gap:8px;margin-bottom:32px;color:#94a3b8;font-size:.7rem}.store-breadcrumb a{color:#64748b}.store-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:45px;align-items:start}.store-detail-cover{display:grid;place-items:center;overflow:hidden;aspect-ratio:16/8;border-radius:18px;color:#0f766e;background:#e8f0f3;font-size:4rem}.store-detail-cover img{width:100%;height:100%;object-fit:cover}.store-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}.store-gallery img{width:100%;aspect-ratio:1;border-radius:9px;object-fit:cover}.store-copy{padding:38px 0}.store-copy h1{margin:10px 0 15px;color:#14263e;font-size:2rem}.store-copy .lead{padding-bottom:24px;border-bottom:1px solid #e8edf2;color:#64748b;font-size:.95rem;line-height:1.9}.store-description{white-space:pre-line;color:#526176;font-size:.85rem;line-height:2}.store-contents{margin-top:28px;padding:22px;border:1px solid #d9eee9;border-radius:14px;background:#f6fffc}.store-contents h2,.store-previews h2{margin:0 0 15px;font-size:1rem}.store-contents ul{display:grid;gap:9px;padding:0}.store-contents li{color:#475569;font-size:.78rem}.store-contents i{margin-left:8px;color:#10b981}.store-buy-card{position:sticky;top:90px;padding:25px;border:1px solid #dfe7ed;border-radius:17px;background:#fff;box-shadow:0 16px 45px rgba(15,23,42,.09)}.store-price{display:grid;margin-bottom:20px;text-align:center}.store-price del{color:#94a3b8;font-size:.75rem}.store-price strong{color:#132a42;font-size:1.8rem}.store-price strong small{font-size:.7rem}.store-buy-card form button{justify-content:center}.store-buy-card ul{display:grid;gap:11px;margin:20px 0 0;padding:18px 0 0;border-top:1px solid #edf1f4}.store-buy-card li{color:#64748b;font-size:.7rem}.store-buy-card li i{margin-left:7px;color:#10b981}.store-view-count{text-align:center;margin-top:13px;color:#94a3b8;font-size:.68rem}.store-previews{margin-top:20px}.store-previews>a{display:flex;align-items:center;gap:11px;margin-bottom:8px;padding:13px;border:1px solid #e2e8f0;border-radius:10px;color:#334155}.store-previews>a>i{color:#009f8a;font-size:1.3rem}.store-previews>a span{flex:1}.store-previews strong,.store-previews small{display:block}.store-previews strong{font-size:.75rem}.store-previews small{margin-top:3px;color:#94a3b8;font-size:.62rem}.store-previews b{color:#008f7d;font-size:.68rem}
.store-cart-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:28px;align-items:start}.store-cart-item{display:flex;align-items:center;gap:14px;margin-bottom:11px;padding:16px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.store-cart-item>div{display:grid;place-items:center;width:70px;height:70px;overflow:hidden;border-radius:10px;color:#0f766e;background:#edf5f5;font-size:1.5rem}.store-cart-item img{width:100%;height:100%;object-fit:cover}.store-cart-item>span{flex:1}.store-cart-item h2{margin:0 0 6px;font-size:.86rem}.store-cart-item h2 a{color:#1e293b}.store-cart-item strong{color:#008f7d;font-size:.76rem}.store-cart-item button{border:0;color:#dc2626;background:none;cursor:pointer}.store-order-summary{position:sticky;top:90px;padding:23px;border:1px solid #e2e8f0;border-radius:15px;background:#fff;box-shadow:0 12px 30px rgba(15,23,42,.06)}.store-order-summary h2{margin:0 0 18px;font-size:1rem}.store-order-summary>div{display:flex;justify-content:space-between;margin-bottom:19px;padding-bottom:17px;border-bottom:1px solid #edf1f4;font-size:.8rem}.store-order-summary form{display:grid;gap:10px}.store-order-summary label{font-size:.7rem}.store-order-summary>p{text-align:center;color:#94a3b8;font-size:.65rem}
.download-library{display:grid;gap:12px}.download-library-item{display:flex;align-items:center;gap:15px;padding:17px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.download-cover{display:grid;place-items:center;width:68px;height:68px;overflow:hidden;border-radius:10px;color:#0f766e;background:#edf5f5;font-size:1.5rem}.download-cover img{width:100%;height:100%;object-fit:cover}.download-info{flex:1}.download-info h2{margin:0 0 8px;font-size:.85rem}.download-info h2 a{color:#1e293b}.download-info>div{display:flex;gap:14px;color:#64748b;font-size:.65rem}.download-disabled{color:#dc2626;font-size:.7rem}
@media(max-width:950px){.store-grid{grid-template-columns:repeat(2,1fr)}.store-detail-grid,.store-cart-grid{grid-template-columns:1fr}.store-buy-card,.store-order-summary{position:static}.store-detail-grid aside{order:-1}}
@media(max-width:620px){.store-filter{align-items:stretch;flex-direction:column}.store-filter select{width:100%}.store-grid{grid-template-columns:1fr}.store-trust{align-items:center;flex-direction:column;gap:8px}.download-library-item{align-items:flex-start;flex-wrap:wrap}.download-info{min-width:calc(100% - 85px)}.download-library-item form{width:100%}.download-library-item form button{width:100%;justify-content:center}}
.customer-orders{display:grid;gap:11px}.customer-order-card{display:grid;grid-template-columns:48px minmax(0,1fr) auto auto 20px;gap:14px;align-items:center;padding:17px;border:1px solid #e2e8f0;border-radius:14px;color:#334155;background:#fff;transition:.2s}.customer-order-card:hover{transform:translateY(-2px);border-color:#99f6e4;box-shadow:0 10px 25px rgba(15,23,42,.06)}.customer-order-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:11px;color:#009f8a;background:#ecfdf5;font-size:1.2rem}.customer-order-card>div:nth-child(2) strong,.customer-order-card>div:nth-child(2) span{display:block}.customer-order-card>div:nth-child(2) strong{font:700 .72rem monospace}.customer-order-card>div:nth-child(2) span{margin-top:5px;color:#94a3b8;font-size:.65rem}.customer-order-card>b{font-size:.8rem}.customer-order-card>b small{font-size:.58rem}.customer-order-card em,.customer-order-detail header span{padding:5px 8px;border-radius:20px;font-size:.62rem;font-style:normal}.customer-order-card em.paid,.customer-order-detail header span.paid{color:#047857;background:#ecfdf5}.customer-order-card em.pending,.customer-order-detail header span.pending{color:#b45309;background:#fffbeb}.customer-order-card em.failed{color:#b91c1c;background:#fef2f2}.store-back-link{display:inline-flex;gap:7px;margin-bottom:18px;color:#64748b;font-size:.72rem}.customer-order-detail{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start}.customer-order-detail>section,.customer-order-detail>aside{padding:21px;border:1px solid #e2e8f0;border-radius:15px;background:#fff}.customer-order-detail header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid #edf1f4}.customer-order-detail h2{margin:0;font-size:.92rem}.customer-order-line{display:flex;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid #edf1f4}.customer-order-line>i{color:#009f8a;font-size:1.15rem}.customer-order-line span{flex:1}.customer-order-line strong,.customer-order-line small{display:block}.customer-order-line strong{font-size:.75rem}.customer-order-line small{margin-top:3px;color:#94a3b8;font-size:.62rem}.customer-order-line>b{font-size:.72rem}.customer-order-detail aside{position:sticky;top:90px}.customer-order-detail aside h2{margin-bottom:17px}.customer-order-detail dl div{display:flex;justify-content:space-between;padding:9px 0;color:#64748b;font-size:.72rem}.customer-order-detail dl dd{margin:0}.customer-order-detail dl .discount{color:#10b981}.customer-order-detail dl .total{margin-top:8px;padding-top:15px;border-top:1px solid #e2e8f0;color:#1e293b;font-weight:700}.payment-security{margin-top:15px;color:#94a3b8;font-size:.62rem;line-height:1.7}.payment-security i{color:#10b981}@media(max-width:700px){.customer-order-card{grid-template-columns:42px 1fr auto}.customer-order-card>b{grid-column:2}.customer-order-card em{grid-column:3;grid-row:1}.customer-order-card>i{display:none}.customer-order-detail{grid-template-columns:1fr}.customer-order-detail aside{position:static}}

/* Home visual content */
.home-hero-copy-only{display:block}.home-hero-copy-only .hero-content{max-width:760px;margin-inline:auto;text-align:center}.home-hero-copy-only .hero-actions{justify-content:center}.home-hero-copy-only .stats-bar{max-width:720px;margin-inline:auto}
.home-hero-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:55px;align-items:center}.home-hero-layout .hero-content{max-width:none}.home-hero-visual{position:relative;padding:9px;border:1px solid rgba(255,255,255,.12);border-radius:25px;background:rgba(255,255,255,.055);box-shadow:0 28px 70px rgba(0,0,0,.24);transform:perspective(900px) rotateY(4deg)}.home-hero-visual picture,.home-hero-visual img{display:block;width:100%}.home-hero-visual img{border-radius:18px}.home-hero-float{position:absolute;display:flex;align-items:center;gap:9px;padding:10px 13px;border-radius:11px;color:#17314a;background:#fff;box-shadow:0 12px 28px rgba(0,0,0,.22)}.home-hero-float.top{top:42px;right:-25px}.home-hero-float.bottom{bottom:40px;left:-25px}.home-hero-float>i{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;color:#008f7d;background:#ecfdf5}.home-hero-float strong,.home-hero-float small{display:block}.home-hero-float strong{font-size:.68rem}.home-hero-float small{margin-top:3px;color:#64748b;font-size:.58rem}.home-lab-showcase{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:center;margin-top:38px;padding:24px;border:1px solid #dbe5eb;border-radius:20px;background:#fff;box-shadow:0 14px 35px rgba(15,23,42,.05)}.home-lab-showcase img{width:100%;border-radius:15px}.home-lab-showcase span{color:#009f8a;font-size:.7rem;font-weight:800}.home-lab-showcase h3{margin:8px 0 11px;color:#14263e;font-size:1.35rem}.home-lab-showcase p{color:#64748b;font-size:.8rem;line-height:1.9}.home-lab-showcase a{color:#008f7d;font-size:.75rem;font-weight:700}@media(max-width:950px){.home-hero-layout{grid-template-columns:1fr}.home-hero-visual{max-width:680px;transform:none}.home-hero-layout .stats-bar{max-width:680px}}@media(max-width:650px){.home-hero-visual{margin-top:10px}.home-hero-float{display:none}.home-lab-showcase{grid-template-columns:1fr;padding:16px}}
.home-hero-layout.home-hero-background-layout{display:block}.home-hero-background-layout .hero-content{max-width:690px}.home-hero-background-layout .stats-bar{max-width:690px}
.home-hero-layout.home-hero-copy-only{display:block}.home-hero-layout.home-hero-copy-only .hero-content{max-width:760px;margin-inline:auto;text-align:center}.home-hero-layout.home-hero-copy-only .hero-actions{justify-content:center}.home-hero-layout.home-hero-copy-only .stats-bar{margin-inline:auto}

/* Performance and layout stability */
img { height: auto; }
img[width][height] { aspect-ratio: attr(width) / attr(height); }
.store-product-image img, .article-card-img, .showcase-card-image img { object-fit: cover; }
.section, .showcase-public-card, .article-card, .store-product-card { content-visibility: auto; contain-intrinsic-size: auto 420px; }
.error-page { min-height: 65vh; display: grid; place-items: center; padding: 48px 20px; text-align: center; }
.error-card { width: min(680px, 100%); }
.error-code { display: block; font-size: clamp(5rem, 16vw, 9rem); line-height: .9; font-weight: 900; color: var(--border); }
.error-kicker { color: var(--accent); font-weight: 700; margin: 20px 0 8px; }
.error-card h1 { margin-bottom: 12px; }
.error-card > p { color: var(--text-muted); line-height: 1.8; }
.error-card nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 24px; }
.error-search { display: flex; gap: 8px; max-width: 480px; margin: 24px auto; }
.error-search input { flex: 1; min-width: 0; padding: 10px 14px; border: 1px solid var(--border); border-radius: 8px; }
.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; }

/* Long-form writing produced by the specialized content center */
.article-content,
.cms-content,
.news-detail-content {
  text-align: justify;
  text-align-last: start;
  text-justify: inter-word;
  overflow-wrap: break-word;
}

.article-content :is(h1, h2, h3, h4, h5, h6, pre, table, figure, figcaption),
.cms-content :is(h1, h2, h3, h4, h5, h6, pre, table, figure, figcaption),
.news-detail-content :is(h1, h2, h3, h4, h5, h6, pre, table, figure, figcaption) {
  text-align: start;
  text-align-last: auto;
}

.home-work-tile-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.home-work-tile {
  position: relative;
  min-width: 0;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 16px;
  background: #17212b;
  box-shadow: 0 12px 30px rgba(15,23,42,.12);
}
.home-work-tile-link,
.home-work-tile-link > img,
.home-work-tile-shade {
  position: absolute;
  inset: 0;
}
.home-work-tile-link { display: block; color: #fff; }
.home-work-tile-link > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease, filter .45s ease;
}
.home-work-tile-shade {
  background:
    linear-gradient(180deg, rgba(5,12,20,.08) 0%, rgba(5,12,20,.32) 42%, rgba(5,12,20,.94) 100%),
    linear-gradient(90deg, rgba(5,12,20,.28), transparent 60%);
  transition: background-color .3s ease;
}
.home-work-tile-content {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 22px;
}
.home-work-tile-type {
  align-self: flex-start;
  margin-bottom: auto;
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 999px;
  color: #fff;
  background: rgba(10,19,29,.42);
  backdrop-filter: blur(8px);
  font-size: .68rem;
  font-weight: 700;
}
.home-work-tile-content > strong {
  display: -webkit-box;
  overflow: hidden;
  color: #fff;
  font-size: clamp(1rem, 1.55vw, 1.28rem);
  line-height: 1.75;
  text-shadow: 0 2px 10px rgba(0,0,0,.45);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.home-work-tile-summary {
  display: -webkit-box;
  overflow: hidden;
  margin-top: 7px;
  color: rgba(255,255,255,.76);
  font-size: .72rem;
  line-height: 1.75;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.home-work-tile-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.9);
  font-size: .68rem;
  font-weight: 650;
}
.home-work-tile-footer > span { display: inline-flex; align-items: center; gap: 6px; }
.home-work-tile:hover .home-work-tile-link > img,
.home-work-tile:focus-within .home-work-tile-link > img { transform: scale(1.055); filter: saturate(1.08); }
.home-work-tile:hover,
.home-work-tile:focus-within { box-shadow: 0 20px 42px rgba(15,23,42,.2); }
.home-work-tile-link:focus-visible { outline: 3px solid var(--accent); outline-offset: -4px; }
@media (max-width: 980px) {
  .home-work-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .home-work-tile-grid { grid-template-columns: 1fr; gap: 14px; }
  .home-work-tile { aspect-ratio: 16 / 11; }
  .home-work-tile-content { padding: 18px; }
}

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