/* ============================================================
   Aviator UAE — WordPress Theme
   ============================================================ */

/* ---- WP Standard Content ---- */
.avn-standard-content h2 { font-family:var(--face-display);font-size:25px;font-weight:700;color:var(--silver-1);margin:38px 0 14px;padding-bottom:8px;border-bottom:1px solid rgba(200,30,40,.3);letter-spacing:.5px;text-transform:uppercase; }
.avn-standard-content h2:first-child { margin-top:0; }
.avn-standard-content h3 { font-family:var(--face-display);font-size:20px;color:var(--silver-2);margin:24px 0 10px;text-transform:uppercase; }
.avn-standard-content p  { color:var(--text-2);font-size:15.5px;line-height:1.95;margin-bottom:14px; }
.avn-standard-content ul { padding-left:22px;margin-bottom:16px; }
.avn-standard-content ul li { color:var(--text-2);font-size:15px;line-height:1.85;margin-bottom:8px; }
.avn-standard-content ul li::marker { color:var(--crimson-4); }
.avn-standard-content strong { color:var(--silver-1);font-weight:700; }

/* ---- Locale switcher (WP) ---- */
.avn-locale { display:flex;align-items:center;gap:2px;background:var(--ink-2);border:1px solid rgba(200,30,40,.35);border-radius:var(--rad-md);padding:3px;flex-shrink:0;position:relative; }
.avn-locale__btn { display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:6px;font-size:13px;font-weight:700;color:var(--text-3);background:none;border:none;cursor:pointer;white-space:nowrap;line-height:1; }
.avn-locale__btn:hover { color:var(--silver-1);background:rgba(255,60,80,.16); }
.avn-locale__flag { font-size:15px; }
.avn-locale__menu { display:none;position:absolute;top:calc(100% + 6px);right:0;background:var(--ink-2);border:1px solid rgba(200,30,40,.4);border-radius:var(--rad-md);padding:6px;min-width:120px;z-index:999; }
.avn-locale--polylang:hover .avn-locale__menu { display:block; }
.avn-locale__item { display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;color:var(--text-2);font-size:13px;transition:all .15s; }
.avn-locale__item:hover { background:rgba(255,60,80,.15);color:var(--silver-1); }
.avn-locale__item.is-current { color:var(--silver-1); }
.avn-locale--static { cursor:default; }

/* ---- Play band ---- */
.avn-play-band { background:linear-gradient(135deg,var(--crimson-1) 0%,var(--ink-1) 50%,var(--crimson-1) 100%);border-top:1px solid rgba(200,30,40,.3);border-bottom:1px solid rgba(200,30,40,.3); }

/* Sparks global */
.arn-stage__sparks--global { position:fixed;inset:0;z-index:0;pointer-events:none; }

/* ============================================================
   AVIATOR — theme.css
   EN (root) + AR (/ar/) — full mobile-ready stylesheet
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;700;900&family=Rajdhani:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

/* ---- Tokens ---- */
:root {
  --ink-0:      #050810;
  --ink-1:      #0B0F1C;
  --ink-2:      #14192B;
  --ink-3:      #1D2440;

  --crimson-1:  #4A0E11;
  --crimson-2:  #8E1820;
  --crimson-3:  #C8202B;
  --crimson-4:  #FF2C3A;

  --thunder-1:  #FF3344;
  --thunder-2:  #FF5566;
  --thunder-3:  #FF8090;

  --silver-1:   #E8EDF5;
  --silver-2:   #B8C2D1;
  --silver-3:   #6C7891;

  --steel-1:    #2A3149;
  --steel-2:    #3B4565;

  --gold-1:     #F0C040;
  --gold-2:     #F5D880;

  --paper:      #F5F8FF;
  --text-1:     #DCE4F2;
  --text-2:     #94A0B9;
  --text-3:     #5C6680;

  --rad-xl: 22px; --rad-lg: 14px; --rad-md: 9px; --rad-sm: 5px;

  --face-body:    'Inter', 'Cairo', sans-serif;
  --face-rtl:     'Cairo', sans-serif;
  --face-display: 'Rajdhani', 'Cairo', sans-serif;
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 74px; }
body {
  font-family: var(--face-body);
  background: var(--ink-0);
  color: var(--text-1);
  line-height: 1.7;
  overflow-x: hidden;
}
[dir="rtl"] body { font-family: var(--face-rtl); }
img { max-width: 100%; display: block; }
a { color: var(--thunder-2); text-decoration: none; transition: color .22s; }
a:hover { color: var(--thunder-3); }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--ink-1); }
::-webkit-scrollbar-thumb { background: var(--crimson-2); border-radius: 3px; }

/* ============================================================
   TOPBAR
   ============================================================ */
.arn-topbar {
  position: sticky;
  top: 0;
  z-index: 900;
  background: rgba(5,8,16,.96);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(200,30,40,.4);
}

