/* V154 campaign styles load after workpro_homepage.css. */
.hc-banner {
    --hc-mint:#8df4d1;
    --hc-deep:#082a3b;
    align-items:center;
    background:radial-gradient(ellipse at 84% -35%,rgba(70,219,220,.24),transparent 60%),linear-gradient(115deg,#102a46,#063e50);
    border:1px solid rgba(109,232,215,.25);
    border-radius:20px;
    box-shadow:0 12px 32px rgba(13,55,75,.10);
    color:#fff;
    display:flex;
    gap:22px;
    isolation:isolate;
    margin:9px auto 0;
    max-width:1320px;
    overflow:hidden;
    padding:24px 30px;
    position:relative;
}
.hc-banner::after { border:1px solid rgba(132,244,216,.18); border-radius:50%; content:""; height:235px; pointer-events:none; position:absolute; right:125px; top:-180px; width:235px; z-index:-1; }
.hc-banner--emerald { --hc-deep:#063d30; --hc-mint:#b1f7ce; background:radial-gradient(ellipse at 84% -35%,rgba(94,234,174,.24),transparent 60%),linear-gradient(115deg,#12382f,#075b49); }
.hc-banner--violet { --hc-deep:#30255a; --hc-mint:#e0d5ff; background:radial-gradient(ellipse at 84% -35%,rgba(192,150,255,.24),transparent 60%),linear-gradient(115deg,#222746,#4b397d); }
.hc-banner__art { height:100%; inset:0; object-fit:cover; opacity:.32; position:absolute; width:100%; z-index:-2; }
.hc-banner--image::before { background:linear-gradient(95deg,rgba(7,25,44,.93),rgba(7,25,44,.63)); content:""; inset:0; position:absolute; z-index:-1; }
.hc-banner__emblem { align-items:center; background:rgba(154,247,221,.09); border:1px solid rgba(154,247,221,.25); border-radius:17px; color:var(--hc-mint); display:flex; flex:0 0 57px; height:57px; justify-content:center; transform:rotate(-5deg); }
.hc-banner__emblem svg { height:34px; width:34px; }
.hc-banner__copy { flex:1 1 auto; min-width:0; }
.workpro-homepage .hc-banner__title { color:var(--hc-mint); font-size:clamp(20px,2.1vw,28px); font-weight:800; letter-spacing:-.02em; line-height:1.45; overflow-wrap:anywhere; }
.workpro-homepage .hc-banner__body { color:#e0edf3; font-size:14px; line-height:1.65; margin-top:4px; overflow-wrap:anywhere; }
.workpro-homepage .hc-banner__terms { color:#b9d8e1; font-size:11px; line-height:1.65; margin-top:7px; overflow-wrap:anywhere; }
.workpro-homepage a.hc-banner__button { align-items:center; background:var(--hc-mint); border:1px solid transparent; border-radius:12px; box-shadow:0 4px 14px rgba(0,0,0,.1); color:var(--hc-deep); display:inline-flex; flex:0 1 auto; font-size:14px; font-weight:800; gap:14px; justify-content:center; line-height:1.5; max-width:280px; padding:13px 19px; text-align:center; transition:background .2s,transform .2s; }
.hc-banner__button span { overflow-wrap:anywhere; }
.hc-banner__button svg { flex:0 0 20px; height:20px; width:20px; }
.workpro-homepage a.hc-banner__button:hover { background:#fff; color:var(--hc-deep); transform:translateY(-2px); }
.workpro-homepage a.hc-banner__button:focus-visible { outline-color:#fff; }

/* The real screens participate in flow, even in legacy background compositions. */
.workpro-homepage.hp-campaign-media-active .hp-hero {
    align-items:center;
    gap:clamp(25px,4vw,64px);
    grid-template-columns:minmax(0,.97fr) minmax(0,1.03fr);
    grid-template-rows:none;
    grid-auto-rows:auto;
    min-height:0;
    padding-bottom:50px;
    padding-top:42px;
}
.workpro-homepage.hp-campaign-media-active .hp-hero-visual { display:block; height:auto; inset:auto; margin:0 auto; max-width:100%; min-height:0; opacity:1; position:relative; transform:none; width:100%; z-index:2; }
.workpro-homepage.hp-campaign-media-active .hp-hero-visual::before,
.workpro-homepage.hp-campaign-media-active .hp-hero::before,
.workpro-homepage.hp-campaign-media-active .hp-hero::after { content:none; }
.workpro-homepage.hp-campaign-media-active .hp-hero h1 { font-size:clamp(36px,3.8vw,56px); }
.workpro-homepage.hp-campaign-media-active .hp-hero-copy { min-width:0; }
.workpro-homepage.hp-campaign-media-active.hp-layout-premium_trust .hp-hero,
.workpro-homepage.hp-campaign-media-active.hp-layout-compact_glass .hp-hero { margin-top:22px; padding:clamp(20px,3vw,38px); }
.workpro-homepage.hp-campaign-media-active.hp-layout-premium_trust .hp-hero-copy,
.workpro-homepage.hp-campaign-media-active.hp-layout-compact_glass .hp-hero-copy { padding:clamp(18px,2.5vw,32px); }
.workpro-homepage.hp-campaign-media-active.hp-layout-premium_trust .hp-feature-strip { margin-top:24px; }
.workpro-homepage.hp-campaign-layout.hp-single-screen:not(.hp-public-page).hp-campaign-banner-on .hp-hero,
.workpro-homepage.hp-campaign-layout.hp-single-screen:not(.hp-public-page).hp-campaign-media-active .hp-hero { min-height:0; }
.workpro-homepage.hp-campaign-layout.hp-single-screen:not(.hp-public-page).hp-campaign-banner-on,
.workpro-homepage.hp-campaign-layout.hp-single-screen:not(.hp-public-page).hp-campaign-media-active { height:auto; overflow-y:visible; padding-bottom:28px; }
.workpro-homepage.hp-campaign-has-video .hp-hero { grid-template-columns:minmax(0,1fr); gap:30px; }
.workpro-homepage.hp-campaign-has-video .hp-hero-copy { margin-left:auto; margin-right:auto; max-width:870px; text-align:center; width:100%; }
.workpro-homepage.hp-campaign-has-video .hp-hero h1,
.workpro-homepage.hp-campaign-has-video .hp-lead { margin-left:auto; margin-right:auto; max-width:850px; }
.workpro-homepage.hp-campaign-has-video .hp-eyebrow,
.workpro-homepage.hp-campaign-has-video .hp-hero-actions,
.workpro-homepage.hp-campaign-has-video .hp-hero-note { justify-content:center; }
.workpro-homepage.hp-campaign-has-video .hp-compact-features { margin-left:auto; margin-right:auto; max-width:700px; }

.hc-media { --hc-screen-width:440px; align-items:center; display:grid; gap:34px; grid-template-columns:minmax(0,1fr); margin:0 auto; max-width:100%; position:relative; width:100%; }
.hc-media--medium { --hc-screen-width:500px; }
.hc-media--large { --hc-screen-width:590px; }
.hc-media--video { gap:clamp(24px,4vw,48px); grid-template-columns:minmax(0,1.06fr) minmax(0,1fr); max-width:980px; }
.hc-media--video.hc-media--medium { max-width:1080px; }
.hc-media--video.hc-media--large { max-width:1220px; }
.hc-media--upload { column-gap:clamp(26px,6vw,80px); grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); max-width:850px; }
.hc-media--upload.hc-media--video-left { grid-template-columns:minmax(0,1fr) minmax(0,1.45fr); }
.hc-media--video-left .hc-video { grid-column:1; grid-row:1; }
.hc-media--video-left .hc-workspace { grid-column:2; grid-row:1; }
.hc-workspace, .hc-video { margin:0; min-width:0; width:100%; }
.hc-workspace { justify-self:center; max-width:var(--hc-screen-width); }
.hc-devices { aspect-ratio:1.37; isolation:isolate; padding-top:12px; position:relative; width:100%; }
.hc-devices::before { background:radial-gradient(ellipse,rgba(40,172,205,.19),transparent 68%); content:""; height:116%; left:-9%; position:absolute; top:-8%; width:117%; z-index:-1; }
.hc-tablet { background:linear-gradient(145deg,#2b3c51,#111e30); border:1px solid #4b5b6d; border-radius:21px; box-shadow:0 19px 39px rgba(10,31,51,.19),0 1px 0 rgba(255,255,255,.2) inset; padding:14px 9px 9px; position:relative; width:92%; }
.hc-tablet__camera { background:#6b7d8f; border:1px solid #0d1b2d; border-radius:50%; height:4px; left:50%; position:absolute; top:5px; width:4px; }
.hc-tablet__screen { aspect-ratio:1.44; background:#f3f7fb; border-radius:10px; overflow:hidden; }
.hc-tablet__screen img { display:block; height:100%; object-fit:cover; object-position:center top; width:100%; }
.hc-phone { background:linear-gradient(160deg,#3e4d5e,#142134); border:1px solid #657183; border-radius:23px; bottom:0; box-shadow:0 15px 30px rgba(8,25,45,.25),0 1px 0 rgba(255,255,255,.3) inset; padding:6px; position:absolute; right:0; width:27%; }
.hc-phone__screen { aspect-ratio:390 / 844; background:#f5f8fc; border-radius:17px; overflow:hidden; }
.hc-phone__screen img { display:block; height:100%; object-fit:cover; object-position:center top; width:100%; }
.hc-phone__camera { background:#152131; border-radius:0 0 6px 6px; height:5px; left:39%; position:absolute; top:6px; width:22%; z-index:1; }
.workpro-homepage .hc-workspace__caption { align-items:center; color:var(--hp-muted,#61718a); display:flex; font-size:11px; gap:7px; justify-content:center; line-height:1.6; margin-top:17px; text-align:center; }
.hc-workspace__caption > span { background:#16a780; border-radius:50%; box-shadow:0 0 0 3px rgba(22,167,128,.10); flex:0 0 5px; height:5px; width:5px; }
.hc-original { background:rgba(127,151,179,.1); border:1px solid var(--hp-line,#dbe7f2); border-radius:20px; overflow:hidden; }
.hc-original img { display:block; height:auto; max-height:400px; object-fit:contain; width:100%; }
.hc-video__player { aspect-ratio:16 / 9; background:#0c2036; border:1px solid rgba(114,178,195,.36); border-radius:20px; box-shadow:0 19px 40px rgba(10,31,51,.16); isolation:isolate; overflow:hidden; position:relative; width:100%; }
.hc-video__load { align-items:center; background:radial-gradient(ellipse at 105% -10%,rgba(73,229,220,.22),transparent 68%),linear-gradient(135deg,#152c45,#092134); border:0; color:#effaff; cursor:pointer; display:flex; flex-direction:column; height:100%; justify-content:center; margin:0; padding:23px; position:absolute; width:100%; }
.hc-video__load::after { border:1px solid rgba(118,240,218,.15); border-radius:50%; content:""; height:230px; pointer-events:none; position:absolute; right:-155px; top:-100px; width:230px; }
.hc-video__brand { align-items:center; color:#edfaff; display:flex; font-size:15px; font-weight:800; gap:10px; left:20px; letter-spacing:-.02em; position:absolute; top:16px; }
.hc-video__brand > span { border-left:1px solid #5d7a88; color:#a9c3d0; font-size:6px; font-weight:600; letter-spacing:.13em; padding-left:10px; }
.hc-video__play { align-items:center; background:#a6f2dd; border:1px solid rgba(255,255,255,.3); border-radius:50%; box-shadow:0 0 0 9px rgba(123,232,206,.08); color:#103347; display:flex; height:50px; justify-content:center; margin-top:18px; transition:background .2s,transform .2s; width:50px; }
.hc-video__play svg { height:23px; margin-left:-3px; width:23px; }
.hc-video__load:hover .hc-video__play { background:#fff; transform:scale(1.06); }
.workpro-homepage .hc-video__load:focus-visible { outline:3px solid #9ff6dd; outline-offset:-6px; }
.hc-video__prompt { font-size:12px; font-weight:700; line-height:1.6; margin-top:17px; }
.hc-video__provider { bottom:13px; color:#a8bdc9; font-size:10px; font-weight:600; position:absolute; right:18px; }
.hc-video__player iframe, .hc-video__player video { border:0; display:block; height:100%; inset:0; position:absolute; width:100%; }
.hc-video__player video { object-fit:contain; }
.hc-media--upload .hc-video { justify-self:center; max-width:225px; }
.hc-video__player--upload { aspect-ratio:9 / 16; }
.workpro-homepage .hc-video__privacy { color:var(--hp-muted,#61718a); font-size:10px; line-height:1.6; margin:10px 4px 0; text-align:center; }
.hc-video__caption { color:var(--hp-ink,#10243f); font-size:13px; font-weight:700; line-height:1.6; margin-top:10px; text-align:center; }
.workpro-homepage .hc-video__noscript { color:var(--hp-muted,#61718a); font-size:12px; line-height:1.6; margin:12px 0; }
.workpro-homepage .hc-video__noscript a { text-decoration:underline; }
.workpro-homepage.hp-layout-premium_trust .hc-workspace__caption,
.workpro-homepage.hp-layout-premium_trust .hc-video__privacy,
.workpro-homepage.hp-layout-premium_trust .hc-video__noscript { color:#bfccdb; }
.workpro-homepage.hp-layout-premium_trust .hc-video__caption { color:#f1f6fc; }

@media (max-width:980px) {
    .workpro-homepage.hp-campaign-media-active .hp-hero { gap:28px; grid-template-columns:minmax(0,1fr); }
    .workpro-homepage.hp-campaign-media-active .hp-hero-copy { margin-left:auto; margin-right:auto; max-width:760px; }
    .workpro-homepage.hp-campaign-media-active .hp-hero-visual { max-width:800px; }
    .hc-banner { gap:16px; padding:22px; }
    .hc-banner__emblem { flex-basis:47px; height:47px; }
    .hc-banner__emblem svg { height:29px; width:29px; }
    .workpro-homepage .hc-banner__body { font-size:13px; }
}
@media (max-width:640px) {
    .hc-banner { align-items:flex-start; border-radius:16px; flex-wrap:wrap; gap:13px; margin-top:3px; padding:20px; }
    .hc-banner__emblem { border-radius:12px; flex-basis:36px; height:36px; margin-top:4px; }
    .hc-banner__emblem svg { height:24px; width:24px; }
    .hc-banner__copy { flex-basis:calc(100% - 49px); }
    .workpro-homepage .hc-banner__title { font-size:21px; line-height:1.45; }
    .workpro-homepage .hc-banner__body { font-size:12px; margin-top:6px; }
    .workpro-homepage a.hc-banner__button { margin-top:2px; max-width:none; min-height:44px; padding:10px 16px; width:100%; }
    .workpro-homepage.hp-campaign-media-active .hp-hero { gap:24px; padding-bottom:32px; padding-top:30px; }
    .workpro-homepage.hp-campaign-media-active .hp-hero h1 { font-size:clamp(32px,8.8vw,43px); }
    .workpro-homepage.hp-campaign-media-active.hp-layout-premium_trust .hp-hero,
    .workpro-homepage.hp-campaign-media-active.hp-layout-compact_glass .hp-hero { padding:16px 12px 24px; }
    .workpro-homepage.hp-campaign-media-active.hp-layout-premium_trust .hp-hero-copy,
    .workpro-homepage.hp-campaign-media-active.hp-layout-compact_glass .hp-hero-copy { padding:22px 14px; }
    .hc-media { --hc-screen-width:380px; gap:28px; }
    .hc-media--medium { --hc-screen-width:420px; }
    .hc-media--large { --hc-screen-width:460px; }
    .hc-media--video { grid-template-columns:minmax(0,1fr); }
    .hc-media--upload.hc-media--video-left { grid-template-columns:minmax(0,1fr); }
    .hc-media--video-left .hc-video, .hc-media--video-left .hc-workspace { grid-column:auto; grid-row:auto; }
    .hc-media--video-left .hc-video { order:-1; }
    .hc-video { justify-self:center; max-width:460px; }
    .hc-tablet { border-radius:16px; padding:11px 7px 7px; }
    .hc-tablet__camera { top:4px; }
    .hc-tablet__screen { border-radius:8px; }
    .hc-phone { border-radius:18px; padding:4px; }
    .hc-phone__screen { border-radius:14px; }
    .hc-phone__camera { top:4px; }
    .hc-workspace__caption { font-size:10px; }
    .hc-video__player { border-radius:16px; }
}
@media (prefers-reduced-motion:reduce) {
    .hc-banner__button, .hc-video__play { transition:none !important; }
}
/* Website-entry QR: in flow, separate from all payment UI and readable in every theme. */
.workpro-homepage .hp-website-entry-qr { display:flex; align-items:center; gap:12px; width:fit-content; max-width:100%; box-sizing:border-box; margin:18px 0 0; padding:8px 16px 8px 8px; border:1px solid #dce8f2; border-radius:18px; background:#fff; color:#102b46; text-align:left; }
.workpro-homepage .hp-website-entry-qr-image { flex:0 0 132px; width:132px; height:132px; border-radius:10px; overflow:hidden; background:#fff; }
.workpro-homepage .hp-website-entry-qr-image img { display:block; width:132px; height:132px; max-width:none; object-fit:contain; }
.workpro-homepage .hp-website-entry-qr > div { min-width:0; }
.workpro-homepage .hp-website-entry-qr strong { display:block; font-size:14px; line-height:1.5; }
.workpro-homepage .hp-website-entry-qr p { margin:5px 0; color:#53667a; font-size:12px; line-height:1.5; }
.workpro-homepage .hp-website-entry-qr > div > a { color:#00669c; font-size:13px; font-weight:700; text-decoration:underline; }
.workpro-homepage .hp-website-entry-qr a:focus-visible { outline:3px solid #008abe; outline-offset:3px; }
.workpro-homepage.hp-layout-modern_tech .hp-website-entry-qr,
.workpro-homepage.hp-layout-premium_trust .hp-website-entry-qr,
.workpro-homepage.hp-layout-compact_tech .hp-website-entry-qr,
.workpro-homepage.hp-layout-compact_glass .hp-website-entry-qr,
.workpro-homepage.hp-campaign-has-video .hp-website-entry-qr { margin-left:auto; margin-right:auto; }
@media (max-width:575.98px) {
    .workpro-homepage .hp-website-entry-qr { gap:8px; padding:6px 12px 6px 6px; }
    .workpro-homepage .hp-website-entry-qr-image,
    .workpro-homepage .hp-website-entry-qr-image img { width:99px; height:99px; }
    .workpro-homepage .hp-website-entry-qr-image { flex-basis:99px; }
}

/* Independent video slots share one gallery beside the workspace preview. */
.hc-media.hc-media--two-videos { column-gap:clamp(24px,3vw,40px); grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); max-width:1120px; }
.hc-media.hc-media--two-videos.hc-media--compact { max-width:980px; }
.hc-media.hc-media--two-videos.hc-media--large { max-width:1220px; }
.hc-media.hc-media--two-videos.hc-media--video-left { grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); }
.hc-video-gallery { align-items:start; display:grid; gap:20px; grid-template-columns:repeat(2,minmax(0,1fr)); min-width:0; width:100%; }
.hc-media--two-videos .hc-video-gallery { grid-column:2; grid-row:1; }
.hc-media--two-videos.hc-media--video-left .hc-video-gallery { grid-column:1; }
.hc-media--two-videos .hc-video-gallery > .hc-video { grid-column:auto; grid-row:auto; justify-self:center; max-width:225px; order:0; }
@media (max-width:980px) {
    .hc-media.hc-media--two-videos,
    .hc-media.hc-media--two-videos.hc-media--video-left { grid-template-columns:minmax(0,1fr); }
    .hc-media--two-videos .hc-workspace,
    .hc-media--two-videos .hc-video-gallery { grid-column:1; grid-row:auto; }
    .hc-media--two-videos .hc-video-gallery { justify-self:center; max-width:500px; }
}
@media (max-width:640px) {
    .hc-media--two-videos.hc-media--video-left .hc-video-gallery { order:-1; }
}
@media (max-width:575.98px) {
    .hc-video-gallery { gap:24px; grid-template-columns:minmax(0,1fr); }
}