/* typosquat.html specific styles */

@media (max-width:768px) {
  .nav { padding:0 20px; }
  .nav-links { display:none; }
  .page { padding:100px 24px 60px; }
  .domain-card { grid-template-columns:1fr !important; }
  .danger-grid { grid-template-columns:1fr !important; }
}

.page { position:relative; z-index:1; max-width:960px; margin:0 auto; padding:100px 48px 32px; }
.page-glow { background:radial-gradient(ellipse at 50% 20%, rgba(100,0,0,0.18) 0%, transparent 70%); }

.danger-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:40px; }
.danger-card { background:#0a0a0a; border:1px solid #1a1a1a; border-radius:2px; padding:20px; display:flex; flex-direction:column; gap:8px; transition:border-color 0.2s; animation:fadeUp 0.6s 0.7s both; }
.danger-card:hover { border-color:rgba(192,57,43,0.3); }
.danger-icon { font-size:20px; line-height:1; }
.danger-title { font-family:'Special Elite',serif; font-size:14px; color:#fff; letter-spacing:0.04em; }
.danger-desc { font-family:'Caveat',cursive; font-size:13px; color:#aaa; line-height:1.6; }

.domains-wrap { margin-bottom:40px; }
.domain-card { display:grid; grid-template-columns:1fr 40px 1fr 120px; align-items:center; background:#0a0a0a; border:1px solid #1a1a1a; border-radius:2px; margin-bottom:12px; overflow:hidden; transition:border-color 0.25s; animation:fadeUp 0.6s both; }
.domain-card:hover { border-color:rgba(192,57,43,0.35); }
.domain-cell { padding:20px 24px; display:flex; flex-direction:column; gap:6px; }
.domain-cell.fake { border-right:1px solid #1a1a1a; background:linear-gradient(135deg,#0d0404,#0a0a0a); }
.domain-cell.real { background:#080808; }
.domain-label { font-family:'Special Elite',serif; font-size:10px; letter-spacing:0.18em; text-transform:uppercase; }
.domain-label.fake-label { color:#c0392b; }
.domain-label.real-label { color:#2ecc71; }
.domain-url { font-family:'Special Elite',serif; font-size:18px; letter-spacing:0.06em; word-break:break-all; }
.domain-url.fake-url { color:#e8281e; }
.domain-url.real-url { color:#aaa; }
.domain-url .diff { text-decoration:underline; text-underline-offset:3px; text-decoration-color:rgba(232,40,30,0.6); }
.domain-arrow { display:flex; align-items:center; justify-content:center; font-size:18px; color:#999; border-left:1px solid #1a1a1a; border-right:1px solid #1a1a1a; height:100%; padding:0 8px; }
.domain-target { padding:20px; display:flex; flex-direction:column; gap:6px; border-left:1px solid #1a1a1a; }
.domain-target-label { font-family:'Special Elite',serif; font-size:10px; color:#aaa; letter-spacing:0.18em; text-transform:uppercase; }
.domain-org { font-family:'Special Elite',serif; font-size:13px; color:#bbb; letter-spacing:0.04em; }
.domain-status { display:inline-flex; align-items:center; gap:6px; font-family:'Special Elite',serif; font-size:10px; color:#2ecc71; letter-spacing:0.1em; text-transform:uppercase; margin-top:2px; }
.dot { width:5px; height:5px; border-radius:50%; background:#2ecc71; animation:pulse 2s infinite; }

.add-more { border:1px dashed #1f1f1f; border-radius:2px; padding:20px 24px; margin-bottom:40px; display:flex; align-items:center; gap:16px; color:#999; font-family:'Special Elite',serif; font-size:13px; letter-spacing:0.04em; animation:fadeUp 0.6s 1.1s both; }
.add-more-plus { font-size:24px; color:#1f1f1f; }

.warning-box { background:radial-gradient(ellipse at 50% 0%, rgba(60,0,0,0.35) 0%, transparent 70%), #080808; border:1px solid rgba(192,57,43,0.2); border-top:2px solid #c0392b; border-radius:2px; padding:28px 32px; margin-bottom:0; animation:fadeUp 0.6s 1.2s both; }
.warning-box p { font-family:'Special Elite',serif; font-size:15px; color:#aaa; line-height:1.8; letter-spacing:0.03em; }
.warning-box p strong { color:#aaa; }
.warning-box p em { color:#c0392b; font-style:normal; }
