/* ============ Design tokens ============ */
:root{
  --bg:#0b0e14;                 /* основен фон */
  --panel:#111726;              /* панели / модали */
  --text:#e8ecf3;               /* основен текст */
  --muted:#a3acc7;              /* вторичен текст */
  --accent:#dca953;            /* СИН акцент (corporate) */
  --accent-weak:rgba(74,168,255,.25);
  --warning:#f5d267;            /* ЖЪЛТО – само за AI картите */
  --danger:#ff4a4a;             /* по желание за red-team маркировки */
  --glass:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  --border:rgba(255,255,255,.08);
}

*{ box-sizing:border-box }
html,body{ height:100% }
body{
  margin:0;
  font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  color:var(--text);
  background: var(--bg);
}

/* >>> ADDED: Глобален reset – премахва underline навсякъде */
a,
a:link,
a:visited,
a:hover,
a:active,
a:focus,
a:focus-visible{
  text-decoration:none !important;
  -webkit-text-decoration:none !important;
}

/* >>> ADDED: ако има <u> или <ins> в съдържание, нека не подчертават */
u, ins{
  text-decoration:none !important;
  border-bottom:0 !important;
}

/* >>> ADDED: utility клас ако някъде ИСКАШ underline умишлено */
.link-underline{
  text-decoration:underline !important;
  text-underline-offset:3px;
}

/* Лепкав футър: .site контейнер вместо body да е flex */
.site{
  min-height:100svh;
  display:flex;
  flex-direction:column;
}
.site-main{ flex:1 0 auto; }
.site-footer{ flex-shrink:0; }

/* ===== Background canvas: под всичко ===== */
#bg-canvas{
  position:fixed; inset:0;
  z-index:0;            /* под съдържанието */
  pointer-events:none;  /* да не пречи на кликове */
}
/* Glowing само за лого + H1 */
.glow-blue {
  color: var(--accent);
  text-shadow: 0 0 8px rgba(109, 113, 114, 0.179), 0 0 18px rgba(227, 231, 235, 0.239);
}

/* Син без glow (за H2/H3/H4 и др.) */
.blue-heading {
  color: var(--accent);
}

/* ===== Общи контейнери ===== */
.container{
  width:min(1200px, 92vw);
  margin:0 auto;
  padding-inline:1rem;
}

/* ===== Header / Nav ===== */
.site-header{
  position:relative;
  z-index:2; /* над канваса */
  background: transparent;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.navbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0;
}

.brand a{
  color:var(--text); text-decoration:none;
}
.brand-title{
  font-weight:900; font-size: clamp(22px, 3vw, 30px);
  letter-spacing:.2px;
  /* НЕ е underline; правим лек glow */
  text-shadow:
    0 0 12px rgba(74,168,255,.25),
    0 0 28px rgba(74,168,255,.18);
}

/* Desktop nav */
.nav-links{
  display:flex; gap:18px; align-items:center;
}
.nav-links a{
  color:var(--text); text-decoration:none; opacity:.9;
  padding:8px 10px; border-radius:10px;
  transition: background .2s ease, opacity .2s ease, border-color .2s ease;
  border:1px solid transparent;
}
.nav-links a:hover{
  /* възможно най-прозрачен hover; само лека рамка и блясък */
  background: rgba(255,255,255,.02);
  border-color: rgba(255,255,255,.06);
  opacity:1;
}

/* Burger (mobile) */
.burger{
  display:none;
  width:40px; height:40px; border-radius:10px;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  align-items:center; justify-content:center;
  cursor:pointer; color:var(--text);
}
.burger:active{ transform: translateY(1px) }

.mobile-menu{
  display:none;
  position:absolute; top:100%; right:1rem; left:1rem;
  background: var(--panel);
  border:1px solid var(--border);
  border-radius:14px; padding:10px;
  z-index:4;
}
.mobile-menu a{
  display:block; padding:10px 12px; border-radius:10px;
  color:var(--text); text-decoration:none;
}
.mobile-menu a:hover{
  background: rgba(255,255,255,.03);
}

/* Responsive */
@media (max-width: 900px){
  .nav-links{ display:none }
  .burger{ display:flex }
}

/* ===== Hero / секции ===== */

.section {
  position: relative;
  z-index: 1; /* над канваса */
  padding: clamp(40px, 6vw, 80px) 0;
}

/* Desktop section spacing */
@media (min-width: 901px) {
  .section {
    padding: 40px 0;
  }
}



.hero{
  text-align:center;
}
.hero h1{
  font-size: clamp(28px, 4.5vw, 48px);
  margin:0 0 10px;
}
.lead{
  color:var(--muted);
  max-width:62ch; margin:10px auto 22px;
}

