/* ===========================================================================
   Canada Create — universal motion + 3D components (v3, 2026-09-23)
   Loaded on every front-end page (blogs, service pages, landings) so the same
   standards apply everywhere:
     1. .cc-svc-glow  — stacking context only (the red glow layer was removed 17 Oct 2026)
     2. surfaces       — cards, price boxes, work items and tables lift on hover (no pointer tracking), border warms up
     3. .cc-reveal    — unveil on scroll (only when the script runs: .cc-js)
     4. Tables        — one universal comparison-table style, sealed corners,
                        no bottom gap, 3D wrap, row hover
     5. .cc-svc-inline-cta — the inline CTA box: copy left, button + toll-free
                        line right. Used twice per blog post.
   Reduced-motion and touch (hover:none) are respected throughout.
   ========================================================================= */

/* ---- 1. stacking context for banded sections (the red glow layer was removed 17 Oct 2026) ---- */
.cc-svc-glow{position:relative;isolation:isolate}
.cc-svc-glow>*{position:relative;z-index:1}
.cc-svc-glow--hero{overflow:hidden}


/* ---- 2. hover surfaces ----------------------------------------------------- */
.cc-svc-card,.cc-svc-price,.cc-svc-work__item,.cc-table-3d{transform:translateY(0);transition:transform .25s ease,box-shadow .3s ease,border-color .3s ease}



.cc-table-3d:hover{transform:translateY(-3px);box-shadow:0 28px 54px rgba(7,27,56,.16);border-color:#dde3f0}

/* ---- 3. scroll reveal --------------------------------------------------- */
.cc-js .cc-reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0)*70ms)}
.cc-js .cc-reveal.is-in{opacity:1;transform:none}
.cc-js .cc-svc-card.cc-reveal:not(.is-in),.cc-js .cc-table-3d.cc-reveal:not(.is-in){transform:translateY(22px)}
/* once revealed, the 3D transform takes over again */
.cc-js .cc-svc-card.cc-reveal.is-in,.cc-js .cc-svc-price.cc-reveal.is-in,.cc-js .cc-svc-work__item.cc-reveal.is-in,.cc-js .cc-table-3d.cc-reveal.is-in{transform:translateY(0)}

.cc-js .cc-table-3d.cc-reveal.is-in:hover{transform:translateY(-3px)}

/* ---- 4. tables: universal ---------------------------------------------- */
body[class] .cc-table-wrap{position:relative;isolation:isolate;margin:0;padding:0;border:1px solid #dde3f0;border-radius:14px;background:#fff;box-shadow:0 18px 40px rgba(7,27,56,.08),inset 0 1px 0 rgba(255,255,255,.9);overflow:hidden;box-sizing:border-box}
body[class] .cc-table-wrap::before{content:none;display:none}
body[class] .cc-table-wrap>table,body[class] .cc-table-wrap>.cc-table{margin:0!important;padding:0;width:100%;max-width:100%;border:0;border-collapse:collapse;border-spacing:0;box-shadow:none;background:transparent}
body[class] .cc-table th,body[class] .cc-table td{border:0;border-bottom:1px solid #dde3f0;background-clip:padding-box}
body[class] .cc-table th+th,body[class] .cc-table td+td,body[class] .cc-table th+td,body[class] .cc-table td+th{border-left:1px solid rgba(7,27,56,.08)}
body[class] .cc-table thead th{border-bottom:0;border-left-color:rgba(255,255,255,.14);color:#fff;background:var(--cc-midnight,#071b38)}
body[class] .cc-table thead th.cc-col-highlight{background:var(--cc-red,#e31507)}
body[class] .cc-table tbody tr:last-child>td,body[class] .cc-table tbody tr:last-child>th{border-bottom:0}
body[class] .cc-table tbody td:first-child,body[class] .cc-table tbody th:first-child,body[class] .cc-table tbody .cc-col-name{color:#222;font-weight:700;background:transparent}
body[class] .cc-table tbody tr:nth-child(even){background:var(--cc-paper,#f6f8fb)}
.cc-table tbody tr{transition:background .2s ease}
body[class] .cc-table tbody tr:hover{background:rgba(227,21,7,.045)}
body[class] .cc-table tbody tr:hover>td:first-child,body[class] .cc-table tbody tr:hover>th:first-child{color:var(--cc-red,#e31507)}
/* a CTA band that lives inside the wrap keeps the sealed corners */
body[class] .cc-table-wrap>.cc-table-cta{position:relative;z-index:1;margin:0;border-radius:0;border-top:1px solid rgba(255,255,255,.1)}
.cc-table-wrap+.cc-table-tabs{margin-top:14px}

/* ---- 5. inline CTA box (blogs + service pages) -------------------------- */











/* ---- responsive / accessibility ---------------------------------------- */

@media(hover:none){.cc-svc-card,.cc-svc-price,.cc-svc-work__item,.cc-table-3d{transform:none!important}}
@media(prefers-reduced-motion:reduce){.cc-js .cc-reveal{opacity:1;transform:none;transition:none}.cc-svc-card,.cc-svc-price,.cc-svc-work__item,.cc-table-3d{transition:none;transform:none!important}}