/* =========================================================
   SM917 RESPONSIVE LAYOUT POLISH
   Page-specific sizing only. Does not alter header/navigation.
   ========================================================= */

/* ---------- Home: Garage Control Center ---------- */
.hero > *{min-width:0}
/* Give the text and the console comparable visual weight instead of shrinking the console. */
@media(min-width:901px){
  .hero{grid-template-columns:minmax(0,1fr) minmax(430px,.96fr);gap:42px}
}
.hero-console{
  width:100%;
  max-width:560px;
  justify-self:end;
}
.hero-console .mod-preview{
  height:242px;
  margin:17px 0;
  padding:21px;
}
.hero-console .home-featured-machine img{
  width:90px;
  height:90px;
}
.hero-console .mini-grid{gap:12px}
.hero-console .metric{min-height:84px;padding:13px 14px}
.hero-console .metric strong{font-size:1.16rem}

/* ---------- Account / My Garage library ---------- */
body[data-account-page="true"] #library .section-head{
  margin-bottom:20px;
}
body[data-account-page="true"] #library-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:16px !important;
  align-items:stretch;
}
body[data-account-page="true"] #library-grid .refined-owned-mod{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
}
body[data-account-page="true"] #library-grid .refined-owned-mod .project-cover{
  height:168px !important;
  min-height:168px !important;
  padding:16px !important;
}
body[data-account-page="true"] #library-grid .owned-mod-cover-copy h2{
  font-size:1.18rem !important;
  line-height:1.12 !important;
  margin:6px 0 0 !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
body[data-account-page="true"] #library-grid .refined-owned-mod .project-body{
  padding:15px 16px 16px !important;
  flex:1;
}
body[data-account-page="true"] #library-grid .refined-owned-mod .project-body p{
  min-height:0 !important;
  margin-top:10px;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  line-height:1.55;
}
body[data-account-page="true"] #library-grid .mod-cover-icon-image,
body[data-account-page="true"] #library-grid .mod-cover-icon-fallback{
  width:62px;
  height:62px;
  right:16px;
  top:16px;
}
body[data-account-page="true"] #library-grid .owned-mod-open{
  min-height:44px;
}

/* ---------- Mods catalog ---------- */
/* Three columns is the desktop target: large enough to read, not oversized. */
.new_arrivals-page #mods-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
  align-items:stretch;
  max-width:1120px;
}
.new_arrivals-page #mods-grid .mod-catalog-card{
  height:100%;
  display:flex;
  flex-direction:column;
}
.new_arrivals-page #mods-grid .project-cover{
  height:184px;
  min-height:184px;
}
.new_arrivals-page #mods-grid .project-body{
  flex:1;
  display:flex;
  flex-direction:column;
  padding:19px;
}
.new_arrivals-page #mods-grid .project-body>p{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:4.65em;
}
.new_arrivals-page #mods-grid .mod-card-footer{
  margin-top:auto;
  padding-top:14px;
}
.new_arrivals-page #mods-grid .mod-cover-link h2{
  font-size:1.24rem;
  line-height:1.12;
  bottom:17px;
  left:18px;
  right:18px;
  z-index:2;
}

/* Spotlight: visibly smaller than the original, but still a hero component. */
.new_arrivals-page .sm917-spotlight{
  padding:8px 0 34px;
}
.new_arrivals-page .sm917-spotlight-shell{
  width:min(1080px,calc(100% - 36px));
  margin-inline:auto;
}
.new_arrivals-page .sm917-spotlight-shell,
.new_arrivals-page .sm917-spotlight-stage{
  min-height:455px;
}
.new_arrivals-page .sm917-spotlight-stage{
  grid-template-columns:minmax(0,.95fr) minmax(350px,1.05fr);
}
.new_arrivals-page .sm917-spotlight-copy{
  padding:44px 22px 96px 44px;
}
.new_arrivals-page .sm917-spotlight-title{
  font-size:clamp(2.55rem,4.25vw,4.35rem);
  max-width:550px;
}
.new_arrivals-page .sm917-spotlight-desc{
  font-size:.94rem;
  max-width:535px;
}
.new_arrivals-page .sm917-spotlight-visual{
  padding:24px 36px 90px 12px;
}
.new_arrivals-page .sm917-spotlight-product{
  width:min(90%,590px);
  aspect-ratio:1.4/1;
}
.new_arrivals-page .sm917-spotlight-thumbs{
  left:30px;
  right:30px;
  bottom:21px;
}
.new_arrivals-page .sm917-spot-thumb{
  flex-basis:88px;
  height:64px;
}
.new_arrivals-page .sm917-spot-thumb img{max-height:42px}

/* ---------- Mod detail ---------- */
.mod-page .mod-detail-hero{padding:46px 0 24px}
.mod-page .mod-detail-grid{
  width:min(1120px,calc(100% - 36px));
  grid-template-columns:minmax(0,1.03fr) minmax(360px,.97fr);
  gap:38px;
  align-items:center;
}
.mod-page .mod-main-image{
  min-height:0;
  height:auto;
  aspect-ratio:16/10;
  max-height:430px;
  border-radius:24px;
  cursor:zoom-in;
}
.mod-page .mod-main-image img{
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
}
.mod-page .mod-main-image::after{
  content:"Apri immagine";
  position:absolute;
  right:14px;
  bottom:14px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(5,9,18,.72);
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  font-size:.72rem;
  font-weight:750;
  opacity:0;
  transform:translateY(4px);
  transition:.18s ease;
  pointer-events:none;
  backdrop-filter:blur(8px);
}
.mod-page .mod-main-image:hover::after{opacity:1;transform:none}
.mod-page .mod-main-image small{z-index:2}
.mod-page .mod-thumbs{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  margin-top:10px;
}
.mod-page .mod-thumbs button{
  height:auto;
  aspect-ratio:16/9;
  border-radius:12px;
  opacity:.8;
  transition:.18s ease;
}
.mod-page .mod-thumbs button:hover,
.mod-page .mod-thumbs button.active{
  opacity:1;
  border-color:rgba(94,231,255,.55);
  box-shadow:0 0 0 2px rgba(94,231,255,.08);
}
.mod-page .mod-detail-copy h1{
  font-size:clamp(2.65rem,4.2vw,4.35rem);
}
.mod-page .mod-detail-copy .lead{
  font-size:1rem;
  line-height:1.7;
}
.mod-page .mod-info-grid{gap:16px}

