:root{
  --bg:#0b1020;
  --surface:#121a33;
  --card:#1b2547;
  --accent:#5dd3ff;
  --accent-2:#8ee7c2;
  --text:#e9efff;
  --muted:#b2b9d6;
  --danger:#ff6b6b;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --radius:16px;
  --radius-sm:10px;
  --space:clamp(12px,2vw,20px);
  --maxw:1200px;
  --grad:linear-gradient(135deg, #5dd3ff 0%, #8ee7c2 100%);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:radial-gradient(1200px 500px at 10% -10%, rgba(93,211,255,.15), transparent), var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial}
img{max-width:100%;display:block;border-radius:var(--radius-sm)}
a{color:var(--accent);text-decoration:none}
a:hover{opacity:.9}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:.5rem;border-radius:999px;padding:.7rem 1.1rem;font-weight:600;border:1px solid transparent;transition:.2s}
.btn-primary{background:var(--grad);color:#00152a;box-shadow:var(--shadow)}
.btn-secondary{background:#2b3563;border-color:#3c4683}
.btn-ghost{background:transparent;border-color:#39406e}
.link{color:var(--accent)}
.site-header{position:sticky;top:0;z-index:1000;background:rgba(12,18,40,.75);backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid rgba(255,255,255,.06)}
.site-header .brand{display:flex;align-items:center;gap:12px;max-width:var(--maxw);margin:auto;padding:10px var(--space)}
.site-header .brand .logo img{width:44px;height:44px;object-fit:cover;border-radius:12px}
.brand-text strong{display:block;font-size:1.05rem}
.brand-text span{font-size:.85rem;color:var(--muted)}
.nav-toggle{position:absolute;right:10px;top:10px;background:transparent;border:0;color:var(--text);display:none}
.main-nav{max-width:var(--maxw);margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 var(--space) 12px}
.main-nav ul{display:flex;gap:14px;list-style:none;margin:0;padding:0}
.main-nav a{padding:.55rem .9rem;border-radius:999px}
.main-nav a.active{background:#25305c}
.post-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.post-links span{color:var(--muted);font-size:.85rem;margin-right:6px}
.post-links a{font-size:.85rem;padding:.35rem .6rem;background:#162044;border-radius:999px;border:1px solid rgba(255,255,255,.06)}
.hero{position:relative;max-width:var(--maxw);margin:20px auto;padding:0 var(--space)}
.hero-img{width:100%;height:420px;object-fit:cover;border-radius:var(--radius)}
.hero-overlay{position:absolute;inset:auto 20px 20px 20px;display:flex;flex-direction:column;gap:12px;background:linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.6));padding:20px;border-radius:var(--radius)}
.hero h1{margin:0;font-size:clamp(1.6rem,4vw,2.4rem)}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap}
.features{max-width:var(--maxw);margin:20px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space);padding:0 var(--space)}
.feature{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.feature h3{margin:.6rem 0}
.latest{max-width:var(--maxw);margin:10px auto 30px;padding:0 var(--space)}
.latest-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.card .card-body{padding:16px}
.post{display:grid;grid-template-columns:360px 1fr;gap:0}
.post img{height:100%;object-fit:cover}
.iframe-admin, .lists{max-width:var(--maxw);margin:20px auto;padding:0 var(--space)}
.frame-wrap{border:1px dashed rgba(255,255,255,.25);border-radius:var(--radius);overflow:hidden;background:#0e1530}
.frame-wrap.small{height:200px}
.frame-wrap iframe{width:100%;height:360px;border:0;display:block}
.lists{display:grid;grid-template-columns:1fr 1fr;gap:var(--space)}
.custom-bullets, .custom-bullets-ol{padding:0;margin:0;list-style:none}
.custom-bullets li, .custom-bullets-ol li{position:relative;padding-left:34px;margin:.5rem 0}
.custom-bullets li::before, .custom-bullets-ol li::before{
  content:"";position:absolute;left:0;top:.35rem;width:22px;height:22px;border-radius:6px;
  background:var(--grad);box-shadow:0 2px 10px rgba(93,211,255,.4);
}
.custom-bullets-ol li{counter-increment:item}
.custom-bullets-ol li::after{
  content: counter(item); position:absolute; left:6px; top:.3rem; font-size:.8rem; color:#012532; font-weight:800;
}
.site-footer{border-top:1px solid rgba(255,255,255,.06);margin-top:30px;background:#0c1228}
.site-footer .footer-grid{max-width:var(--maxw);margin:auto;padding:22px var(--space);display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:var(--space)}
.footer-logo{width:46px;height:46px;border-radius:12px;object-fit:cover;margin-bottom:8px}
.footer-links ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.footer-links a{background:#162044;border:1px solid rgba(255,255,255,.06);border-radius:999px;padding:.45rem .8rem;display:inline-block}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:#162044;border:1px solid rgba(255,255,255,.06);margin-right:8px}
.blog-layout{max-width:var(--maxw);margin:20px auto;display:grid;grid-template-columns:1.5fr .8fr;gap:var(--space);padding:0 var(--space)}
.blog-aside .widget{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:16px;margin-bottom:var(--space)}
.post-layout{max-width:var(--maxw);margin:20px auto;display:grid;grid-template-columns:1.6fr .8fr;gap:var(--space);padding:0 var(--space)}
.post-content{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:16px 18px}
.post-head h1{margin-top:0}
.post-cover{width:100%;max-height:420px;object-fit:cover;margin:10px 0;border-radius:var(--radius-sm)}
.post-cta{display:flex;gap:10px;margin-top:16px}
.post-aside .widget{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:16px}
.about-hero{position:relative;max-width:var(--maxw);margin:20px auto;padding:0 var(--space)}
.about-hero img{width:100%;height:380px;object-fit:cover;border-radius:var(--radius)}
.about-hero .overlay{position:absolute;left:20px;bottom:20px;background:rgba(0,0,0,.45);padding:14px 18px;border-radius:12px}
.team-cards{max-width:var(--maxw);margin:10px auto 30px;display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space);padding:0 var(--space)}
.team-card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:12px;text-align:center}
.team-card img{object-fit:cover}
.contact-hero{position:relative;max-width:var(--maxw);margin:20px auto;padding:0 var(--space)}
.contact-hero img{width:100%;height:260px;object-fit:cover;border-radius:var(--radius)}
.contact-hero .overlay{position:absolute;left:20px;bottom:20px;background:rgba(0,0,0,.45);padding:14px 18px;border-radius:12px}
.contact-grid{max-width:var(--maxw);margin:20px auto;display:grid;grid-template-columns:1fr 1fr;gap:var(--space);padding:0 var(--space)}
.contact-form form{display:grid;gap:12px}
.contact-form input,.contact-form textarea{width:100%;background:#0e1530;border:1px solid #28325f;color:var(--text);border-radius:12px;padding:.7rem .9rem;outline:none}
.form-actions{text-align:right}
.modal,.cookie-modal{position:fixed;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.6);opacity:0;visibility:hidden;transition:.2s;z-index:2000}
.modal.open,.cookie-modal.open{opacity:1;visibility:visible}
.modal-inner,.cookie-modal-inner{background:var(--card);border:1px solid rgba(255,255,255,.08);border-radius:16px;box-shadow:var(--shadow);padding:20px;max-width:520px;width:90%}
.cookie-banner{position:fixed;left:14px;right:14px;bottom:14px;background:var(--surface);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:14px;box-shadow:var(--shadow);z-index:1500}
.cookie-banner.hidden{display:none}
.cookie-content{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.cookie-actions{margin-left:auto;display:flex;gap:8px}
@media (max-width:1100px){
  .features{grid-template-columns:1fr}
  .post{grid-template-columns:1fr}
  .blog-layout, .post-layout, .lists, .contact-grid{grid-template-columns:1fr}
  .team-cards{grid-template-columns:repeat(2,1fr)}
  .main-nav{flex-wrap:wrap}
  .post-links{width:100%;margin-top:10px}
}
@media (max-width:760px){
  .nav-toggle{display:block}
  .main-nav{display:none}
  .main-nav.open{display:block}
  .team-cards{grid-template-columns:1fr}
}