#frp-modal{position:fixed;inset:0;z-index:9999;display:none}
#frp-modal.open{display:block}
body.frp-modal-open{overflow:hidden}
.frp-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.frp-gallery.frp-document{display:block}
.frp-gallery.frp-document p{margin:0 0 8px 0}
.frp-gallery .frp-media{cursor:pointer;margin:0;display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;overflow:hidden;background:#fff}
.frp-gallery img{width:100%;height:100%;display:block;object-fit:contain}
/* Desktop: object-fit cover per frp-projects - riempimento completo */
@media (min-width:768px){
.frp-gallery:not(.frp-exb) .frp-media img{width:100%;height:100%;display:block;object-fit:cover}
}
.frp-gallery figcaption{display:none}

#frp-modal{position:fixed;inset:0;z-index:9999;display:none}
#frp-modal.open{display:block}
#frp-modal .frp-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.7)}
#frp-modal .frp-dialog{position:fixed;inset:0;background:#fff;box-shadow:0 10px 40px rgba(0,0,0,.35);padding:1rem;overflow:auto}
#frp-modal .frp-close{position:absolute;top:1rem;right:1rem;background:transparent !important;border:0 !important;border-radius:0 !important;padding:0 !important;cursor:pointer;display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;z-index:5;box-shadow:none !important}
#frp-modal .frp-prev,#frp-modal .frp-next{border:0 !important;background:transparent !important;border-radius:0 !important;width:4rem;height:4rem;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:5;box-shadow:none !important;padding:0 !important}
#frp-modal .frp-media{margin:1rem auto;text-align:center;max-width:1170px;width:100%;position:relative;overflow:hidden;background:#fff}
#frp-modal .frp-media-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
#frp-modal .frp-media > .frp-prev,#frp-modal .frp-media > .frp-next{position:absolute;top:50%;transform:translateY(-50%)}
#frp-modal .frp-media > .frp-prev{left:.5rem}#frp-modal .frp-media > .frp-next{right:.5rem}
#frp-modal .frp-head{width:100%;max-width:1170px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem .625rem}
#frp-modal .frp-head .frp-title{color:#00A651;font-size:2rem !important;line-height:1.2;margin:.25rem 0 .5rem 0;flex:1;font-weight:600}
#frp-modal .frp-prev svg,#frp-modal .frp-next svg{width:80px;height:80px;display:block}
#frp-modal .frp-close{position:static;top:auto;right:auto;background:transparent !important;border:0 !important;border-radius:0 !important;padding:0 !important;cursor:pointer;display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;z-index:1;box-shadow:none !important;margin-left:.5rem}
#frp-modal .frp-close svg{width:56px;height:56px;display:block}
#frp-modal .frp-prev svg path,#frp-modal .frp-next svg path,#frp-modal .frp-close svg path{stroke:#00A651;stroke-width:3}
#frp-modal .frp-media{isolation:isolate}
/* Default arrows: green (from base rule). When overlapping the image, switch to white + subtle shadow */
#frp-modal .frp-prev.over-photo svg,#frp-modal .frp-next.over-photo svg{filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}
#frp-modal .frp-prev.over-photo svg path,#frp-modal .frp-next.over-photo svg path{stroke:#fff}
#frp-modal .frp-media-inner img,#frp-modal .frp-media-inner iframe{max-width:100%;max-height:70vh;width:auto;height:auto;object-fit:contain;display:block}
#frp-modal .frp-media-inner .frp-modal-loader{width:100%;height:100%}
#frp-modal .frp-modal-loader{display:flex;justify-content:center;align-items:center;min-height:40vh}
#frp-modal .frp-modal-loader .frp-spinner{width:40px;height:40px;border:4px solid rgba(0,0,0,.15);border-top-color:#00A651;border-radius:50%;animation:frp-spin .8s linear infinite}
@keyframes frp-spin{to{transform:rotate(360deg)}}
#frp-modal .frp-actions{margin:1.5rem 0 3.4rem 0;display:flex;gap:1.3rem;justify-content:center}
#frp-modal .frp-actions .frp-act-link{display:inline-flex;align-items:center;gap:.5rem;font-family:Inter,Arial,sans-serif;font-size:1.125rem;font-weight:600;text-decoration:underline;color:inherit;background:transparent;border:0;padding:0}
#frp-modal .frp-actions .frp-act-link svg{width:26px;height:26px;display:block}
#frp-modal .frp-info{width:100%;max-width:1170px;margin:0 auto;border-collapse:collapse;background:#fff}
#frp-modal .frp-info tr{background:#fff !important}
#frp-modal .frp-info th,#frp-modal .frp-info td{border-top:2px solid #000;border-bottom:2px solid #000;border-left:0;border-right:0;padding:.6875rem .75rem;text-align:left;background:#fff;vertical-align:top;font-size:1.25rem}
#frp-modal .frp-info th{width:var(--frp-meta-key-width,13.75rem);white-space:normal}

/* Desktop-only: fix max photo height to 550px without affecting mobile */
@media (min-width:768px){
#frp-modal .frp-media{height:680px}
#frp-modal .frp-media-inner img,#frp-modal .frp-media-inner iframe{max-height:100%}
#frp-modal .frp-modal-loader{min-height:550px}
#frp-modal .frp-info{--frp-meta-key-width:25rem}
}

/* Tablet: narrower meta key column */
@media (min-width:768px) and (max-width:1024.98px){
#frp-modal .frp-info{--frp-meta-key-width:18rem}
}
/* Mobile: reduce table font and padding to near-original sizes */
@media (max-width:767.98px){
#frp-modal .frp-info th,#frp-modal .frp-info td{font-size:1rem;padding:.375rem .5rem}
/* Match single page: shrink meta key column on mobile */
#frp-modal .frp-info{--frp-meta-key-width:8.4rem}
/* on mobile we keep same over-photo behavior; detection handled via JS */
/* Slightly smaller modal title on mobile */
#frp-modal .frp-head .frp-title{font-size:1.8rem !important}
}

/* Simple scroll animations */
.will-animate{opacity:0;transform:translateY(8px)}
.animated{animation-duration:.7s;animation-fill-mode:forwards;animation-timing-function:ease-out}
.animated-fast{animation-duration:.3s;animation-fill-mode:forwards;animation-timing-function:ease-out}
.animated-slow{animation-duration:2s}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.fadeIn{animation-name:fadeIn}

/* Prevent initial flicker on projects page: hide targets until animated */
[data-frp-pl][data-animate="1"] .frp-card,
[data-frp-pl][data-animate="1"] .frp-filter-panels .frp-filter-section,
[data-frp-pl][data-animate="1"] .frp-block-title{opacity:0;transform:translateY(8px)}
[data-frp-pl][data-animate="1"] .frp-filter-bar .frp-filter-trigger{opacity:0}

/* Ensure animated overrides hidden state */
/* let keyframes drive the transition; no hard override */

/* Prevent initial flicker on single page */
[data-frp-single][data-animate="1"] .frp-hero,
[data-frp-single][data-animate="1"] .frp-project-single,
[data-frp-single][data-animate="1"] .frp-block-title,
[data-frp-single][data-animate="1"] .frp-side-nav,
[data-frp-single][data-animate="1"] .frp-downloads,
[data-frp-single][data-animate="1"] .frp-documents{opacity:0;transform:translateY(8px)}

/* On single pages, animate media items individually to avoid delaying the whole section */
[data-frp-single][data-animate="1"] .frp-media-sections .frp-gallery .frp-media{opacity:0;transform:translateY(8px)}