/* ============================================================
       CSS VARIABLES
    ============================================================ */
    :root {
      --bg-primary:    #0B0F19;
      --bg-secondary:  #111827;
      --accent:        #39FF14;
      --accent-dim:    rgba(57,255,20,0.10);
      --accent-glow:   rgba(57,255,20,0.50);
      --text:          #FFFFFF;
      --text-muted:    #9CA3AF;
      --glass-bg:      rgba(255,255,255,0.04);
      --glass-border:  rgba(255,255,255,0.08);
      --glass-border-a:rgba(57,255,20,0.22);
      --ease:          cubic-bezier(0.4,0,0.2,1);
      --ease-spring:   cubic-bezier(0.34,1.56,0.64,1);
      --ease-out:      cubic-bezier(0,0,0.2,1);
    }
    *, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    html { scroll-behavior:smooth; }
    body {
      font-family:'Poppins',sans-serif;
      background:var(--bg-primary);
      color:var(--text);
      overflow-x:hidden;
    }

    /* ============================================================
       SECTION WRAPPER
    ============================================================ */
    .contact {
      position:relative;
      padding:130px 0 0;
      overflow:hidden;
      background:var(--bg-primary);
    }

    /* ── Background ── */
    .c-grid {
      position:absolute; inset:0; z-index:0;
      background-image:
        linear-gradient(rgba(57,255,20,.026) 1px,transparent 1px),
        linear-gradient(90deg,rgba(57,255,20,.026) 1px,transparent 1px);
      background-size:60px 60px;
      mask-image:radial-gradient(ellipse 90% 80% at 50% 50%,black 20%,transparent 100%);
    }
    .c-glow-l {
      position:absolute; z-index:0; top:10%; left:-12%;
      width:52vw; height:52vw; max-width:640px; max-height:640px;
      border-radius:50%;
      background:radial-gradient(circle,rgba(57,255,20,.07) 0%,transparent 70%);
      filter:blur(80px);
      animation:cDrift 14s ease-in-out infinite alternate;
    }
    .c-glow-r {
      position:absolute; z-index:0; bottom:20%; right:-8%;
      width:44vw; height:44vw; max-width:560px; max-height:560px;
      border-radius:50%;
      background:radial-gradient(circle,rgba(57,255,20,.055) 0%,transparent 70%);
      filter:blur(90px);
      animation:cDrift 16s 3s ease-in-out infinite alternate-reverse;
    }
    @keyframes cDrift {
      from{transform:translate(0,0) scale(1)} to{transform:translate(4%,6%) scale(1.1)}
    }
    .c-connector {
      position:absolute; top:0; left:50%; transform:translateX(-50%);
      width:1px; height:130px;
      background:linear-gradient(to bottom,transparent,var(--accent),transparent);
      opacity:.3; z-index:2;
    }
    /* Particles */
    .c-particles { position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
    .c-particle {
      position:absolute; width:var(--sz,2px); height:var(--sz,2px);
      border-radius:50%; background:var(--accent); opacity:0;
      animation:cpFloat var(--dur,10s) var(--dl,0s) linear infinite;
    }
    @keyframes cpFloat {
      0%  {transform:translateY(100vh) translateX(0);opacity:0}
      10% {opacity:.45} 90%{opacity:.15}
      100%{transform:translateY(-10vh) translateX(var(--dx,20px));opacity:0}
    }

    /* ============================================================
       INNER LAYOUT
    ============================================================ */
    .c-inner {
      position:relative; z-index:3;
      max-width:1320px; margin:0 auto;
      padding:0 28px;
    }

    /* ============================================================
       SECTION HEADER
    ============================================================ */
    .c-header {
      text-align:center; margin-bottom:72px;
      opacity:0; transform:translateY(30px);
      transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);
    }
    .c-header.revealed { opacity:1; transform:translateY(0); }

    .c-label {
      display:inline-flex; align-items:center; gap:12px;
      font-size:11px; font-weight:600; letter-spacing:3.5px; text-transform:uppercase;
      color:var(--accent); margin-bottom:20px;
    }
    .c-label-line {
      width:28px; height:2px; background:var(--accent);
      border-radius:99px; box-shadow:0 0 8px var(--accent-glow);
    }
    .c-heading {
      font-family:'Bebas Neue',cursive;
      font-size:clamp(44px,5.5vw,80px);
      line-height:.95; letter-spacing:2px; margin-bottom:20px;
    }
    .ch-white  { color:var(--text); display:block; }
    .ch-accent {
      display:block;
      background:linear-gradient(90deg,var(--accent),#b4ff8c 55%,var(--accent));
      background-size:200% auto;
      -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
      animation:shimmer 4s linear infinite;
    }
    @keyframes shimmer { to{background-position:200% center} }
    .c-desc {
      font-size:15px; font-weight:400; line-height:1.75; color:var(--text-muted);
      max-width:560px; margin:0 auto;
    }

    /* ============================================================
       MAIN SPLIT LAYOUT
    ============================================================ */
    .c-split {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:52px;
      align-items:start;
      margin-bottom:0;
    }

    /* ============================================================
       LEFT PANEL
    ============================================================ */
    .c-left {
      display:flex; flex-direction:column; gap:24px;
      opacity:0; transform:translateX(-36px);
      transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);
    }
    .c-left.revealed { opacity:1; transform:translateX(0); }

    /* ── Contact Cards ── */
    .contact-card {
      display:flex; align-items:flex-start; gap:18px;
      padding:20px 22px; border-radius:16px;
      background:var(--bg-secondary);
      border:1px solid var(--glass-border);
      position:relative; overflow:hidden;
      transition:transform .35s var(--ease-spring),
                 border-color .3s var(--ease),
                 box-shadow .3s var(--ease);
      cursor:default;
    }
    /* Left accent bar */
    .contact-card::before {
      content:''; position:absolute; left:0; top:0; bottom:0; width:3px;
      background:var(--accent); border-radius:0 99px 99px 0;
      transform:scaleY(0); transform-origin:center;
      transition:transform .3s var(--ease-spring);
    }
    .contact-card::after {
      content:''; position:absolute; inset:0;
      background:linear-gradient(135deg,rgba(57,255,20,.04) 0%,transparent 60%);
      opacity:0; transition:opacity .3s; pointer-events:none;
    }
    .contact-card:hover {
      transform:translateX(8px) translateY(-4px);
      border-color:var(--glass-border-a);
      box-shadow:0 0 24px rgba(57,255,20,.1),0 10px 30px rgba(0,0,0,.5);
    }
    .contact-card:hover::before { transform:scaleY(1); }
    .contact-card:hover::after  { opacity:1; }

    /* Icon */
    .card-icon-wrap {
      flex-shrink:0; width:50px; height:50px; border-radius:12px;
      background:var(--accent-dim); border:1px solid rgba(57,255,20,.22);
      display:flex; align-items:center; justify-content:center;
      font-size:22px; position:relative; z-index:1;
      transition:box-shadow .3s,transform .3s var(--ease-spring);
    }
    .contact-card:hover .card-icon-wrap {
      box-shadow:0 0 22px rgba(57,255,20,.4);
      transform:scale(1.08) rotate(-4deg);
    }
    .card-info { position:relative; z-index:1; }
    .card-info-label {
      font-size:10px; font-weight:600; letter-spacing:2.5px; text-transform:uppercase;
      color:var(--accent); margin-bottom:5px;
    }
    .card-info-main {
      font-family:'Bebas Neue',cursive; font-size:18px; letter-spacing:1.5px;
      color:var(--text); line-height:1.2;
      transition:color .25s;
    }
    .contact-card:hover .card-info-main { color:var(--accent); }
    .card-info-sub { font-size:12px; font-weight:400; color:var(--text-muted); margin-top:3px; line-height:1.5; }

    /* ── CTA Box ── */
    .cta-box {
      padding:28px 24px; border-radius:16px;
      background:linear-gradient(135deg,rgba(57,255,20,.07) 0%,rgba(17,24,39,.8) 100%);
      border:1px solid var(--glass-border-a);
      backdrop-filter:blur(12px);
      position:relative; overflow:hidden;
    }
    .cta-box::before {
      content:''; position:absolute; inset:0;
      background:linear-gradient(90deg,rgba(57,255,20,.015) 1px,transparent 1px),
                 linear-gradient(rgba(57,255,20,.015) 1px,transparent 1px);
      background-size:24px 24px; pointer-events:none;
    }
    .cta-box h3 {
      font-family:'Bebas Neue',cursive; font-size:28px; letter-spacing:2px;
      color:var(--text); margin-bottom:10px; position:relative; z-index:1;
    }
    .cta-box p {
      font-size:13px; font-weight:400; line-height:1.7; color:var(--text-muted);
      margin-bottom:20px; position:relative; z-index:1;
    }

    /* Primary CTA button */
    .btn-contact {
      position:relative; display:inline-flex; align-items:center; gap:10px;
      padding:13px 28px; border-radius:10px;
      background:var(--accent); color:var(--bg-primary);
      font-family:'Poppins',sans-serif; font-size:13px;
      font-weight:700; letter-spacing:1.2px; text-transform:uppercase;
      text-decoration:none; border:none; cursor:pointer; overflow:hidden;
      transition:transform .2s var(--ease-spring),box-shadow .3s var(--ease);
      box-shadow:0 0 28px rgba(57,255,20,.38),0 4px 20px rgba(0,0,0,.4);
      z-index:1;
    }
    @property --angle { syntax:'<angle>'; inherits:false; initial-value:0deg; }
    @keyframes rotateBorder { to{--angle:360deg} }
    .btn-contact::before {
      content:''; position:absolute; inset:-2px; border-radius:12px;
      background:conic-gradient(from var(--angle,0deg),var(--accent) 0%,transparent 30%,transparent 70%,var(--accent) 100%);
      z-index:-1; opacity:0; transition:opacity .3s;
      animation:rotateBorder 2.5s linear infinite;
    }
    .btn-contact::after { content:''; position:absolute; inset:0; background:var(--accent); border-radius:10px; z-index:-1; }
    .btn-contact:hover { transform:translateY(-3px) scale(1.04); box-shadow:0 0 50px rgba(57,255,20,.65),0 8px 30px rgba(0,0,0,.4); }
    .btn-contact:hover::before { opacity:1; }
    .btn-contact:active { transform:scale(.97); }
    .btn-c-shine {
      position:absolute; top:-50%; left:-75%; width:50%; height:200%;
      background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);
      transform:skewX(-20deg); transition:left .5s var(--ease); pointer-events:none;
    }
    .btn-contact:hover .btn-c-shine { left:150%; }
    .btn-c-arrow { transition:transform .25s var(--ease-spring); }
    .btn-contact:hover .btn-c-arrow { transform:translateX(5px); }

    /* ── Social Links ── */
    .social-row {
      display:flex; align-items:center; gap:10px; flex-wrap:wrap;
    }
    .social-label {
      font-size:10px; font-weight:600; letter-spacing:2px; text-transform:uppercase;
      color:var(--text-muted); margin-right:4px;
    }
    .social-btn {
      width:44px; height:44px; border-radius:12px;
      display:flex; align-items:center; justify-content:center;
      background:var(--glass-bg); border:1px solid var(--glass-border);
      text-decoration:none; font-size:20px;
      transition:border-color .25s,box-shadow .25s,transform .2s var(--ease-spring),background .25s;
      position:relative; overflow:hidden;
    }
    .social-btn::before {
      content:''; position:absolute; inset:0; border-radius:12px;
      background:var(--s-color,var(--accent-dim)); opacity:0; transition:opacity .25s;
    }
    .social-btn:hover {
      border-color:var(--s-border,rgba(57,255,20,.45));
      box-shadow:0 0 18px var(--s-glow,rgba(57,255,20,.3));
      transform:translateY(-4px) scale(1.1);
    }
    .social-btn:hover::before { opacity:1; }
    .social-btn span { position:relative; z-index:1; }

    /* ============================================================
       RIGHT PANEL — MAP
    ============================================================ */
    .c-right {
      opacity:0; transform:translateX(36px);
      transition:opacity .8s .15s var(--ease-out),transform .8s .15s var(--ease-out);
    }
    .c-right.revealed { opacity:1; transform:translateX(0); }

    /* Map container */
    .map-container {
      position:relative; border-radius:22px; overflow:hidden;
      border:1px solid var(--glass-border-a);
      box-shadow:0 0 50px rgba(57,255,20,.1),0 40px 80px rgba(0,0,0,.6);
    }

    /* Spinning outer ring around map */
    .map-ring {
      position:absolute; inset:-12px; border-radius:26px;
      border:1px solid rgba(57,255,20,.07); pointer-events:none; z-index:5;
    }
    .map-ring-dot {
      position:absolute; top:-3px; left:50%; transform:translateX(-50%);
      width:6px; height:6px; border-radius:50%;
      background:var(--accent); box-shadow:0 0 12px var(--accent-glow);
      animation:dotOrbit 10s linear infinite;
    }
    @keyframes dotOrbit { to{offset-distance:100%} }

    /* The actual iframe */
    .map-frame {
      width:100%; height:420px; border:none; display:block;
      filter:brightness(.85) contrast(1.05) saturate(.7) hue-rotate(100deg);
      transition:filter .4s;
    }
    .map-container:hover .map-frame { filter:brightness(.95) contrast(1.08) saturate(.85) hue-rotate(100deg); }

    /* Dark overlay on map */
    .map-overlay {
      position:absolute; inset:0; pointer-events:none; z-index:2;
      background:linear-gradient(to top,rgba(11,15,25,.9) 0%,rgba(11,15,25,.15) 40%,transparent 70%);
    }

    /* Scan-line texture */
    .map-scanlines {
      position:absolute; inset:0; z-index:3; pointer-events:none;
      background:repeating-linear-gradient(
        0deg, transparent 0px, transparent 3px,
        rgba(0,0,0,.06) 3px, rgba(0,0,0,.06) 4px
      );
    }

    /* Map info bar at bottom */
    .map-info-bar {
      position:absolute; bottom:0; left:0; right:0; z-index:4;
      padding:20px 24px;
      display:flex; align-items:flex-end; justify-content:space-between; gap:16px;
      flex-wrap:wrap;
    }
    .map-address {
      display:flex; align-items:flex-start; gap:10px;
    }
    .map-pin-icon {
      font-size:22px; margin-top:2px; filter:drop-shadow(0 0 8px rgba(57,255,20,.6));
      animation:pinBounce 2s ease-in-out infinite;
    }
    @keyframes pinBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }
    .map-addr-text {}
    .map-addr-name {
      font-family:'Bebas Neue',cursive; font-size:18px; letter-spacing:2px; color:var(--text);
    }
    .map-addr-sub { font-size:11px; font-weight:400; color:var(--text-muted); margin-top:2px; }

    /* Open maps button */
    .btn-open-maps {
      display:inline-flex; align-items:center; gap:7px;
      padding:9px 18px; border-radius:8px;
      background:var(--accent-dim); border:1px solid rgba(57,255,20,.3);
      color:var(--accent); text-decoration:none;
      font-size:11px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase;
      transition:background .25s,border-color .25s,box-shadow .25s,transform .2s var(--ease-spring);
      white-space:nowrap;
    }
    .btn-open-maps:hover {
      background:rgba(57,255,20,.14); border-color:rgba(57,255,20,.55);
      box-shadow:0 0 16px rgba(57,255,20,.2); transform:translateY(-2px);
    }
    .bom-arrow { transition:transform .25s var(--ease-spring); }
    .btn-open-maps:hover .bom-arrow { transform:translateX(4px); }

    /* Floating location badges */
    .map-badge {
      position:absolute; z-index:4;
      background:rgba(11,15,25,.9); backdrop-filter:blur(12px);
      border:1px solid rgba(57,255,20,.25); border-radius:12px;
      padding:10px 16px; pointer-events:none;
      box-shadow:0 8px 24px rgba(0,0,0,.5),0 0 14px rgba(57,255,20,.06);
    }
    .mb-dot { width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 8px var(--accent-glow); margin-bottom:5px; animation:mblink 2s infinite; }
    @keyframes mblink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.7)}}
    .mb-title { font-family:'Bebas Neue',cursive; font-size:13px; letter-spacing:2px; color:var(--text); }
    .mb-sub   { font-size:9px; font-weight:500; letter-spacing:1.5px; text-transform:uppercase; color:var(--text-muted); margin-top:1px; }

    .mb-tl { top:14px; left:14px; animation:mbFloat1 6s ease-in-out infinite; }
    .mb-tr { top:14px; right:14px; animation:mbFloat2 7s 1s ease-in-out infinite; }
    @keyframes mbFloat1{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
    @keyframes mbFloat2{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

    /* ── Quick stats row below map ── */
    .map-stats {
      display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
      margin-top:16px;
    }
    .ms-card {
      padding:16px; border-radius:12px;
      background:var(--glass-bg); border:1px solid var(--glass-border);
      text-align:center;
      transition:border-color .3s,box-shadow .3s,transform .3s var(--ease-spring);
      cursor:default;
    }
    .ms-card:hover {
      border-color:var(--glass-border-a); box-shadow:0 0 18px rgba(57,255,20,.1);
      transform:translateY(-4px);
    }
    .ms-num  { font-family:'Bebas Neue',cursive; font-size:28px; letter-spacing:1px; color:var(--accent); text-shadow:0 0 18px var(--accent-glow); line-height:1; }
    .ms-lbl  { font-size:9px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:var(--text-muted); margin-top:3px; }

    /* ============================================================
       FOOTER BAR
    ============================================================ */
    .c-footer-bar {
      margin-top:80px;
      padding:40px 28px;
      background:rgba(17,24,39,.7);
      backdrop-filter:blur(20px);
      border-top:1px solid rgba(57,255,20,.1);
      position:relative; z-index:3;
    }
    .footer-bar-inner {
      max-width:1320px; margin:0 auto;
      display:flex; align-items:center; justify-content:space-between;
      flex-wrap:wrap; gap:20px;
    }
    .footer-brand {
      display:flex; align-items:center; gap:12px; text-decoration:none;
    }
    .footer-brand-icon {
      width:40px; height:40px; flex-shrink:0;
      animation:logoFloat 4s ease-in-out infinite;
    }
    @keyframes logoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
    .footer-brand-icon svg { width:100%; height:100%; filter:drop-shadow(0 0 8px rgba(57,255,20,.5)); }
    .footer-brand-name {
      font-family:'Bebas Neue',cursive; font-size:20px; letter-spacing:2px;
      background:linear-gradient(135deg,#fff 40%,var(--accent) 100%);
      -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
    }
    .footer-tagline { font-size:9px; font-weight:500; letter-spacing:3px; text-transform:uppercase; color:var(--accent); opacity:.8; margin-top:1px; }

    .footer-links {
      display:flex; align-items:center; gap:24px; flex-wrap:wrap;
    }
    .footer-links a {
      font-size:12px; font-weight:500; letter-spacing:.5px; color:var(--text-muted);
      text-decoration:none; transition:color .25s;
    }
    .footer-links a:hover { color:var(--accent); }

    .footer-copy {
      font-size:11px; font-weight:400; color:var(--text-muted);
      opacity:.7; text-align:right;
    }
    .footer-copy span { color:var(--accent); }

    /* ============================================================
       SCROLL REVEAL UTILITY
    ============================================================ */
    .sr { opacity:0; transform:translateY(28px); transition:opacity .7s var(--ease-out),transform .7s var(--ease-out); }
    .sr.revealed { opacity:1; transform:translateY(0); }
    .sr-d1{transition-delay:.1s} .sr-d2{transition-delay:.2s} .sr-d3{transition-delay:.3s}

    /* ============================================================
       RESPONSIVE
    ============================================================ */
    @media(max-width:1024px) {
      .c-split { grid-template-columns:1fr; gap:40px; }
      .c-left,.c-right { opacity:1; transform:none; }
    }
    @media(max-width:700px) {
      .contact { padding:80px 0 0; }
      .c-inner { padding:0 16px; }
      .map-frame { height:300px; }
      .map-stats { grid-template-columns:repeat(3,1fr); }
      .footer-bar-inner { flex-direction:column; align-items:flex-start; }
      .footer-copy { text-align:left; }
      .mb-tr { display:none; }
    }
    @media(max-width:480px) {
      .map-stats { grid-template-columns:repeat(3,1fr); gap:8px; }
      .ms-num   { font-size:22px; }
      .footer-links { gap:14px; }
    }