/* WordPress Security landing — FDesign · fdesign.com.gr
   Everything is scoped under .fdsec so it never collides with Brooklyn or Elementor.
   Place in your child theme, e.g. /assets/wordpress-security.css, and enqueue it (see functions.php snippet). */

.fdsec{
  --ink:#141618; --ink-2:#1C1F23; --ink-3:#2A2E34;
  --paper:#F4F5F6; --paper-2:#FFFFFF; --paper-line:#DBDEE2;
  --fg:#141618; --fg-soft:#4A515A; --fg-inv:#E9EBEE; --fg-inv-soft:#98A0AA;
  --brand:#ff0040; --brand-deep:#C40036;
  --caution:#EBA43B; --secure:#34A79B; --secure-deep:#1F7E74;
  --f-display:"Space Grotesk", system-ui, sans-serif;
  --f-body:"IBM Plex Sans", system-ui, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, monospace;
  --maxw:1120px; --pad-sec:clamp(3.5rem, 8vw, 6.5rem); --radius:4px;
  font-family:var(--f-body); color:var(--fg); line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.fdsec *{box-sizing:border-box}
.fdsec .reveal{opacity:1;transform:none}   /* JS-free: content always visible. Add Elementor entrance animation per widget if you want motion. */

.fdsec .wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(1.1rem,4vw,2rem)}
.fdsec h1,.fdsec h2,.fdsec h3{font-family:var(--f-display);font-weight:700;line-height:1.08;letter-spacing:-.02em;margin:0}
.fdsec h1{font-size:clamp(2.3rem,5.6vw,4.1rem)}
.fdsec h2{font-size:clamp(1.8rem,3.8vw,2.85rem)}
.fdsec h3{font-size:clamp(1.15rem,2vw,1.4rem);letter-spacing:-.01em}
.fdsec p{margin:0 0 1rem}
.fdsec a{color:inherit;text-decoration:none}

.fdsec .eyebrow{font-family:var(--f-mono);font-size:.72rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--brand);display:inline-flex;align-items:center;gap:.6rem;margin:0 0 1.1rem}
.fdsec .eyebrow::before{content:"";width:26px;height:1px;background:var(--brand);display:inline-block}
.fdsec .eyebrow.on-paper{color:var(--brand-deep)}
.fdsec .lead{font-size:clamp(1.05rem,1.5vw,1.22rem);color:var(--fg-soft);max-width:46ch}

