#models .md-grid { display:grid; grid-template-columns:1.25fr 1fr; grid-template-rows:auto auto; gap:22px; margin-top:30px; perspective:1200px; }
#models .md-card { position:relative; border-radius:24px; border:1px solid var(--line); background:linear-gradient(160deg, rgba(19,41,74,.8), rgba(8,20,38,.7)); padding:30px; transform-style:preserve-3d; transition:transform .5s var(--ease), border-color .4s, box-shadow .4s, opacity .9s var(--ease); }
#models .md-card.in { transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); }
#models .md-sub { grid-row:1 / span 2; padding:40px; display:flex; flex-direction:column; border-color:rgba(255,197,0,.4); }
#models .md-sub::after { content:""; position:absolute; inset:-1px; border-radius:24px; pointer-events:none; box-shadow:0 0 0 1px rgba(255,197,0,.5), 0 0 50px -6px rgba(255,197,0,.35); opacity:.5; }
#models.md-on .md-sub::after { animation:mdGlow 3.2s ease-in-out infinite; }
.hx-static #models .md-sub::after { opacity:1; }
@keyframes mdGlow { 50% { opacity:1; } }
#models .md-badge { align-self:flex-start; margin-bottom:22px; }
#models .md-ico { width:56px; height:56px; border-radius:16px; display:grid; place-items:center; background:rgba(34,211,238,.1); border:1px solid rgba(34,211,238,.35); margin-bottom:18px; }
#models .md-ico svg, #models .md-box svg { fill:none; stroke:var(--cyan); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
#models .md-ico svg { width:28px; height:28px; }
#models .md-t { font:700 clamp(26px,2.6vw,34px)/1.1 var(--head); color:var(--white); margin:0 0 10px; }
#models .md-sub .md-t { font-size:clamp(34px,3.6vw,48px); }
#models .md-d { margin:0; color:var(--text); font-size:17px; max-width:440px; }
#models .md-tag { margin:18px 0 0; font:600 15px var(--head); color:var(--cyan); letter-spacing:.04em; }
#models .md-tag::before { content:"→ "; }
#models .md-grow { display:flex; align-items:flex-end; gap:10px; height:90px; margin-top:auto; padding-top:22px; }
#models .md-grow i { flex:1; height:var(--h); border-radius:8px 8px 3px 3px; background:linear-gradient(180deg, #22d3ee, rgba(14,165,233,.15)); transform-origin:bottom; transform:scaleY(.08); transition:transform 1.1s var(--ease); }
#models .md-grow i:nth-child(n) { transition-delay:calc(var(--k,0)*1ms); }
#models.md-on .md-grow i, .hx-static #models .md-grow i { transform:none; }
#models .md-ras { display:grid; grid-template-columns:1fr 150px; column-gap:20px; }
#models .md-ras > :not(.md-box) { grid-column:1; }
#models .md-box { grid-column:2; grid-row:1 / span 4; align-self:center; }
#models .md-box svg { width:150px; height:auto; overflow:visible; }
#models .md-hw { display:inline-block; justify-self:start; font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--cyan); padding:6px 12px; border-radius:999px; border:1px dashed rgba(34,211,238,.6); margin-bottom:16px; }
#models .md-drop { transform:translateY(-40px); opacity:0; transition:transform .8s cubic-bezier(.5,1.6,.4,1), opacity .4s; }
#models .md-drop.d1 { transition-delay:.6s; } #models .md-drop.d2 { transition-delay:.9s; }
#models .md-lid { transform-origin:30px 52px; transform:rotate(-35deg); transition:transform .6s var(--ease) 1.6s; }
#models .md-seal { stroke:var(--green); stroke-width:3; stroke-dasharray:50; stroke-dashoffset:50; transition:stroke-dashoffset .6s ease 2.2s; }
#models.md-on .md-drop, .hx-static #models .md-drop { transform:translateY(40px); opacity:1; }
#models.md-on .md-drop { opacity:1; }
#models.md-on .md-lid, .hx-static #models .md-lid { transform:none; }
#models.md-on .md-seal, .hx-static #models .md-seal { stroke-dashoffset:0; }
@media (max-width:900px) { #models .md-grid { grid-template-columns:1fr; } #models .md-sub { grid-row:auto; padding:30px; } #models .md-grow { height:80px; } }
@media (max-width:600px) { #models .md-ras { grid-template-columns:1fr; } #models .md-box { grid-column:1; grid-row:auto; order:-1; } #models .md-box svg { width:120px; } #models .md-card { padding:24px; } }
@media (prefers-reduced-motion: reduce) { #models .md-card, #models .md-grow i, #models .md-drop, #models .md-lid, #models .md-seal { transition:none; } #models .md-sub::after { animation:none !important; opacity:1; } }
#models .md-ras { grid-template-columns:1fr 190px; } #models .md-box svg { width:190px; }
#models .md-hw { white-space:nowrap; font-size:11.5px; }
@media (max-width:600px) { #models .md-ras { grid-template-columns:1fr; } #models .md-box svg { width:130px; } #models .md-hw { white-space:normal; } }
/* fit 1440x900 with footer clearance */
#models .md-grid { margin-top:22px; }
#models .md-card { padding:24px 28px; }
#models .md-sub { padding:32px 36px; }
#models .md-badge { margin-bottom:14px; }
#models .md-ico { width:48px; height:48px; margin-bottom:12px; }
#models .md-t { font-size:clamp(24px,2.2vw,30px); }
#models .md-hw { margin-bottom:10px; }
#models .md-tag { margin-top:12px; }
#models .md-grow { height:64px; padding-top:16px; }