/* ===== Glass панели + „прозрачен“ hover ===== */
.card{
  background: var(--glass);
  border:1px solid var(--border);
  border-radius:16px;
  padding:18px;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.card:hover{
  /* максимално „лек“ hover */
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  border-color: rgba(255,255,255,.12);
  transform: translateY(-1px);
}

/* ===== Бутони ===== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  padding: 13px 22px;
  min-height: 46px;

  border-radius: 12px;
  border: 1px solid rgba(220, 169, 83, .55);

  background: linear-gradient(
    180deg,
    rgba(220, 169, 83, .14),
    rgba(220, 169, 83, .06)
  );

  color: #e5b866; !important;
  text-decoration: none;
  font-weight: 700;
  white-space: nowrap;

  transition:
    background .25s ease,
    border-color .25s ease,
    box-shadow .25s ease,
    transform .25s ease,
    color .25s ease;
}

.btn:hover {
  background: linear-gradient(
    180deg,
    rgba(220, 169, 83, .20),
    rgba(220, 169, 83, .08)
  );

  border-color: rgba(220, 169, 83, .85);
  color: #e5b866; !important;

  box-shadow:
    0 0 22px rgba(220, 169, 83, .20),
    0 8px 24px rgba(0, 0, 0, .25);

  transform: translateY(-2px);
}

.btn-primary {
  color: #e5b866; !important;
}

.btn-primary:hover {
  color: #e5b866 !important;
}



/* ===== Модал за AI картите (жълт акцент) ===== */
.modal{
  display:none; position:fixed; inset:0; z-index:10;
  align-items:center; justify-content:center;
  background: rgba(0,0,0,.65);
}
.modal.open{ display:flex }
.modal-box{
  width:min(560px, 92vw);
  background: var(--panel);
  border-radius:18px;
  border:1px solid var(--border);
  padding:20px;
  position:relative;
  /* жълт „футуристичен“ борд, реагиращ на курсора */
  box-shadow:
    0 0 0 1px rgba(245,210,103,.18),
    0 8px 30px rgba(245,210,103,.08);
}
.modal-box[data-glow="on"]{
  outline:1px solid rgba(245,210,103,.28);
  box-shadow:
    0 0 0 1px rgba(245,210,103,.28),
    0 10px 36px rgba(245,210,103,.12),
    0 0 40px rgba(245,210,103,.16);
}

.input{
  width:100%; padding:10px 12px; border-radius:10px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  color:var(--text);
}
.controls{ display:flex; gap:10px; margin-top:10px; justify-content:center }
.btn-yellow{
  background: linear-gradient(180deg, rgba(245,210,103,.85), rgba(245,210,103,.72));
  color:#111; border-color: rgba(245,210,103,.85);
  box-shadow: 0 8px 26px rgba(245,210,103,.35);
}
.btn-yellow:disabled{
  filter: grayscale(1); opacity:.6; cursor:not-allowed;
}

/* ===== Sticky footer ===== */
.site-footer{
  border-top:1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.20);
  backdrop-filter: blur(4px);
  padding:14px 0;
  text-align:center;
  color:var(--muted);
}

/* ===== Утилити ===== */
.grid{ display:grid; gap:18px }
.grid-3{ grid-template-columns: repeat(3, minmax(0,1fr)) }
@media (max-width:900px){ .grid-3{ grid-template-columns: 1fr } }
.text-center{ text-align:center }
.mt-20{ margin-top:20px }
.mt-30{ margin-top:30px }
/* --- Normalize visited state globally (fixes BG links appearing "clicked") --- */
a:visited { color: inherit; }


/* Make sure nav and cards don't change color when visited */

.nav-links a:link,
.nav-links a:visited,
.mobile-menu a:link,
.mobile-menu a:visited,
.card:link,
.card:visited {
  color: #dca953;
}


/* Keep underlines off everywhere unless you explicitly add a utility */
a:hover,
a:focus { text-decoration: none; }

@media (max-width: 700px){
  #how-we-work{ display:none !important; }
}

/* =======================================================
   SERVICES GRID
======================================================= */

.services-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}

.feature-card{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    text-decoration:none;
    color:var(--text);
    min-height:220px;
}

.feature-title{
    display:block;
    color:var(--accent);
    font-size:22px;
    font-weight:700;
    line-height:1.3;
    margin:0 0 8px 0;
}

.feature-text{
    margin:0;
    color:var(--muted);
    font-size:16px;
    line-height:1.6;

    /* Най-важното */
    overflow-wrap:break-word;
    word-break:normal;
    white-space:normal;
}

.feature-card:hover{
    color:inherit;
}

/* =======================================================
   MOBILE
======================================================= */

@media (max-width:768px){

    .services-grid{
        grid-template-columns:1fr;
        gap:16px;
    }

    .feature-card{
        min-height:auto;
        padding:20px;
    }

    .feature-title{
        font-size:20px;
    }

    .feature-text{
        font-size:15px;
        line-height:1.5;
    }

}
/* ========================= */
/* LIVE THREAT ALERT */
/* ========================= */

.threat-banner{

    max-width:1200px;

    margin:60px auto;

    padding:40px;

    background:#transperant;

    border:1px solid rgba(255,255,255,.08);

    border-radius:18px;

    box-shadow:
        0 10px 35px rgba(0,0,0,.35);

}

