/* Ajustes finos (sobrescreve style.css) */

:root{
  /* Preset padrão (se não definir data-preset no html). */
  --scale-display: 1;
  --scale-h1: 1;
  --scale-h2: 1;
  --scale-body: 1;
  --scale-meta: 1;
  --scale-ui: 1;
}

/* Modal de imagem global (funciona fora do slide 30). */
.image-modal{
  position:fixed;
  inset:0;
  background:rgba(0, 0, 0, 0.92);
  backdrop-filter:blur(8px);
  display:none;
  z-index:9999;
  animation:fadeIn 0.3s ease;
}
[data-theme="light"] .image-modal{background:rgba(20,18,14,0.88);}
.image-modal.active{
  display:flex;
  align-items:center;
  justify-content:center;
}
.image-modal-content{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:clamp(12px, 1.8vh, 16px);
  animation:slideUp 0.4s ease;
}
.image-modal-img{
  max-width:90vw;
  max-height:85vh;
  object-fit:contain;
  border-radius:8px;
  border:1px solid rgba(200, 168, 75, 0.2);
  box-shadow:0 0 40px rgba(200, 168, 75, 0.15);
}
.image-modal-close{
  position:absolute;
  top:clamp(12px, 2vh, 20px);
  right:clamp(12px, 2vw, 20px);
  width:40px;
  height:40px;
  background:rgba(0, 0, 0, 0.6);
  border:1px solid rgba(255, 255, 255, 0.1);
  border-radius:8px;
  color:#eae6de;
  font-size:24px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all 0.2s ease;
}
.image-modal-close:hover{
  background:rgba(0, 0, 0, 0.8);
  border-color:rgba(255, 255, 255, 0.2);
}
.image-modal-hint{
  font-family:'JetBrains Mono', monospace;
  font-size:clamp(10px, 0.9vw, 12px);
  color:#a39f98;
  text-align:center;
}
[data-theme="light"] .image-modal-img{
  border-color:rgba(154, 122, 40, 0.3);
  box-shadow:0 0 40px rgba(154, 122, 40, 0.15);
}

@keyframes fadeIn{
  from{opacity:0;}
  to{opacity:1;}
}
@keyframes slideUp{
  from{transform:translateY(18px);opacity:0;}
  to{transform:translateY(0);opacity:1;}
}

/* Preset para TV grande (70" / 5–10m). */
html[data-preset="tv70"]{
  --scale-display: 1.05;
  --scale-h1: 1.12;
  --scale-h2: 1.08;
  --scale-body: 1.15;
  --scale-meta: 1.1;
  --scale-ui: 1.1;
}

/* Preset para TV 55" (sala media). */
html[data-preset="tv55"]{
  --scale-display: 1.03;
  --scale-h1: 1.08;
  --scale-h2: 1.05;
  --scale-body: 1.08;
  --scale-meta: 1.05;
  --scale-ui: 1.06;
}

/* Preset para projetor (salas maiores). */
html[data-preset="projetor"]{
  --scale-display: 1.08;
  --scale-h1: 1.16;
  --scale-h2: 1.1;
  --scale-body: 1.18;
  --scale-meta: 1.12;
  --scale-ui: 1.12;
}

/* Preset para auditorio (distancia maior). */
html[data-preset="auditorio"]{
  --scale-display: 1.12;
  --scale-h1: 1.2;
  --scale-h2: 1.14;
  --scale-body: 1.22;
  --scale-meta: 1.15;
  --scale-ui: 1.15;
}

/* DISPLAY */
.ctitle{font-size: calc(clamp(44px,8.4vw,112px) * var(--scale-display));}
.sn{font-size: calc(clamp(30px,3.5vw,54px) * var(--scale-display));}
.cprice{font-size: calc(clamp(26px,2.8vw,38px) * var(--scale-display));}

/* H1 */
.slt{font-size: calc(clamp(32px,5.4vw,72px) * var(--scale-h1));}
.bq{font-size: calc(clamp(24px,3.8vw,54px) * var(--scale-h1));}