.arn-topbar__row {
  max-width: 1260px;
  margin: 0 auto;
  height: 74px;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 0 22px;
}

.arn-topbar__brand { flex-shrink: 0; line-height: 0; }
.arn-topbar__brand img {
  height: 52px;
  width: auto;
  filter: drop-shadow(0 0 12px rgba(255,60,80,.45));
}

/* Desktop menu */
.arn-topbar__menu {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1;
}
.arn-menu__link {
  color: var(--text-2);
  font-size: 14px;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: var(--rad-sm);
  border: 1px solid transparent;
  white-space: nowrap;
  transition: all .22s;
  letter-spacing: .3px;
}
.arn-menu__link:hover,
.arn-menu__link.is-active {
  color: var(--silver-1);
  border-color: rgba(200,30,40,.5);
  background: rgba(200,30,40,.18);
}
[dir="rtl"] .arn-menu__link { letter-spacing: 0; }

/* Right side cluster */
.arn-topbar__tools {
  display: flex;
  align-items: center;
  gap: 11px;
  flex-shrink: 0;
  margin-left: auto;
}
[dir="rtl"] .arn-topbar__tools { margin-left: 0; margin-right: auto; }

/* Locale switch */
.arn-locale {
  display: flex;
  align-items: center;
  gap: 2px;
  background: var(--ink-2);
  border: 1px solid rgba(200,30,40,.35);
  border-radius: var(--rad-md);
  padding: 3px;
  flex-shrink: 0;
}
.arn-locale__opt {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-3);
  transition: all .22s;
  white-space: nowrap;
  line-height: 1;
}
.arn-locale__opt:hover { color: var(--silver-1); background: rgba(255,60,80,.16); }
.arn-locale__opt.is-current {
  background: linear-gradient(135deg, var(--crimson-2), var(--crimson-4));
  color: var(--paper);
}
.arn-locale__flag { font-size: 15px; }

/* Topbar CTA */
.arn-topbar__cta { display: inline-flex; }

/* Burger */
.arn-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  background: none;
  border: 1px solid rgba(200,30,40,.4);
  border-radius: var(--rad-sm);
  cursor: pointer;
  padding: 8px;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  order: 10;
}
.arn-burger span {
  display: block;
  height: 2px;
  background: var(--silver-1);
  border-radius: 2px;
  transition: all .3s ease;
  transform-origin: center;
}
.arn-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.arn-burger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.arn-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Drawer (mobile menu) */
.arn-drawer {
  display: none;
  position: fixed;
  top: 74px;
  left: 0; right: 0;
  background: rgba(5,8,16,.98);
  border-bottom: 2px solid rgba(200,30,40,.5);
  backdrop-filter: blur(16px);
  z-index: 899;
  padding: 14px 22px 18px;
}
.arn-drawer.is-open { display: block; }
.arn-drawer .arn-menu__link {
  display: block;
  width: 100%;
  padding: 12px 14px;
  font-size: 15px;
  border-radius: var(--rad-md);
  margin-bottom: 4px;
}
.arn-drawer__cta {
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid rgba(200,30,40,.35);
}
.arn-drawer__cta .arn-btn { width: 100%; justify-content: center; font-size: 15px; }

/* ============================================================
   BUTTONS
   ============================================================ */
.arn-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--face-body);
  font-weight: 700;
  font-size: 15px;
  border: none;
  border-radius: var(--rad-md);
  cursor: pointer;
  transition: all .26s;
  white-space: nowrap;
  padding: 13px 26px;
  text-decoration: none;
  letter-spacing: .3px;
  line-height: 1;
}
[dir="rtl"] .arn-btn { font-family: var(--face-rtl); letter-spacing: 0; }

