.warnihg{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    isolation:isolate;
    contain: layout style paint;
    overflow:hidden;
    position:relative;
  }
  .warnihg :where(div,p,span,a,svg,path,circle){ display:block; }
  .warnihg a{ display:flex; cursor:pointer; }
  .warnihg svg{ display:inline-block; }
  .warnihg b{ font-weight:700; }

  .warnihg{
    --bg-1:#0b0c10;
    --steel-light:#8993a6;
    --red-1:#7a0f1a;
    --red-2:#c81627;
    --red-3:#ff3b47;
    --gold:#e8b545;
    --paper:#f4ede1;
  }

  /* ===== rotating gear watermarks, behind everything ===== */
  .warnihg .gearfield{
    position:absolute;
    inset:0;
    z-index:0;
    overflow:hidden;
    pointer-events:none;
  }
  .warnihg .gearfield svg{
    position:absolute;
    opacity:.07;
    filter:drop-shadow(0 0 12px rgba(255,255,255,0.04));
  }
  .warnihg .gear-a{ width:520px; height:520px; top:-140px; left:-160px; animation:warnihg-spin 90s linear infinite; }
  .warnihg .gear-b{ width:380px; height:380px; bottom:-120px; right:-100px; animation:warnihg-spin-rev 70s linear infinite; }
  .warnihg .gear-c{ width:260px; height:260px; top:38%; right:6%; animation:warnihg-spin 50s linear infinite; }
  .warnihg .gear-d{ width:180px; height:180px; bottom:10%; left:4%; animation:warnihg-spin-rev 40s linear infinite; }

  @keyframes warnihg-spin{ from{transform:rotate(0deg);} to{transform:rotate(360deg);} }
  @keyframes warnihg-spin-rev{ from{transform:rotate(360deg);} to{transform:rotate(0deg);} }

  /* ===== card ===== */
  .warnihg .card{
    position:relative;
    z-index:2;
    max-width:760px;
    width:100%;
    border-radius:6px;
    background:linear-gradient(180deg, #14161c 0%, #0e0f13 100%);
    border:1px solid #2a2e38;
    box-shadow:
      0 40px 90px rgba(0,0,0,.55),
      0 0 0 1px rgba(255,255,255,.02) inset;
    animation:warnihg-rise .7s cubic-bezier(.2,.8,.25,1) both;
    overflow:hidden;
  }
  @keyframes warnihg-rise{
    from{opacity:0; transform:translateY(22px);}
    to{opacity:1; transform:translateY(0);}
  }

  .warnihg .stripe{
    height:10px;
    width:100%;
    background:repeating-linear-gradient(
      135deg,
      var(--gold) 0 18px,
      #14161c 18px 36px
    );
  }

  .warnihg .inner{ padding:38px 40px 32px; position:relative; }

  .warnihg .head{
    display:flex;
    align-items:center;
    gap:16px;
    margin-bottom:26px;
  }
  .warnihg .badge{
    flex:0 0 auto;
    width:56px;height:56px;
    border-radius:50%;
    background:radial-gradient(circle at 35% 30%, var(--red-3), var(--red-1) 75%);
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 0 0 4px rgba(200,22,39,.15), 0 8px 20px rgba(200,22,39,.35);
    position:relative;
  }
  .warnihg .badge svg{ animation:warnihg-pulse 2.6s ease-in-out infinite; }
  @keyframes warnihg-pulse{ 0%,100%{transform:scale(1);} 50%{transform:scale(1.1);} }

  .warnihg .eyebrow{
    font-size:12px;
    letter-spacing:2px;
    color:var(--steel-light);
    margin-bottom:4px;
  }
  .warnihg h1{
    display:block;
    font-size:23px;
    font-weight:800;
    color:var(--paper);
    letter-spacing:.2px;
    line-height:1.25;
  }
  .warnihg h1 span{ display:inline; color:var(--red-3); }

  .warnihg .lede{
    font-size:15.5px;
    line-height:1.7;
    color:#c8cad1;
    text-align:justify;
    hyphens:auto;
    margin-bottom:28px;
    padding-left:18px;
    border-left:2px solid var(--red-2);
  }
  .warnihg .lede b{ color:var(--paper); }

  .warnihg .actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:30px;
  }
  .warnihg .btn{
    flex:1 1 220px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:15px 20px;
    border-radius:4px;
    text-decoration:none;
    background:#1b1e26;
    border:1px solid #313644;
    color:#ffffff;
    font-size:14px;
    font-weight:600;
    transition:border-color .2s ease, background .2s ease, transform .2s ease;
  }
  .warnihg .btn:hover{
    border-color:var(--red-3);
    background:#20141a;
    transform:translateY(-2px);
  }
  .warnihg .btn .lbl{ display:flex; align-items:center; gap:10px; color:#ffffff; }
  .warnihg .btn svg.arrow{ opacity:.6; transition:transform .2s ease; }
  .warnihg .btn:hover svg.arrow{ transform:translate(3px,-3px); opacity:1; }

  .warnihg .rule{
    height:1px;
    background:linear-gradient(90deg, transparent, #333846 20%, #333846 80%, transparent);
    margin-bottom:28px;
  }

  .warnihg .alert{
    display:flex;
    align-items:center;
    gap:14px;
    background:linear-gradient(90deg, var(--red-1), var(--red-2));
    border-radius:5px;
    padding:16px 20px;
    margin-bottom:22px;
    box-shadow:0 10px 26px rgba(200,22,39,.28);
  }
  .warnihg .alert svg{ flex:0 0 auto; animation:warnihg-blink 2s ease-in-out infinite; }
  @keyframes warnihg-blink{ 0%,100%{opacity:1;} 50%{opacity:.45;} }
  .warnihg .alert p{
    font-size:14.5px;
    font-weight:700;
    letter-spacing:.3px;
    color:#fff;
    text-transform:uppercase;
  }

  .warnihg .note{
    font-size:14px;
    line-height:1.75;
    color:#a9adb8;
    text-align:justify;
    hyphens:auto;
    margin-bottom:26px;
  }
  .warnihg .note b{ color:var(--paper); }

  .warnihg .footer{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding-top:20px;
    border-top:1px dashed #2c303a;
    font-size:15px;
    font-weight:700;
    color:var(--gold);
    letter-spacing:.3px;
    text-align:center;
  }

  @media (max-width:600px){
    .warnihg .inner{ padding:28px 22px 24px; }
    .warnihg h1{ font-size:19px; }
    .warnihg .lede{ font-size:14px; }
    .warnihg .actions{ flex-direction:column; }
  }

  @media (prefers-reduced-motion: reduce){
    .warnihg *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; }
  }