/* ======================================
   PHTM Countdown — FULL WIDTH
====================================== */

.phtm-countdown{
  display:flex;
  width:100%;                 /* FULL WIDTH of its parent */
  max-width:none;             /* IMPORTANT: remove any cap */
  margin:16px 0;              /* no auto-centering that implies a max-width */
  padding:0;
  gap:12px;

  align-items:stretch;
  justify-content:space-between;
  box-sizing:border-box;
}

/* Each box flexible / equal width */
.phtm-cd__box{
  flex:1 1 0;                 /* equal flexible boxes */
  min-width:0;                /* IMPORTANT: allows shrinking */
  background:#111;
  color:#fff;
  padding:10px 12px;
  border-radius:10px;
  text-align:center;
  box-shadow:0 4px 12px rgba(0,0,0,.15);
  box-sizing:border-box;
}

.phtm-cd__num{
  display:block;
  font-size:20px;
  font-weight:800;
  line-height:1.1;
}

.phtm-cd__lbl{
  display:block;
  margin-top:4px;
  font-size:11px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.8;
}

/* Responsive tweaks */
@media (max-width:768px){
  .phtm-countdown{gap:8px}
  .phtm-cd__box{padding:8px 10px}
  .phtm-cd__num{font-size:18px}
  .phtm-cd__lbl{font-size:10px}
}

@media (max-width:480px){
  .phtm-countdown{gap:6px}
  .phtm-cd__box{padding:7px 8px}
  .phtm-cd__num{font-size:16px}
  .phtm-cd__lbl{font-size:9px}
}

/* ==============================
   Countdown Ended State
============================== */

.phtm-cd__ended{
  width:100%;
  padding:14px 16px;
  text-align:center;
  font-size:16px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  border-radius:10px;

  background:#e5e5e5;
  color:#444;
}