:root { /* ── Brand Palette ── */
--charcoal: #2f2f2f; --purple:   #240e35; --steel:    #3b5265; --white:    #ffffff; --red: #d12138; --green:    #178942; /* ── Derived ── */
--crimson:    #d12138; --blush: #9ec4d4; --deep-red:   #a01028; --maroon:     #240e35; --crimson-dim: rgba(209,33,56,0.12); --crimson-glow: rgba(209,33,56,0.3); --blush-dim:  rgba(59,82,101,0.12); --blush-pale: rgba(59,82,101,0.05); --ink:   #2f2f2f; --ink-2: #281145; --ink-3: #30184e; --ink-4: #3a1f5a; --smoke: #f0f4f8; --ash:   #b0c4d8; --ash-dim:    #6888a0; --red-dim:  rgba(209,33,56,0.12); --red-glow: rgba(209,33,56,0.3); --green-dim:rgba(23,137,66,0.12); --steel-dim:rgba(59,82,101,0.15); --font-display:'Bebas Neue',sans-serif; --font-serif:  'Crimson Pro',serif; --font-body:   'DM Sans',sans-serif; }


*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body { font-family: var(--font-body); background: var(--ink); color: var(--smoke); overflow-x: hidden;    }


/* ─────────── TOP BAR ─────────── */
  .topbar { position: relative;   z-index: 1001;   background: var(--maroon); padding: 7px 0; border-bottom: 1px solid rgba(205,28,24,0.3);    }
  .topbar-inner { max-width: 100%; margin: 0 auto; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; gap: 20px;    }
  .topbar-ticker { flex: 1; overflow: hidden; mask-image: linear-gradient(to right, transparent 0%, black 4%, black 96%, transparent 100%); }
  .topbar-scroll { display: flex; gap: 56px; white-space: nowrap; animation: marquee 44s linear infinite;    }
  .topbar-scroll:hover { animation-play-state: paused; }
  .topbar-scroll a { color: var(--blush); font-size: 11.5px; text-decoration: none; letter-spacing: 0.04em; transition: color 0.2s;    }
  .topbar-scroll a:hover { color: var(--smoke); }
  .topbar-contacts { display: flex; gap: 20px; flex-shrink: 0; }
  .topbar-contacts a { color: var(--ash); font-size: 11px; text-decoration: none; display: flex; align-items: center; gap: 6px; transition: color 0.2s;    }
  .topbar-contacts a i { color: var(--crimson); }
  .topbar-contacts a:hover { color: var(--smoke); }
  @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }


/* ─── GRAIN OVERLAY ─── */
  body::before { content: ''; position: fixed; inset: 0; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E"); pointer-events: none; z-index: 9999; opacity: 0.5;    }

/* ─────────── HEADER ─────────── */
  header { position: sticky; top: 0; z-index: 1000; background: #FFF; backdrop-filter: blur(16px); border-bottom: 1px solid rgba(205,28,24,0.2); transition: border-color 0.3s, box-shadow 0.3s; }
  header.scrolled {border-color: rgba(205,28,24,0.5); box-shadow: 0 4px 40px rgba(56,0,10,0.7); }
  .header-inner {max-width: 100%; margin: 0 auto; padding: 0 28px; display: flex; align-items: center; height: 70px; gap: 28px; }
  .logo-wrap { display: flex; align-items: center; gap: 14px; text-decoration: none; flex-shrink: 0; background-color: white;}
  .logoimage { width: 70px; height: 70px; position: relative; display: flex; align-items: center; justify-content: center; }
  .logo-text { line-height: 1.15; }
  .logo-text strong { display: block; font-family: var(--font-display); font-size: 24px; letter-spacing: 3px; background: linear-gradient(135deg, var(--crimson), var(--blush)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
  .logo-text span { font-size: 10px; color: var(--charcoal); letter-spacing: 0.5px; }
  nav { flex: 1; display: flex; justify-content: flex-end; }
  .nav-links { display: flex; list-style: none; gap: 2px; }
  .nav-links li { position: relative; }
  .nav-links > li > a { color: var(--charcoal); text-decoration: none; font-size: 11.5px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; padding: 8px 13px; display: block; border-radius: 5px; transition: all 0.2s; }
  .nav-links > li > a:hover, .nav-links > li > a.active { color: var(--blush); background: var(--crimson); }
  .nav-links > li > a.active { color: var(--smoke); }

/* Dropdown */
  .dropdown { position: absolute; top: calc(100% + 6px); left: 0; background: var(--ink-3); border: 1px solid rgba(205,28,24,0.25); border-radius: 10px; min-width: 230px; list-style: none; padding: 8px 0; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: all 0.22s; z-index: 1001; box-shadow: 0 16px 48px rgba(56,0,10,0.7); }
  .nav-links li:hover .dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
  .dropdown li a { display: block; padding: 9px 18px; color: var(--ash); text-decoration: none; font-size: 12px; letter-spacing: 0.03em; transition: all 0.15s; }
  .dropdown li a:hover { color: var(--blush); background: var(--crimson-dim); padding-left: 24px; }
  .hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 4px; }
  .hamburger span { width: 26px; height: 2px; background: var(--ash); border-radius: 2px; transition: all 0.3s; }

/* ─────────── HERO ─────────── */
  .hero { min-height: 90vh; width: 80%; display: flex; align-items: flex-end; overflow: hidden; }

/* Animated background */
  .hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 80% 60% at 20% 50%, rgba(155,19,19,0.5) 0%, transparent 60%),   radial-gradient(ellipse 60% 80% at 80% 20%, rgba(56,0,10,0.8) 0%, transparent 60%),   linear-gradient(160deg, var(--maroon) 0%, var(--ink) 50%, #1a0008 100%);    }
  
/* Crosshair rings decoration */
  .hero-rings { position: absolute; right: 8%; top: 50%; transform: translateY(-50%); width: 420px; height: 420px; pointer-events: none; }
  .hero-rings circle { fill: none; }
  .ring-1 { stroke: rgba(205,28,24,0.15); stroke-width: 1; animation: spin-slow 30s linear infinite; transform-origin: center; }
  .ring-2 { stroke: rgba(255,168,150,0.1); stroke-width: 0.5; animation: spin-slow 20s linear infinite reverse; transform-origin: center; }
  .ring-3 { stroke: rgba(205,28,24,0.3); stroke-width: 1.5; animation: pulse-ring 3s ease-in-out infinite; transform-origin: center; }
  .ring-cross { stroke: rgba(205,28,24,0.25); stroke-width: 0.8; }
  @keyframes spin-slow { to { transform: rotate(360deg); } }
  @keyframes pulse-ring { 0%,100% { opacity: 0.3; } 50% { opacity: 0.7; } }

/* Diagonal accent bar */
  .hero::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background: linear-gradient(90deg, var(--maroon), var(--crimson), var(--blush), var(--crimson), var(--maroon));    }
  .hero-slides { position: absolute; inset: 0; }
  .hero-slide { position: absolute; inset: 0; opacity: 0; background-size: cover; background-position: center; transition: opacity 1.2s ease;    }
  .hero-slide.active { opacity: 1; }
  .hero-slide::after { content: ''; position: absolute; inset: 0; background: linear-gradient(105deg, rgba(56,0,10,0.92) 0%, rgba(30,8,12,0.75) 40%, rgba(13,4,6,0.5) 100%);    }
  .hs1 { background-image: url('../images/main-slider0.jpg'); background-color: var(--ink-4); }
  .hs2 { background-image: url('../images/main-slider1.jpg'); background-color: var(--ink-4); }
  .hs3 { background-image: url('../images/main-slider2.jpg'); background-color: var(--ink-4); }
  .hs4 { background-image: url('../images/main-slider3.jpg'); background-color: var(--ink-4); }
  .hs5 { background-image: url('../images/main-slider4.jpg'); background-color: var(--ink-4); }
  .hs6 { background-image: url('../images/main-slider5.jpg'); background-color: var(--ink-4); }
  .hero-content { position: relative; z-index: 2; max-width: 1320px; margin: 0 auto; padding: 0 28px 72px; width: 100%;    }
  .hero-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--blush); margin-bottom: 20px; animation: fadeUp 0.8s 0.2s both;    }
  .hero-eyebrow::before, .hero-eyebrow::after { content: ''; display: block; height: 1px; width: 36px; background: var(--crimson);    }
  .hero h1 { font-family: var(--font-display); font-size: clamp(58px, 9vw, 124px); line-height: 0.92; letter-spacing: 3px; color: var(--smoke); text-shadow: 0 8px 48px rgba(56,0,10,0.8); animation: fadeUp 0.8s 0.4s both;    }
  .hero h1 .accent { background: var(--green); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;    }
  .hero-sub { font-family: var(--font-serif); font-size: 19px; color: var(--ash); line-height: 1.6; margin: 20px 0 36px; max-width: 500px; animation: fadeUp 0.8s 0.6s both;    }
  .hero-actions { display: flex; gap: 14px; flex-wrap: wrap; animation: fadeUp 0.8s 0.8s both;    }
  @keyframes fadeUp { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
  .btn { display: inline-flex; align-items: center; gap: 9px; padding: 14px 28px; font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; border-radius: 5px; cursor: pointer; border: none; transition: all 0.25s;    }
  .btn-primary { background: linear-gradient(135deg, var(--crimson), var(--deep-red)); color: var(--smoke); box-shadow: 0 4px 24px var(--crimson-glow);    }
  .btn-primary:hover { background: linear-gradient(135deg, #e02420, var(--crimson)); transform: translateY(-2px); box-shadow: 0 8px 32px rgba(205,28,24,0.5);    }
  .btn-ghost { background: transparent; color: var(--blush); border: 1px solid rgba(255,168,150,0.35);    }
  .btn-ghost:hover { border-color: var(--blush); background: var(--blush-dim); transform: translateY(-2px); color: var(--smoke);    }

/* Slide dots */
  .slide-dots { position: absolute; bottom: 28px; right: 28px; z-index: 10; display: flex; gap: 8px;    }
  .sdot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,168,150,0.3); cursor: pointer; transition: all 0.3s;    }
  .sdot.active { background: var(--crimson); width: 28px; border-radius: 4px; }

/* ─────────── NEWS STRIP ─────────── */
  .news-strip { background: var(--ink-2); border-bottom: 1px solid rgba(205,28,24,0.2);    }
  .ns-inner { max-width: 100%; margin: 0 auto; padding: 0 28px; display: flex; align-items: stretch;    }
  .ns-label { background: var(--crimson); color: var(--smoke); font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; padding: 14px 18px; display: flex; align-items: center; gap: 7px; flex-shrink: 0; clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%); padding-right: 28px;    }
  .ns-scroll { flex: 1; overflow: hidden; padding: 13px 0; mask-image: linear-gradient(to right, transparent, black 3%, black 97%, transparent); }
  .ns-inner-scroll { display: flex; gap: 56px; white-space: nowrap; animation: marquee 52s linear infinite;    }
  .ns-inner-scroll:hover { animation-play-state: paused; }
  .ns-inner-scroll a { color: var(--ash); font-size: 13px; text-decoration: none; transition: color 0.2s; }
  .ns-inner-scroll a:hover { color: var(--blush); }
  .ns-sep { color: var(--deep-red); }

