/* Block: goal (ported verbatim from live #bolt-goal)
   Only edit vs source: literal brand hexes swapped for base.css tokens. */
/* Make entire card clickable without changing visual design */
#bolt-goal .bg-card-link{
  display:block;
  color:inherit;
  text-decoration:none;
}
#bolt-goal .bg-card-link h3,
#bolt-goal .bg-card-link p{
  color:inherit;
}

/* ===== TOKENS (BLUE BASE + PINK ACCENTS) ===== */
#bolt-goal{
  --pink:var(--mp-pink);
  --blue:var(--mp-blue);
  --ink:var(--mp-ink);
  --text:var(--mp-ink);
  --muted:#d7dbff;
  --outline:rgba(255,255,255,.22);
  --glassTop:rgba(255,255,255,.10);
  --glassBot:rgba(255,255,255,.05);
  --mx:50%; --my:50%;
  position:relative; isolation:isolate; overflow:hidden;
  color:var(--text);
  padding:90px 0;
  background: radial-gradient(130% 160% at 70% 0%, var(--blue) 0%, var(--mp-blue-dark) 65%, var(--mp-blue-deep) 100%);
}

/* ===== BACKGROUND: radial glow + MOVING SHEEN LINE ===== */
#bolt-goal::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(780px 780px at 22% 38%, rgba(255,255,255,.08), transparent 60%),
    radial-gradient(640px 640px at 80% 72%, rgba(255,255,255,.06), transparent 65%);
  mix-blend-mode:screen; opacity:.5;
  animation:bgFloat 24s ease-in-out infinite alternate;
}
@keyframes bgFloat{
  0%{transform:translate(0,0) scale(1);}
  50%{transform:translate(-4%,3%) scale(1.05);}
  100%{transform:translate(4%,-3%) scale(1);}
}
/* moving sheen line (same language as services) */
#bolt-goal::after{
  content:""; position:absolute; inset:-10% -40%; z-index:0;
  background:linear-gradient(100deg, transparent 35%, rgba(255,255,255,.09) 50%, transparent 65%);
  transform:skewX(-12deg);
  animation:bgSheen 7s linear infinite;
}
@keyframes bgSheen{
  0%{transform:translateX(-40%) skewX(-12deg);}
  100%{transform:translateX(40%)  skewX(-12deg);}
}

/* ===== MOUSE GLOW (white light following cursor) ===== */
#bolt-goal .bg-mouse{
  position:absolute; inset:0; pointer-events:none; z-index:1;
  background: radial-gradient(360px 360px at var(--mx) var(--my), rgba(255,255,255,.18) 0%, transparent 60%);
  filter: blur(50px);
}

/* ===== LAYOUT (centered copy) ===== */
#bolt-goal .bg-inner{
  position:relative; z-index:2;
  max-width:1200px; margin:0 auto; padding:0 20px;
}
#bolt-goal .bg-copy{
  max-width:880px; margin:0 auto 26px; text-align:center;
}
#bolt-goal .bg-copy .bg-badge{ margin-left:auto; margin-right:auto; }

