/* Section: work — ported verbatim from the live block #bolt-work <style>.
   Changes from source:
     1. literal hexes replaced by exact-match tokens from base.css;
     2. added `text-decoration:none` for .bw-card (see end of file) — the
        card is an <a> in this theme and base.css underlines every anchor on
        hover/focus, which live never showed. Not present in the source CSS. */

/* ===== BASE THEME: BLUE GRADIENT (same family as previous) ===== */
#bolt-work{
  --pink:var(--mp-pink);
  --blue:var(--mp-blue);
  --text:var(--mp-ink);
  --muted:var(--mp-ink-muted);
  --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:96px 0;
  background: radial-gradient(130% 160% at 70% 0%, var(--blue) 0%, var(--mp-blue-dark) 65%, var(--mp-blue-deep) 100%);
  text-align:center;
}

/* Light fields */
#bolt-work::before{
  content:""; position:absolute; inset: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; z-index:0;
  animation:bwFloat 24s ease-in-out infinite alternate;
}
@keyframes bwFloat{
  0%{transform:translate(0,0) scale(1);}
  50%{transform:translate(-4%,3%) scale(1.05);}
  100%{transform:translate(4%,-3%) scale(1);}
}
#bolt-work::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:bwSheen 7s linear infinite;
}
@keyframes bwSheen{
  0%{transform:translateX(-40%) skewX(-12deg);}
  100%{transform:translateX(40%)  skewX(-12deg);}
}

/* Mouse glow */
#bolt-work .bw-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 */
#bolt-work .bw-inner{ position:relative; z-index:2; max-width:1200px; margin:0 auto; padding:0 20px; }
#bolt-work .bw-head{ max-width:920px; margin:0 auto 30px; }

/* Badge + Title */
#bolt-work .bw-badge{
  display:inline-flex; align-items:center; gap:.75rem;
  padding:6px 14px; margin:0 0 12px;
  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;
}
#bolt-work .bw-badge i{ color:var(--mp-gold); font-style:normal; font-size:13px; }

#bolt-work .bw-title{
  font-family:"DM Serif Display",serif; font-weight:400;
  color:#fff; font-size:42px; line-height:1.12; margin:0 0 14px;
  text-shadow:0 2px 10px rgba(0,0,0,.35);
}
@media(max-width:520px){ #bolt-work .bw-title{ font-size:36px; } }

#bolt-work .bw-sub{
  font-family:"Montserrat",sans-serif; font-size:16px; line-height:1.8;
  color:#fff; margin:0 0 34px;
}

/* Grid (3x2) */
#bolt-work .bw-grid{
  display:grid; gap:22px;
  grid-template-columns:repeat(3,minmax(260px,1fr));
  justify-content:center;
}
@media(max-width:960px){
  #bolt-work{padding:80px 0;}
  #bolt-work .bw-inner{padding:0 16px;}
  #bolt-work .bw-head{margin:0 auto 24px;}
  #bolt-work .bw-title{font-size:36px;}
  #bolt-work .bw-sub{margin:0 0 30px;}
  #bolt-work .bw-grid{ grid-template-columns:repeat(2,minmax(240px,1fr)); gap:18px; }
  #bolt-work .bw-card{padding:20px 18px;}
}
@media(max-width:720px){
  #bolt-work{padding:64px 0;}
  #bolt-work .bw-title{font-size:30px;}
  #bolt-work .bw-badge{font-size:11px; letter-spacing:.12em;}
  #bolt-work .bw-sub{font-size:15px; line-height:1.75; margin:0 0 26px;}
}
@media(max-width:640px){
  #bolt-work .bw-grid{ grid-template-columns:1fr; gap:14px; }
  #bolt-work .bw-card{padding:18px 16px;}
}
@media(max-width:520px){
  #bolt-work .bw-title{ font-size:28px; }
}

/* Cards */
#bolt-work .bw-card{
  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);
  padding:22px 20px;
  text-align:left;
  opacity:0;
  transform:
    translateY(40px)
    rotateX(var(--rx, 0deg))
    rotateY(var(--ry, 0deg));
  transition:all .65s cubic-bezier(.16,.84,.44,1);
  position:relative;
  will-change:transform, box-shadow, border-color, filter;
  transform-style:preserve-3d;
}
#bolt-work .bw-card.in-view{
  opacity:1;
  transform:
    translateY(0)
    rotateX(var(--rx, 0deg))
    rotateY(var(--ry, 0deg));
}

#bolt-work .bw-card h3{
  font-family:"DM Serif Display",serif;
  font-weight:400; /* non-bold */
  font-size:22px; margin:0 0 8px; color:#fff;
}
#bolt-work .bw-card p{
  font-family:"Montserrat",sans-serif; font-size:15px; margin:0; color:#fff;
}
@media(max-width:640px){
  #bolt-work .bw-card h3{font-size:20px;}
  #bolt-work .bw-card p{font-size:14px; line-height:1.7;}
}

/* Hover */
#bolt-work .bw-card::before,
#bolt-work .bw-card::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:14px;
  opacity:0; transition:opacity .28s ease;
}
#bolt-work .bw-card::before{
  background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0) 18%);
}
#bolt-work .bw-card::after{
  background: radial-gradient(260px 220px at 18% 10%, rgba(255,255,255,.10), transparent 60%);
  mix-blend-mode:screen;
}
#bolt-work .bw-card:hover{
  transform:
    translateY(-4px)
    scale(1.01)
    rotateX(var(--rx, 0deg))
    rotateY(var(--ry, 0deg));
  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-work .bw-card:hover::before,
#bolt-work .bw-card:hover::after{ opacity:1; }

@media (hover:none),(pointer:coarse){
  #bolt-work .bw-card{
    transform:translateY(40px);
  }
  #bolt-work .bw-card.in-view{
    transform:translateY(0);
  }
  #bolt-work .bw-card:hover{
    transform:translateY(0) scale(1);
    border-color:rgba(255,255,255,.22);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.15), 0 10px 25px rgba(0,0,0,.3);
    background:linear-gradient(180deg, var(--glassTop), var(--glassBot));
    filter:none;
  }
  #bolt-work .bw-card::before,
  #bolt-work .bw-card::after{display:none;}
}

@media (prefers-reduced-motion: reduce){
  #bolt-work::before, #bolt-work::after{ animation:none; }
  #bolt-work .bw-mouse{ display:none; }
  #bolt-work .bw-card{ transition:none; }
}

/* --- Added by the port (not in the source <style>) ---------------------------
   The card renders as <a class="bw-card"> when it has a link. base.css sets
   `a:hover, a:focus-visible { text-decoration: underline; }`, which would underline
   the whole card. Live had no underline, so suppress it here. --------------- */
#bolt-work .bw-card,
#bolt-work .bw-card:hover,
#bolt-work .bw-card:focus,
#bolt-work .bw-card:focus-visible{ text-decoration:none; }
