:root{
    --blue-deep:#1B3F91;
    --blue-ink:#12295E;
    --red-brand:#D62727;
    --wheat:#C89B3C;
    --cream:#F6F3EC;
    --paper:#FFFFFF;
    --ink:#1E2126;
    --steel:#667085;
    --line:#E4DFD3;
    --font-display:'Oswald', sans-serif;
    --font-body:'Inter', sans-serif;
    --font-mono:'IBM Plex Mono', monospace;
    --font-ar:'Cairo', sans-serif;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html,body{height:100%;}
  body{
    background:var(--cream);
    color:var(--ink);
    font-family:var(--font-body);
    -webkit-font-smoothing:antialiased;
    display:flex;
    flex-direction:column;
    overflow-x:hidden;
  }
  html[dir="rtl"] body{ font-family:var(--font-ar); }
  html[dir="rtl"] h1, html[dir="rtl"] .eyebrow{ font-family:var(--font-ar); }
  img{max-width:100%; display:block;}

  /* faint field-row texture in the background, always present, never "loading" */
  body::before{
    content:"";
    position:fixed; inset:0;
    background-image:repeating-linear-gradient(180deg, rgba(27,63,145,.035) 0 1px, transparent 1px 34px);
    pointer-events:none;
  }

  header{
    display:flex; align-items:center; justify-content:space-between;
    padding:22px 28px;
    position:relative; z-index:2;
  }
  .lang-switch{display:flex; gap:4px; background:var(--paper); padding:4px; border-radius:999px; border:1px solid var(--line);}
  .lang-switch button{
    border:none; background:transparent; padding:6px 13px;
    font-family:var(--font-mono); font-size:11.5px; font-weight:600;
    letter-spacing:.05em; color:var(--steel); cursor:pointer; border-radius:999px;
    transition:background .15s ease, color .15s ease;
  }
  .lang-switch button.active{background:var(--blue-deep); color:#fff;}

  main{
    flex:1;
    display:flex; align-items:center; justify-content:center;
    position:relative; z-index:2;
    padding:20px 24px 0;
  }
  .stage{width:100%; max-width:620px; text-align:center;}

  .eyebrow{
    font-family:var(--font-mono); font-size:12px; font-weight:600;
    letter-spacing:.14em; text-transform:uppercase; color:var(--red-brand);
    display:inline-flex; align-items:center; gap:8px; margin-bottom:20px;
  }
  .eyebrow::before{content:""; width:7px; height:7px; background:var(--red-brand); border-radius:50%; display:inline-block; animation:pulse 1.8s ease-in-out infinite;}

  h1{
    font-family:var(--font-display); font-weight:700; font-size:clamp(30px,5.4vw,50px);
    line-height:1.08; color:var(--blue-ink); letter-spacing:-.01em; margin-bottom:16px;
  }
  html[dir="rtl"] h1{ font-weight:800; }

  p.lead{
    font-size:16px; color:var(--steel); max-width:42ch; margin:0 auto 56px;
  }

  /* ---- signature element: a tractor tilling an endless furrow ---- */
  .field{
    position:relative;
    width:100%;
    max-width:460px;
    margin:0 auto 14px;
    height:74px;
  }
  .soil-line{
    position:absolute; left:0; right:0; bottom:14px; height:2px;
    background:var(--line);
  }
  .furrow-fill{
    position:absolute; left:0; bottom:14px; height:2px;
    width:0%;
    background-image:repeating-linear-gradient(90deg, var(--wheat) 0 6px, transparent 6px 12px);
    animation:fillFurrow 6.4s linear infinite;
  }
  .tractor{
    position:absolute; bottom:14px; left:0;
    width:58px; height:40px;
    animation:driveTractor 6.4s linear infinite;
  }
  .tractor svg{width:100%; height:100%; overflow:visible; display:block;}
  .wheel{animation:spin 0.7s linear infinite;}
  .dust{animation:puff 0.9s ease-out infinite;}
  .dust:nth-child(2){animation-delay:.3s;}

  @keyframes fillFurrow{
    0%{width:0%; opacity:1;}
    88%{width:100%; opacity:1;}
    94%{opacity:0;}
    94.01%{width:0%;}
    100%{width:0%; opacity:0;}
  }
  @keyframes driveTractor{
    0%{transform:translateX(0); opacity:1;}
    88%{transform:translateX(calc(100% - 58px)); opacity:1;}
    94%{opacity:0;}
    94.01%{transform:translateX(0); opacity:0;}
    100%{transform:translateX(0); opacity:1;}
  }
  @keyframes spin{ to{ transform:rotate(360deg); } }
  @keyframes puff{
    0%{opacity:.5; transform:translateY(0) scale(.6);}
    100%{opacity:0; transform:translateY(-10px) scale(1.15);}
  }
  @keyframes pulse{
    0%,100%{opacity:1;} 50%{opacity:.25;}
  }

  .preorder-btn{
    display:inline-flex; align-items:center; gap:8px;
    margin-top:8px;
    padding:13px 30px;
    background:var(--red-brand);
    color:#fff;
    font-family:var(--font-body);
    font-weight:600;
    font-size:15px;
    text-decoration:none;
    border-radius:999px;
    box-shadow:0 8px 20px rgba(214,39,39,.25);
    transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  }
  html[dir="rtl"] .preorder-btn{ font-family:var(--font-ar); }
  .preorder-btn:hover{
    background:#b81f1f;
    transform:translateY(-2px);
    box-shadow:0 12px 24px rgba(214,39,39,.32);
  }
  .preorder-btn:active{ transform:translateY(0); }

  footer{
    position:relative; z-index:2;
    text-align:center; padding:26px 20px 30px;
    font-size:12.5px; color:var(--steel);
    letter-spacing:.02em;
  }

  .infos-links a {
    margin: 0 1em;
    color: var(--steel);
    text-decoration: none;
    font-size: 12.5px;
}

  @media (prefers-reduced-motion: reduce){
    .tractor, .furrow-fill, .wheel, .dust, .eyebrow::before{animation:none !important;}
    .furrow-fill{width:62%;}
    .tractor{transform:translate(62%,-100%);}
  }

  @media (max-width:520px){
    header{padding:18px 18px;}
    .brand img{height:24px;}
    p.lead{margin-bottom:44px;}
  }