.arn-btn--ghost {
  background: rgba(20,25,43,.85);
  color: var(--silver-1);
  border: 2px solid var(--crimson-4);
  box-shadow: 0 4px 16px rgba(255,44,58,.22);
}
.arn-btn--ghost:hover {
  background: rgba(45,30,50,.95);
  border-color: var(--thunder-1);
  box-shadow: 0 6px 26px rgba(255,80,100,.42);
  transform: translateY(-2px);
  color: var(--silver-1);
}
.arn-btn--prime {
  background: linear-gradient(135deg, #8E1820 0%, #C8202B 50%, #FF2C3A 100%);
  color: var(--paper);
  box-shadow: 0 4px 22px rgba(255,44,58,.5), inset 0 1px 0 rgba(255,255,255,.18);
  text-shadow: 0 1px 3px rgba(0,0,0,.5);
  overflow: hidden;
  position: relative;
}
.arn-btn--prime::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.18) 50%, transparent 65%);
  transform: skewX(-15deg) translateX(-140%);
  transition: transform .58s;
}
.arn-btn--prime:hover::after { transform: skewX(-15deg) translateX(260%); }
.arn-btn--prime:hover {
  background: linear-gradient(135deg, #A21D26 0%, #DC2532 50%, #FF4554 100%);
  box-shadow: 0 7px 30px rgba(255,55,75,.62);
  transform: translateY(-2px);
  color: var(--paper);
}
.arn-btn--xl  { padding: 17px 38px; font-size: 17px; border-radius: var(--rad-lg); }
.arn-btn--sm  { padding: 8px 16px; font-size: 13px; }

/* ============================================================
   STAGE (hero)
   ============================================================ */
.arn-stage {
  position: relative;
  min-height: 620px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.arn-stage__bg {
  position: absolute; inset: 0;
  background-image: url('images/sky-runway.webp');
  background-size: cover;
  background-position: center;
  z-index: 0;
}
.arn-stage__bg::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(5,8,16,.94) 0%, rgba(15,15,30,.62) 45%, rgba(5,8,16,.35) 100%);
}
[dir="rtl"] .arn-stage__bg::after {
  background: linear-gradient(260deg, rgba(5,8,16,.94) 0%, rgba(15,15,30,.62) 45%, rgba(5,8,16,.35) 100%);
}

/* AR sub-pages use ../images */
.is-rtl-page .arn-stage__bg { background-image: url('../images/sky-runway.webp'); }
.is-rtl-page .arn-banner__bg { background-image: url('../images/cockpit-banner.webp'); }

