:root {
    --navy:        #0D3B7A;
    --navy-mid:    #002b5b;
    --accent:      #4a90d9;
    --accent-pale: #a9c7ff;
    --surface:     #f7f9fb;
    --surface-low: #eceef0;
    --muted:       #64748b;
    --text:        #0f1c2e;
    --font-display: 'Barlow Condensed', sans-serif;
    --font-body:    'Barlow', sans-serif;
    --transition: .35s cubic-bezier(.25,.46,.45,.94);
    --radius-sm: 4px; --radius-md: 8px; --radius-lg: 16px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); color: var(--text); background: var(--surface); overflow-x: hidden; }
img { display: block; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-display); letter-spacing: -.02em; }

/* ─── Navbar ────────────────────────────────────── */
#mainNav { background:#fff; border-bottom:1px solid rgba(0,23,54,.08); transition:box-shadow var(--transition); padding:0; }
#mainNav.scrolled { box-shadow:0 4px 32px rgba(0,23,54,.12); }
.navbar-brand { font-family:var(--font-display); font-weight:900; font-size:1.55rem; letter-spacing:.05em; color:var(--navy)!important; text-transform:uppercase; padding:0.6rem 0; }
.nav-item-mega { position:relative!important; }
.main-nav-link { font-family:var(--font-display); font-weight:700; font-size:.9rem; letter-spacing:.08em; text-transform:uppercase; color:var(--navy)!important; padding:1.35rem .9rem!important; display:flex; align-items:center; gap:.3rem; text-decoration:none; border-bottom:3px solid transparent; transition:color var(--transition),border-color var(--transition); white-space:nowrap; }
.main-nav-link:hover, .main-nav-link.active-drop { color:var(--navy-mid)!important; border-bottom-color:var(--accent); }
.main-nav-link .drop-arrow { font-size:.7rem; transition:transform var(--transition); opacity:.5; }
.main-nav-link.active-drop .drop-arrow { transform:rotate(180deg); opacity:1; }
.navbar-toggler { border:2px solid rgba(0,23,54,.3); border-radius:4px; padding:.4rem .6rem; }
.navbar-toggler-icon { background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23001736' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
.nav-lang-switch { display:flex; align-items:center; gap:.25rem; white-space:nowrap; }
.lang-btn { font-family:var(--font-display); font-weight:800; font-size:.85rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); text-decoration:none; padding:.3rem .5rem; border-radius:var(--radius-sm); transition:color var(--transition),background var(--transition); }
.lang-btn:hover { color:var(--navy); }
.lang-btn.active { color:var(--navy); background:var(--surface-low); }
.lang-sep { color:#cbd5e1; font-weight:300; font-size:.9rem; }

/* Dropdowns */
.mega-panel { display:none; position:absolute; top:100%; left:0; width:100%; background:#fff; border-top:3px solid var(--accent); box-shadow:0 24px 60px rgba(0,23,54,.15); z-index:1000; animation:megaFadeIn .22s ease; }
.mega-panel.open { display:block; }
@keyframes megaFadeIn { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }
.mega-inner { padding:1.75rem 0 2.25rem; }
.mega-sport-card { position:relative; border-radius:var(--radius-md); overflow:hidden; height:160px; cursor:pointer; display:block; text-decoration:none; }
.mega-sport-card img { width:100%;height:100%;object-fit:cover;transition:transform .5s ease; }
.mega-sport-card:hover img { transform:scale(1.07); }
.mega-sport-card .msc-grad { position:absolute;inset:0;background:linear-gradient(to top,rgba(0,23,54,.88) 0%,rgba(0,23,54,.1) 60%,transparent 100%); }
.mega-sport-card .msc-label { position:absolute;bottom:0;left:0;right:0;padding:.9rem 1rem;font-family:var(--font-display);font-size:1.15rem;font-weight:900;color:#fff;text-transform:uppercase;letter-spacing:.06em; }
.mega-sport-card:hover .msc-label { color:var(--accent-pale); }
.mega-sport-card.all-sports { background:var(--navy);display:flex;align-items:center;justify-content:center; }
.mega-sport-card.all-sports .msc-label { position:static;text-align:center;font-size:1rem;padding:0; }
.mega-sport-card.all-sports:hover { background:var(--navy-mid); }
.simple-drop { display:none; position:absolute; top:100%; left:0; min-width:220px; background:#fff; border-top:3px solid var(--accent); box-shadow:0 16px 48px rgba(0,23,54,.13); border-radius:0 0 var(--radius-md) var(--radius-md); z-index:1000; padding:.5rem 0; animation:megaFadeIn .2s ease; }
.simple-drop.open { display:block; }
.simple-drop a { display:block;padding:.65rem 1.25rem;font-family:var(--font-display);font-weight:700;font-size:.88rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text);text-decoration:none;transition:background var(--transition),color var(--transition),padding var(--transition); }
.simple-drop a:hover { background:var(--surface-low);color:var(--navy-mid);padding-left:1.6rem; }
.simple-drop .drop-divider { height:1px;background:var(--surface-low);margin:.25rem 0; }
@media(max-width:991.98px){
    .mega-panel,.simple-drop{position:static;box-shadow:none;border-top:none;animation:none;}
    .mega-panel{border-left:3px solid var(--accent);margin-left:1rem;padding:.5rem 0;}
    .mega-inner{padding:.75rem 0;} .mega-sport-card{height:120px;}
    .simple-drop{border-left:3px solid var(--accent);margin-left:1rem;}
    .main-nav-link{padding:.75rem 1rem!important;border-bottom:none;border-left:3px solid transparent;}
    .main-nav-link:hover,.main-nav-link.active-drop{border-left-color:var(--accent);border-bottom:none;}
}
/* Barlow Condensed has no Armenian glyphs → falls back to a wider font.
   Compensate on the navbar so HY links match the density of EN links. */
[lang="hy"] .main-nav-link {
  font-size: .8rem;
  letter-spacing: .01em;
  padding-left: .6rem !important;
  padding-right: .6rem !important;
}
[lang="hy"] .lang-btn {
  font-size: .78rem;
  letter-spacing: .02em;
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  [lang="hy"] .main-nav-link {
    font-size: .74rem;
    padding-left: .45rem !important;
    padding-right: .45rem !important;
  }
}

/* ─── Page Hero ─────────────────────────────────── */
.page-hero {
    min-height: 480px;
    position: relative;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    padding-bottom: 4rem;
}
.page-hero .hero-bg {
    position: absolute; inset: 0;
    background-image: url('/assets/img/gallery-1.webp');
    background-size: cover;
    background-position: center 35%;
    transform: scale(1.04);
    transition: transform 8s ease;
}
.page-hero.loaded .hero-bg { transform: scale(1); }
.page-hero .hero-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(0,5,20,.9) 0%, rgba(0,5,20,.55) 50%, rgba(0,5,20,.2) 100%);
}
.page-hero-content { position: relative; z-index: 2; }
.hero-breadcrumb { display:flex;align-items:center;gap:.5rem;font-family:var(--font-display);font-size:.75rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:1.25rem; }
.hero-breadcrumb a { color:rgba(255,255,255,.55);text-decoration:none;transition:color var(--transition); }
.hero-breadcrumb a:hover { color:#fff; }
.hero-breadcrumb i { font-size:.6rem; }

/* ─── Sticky Sport Tabs ──────────────────────────── */
#sportTabs {
    position: sticky;
    top: 70px;
    z-index: 200;
    background: var(--navy);
    border-bottom: 3px solid rgba(255,255,255,.1);
}
.sport-tab-inner {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
}
.sport-tab-inner::-webkit-scrollbar { display: none; }
.stab {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: .88rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(255,255,255,.55);
    text-decoration: none;
    padding: 1rem 2rem;
    display: flex;
    align-items: center;
    gap: .5rem;
    border-bottom: 3px solid transparent;
    margin-bottom: -3px;
    transition: color var(--transition), border-color var(--transition), background var(--transition);
    white-space: nowrap;
    flex-shrink: 0;
}
.stab i { font-size: 1rem; }
.stab:hover { color: #fff; background: rgba(255,255,255,.07); }
.stab.active { color: #fff; border-bottom-color: var(--accent); }

/* ─── Section Utility ───────────────────────────── */
.section-label { font-family:var(--font-display);font-size:.72rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);display:inline-block;margin-bottom:.75rem; }
.section-title { font-size:clamp(2rem,4vw,3rem);font-weight:700;color:var(--navy);text-transform:uppercase;line-height:1.05; }
.divider-accent { width:48px;height:4px;background:var(--accent);border-radius:2px;margin:1rem 0 1.5rem; }

/* ─── Sport Hero Banner ──────────────────────────── */
.sport-banner {
    position: relative;
    height: 420px;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
}
.sport-banner img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 8s ease;
}
.sport-banner:hover img { transform: scale(1.04); }
.sport-banner .sb-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to right, rgba(0,5,20,.85) 0%, rgba(0,5,20,.3) 60%, transparent 100%);
}
.sport-banner .sb-content {
    position: relative; z-index: 2;
    padding: 3rem;
}
.sport-banner .sb-num {
    font-family: var(--font-display);
    font-size: 8rem;
    font-weight: 900;
    color: rgba(255,255,255,.07);
    line-height: 1;
    position: absolute;
    bottom: 1rem;
    right: 2rem;
}
.sport-cert-badge {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-family: var(--font-display);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
    background: var(--accent);
    color: #fff;
    border-radius: 100px;
    padding: .4rem 1.1rem;
    margin-bottom: 1rem;
}

