/* Cloud DDoS Protection page — Bharat Datacenter theme (Poppins, teal #036b67, orange #ffa163, cream #fffef3) */
:root {
  --cdp-teal: #036b67;
  --cdp-teal-dark: #02413f;
  --cdp-orange: #ffa163;
  --cdp-orange-soft: #ffcaa3;
  --cdp-cream: #fffef3;
  --cdp-cream-2: #fcfaeb;
  --cdp-dark: #242929;
  --cdp-ink: #333;
  --cdp-muted: #716f60;
  --cdp-line: rgba(36, 41, 41, 0.12);
}

.cdp, .cdp * { box-sizing: border-box; }
.cdp { font-family: 'Poppins', sans-serif; color: var(--cdp-ink); background: var(--cdp-cream); line-height: 1.65; overflow-x: hidden; }
:where(.cdp) :where(h1, h2, h3, h4, p) { margin: 0; }
.cdp h1, .cdp h2, .cdp h3, .cdp h4 { font-family: 'Poppins', sans-serif; line-height: 1.2; color: var(--cdp-dark); }
.cdp-wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.cdp-sec { padding: clamp(56px, 8vw, 96px) 0; }
.cdp-sec--alt { background: var(--cdp-cream-2); }
.cdp-sec--dark { background: linear-gradient(135deg, #1e1e1e 60%, var(--cdp-teal-dark) 100%); color: var(--cdp-cream); }
.cdp-sec--dark h2, .cdp-sec--dark h3 { color: var(--cdp-cream); }
.cdp-eyebrow { display: inline-flex; align-items: center; gap: 10px; text-transform: uppercase; letter-spacing: .12em; font-size: 12.5px; font-weight: 600; color: var(--cdp-orange); margin-bottom: 18px; }
.cdp-eyebrow::before { content: ""; width: 28px; height: 2px; background: var(--cdp-orange); }
.cdp-title { font-size: clamp(26px, 3.6vw, 40px); font-weight: 700; margin-bottom: 16px; }
.cdp-lead { font-size: clamp(15px, 1.6vw, 17px); color: var(--cdp-muted); max-width: 760px; margin-bottom: 40px; }
.cdp-head-center .cdp-title { max-width: 900px; margin-left: auto; margin-right: auto; }
.cdp-sec--dark .cdp-lead { color: rgba(255, 254, 243, .75); }
.cdp-head-center { text-align: center; }
.cdp-head-center .cdp-lead { margin-left: auto; margin-right: auto; }

/* Buttons */
.cdp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 26px; border-radius: 100px; font-weight: 600; font-size: 15px; text-decoration: none; border: 2px solid transparent; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease; cursor: pointer; text-align: center; }
.cdp-btn:focus-visible { outline: 3px solid var(--cdp-orange); outline-offset: 3px; }
.cdp-btn--primary { background: var(--cdp-orange); color: var(--cdp-dark); box-shadow: 0 6px 18px rgba(255, 161, 99, .3); }
.cdp-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(255, 161, 99, .45); }
.cdp-btn--ghost { border-color: var(--cdp-cream); color: var(--cdp-cream); background: transparent; }
.cdp-btn--ghost:hover { background: var(--cdp-cream); color: var(--cdp-dark); }
.cdp-btn--teal { background: var(--cdp-teal); color: #fff; }
.cdp-btn--teal:hover { background: var(--cdp-teal-dark); transform: translateY(-2px); }
.cdp-cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.cdp-center { text-align: center; margin-top: 40px; }

/* Hero */
.cdp-hero { background: linear-gradient(135deg, #1e1e1e 55%, var(--cdp-teal-dark) 100%); color: var(--cdp-cream); padding: clamp(120px, 14vw, 170px) 0 0; position: relative; }
.cdp-hero h1 { color: var(--cdp-cream); font-size: clamp(30px, 5vw, 54px); font-weight: 700; margin-bottom: 20px; }
.cdp-hero h1 span { color: var(--cdp-orange); }
.cdp-hero p.cdp-hero-text { font-size: clamp(15px, 1.7vw, 18px); color: rgba(255, 254, 243, .82); max-width: 760px; }
.cdp-ticks { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 10px; }
.cdp-ticks li { position: relative; padding-left: 30px; color: var(--cdp-cream); }
.cdp-ticks li::before { content: "\2713"; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: var(--cdp-orange); color: var(--cdp-dark); font-size: 12px; font-weight: 700; display: grid; place-items: center; }
.cdp-stats { margin-top: clamp(40px, 6vw, 64px); display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255, 254, 243, .15); }
.cdp-stat { padding: 26px 16px; text-align: center; border-right: 1px solid rgba(255, 254, 243, .15); }
.cdp-stat:last-child { border-right: 0; }
.cdp-stat strong { display: block; font-size: clamp(24px, 3vw, 34px); color: var(--cdp-orange); font-weight: 700; }
.cdp-stat span { font-size: 14px; color: rgba(255, 254, 243, .75); }

/* Card grids */
.cdp-grid { display: grid; gap: 22px; grid-template-columns: repeat(3, 1fr); }
.cdp-grid--4 { grid-template-columns: repeat(4, 1fr); }
.cdp-card { background: #fff; border: 1px solid var(--cdp-line); border-radius: 16px; padding: 28px 24px; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.cdp-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(0, 0, 0, .08); border-color: var(--cdp-teal); }
.cdp-card h3 { font-size: 18px; font-weight: 600; margin-bottom: 10px; }
.cdp-card p { font-size: 14.5px; color: var(--cdp-muted); }
.cdp-card .cdp-ico { width: 44px; height: 44px; border-radius: 12px; background: rgba(3, 107, 103, .1); color: var(--cdp-teal); display: grid; place-items: center; font-size: 18px; margin-bottom: 16px; }
.cdp-card--risk .cdp-ico { background: rgba(255, 161, 99, .2); color: #c4561a; }
.cdp-note { margin-top: 32px; text-align: center; color: var(--cdp-muted); font-size: 15px; }

/* Steps */
.cdp-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; counter-reset: s; }
.cdp-step { background: rgba(255, 254, 243, .06); border: 1px solid rgba(255, 254, 243, .14); border-radius: 16px; padding: 28px 24px; }
.cdp-step b { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--cdp-orange); color: var(--cdp-dark); margin-bottom: 14px; }
.cdp-step h3 { font-size: 20px; margin-bottom: 8px; }
.cdp-step p { font-size: 14.5px; color: rgba(255, 254, 243, .78); }
.cdp-golive { margin: 32px 0 56px; padding: 16px 22px; border-left: 4px solid var(--cdp-orange); background: rgba(255, 254, 243, .06); border-radius: 0 12px 12px 0; }
.cdp-stages-title { font-size: 24px; margin: 0 0 10px; color: var(--cdp-cream); }
.cdp-stages { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 32px; }
.cdp-stage { border-top: 3px solid var(--cdp-orange); padding: 18px 0 0; }
.cdp-stage h4 { color: var(--cdp-cream); font-size: 17px; margin-bottom: 6px; }
.cdp-stage p { font-size: 14.5px; color: rgba(255, 254, 243, .75); }

/* Tables */
.cdp-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 16px; border: 1px solid var(--cdp-line); background: #fff; }
.cdp-table { width: 100%; border-collapse: collapse; min-width: 680px; font-size: 14.5px; }
.cdp-table th, .cdp-table td { padding: 16px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--cdp-line); }
.cdp-table thead th { background: var(--cdp-teal); color: #fff; font-weight: 600; white-space: nowrap; }
.cdp-table tbody tr:last-child td { border-bottom: 0; }
.cdp-table tbody th { font-weight: 600; color: var(--cdp-teal); }
.cdp-table--vs td:nth-child(2) { background: rgba(3, 107, 103, .06); font-weight: 500; }

/* Pricing */
.cdp-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: stretch; }
.cdp-plan { background: #fff; border: 1px solid var(--cdp-line); border-radius: 18px; padding: 32px 26px; display: flex; flex-direction: column; position: relative; }
.cdp-plan--hot { border: 2px solid var(--cdp-orange); box-shadow: 0 16px 36px rgba(255, 161, 99, .2); }
.cdp-plan-tag { position: absolute; top: -13px; left: 26px; background: var(--cdp-orange); color: var(--cdp-dark); font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 100px; }
.cdp-plan h3 { font-size: 22px; margin-bottom: 6px; }
.cdp-plan .cdp-plan-for { color: var(--cdp-muted); font-size: 14px; margin-bottom: 18px; }
.cdp-price { font-size: 26px; font-weight: 700; color: var(--cdp-teal); margin-bottom: 18px; }
.cdp-price small { font-size: 14px; color: var(--cdp-muted); font-weight: 500; }
.cdp-plan ul { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 10px; font-size: 14.5px; flex: 1; }
.cdp-plan li { padding-left: 26px; position: relative; }
.cdp-plan li::before { content: "\2713"; position: absolute; left: 0; color: var(--cdp-teal); font-weight: 700; }
.cdp-promise { margin-top: 24px; text-align: center; font-size: 14.5px; color: var(--cdp-muted); }

/* Buy steps */
.cdp-buy { list-style: none; margin: 32px auto 0; padding: 0; display: grid; gap: 16px; max-width: 860px; counter-reset: b; }
.cdp-buy li { counter-increment: b; position: relative; background: #fff; border: 1px solid var(--cdp-line); border-radius: 14px; padding: 18px 20px 18px 70px; }
.cdp-buy li::before { content: counter(b); position: absolute; left: 20px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; background: var(--cdp-teal); color: #fff; display: grid; place-items: center; font-weight: 600; }
.cdp-buy strong { color: var(--cdp-dark); }

/* Trial banner */
.cdp-trial { text-align: center; max-width: 780px; margin: 0 auto; }
.cdp-trial .cdp-lead { margin-left: auto; margin-right: auto; }

/* FAQ */
.cdp-faq { max-width: 900px; margin: 0 auto; display: grid; gap: 12px; }
.cdp-faq details { background: #fff; border: 1px solid var(--cdp-line); border-radius: 14px; overflow: hidden; }
.cdp-faq summary { cursor: pointer; list-style: none; padding: 18px 54px 18px 22px; font-weight: 600; font-size: 16px; position: relative; color: var(--cdp-dark); }
.cdp-faq summary::-webkit-details-marker { display: none; }
.cdp-faq summary::after { content: "+"; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); font-size: 22px; color: var(--cdp-teal); transition: transform .2s ease; }
.cdp-faq details[open] summary::after { content: "\2212"; }
.cdp-faq details[open] { border-color: var(--cdp-teal); }
.cdp-faq .cdp-ans { padding: 0 22px 20px; color: var(--cdp-muted); font-size: 15px; }
.cdp-faq summary:focus-visible { outline: 3px solid var(--cdp-orange); outline-offset: -3px; }

@media (prefers-reduced-motion: reduce) { .cdp * { transition: none !important; } }

/* Responsive */
@media (max-width: 1024px) {
  .cdp-grid, .cdp-plans, .cdp-steps, .cdp-stages { grid-template-columns: repeat(2, 1fr); }
  .cdp-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .cdp-wrap { padding: 0 18px; }
  .cdp-grid, .cdp-grid--4, .cdp-plans, .cdp-steps, .cdp-stages { grid-template-columns: 1fr; }
  .cdp-stats { grid-template-columns: repeat(2, 1fr); }
  .cdp-stat:nth-child(2) { border-right: 0; }
  .cdp-stat:nth-child(-n+2) { border-bottom: 1px solid rgba(255, 254, 243, .15); }
  .cdp-btn { width: 100%; }
  .cdp-cta-row { flex-direction: column; }
  .cdp-buy li { padding-left: 62px; }
  .cdp-faq summary { font-size: 15px; }
}

/* Centered sections */
.cdp-sec--center { text-align: center; }
.cdp-sec--center .cdp-buy { text-align: left; }
.cdp-note a { color: var(--cdp-teal); font-weight: 600; }