/* ---------- Public users/cards ---------- */
.users-grid,
#users-grid{
  align-items:stretch;
}
.user-card{height:100%}

/* ---------- Giveaway ---------- */
.giveaway-grid{align-items:stretch}
.giveaway-card{height:100%}

/* ---------- Lightbox ---------- */
.sm917-lightbox{
  position:fixed;
  inset:0;
  z-index:2147483200;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  background:rgba(3,6,13,.94);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  opacity:0;
  visibility:hidden;
  transition:opacity .2s ease,visibility .2s ease;
}
.sm917-lightbox.open{opacity:1;visibility:visible}
.sm917-lightbox-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:16px 20px;
  color:#fff;
}
.sm917-lightbox-title{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:800;
}
.sm917-lightbox-close,
.sm917-lightbox-nav{
  appearance:none;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.07);
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
  border-radius:13px;
}
.sm917-lightbox-close{width:42px;height:42px;font-size:1.25rem}
.sm917-lightbox-stage{
  min-height:0;
  position:relative;
  display:grid;
  place-items:center;
  padding:10px 74px 18px;
}
.sm917-lightbox-image{
  display:block;
  max-width:min(1500px,100%);
  max-height:calc(100vh - 150px);
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:10px;
  box-shadow:0 28px 80px rgba(0,0,0,.5);
  user-select:none;
}
.sm917-lightbox-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:48px;
  height:58px;
  font-size:1.55rem;
}
.sm917-lightbox-prev{left:16px}
.sm917-lightbox-next{right:16px}
.sm917-lightbox-nav:hover,
.sm917-lightbox-close:hover{background:rgba(255,255,255,.13)}
.sm917-lightbox-bottom{
  display:flex;
  justify-content:center;
  padding:10px 20px 18px;
  color:rgba(255,255,255,.68);
  font-size:.82rem;
}
body.sm917-lightbox-open{overflow:hidden}

/* ---------- Responsive tuning ---------- */
@media(max-width:1100px){
  body[data-account-page="true"] #library-grid,
  .new_arrivals-page #mods-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .hero-console{max-width:580px}
  .new_arrivals-page .sm917-spotlight-shell,
  .new_arrivals-page .sm917-spotlight-stage{min-height:430px}
  .new_arrivals-page .sm917-spotlight-copy{padding-left:36px}
}

@media(max-width:900px){
  .hero-console{justify-self:stretch;width:100%;max-width:620px;margin-inline:auto}
  .new_arrivals-page .sm917-spotlight-shell{width:min(100% - 36px,760px)}
  .new_arrivals-page .sm917-spotlight-stage{grid-template-columns:1fr;min-height:600px}
  .new_arrivals-page .sm917-spotlight-copy{padding:34px 28px 10px}
  .new_arrivals-page .sm917-spotlight-visual{min-height:320px;padding:0 18px 88px}
  .mod-page .mod-detail-grid{grid-template-columns:1fr;gap:28px}
  .mod-page .mod-main-image{aspect-ratio:16/10;max-height:none}
}

@media(max-width:680px){
  body[data-account-page="true"] #library-grid,
  .new_arrivals-page #mods-grid{
    grid-template-columns:1fr !important;
  }
  body[data-account-page="true"] #library-grid .refined-owned-mod .project-cover{
    height:184px !important;
    min-height:184px !important;
  }
  .new_arrivals-page #mods-grid .project-cover{
    height:196px;
    min-height:196px;
  }
  .hero-console .mod-preview{height:215px}
  .hero-console .mini-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hero-console .metric{min-height:70px;padding:11px}
  .hero-console .metric strong{font-size:1rem}
  .new_arrivals-page .sm917-spotlight-shell,
  .new_arrivals-page .sm917-spotlight-stage{min-height:560px}
  .new_arrivals-page .sm917-spotlight-title{font-size:clamp(2.25rem,12vw,3.35rem)}
  .new_arrivals-page .sm917-spotlight-thumbs{left:14px;right:14px}
  .mod-page .mod-main-image{aspect-ratio:4/3;border-radius:18px}
  .mod-page .mod-thumbs{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  .sm917-lightbox-stage{padding:8px 12px 72px}
  .sm917-lightbox-image{max-height:calc(100vh - 145px);border-radius:7px}
  .sm917-lightbox-nav{top:auto;bottom:10px;transform:none;width:52px;height:46px}
  .sm917-lightbox-prev{left:calc(50% - 60px)}
  .sm917-lightbox-next{right:calc(50% - 60px)}
}

@media(max-width:430px){
  .hero-console{padding:15px;border-radius:21px}
  .hero-console .mod-preview{height:198px;padding:16px}
  .hero-console .home-featured-machine img{width:70px;height:70px}
  .hero-console .metric span{font-size:.66rem}
  .new_arrivals-page .sm917-spot-thumb{flex-basis:74px;height:58px}
  .mod-page .mod-thumbs{grid-template-columns:repeat(2,minmax(0,1fr))}
}