/* Sparks */
.arn-stage__sparks { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.arn-spark {
  position: absolute; border-radius: 50%;
  background: radial-gradient(circle, var(--silver-1) 0%, var(--thunder-1) 60%, transparent 100%);
  animation: arn-rise linear infinite; opacity: 0;
}
.arn-spark:nth-child(1) { left:7%;  bottom:0; width:5px; height:5px; animation-duration:4.5s; animation-delay:0s; }
.arn-spark:nth-child(2) { left:20%; bottom:0; width:7px; height:7px; animation-duration:6s;   animation-delay:.9s; }
.arn-spark:nth-child(3) { left:34%; bottom:0; width:4px; height:4px; animation-duration:5.1s; animation-delay:2.2s; }
.arn-spark:nth-child(4) { left:51%; bottom:0; width:6px; height:6px; animation-duration:4.8s; animation-delay:.5s; }
.arn-spark:nth-child(5) { left:67%; bottom:0; width:5px; height:5px; animation-duration:5.7s; animation-delay:1.7s; }
.arn-spark:nth-child(6) { left:84%; bottom:0; width:4px; height:4px; animation-duration:4.3s; animation-delay:3s; }
@keyframes arn-rise {
  0%   { transform:translateY(0) scale(1); opacity:0; }
  10%  { opacity:.9; }
  80%  { opacity:.4; }
  100% { transform:translateY(-520px) scale(.18); opacity:0; }
}

.arn-stage__grid {
  position: relative; z-index: 2;
  max-width: 1260px;
  margin: 0 auto;
  padding: 90px 24px 110px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
  width: 100%;
}
[dir="rtl"] .arn-stage__grid { direction: rtl; }

.arn-pill {
  display: inline-block;
  background: linear-gradient(90deg, var(--crimson-1), var(--crimson-2));
  border: 1px solid var(--crimson-4);
  color: var(--silver-1);
  font-size: 12px;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 22px;
  margin-bottom: 18px;
  letter-spacing: .5px;
  text-transform: uppercase;
}
[dir="rtl"] .arn-pill { letter-spacing: 0; }
.arn-stage__title {
  font-family: var(--face-display);
  font-size: clamp(40px, 5.5vw, 74px);
  font-weight: 700;
  line-height: 1.04;
  color: var(--paper);
  margin-bottom: 12px;
  text-shadow: 0 2px 24px rgba(255,44,58,.5);
  letter-spacing: 1.5px;
  text-transform: uppercase;
}
[dir="rtl"] .arn-stage__title { letter-spacing: 0; text-transform: none; }
.arn-stage__accent {
  display: block;
  background: linear-gradient(90deg, var(--crimson-4), var(--silver-1));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.arn-stage__lead {
  font-size: 17px;
  color: var(--text-2);
  margin-bottom: 38px;
  line-height: 1.8;
}
.arn-stage__cta { display: flex; gap: 14px; flex-wrap: wrap; }

.arn-stage__art { display: flex; align-items: center; justify-content: center; }
.arn-stage__art img {
  max-height: 440px;
  width: 100%;
  object-fit: contain;
  filter: drop-shadow(0 12px 50px rgba(255,55,75,.35));
  animation: arn-glide 4s ease-in-out infinite;
}
@keyframes arn-glide {
  0%,100% { transform:translateY(0) rotate(-2deg); }
  50%     { transform:translateY(-18px) rotate(2deg); }
}

/* ============================================================
   BLOCKS
   ============================================================ */
.arn-block { padding: 80px 24px; }
.arn-block--alt { background: linear-gradient(180deg, var(--ink-1) 0%, var(--ink-0) 100%); }
.arn-block__body { max-width: 1260px; margin: 0 auto; }
.arn-block__head { text-align: center; margin-bottom: 48px; }
.arn-h2 {
  font-family: var(--face-display);
  font-size: clamp(26px, 3.5vw, 44px);
  font-weight: 700;
  color: var(--paper);
  letter-spacing: 1px;
  margin-bottom: 10px;
  text-transform: uppercase;
}
[dir="rtl"] .arn-h2 { letter-spacing: 0; text-transform: none; }
.arn-h2::after {
  content: '';
  display: block;
  width: 60px; height: 3px;
  background: linear-gradient(90deg, var(--crimson-4), var(--silver-1));
  border-radius: 2px;
  margin: 14px auto 0;
}
.arn-block__lead {
  color: var(--text-2);
  font-size: 16px;
  max-width: 580px;
  margin: 0 auto;
  line-height: 1.8;
}

/* ============================================================
   SPEC TABLE
   ============================================================ */
.arn-spec {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--rad-lg);
  border: 1px solid rgba(200,30,40,.32);
  box-shadow: 0 0 44px rgba(255,44,58,.22);
}
.arn-spec__table {
  width: 100%;
  min-width: 480px;
  border-collapse: collapse;
  font-size: 15px;
}
.arn-spec__table th,
.arn-spec__table td {
  padding: 15px 22px;
  text-align: left;
  border-bottom: 1px solid rgba(60,70,100,.5);
  white-space: nowrap;
}
[dir="rtl"] .arn-spec__table th,
[dir="rtl"] .arn-spec__table td { text-align: right; }
.arn-spec__table thead tr {
  background: linear-gradient(90deg, var(--crimson-1), var(--crimson-2));
}
.arn-spec__table thead th {
  color: var(--silver-1); font-size: 13px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .6px;
  border-bottom: 2px solid var(--crimson-4);
}
[dir="rtl"] .arn-spec__table thead th { letter-spacing: 0; }
.arn-spec__table tbody tr { background: var(--ink-2); transition: background .22s; }
.arn-spec__table tbody tr:nth-child(even) { background: var(--ink-3); }
.arn-spec__table tbody tr:hover { background: rgba(60,30,40,.85); }
.arn-spec__table td:first-child { color: var(--text-2); font-weight: 700; width: 44%; }
.arn-spec__table td:last-child { color: var(--silver-1); font-weight: 700; }
.arn-chip {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 12px;
  font-size: 12px; font-weight: 700;
}
.arn-chip--red   { background: rgba(255,44,58,.15);  border: 1px solid var(--crimson-3); color: var(--thunder-2); }
.arn-chip--gold  { background: rgba(240,192,64,.14); border: 1px solid var(--gold-1);    color: var(--gold-2); }
.arn-chip--ok    { background: rgba(40,210,120,.14); border: 1px solid rgba(40,210,120,.4); color: #5dffaa; }

/* ============================================================
   FRAME (demo iframe)
   ============================================================ */
.arn-frame {
  max-width: 920px;
  margin: 0 auto;
  border-radius: var(--rad-xl);
  overflow: hidden;
  border: 2px solid var(--crimson-2);
  box-shadow: 0 0 60px rgba(200,30,40,.3), 0 0 120px rgba(70,15,25,.18);
  position: relative;
}
.arn-frame::before {
  content: '';
  position: absolute; inset: -2px;
  border-radius: inherit;
  background: linear-gradient(135deg, var(--crimson-4), var(--crimson-1), var(--silver-3));
  z-index: -1; opacity: .45;
}
.arn-frame iframe {
  display: block; width: 100%; height: 560px;
  border: none; background: var(--ink-0);
}
.arn-frame__note {
  text-align: center;
  color: var(--text-3);
  font-size: 13px;
  margin-top: 14px;
}

/* ============================================================
   ABOUT
   ============================================================ */
.arn-about {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 56px;
  align-items: start;
}
[dir="rtl"] .arn-about { direction: rtl; }

.arn-about__body h3 {
  font-family: var(--face-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--silver-1);
  margin: 28px 0 10px;
  letter-spacing: .4px;
  text-transform: uppercase;
}
[dir="rtl"] .arn-about__body h3 { letter-spacing: 0; text-transform: none; }
.arn-about__body h3:first-child { margin-top: 0; }
.arn-about__body p {
  color: var(--text-2); font-size: 15px;
  line-height: 1.9; margin-bottom: 10px;
}

.arn-perks {
  list-style: none;
  display: flex; flex-direction: column;
  gap: 10px; margin-top: 14px;
}
.arn-perks li {
  display: flex; align-items: flex-start; gap: 12px;
  background: var(--ink-2);
  border: 1px solid rgba(60,70,100,.45);
  border-radius: var(--rad-md);
  padding: 12px 15px;
  font-size: 15px; color: var(--text-2);
}
.arn-perks li .arn-perks__ico { flex-shrink: 0; margin-top: 2px; }

/* Sidebar (desktop) */
.arn-about__aside {
  position: sticky;
  top: 90px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.arn-about__aside img {
  border-radius: var(--rad-lg);
  box-shadow: 0 8px 40px rgba(255,55,75,.22);
  width: 100%;
  object-fit: cover;
}

/* Mobile inline */
.arn-about__pic {
  display: none;
  margin: 22px 0 4px;
}
.arn-about__pic img {
  border-radius: var(--rad-lg);
  box-shadow: 0 6px 28px rgba(255,55,75,.2);
  width: 100%;
  object-fit: cover;
  max-height: 220px;
}

/* ============================================================
   STATS STRIP
   ============================================================ */
.arn-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 28px;
}
.arn-stats__cell {
  background: var(--ink-2);
  border: 1px solid rgba(60,70,100,.4);
  border-radius: var(--rad-lg);
  padding: 22px 16px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.arn-stats__cell::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--crimson-4), var(--thunder-2));
}
.arn-stats__num {
  font-family: var(--face-display);
  font-size: 34px; font-weight: 700;
  color: var(--silver-1);
  letter-spacing: 1px;
}
.arn-stats__lbl {
  color: var(--text-3); font-size: 13px;
  text-transform: uppercase; letter-spacing: .6px;
  margin-top: 4px;
}
[dir="rtl"] .arn-stats__num,
[dir="rtl"] .arn-stats__lbl { letter-spacing: 0; text-transform: none; }

