
:root{
  --d4f-bg:#070b12;
  --d4f-surface:#0b1220;
  --d4f-surface2:#0f172a;
  --d4f-text:#e8eefc;
  --d4f-muted:#9aa7c1;
  --d4f-border:rgba(255,255,255,.12);
  --d4f-primary:#0ea5e9;
  --d4f-primary_text:#02131d;
  --d4f-accent:#22d3ee;
  --d4f-accent_text:#041015;
  --d4f-link:#7dd3fc;
  --d4f-radius:18px;
  --d4f-shadow:0 18px 60px rgba(0,0,0,.42);
  --d4f-container:1180px;
  --d4f-font-body:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --d4f-font-head:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --d4f-base:16px;
}

*{box-sizing:border-box}
html{font-size:var(--d4f-base)}
body{
  margin:0;
  font-family:var(--d4f-font-body);
  background:radial-gradient(1200px 700px at 70% -10%, rgba(34,211,238,.18), transparent 60%),
             radial-gradient(900px 600px at 0% 10%, rgba(14,165,233,.16), transparent 55%),
             var(--d4f-bg);
  color:var(--d4f-text);
}
a{color:var(--d4f-link);text-decoration:none}
a:hover{opacity:.92}

.d4f-container{max-width:var(--d4f-container);margin:0 auto;padding:0 18px}
.d4f-muted{color:var(--d4f-muted)}
.d4f-main{padding:30px 0 60px}

.d4f-topbar{
  background:var(--d4f-topbar-bg, rgba(255,255,255,.03));
  border-bottom:1px solid var(--d4f-border);
}
.d4f-topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0}
.d4f-topbar-menu{list-style:none;margin:0;padding:0;display:flex;gap:14px}
.d4f-topbar-menu a{color:var(--d4f-muted)}

.d4f-header{
  background:var(--d4f-header-bg, rgba(7,11,18,.72));
  backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid var(--d4f-border);
}
.d4f-sticky-header .d4f-header{position:sticky;top:0;z-index:999}
.d4f-header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.d4f-brand-link{display:flex;align-items:center;gap:12px;color:inherit}
.d4f-brand-text{display:flex;flex-direction:column;line-height:1.1}
.d4f-site-title{font-family:var(--d4f-font-head);font-weight:900;letter-spacing:.3px}
.d4f-site-tagline{font-size:12px;color:var(--d4f-muted);margin-top:4px}
.custom-logo{max-height:44px;width:auto}

.d4f-nav-toggle{display:none;background:none;border:0;color:inherit;cursor:pointer}
.d4f-nav-toggle span{display:block;width:22px;height:2px;background:var(--d4f-text);margin:5px 0;border-radius:2px}

.d4f-nav{display:flex;align-items:center;gap:18px}
.d4f-menu{list-style:none;margin:0;padding:0;display:flex;gap:16px;align-items:center}
.d4f-menu a{color:var(--d4f-text);font-weight:700;opacity:.92}
.d4f-menu a:hover{opacity:1}
.d4f-nav-cta{display:flex;align-items:center}

.d4f-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 14px;border-radius:14px;
  border:1px solid var(--d4f-border);
  background:var(--d4f-topbar-bg, rgba(255,255,255,.03));
  color:var(--d4f-text);
  text-decoration:none;
}
.d4f-btn:hover{transform:translateY(-1px)}
.d4f-btn-primary{
  background:linear-gradient(135deg, var(--d4f-button-bg, var(--d4f-accent)), var(--d4f-primary));
  color:var(--d4f-button-text, var(--d4f-primary_text));
  border:0;
  font-weight:900;
  box-shadow:0 14px 44px rgba(34,211,238,.18);
}

.d4f-card{
  border:1px solid var(--d4f-border);
  background:linear-gradient(180deg, var(--d4f-card-bg, rgba(255,255,255,.05)), rgba(255,255,255,.02));
  border-radius:var(--d4f-radius);
  overflow:hidden;
  box-shadow:0 22px 70px rgba(0,0,0,.24);
}
.d4f-card-media img{width:100%;height:auto;display:block}
.d4f-card-body{padding:16px}

.d4f-alert{
  padding:12px 14px;border-radius:var(--d4f-radius);
  border:1px solid var(--d4f-border);
  background:rgba(255,255,255,.04);
}

.d4f-h1,.d4f-h2,.d4f-h3{
  font-family:var(--d4f-font-head);
  color:var(--d4f-text);
}
.d4f-h1{font-size: clamp(34px, 4vw, 52px); letter-spacing:-.8px; font-weight:950}
.d4f-h2{font-size: clamp(20px, 2vw, 28px); font-weight:900}
.d4f-h3{font-size:18px;font-weight:900}
.d4f-lead{font-size:18px;color:var(--d4f-muted);margin-top:8px}

.d4f-blog-list{display:grid;gap:18px}
@media(min-width:900px){.d4f-blog-list{grid-template-columns:repeat(2,1fr)}}

.d4f-footer{
  border-top:1px solid var(--d4f-border);
  background:var(--d4f-footer-bg, rgba(255,255,255,.02));
}
.d4f-footer-grid{display:grid;gap:16px;padding:34px 0}
@media(min-width:1000px){.d4f-footer-grid{grid-template-columns:2fr 1fr 1fr 1fr}}
.d4f-footer-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:18px 0;color:var(--d4f-muted);border-top:1px solid var(--d4f-border)}

@media(max-width:980px){
  .d4f-nav-toggle{display:block}
  .d4f-nav{position:fixed;inset:70px 14px auto 14px; background:rgba(7,11,18,.96);
    border:1px solid var(--d4f-border); border-radius:18px;
    padding:14px; display:none; flex-direction:column; align-items:stretch; gap:10px; z-index:1000;
    box-shadow:var(--d4f-shadow);
  }
  body.d4f-nav-open .d4f-nav{display:flex}
  .d4f-menu{flex-direction:column;align-items:stretch}
  .d4f-menu a{padding:10px 10px;border-radius:12px;background:rgba(255,255,255,.03)}
}
