:root{--cm-bg:#0f1011;--cm-card:#171819;--cm-card2:#202122;--cm-text:#f2f2f2;--cm-muted:#a3a3a3;--cm-accent:#8b3dff;--cm-accent2:#5b45ff;--cm-soft:#b875ff}
.cm-page{max-width:1810px;margin:0 auto;padding:78px 56px 72px;color:var(--cm-text)}
.cm-breadcrumb{font-size:16px;color:#8e8e8e;margin-bottom:34px}.cm-breadcrumb strong{color:#e9e9e9;font-weight:600}.cm-slash{padding:0 10px;color:#666}
.cm-hero h1{margin:0;background:linear-gradient(110deg,var(--cm-soft),var(--cm-accent),#755bff);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:58px;line-height:1;font-weight:800;letter-spacing:-2px;text-transform:uppercase}.cm-hero p{max-width:1240px;margin:28px 0 0;color:#b7b7b7;font-size:20px;line-height:1.55}
.cm-toolbar{display:flex;align-items:flex-end;justify-content:space-between;margin:52px 0 38px;gap:24px}.cm-section-label{font-size:18px;font-weight:600;padding:0 8px 18px;border-bottom:2px solid #eee;min-width:185px}.cm-search{width:250px;height:42px;border:1px solid transparent;border-radius:14px;background:#1d1f20;color:#fff;padding:0 16px 0 42px;font-size:16px;outline:none;transition:.2s}.cm-search:focus{border-color:rgba(184,117,255,.55);box-shadow:0 0 0 3px rgba(139,61,255,.08)}.cm-search-wrap{position:relative}.cm-search-wrap:before{content:'⌕';position:absolute;left:15px;top:7px;color:#8f9294;font-size:23px}
.cm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 18px}.cm-card{position:relative;background:var(--cm-card);border-radius:22px;min-width:0;padding:1px;overflow:hidden;isolation:isolate;transition:transform .24s ease,box-shadow .24s ease}.cm-card:before{content:"";position:absolute;inset:-70%;z-index:-2;background:conic-gradient(from 0deg,transparent 0 70%,rgba(184,117,255,.15) 76%,#b875ff 82%,#8b3dff 86%,transparent 92%);opacity:0;animation:cm-orbit 2.8s linear infinite;transition:opacity .2s}.cm-card:after{content:"";position:absolute;inset:1px;border-radius:21px;background:var(--cm-card);z-index:-1}.cm-card:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(91,69,255,.10)}.cm-card:hover:before{opacity:1}@keyframes cm-orbit{to{transform:rotate(360deg)}}
.cm-card-inner{border-radius:21px;overflow:hidden}.cm-video-wrap{position:relative;aspect-ratio:16/9;background:#141516;overflow:hidden;cursor:pointer}.cm-video{width:100%;height:100%;object-fit:cover;display:block;background:#141516}.cm-video-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;opacity:1;transition:opacity .18s}.cm-video-wrap.is-ready .cm-video-thumb,.cm-video-wrap.is-playing .cm-video-thumb{opacity:0}.cm-play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(0,0,0,.42);color:#fff;font-size:18px;display:grid;place-items:center;backdrop-filter:blur(6px);transition:.2s}.cm-video-wrap.is-playing .cm-play{opacity:0;pointer-events:none}.cm-video-wrap:hover .cm-play{transform:translate(-50%,-50%) scale(1.05)}
.cm-card-body{padding:16px 18px 18px}.cm-card h3{font-size:20px;margin:0 0 16px;font-weight:650}.cm-copy{width:100%;height:52px;border:1px solid #3e4044;border-radius:11px;background:#333538;color:#fff;font-size:17px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:.18s}.cm-copy:hover{background:#3b3d41;border-color:rgba(184,117,255,.45)}.cm-copy.copied{background:linear-gradient(135deg,var(--cm-accent),var(--cm-accent2));border-color:transparent;color:#fff}.cm-copy svg{width:14px;height:14px;flex:0 0 14px}
.cm-ad{position:relative;border-radius:22px;padding:1px;overflow:hidden;min-width:0;background:linear-gradient(145deg,rgba(184,117,255,.55),rgba(91,69,255,.15) 38%,rgba(255,255,255,.05) 70%);min-height:0}.cm-ad-inner{height:100%;min-height:100%;border-radius:21px;background:radial-gradient(circle at 75% 10%,rgba(139,61,255,.18),transparent 36%),#171819;display:flex;flex-direction:column;justify-content:flex-end;padding:28px;aspect-ratio:16/9;box-sizing:border-box}.cm-ad-label{position:absolute;top:18px;right:18px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#8f9194}.cm-ad h3{font-size:25px;margin:0 0 8px}.cm-ad p{margin:0 0 20px;color:#a9aaad;line-height:1.45;max-width:380px}.cm-ad a{width:max-content;text-decoration:none;color:#fff;font-weight:750;padding:10px 15px;border-radius:10px;background:linear-gradient(135deg,var(--cm-accent),var(--cm-accent2))}
.cm-pagination{display:flex;justify-content:center;align-items:center;gap:58px;margin:58px auto 8px}.cm-page-btn{min-width:126px;height:58px;border:1px solid #3c3e42;border-radius:17px;background:#242629;color:#f4f4f4;font-size:20px;cursor:pointer;transition:.2s}.cm-page-btn:hover:not(:disabled){border-color:rgba(184,117,255,.55);background:#2b2d31}.cm-page-btn:disabled{background:#1d1f21;color:#666;cursor:not-allowed}.cm-page-count{font-size:22px;color:#9b9b9b;min-width:55px;text-align:center}.cm-empty{grid-column:1/-1;padding:70px;text-align:center;color:#888}
@media(max-width:1100px){.cm-page{padding:64px 28px}.cm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cm-hero h1{font-size:48px}}
@media(max-width:700px){.cm-page{padding:42px 16px}.cm-grid{grid-template-columns:1fr;gap:18px}.cm-hero h1{font-size:38px}.cm-hero p{font-size:16px;margin-top:18px}.cm-toolbar{margin:36px 0 24px;align-items:stretch;flex-direction:column}.cm-search{width:100%}.cm-section-label{width:max-content}.cm-pagination{gap:18px;margin-top:38px}.cm-page-btn{min-width:105px;height:52px}.cm-card,.cm-ad{border-radius:18px}.cm-card:after,.cm-card-inner,.cm-ad-inner{border-radius:17px}}

/* Camera Movement cinematic page background */
body{background:#090814!important;background-image:linear-gradient(rgba(7,6,18,.48),rgba(7,6,18,.72)),url('hero/camera-movement-bg.png')!important;background-size:cover!important;background-position:center top!important;background-attachment:fixed!important;background-repeat:no-repeat!important}
.bg-overlay{background:radial-gradient(circle at 50% 18%,rgba(92,45,180,.12),transparent 46%),linear-gradient(180deg,rgba(7,6,18,.08),rgba(7,6,18,.42))!important;pointer-events:none}
.o4p-footer{background:rgba(9,8,20,.42)!important;backdrop-filter:blur(8px)}


/* v3.6 FIX: render cinematic artwork above the global opaque body pseudo-backgrounds */
body.cm-body{background:#080714!important;}
body.cm-body::before{background:transparent!important;}
body.cm-body::after{opacity:0!important;background:none!important;}
body.cm-body>.bg-overlay{
  position:fixed!important;
  inset:0!important;
  z-index:-1!important;
  display:block!important;
  background-image:
    linear-gradient(180deg,rgba(6,5,18,.30) 0%,rgba(7,6,20,.52) 46%,rgba(7,6,18,.76) 100%),
    url('./camera-movement-bg.png')!important;
  background-size:cover!important;
  background-position:center top!important;
  background-repeat:no-repeat!important;
  filter:none!important;
  opacity:1!important;
  pointer-events:none!important;
}
body.cm-body .cm-page{position:relative;z-index:1;}
body.cm-body .o4p-footer{position:relative;z-index:1;background:rgba(8,7,20,.52)!important;backdrop-filter:blur(10px);}

/* v3.7 Camera Movement now inherits the exact Color Lab global background */
body.cm-body{background:#080910!important;}
body.cm-body::before{
  content:""!important;display:block!important;position:fixed!important;z-index:-3!important;inset:0!important;
  background:linear-gradient(rgba(8,9,16,.76),rgba(8,9,16,.88)),url('../../../assets/origastock-global-bg.webp') center/cover no-repeat!important;
  filter:blur(8px)!important;transform:scale(1.04)!important;opacity:1!important;pointer-events:none!important;
}
body.cm-body::after{
  content:""!important;display:block!important;position:fixed!important;z-index:-2!important;inset:0!important;
  background:radial-gradient(circle at 50% 12%,rgba(113,49,192,.16),transparent 38%),linear-gradient(180deg,rgba(9,10,17,.16),rgba(9,10,17,.78))!important;
  filter:none!important;transform:none!important;opacity:1!important;pointer-events:none!important;
}
body.cm-body>.bg-overlay{background:transparent!important;background-image:none!important;filter:none!important;opacity:1!important;}
body.cm-body .o4p-footer{background:transparent!important;backdrop-filter:none!important;}

/* Camera Movement featured video banner */
.cm-video-banner{height:300px;margin-top:26px;border:1px solid rgba(157,77,255,.75);border-radius:20px;overflow:hidden;position:relative;background:#11131c;box-shadow:0 14px 50px rgba(59,19,104,.18)}
.cm-video-banner video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#11131c}
.cm-video-banner:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(10,10,18,.18),rgba(10,10,18,.03),rgba(8,10,20,.14))}
.cm-banner-play{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:62px;height:62px;border:1px solid rgba(255,255,255,.35);border-radius:50%;background:rgba(14,12,22,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;display:grid;place-items:center;cursor:pointer;transition:.2s ease}
.cm-banner-play:hover{transform:translate(-50%,-50%) scale(1.06);background:rgba(118,63,210,.62)}
.cm-banner-play span{font-size:20px;margin-left:3px}
.cm-video-banner.is-playing .cm-banner-play{opacity:0;pointer-events:none}
@media(max-width:1100px){.cm-video-banner{height:260px}}
@media(max-width:700px){.cm-video-banner{height:220px;border-radius:16px}.cm-banner-play{width:52px;height:52px}}

/* v3.10: decorative banner video is non-interactive */
.cm-video-banner, .cm-video-banner video{pointer-events:none!important;user-select:none!important;-webkit-user-select:none!important;}

/* v3.16 unified pagination */
.cm-pagination{display:flex;justify-content:center;align-items:center;gap:18px;margin:58px auto 8px}.cm-page-numbers{display:flex;gap:18px}.cm-page-btn{min-width:74px;height:58px;padding:0 22px;border:1px solid rgba(255,255,255,.16);border-radius:17px;background:rgba(20,19,27,.82);color:#f4f4f4;font-size:19px;font-weight:700;cursor:pointer;transition:.2s}.cm-wide-btn{min-width:150px}.cm-page-btn.active{border-color:#9f59ff;box-shadow:0 0 18px rgba(137,69,255,.2)}.cm-page-btn:hover:not(:disabled){border-color:#9f59ff;background:rgba(27,25,35,.92)}.cm-page-btn:disabled{opacity:.38;background:rgba(20,19,27,.82);cursor:default}@media(max-width:700px){.cm-pagination{gap:8px;flex-wrap:wrap}.cm-page-numbers{gap:8px}.cm-page-btn{min-width:52px;height:50px;padding:0 13px;font-size:16px}.cm-wide-btn{min-width:110px}}

/* v3.17 — compact site-wide pagination */
.cm-pagination{gap:14px!important;margin-top:58px!important}.cm-page-numbers{gap:14px!important}.cm-page-btn{min-width:60px!important;height:56px!important;padding:0 16px!important;border-radius:15px!important;font-size:16px!important}.cm-wide-btn{min-width:128px!important}@media(max-width:700px){.cm-pagination,.cm-page-numbers{gap:8px!important}.cm-page-btn{min-width:48px!important;height:48px!important;padding:0 12px!important;font-size:14px!important}.cm-wide-btn{min-width:100px!important}}

/* v3.1: camera cards match Color Lab card layout */
.color-card .cm-card-inner{background:#171a20}.color-card .cm-video-wrap{aspect-ratio:16/9}.color-card .cm-card-body{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px 13px}.color-card .cm-card-body h3{margin:0;font-size:16px;font-weight:520;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.color-card .cm-copy{width:44px;height:44px;min-width:44px;border:0;background:transparent;padding:0;border-radius:10px}.color-card .cm-copy span{display:none}.color-card .cm-copy svg{width:23px;height:23px;flex:0 0 23px}.color-card .cm-copy:hover{background:rgba(255,255,255,.07)}.color-card .cm-copy.copied{width:auto;min-width:112px;padding:0 15px;background:linear-gradient(135deg,#7c4dff,#b46cff);border-color:#a66cff}.color-card .cm-copy.copied span{display:inline;font-size:14px;font-weight:650;white-space:nowrap}

/* v3.1 hotfix: copied feedback must always be visible */
.color-card .cm-copy.copied span{display:inline!important;font-size:14px!important;font-weight:650!important;white-space:nowrap!important}
.color-card .cm-copy.copied{width:auto!important;min-width:112px!important;padding:0 15px!important}

/* v3.2 exact Color Lab card controls — copied verbatim for Camera Movement */
.color-card .cm-card-inner{background:#171a20}
.color-card .cm-video-wrap{aspect-ratio:16/9}
.color-card .cm-card-body{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px 13px}
.color-card .cm-card-body h3{margin:0;font-size:16px;font-weight:520;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.color-card .cm-copy{width:34px;height:34px;min-width:34px;border:0;background:transparent;padding:0;border-radius:8px}
.color-card .cm-copy span{display:none}
.color-card .cm-copy svg{width:16px;height:16px}
.color-card .cm-copy:hover{background:rgba(255,255,255,.07)}
.color-card .cm-copy.copied{background:linear-gradient(135deg,#7c4dff,#b46cff)!important;border-color:#a66cff!important;color:#fff!important;width:auto;min-width:86px;padding:0 10px}
.color-card .cm-copy.copied span{display:inline;font-size:12px}
.color-card .cm-copy{width:40px!important;height:40px!important;min-width:40px!important}
.color-card .cm-copy svg{width:21px!important;height:21px!important;flex:0 0 21px!important;stroke-width:1.8!important}
.color-card .cm-copy{width:44px!important;height:44px!important;min-width:44px!important;border-radius:10px!important}
.color-card .cm-copy svg{width:23px!important;height:23px!important;flex:0 0 23px!important}
.color-card .cm-copy.copied{width:auto!important;min-width:112px!important;height:44px!important;padding:0 15px!important;border-radius:10px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;white-space:nowrap!important}
.color-card .cm-copy.copied span{display:inline!important;font-size:14px!important;font-weight:650!important;line-height:1!important;white-space:nowrap!important}


/* v3.3 FINAL: exact Color Lab card/button CSS copied verbatim; preview remains video */
.color-card .cm-video-wrap{cursor:default}.color-image{width:100%;height:100%;object-fit:cover;display:block}.color-swatches{height:22px;display:grid;grid-template-columns:repeat(8,1fr);overflow:hidden}.color-swatches span{display:block}.color-card .cm-card-body{padding-top:12px}.color-card .cm-copy.copied{background:linear-gradient(135deg,#7c4dff,#b46cff)!important;border-color:#a66cff!important;color:#fff!important}.color-card .cm-play{display:none!important}
.color-card .cm-card-inner{background:#171a20}.color-card .cm-video-wrap{aspect-ratio:16/9}.color-card .cm-card-body{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px 13px}.color-card .cm-card-body h3{margin:0;font-size:16px;font-weight:520;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.color-card .cm-copy{width:34px;height:34px;min-width:34px;border:0;background:transparent;padding:0;border-radius:8px}.color-card .cm-copy span{display:none}.color-card .cm-copy svg{width:16px;height:16px}.color-card .cm-copy:hover{background:rgba(255,255,255,.07)}.color-card .cm-copy.copied{width:auto;min-width:86px;padding:0 10px}.color-card .cm-copy.copied span{display:inline;font-size:12px}.color-swatches{height:27px}
.color-card .cm-video-wrap{position:relative!important;}
.color-card .color-swatches{position:absolute!important;left:0!important;right:0!important;bottom:0!important;z-index:4!important;height:30px!important;display:grid!important;grid-template-columns:repeat(8,1fr)!important;overflow:hidden!important;box-shadow:0 -5px 14px rgba(0,0,0,.16)!important;}
.color-card .color-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;}
.color-card .cm-copy{width:40px!important;height:40px!important;min-width:40px!important;}
.color-card .cm-copy svg{width:21px!important;height:21px!important;flex:0 0 21px!important;stroke-width:1.8!important;}
.color-card .cm-copy{width:44px!important;height:44px!important;min-width:44px!important;border-radius:10px!important;}
.color-card .cm-copy svg{width:23px!important;height:23px!important;flex:0 0 23px!important;}
.color-card .cm-copy.copied{width:auto!important;min-width:112px!important;height:44px!important;padding:0 15px!important;border-radius:10px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;white-space:nowrap!important;}
.color-card .cm-copy.copied span{display:inline!important;font-size:14px!important;font-weight:650!important;line-height:1!important;white-space:nowrap!important;}

/* Camera Movement SEO FAQ */