/* ─────────── SECTIONS ─────────── */
  .section { padding: 88px 0; }
  .section-alt { background: var(--ink-2); }
  .container { max-width: 1320px; margin: 0 auto; padding: 0 28px; }
  .sec-header { margin-bottom: 56px; }
  .sec-tag { display: inline-flex; align-items: center; gap: 10px; font-size: 10.5px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--crimson); margin-bottom: 10px;    }    .sec-tag::after { content: ''; display: block; width: 44px; height: 1px; background: var(--crimson); }
  .sec-title { font-family: var(--font-display); font-size: clamp(38px, 5vw, 64px); letter-spacing: 2px; line-height: 0.95; color: var(--smoke);    }
  .sec-title .hl { background: linear-gradient(135deg, var(--crimson), var(--blush)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;    }
  .sec-sub { margin-top: 14px; font-family: var(--font-serif); font-size: 17px; color: var(--ash-dim); max-width: 600px; line-height: 1.65;    }

/* ─────────── ABOUT ─────────── */
  .about-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 72px; align-items: start;    }
  .about-text p { font-family: var(--font-serif); font-size: 17px; color: var(--ash); line-height: 1.85; margin-bottom: 18px;    }
  .stats-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 44px;    }
  .stat-box { background: var(--ink-3); border: 1px solid rgba(205,28,24,0.2); border-radius: 10px; padding: 24px 16px; text-align: center; position: relative; overflow: hidden; transition: border-color 0.3s, transform 0.3s;    }
  .stat-box::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, var(--crimson-dim), transparent); opacity: 0; transition: opacity 0.3s;    }
  .stat-box:hover { border-color: var(--crimson); transform: translateY(-3px); }
  .stat-box:hover::before { opacity: 1; }
  .stat-num { font-family: var(--font-display); font-size: 48px; letter-spacing: 2px; background: linear-gradient(135deg, var(--crimson), var(--blush)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1;    }
  .stat-lbl { font-size: 11px; color: var(--ash-dim); letter-spacing: 0.08em; text-transform: uppercase; margin-top: 6px; }

/* About sidebar */
  .about-sidebar > * + * { margin-top: 20px; }
  .img-card { background: var(--ink-3); border: 1px solid rgba(205,28,24,0.2); border-radius: 14px; overflow: hidden; position: relative;    }
  .img-card img { width: 100%; height: inherit; object-fit: cover; opacity: 0.85; display: block; }
  .img-card-fallback {  width: 100%; height: 240px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--maroon), var(--ink-3)); font-family: var(--font-display); font-size: 64px; color: var(--crimson); opacity: 0.3;    }
  .img-card-badge { position: absolute; bottom: 14px; right: 14px; background: linear-gradient(135deg, var(--crimson), var(--deep-red)); color: var(--smoke); padding: 8px 14px; border-radius: 6px; font-size: 11px; font-weight: 600; letter-spacing: 0.08em;    }
  .quick-panel { background: var(--ink-3); border: 1px solid rgba(205,28,24,0.2); border-radius: 14px; padding: 24px;    }
  .quick-panel h4 { font-family: var(--font-display); font-size: 17px; letter-spacing: 1px; color: var(--blush); margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(205,28,24,0.2);    }
  .quick-panel a { display: flex; align-items: center; gap: 10px; padding: 9px 0; color: var(--ash); text-decoration: none; font-size: 13px; border-bottom: 1px solid rgba(255,255,255,0.04); transition: all 0.2s;    }
  .quick-panel a:last-child { border-bottom: none; }
  .quick-panel a:hover { color: var(--blush); padding-left: 6px; }
  .quick-panel a i { color: var(--crimson); font-size: 11px; width: 14px; }

