/* public/css/portfolio.css — v1 + Drive */

/* ── Cuadrícula ── */
.fpm-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(var(--fpm-cols, 3), 1fr);
    gap: 24px;
    padding: 16px 0;
}
@media (max-width: 768px) { .fpm-portfolio-grid { grid-template-columns: repeat(2,1fr); gap:14px; } }
@media (max-width: 480px) { .fpm-portfolio-grid { grid-template-columns: 1fr; } }

/* ── Tarjeta ── */
.fpm-card {
    background: #fff; border-radius: 12px; overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,.08); transition: transform .2s, box-shadow .2s;
    display: flex; flex-direction: column;
}
.fpm-card:hover { transform: translateY(-4px); box-shadow: 0 8px 28px rgba(0,0,0,.14); }

.fpm-card-thumb { position:relative; overflow:hidden; background:#f0f0f0; }
.fpm-card-thumb img { width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s; }
.fpm-card:hover .fpm-card-thumb img { transform:scale(1.04); }

.fpm-card-no-thumb,
.fpm-card-drive-placeholder {
    width:100%;height:100%;display:flex;flex-direction:column;align-items:center;
    justify-content:center;color:#888;font-size:13px;background:#f5f5f5;gap:8px;
}
.fpm-drive-icon { font-size:36px; }

/* Badges */
.fpm-badge {
    position:absolute;padding:3px 10px;border-radius:20px;
    font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
}
.fpm-badge-360  { top:10px;left:10px; background:rgba(15,90,140,.88);color:#fff;backdrop-filter:blur(4px); }
.fpm-badge-drive{ top:10px;right:10px;background:rgba(30,150,80,.88);color:#fff;backdrop-filter:blur(4px); }

.fpm-card-body { padding:14px 16px 16px;flex:1;display:flex;flex-direction:column;gap:6px; }
.fpm-card-title { font-size:15px;font-weight:600;color:#1a1a1a;margin:0;line-height:1.35; }
.fpm-card-location { font-size:13px;color:#666;margin:0; }
.fpm-card-actions { display:flex;gap:8px;margin-top:auto;padding-top:10px; }

/* ── Botones ── */
.fpm-btn {
    flex:1;padding:8px 12px;border-radius:6px;font-size:13px;font-weight:500;
    text-align:center;cursor:pointer;border:none;text-decoration:none;
    transition:background .15s,color .15s;display:inline-block;line-height:1.4;
}
.fpm-btn-outline { background:transparent;border:1.5px solid #2271b1;color:#2271b1; }
.fpm-btn-outline:hover { background:#e8f4fb; }
.fpm-btn-primary { background:#2271b1;color:#fff; }
.fpm-btn-primary:hover { background:#185278;color:#fff; }

/* ── Visor individual ── */
.fpm-viewer-wrap { border-radius:12px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.15);margin:16px 0; }
.fpm-photo-wrap  { margin:16px 0; }
.fpm-photo-title { text-align:center;font-size:14px;color:#555;margin-top:8px; }

/* ── Modal ── */
.fpm-modal { position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center; }
.fpm-modal-overlay { position:absolute;inset:0;background:rgba(0,0,0,.82);cursor:pointer; }
.fpm-modal-content { position:relative;z-index:1;width:92%;max-width:1040px;background:#fff;border-radius:12px;overflow:hidden;display:flex;flex-direction:column; }
.fpm-modal-header { display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:#1a1a2e;color:#fff; }
.fpm-modal-title-text { font-size:15px;font-weight:600; }
.fpm-modal-close { background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;line-height:1; }
.fpm-modal-close:hover { opacity:.7; }

/* Pannellum override */
.pnlm-container { border-radius:0!important; }