/* ─── Feature list ───────────────────────────────── */
.feature-list { list-style:none;padding:0;margin:0; }
.feature-list li { display:flex;align-items:flex-start;gap:.75rem;padding:.65rem 0;border-bottom:1px solid var(--surface-low);font-size:.92rem;color:var(--text);line-height:1.5; }
.feature-list li:last-child { border-bottom:none; }
.feature-list li i { color:var(--accent);font-size:1rem;margin-top:.15rem;flex-shrink:0; }

.spec-tag { display:inline-flex;align-items:center;gap:.4rem;background:var(--surface-low);border-radius:var(--radius-sm);padding:.45rem 1rem;font-family:var(--font-display);font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--navy); }
.spec-tag i { font-size:.9rem;color:var(--accent); }

/* ─── Sport detail section ───────────────────────── */
.sport-section { scroll-margin-top: 130px; }

/* Sub-feature card */
.sub-feat-card {
    background: var(--surface-low);
    border-radius: var(--radius-md);
    padding: 1.25rem;
    height: 100%;
    transition: background var(--transition), transform var(--transition);
}
.sub-feat-card:hover { background: var(--navy); transform: translateY(-3px); }
.sub-feat-card i { font-size: 1.5rem; color: var(--accent); margin-bottom: .75rem; display: block; transition: color var(--transition); }
.sub-feat-card:hover i { color: var(--accent-pale); }
.sub-feat-card h6 { font-family: var(--font-display); font-size: .9rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--navy); margin-bottom: .4rem; transition: color var(--transition); }
.sub-feat-card:hover h6 { color: #fff; }
.sub-feat-card p { font-size: .82rem; color: var(--muted); margin: 0; line-height: 1.5; transition: color var(--transition); }
.sub-feat-card:hover p { color: rgba(255,255,255,.65); }

/* Brand pill row */
.brand-pill-row { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1.25rem; }
.brand-pill {
    display: inline-flex; align-items: center; gap: .4rem;
    font-family: var(--font-display); font-size: .75rem; font-weight: 800;
    letter-spacing: .1em; text-transform: uppercase;
    background: #fff; color: var(--navy);
    border: 1.5px solid var(--surface-low);
    border-radius: var(--radius-sm);
    padding: .35rem .9rem;
    transition: all var(--transition);
}
.brand-pill:hover { background: var(--navy); color: #fff; border-color: var(--navy); }

/* ─── Standards strip ────────────────────────────── */
.standards-strip {
    background: var(--navy);
    border-radius: var(--radius-lg);
    padding: 2rem 2.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    align-items: center;
    justify-content: space-between;
}
.std-item { text-align: center; }
.std-item .std-name { font-family: var(--font-display); font-size: 1.1rem; font-weight: 900; color: #fff; letter-spacing: .06em; text-transform: uppercase; }
.std-item .std-desc { font-size: .75rem; color: var(--accent-pale); margin-top: .2rem; }

/* ─── CTA ───────────────────────────────────────── */
#cta { background:linear-gradient(135deg,var(--navy) 0%,var(--navy-mid) 100%);position:relative;overflow:hidden; }
#cta .cta-bg-icon { position:absolute;right:-2rem;top:50%;transform:translateY(-50%);font-size:22rem;color:rgba(255,255,255,.04);line-height:1;pointer-events:none; }
#cta h2 { font-size:clamp(2rem,5vw,3.5rem);font-weight:900;color:#fff;text-transform:uppercase;line-height:1.05; }
.btn-cta { font-family:var(--font-display);font-weight:800;font-size:1.1rem;letter-spacing:.1em;text-transform:uppercase;background:#fff;color:var(--navy);border:none;border-radius:var(--radius-sm);padding:1rem 3rem;text-decoration:none;display:inline-block;transition:background var(--transition),transform var(--transition); }
.btn-cta:hover { background:var(--accent-pale);transform:translateY(-2px);color:var(--navy); }
.btn-outline-white { font-family:var(--font-display);font-weight:700;font-size:1rem;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:#fff;border:2px solid rgba(255,255,255,.5);border-radius:var(--radius-sm);padding:.9rem 2rem;text-decoration:none;display:inline-block;transition:all var(--transition); }
.btn-outline-white:hover { background:#fff;color:var(--navy);border-color:#fff; }

/* ─── Footer ────────────────────────────────────── */
footer { background:#020e1f;color:#8da0b8;font-size:.88rem; }
footer .brand-name { font-family:var(--font-display);font-size:1.8rem;font-weight:900;color:#fff;letter-spacing:.04em; }
footer h6 { font-family:var(--font-display);font-size:.7rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#fff;margin-bottom:1.25rem; }
footer a { color:#8da0b8;text-decoration:none;transition:color var(--transition); }
footer a:hover { color:var(--accent-pale); }
.footer-divider { border-color:rgba(255,255,255,.07); }
.footer-contact-item { display:flex;gap:.75rem;align-items:flex-start;margin-bottom:.9rem; }
.footer-contact-item i { color:var(--accent);font-size:1.1rem;margin-top:.05rem;flex-shrink:0; }

/* ─── Animations ─────────────────────────────────── */
.reveal { opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease; }
.reveal.visible { opacity:1;transform:none; }
.reveal-delay-1 { transition-delay:.1s; }
.reveal-delay-2 { transition-delay:.2s; }
.reveal-delay-3 { transition-delay:.3s; }
.reveal-delay-4 { transition-delay:.4s; }

.bg-view-all-btn { font-family:var(--font-display);font-weight:700;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;border:2px solid var(--navy);color:var(--navy);background:transparent;border-radius:var(--radius-sm);padding:.6rem 1.6rem;transition:all var(--transition);text-decoration:none;display:inline-flex;align-items:center;gap:.4rem; }
.bg-view-all-btn:hover { background:var(--navy);color:#fff;gap:.8rem; }

.text-highlight{background-color:rgba(26,111,196,.15);padding:4px 8px;border-radius:4px;display:inline-block}

[id] { scroll-margin-top: 130px; }