/* ─────────── GOVERNING BODY ─────────── */
  .president-card { background: linear-gradient(135deg, var(--ink-3), var(--maroon)); border: 1px solid rgba(205,28,24,0.4); border-radius: 16px; padding: 40px; display: flex; gap: 40px; align-items: center; margin-bottom: 44px; position: relative; overflow: hidden;    }
  .president-card::before { content: ''; position: absolute; top: -60px; right: -60px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(205,28,24,0.15), transparent 70%); pointer-events: none;    }
  .pres-photo { width: 200px; height: 200px; border-radius: 50%; flex-shrink: 0; border: 3px solid var(--crimson); background: var(--ink-4); overflow: hidden; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 44px; color: var(--crimson); box-shadow: 0 0 32px rgba(205,28,24,0.3);    }
  .pres-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
  .pres-info h3 { font-family: var(--font-display); font-size: 32px; letter-spacing: 2px; background: linear-gradient(135deg, var(--smoke), var(--blush)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 4px;    }
  .pres-role { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--crimson); margin-bottom: 14px;    }
  .pres-info p { font-family: var(--font-serif); font-size: 15px; color: var(--ash-dim); line-height: 1.65; }
  .members-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); gap: 18px;    }
  .member-card { background: var(--ink-3); border: 1px solid rgba(205,28,24,0.15); border-radius: 12px; overflow: hidden; text-align: center; transition: all 0.3s;    }
  .member-card:hover { border-color: var(--crimson); transform: translateY(-5px); box-shadow: 0 16px 40px rgba(56,0,10,0.5); }
  .member-photo { width: 100%; aspect-ratio: 1; background: var(--ink-4); position: relative; overflow: hidden;    }
  .member-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
  .member-initials { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 38px; letter-spacing: 2px; color: var(--deep-red); background: radial-gradient(circle at 50% 30%, var(--ink-3), var(--ink-4));    }
  .member-info { padding: 14px 12px; }
  .member-name { font-weight: 600; font-size: 13.5px; color: var(--smoke); margin-bottom: 4px; }
  .member-role { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--crimson);    }

  /* ─────────── TOP SHOOTERS ─────────── */
  /* ── PAGE HERO BANNER ── */
  .page-banner{background:linear-gradient(135deg,var(--purple) 0%,var(--steel) 50%,rgba(47,47,47,.8) 100%);padding:52px 0 44px;position:relative;overflow:hidden;border-bottom:3px solid var(--red)}
  .page-banner::before{content:'';position:absolute;right:-80px;top:-80px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(209,33,56,.15),transparent 70%);pointer-events:none}
  .page-banner::after{content:'';position:absolute;left:-60px;bottom:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(23,137,66,.1),transparent 70%);pointer-events:none}
  .pb-inner{max-width:1300px;margin:0 auto;padding:0 24px;position:relative;z-index:1}
  .pb-eyebrow{font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--green);margin-bottom:8px;display:flex;align-items:center;gap:8px}
  .pb-eyebrow::before{content:'';width:28px;height:1px;background:var(--green)}
  .pb-title{font-family:var(--font-display);font-size:clamp(40px,6vw,72px);letter-spacing:3px;line-height:.95;color:var(--white)}
  .pb-title span{color:var(--red)}
  .breadcrumb{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:12px;color:rgba(255,255,255,.45)}
  .breadcrumb a{color:rgba(255,255,255,.45);text-decoration:none;transition:color .2s}
  .breadcrumb a:hover{color:var(--white)}
  .breadcrumb i{font-size:10px;color:rgba(255,255,255,.3)}

