*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
 
    :root {
      --bg: #08111f;
      --accent: #00d4ff;
      --accent2: #ff6b35;
      --text: #e8edf5;
      --muted: #5a6478;
    }
 
    html, body {
      width: 100%; height: 100%;
      overflow: hidden;
    }
 
    body {
      background: var(--bg);
      color: var(--text);
      font-family: 'Outfit', sans-serif;
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 100vh;
      position: relative;
    }
 
    /* ── Blob background ── */
    .blobs {
      position: fixed; inset: 0; z-index: 0;
      overflow: hidden;
    }
 
    .blob {
      position: absolute;
      border-radius: 50%;
      filter: blur(0px);
      opacity: 1;
    }
 
    /* Large blobs — bottom left cluster */
    .blob-1 {
      width: 55vw; height: 55vw;
      background: radial-gradient(circle at 40% 40%, rgba(15,60,80,0.85), rgba(8,30,50,0.6) 60%, transparent 80%);
      bottom: -18vw; left: -12vw;
      animation: blobDrift1 18s ease-in-out infinite;
    }
    .blob-2 {
      width: 40vw; height: 40vw;
      background: radial-gradient(circle at 50% 50%, rgba(10,55,65,0.75), rgba(8,25,45,0.5) 60%, transparent 80%);
      bottom: -10vw; left: 18vw;
      animation: blobDrift2 22s ease-in-out infinite;
    }
    .blob-3 {
      width: 32vw; height: 32vw;
      background: radial-gradient(circle at 50% 50%, rgba(12,50,70,0.7), rgba(8,25,45,0.4) 60%, transparent 80%);
      bottom: 5vw; left: 5vw;
      animation: blobDrift3 16s ease-in-out infinite;
    }
 
    /* Right side blobs */
    .blob-4 {
      width: 50vw; height: 50vw;
      background: radial-gradient(circle at 55% 45%, rgba(10,55,70,0.8), rgba(8,30,50,0.55) 60%, transparent 80%);
      top: -15vw; right: -10vw;
      animation: blobDrift2 20s ease-in-out infinite reverse;
    }
    .blob-5 {
      width: 36vw; height: 36vw;
      background: radial-gradient(circle at 45% 55%, rgba(8,45,60,0.65), rgba(8,22,40,0.4) 60%, transparent 80%);
      top: 15vw; right: 5vw;
      animation: blobDrift1 25s ease-in-out infinite reverse;
    }
    .blob-6 {
      width: 28vw; height: 28vw;
      background: radial-gradient(circle at 50% 50%, rgba(12,48,65,0.6), transparent 70%);
      bottom: 10vw; right: 8vw;
      animation: blobDrift3 19s ease-in-out infinite;
    }
 
    /* Centre subtle blob */
    .blob-7 {
      width: 45vw; height: 35vw;
      background: radial-gradient(circle at 50% 50%, rgba(10,50,68,0.45), transparent 70%);
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      animation: blobDrift2 28s ease-in-out infinite;
    }
 
    @keyframes blobDrift1 {
      0%, 100% { transform: translate(0, 0) scale(1); }
      33%       { transform: translate(2vw, -2vw) scale(1.03); }
      66%       { transform: translate(-1.5vw, 2.5vw) scale(0.97); }
    }
    @keyframes blobDrift2 {
      0%, 100% { transform: translate(0, 0) scale(1); }
      40%       { transform: translate(-2.5vw, 2vw) scale(1.04); }
      70%       { transform: translate(2vw, -1.5vw) scale(0.98); }
    }
    @keyframes blobDrift3 {
      0%, 100% { transform: translate(0, 0) scale(1); }
      50%       { transform: translate(1.5vw, 3vw) scale(1.02); }
    }
 
    /* Blob border glow edges */
    .blob-edge {
      position: absolute;
      border-radius: 50%;
      border: 1px solid rgba(0, 200, 230, 0.07);
    }
    .blob-edge-1 {
      width: 55vw; height: 55vw;
      bottom: -18vw; left: -12vw;
      animation: blobDrift1 18s ease-in-out infinite;
    }
    .blob-edge-2 {
      width: 50vw; height: 50vw;
      top: -15vw; right: -10vw;
      animation: blobDrift2 20s ease-in-out infinite reverse;
    }
 
    /* Scanline */
    .scanline {
      position: fixed; inset: 0; z-index: 2; pointer-events: none;
      background: repeating-linear-gradient(
        0deg, transparent, transparent 2px,
        rgba(0,0,0,0.025) 2px, rgba(0,0,0,0.025) 4px
      );
    }
 
    /* Corner brackets */
    .corner {
      position: fixed; width: 36px; height: 36px; z-index: 5;
    }
    .corner::before, .corner::after {
      content: ''; position: absolute; background: rgba(0,212,255,0.3);
    }
    .corner::before { width: 1px; height: 100%; }
    .corner::after  { width: 100%; height: 1px; }
    .corner-tl { top: 28px; left: 28px; }
    .corner-tr { top: 28px; right: 28px; transform: scaleX(-1); }
    .corner-bl { bottom: 28px; left: 28px; transform: scaleY(-1); }
    .corner-br { bottom: 28px; right: 28px; transform: scale(-1); }
 
    /* ── Main content ── */
    .container {
      position: relative; z-index: 10;
      text-align: center;
      padding: 2rem;
      max-width: 860px;
      width: 100%;
    }
 
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(30px); }
      to   { opacity: 1; transform: translateY(0); }
    }
 
    .eyebrow {
      display: flex; align-items: center; justify-content: center;
      gap: 14px; margin-bottom: 2.2rem;
      animation: fadeUp 1.2s 0.1s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .eyebrow-line {
      width: 48px; height: 1px;
      background: linear-gradient(90deg, transparent, var(--accent));
    }
    .eyebrow-line.right {
      background: linear-gradient(90deg, var(--accent), transparent);
    }
    .eyebrow-text {
      font-size: 0.63rem; letter-spacing: 0.34em;
      text-transform: uppercase; color: var(--accent); font-weight: 300;
    }
 
    .logo {
      font-family: 'Good Times', sans-serif;
      font-size: clamp(1.1rem, 3.5vw, 2.8rem);
      font-weight: 400;
      letter-spacing: 0.08em;
      white-space: nowrap;
      color: #fff;
      text-shadow: 0 0 60px rgba(0,212,255,0.2);
      margin-bottom: 0.4rem;
      animation: fadeUp 1.2s 0.2s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .logo span { color: var(--accent); }
 
    .logo-sub {
      font-size: 0.65rem; letter-spacing: 0.28em;
      text-transform: uppercase; color: var(--muted); font-weight: 300;
      margin-bottom: 3rem;
      animation: fadeUp 1.2s 0.28s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
 
    .divider {
      display: flex; align-items: center; justify-content: center;
      gap: 16px; margin-bottom: 3rem;
      animation: fadeUp 1.2s 0.36s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .divider-line {
      flex: 1; max-width: 110px; height: 1px;
      background: linear-gradient(90deg, transparent, var(--muted));
    }
    .divider-line.right {
      background: linear-gradient(90deg, var(--muted), transparent);
    }
    .divider-dot {
      width: 5px; height: 5px; border-radius: 50%;
      background: var(--accent2);
      box-shadow: 0 0 10px var(--accent2);
    }
 
    .coming-soon-fr {
      font-size: clamp(2.8rem, 8vw, 6.2rem);
      font-weight: 200; letter-spacing: -0.01em; line-height: 1;
      color: #fff; margin-bottom: 0.4rem;
      animation: fadeUp 1.2s 0.44s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .coming-soon-fr em {
      font-style: normal;
      color: transparent;
      -webkit-text-stroke: 1px rgba(255,255,255,0.3);
    }
 
    .coming-soon-en {
      font-size: clamp(0.72rem, 1.8vw, 1rem);
      font-weight: 300; letter-spacing: 0.46em;
      text-transform: uppercase; color: var(--muted);
      margin-bottom: 3rem;
      animation: fadeUp 1.2s 0.52s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
 
    .pulse-wrap {
      display: flex; align-items: center; justify-content: center;
      gap: 8px; margin-bottom: 1.8rem;
      animation: fadeUp 1.2s 0.58s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .pulse-dot {
      width: 7px; height: 7px; border-radius: 50%;
      background: var(--accent);
      animation: pulse 2.4s ease-out infinite;
    }
    @keyframes pulse {
      0%   { box-shadow: 0 0 0 0 rgba(0,212,255,0.5); }
      70%  { box-shadow: 0 0 0 10px rgba(0,212,255,0); }
      100% { box-shadow: 0 0 0 0 rgba(0,212,255,0); }
    }
    .pulse-label {
      font-size: 0.61rem; letter-spacing: 0.28em;
      text-transform: uppercase; color: var(--accent); font-weight: 300;
    }
 
    .tags {
      display: flex; flex-wrap: wrap; justify-content: center;
      gap: 10px; margin-bottom: 3rem;
      animation: fadeUp 1.2s 0.65s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .tag {
      font-size: 0.61rem; letter-spacing: 0.2em;
      text-transform: uppercase; font-weight: 300;
      color: var(--muted);
      border: 1px solid rgba(90,100,120,0.3);
      padding: 6px 14px; border-radius: 2px;
      background: rgba(255,255,255,0.03);
      transition: all 0.3s ease; cursor: default;
    }
    .tag:hover {
      color: var(--accent);
      border-color: rgba(0,212,255,0.3);
      background: rgba(0,212,255,0.05);
    }
 
    .bottom-bar {
      display: flex; align-items: center; justify-content: center;
      gap: 10px;
      animation: fadeUp 1.2s 0.78s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .bar-line {
      width: 30px; height: 1px;
      background: linear-gradient(90deg, transparent, var(--accent2));
    }
    .bar-line.right {
      background: linear-gradient(90deg, var(--accent2), transparent);
    }
    .bar-text {
      font-size: 0.59rem; letter-spacing: 0.3em;
      text-transform: uppercase; color: rgba(255,107,53,0.5);
    }