.fdsec .btn{display:inline-flex;align-items:center;gap:.55rem;justify-content:center;font-family:var(--f-display);font-weight:600;font-size:1rem;padding:.9rem 1.5rem;border-radius:var(--radius);text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .15s ease, background .15s ease}
.fdsec .btn:hover{transform:translateY(-2px)}
.fdsec .btn-primary{background:var(--brand);color:#fff;border-color:var(--brand)}
.fdsec .btn-primary:hover{background:#E0003A}
.fdsec .btn-ghost{background:transparent;color:var(--fg-inv);border-color:var(--ink-3)}
.fdsec .btn-ghost:hover{border-color:var(--brand);color:#fff}
.fdsec .btn-danger{background:transparent;color:var(--brand);border-color:transparent;padding-inline:.2rem}
.fdsec .btn-danger:hover{color:#fff}
.fdsec .btn-lg{padding:1.05rem 1.9rem;font-size:1.08rem}
.fdsec :focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:2px}

.fdsec .hero{background:var(--ink);color:var(--fg-inv);position:relative;overflow:hidden}
.fdsec .hero::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 55% at 82% 0%, rgba(255,0,64,.12), transparent 60%),radial-gradient(50% 50% at 0% 100%, rgba(52,167,155,.07), transparent 55%);pointer-events:none}
.fdsec .hero .wrap{position:relative;padding-top:clamp(3.5rem,7vw,5.5rem);padding-bottom:var(--pad-sec);display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center}
@media(max-width:900px){.fdsec .hero .wrap{grid-template-columns:1fr;gap:2.5rem}}
.fdsec .hero h1{color:#fff}
.fdsec .hero .lead{color:var(--fg-inv-soft);margin-top:1.3rem;max-width:42ch}
.fdsec .hero-cta{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center;margin-top:2rem}
.fdsec .hero-note{font-family:var(--f-mono);font-size:.78rem;color:var(--fg-inv-soft);margin-top:1.8rem;border-left:2px solid var(--brand);padding-left:.9rem;max-width:40ch;line-height:1.5}

.fdsec .console{background:var(--ink-2);border:1px solid var(--ink-3);border-radius:8px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
.fdsec .console-bar{display:flex;align-items:center;gap:.5rem;padding:.7rem .95rem;border-bottom:1px solid var(--ink-3);font-family:var(--f-mono);font-size:.74rem;color:var(--fg-inv-soft)}
.fdsec .console-bar .lights{display:flex;gap:.4rem;margin-right:.4rem}
.fdsec .console-bar .lights i{width:10px;height:10px;border-radius:50%;display:block;background:var(--ink-3)}
.fdsec .console-bar .path{margin-left:auto;opacity:.8}
.fdsec .utable{width:100%;border-collapse:collapse;font-family:var(--f-mono);font-size:.8rem}
.fdsec .utable th{text-align:left;color:var(--fg-inv-soft);font-weight:500;padding:.6rem .95rem;border-bottom:1px solid var(--ink-3);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}
.fdsec .utable td{padding:.62rem .95rem;border-bottom:1px solid rgba(42,46,52,.6);color:var(--fg-inv)}
.fdsec .utable tr:last-child td{border-bottom:0}
.fdsec .utable .role{color:var(--fg-inv-soft)}
.fdsec .rogue{background:linear-gradient(90deg, rgba(255,0,64,.16), rgba(255,0,64,.04))}
.fdsec .rogue td{color:#fff}
.fdsec .rogue .u{color:var(--brand);font-weight:600}
.fdsec .rogue .role{color:var(--brand)}
.fdsec .flag{display:inline-flex;align-items:center;gap:.4rem;margin-left:.5rem;font-size:.66rem;color:#fff;background:var(--brand);padding:.05rem .45rem;border-radius:3px;letter-spacing:.04em;text-transform:uppercase;vertical-align:middle}
.fdsec .pulse{animation:fdsec-pulse 2.6s ease-in-out 1}
@keyframes fdsec-pulse{0%,100%{box-shadow:inset 0 0 0 0 rgba(255,0,64,0)}30%{box-shadow:inset 0 0 0 1px rgba(255,0,64,.6)}}
@media(prefers-reduced-motion:reduce){.fdsec .pulse{animation:none}}

.fdsec section{padding-block:var(--pad-sec)}
.fdsec .section-ink{background:var(--ink);color:var(--fg-inv)}
.fdsec .section-ink h2{color:#fff}
.fdsec .section-ink .lead{color:var(--fg-inv-soft)}
.fdsec .sec-head{max-width:60ch;margin-bottom:clamp(2.2rem,4vw,3.2rem)}

.fdsec .cost-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--paper-line);border:1px solid var(--paper-line);border-radius:8px;overflow:hidden}
.fdsec .cost{background:var(--paper-2);padding:1.6rem 1.5rem}
.fdsec .cost .n{font-family:var(--f-mono);font-size:.72rem;color:var(--brand-deep);letter-spacing:.1em}
.fdsec .cost h3{margin:.7rem 0 .5rem}
.fdsec .cost p{color:var(--fg-soft);font-size:.94rem;margin:0}

.fdsec .vectors{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.4rem;margin-top:1rem}
.fdsec .vector{border:1px solid var(--ink-3);border-radius:8px;padding:1.4rem;background:var(--ink-2)}
.fdsec .vector h3{color:#fff;font-size:1.08rem;margin-bottom:.4rem;display:flex;align-items:center;gap:.6rem}
.fdsec .vector h3 .tag{font-family:var(--f-mono);font-size:.62rem;color:var(--brand);border:1px solid var(--brand-deep);border-radius:3px;padding:.05rem .35rem;letter-spacing:.05em}
.fdsec .vector p{color:var(--fg-inv-soft);font-size:.9rem;margin:0}

.fdsec .case{background:linear-gradient(180deg,#101214, #141618);color:var(--fg-inv)}
.fdsec .case .badge{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--f-mono);font-size:.72rem;color:var(--brand);border:1px solid var(--brand-deep);border-radius:20px;padding:.28rem .8rem;margin-bottom:1.2rem;letter-spacing:.06em}
.fdsec .case h2{color:#fff;max-width:20ch}
.fdsec .timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ink-3);border:1px solid var(--ink-3);border-radius:8px;overflow:hidden;margin:2.2rem 0}
@media(max-width:720px){.fdsec .timeline{grid-template-columns:1fr}}
.fdsec .tl{background:var(--ink-2);padding:1.3rem 1.4rem}
.fdsec .tl .date{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.04em}
.fdsec .tl .v{font-family:var(--f-mono);font-size:.72rem;color:var(--fg-inv-soft);margin-top:.15rem}
.fdsec .tl h3{font-size:1.02rem;color:#fff;margin:.7rem 0 .35rem}
.fdsec .tl p{font-size:.86rem;color:var(--fg-inv-soft);margin:0}
.fdsec .tl.exposed{border-top:3px solid var(--caution)}
.fdsec .tl.exposed .date{color:var(--caution)}
.fdsec .tl.patched{border-top:3px solid var(--secure)}
.fdsec .tl.patched .date{color:var(--secure)}
.fdsec .tl.hit{border-top:3px solid var(--brand)}
.fdsec .tl.hit .date{color:var(--brand)}

.fdsec .case-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3rem);margin-top:1rem;align-items:start}
@media(max-width:820px){.fdsec .case-cols{grid-template-columns:1fr}}
.fdsec .steps{list-style:none;padding:0;margin:0;counter-reset:s}
.fdsec .steps li{counter-increment:s;position:relative;padding:.55rem 0 .55rem 2.6rem;border-bottom:1px solid var(--ink-3);color:var(--fg-inv-soft);font-size:.94rem}
.fdsec .steps li:last-child{border-bottom:0}
.fdsec .steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:.55rem;font-family:var(--f-mono);font-size:.78rem;color:var(--secure);font-weight:600}
.fdsec .steps li strong{color:var(--fg-inv);font-weight:600}
.fdsec .callout{background:var(--ink-2);border:1px solid var(--ink-3);border-left:3px solid var(--caution);border-radius:6px;padding:1.3rem 1.4rem}
.fdsec .callout .k{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--caution);margin-bottom:.6rem}
.fdsec .callout p{font-size:.95rem;color:var(--fg-inv);margin:0}
.fdsec code.mono{font-family:var(--f-mono);background:rgba(255,0,64,.12);color:var(--brand);padding:.05rem .35rem;border-radius:3px;font-size:.86em}
.fdsec .sources{margin-top:2rem;font-family:var(--f-mono);font-size:.76rem;color:var(--fg-inv-soft);line-height:1.9}
.fdsec .sources .k{display:block;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-inv-soft);margin-bottom:.4rem;font-size:.68rem}
.fdsec .sources a{color:var(--secure);text-decoration:none;border-bottom:1px solid rgba(52,167,155,.3)}
.fdsec .sources a:hover{color:#fff}

.fdsec .proc{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1.3rem;counter-reset:p}
.fdsec .step{counter-increment:p;background:var(--paper-2);border:1px solid var(--paper-line);border-radius:8px;padding:1.5rem 1.4rem;position:relative}
.fdsec .step .num{font-family:var(--f-mono);font-size:.8rem;color:var(--brand-deep);letter-spacing:.1em}
.fdsec .step h3{margin:.9rem 0 .5rem;font-size:1.12rem}
.fdsec .step p{color:var(--fg-soft);font-size:.9rem;margin:0}
.fdsec .step::after{content:"";position:absolute;left:1.4rem;top:1.4rem;width:24px;height:2px;background:var(--secure)}

.fdsec .plans{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;align-items:stretch}
@media(max-width:860px){.fdsec .plans{grid-template-columns:1fr}}
.fdsec .plan{border:1px solid var(--paper-line);border-radius:10px;padding:1.8rem 1.6rem;background:var(--paper-2);display:flex;flex-direction:column}
.fdsec .plan.featured{border-color:var(--secure);box-shadow:0 20px 50px -30px rgba(31,126,116,.5);position:relative}
.fdsec .plan.urgent{border-color:var(--brand)}
.fdsec .plan .kicker{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-soft)}
.fdsec .plan.urgent .kicker{color:var(--brand-deep)}
.fdsec .plan.featured .kicker{color:var(--secure-deep)}
.fdsec .plan h3{margin:.7rem 0 .5rem;font-size:1.35rem}
.fdsec .plan .desc{color:var(--fg-soft);font-size:.92rem;min-height:2.4em;margin-bottom:1rem}
.fdsec .plan ul{list-style:none;padding:0;margin:0 0 1.5rem;flex:1}
.fdsec .plan li{padding:.4rem 0 .4rem 1.5rem;position:relative;font-size:.92rem;color:var(--fg)}
.fdsec .plan li::before{content:"";position:absolute;left:0;top:.72rem;width:8px;height:8px;border-radius:2px;background:var(--secure)}
.fdsec .plan.urgent li::before{background:var(--brand)}
.fdsec .ribbon{position:absolute;top:-11px;left:1.6rem;background:var(--secure);color:#fff;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;padding:.2rem .6rem;border-radius:3px}
.fdsec .plan .btn{width:100%}
.fdsec .plan.urgent .btn{background:var(--brand);color:#fff;border-color:var(--brand)}
.fdsec .plan .btn-outline{background:transparent;border:1px solid var(--fg);color:var(--fg)}
.fdsec .plan .btn-outline:hover{background:var(--fg);color:var(--paper)}

.fdsec .author{display:grid;grid-template-columns:auto 1fr;gap:1.6rem;align-items:start;background:var(--ink-2);border:1px solid var(--ink-3);border-radius:10px;padding:clamp(1.6rem,3vw,2.2rem)}
@media(max-width:620px){.fdsec .author{grid-template-columns:1fr}}
.fdsec .avatar{width:74px;height:74px;border-radius:12px;background:linear-gradient(135deg,var(--brand),#B8002F);display:flex;align-items:center;justify-content:center;font-family:var(--f-display);font-weight:700;font-size:1.6rem;color:#fff}
.fdsec .author h3{color:#fff}
.fdsec .author .role{font-family:var(--f-mono);font-size:.8rem;color:var(--secure);margin:.3rem 0 .9rem;letter-spacing:.03em}
.fdsec .author p{color:var(--fg-inv-soft);font-size:.95rem}
.fdsec .author .links{display:flex;gap:1.1rem;margin-top:.6rem;font-family:var(--f-mono);font-size:.8rem}
.fdsec .author .links a{color:var(--fg-inv);text-decoration:none;border-bottom:1px solid var(--ink-3)}
.fdsec .author .links a:hover{color:var(--brand);border-color:var(--brand)}
.fdsec .creds{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.1rem}
.fdsec .creds span{font-family:var(--f-mono);font-size:.72rem;color:var(--fg-inv-soft);border:1px solid var(--ink-3);border-radius:20px;padding:.25rem .75rem}

.fdsec .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:2.5rem}
@media(max-width:820px){.fdsec .quotes{grid-template-columns:1fr}}
.fdsec .quote{border:1px solid var(--ink-3);border-radius:8px;padding:1.5rem;background:transparent}
.fdsec .quote p{color:var(--fg-inv);font-size:.95rem}
.fdsec .quote .who{font-family:var(--f-mono);font-size:.76rem;color:var(--secure);margin-top:1rem;letter-spacing:.04em}

.fdsec .faq{max-width:820px;margin-inline:auto}
.fdsec details{border-bottom:1px solid var(--paper-line);padding:1.15rem 0}
.fdsec summary{font-family:var(--f-display);font-weight:600;font-size:1.1rem;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
.fdsec summary::-webkit-details-marker{display:none}
.fdsec summary::after{content:"+";font-family:var(--f-mono);color:var(--brand-deep);font-size:1.3rem;transition:transform .2s}
.fdsec details[open] summary::after{transform:rotate(45deg)}
.fdsec details p{color:var(--fg-soft);margin:.9rem 0 0;font-size:.96rem}

.fdsec .final{background:var(--ink);color:var(--fg-inv);text-align:center;position:relative;overflow:hidden}
.fdsec .final::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 90% at 50% 0%, rgba(255,0,64,.14), transparent 60%)}
.fdsec .final .wrap{position:relative}
.fdsec .final h2{color:#fff;max-width:20ch;margin-inline:auto}
.fdsec .final .lead{margin:1.2rem auto 2rem;color:var(--fg-inv-soft)}
.fdsec .final .hero-cta{justify-content:center}
.fdsec .guarantee{font-family:var(--f-mono);font-size:.8rem;color:var(--secure);margin-top:1.6rem;display:inline-flex;align-items:center;gap:.5rem}