/* contact.html specific styles */

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

.page { position:relative; z-index:1; max-width:900px; margin:0 auto; padding:100px 48px 80px; }

.page-title { font-family:'Special Elite',serif; font-size:56px; color:#fff; line-height:1; letter-spacing:0.04em; margin-bottom:8px; animation:fadeUp 0.7s 0.3s both; }
.page-title span { color:#c0392b; }

.cursor { display:inline-block; width:3px; height:44px; background:#c0392b; vertical-align:middle; margin-left:6px; animation:blink 1s step-end infinite; }

.contact-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px; margin-bottom:32px; }
.contact-card { background:#0a0a0a; border:1px solid #1a1a1a; border-radius:2px; padding:24px 28px; transition:border-color 0.2s; animation:fadeUp 0.6s 0.7s both; }
.contact-card:hover { border-color:rgba(192,57,43,0.4); }
.contact-card-label { font-family:'Special Elite',serif; font-size:10px; color:#aaa; letter-spacing:0.2em; text-transform:uppercase; margin-bottom:12px; }
.contact-card-value { font-family:'Special Elite',serif; font-size:18px; color:#fff; letter-spacing:0.04em; word-break:break-all; }
.contact-card-value a { color:#c0392b; text-decoration:none; transition:text-shadow 0.2s; }
.contact-card-value a:hover { text-shadow:0 0 16px rgba(192,57,43,0.8); }
.contact-card-sub { font-size:13px; color:#999; margin-top:8px; line-height:1.5; }

.lang-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:32px; }
.lang-card { background:#0a0a0a; border:1px solid #1a1a1a; border-radius:2px; padding:20px 16px; display:flex; flex-direction:column; gap:8px; transition:border-color 0.2s, background 0.2s; animation:fadeUp 0.6s 0.9s both; }
.lang-card:hover { border-color:#c0392b; background:#0d0505; }
.lang-icon { font-size:22px; line-height:1; }
.lang-name { font-family:'Special Elite',serif; font-size:16px; color:#fff; letter-spacing:0.06em; }
.lang-level { font-family:'Caveat',cursive; font-size:12px; letter-spacing:0.1em; text-transform:uppercase; }
.lang-level.active { color:#2ecc71; }
.lang-level.learning { color:#f39c12; }
.lang-bar { height:2px; background:#1a1a1a; border-radius:1px; margin-top:4px; overflow:hidden; }
.lang-bar-fill { height:100%; border-radius:1px; transition:width 1s ease; }
.lang-bar-fill.full { background:#c0392b; }
.lang-bar-fill.mid  { background:#f39c12; }

.tags-row { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:32px; animation:fadeUp 0.6s 1.1s both; }
.tag { font-family:'Special Elite',serif; font-size:12px; color:#ccc; letter-spacing:0.1em; text-transform:uppercase; border:1px solid #1f1f1f; border-radius:1px; padding:6px 14px; transition:border-color 0.2s, color 0.2s; }
.tag:hover { border-color:#c0392b; color:#c0392b; }
.tag.red { border-color:rgba(192,57,43,0.3); color:#c0392b; }

.cta-box { background:radial-gradient(ellipse at 50% 0%, rgba(60,0,0,0.4) 0%, transparent 70%), #080808; border:1px solid rgba(192,57,43,0.25); border-radius:2px; padding:36px 32px; text-align:center; animation:fadeUp 0.6s 1.2s both; }
.cta-box p { font-family:'Special Elite',serif; font-size:15px; color:#aaa; letter-spacing:0.04em; line-height:1.7; margin-bottom:20px; }
.cta-box p strong { color:#aaa; }
.btn-primary { display:inline-flex; align-items:center; gap:10px; height:44px; background:#c0392b; border-radius:2px; padding:0 32px; font-family:'Special Elite',serif; font-size:14px; color:#fff; text-decoration:none; letter-spacing:0.08em; text-transform:uppercase; transition:background 0.2s; box-shadow:0 0 20px rgba(192,57,43,0.4); }
.btn-primary:hover { background:#a93226; }