/* Predvajalnik predstavitve AvtoTrg. Vse je pod .at-demo, da ne poseže v preostalo stran. */
.at-demo{
  --at-bg:#0A0F1C;
  --at-panel:#101A2E;
  --at-panel-2:#152238;
  --at-line:#22314E;
  --at-teal:#2BD9C9;
  --at-amber:#FFA726;
  --at-text:#EDF2FC;
  --at-muted:#8FA3C4;
  color:var(--at-text);
  font-family:Inter,sans-serif;
}
.at-demo-player{
  position:relative;
  background:#070b14;
  border:1px solid var(--at-line);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.35);
}
.at-demo-player:focus{outline:2px solid var(--at-teal);outline-offset:3px;}
.at-demo-screen{position:relative;background:#070b14;}
.at-demo-chrome{
  display:flex;align-items:center;gap:10px;
  height:38px;padding:0 12px;
  background:#0d1526;border-bottom:1px solid var(--at-line);
}
.at-demo-dots{display:flex;gap:6px;}
.at-demo-dots i{width:8px;height:8px;border-radius:50%;background:#2a3b58;display:block;}
.at-demo-dots i:nth-child(1){background:#ff6b5e;}
.at-demo-dots i:nth-child(2){background:#ffc876;}
.at-demo-dots i:nth-child(3){background:#2bd9c9;}
.at-demo-url{
  margin:0 auto;min-width:0;max-width:420px;flex:1;
  text-align:center;font-family:'JetBrains Mono',monospace;font-size:11px;
  color:var(--at-muted);background:#101a2e;border:1px solid var(--at-line);
  border-radius:999px;padding:4px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.at-demo-stage{
  position:relative;aspect-ratio:16/9;background:
    radial-gradient(900px 280px at 50% -10%, rgba(43,217,201,.08), transparent 60%),
    var(--at-bg);
  overflow:hidden;
}
.at-demo-stage video{
  width:100%;height:100%;object-fit:cover;background:#000;display:block;
}
.at-scene{
  position:absolute;inset:0;
  display:flex;flex-direction:column;justify-content:center;
  padding:28px 32px 48px;
  opacity:0;visibility:hidden;
  pointer-events:none;overflow:hidden;
}
.at-scene.is-on{opacity:1;visibility:visible;}
.at-kicker{
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--at-teal);margin-bottom:10px;
}
.at-title{
  font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(28px,4vw,52px);line-height:1.05;margin:0;
}
.at-title span{color:var(--at-amber);}
.at-lead{margin:12px 0 0;max-width:36ch;color:var(--at-muted);font-size:15px;}

.at-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch;width:100%;
}
.at-card{
  background:var(--at-panel);border:1px solid var(--at-line);border-radius:12px;overflow:hidden;min-width:0;
  transform:translateY(16px);opacity:0;
  transition:opacity .6s ease, transform .6s ease, border-color .3s ease, box-shadow .3s ease;
}
.at-scene.is-on .at-card{opacity:1;transform:none;}
.at-scene.is-on .at-card:nth-child(2){transition-delay:.08s;}
.at-scene.is-on .at-card:nth-child(3){transition-delay:.16s;}
.at-scene.is-on .at-card:nth-child(4){transition-delay:.24s;}
.at-card img{width:100%;height:92px;object-fit:cover;display:block;background:#152238;}
.at-card-body{padding:8px 10px 10px;}
.at-card-title{font-size:12px;font-weight:600;line-height:1.3;}
.at-card-price{font-family:'Space Grotesk',sans-serif;color:var(--at-amber);font-weight:700;margin-top:4px;}
.at-card-meta{color:var(--at-muted);font-size:11px;margin-top:2px;}
.at-card.is-dim{opacity:.28;transform:scale(.98);}
.at-card.is-hot{border-color:var(--at-teal);box-shadow:0 0 0 3px rgba(43,217,201,.25);}

.at-search{
  display:flex;align-items:center;gap:10px;
  background:var(--at-panel);border:1px solid var(--at-line);border-radius:12px;
  padding:12px 14px;margin-bottom:14px;
}
.at-search b{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--at-teal);font-weight:500;letter-spacing:.08em;}
.at-typed{font-size:16px;min-height:1.2em;}
.at-caret{
  width:1px;height:16px;background:var(--at-amber);margin-left:1px;
  animation:atCaret 1s steps(1) infinite;
}
@keyframes atCaret{50%{opacity:0;}}

.at-detail{display:grid;grid-template-columns:1.3fr .9fr;gap:16px;align-items:center;height:100%;}
.at-detail img{
  width:100%;height:100%;max-height:100%;object-fit:cover;border-radius:14px;
  border:1px solid var(--at-line);transform:scale(1.04);
  transition:transform 4.5s ease;
}
.at-scene.is-on .at-detail img{transform:scale(1);}
.at-specs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.at-specs span{
  border:1px solid var(--at-line);background:var(--at-panel);border-radius:999px;
  padding:5px 10px;font-size:12px;color:var(--at-muted);
}

.at-devices{position:relative;height:100%;}
.at-desktop,.at-phone{
  position:absolute;background:#0d1526;border:1px solid var(--at-line);overflow:hidden;
  box-shadow:0 16px 40px rgba(0,0,0,.35);
}
.at-desktop{inset:8% 18% 10% 4%;border-radius:12px;}
.at-desktop img{width:100%;height:72%;object-fit:cover;}
.at-desktop .at-mini{padding:10px 12px;}
.at-phone{
  width:27%;right:6%;bottom:6%;top:16%;border-radius:22px;border-width:3px;
  transform:translateY(12px);
  transition:transform 1.1s ease;
}
.at-scene.is-on .at-phone{transform:none;}
.at-phone img{width:100%;height:58%;object-fit:cover;}
.at-phone .at-mini{padding:8px 10px;}
.at-mini b{display:block;font-size:13px;}
.at-mini em{font-style:normal;color:var(--at-amber);font-family:'Space Grotesk',sans-serif;font-weight:700;}

.at-benefits{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.at-benefit{
  background:var(--at-panel);border:1px solid var(--at-line);border-radius:14px;padding:16px 16px 14px;
  opacity:0;transform:translateY(10px);transition:opacity .55s ease, transform .55s ease;
}
.at-scene.is-on .at-benefit{opacity:1;transform:none;}
.at-scene.is-on .at-benefit:nth-child(2){transition-delay:.12s;}
.at-scene.is-on .at-benefit:nth-child(3){transition-delay:.24s;}
.at-scene.is-on .at-benefit:nth-child(4){transition-delay:.36s;}
.at-benefit strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:18px;margin-bottom:4px;}
.at-benefit span{color:var(--at-muted);font-size:13px;}

.at-cursor{
  position:absolute;z-index:3;width:18px;height:18px;margin-left:-2px;margin-top:-2px;
  border-radius:50%;border:2px solid #fff;background:rgba(255,167,38,.9);
  box-shadow:0 4px 14px rgba(0,0,0,.4);
  transition:left .9s cubic-bezier(.2,.7,.2,1), top .9s cubic-bezier(.2,.7,.2,1), transform .2s ease;
  pointer-events:none;
}
.at-cursor.is-down{transform:scale(.8);}

.at-caption{
  min-height:2.6em;padding:8px 16px 2px;
  text-align:center;font-size:14px;line-height:1.35;font-weight:600;
  color:#fff;background:#0d1526;
}
.at-card-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.at-demo.is-cc-off .at-caption{display:none;}

.at-demo-controls{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px 12px;background:#0d1526;border-top:1px solid var(--at-line);
}
.at-demo-controls button{
  flex:0 0 auto;height:36px;min-width:36px;padding:0 10px;
  border-radius:8px;border:1px solid var(--at-line);background:transparent;
  color:var(--at-text);font-family:'Space Grotesk',sans-serif;font-weight:600;cursor:pointer;
}
.at-demo-controls button:hover{border-color:var(--at-teal);color:var(--at-teal);}
.at-demo-controls button[aria-pressed="false"]{opacity:.55;}
.at-time{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--at-muted);min-width:34px;}
.at-bar{
  flex:1;height:8px;border-radius:99px;background:#1a2740;cursor:pointer;position:relative;
}
.at-bar i{
  position:absolute;left:0;top:0;bottom:0;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--at-amber),#ffc876);
}
.at-bigplay{
  position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);
  width:74px;height:74px;border-radius:50%;border:0;cursor:pointer;
  background:linear-gradient(135deg,var(--at-amber),#ffc876);color:#241403;
  font-size:28px;box-shadow:0 10px 30px rgba(0,0,0,.35);z-index:5;
}
.at-demo.is-playing .at-bigplay{display:none;}

.at-demo-modal{
  position:fixed;inset:0;z-index:80;background:rgba(4,8,16,.78);
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.at-demo-modal[hidden]{display:none;}
.at-demo-modal .at-demo{width:min(1100px,100%);}
.at-demo-close{
  position:absolute;top:16px;right:16px;z-index:81;
  height:40px;padding:0 14px;border-radius:8px;border:1px solid var(--at-line);
  background:#101a2e;color:var(--at-text);cursor:pointer;font-family:'Space Grotesk',sans-serif;
}
.at-demo-player:fullscreen,.at-demo-player:-webkit-full-screen{
  width:100%;height:100%;border-radius:0;display:flex;flex-direction:column;
}
.at-demo-player:fullscreen .at-demo-screen,.at-demo-player:-webkit-full-screen .at-demo-screen{flex:1;display:flex;flex-direction:column;}
.at-demo-player:fullscreen .at-demo-stage,.at-demo-player:-webkit-full-screen .at-demo-stage{flex:1;aspect-ratio:auto;}

.at-demo-note{margin:12px 0 0;color:var(--text-muted,#8FA3C4);font-size:13px;}
.at-demo-note a{color:var(--teal,#2BD9C9);}

@media(max-width:800px){
  .at-scene{padding:16px;}
  .at-grid{grid-template-columns:1fr 1fr;gap:8px;}
  .at-card img{height:72px;}
  .at-detail{grid-template-columns:1fr;gap:8px;}
  .at-detail img{height:78px;}
  .at-title{font-size:26px;}
  .at-scene{padding:14px 14px 42px;}
  .at-benefits{grid-template-columns:1fr;}
  .at-phone{width:34%;}
  .at-caption{font-size:13px;}
  .at-demo-controls{gap:6px;padding:8px;}
  .at-demo-label{display:none;}
}
@media(prefers-reduced-motion:reduce){
  .at-scene,.at-card,.at-benefit,.at-phone,.at-detail img,.at-cursor{transition:none;animation:none;}
}