/* ============================================================
   STRATEGY CARDS
   ============================================================ */
.arn-tactics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: 8px;
}
.arn-tactic {
  background: var(--ink-2);
  border: 1px solid rgba(60,70,100,.45);
  border-radius: var(--rad-lg);
  padding: 26px 22px;
  position: relative;
  transition: transform .25s, box-shadow .25s;
  overflow: hidden;
}
.arn-tactic:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 40px rgba(255,44,58,.2);
}
.arn-tactic__pic {
  height: 160px;
  margin: -26px -22px 18px;
  background-size: cover;
  background-position: center;
  position: relative;
}
.arn-tactic__pic::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 40%, var(--ink-2) 100%);
}
.arn-tactic h3 {
  font-family: var(--face-display);
  font-size: 20px; font-weight: 700;
  color: var(--silver-1);
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: .5px;
}
[dir="rtl"] .arn-tactic h3 { letter-spacing: 0; text-transform: none; }
.arn-tactic p {
  color: var(--text-2); font-size: 14.5px;
  line-height: 1.75;
}

/* ============================================================
   BANNER
   ============================================================ */
.arn-banner {
  position: relative;
  min-height: 260px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  padding: 0 24px 36px;
}
.arn-banner__bg {
  position: absolute; inset: 0;
  background-image: url('images/cockpit-banner.webp');
  background-size: cover;
  background-position: center;
  opacity: .45;
}
.arn-banner__bg::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(5,8,16,.25) 0%, rgba(5,8,16,.95) 100%);
}
.arn-banner__body {
  position: relative; z-index: 2;
  max-width: 1260px;
  margin: 0 auto; width: 100%;
}
.arn-crumb { color: var(--text-3); font-size: 13px; margin-bottom: 10px; }
.arn-crumb a { color: var(--text-3); }
.arn-crumb a:hover { color: var(--thunder-2); }
.arn-banner .arn-h2 { text-align: left; }
.arn-banner .arn-h2::after { margin-left: 0; }
[dir="rtl"] .arn-banner .arn-h2 { text-align: right; }
[dir="rtl"] .arn-banner .arn-h2::after { margin-right: 0; margin-left: auto; }

/* ============================================================
   ARTICLE (history / terms)
   ============================================================ */
.arn-article {
  max-width: 860px;
  margin: 0 auto;
  padding: 56px 24px 88px;
}
.arn-article h2 {
  font-family: var(--face-display);
  font-size: 25px; font-weight: 700;
  color: var(--silver-1);
  margin: 38px 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(200,30,40,.3);
  letter-spacing: .5px;
  text-transform: uppercase;
}
[dir="rtl"] .arn-article h2 { letter-spacing: 0; text-transform: none; }
.arn-article h2:first-child { margin-top: 0; }
.arn-article p  { color: var(--text-2); font-size: 15.5px; line-height: 1.95; margin-bottom: 14px; }
.arn-article img {
  border-radius: var(--rad-lg);
  margin: 26px 0;
  box-shadow: 0 6px 32px rgba(255,55,75,.2);
  width: 100%; max-height: 320px; object-fit: cover;
}
.arn-article ul  { padding-left: 22px; margin-bottom: 16px; }
[dir="rtl"] .arn-article ul { padding-left: 0; padding-right: 22px; }
.arn-article ul li { color: var(--text-2); font-size: 15px; line-height: 1.85; margin-bottom: 8px; }
.arn-article ul li::marker { color: var(--crimson-4); }
.arn-article strong { color: var(--silver-1); font-weight: 700; }

