/* =========================
   AWARDS – CLEAN SCROLL WALL (REWRITE)
   Uses markup:
   .award-scroll > a.award-card > .award-media + .award-body
========================= */

.award-scroll{
  display:flex;
  gap:18px;
  overflow-x:auto;
  padding:16px 10px 22px;
  scroll-snap-type:x mandatory;
  scroll-padding-left:10px;
  -webkit-overflow-scrolling:touch;
}

/* subtle scrollbar */
.award-scroll::-webkit-scrollbar{ height:8px; }
.award-scroll::-webkit-scrollbar-track{ background:transparent; }
.award-scroll::-webkit-scrollbar-thumb{
  background:rgba(176,146,69,.22);
  border-radius:999px;
}

/* Card */
.award-card{
  flex:0 0 340px;
  scroll-snap-align:start;

  background:var(--panel);
  border:1px solid rgba(17,24,39,.10);
  border-radius:18px;
  overflow:hidden;

  display:flex;
  flex-direction:column;

  text-decoration:none;
  color:inherit;

  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.award-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(0,0,0,.10);
  border-color:rgba(176,146,69,.28);
}

/* Media */
.award-media{
  background:linear-gradient(180deg,#ffffff,#fafafa);
  border-bottom:1px solid rgba(17,24,39,.08);

  padding:16px;
  height:300px;

  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.award-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  border-radius:10px;
}

/* Body */
.award-body{
  padding:14px 16px 16px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

/* Title */
.award-name{
  margin:0;
  font-size:16px;
  font-weight:800;
  line-height:1.25;
  letter-spacing:-.2px;
  color:var(--text);
}

/* Category (secondary heading) */
.award-category{
  margin:0;
  font-size:13px;
  font-weight:650;
  line-height:1.35;
  color:rgba(31,41,55,.75);
}

/* Meta row (year • issuer) */
.award-meta{
  margin:0;
  font-size:12.5px;
  line-height:1.4;
  color:rgba(31,41,55,.60);

  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
}

.award-meta .dot{
  opacity:.5;
  padding:0 2px;
}

/* Description */
.award-desc{
  margin:2px 0 0;
  font-size:13px;
  line-height:1.55;
  color:rgba(31,41,55,.70);

  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  line-clamp: 3;
  overflow:hidden;
}

/* Footer note under the scroll */
.award-foot{
  margin-top:10px;
  font-size:13px;
  color:var(--muted);
}

/* Mobile */
@media (max-width:640px){
  .award-card{ flex:0 0 88%; }
  .award-media{ height:260px; padding:14px; }
}
/* ✅ Anchor for absolute arrows */
.award-wrap{
  position: relative;
  max-width: 1120px;     /* adjust to your layout */
  margin: 0 auto;
}

/* ✅ Scroll row needs side padding so arrows have space */
.award-scroll{
  padding: 10px 64px;    /* room for arrows */
}

/* --- Premium side arrows --- */
.award-arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;

  width: 44px;
  height: 44px;
  border-radius: 999px;

  border: 1px solid rgba(231,226,214,.95);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);

  color: #111827;
  font-size: 22px;
  line-height: 1;

  display: grid;
  place-items: center;

  box-shadow:
    0 10px 24px rgba(17,24,39,.10),
    0 1px 0 rgba(255,255,255,.70) inset;

  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, opacity .15s ease;
}

/* ✅ Put arrows on the SIDE of the carousel (slightly outside looks best) */
.award-arrow.left{ left: -40px; }
.award-arrow.right{ right: -52px; }

.award-arrow:hover{
  transform: translateY(-50%) scale(1.04);
  background: rgba(255,255,255,.98);
  box-shadow:
    0 14px 34px rgba(17,24,39,.14),
    0 1px 0 rgba(255,255,255,.75) inset;
}

.award-arrow:active{
  transform: translateY(-50%) scale(.98);
}

/* Disabled: fade + hide */
.award-arrow:disabled{
  opacity: 0;
  pointer-events: none;
}

/* ✅ Mobile: swipe only */
@media (max-width: 768px){
  .award-wrap{ max-width: 100%; }
  .award-arrow{ display: none; }
  .award-scroll{ padding: 10px 14px; }
}