/* DM stage 1 (25.10.26): lit footer wordmark, 3D tilt price cards, portfolio mirror hall.
   Loaded by Code Snippet "DM - stage 1 3D effects" only when option dm_stage1 allows it. */

/* 1) Footer wordmark lit by the cursor (the word already exists in the footer: .dmf-word) */
.dmf.dm1-lit .dmf-word{
  background:
    radial-gradient(circle at var(--lx,50%) var(--ly,45%),rgba(255,255,255,.95) 0,rgba(196,214,255,.6) 9%,rgba(110,149,240,.26) 22%,rgba(255,255,255,0) 42%),
    radial-gradient(circle at calc(var(--lx,50%) + 6%) calc(var(--ly,45%) + 10%),rgba(242,101,34,.55) 0,rgba(242,101,34,0) 16%),
    linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.02) 85%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.06)) drop-shadow(0 -1px 0 rgba(0,0,0,.35));
}

/* 2) Price cards tilt toward the pointer (fine pointers only, set by JS) */
.dmx[data-dmx-page="pricing"] .trs.dm1-tilt{perspective:1100px}
.dmx[data-dmx-page="pricing"] .trs.dm1-tilt .tr{transform-style:preserve-3d;will-change:transform}
.dmx[data-dmx-page="pricing"] .trs.dm1-tilt .tr.dm1-on{transition:transform .12s linear}
.dmx[data-dmx-page="pricing"] .trs.dm1-tilt .tr .dm-pr-name{transform:translateZ(18px)}
.dmx[data-dmx-page="pricing"] .trs.dm1-tilt .tr .pr3{transform:translateZ(34px)}
.dmx[data-dmx-page="pricing"] .trs.dm1-tilt .tr .btn{transform:translateZ(26px)}
.dmx[data-dmx-page="pricing"] .trs.dm1-tilt .tr .badge2{transform:translateZ(40px)}
.dm1-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.55),rgba(255,255,255,0) 42%);mix-blend-mode:soft-light;z-index:3}
.tr.dm1-on .dm1-glare{opacity:1}

/* 3) Portfolio mirror hall */
.dmx .dm1-hall{position:relative;padding:clamp(56px,7vw,96px) 0 clamp(40px,5vw,64px);color:#EAF0FF;overflow:hidden;isolation:isolate;
  background:radial-gradient(70% 60% at 50% 18%,#1b3a85 0,#0B1F45 55%,#06122b 100%)}
.dmx .dm1-hall::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(40% 35% at 85% 10%,rgba(242,101,34,.18),transparent 70%),radial-gradient(45% 40% at 10% 90%,rgba(46,95,209,.25),transparent 70%)}
.dmx .dm1-hall .head{text-align:center;max-width:760px;margin:0 auto clamp(20px,3vw,34px);padding:0 16px}
.dmx .dm1-hall .kick{color:#FFB48E}
.dmx .dm1-hall .h2{color:#fff}
.dmx .dm1-hall .lead{color:#AFC0DD;margin-inline:auto}
.dm1-stage{position:relative;height:clamp(330px,40vw,470px);perspective:1300px;perspective-origin:50% 35%;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.dm1-stage.is-drag{cursor:grabbing}
.dm1-ring{position:absolute;left:50%;top:38%;width:0;height:0;transform-style:preserve-3d}
.dm1-card{position:absolute;left:0;top:0;width:var(--cw,200px);aspect-ratio:3/4;margin:calc(var(--cw,200px) * -0.6667) 0 0 calc(var(--cw,200px) * -0.5);
  border-radius:16px;overflow:hidden;background:#0d1d44;border:1px solid rgba(255,255,255,.16);box-shadow:0 30px 60px -30px rgba(0,0,0,.8);
  -webkit-box-reflect:below 10px linear-gradient(transparent 62%,rgba(255,255,255,.22));backface-visibility:hidden;text-decoration:none}
.dm1-card img{width:100%;height:100%;object-fit:cover;object-position:50% 0;display:block;pointer-events:none;transition:object-position 6s linear}
.dm1-card:hover img{object-position:50% 100%}
.dm1-card .dm1-tag{position:absolute;inset:auto 0 0 0;padding:28px 12px 10px;background:linear-gradient(transparent,rgba(6,18,43,.92));font:700 14px/1.25 Rubik,system-ui,sans-serif;color:#fff;direction:rtl;text-align:right}
.dm1-card .dm1-tag small{display:block;font-weight:500;font-size:12px;color:#AFC0DD;margin-top:2px}
.dm1-card:focus-visible{outline:3px solid #F26522;outline-offset:3px}
.dm1-floor{position:absolute;inset:auto 0 0 0;height:42%;pointer-events:none;z-index:2;background:linear-gradient(rgba(6,18,43,0),rgba(6,18,43,.9) 70%)}
.dm1-now{position:relative;z-index:3;min-height:40px;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:nowrap;margin-top:-28px;padding:0 16px;direction:rtl}
.dm1-now b{font:800 clamp(18px,2vw,24px)/1.2 Rubik,system-ui,sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60vw}
.dm1-now .dm1-n{font:600 13px/1 "IBM Plex Mono",ui-monospace,monospace;color:#8EA0C0;direction:ltr;white-space:nowrap}
.dm1-now a{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;background:#F26522;color:#fff;font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap}
.dm1-arrows{display:flex;gap:8px}
.dm1-arrows button{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#fff;font-size:18px;line-height:1;cursor:pointer}
.dm1-arrows button:focus-visible{outline:2px solid #F26522}
@media (max-width:640px){.dm1-now{gap:10px}.dm1-now a{padding:8px 12px;font-size:13px}.dm1-arrows button{width:34px;height:34px}}
@media (prefers-reduced-motion:reduce){.dm1-card img{transition:none}}
