/* Reviews (text + video) and photo-card gallery. Light editorial edition, scoped so the legacy .gal/.photo-open grid rules never leak in. */

/* ---------- text quotes ---------- */
#revs .revs{columns:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:34px}
#revs .rev{margin:0;border:1px solid #E6EAE1;border-radius:14px;background:var(--ink2);padding:28px 26px 24px;display:flex;flex-direction:column;gap:22px}
#revs .rev::before{content:"“";font-family:Georgia,serif;font-size:56px;line-height:.6;color:#9DB56F;height:22px}
#revs .rev p{font-size:16px;line-height:1.6;color:var(--ink);flex:1}
.rev-by{display:flex;align-items:center;gap:12px}
.rev-by img,.rev-by .ini{width:42px;height:42px;border-radius:50%;object-fit:cover;flex:none;background:#DDE3D5}
.rev-by .ini{display:grid;place-items:center;font-weight:600;color:var(--green-text)}
.rev-by strong{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.rev-by small{display:block;font-size:12px;color:var(--mut);margin-top:2px}
#revs .rev .who{display:none}

/* ---------- video reviews ---------- */
.vrev-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.vrev-controls{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--mut)}
.vrev-controls button{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:18px;color:var(--ink);transition:.2s}
.vrev-controls button:hover{background:var(--lime);border-color:var(--lime)}
.vrev-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;margin-top:32px;padding-bottom:18px;
  scrollbar-width:thin;scrollbar-color:var(--ink4) transparent;overscroll-behavior-x:contain}
.vcard{flex:0 0 calc((100% - 72px)/5);min-width:210px;scroll-snap-align:start}
.vbox{position:relative;border-radius:14px;overflow:hidden;background:#1d2622;aspect-ratio:9/16}
.vbox video{width:100%;height:100%;object-fit:cover;display:block}
.vbox .vplay{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,rgba(8,24,18,0) 45%,rgba(8,24,18,.55));transition:background .25s}
.vbox .vplay:hover{background:linear-gradient(180deg,rgba(8,24,18,.05) 30%,rgba(8,24,18,.45))}
.vbox .vplay i{width:64px;height:64px;border-radius:50%;background:var(--lime);display:grid;place-items:center;box-shadow:0 10px 30px #0003;transition:transform .25s}
.vbox .vplay:hover i{transform:scale(1.07)}
.vbox .vplay i::after{content:"";border-left:17px solid var(--ink);border-block:11px solid transparent;margin-left:5px}
.vbox .vtag{position:absolute;left:12px;top:12px;z-index:2;background:rgba(255,255,255,.92);color:var(--ink);font-size:11px;font-weight:600;padding:6px 10px;border-radius:99px}
.vbox .vtime{position:absolute;right:12px;bottom:12px;z-index:2;color:#fff;font-size:12px;font-weight:600;text-shadow:0 1px 6px #0008}
.vbox.playing .vplay,.vbox.playing .vtime{display:none}
.vcard h3{font-size:19px;font-weight:500;letter-spacing:-.02em;margin-top:16px;line-height:1.2}
.vcard p{font-size:13px;color:var(--mut);margin-top:6px;line-height:1.45}
.vrev-more{display:inline-block;margin-top:14px}
@media(max-width:1100px){.vcard{flex-basis:calc((100% - 36px)/3)}}
@media(max-width:700px){.vcard{flex-basis:62%}.vrev-track{margin-inline:calc(var(--pad)*-1);padding-inline:var(--pad);scroll-padding-inline:var(--pad)}.vrev-controls span{display:none}}

/* ---------- photo cards ---------- */
.gcards-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.gcards-count{font-size:14px;color:var(--mut)}
.gcards-count b{color:var(--ink);font-weight:600}
.gcards{columns:4 260px;column-gap:18px;margin-top:34px}
.gcards .photo-open.gcard{
  grid-column:auto;grid-row:auto;margin:0 0 18px;width:100%;display:block;break-inside:avoid;text-align:left;
  background:#fff;border:1px solid #E6EAE1;border-radius:14px;padding:8px 8px 0;overflow:hidden;cursor:zoom-in;
  box-shadow:0 1px 0 #171c1a05;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s}
.gcards .photo-open.gcard:hover{transform:translateY(-4px);box-shadow:0 18px 40px #1f2d1b14}
.gcards .photo-open.gcard img{width:100%;height:auto;aspect-ratio:auto;border-radius:9px;display:block;transform:none}
.gcards .photo-open.gcard:hover img{transform:none}
.gcards .photo-open.gcard>span.zoom{display:none}
/* legacy .photo-open>span is the round zoom badge; the caption must not inherit it */
.gcards .photo-open.gcard>span.gcap{position:static;inset:auto;width:auto;height:auto;background:none;border:0;border-radius:0;display:flex;gap:10px;align-items:baseline;padding:12px 6px 13px;color:var(--ink);font-size:inherit;place-items:initial}
.gcap small{font-size:10px;font-weight:600;color:var(--green-text);font-variant-numeric:tabular-nums;flex:none}
.gcap em{font-style:normal;font-size:13px;font-weight:500;color:var(--ink);line-height:1.35}
.gcards .photo-open.gcard.is-hidden{display:none}
.gcards-more{display:flex;justify-content:center;margin-top:18px}
.gcards-more button{border:1px solid var(--line);background:#fff;border-radius:99px;padding:14px 26px;font-size:14px;font-weight:600;color:var(--ink);transition:.2s}
.gcards-more button:hover{background:var(--lime);border-color:var(--lime)}
@media(max-width:700px){.gcards{columns:2;column-gap:10px}.gcards .photo-open.gcard{margin-bottom:10px;padding:5px 5px 0;border-radius:11px}.gcards .photo-open.gcard img{border-radius:7px}.gcards .photo-open.gcard>span.gcap{padding:9px 4px 10px;gap:7px}.gcap em{font-size:11.5px}.gcap small{font-size:9px}}