/* Curated OnTechnic sample catalog. Displayed only for unpublished products. */
.ot-demo-block{padding:42px 0 55px}
.ot-demo-heading{display:flex;justify-content:space-between;align-items:end;gap:38px;margin-bottom:30px}
.ot-demo-heading h3{font:500 clamp(32px,4.4vw,58px)/1.12 Manrope,sans-serif;letter-spacing:-.07em;margin:13px 0 0;color:#f4eddf}
.ot-demo-heading p{max-width:330px;color:#bfcfc0;line-height:1.7;font-size:14px}
.ot-demo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.ot-demo-card{background:#22382a;overflow:hidden;box-shadow:0 30px 45px #071a102d}
.ot-demo-stage{min-height:400px;position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 52%,#6a807360 0%,#233c2c 48%,#142c1f 90%)}
.ot-demo-stage::before{position:absolute;content:'';inset:0;background:repeating-linear-gradient(113deg,transparent 0,transparent 75px,#f2ead70d 76px,#f2ead70d 77px)}
.ot-demo-stage-rcd{background:radial-gradient(ellipse at 50% 50%,#919c8580,#3f5342 53%,#182a1e 100%)}
.ot-demo-topline{position:absolute;top:28px;left:28px;color:#e6dfcf;letter-spacing:.17em;font-size:10px}
.ot-demo-sketch-note{position:absolute;bottom:24px;left:28px;color:#c5d3c3;font-size:9px;letter-spacing:.08em}
.ot-demo-g1{width:clamp(220px,26vw,340px);height:clamp(188px,24vw,310px);position:relative;background:#131a17;border:12px solid #242b26;border-radius:7px;box-shadow:0 24px 39px #061b1599,0 1px 0 2px #969f91;transform:perspective(850px) rotateY(-13deg) rotateX(5deg);transition:transform .65s ease}
.ot-demo-card:hover .ot-demo-g1{transform:perspective(850px) rotateY(-3deg) rotateX(0)}
.ot-demo-g1-display{height:100%;background:linear-gradient(140deg,#233e33,#0c1c14);padding:17px 17px;color:#f1eee3;display:flex;flex-direction:column}
.ot-demo-g1-header{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.18em}
.ot-demo-g1-header span{font-size:9px}
.ot-demo-g1-four{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:7px;margin-top:20px;flex:1}
.ot-demo-g1-four div{background:linear-gradient(145deg,#466252,#223a2c);font-size:23px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;border:1px solid #8fba942d}
.ot-demo-g1-four small{font-size:9px;letter-spacing:.09em;color:#d9e0d2}
.ot-demo-hager{position:relative;width:170px;height:295px;filter:drop-shadow(14px 24px 13px #071d15b8);transform:perspective(800px) rotateY(-11deg) rotateX(5deg);transition:transform .65s ease}
.ot-demo-card:hover .ot-demo-hager{transform:perspective(800px) rotateY(0) rotateX(0)}
.ot-demo-hager-cap{height:26px;background:linear-gradient(90deg,#c9d4d2,#f7faf5 35%,#bdc9c5);border-radius:4px;border:1px solid #b3beba;position:relative;box-shadow:inset 0 4px 0 #e2e8df}
.ot-demo-hager-cap:last-child{transform:rotate(180deg)}
.ot-demo-hager-body{height:243px;background:linear-gradient(90deg,#c6d0cb 0,#f1f3ed 20%,#fafcf6 73%,#cbd4ce);padding:22px 18px;color:#273b38;border-left:1px solid #a5b1aa;border-right:1px solid #a5b1aa}
.ot-demo-hager-logo{font-size:24px;font-weight:700;letter-spacing:-.06em;color:#166b8c}
.ot-demo-hager-model{font-size:9px;margin-top:18px}
.ot-demo-hager-spec{font-weight:600;font-size:11px;margin-top:7px}
.ot-demo-hager-switch{height:56px;width:56px;background:#cbd7d0;margin:8px auto;border:2px solid #b3bcb2;box-shadow:inset 0 3px 7px #7c8d8075;display:grid;place-items:center;position:relative}
.ot-demo-hager-switch i{width:26px;height:38px;background:linear-gradient(90deg,#626b67,#a9b5af);border-radius:2px;box-shadow:2px 3px 5px #303c3266}
.ot-demo-hager-switch b{position:absolute;bottom:5px;right:-18px;border:1px solid #b5bfb6;background:#f1f6f0;width:15px;height:15px}
.ot-demo-hager-mark{font-size:9px;margin-top:10px}
.ot-demo-detail{padding:35px 32px 36px}
.ot-demo-detail-top{display:flex;justify-content:space-between;gap:12px;font-size:9px;color:#b9cdba;letter-spacing:.13em}
.ot-demo-tag{border:1px solid #d4bea1;color:#e3c8a7;padding:5px 9px}
.ot-demo-detail h4{font:500 clamp(30px,3.4vw,45px)/1.12 Manrope,sans-serif;color:#f7efde;letter-spacing:-.065em;margin:15px 0}
.ot-demo-detail p{color:#ccdbcc;line-height:1.75;font-size:14px;max-width:540px;min-height:65px}
.ot-demo-bottom{border-top:1px solid #597060;margin-top:25px;padding-top:20px;display:flex;justify-content:space-between;gap:15px;align-items:center;font-size:11px;color:#e7cda8}
.ot-demo-bottom a{color:#f3e4ca!important;text-decoration:underline!important;text-underline-offset:4px}
@media(max-width:760px){.ot-demo-heading{display:block}.ot-demo-heading p{margin:18px 0}.ot-demo-grid{grid-template-columns:1fr}.ot-demo-stage{min-height:330px}.ot-demo-g1{height:244px;width:280px}.ot-demo-bottom{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.ot-demo-g1,.ot-demo-hager{transition:none}}