:root{
  --b27-grad1:#4f46e5;
  --b27-grad2:#ec4899;
  --b27-grad3:#22c55e;
  --b27-ink:#0b1220;
}

body{
  background:radial-gradient(1200px 600px at 15% 15%, rgba(236,72,153,.22), transparent 55%),
             radial-gradient(900px 500px at 85% 10%, rgba(34,197,94,.18), transparent 60%),
             linear-gradient(135deg, rgba(79,70,229,.18), rgba(236,72,153,.12));
  color:var(--b27-ink);
}

.b27-header{backdrop-filter:saturate(120%) blur(10px);background:rgba(255,255,255,.75);border-bottom:1px solid rgba(0,0,0,.08)}
#logo a{text-decoration:none;font-weight:700;letter-spacing:.2px;color:#111827}

.b27-grid{
  display:grid;
  grid-template-areas:
    "hero hero"
    "main aside";
  grid-template-columns: 1.6fr .8fr;
  gap:16px;
}
.b27-hero{grid-area:hero}
.b27-main{grid-area:main}
.b27-aside{grid-area:aside}

@media (max-width: 960px){
  .b27-grid{
    grid-template-areas:
      "hero"
      "main"
      "aside";
    grid-template-columns:1fr;
  }
}

.b27-slide{
  padding:18px;
  border-radius:14px;
  background:linear-gradient(135deg, rgba(79,70,229,.85), rgba(236,72,153,.75));
}

.b27-swiper{margin-top:14px}
.b27-swiper .swiper-pagination-bullet{background:rgba(255,255,255,.75)}
.b27-swiper .swiper-pagination-bullet-active{background:#fff}

#footer{padding:28px 0;margin-top:20px;border-top:1px solid rgba(0,0,0,.10)}
#footer .social{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
#footer .social a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;background:rgba(255,255,255,.78);border:1px solid rgba(0,0,0,.08);text-decoration:none}

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}