/* ===== BADGE / TYPE ===== */
#bolt-goal .bg-badge{
  display:inline-flex; align-items:center; gap:.75rem;
  padding:6px 14px; margin:0 0 10px;
  border:1px solid var(--pink);
  border-radius:999px;
  background:linear-gradient(90deg, rgba(208,36,121,.15), rgba(37,52,153,.15));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 8px 22px rgba(0,0,0,.28);
  color:var(--muted);
  font-family:"Montserrat",sans-serif; font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  position:relative; overflow:hidden;
}
#bolt-goal .bg-badge i{ color:#ffd166; font-style:normal; font-size:13px; }
#bolt-goal h2,#bolt-goal h3{
  font-family:"DM Serif Display", serif !important; font-weight:400 !important; color:#fff !important;
}
#bolt-goal .bg-title{ font-size:42px; line-height:1.12; margin:8px 0 14px; text-shadow:0 2px 10px rgba(0,0,0,.35); }
@media(max-width:520px){ #bolt-goal .bg-title{ font-size:36px; } }
#bolt-goal .bg-sub{ font-family:"Montserrat",sans-serif; font-size:16px; line-height:1.8; margin:0 0 12px; color:var(--mp-ink) !important; }

/* ===== GRID ===== */
#bolt-goal .bg-grid{
  margin-top:26px;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(240px,1fr)) !important;
  gap:22px !important;
  min-width:0;
}
@media(max-width:900px){ #bolt-goal .bg-grid{ grid-template-columns:repeat(2, minmax(200px,1fr)) !important; } }
@media(max-width:620px){ #bolt-goal .bg-grid{ grid-template-columns:1fr !important; } }

/* ===== CARD: glass + white-ish hover + subtle overlays ===== */
#bolt-goal .bg-card{
  position:relative;
  border:1px solid var(--outline);
  border-radius:14px;
  background:linear-gradient(180deg, var(--glassTop), var(--glassBot));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15), 0 10px 25px rgba(0,0,0,.3);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  padding:22px 20px;
  opacity:0; transform:translateY(40px);
  transition:all .65s cubic-bezier(.16,.84,.44,1);
  will-change:transform, box-shadow, border-color, filter;
  transform-style:preserve-3d;
  min-width:0;
  -webkit-tap-highlight-color: transparent;
}
/* top rim + soft vignette overlays (hidden by default) */
#bolt-goal .bg-card::before,
#bolt-goal .bg-card::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:14px;
  opacity:0; transition:opacity .28s ease;
}
#bolt-goal .bg-card::before{
  background:linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0) 18%);
}
#bolt-goal .bg-card::after{
  background:radial-gradient(260px 220px at 18% 10%, rgba(255,255,255,.10), transparent 60%);
  mix-blend-mode:screen;
}

#bolt-goal .bg-card.in-view{ opacity:1; transform:translateY(0); }

/* HOVER = white-ish glow (no pink) */
#bolt-goal .bg-card:hover{
  transform:translateY(-4px) scale(1.01);
  border-color:rgba(255,255,255,.35);
  box-shadow:
    0 18px 45px rgba(0,0,0,.55),
    0 2px 0 rgba(255,255,255,.18) inset;
  background:linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.07));
  filter:saturate(1.02);
}
#bolt-goal .bg-card:hover::before,
#bolt-goal .bg-card:hover::after{ opacity:1; }

#bolt-goal .bg-card h3{ font-size:22px; margin:0 0 8px; }
#bolt-goal .bg-card p{ font-family:"Montserrat",sans-serif; font-size:15px; margin:0; color:#fff; }

/* Last card spans full width of 3 columns */
#bolt-goal .bg-span-all{ grid-column:1 / -1; }

/* Layer safety + reduced motion */
#bolt-goal::before, #bolt-goal::after{ z-index:0 !important; }
#bolt-goal .bg-mouse{ z-index:1 !important; }
#bolt-goal .bg-inner{ z-index:2 !important; position:relative; }

/* ===== RESPONSIVE POLISH ONLY ===== */
@media(max-width:900px){
  #bolt-goal{ padding:70px 0; }
  #bolt-goal .bg-copy{ margin:0 auto 20px; }
  #bolt-goal .bg-grid{ gap:18px !important; }
}
@media(max-width:720px){
  #bolt-goal{ padding:58px 0; }
  #bolt-goal .bg-title{ font-size:30px; line-height:1.15; margin:8px 0 12px; }
  #bolt-goal .bg-sub{ font-size:15px; line-height:1.7; }
  #bolt-goal .bg-card{ padding:18px 18px; }
  #bolt-goal .bg-card h3{ font-size:20px; }
  #bolt-goal .bg-card p{ font-size:14px; line-height:1.65; }
}
@media(max-width:420px){
  #bolt-goal .bg-title{ font-size:28px; }
}

/* Touch devices: soften hover/float without changing desktop */
@media (hover: none){
  #bolt-goal .bg-card:hover{
    transform:translateY(0) scale(1);
  }
  #bolt-goal .bg-card:hover::before,
  #bolt-goal .bg-card:hover::after{ opacity:0; }
}

@media (prefers-reduced-motion: reduce){
  #bolt-goal::before, #bolt-goal::after{ animation:none; }
  #bolt-goal .bg-mouse{ display:none; }
}