/* Track (timeline) */
.arn-track {
  margin: 28px 0;
  border-left: 3px solid var(--crimson-2);
  padding-left: 26px;
}
[dir="rtl"] .arn-track {
  border-left: none; border-right: 3px solid var(--crimson-2);
  padding-left: 0; padding-right: 26px;
}
.arn-track__item { position: relative; margin-bottom: 26px; }
.arn-track__item::before {
  content: '';
  position: absolute; left: -34px; top: 5px;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--crimson-4); border: 2px solid var(--silver-1);
  box-shadow: 0 0 10px rgba(255,44,58,.6);
}
[dir="rtl"] .arn-track__item::before { left: auto; right: -34px; }
.arn-track__year  { font-size: 12px; color: var(--thunder-2); font-weight: 700; margin-bottom: 4px; text-transform: uppercase; letter-spacing: .5px; }
.arn-track__text  { color: var(--text-2); font-size: 15px; line-height: 1.75; }
.arn-article__date { color: var(--text-3); font-size: 13px; margin-bottom: 28px; }

/* ============================================================
   FAQ — animated accordion
   ============================================================ */
.arn-faq__list {
  max-width: 880px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.arn-faq__item {
  position: relative;
  background: linear-gradient(180deg, var(--ink-2) 0%, var(--ink-1) 100%);
  border: 1px solid var(--steel-1);
  border-radius: var(--rad-lg);
  overflow: hidden;
  transition: border-color .3s ease, box-shadow .3s ease, transform .25s ease;
}
.arn-faq__item::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--crimson-4) 0%, var(--thunder-2) 100%);
  opacity: 0;
  transition: opacity .3s ease;
}
[dir="rtl"] .arn-faq__item::before { left: auto; right: 0; }
.arn-faq__item:hover {
  border-color: var(--steel-2);
  transform: translateY(-1px);
}
.arn-faq__item[open] {
  border-color: var(--crimson-3);
  box-shadow:
    0 0 0 1px rgba(200,32,43,.18),
    0 8px 28px rgba(0,0,0,.45),
    0 0 40px rgba(255,44,58,.12);
}
.arn-faq__item[open]::before { opacity: 1; }
.arn-faq__q {
  list-style: none;
  cursor: pointer;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  font-family: var(--face-display);
  font-size: 17px;
  font-weight: 600;
  color: var(--silver-1);
  line-height: 1.45;
  letter-spacing: .3px;
  user-select: none;
  outline: none;
  transition: color .25s ease, background .25s ease;
}
.arn-faq__q::-webkit-details-marker { display: none; }
.arn-faq__q::marker { content: ''; display: none; }
.arn-faq__q:hover {
  color: var(--paper);
  background: rgba(255,44,58,.04);
}
.arn-faq__q:focus-visible {
  outline: 2px solid var(--crimson-4);
  outline-offset: -2px;
}
.arn-faq__q-text { flex: 1; }
.arn-faq__icon {
  flex-shrink: 0;
  position: relative;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: rgba(255,44,58,.1);
  border: 1px solid rgba(255,44,58,.35);
  font-size: 0;
  transition: transform .35s cubic-bezier(.4,.2,.2,1), background .3s ease, border-color .3s ease;
}
.arn-faq__icon::before,
.arn-faq__icon::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  background: var(--thunder-2);
  border-radius: 1px;
  transition: background .3s ease;
}
.arn-faq__icon::before {
  width: 12px; height: 2px;
  transform: translate(-50%, -50%);
}
.arn-faq__icon::after {
  width: 2px; height: 12px;
  transform: translate(-50%, -50%);
  transition: transform .35s cubic-bezier(.4,.2,.2,1), background .3s ease;
}
.arn-faq__item[open] .arn-faq__icon {
  transform: rotate(180deg);
  background: linear-gradient(135deg, var(--crimson-4) 0%, var(--thunder-1) 100%);
  border-color: var(--crimson-4);
  box-shadow: 0 0 12px rgba(255,44,58,.45);
}
.arn-faq__item[open] .arn-faq__icon::before,
.arn-faq__item[open] .arn-faq__icon::after { background: var(--ink-0); }
.arn-faq__item[open] .arn-faq__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.arn-faq__a {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .35s cubic-bezier(.4,.2,.2,1);
}
.arn-faq__a > * { min-height: 0; }
.arn-faq__item[open] .arn-faq__a { grid-template-rows: 1fr; }
.arn-faq__a-inner {
  overflow: hidden;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity .3s ease .05s, transform .35s ease .05s;
}
.arn-faq__item[open] .arn-faq__a-inner {
  opacity: 1;
  transform: translateY(0);
}
.arn-faq__a p {
  margin: 0;
  padding: 0 24px 22px 28px;
  color: var(--text-2);
  font-size: 15.5px;
  line-height: 1.85;
}
[dir="rtl"] .arn-faq__a p { padding: 0 28px 22px 24px; }
@media (prefers-reduced-motion: reduce) {
  .arn-faq__item,
  .arn-faq__icon,
  .arn-faq__icon::after,
  .arn-faq__a,
  .arn-faq__a-inner { transition: none; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.arn-footer {
  background: var(--ink-1);
  border-top: 1px solid rgba(200,30,40,.4);
  padding: 52px 24px 28px;
}
.arn-footer__grid {
  max-width: 1260px; margin: 0 auto;
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 44px;
  padding-bottom: 36px;
  border-bottom: 1px solid rgba(50,60,90,.5);
}
[dir="rtl"] .arn-footer__grid { direction: rtl; }
.arn-footer__about img { height: 48px; width: auto; margin-bottom: 14px; filter: drop-shadow(0 0 10px rgba(255,60,80,.3)); }
.arn-footer__about p { color: var(--text-3); font-size: 14px; line-height: 1.8; max-width: 280px; }
[dir="rtl"] .arn-footer__about p { max-width: 100%; }
.arn-footer__col h4 { color: var(--silver-1); font-weight: 700; font-size: 14px; margin-bottom: 16px; padding-bottom: 8px; border-bottom: 1px solid rgba(200,30,40,.3); text-transform: uppercase; letter-spacing: .6px; }
[dir="rtl"] .arn-footer__col h4 { letter-spacing: 0; text-transform: none; }
.arn-footer__links { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.arn-footer__links a { color: var(--text-3); font-size: 14px; }
.arn-footer__links a:hover { color: var(--thunder-2); }
.arn-footer__bar {
  max-width: 1260px; margin: 22px auto 0;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 10px;
}
[dir="rtl"] .arn-footer__bar { direction: rtl; }
.arn-footer__copy { color: var(--text-3); font-size: 13px; }
.arn-footer__legal { color: var(--text-3); font-size: 12px; text-align: center; flex: 1; max-width: 500px; }
.arn-age {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%;
  border: 2px solid var(--crimson-4); color: var(--thunder-2);
  font-size: 11px; font-weight: 900;
}

/* ============================================================
   RESPONSIVE — TABLET  <= 900px
   ============================================================ */
@media (max-width: 900px) {
  .arn-stage { min-height: auto; }
  .arn-stage__grid {
    grid-template-columns: 1fr;
    padding: 60px 20px 80px;
    text-align: center;
    gap: 36px;
  }
  [dir="rtl"] .arn-stage__grid { text-align: center; }
  .arn-stage__art { order: -1; }
  .arn-stage__art img { max-height: 290px; animation: none; }
  .arn-pill { display: none; }
  .arn-stage__lead { font-size: 16px; margin-bottom: 28px; }
  .arn-stage__cta { justify-content: center; }

  .arn-about { grid-template-columns: 1fr; gap: 0; }
  .arn-about__aside { display: none; }
  .arn-about__pic { display: block; }

  .arn-stats { grid-template-columns: repeat(2, 1fr); }
  .arn-tactics { grid-template-columns: 1fr; }

  .arn-footer__grid { grid-template-columns: 1fr 1fr; }
  .arn-footer__about { grid-column: 1 / -1; }
  .arn-footer__about p { max-width: 100%; }
}

/* ============================================================
   RESPONSIVE — MOBILE  <= 768px
   ============================================================ */
@media (max-width: 768px) {
  .arn-topbar__row { height: 62px; padding: 0 16px; }
  .arn-topbar__brand img { height: 44px; }
  .arn-topbar__menu { display: none; }
  .arn-topbar__cta { display: none; }
  .arn-burger { display: flex; }
  .arn-drawer { top: 62px; }

  .arn-stage__cta .arn-btn { flex: 1; min-width: 0; font-size: 15px; padding: 15px 16px; }

  .arn-frame iframe { height: 380px; }

  .arn-spec__table th,
  .arn-spec__table td { padding: 12px 16px; font-size: 14px; }

  .arn-faq__q { padding: 17px 18px; font-size: 15.5px; gap: 14px; line-height: 1.4; }
  .arn-faq__icon { width: 28px; height: 28px; }
  .arn-faq__icon::before { width: 10px; }
  .arn-faq__icon::after { height: 10px; }
  .arn-faq__a p { padding: 0 18px 18px 22px; font-size: 14.5px; }
  [dir="rtl"] .arn-faq__a p { padding: 0 22px 18px 18px; }

  .arn-block { padding: 52px 16px; }
  .arn-block__head { margin-bottom: 32px; }
  .arn-block__lead { font-size: 15px; }

  .arn-banner { min-height: 200px; padding: 0 16px 28px; }

  .arn-article { padding: 40px 16px 64px; }
  .arn-article h2 { font-size: 23px; }
  .arn-article p  { font-size: 15px; }

  .arn-footer__grid { grid-template-columns: 1fr; gap: 28px; }
  .arn-footer__bar { flex-direction: column; align-items: flex-start; gap: 8px; }
  .arn-footer__legal { text-align: left; max-width: 100%; }
  [dir="rtl"] .arn-footer__legal { text-align: right; }
  .arn-footer { padding: 40px 16px 24px; }

  .arn-locale__opt { padding: 5px 8px; font-size: 12px; }
  .arn-locale__flag { font-size: 14px; }

  .arn-stats__num { font-size: 28px; }
}

/* ============================================================
   RESPONSIVE — SMALL  <= 480px
   ============================================================ */
@media (max-width: 480px) {
  .arn-stage__grid { padding: 48px 16px 64px; }
  .arn-stage__art img { max-height: 220px; }
  .arn-stage__title { font-size: 38px; }
  .arn-frame iframe { height: 300px; }
  .arn-frame { border-radius: var(--rad-lg); }
  .arn-perks li { font-size: 14px; padding: 10px 12px; }
  .arn-track__item::before { left: -30px; }
  [dir="rtl"] .arn-track__item::before { right: -30px; }
  .arn-track { padding-left: 20px; }
  [dir="rtl"] .arn-track { padding-right: 20px; }
  .arn-stats { grid-template-columns: 1fr 1fr; }
  .arn-stats__num { font-size: 26px; }
}

/* ============================================================
   CONTENT TABLES — стандартные WP-таблицы (wp-block-table / raw)
   Горизонтальный скролл на мобилке вместо сжатых колонок
   ============================================================ */
.table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 28px 0;
  border-radius: var(--rad-lg);
  border: 1px solid rgba(200,30,40,.32);
  scrollbar-width: thin;
  scrollbar-color: var(--crimson-2) transparent;
}
.table-scroll::-webkit-scrollbar { height: 6px; }
.table-scroll::-webkit-scrollbar-thumb { background: var(--crimson-2); border-radius: 3px; }
.table-scroll::-webkit-scrollbar-track { background: transparent; }

/* Gutenberg-обёртка: не даём figure ломать layout, скроллит внутренний .table-scroll */
figure.wp-block-table {
  margin: 28px 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
figure.wp-block-table .table-scroll { margin: 0; }

.table-scroll table,
.wp-block-table table,
.table-scroll table.has-fixed-layout,
.wp-block-table table.has-fixed-layout {
  table-layout: auto !important; /* перебиваем WP has-fixed-layout — иначе колонки наезжают */
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  margin: 0;
  border: none;
}
.table-scroll col,
.wp-block-table col { width: auto !important; }

.table-scroll th,
.table-scroll td,
.wp-block-table th,
.wp-block-table td {
  padding: 14px 18px;
  text-align: left;
  border: none;
  border-bottom: 1px solid rgba(60,70,100,.5);
  white-space: nowrap; /* колонки не сжимаются — появляется скролл */
  color: var(--text-1);
}
[dir="rtl"] .table-scroll th,
[dir="rtl"] .table-scroll td,
[dir="rtl"] .wp-block-table th,
[dir="rtl"] .wp-block-table td { text-align: right; }

.table-scroll thead tr,
.wp-block-table thead tr,
.table-scroll tr:first-child th,
.wp-block-table tr:first-child th {
  background: linear-gradient(90deg, var(--crimson-1), var(--crimson-2));
}
.table-scroll th,
.wp-block-table th {
  color: var(--silver-1);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .6px;
  border-bottom: 2px solid var(--crimson-4);
}
[dir="rtl"] .table-scroll th,
[dir="rtl"] .wp-block-table th { letter-spacing: 0; }

.table-scroll tbody tr,
.wp-block-table tbody tr { background: var(--ink-2); }
.table-scroll tbody tr:nth-child(even),
.wp-block-table tbody tr:nth-child(even) { background: var(--ink-3); }
.table-scroll tbody tr:hover,
.wp-block-table tbody tr:hover { background: rgba(60,30,40,.85); }

@media (max-width: 768px) {
  .table-scroll th,
  .table-scroll td,
  .wp-block-table th,
  .wp-block-table td { padding: 11px 14px; font-size: 14px; }
}
