/* TEMPORARY FENCING PRODUCTS — cleaned per request
   - tags: no shine
   - button: no continuous shine (hover lift only)
   - button pinned at bottom across cards
   - cards keep subtle continuous sheen + hover green
*/

.section--temporary-fencing-products{
  background:#ffffff;
  padding:10px 0 24px;
}

/* Slightly wider so the three-column layout breathes */
.tfp.container{ max-width:1320px; }

/* Grid */
.tfp .tfp-grid{
  display:grid;
  gap:18px 20px;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
}
@media (max-width:700px){
  .tfp .tfp-grid{ grid-template-columns:1fr; }
}

/* ---------------- Card (keep sheen) ---------------- */
.tfp .tfp-card{
  position:relative;
  overflow:hidden;
  border-radius:12px;
  padding:0;
  display:flex;               /* so we can pin the footer */
  flex-direction:column;
  min-height:100%;            /* ensure full-height flex children */
  background:#fff;
  border:1px solid #e7efea;
  box-shadow:0 6px 14px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.05);
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
}

/* Gentle continuous glossy sweep on the card only */
.tfp .tfp-card::after{
  content:"";
  position:absolute; inset:-2px;
  pointer-events:none; mix-blend-mode:screen;
  background:linear-gradient(115deg,rgba(255,255,255,0) 20%,rgba(255,255,255,.72) 50%,rgba(255,255,255,0) 80%);
  transform:translateX(-160%);
  animation:tfp-card-shine 3.6s linear infinite;
  opacity:.22;
}
@keyframes tfp-card-shine{ to { transform:translateX(160%); } }

.tfp .tfp-card::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    radial-gradient(1px 1px at 8% 22%, rgba(255,255,255,.20) 50%, transparent 51%),
    radial-gradient(1px 1px at 72% 38%, rgba(255,255,255,.16) 50%, transparent 51%),
    radial-gradient(1px 1px at 40% 78%, rgba(255,255,255,.12) 50%, transparent 51%);
  background-repeat:no-repeat; opacity:.20;
}

.tfp .tfp-card:hover{
  transform:translateY(-1px) scale(1.01);
  background-color:#f6fbf8;
  border-color:#cfe9dc;
  box-shadow:0 18px 42px rgba(15,23,42,.10), 0 4px 12px rgba(15,23,42,.07);
}

/* ---------------- Media (big, edge-to-edge, zoom on hover) ---------------- */
.tfp .tfp-card figure{ margin:0; display:block; }
.tfp .tfp-media{
  position:relative; overflow:hidden;
  border-radius:12px 12px 0 0;
  background:#fff;
}
.tfp .tfp-media img{
  width:100%; height:auto; display:block; object-fit:cover;
  aspect-ratio:16 / 7;                       /* taller image */
  transform:scale(1);
  transition:transform .5s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}
.tfp .tfp-card:hover .tfp-media img{ transform:scale(1.08); }

.tfp .tfp-media.noimg{
  background:linear-gradient(135deg,#eaf2ee 0,#f7faf8 100%);
  min-height:200px;
}

/* Ribbon */
.tfp .tfp-ribbon{
  position:absolute; top:10px; right:10px;
  background:#0b3d1b; color:#e7f5ee;
  font-size:12px; font-weight:900; border:1px solid rgba(255,255,255,.18);
  padding:6px 10px; border-radius:999px;
}

/* ---------------- Body & Footer (pin footer) ---------------- */
.tfp .tfp-card .tfp-body{
  padding:16px 18px 10px;
  flex:1;                                   /* <— pushes footer to the bottom */
}
.tfp .tfp-card .tfp-foot{
  padding:12px 18px 16px;
  margin-top:auto;                          /* safety pin */
}

/* Text */
.tfp .tfp-title{ margin:0 0 6px; font-weight:900; color:#0f172a; font-size:16px; }
.tfp .tfp-desc{ margin:6px 0 10px; color:#46555f; font-size:13px; line-height:1.45; }
.tfp .tfp-mini{ margin:8px 0 6px; font-weight:900; font-size:13px; color:#0f172a; }

/* small line with icon */
.tfp .tfp-line{ margin:0; color:#3a4b55; font-size:12.6px; display:flex; align-items:center; gap:6px; }
.tfp .tfp-line .dot{
  width:14px; height:14px; border-radius:50%;
  border:2px solid #0c612c; display:inline-block; position:relative;
}
.tfp .tfp-line .dot:after{
  content:""; position:absolute; left:3px; top:3px; width:6px; height:6px; background:#0c612c; border-radius:50%;
}

/* Lists */
.tfp .tfp-list{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.tfp .tfp-list li{
  padding-left:16px; position:relative; color:#3f4f58; font-size:13px; line-height:1.45;
}
.tfp .tfp-list li:before{
  content:""; position:absolute; left:0; top:.54em; width:6px; height:6px; border-radius:999px; background:#22a455;
}

/* ---------------- Tags (no shine, 20% smaller kept) ---------------- */
.tfp .tfp-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.tfp .tfp-tags span{
  font-size:10px;                 /* ~20% smaller than 12px */
  color:#114326;
  background:#e8f3ed;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(16,72,38,.1);
}
/* (intentionally no ::before/::after, no animation) */

/* ---------------- Button (no continuous shine; hover lift only) ---------------- */
.tfp .tfp-card .btn{
  width:100%; min-width:0; justify-content:center;
  text-decoration:none !important;
  font-weight:800; color:#fff;
  border:1px solid transparent;
  background:linear-gradient(180deg,#16a34a 0%, #15803d 100%);
  border-color:#166534;
  box-shadow:0 10px 18px rgba(22,163,74,.22), inset 0 -2px 0 rgba(0,0,0,.10);
  transition:transform .08s ease, box-shadow .18s ease;
  border-radius:8px;
  font-size:12px; padding:8px 12px;
}
.tfp .tfp-card .btn:hover{
  transform:translateY(-1px);
  box-shadow:0 0 0 3px rgba(34,197,94,.18), 0 14px 28px rgba(22,163,74,.32), inset 0 -2px 0 rgba(0,0,0,.10);
}