/* ── LAYOUT ── */
  .page-body{max-width:1300px;margin:0 auto;padding:56px 24px;display:grid;grid-template-columns:1fr 300px;gap:40px;align-items:start}
  @media(max-width:900px){.page-body{grid-template-columns:1fr}
  .section-tag{display:inline-flex;align-items:center;gap:10px;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:10px}
  .section-tag::after{content:'';display:block;width:40px;height:1px;background:var(--red)}
  .section-title{font-family:var(--font-display);font-size:clamp(32px,4vw,52px);letter-spacing:2px;color:var(--white);line-height:1}}

/* body content design */
  .ts-tabs{display:flex;gap:0;margin-bottom:32px;border-bottom:2px solid rgba(59,82,101,.4)}
  .ts-tab{padding:12px 24px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;transition:all .2s}
  .ts-tab.active{color:var(--white);border-color:var(--red)}
  .ts-tab:hover{color:var(--white)}
  .ts-panel{display:none}.ts-panel.active{display:block}
  .shooter-row{background:rgba(36,14,53,.4);border:1px solid rgba(59,82,101,.3);border-radius:12px;overflow:hidden;margin-bottom:20px;transition:border-color .3s}
  .shooter-row:hover{border-color:var(--red)}
  .shooter-row-top{display:flex;gap:24px;padding:24px;align-items:flex-start}
  .shooter-portrait{width:110px;height:130px;object-fit:cover;object-position:top;border-radius:8px;flex-shrink:0;background:rgba(59,82,101,.3)}
  .shooter-portrait-ph{width:110px;height:130px;border-radius:8px;flex-shrink:0;background:linear-gradient(135deg,var(--purple),var(--steel));display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:36px;color:var(--red)}
  .shooter-name{font-family:var(--font-display);font-size:26px;letter-spacing:1.5px;color:var(--white);margin-bottom:4px}
  .shooter-event{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--green)}
  .shooter-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
  .shooter-table th{background:var(--red);color:var(--white);padding:9px 14px;text-align:left;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
  .shooter-table td{padding:9px 14px;border-bottom:1px solid rgba(59,82,101,.25);color:rgba(255,255,255,.75);vertical-align:top}
  .shooter-table tr:last-child td{border-bottom:none}
  .shooter-table tr:hover td{background:rgba(59,82,101,.15)}
  .medal-gold{color:#ffd700;font-weight:700}.medal-silver{color:#c0c0c0;font-weight:700}.medal-bronze{color:#cd7f32;font-weight:700}
  .nat-card{background:rgba(36,14,53,.4);border:1px solid rgba(59,82,101,.3);border-radius:12px;padding:28px;margin-bottom:20px;transition:border-color .3s}
  .nat-card:hover{border-color:var(--green)}
  .nat-card-top{display:flex;gap:24px;align-items:flex-start;margin-bottom:20px}
  .nat-achievements{list-style:none}
  .nat-achievements li{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-bottom:1px solid rgba(59,82,101,.2);color:rgba(255,255,255,.7);font-size:13.5px;line-height:1.5;font-family:var(--font-serif)}
  .nat-achievements li:last-child{border-bottom:none}
  .nat-achievements li::before{content:"✦";color:var(--green);flex-shrink:0;margin-top:2px}


/* ── SIDEBAR ── */
  .sidebar>*+*{margin-top:20px}
  .sidebar-panel{background:rgba(36,14,53,.6);border:1px solid rgba(59,82,101,.4);border-radius:12px;overflow:hidden}
  .sp-hdr{background:linear-gradient(135deg,var(--red),#a01028);padding:14px 20px;font-family:var(--font-display);font-size:16px;letter-spacing:1px;color:var(--white);display:flex;align-items:center;gap:8px}
  .sp-body{padding:4px 0}
  .sp-link{display:flex;align-items:center;gap:10px;padding:10px 18px;color:rgba(255,255,255,.65);text-decoration:none;font-size:13px;border-bottom:1px solid rgba(255,255,255,.05);transition:all .2s}
  .sp-link:last-child{border-bottom:none}
  .sp-link:hover{color:var(--white);background:var(--red-dim);padding-left:24px}
  .sp-link i{color:var(--red);font-size:11px;width:14px}




/* -------------------- Print Media ------------------ */
.pm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.pm-card{background:rgba(36,14,53,.5);border:1px solid rgba(59,82,101,.3);border-radius:10px;overflow:hidden;cursor:pointer;transition:all .3s;position:relative}
.pm-card:hover{border-color:var(--red);transform:translateY(-4px);box-shadow:0 12px 32px rgba(36,14,53,.6)}
.pm-card img{width:100%;height:200px;object-fit:cover;display:block;transition:transform .4s}
.pm-card:hover img{transform:scale(1.05)}
.pm-card-lbl{padding:10px 12px;font-size:11px;color:rgba(255,255,255,.5);letter-spacing:.06em}
/* Lightbox */
.lb-overlay{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:3000;display:none;align-items:center;justify-content:center;padding:20px}
.lb-overlay.open{display:flex}
.lb-img{max-width:90vw;max-height:90vh;border-radius:8px;box-shadow:0 0 60px rgba(0,0,0,.8)}
.lb-close{position:absolute;top:20px;right:20px;width:44px;height:44px;background:var(--red);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--white);font-size:20px}
.pm-section-hdr{font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:1.5px;color:var(--steel);padding:16px 0 12px;border-bottom:1px solid rgba(59,82,101,.3);margin-bottom:16px;margin-top:32px}
.pm-section-hdr:first-child{margin-top:0}


/* -------------------- Electronic Media ------------------ */
.em-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:8px}
.em-card{background:rgba(36,14,53,.5);border:1px solid rgba(59,82,101,.3);border-radius:12px;overflow:hidden;transition:border-color .3s}
.em-card:hover{border-color:var(--red)}
.em-card iframe{width:100%;aspect-ratio:16/9;display:block;border:none}
.em-card-body{padding:14px 16px}
.em-card-title{font-size:13.5px;font-weight:600;color:var(--white);margin-bottom:4px}
.em-card-desc{font-size:12px;color:rgba(255,255,255,.45)}  




/* -------------------- Achievements ------------------ */
.ach-text p{font-family:'Crimson Pro',serif;font-size:17px;color:rgba(255,255,255,.75);line-height:1.85;margin-bottom:18px}
.ach-text strong{color:var(--white)}
.ach-milestone{display:flex;gap:20px;align-items:flex-start;padding:20px 0;border-bottom:1px solid rgba(59,82,101,.25)}
.ach-milestone:last-child{border-bottom:none}
.ach-year{font-family:'Bebas Neue',sans-serif;font-size:36px;letter-spacing:2px;color:var(--red);line-height:1;flex-shrink:0;width:72px}
.ach-detail{flex:1}
.ach-detail h4{font-size:15px;font-weight:600;color:var(--white);margin-bottom:6px}
.ach-detail p{font-family:'Crimson Pro',serif;font-size:15px;color:rgba(255,255,255,.65);line-height:1.6;margin:0}
.int-list{list-style:none;margin-top:8px}
.int-list li{display:flex;align-items:center;gap:10px;padding:10px 16px;background:rgba(36,14,53,.4);border:1px solid rgba(59,82,101,.3);border-radius:8px;margin-bottom:8px;font-size:14px;color:rgba(255,255,255,.75);transition:border-color .2s}
.int-list li:hover{border-color:var(--green)}
.int-list li::before{content:"🏆";flex-shrink:0}
.medal-winners{background:linear-gradient(135deg,rgba(23,137,66,.1),rgba(36,14,53,.4));border:1px solid rgba(23,137,66,.3);border-radius:12px;padding:24px;margin-top:24px}
.medal-winners h4{font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:1px;color:var(--green);margin-bottom:16px}
.medal-winners ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.medal-winners li{font-size:13.5px;color:rgba(255,255,255,.75);display:flex;align-items:center;gap:8px}
.medal-winners li::before{content:"•";color:var(--green)}









  /* ─────────── RESULTS / NEWS ─────────── */
  .news-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 36px; }

  .results-list { list-style: none; }
  .results-list li {  display: flex; align-items: flex-start; gap: 16px; padding: 16px 0;  border-bottom: 1px solid rgba(255,255,255,0.05); transition: background 0.2s;   }
  .results-list li:first-child { border-top: 1px solid rgba(255,255,255,0.05); }
  .res-icon {  width: 42px; height: 42px; border-radius: 9px; flex-shrink: 0;  background: var(--crimson-dim); border: 1px solid rgba(205,28,24,0.3);  display: flex; align-items: center; justify-content: center;  color: var(--crimson); font-size: 14px;   }
  .res-text a {  color: var(--ash); text-decoration: none; font-size: 13.5px; line-height: 1.45;  transition: color 0.2s; display: block;   }
  .res-text a:hover { color: var(--blush); }
  .new-tag {  display: inline-block; font-size: 9px; letter-spacing: 0.1em;  background: var(--crimson); color: var(--smoke); padding: 2px 7px;  border-radius: 3px; margin-left: 7px; vertical-align: middle; font-weight: 600;   }

  /* News panel */
  .news-panel {  background: var(--ink-3); border: 1px solid rgba(205,28,24,0.2);  border-radius: 14px; overflow: hidden;   }
  .news-panel-hdr {  background: linear-gradient(135deg, var(--crimson), var(--deep-red));  padding: 16px 20px;  font-family: var(--font-display); font-size: 17px; letter-spacing: 1px; color: var(--smoke);  display: flex; align-items: center; gap: 10px;   }
  .news-item {  padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,0.04); transition: background 0.2s;   }
  .news-item:last-child { border-bottom: none; }
  .news-item:hover { background: var(--blush-pale); }
  .news-item a { color: var(--ash); text-decoration: none; font-size: 12.5px; line-height: 1.5; transition: color 0.2s; display: block; }
  .news-item:hover a { color: var(--blush); }
  .news-date { font-size: 10px; color: var(--ash-dim); margin-top: 4px; letter-spacing: 0.05em; }

  /* ─────────── DOWNLOADS ─────────── */
  .dl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
  .dl-item {  background: var(--ink-3); border: 1px solid rgba(205,28,24,0.15);  border-radius: 10px; padding: 17px 20px;  display: flex; align-items: center; gap: 16px;  text-decoration: none; color: var(--ash); transition: all 0.22s;  position: relative; overflow: hidden;   }
  .dl-item::before {  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;  background: linear-gradient(180deg, var(--crimson), var(--deep-red));  transform: scaleY(0); transition: transform 0.22s; transform-origin: bottom;   }
  .dl-item:hover { border-color: var(--crimson); color: var(--smoke); padding-left: 26px; }
  .dl-item:hover::before { transform: scaleY(1); }
  .dl-ico {  width: 42px; height: 42px; border-radius: 8px; flex-shrink: 0;  background: rgba(155,19,19,0.2); border: 1px solid rgba(155,19,19,0.3);  display: flex; align-items: center; justify-content: center; color: var(--blush); font-size: 17px;   }
  .dl-item:hover .dl-ico { background: var(--crimson-dim); border-color: var(--crimson); }
  .dl-name { font-size: 13.5px; line-height: 1.4; flex: 1; }
  .dl-arr { color: var(--ash-dim); transition: all 0.2s; }
  .dl-item:hover .dl-arr { color: var(--crimson); transform: translateX(4px); }

  /* ─────────── CONTACT ─────────── */
  .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: start; }
  .contact-card {  background: var(--ink-3); border: 1px solid rgba(205,28,24,0.2);  border-radius: 14px; overflow: hidden;   }
  .contact-card-hdr {  background: linear-gradient(135deg, var(--maroon), var(--ink-3));  padding: 24px 28px; border-bottom: 1px solid rgba(205,28,24,0.2);   }
  .contact-card-hdr h3 {  font-family: var(--font-display); font-size: 24px; letter-spacing: 2px;  background: linear-gradient(135deg, var(--smoke), var(--blush));  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;   }
  .contact-items { padding: 20px 28px; display: flex; flex-direction: column; gap: 20px; }
  .ci { display: flex; gap: 16px; align-items: flex-start; }
  .ci-icon {  width: 42px; height: 42px; border-radius: 9px; flex-shrink: 0;  background: var(--crimson-dim); border: 1px solid rgba(205,28,24,0.3);  display: flex; align-items: center; justify-content: center; color: var(--crimson); font-size: 16px;   }
  .ci h5 { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ash-dim); margin-bottom: 4px; }
  .ci p, .ci a { font-size: 14px; color: var(--ash); text-decoration: none; line-height: 1.5; transition: color 0.2s; }
  .ci a:hover { color: var(--blush); }

  .affil-tags { display: flex; flex-wrap: wrap; gap: 10px; padding: 0 28px 24px; }
  .affil-tag {  background: var(--crimson-dim); border: 1px solid rgba(205,28,24,0.3);  color: var(--ash); font-size: 11px; padding: 6px 14px; border-radius: 5px;  letter-spacing: 0.06em; transition: all 0.2s;   }
  .affil-tag:hover { background: var(--crimson); color: var(--smoke); }

  .map-wrap {  background: var(--ink-3); border: 1px solid rgba(205,28,24,0.2);  border-radius: 14px; overflow: hidden; height: 100%; min-height: 380px;   }
  .map-wrap iframe { width: 100%; height: 100%; border: none; min-height: 380px; filter: grayscale(40%) brightness(0.85); }


  /* ------------ Calendar ------------  */

  /* ─────────── FOOTER ─────────── */
  footer {  background: var(--maroon);  border-top: 1px solid rgba(205,28,24,0.3);  padding: 56px 0 24px;   }
  .footer-grid {  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px;   }
  .footer-desc { font-size: 13px; color: rgba(255,168,150,0.6); line-height: 1.75; margin-top: 16px; }
  .footer-socials { display: flex; gap: 10px; margin-top: 22px; }
  .soc-btn {  width: 36px; height: 36px; border-radius: 7px;  background: rgba(205,28,24,0.2); border: 1px solid rgba(205,28,24,0.3);  display: flex; align-items: center; justify-content: center;  color: var(--blush); font-size: 14px; text-decoration: none; transition: all 0.2s;   }
  .soc-btn:hover { background: var(--crimson); border-color: var(--crimson); color: var(--smoke); }
  .footer-col h4 {  font-family: var(--font-display); font-size: 16px; letter-spacing: 1px;  color: var(--blush); margin-bottom: 18px; padding-bottom: 10px;  border-bottom: 1px solid rgba(205,28,24,0.25);   }
  .footer-links { list-style: none; }
  .footer-links li { margin-bottom: 10px; }
  .footer-links a { color: rgba(255,168,150,0.6); text-decoration: none; font-size: 13px; transition: color 0.2s; }
  .footer-links a:hover { color: var(--blush); }
  .footer-bottom {  border-top: 1px solid rgba(205,28,24,0.2); padding-top: 24px;  display: flex; justify-content: space-between; align-items: center;  font-size: 12px; color: rgba(255,168,150,0.45);   }
  .footer-bottom span { color: var(--crimson); }

  /* ─────────── MOBILE NAV ─────────── */
  .mobile-nav {  position: fixed; inset: 0; background: var(--maroon);  z-index: 2000; display: flex; flex-direction: column;  padding: 80px 32px 32px; overflow-y: auto;  opacity: 0; transform: translateX(100%);  transition: all 0.32s cubic-bezier(0.4, 0, 0.2, 1); pointer-events: none;   }
  .mobile-nav.open { opacity: 1; transform: translateX(0); pointer-events: all; }
  .mn-close {  position: absolute; top: 18px; right: 18px;  width: 42px; height: 42px; background: var(--crimson-dim); border: 1px solid rgba(205,28,24,0.4);  border-radius: 8px; display: flex; align-items: center; justify-content: center;  cursor: pointer; color: var(--blush); font-size: 18px;   }
  .mn-links { list-style: none; }
  .mn-links > li { border-bottom: 1px solid rgba(205,28,24,0.2); }
  .mn-links > li > a {  display: block; padding: 17px 0;  font-family: var(--font-display); font-size: 26px; letter-spacing: 2px;  color: var(--smoke); text-decoration: none; transition: color 0.2s;   }
  .mn-links > li > a:hover { color: var(--blush); }
  .mn-sub { list-style: none; padding: 0 0 12px 16px; display: none; }
  .mn-sub.open { display: block; }
  .mn-sub a { display: block; padding: 8px 0; color: rgba(255,168,150,0.7); text-decoration: none; font-size: 13px; transition: color 0.2s; }
  .mn-sub a:hover { color: var(--blush); }

  /* ─────────── SCROLL TOP ─────────── */
  #scrollTop {  position: fixed; bottom: 28px; right: 28px;  width: 46px; height: 46px;  background: linear-gradient(135deg, var(--crimson), var(--deep-red));  border: none; border-radius: 10px; color: var(--smoke);  font-size: 16px; cursor: pointer;  display: flex; align-items: center; justify-content: center;  box-shadow: 0 4px 20px var(--crimson-glow);  opacity: 0; transform: translateY(10px); transition: all 0.3s; z-index: 500;   }
  #scrollTop.visible { opacity: 1; transform: translateY(0); }
  #scrollTop:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(205,28,24,0.5); }

  /* ─────────── FADE IN ─────────── */
  .fi {  opacity: 0; transform: translateY(22px);  transition: opacity 0.6s, transform 0.6s;   }
  .fi.in { opacity: 1; transform: none; }
  .fi.d1 { transition-delay: 0.1s; }
  .fi.d2 { transition-delay: 0.2s; }
  .fi.d3 { transition-delay: 0.3s; }

  /* ─────────── RESPONSIVE ─────────── */
  @media (max-width: 1024px) {  .about-grid { grid-template-columns: 1fr; }
 .about-sidebar { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
 .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
 .news-layout { grid-template-columns: 1fr; }
 .hero-rings { display: none; }
  }
  @media (max-width: 768px) {  nav { display: none; }
 .hamburger { display: flex; }
 .hero h1 { font-size: 50px; }
 .contact-grid { grid-template-columns: 1fr; }
 .president-card { flex-direction: column; text-align: center; }
 .footer-grid { grid-template-columns: 1fr; }
 .topbar { display: none; }
 .members-grid { grid-template-columns: repeat(2,1fr); }
 .section { padding: 56px 0; }
 .about-sidebar { grid-template-columns: 1fr; }
 .stats-row { grid-template-columns: repeat(3,1fr); gap: 10px; }
  }
  @media (max-width: 480px) {  .dl-grid { grid-template-columns: 1fr; }
 .members-grid { grid-template-columns: 1fr 1fr; }
 .stats-row { grid-template-columns: repeat(2,1fr); }
 .shooters-grid { grid-template-columns: 1fr 1fr; }}