:root{
  --bsp-yellow:#FFD200;
  --bsp-yellow-soft:rgba(255,210,0,.16);
  --bsp-black:#111111;
  --bsp-text:#4E5562;
  --bsp-line:#E6EAF0;
  --bsp-bg:#F7F9FC;
  --bsp-shadow:0 10px 26px rgba(0,0,0,.06);
  --bsp-shadow-hover:0 18px 38px rgba(0,0,0,.10);
}

.bsp-page{
  padding:56px 0 78px;
  background:linear-gradient(180deg, #ffffff 0%, var(--bsp-bg) 100%);
}

.bsp-page .container{
  width:min(1180px, calc(100% - 40px));
  margin:0 auto;
}

.bsp-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:20px;
}

.bsp-card{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  min-height:240px;
  padding:24px 18px 20px;
  background:#fff;
  border:1px solid var(--bsp-line);
  border-radius:22px;
  box-shadow:var(--bsp-shadow);
  text-decoration:none;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  overflow:hidden;
}

.bsp-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background:linear-gradient(90deg, #c8a600 0%, var(--bsp-yellow) 50%, #c8a600 100%);
  transform:scaleX(.18);
  transform-origin:left center;
  transition:transform .32s ease;
}

.bsp-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--bsp-shadow-hover);
  border-color:#dbdee5;
}

.bsp-card:hover::before{
  transform:scaleX(1);
}

.bsp-icon-wrap{
  width:66px;
  height:66px;
  min-width:66px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--bsp-yellow);
  color:#111;
  margin-bottom:16px;
  box-shadow:0 10px 22px rgba(255,210,0,.22);
}

.bsp-icon{
  width:28px;
  height:28px;
}

.bsp-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:0 12px;
  border-radius:999px;
  background:#F8FAFC;
  color:var(--bsp-black);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-bottom:12px;
}

.bsp-title{
  margin:0 0 16px;
  color:var(--bsp-black);
  font-size:1rem;
  line-height:1.45;
  font-weight:400;
  flex-grow:1;
}

.bsp-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#111;
  font-size:.86rem;
  font-weight:700;
}

.bsp-link-arrow{
  width:16px;
  height:16px;
}

.bsp-reveal{
  opacity:0;
  transform:translateY(24px);
  animation:bspFadeUp .75s cubic-bezier(.22,.61,.36,1) forwards;
}

@keyframes bspFadeUp{
  from{opacity:0; transform:translateY(24px);}
  to{opacity:1; transform:translateY(0);}
}

@media (max-width:1199px){
  .bsp-grid{grid-template-columns:repeat(3, minmax(0, 1fr));}
}

@media (max-width:991px){
  .bsp-grid{grid-template-columns:repeat(2, minmax(0, 1fr));}
}

@media (max-width:767px){
  .bsp-page{padding:42px 0 58px;}
  .bsp-grid{grid-template-columns:1fr; gap:16px;}
  .bsp-card{min-height:220px; padding:20px 16px 18px; border-radius:18px;}
  .bsp-page .container{width:min(100%, calc(100% - 24px));}
}

/* Política ainda sem ficheiro: o cartão fica, mas deixa de se fazer passar
   por accionável. */
.bsp-card.is-pendente {
    border-style: dashed;
    cursor: default;
}

.bsp-card.is-pendente .bsp-icon-wrap {
    opacity: .5;
}

.bsp-card.is-pendente .bsp-link {
    opacity: .7;
}