.threat-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:25px;

    flex-wrap:wrap;

    gap:15px;

}

.live-status{

    display:flex;

    align-items:center;

    gap:10px;

    color:#ff4d4d;

    font-weight:bold;

    letter-spacing:1px;

    text-transform:uppercase;

}

.live-dot{

    width:12px;

    height:12px;

    border-radius:50%;

    background:#ff2e2e;

    animation:livePulse 1.2s infinite;

}

@keyframes livePulse{

0%{

transform:scale(1);

box-shadow:0 0 0 0 rgba(255,46,46,.7);

}

70%{

transform:scale(1.2);

box-shadow:0 0 0 12px rgba(255,46,46,0);

}

100%{

transform:scale(1);

}

}

.threat-date{

    color:#8ca2b5;

    font-size:14px;

}

.threat-banner h2{

    color:#ffffff;

    font-size:34px;

    line-height:1.3;

    margin-bottom:18px;

}

.threat-banner p{

    color:#b7c2cf;

    line-height:1.8;

    font-size:18px;

    margin-bottom:28px;

}

.threat-tags{

    display:flex;

    gap:12px;

    flex-wrap:wrap;

    margin-bottom:30px;

}

.tag{

    padding:10px 18px;

    border-radius:30px;

    font-size:14px;

    font-weight:600;

}

.critical{

    background:#5a1111;

    color:#ff6666;
    

}

.global{

    background:#093d63;

    color:#59c4ff;

}

.read{

    background:#1d3d2c;

    color:#68e39b;

}



.read-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 13px 22px;
  min-height: 46px;

  border-radius: 12px;
  border: 1px solid rgba(220, 169, 83, .55);

  background: linear-gradient(
    180deg,
    rgba(220, 169, 83, .14),
    rgba(220, 169, 83, .06)
  );

  color: #dca953;
  text-decoration: none;

  font-weight: 700;
  white-space: nowrap;

  transition:
    background .25s ease,
    border-color .25s ease,
    box-shadow .25s ease,
    transform .25s ease,
    color .25s ease;
}

.read-btn:hover {
  background: linear-gradient(
    180deg,
    rgba(220, 169, 83, .20),
    rgba(220, 169, 83, .08)
  );

  border-color: rgba(220, 169, 83, .85);
  color: #e5b866;

  box-shadow:
    0 0 22px rgba(220, 169, 83, .20),
    0 8px 24px rgba(0, 0, 0, .25);

  transform: translateY(-2px);
}




@media(max-width:768px){

.threat-banner{

padding:25px;

margin:30px 15px;

}

.threat-banner h2{

font-size:26px;

}

.threat-banner p{

font-size:16px;

}

.threat-header{

flex-direction:column;

align-items:flex-start;

}

.read-btn{

width:100%;

text-align:center;

}

}
.threat-recommendation{
    color:red;
}
/* ========================= */
/* SOC Dashboard Extensions */
/* ========================= */

.dashboard-grid{

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:25px;
    margin-top:35px;

}

.dashboard-card{

    background:rgba(255,255,255,.03);
    border:1px solid rgba(74,168,255,.15);
    border-radius:15px;
    padding:22px;
    backdrop-filter:blur(8px);

}

.dashboard-card h3{

    margin-top:0;
    color:#4aa8ff;

}

.stats-grid{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;

}

.stat-box{

    background:rgba(255,255,255,.03);
    border-radius:12px;
    padding:15px;
    text-align:center;

}

.stat-number{

    display:block;
    font-size:28px;
    color:#4aa8ff;
    font-weight:bold;

}

.stat-label{

    color:#bbb;
    font-size:14px;

}

.security-list{

    list-style:none;
    padding:0;
    margin:0;

}

.security-list li{

    padding:10px 0;
    border-bottom:1px solid rgba(255,255,255,.05);

}

.timeline-item{

    border-left:3px solid #4aa8ff;
    padding-left:15px;
    margin-bottom:20px;

}

.timeline-item strong{

    color:#4aa8ff;

}

.feature-roadmap{

    list-style:none;
    padding:0;
    margin:0;

}

.feature-roadmap li{

    margin-bottom:18px;

}

.progress{

    margin-top:8px;
    height:8px;
    background:#222;
    border-radius:50px;
    overflow:hidden;

}

.progress span{

    display:block;
    height:100%;
    background:#4aa8ff;

}

@media (max-width:768px){

.dashboard-grid{

    grid-template-columns:1fr;

    gap:18px;

    padding:0;

    margin-top:25px;

}

.dashboard-card{

    width:100%;

    margin:0;

    padding:18px;

}

.stats-grid{

    grid-template-columns:1fr;

}

}

.threat-title{
    text-align:center;
    margin:20px 0 25px;
}

.gold-heading{
    color:#dca953;
    font-size:clamp(22px,3vw,32px);
    font-weight:700;
    letter-spacing:.6px;
    text-shadow:
        0 0 8px rgba(220,169,83,.25),
        0 0 20px rgba(220,169,83,.15);
        text-transform:uppercase;
letter-spacing:2px;
}