/* H2 */
.cname{font-size: calc(clamp(17px,1.9vw,23px) * var(--scale-h2));}

/* BODY */
.ssub{font-size: calc(clamp(14px,1.45vw,19px) * var(--scale-body));}
.slbl{font-size: calc(clamp(12px,1.15vw,15px) * var(--scale-body));}
.bl li{font-size: calc(clamp(14px,1.45vw,18px) * var(--scale-body));}
.ci{font-size: calc(clamp(13px,1.25vw,15px) * var(--scale-body));}
.ct td{font-size: calc(clamp(13px,1.25vw,15px) * var(--scale-body));}
.ct td:first-child{font-size: calc(clamp(10px,.95vw,12px) * var(--scale-body));}
.pb{font-size: calc(clamp(12px,1.05vw,14px) * var(--scale-body));}
.aname{font-size: calc(clamp(14px,1.25vw,16px) * var(--scale-body));}
.adesc{font-size: calc(clamp(12px,1.05vw,13px) * var(--scale-body));}
.ml{font-size: calc(clamp(12px,1.05vw,14px) * var(--scale-body));}
.tname{font-size: calc(clamp(14px,1.25vw,16px) * var(--scale-body));}
.tdesc{font-size: calc(clamp(12px,1.05vw,13px) * var(--scale-body));}
.utxt{font-size: calc(clamp(12px,1.05vw,13px) * var(--scale-body));}
.b-val{font-size: calc(clamp(13px,1.5vw,18px) * var(--scale-body));}
.cfeat{font-size: calc(clamp(12px,1.05vw,13px) * var(--scale-body));}

/* META */
.ey{font-size: calc(clamp(10px,1vw,12px) * var(--scale-meta));}
.logo-txt{font-size: calc(clamp(10px,1.05vw,12px) * var(--scale-meta));}
.ab-top-r{font-size: calc(clamp(9px,.95vw,11px) * var(--scale-meta));}
.ab-sub{font-size: calc(clamp(9px,1vw,12px) * var(--scale-meta));}
.r-unit{font-size: calc(clamp(8px,.9vh,11px) * var(--scale-meta));}
.ab-status{font-size: calc(clamp(10px,1.1vh,14px) * var(--scale-meta));}
.b-lbl{font-size: calc(clamp(8px,.7vw,9px) * var(--scale-meta));}
.launch-sub{font-size: calc(clamp(11px,1.2vw,14px) * var(--scale-meta));}
.cct{font-size: calc(clamp(9px,.85vw,11px) * var(--scale-meta));}
.ct th{font-size: calc(clamp(9px,.85vw,11px) * var(--scale-meta));}
.plbl{font-size: calc(clamp(9px,.9vw,11px) * var(--scale-meta));}
.an{font-size: calc(clamp(9px,.9vw,11px) * var(--scale-meta));}
.mb::before{font-size: calc(11px * var(--scale-meta));}
.tbadge{font-size: calc(clamp(9px,.8vw,10px) * var(--scale-meta));}
.csub{font-size: calc(clamp(10px,1.05vw,12px) * var(--scale-meta));}
.crole{font-size: calc(clamp(9px,.9vw,11px) * var(--scale-meta));}
.ctag{font-size: calc(clamp(9px,.95vw,11px) * var(--scale-meta));}
.cplan{font-size: calc(clamp(9px,.9vw,11px) * var(--scale-meta));}
.nctr{font-size: calc(clamp(10px,1vw,12px) * var(--scale-meta));}
.nfs{font-size: calc(clamp(9px,.85vw,11px) * var(--scale-meta));}

/* UI */
.abtn{font-size: calc(clamp(10px,1vw,12px) * var(--scale-ui));}
.bi{width: calc(22px * var(--scale-ui));height: calc(22px * var(--scale-ui));font-size: calc(11px * var(--scale-ui));}
.nbtn{font-size: calc(clamp(13px,1.4vw,16px) * var(--scale-ui));}
