/* ===================================================================
   DDoS PROTECTION PAGE
   =================================================================== */

/* --- Shared --- */
:root{--dp-accent:#3b82f6;--dp-accent-soft:rgba(59,130,246,.12);--dp-accent-border:rgba(59,130,246,.35);--dp-sky:#38bdf8;--dp-sky-soft:rgba(56,189,248,.10);--dp-sky-border:rgba(56,189,248,.30)}
.dp-container{max-width:1200px;margin:0 auto;padding:0 24px}
.dp-eyebrow{font-family:'Space Grotesk',system-ui,sans-serif;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--dp-accent);margin:0 0 8px}
.dp-section-head{text-align:center;margin-bottom:56px}
.dp-section-title{font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(28px,5vw,40px);font-weight:700;color:#fafafa;margin:0 0 12px}
.dp-section-desc{font-size:16px;line-height:1.6;color:#a1a1aa;max-width:560px;margin:0 auto}

/* --- Hero --- */
.dp-hero{padding:140px 0 80px;background:#09090b;border-bottom:1px solid #27272a}
.dp-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.dp-hero-visual{position:relative;border-radius:14px;overflow:hidden;border:1px solid #27272a;background:#18181b;aspect-ratio:4/3;max-height:360px}
.dp-hero-visual img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(1.15) contrast(1.05) brightness(0.95);opacity:1;transition:opacity .3s, filter .3s, transform .5s}
.dp-hero-visual:hover img{filter:saturate(1.25) contrast(1.08) brightness(1);opacity:1;transform:scale(1.03)}
.dp-hero-visual-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(9,9,11,.85) 100%);pointer-events:none}
@media(max-width:900px){.dp-hero-grid{grid-template-columns:1fr}.dp-hero-visual{max-height:280px}}
.dp-hero-title{font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(32px,6vw,52px);font-weight:700;line-height:1.1;color:#fafafa;margin:0 0 20px}
.dp-hero-desc{font-size:17px;line-height:1.6;color:#a1a1aa;max-width:560px;margin:0 0 28px}
.dp-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:32px}
.dp-hero-tags{display:flex;flex-wrap:wrap;gap:8px}
.dp-hero-tags span{font-size:13px;font-weight:500;color:#bae6fd;background:var(--dp-sky-soft);border:1px solid var(--dp-sky-border);padding:6px 14px;border-radius:8px}

/* --- Breadcrumbs --- */
.dp-breadcrumbs{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:24px}
.dp-breadcrumbs a{color:#71717a;text-decoration:none;transition:color .15s}
.dp-breadcrumbs a:hover{color:#fafafa}
.dp-breadcrumbs span{color:#3f3f46}

/* --- Buttons --- */
.dp-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:10px;font-size:14px;font-weight:600;text-decoration:none;transition:all .15s;border:none;cursor:pointer}
.dp-btn-primary{background:var(--dp-accent);color:#052e1b}
.dp-btn-primary:hover{background:#3b82f6;box-shadow:0 8px 28px rgba(59,130,246,.35)}
.dp-btn-secondary{background:transparent;color:#fafafa;border:1px solid #3f3f46}
.dp-btn-secondary:hover{border-color:#71717a;background:#18181b}

/* --- Sections --- */
.dp-section{padding:64px 0}
.dp-section-alt{background:#18181b}
.dp-section-head{margin-bottom:40px}

/* --- Steps --- */
.dp-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.dp-step{background:#09090b;border:1px solid #27272a;border-radius:12px;padding:24px;transition:border-color .15s}
.dp-step:hover{border-color:#3f3f46}
.dp-step-num{font-family:'Space Grotesk',system-ui,sans-serif;font-size:11px;font-weight:600;color:var(--dp-accent);letter-spacing:.05em;display:block;margin-bottom:12px}
.dp-step h3{font-family:'Space Grotesk',system-ui,sans-serif;font-size:16px;font-weight:600;color:#fafafa;margin:0 0 8px}
.dp-step p{font-size:13px;line-height:1.5;color:#a1a1aa;margin:0}

/* --- Layers --- */
.dp-layers{display:flex;flex-direction:column;gap:8px}
.dp-layer{background:#09090b;border:1px solid #27272a;border-radius:12px;padding:20px 24px;display:flex;align-items:center;gap:20px;transition:border-color .15s}
.dp-layer:hover{border-color:#3f3f46}
.dp-layer-num{font-family:'Space Grotesk',system-ui,sans-serif;font-size:11px;font-weight:600;color:var(--dp-sky);min-width:24px}
.dp-layer>div{flex:1}
.dp-layer h3{font-family:'Space Grotesk',system-ui,sans-serif;font-size:15px;font-weight:600;color:#fafafa;margin:0 0 4px}
.dp-layer p{font-size:13px;line-height:1.5;color:#a1a1aa;margin:0}
.dp-chips{display:flex;gap:6px;flex-shrink:0}
.dp-chips span{font-size:11px;font-weight:500;color:#bae6fd;background:var(--dp-sky-soft);border:1px solid var(--dp-sky-border);padding:4px 10px;border-radius:6px;white-space:nowrap}

/* --- Tech --- */
.dp-tech-visual{margin:28px 0 24px;border-radius:12px;overflow:hidden;border:1px solid #27272a;background:#18181b;max-height:340px}
.dp-tech-visual img{width:100%;height:340px;object-fit:cover;object-position:center;filter:saturate(1.15) contrast(1.06) brightness(0.92);opacity:1;transition:filter .3s, transform .5s}
.dp-tech-visual:hover img{filter:saturate(1.25) contrast(1.1) brightness(1);transform:scale(1.02)}
.dp-tech-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dp-tech-card{background:#09090b;border:1px solid #27272a;border-radius:12px;padding:24px;transition:border-color .15s}
.dp-tech-card:hover{border-color:var(--dp-sky-border)}
.dp-tech-card h3{font-family:'Space Grotesk',system-ui,sans-serif;font-size:15px;font-weight:600;color:#fafafa;margin:0 0 8px}
.dp-tech-card p{font-size:13px;line-height:1.5;color:#a1a1aa;margin:0}

/* --- Capacity --- */
.dp-cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}
.dp-cap-card{background:#18181b;border:1px solid #27272a;border-radius:12px;padding:32px 24px;text-align:center}
.dp-cap-value{font-family:'Space Grotesk',system-ui,sans-serif;font-size:36px;font-weight:700;color:var(--dp-accent);display:block;margin-bottom:8px}
.dp-cap-card p{font-size:13px;line-height:1.5;color:#a1a1aa;margin:0}
.dp-cap-features{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.dp-cap-item{background:#09090b;border:1px solid #27272a;border-radius:12px;padding:20px;transition:border-color .15s}
.dp-cap-item:hover{border-color:#3f3f46}
.dp-cap-item h3{font-family:'Space Grotesk',system-ui,sans-serif;font-size:14px;font-weight:600;color:#fafafa;margin:0 0 6px}
.dp-cap-item p{font-size:12px;line-height:1.5;color:#a1a1aa;margin:0}

/* --- FAQ --- */
.dp-faq-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:8px}
.dp-faq-item{background:#09090b;border:1px solid #27272a;border-radius:12px;overflow:hidden}
.dp-faq-item[open]{border-color:#3f3f46}
.dp-faq-item summary{padding:20px 24px;font-size:15px;font-weight:500;color:#fafafa;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.dp-faq-item summary::-webkit-details-marker{display:none}
.dp-faq-item summary::after{content:'+';font-size:20px;color:var(--dp-accent);transition:transform .2s}
.dp-faq-item[open] summary::after{transform:rotate(45deg)}
.dp-faq-item p{padding:0 24px 20px;font-size:14px;line-height:1.6;color:#a1a1aa;margin:0}

/* --- CTA --- */
.dp-cta{padding:80px 0;background:#09090b;border-top:1px solid #27272a}
.dp-cta-inner{text-align:center}
.dp-cta-title{font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(28px,5vw,40px);font-weight:700;color:#fafafa;margin:0 0 12px}
.dp-cta-desc{font-size:16px;line-height:1.6;color:#a1a1aa;max-width:500px;margin:0 auto 28px}
.dp-cta-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}

/* --- Responsive --- */
@media(max-width:1024px){
  .dp-steps{grid-template-columns:repeat(2,1fr)}
  .dp-tech-grid{grid-template-columns:repeat(2,1fr)}
  .dp-cap-features{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .dp-hero{padding:120px 0 60px}
  .dp-hero-title{font-size:36px}
  .dp-hero-desc{font-size:15px}
  .dp-section{padding:60px 0}
  .dp-section-title{font-size:28px}
  .dp-steps{grid-template-columns:1fr}
  .dp-layer{flex-direction:column;align-items:flex-start;gap:12px}
  .dp-chips{flex-wrap:wrap}
  .dp-tech-grid{grid-template-columns:1fr}
  .dp-cap-grid{grid-template-columns:1fr}
  .dp-cap-features{grid-template-columns:1fr}
  .dp-btn{padding:10px 20px;font-size:13px}
  .dp-faq-item summary{padding:16px;font-size:14px}
  .dp-faq-item p{padding:0 16px 16px;font-size:13px}
}

/* --- Protection limits --- */
.dp-limits {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dp-limit {
  background: #09090b;
  border: 1px solid #27272a;
  border-radius: 12px;
  padding: 20px 24px;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  transition: border-color .15s;
}
.dp-limit:hover {
  border-color: #3f3f46;
}
.dp-limit-num {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: var(--dp-sky);
  min-width: 24px;
  padding-top: 2px;
}
.dp-limit > div {
  flex: 1;
  min-width: 0;
}
.dp-limit h3 {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #fafafa;
  margin: 0 0 6px;
}
.dp-limit p {
  font-size: 13px;
  line-height: 1.6;
  color: #a1a1aa;
  margin: 0;
}
.dp-limit strong {
  color: #e4e4e7;
  font-weight: 600;
}
.dp-limit-note {
  margin-top: 20px;
  border: 1px solid var(--dp-sky-border);
  background: var(--dp-sky-soft);
  border-radius: 12px;
  padding: 18px 22px;
}
.dp-limit-note p {
  font-size: 13.5px;
  line-height: 1.65;
  color: #bae6fd;
  margin: 0;
}
.dp-limit-note strong {
  color: #e0f2fe;
  font-weight: 600;
}
.dp-limit-note a {
  color: #e0f2fe;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 600;
}
