/* Bizmilla — Testimoni page (extends muat-turun.css head/stats/docs styles) */
.tm-head-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end}
.tm-head .mt-title{margin-bottom:0;max-width:13ch}
.tm-head-side .mt-lead{margin-bottom:26px}
.tm-head .mt-stats dd{font-variant-numeric:lining-nums}

.tm-player-wrap{padding-bottom:clamp(40px,6vw,88px)}
.tm-player{border-radius:var(--r-lg);overflow:hidden;background:var(--forest);box-shadow:var(--shadow)}
.tm-frame{position:relative;aspect-ratio:16/9;max-height:min(76vh,720px);width:100%;background:#0f1612}
.tm-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tm-face{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer}
.tm-face img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease-out)}
.tm-face::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,22,18,.1) 30%,rgba(15,22,18,.78));z-index:1}
.tm-face .vplay{z-index:2;width:clamp(68px,7.4vw,96px);height:clamp(68px,7.4vw,96px);margin:0;left:50%;top:50%;translate:-50% -50%}
.tm-face:hover img{transform:scale(1.03)}
.tm-face:hover .vplay{transform:scale(1.08);background:var(--green);color:var(--porcelain)}
.tm-face-cap{position:absolute;left:clamp(18px,3.2vw,40px);bottom:clamp(16px,3vw,36px);z-index:2;display:grid;gap:6px;text-align:left;color:var(--porcelain)}
.tm-face-cap small{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-light,#F3B650)}
.tm-face-cap b{font-family:var(--f-display);font-size:clamp(24px,3.2vw,42px);font-weight:500;line-height:1.1}
.tm-player-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px clamp(18px,3vw,32px);color:rgba(255,252,247,.78);font-size:14px}
.tm-player-bar p{display:flex;align-items:center;gap:10px;margin:0}
.tm-player-bar .ic{flex:0 0 auto;width:20px;height:20px;color:var(--gold-light,#F3B650)}
.tm-player-bar .link-arrow{color:var(--porcelain);white-space:nowrap}

.tm-sec-head{margin-bottom:clamp(26px,3.4vw,44px)}
.tm-sec-head--row{display:flex;align-items:end;justify-content:space-between;gap:20px}
.tm-picks{padding-top:0}
.tm-picks-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.tm-picks-grid .vcard{grid-column:span 2}
.tm-picks-grid .vcard:nth-child(-n+2){grid-column:span 3}
.tm-picks-grid .vcard .vquote{font-size:clamp(18px,1.5vw,21px)}

.tm-latest{padding-top:0}
.tm-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(20px,2.4vw,30px) 16px}
.tm-card .vthumb{margin-bottom:12px;border-radius:var(--r)}
.tm-card h3{font-family:var(--f-body);font-size:15px;font-weight:600;line-height:1.45;margin:0 2px 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tm-card .vmeta{padding:0 2px}

@media (max-width:1180px){.tm-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:980px){
  .tm-head-grid{grid-template-columns:1fr;align-items:start}
  .tm-picks-grid{grid-template-columns:1fr 1fr}
  .tm-picks-grid .vcard,.tm-picks-grid .vcard:nth-child(-n+2){grid-column:auto}
  .tm-picks-grid .vcard:last-child{grid-column:1/-1}
  .tm-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:720px){
  .tm-player{border-radius:var(--r)}
  .tm-player-bar{flex-direction:column;align-items:flex-start}
  .tm-sec-head--row{flex-direction:column;align-items:flex-start}
  .tm-picks-grid{grid-template-columns:1fr}
  .tm-picks-grid .vcard:last-child{grid-column:auto}
}


.vthumb--tall{aspect-ratio:9/16;border-radius:var(--r)}
.tm-card .vthumb--tall .vplay{width:52px;height:52px;margin:-26px 0 0 -26px}
.lightbox.is-vertical .lb-shell{width:min(420px,100%)}
.lightbox.is-vertical .lb-frame{aspect-ratio:9/16;max-height:78vh;margin:0 auto}
@media (max-width:720px){.tm-grid{grid-template-columns:1fr 1fr;gap:18px 12px}.tm-card h3{font-size:14px}}

/* keep the shorts grid free of orphan cards at every column count (15 items) */
@media (min-width:981px) and (max-width:1180px){.tm-grid .tm-card:nth-child(n+13){display:none}}
@media (max-width:720px){
  .tm-grid .tm-card:nth-child(n+15){display:none}
  .tm-frame{aspect-ratio:4/3}
  .tm-face .vplay{top:42%}
  .tm-face-cap{gap:4px}
  .tm-face-cap b{font-size:22px}
}

/* Player + own video list (YouTube embed has no playlist panel) */
.tm-player{display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,27vw,380px)}
.tm-player .tm-frame{grid-column:1;max-height:none}
.tm-player .tm-player-bar{grid-column:1/-1;border-top:1px solid rgba(255,252,247,.1)}
.tm-list{position:relative;grid-column:2;background:#18241d;border-left:1px solid rgba(255,252,247,.08);min-height:0}
.tm-list-head{position:absolute;inset:0 0 auto;z-index:1;display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0;padding:16px 18px 12px;background:#18241d;border-bottom:1px solid rgba(255,252,247,.08);color:var(--porcelain)}
.tm-list-head b{font-family:var(--f-display);font-size:19px;font-weight:500}
.tm-list-head span{font-size:12px;color:rgba(255,252,247,.6)}
.tm-list-scroll{position:absolute;inset:54px 0 0;overflow-y:auto;margin:0;padding:8px;list-style:none;scrollbar-width:thin;scrollbar-color:rgba(243,182,80,.5) transparent}
.tm-item{display:flex;align-items:center;gap:12px;width:100%;padding:8px;border:0;border-radius:12px;background:none;color:rgba(255,252,247,.86);text-align:left;cursor:pointer;transition:background .25s}
.tm-item:hover{background:rgba(255,252,247,.06)}
.tm-item.is-on{background:rgba(243,182,80,.14);color:#fff}
.tm-item img{flex:0 0 auto;width:54px;height:72px;object-fit:cover;border-radius:8px;background:#0f1612}
.tm-item.is-on img{outline:2px solid var(--gold-light,#F3B650);outline-offset:1px}
.tm-item-ic{flex:0 0 auto;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--gold-light,#F3B650);color:var(--forest)}
.tm-item-ic .ic{width:20px;height:20px}
.tm-item-t{display:grid;gap:4px;min-width:0}
.tm-item-t b{font-size:13.5px;font-weight:600;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tm-item-t small{font-size:12px;color:rgba(255,252,247,.55)}
@media (max-width:980px){
  .tm-player{grid-template-columns:1fr}
  .tm-list{grid-column:1;border-left:0;border-top:1px solid rgba(255,252,247,.08)}
  .tm-list-head{position:static}
  .tm-list-scroll{position:static;max-height:360px}
}
