/* ==========================================================
   T.K ELECTRIC — HEADER
   BRAND COLORS
   ========================================================== */

:root {
    --tk-black: #111111;
    --tk-near-black: #101010;
    --tk-charcoal: #1A1A1A;
    --tk-deep-black: #141414;
    --tk-yellow: #FFCD00;
    --tk-yellow-hover: #FFE047;
    --tk-white: #FFFFFF;
    --tk-grey: #C8C8C8;
}


/* ==========================================================
   MAIN HEADER
   ========================================================== */

#sp-header {
    background: #111111 !important;
    height: 105px !important;
    min-height: 105px !important;

    border-bottom: 3px solid #FFCD00 !important;

    box-shadow: 0 5px 18px rgba(0,0,0,.35) !important;

    position: relative;
    z-index: 9999;
}


/* Header containers */

#sp-header .container,
#sp-header .container-inner,
#sp-header .row {
    height: 105px !important;
    min-height: 105px !important;
    align-items: center !important;
}


/* ==========================================================
   LOGO
   ========================================================== */

#sp-header .logo {
    display: flex;
    align-items: center;
}

#sp-header .logo-image {
    max-height: 82px;
    width: auto;
}


/* ==========================================================
   DESKTOP MAIN MENU
   ========================================================== */

#sp-menu {
    background: transparent !important;
}


/* Menu items */

#sp-header .sp-megamenu-parent > li {
    margin: 0 2px !important;
}


/* Menu links */

#sp-header .sp-megamenu-parent > li > a {
    color: #FFFFFF !important;

    padding: 10px 14px !important;

    font-weight: 500;

    transition:
        color .2s ease,
        background-color .2s ease;
}


/* Hover */

#sp-header .sp-megamenu-parent > li:hover > a,
#sp-header .sp-megamenu-parent > li > a:hover {
    color: #FFCD00 !important;
}


/* Active / current */

#sp-header .sp-megamenu-parent > li.active > a,
#sp-header .sp-megamenu-parent > li.current > a,
#sp-header .sp-megamenu-parent > li.current-item > a {
    color: #FFCD00 !important;
}


/* Active hover */

#sp-header .sp-megamenu-parent > li.active:hover > a,
#sp-header .sp-megamenu-parent > li.current:hover > a,
#sp-header .sp-megamenu-parent > li.current-item:hover > a {
    color: #FFE047 !important;
}


/* ==========================================================
   DROPDOWN MENUS
   ========================================================== */

#sp-header .sp-dropdown {
    background: #1A1A1A !important;

    border: 1px solid rgba(255,205,0,.25) !important;

    border-top: 3px solid #FFCD00 !important;

    box-shadow: 0 12px 30px rgba(0,0,0,.45) !important;
}


#sp-header .sp-dropdown-inner {
    background: #1A1A1A !important;
}


/* Dropdown links */

#sp-header .sp-dropdown li > a {
    color: #FFFFFF !important;

    background: #1A1A1A !important;

    padding: 10px 16px !important;

    transition:
        color .2s ease,
        background-color .2s ease;
}


/* Dropdown hover */

#sp-header .sp-dropdown li:hover > a,
#sp-header .sp-dropdown li > a:hover {
    color: #FFCD00 !important;

    background: #1A1A1A !important;
}


/* Dropdown active */

#sp-header .sp-dropdown li.active > a,
#sp-header .sp-dropdown li.current > a {
    color: #FFCD00 !important;

    background: #1A1A1A !important;
}


/* ==========================================================
   DROPDOWN ARROWS
   ========================================================== */

#sp-header .sp-menu-item.sp-has-child > a::after {
    color: #FFCD00 !important;
}


#sp-header .sp-menu-item.sp-has-child:hover > a::after {
    color: #FFE047 !important;
}


/* ==========================================================
   LOGIN / REGISTER AREA
   ========================================================== */

#sp-menu-right {
    background: transparent !important;
}


#sp-header .estate-top-login {
    background: transparent !important;
}


/* Login button */

#sp-header .sp-custom-login a,
#sp-header .sp-mod-login a {
    color: #FFFFFF !important;

    border: 1px solid rgba(255,205,0,.55) !important;

    background: transparent !important;

    padding: 9px 16px !important;

    transition:
        color .2s ease,
        background-color .2s ease,
        border-color .2s ease;
}


/* Login hover */

#sp-header .sp-custom-login a:hover,
#sp-header .sp-mod-login a:hover {
    color: #141414 !important;

    background: #FFCD00 !important;

    border-color: #FFCD00 !important;
}


/* Login icon */

#sp-header .sp-custom-login i,
#sp-header .sp-mod-login i {
    color: #FFCD00 !important;

    margin-right: 6px;
}


#sp-header .sp-custom-login a:hover i,
#sp-header .sp-mod-login a:hover i {
    color: #141414 !important;
}


/* ==========================================================
   ALL HEADER ICONS
   ========================================================== */

#sp-header i,
#sp-header svg {
    color: #FFFFFF !important;
}


#sp-header a:hover i,
#sp-header a:hover svg {
    color: #FFCD00 !important;
}


/* ==========================================================
   MOBILE HAMBURGER
   ========================================================== */

#offcanvas-toggler {
    color: #FFFFFF !important;

    background: transparent !important;
}


#offcanvas-toggler .burger-icon {
    color: #FFFFFF !important;
}


#offcanvas-toggler .burger-icon > span {
    background-color: #FFFFFF !important;

    transition:
        background-color .2s ease,
        transform .2s ease;
}


/* Hamburger hover */

#offcanvas-toggler:hover .burger-icon > span {
    background-color: #FFCD00 !important;
}


/* ==========================================================
   MOBILE OFFCANVAS MENU
   ========================================================== */

.offcanvas-menu {
    background: #101010 !important;

    border-left: 3px solid #FFCD00 !important;
}


.offcanvas-menu .offcanvas-inner {
    background: #101010 !important;
}


/* Mobile menu links */

.offcanvas-menu .menu > li > a,
.offcanvas-menu .menu ul li > a {
    color: #FFFFFF !important;

    background: #101010 !important;

    border-bottom: 1px solid rgba(200,200,200,.15) !important;

    transition:
        color .2s ease,
        background-color .2s ease;
}


/* Mobile hover */

.offcanvas-menu .menu > li > a:hover,
.offcanvas-menu .menu ul li > a:hover {
    color: #141414 !important;

    background: #FFCD00 !important;
}


/* Mobile active */

.offcanvas-menu .menu li.active > a,
.offcanvas-menu .menu li.current > a {
    color: #141414 !important;

    background: #FFCD00 !important;
}


/* ==========================================================
   MOBILE MENU ARROWS
   ========================================================== */

.offcanvas-menu .menu-toggler,
.offcanvas-menu .menu-toggler::before,
.offcanvas-menu .menu-toggler::after {
    color: #FFFFFF !important;
}


.offcanvas-menu .menu-toggler:hover,
.offcanvas-menu .menu-toggler:hover::before,
.offcanvas-menu .menu-toggler:hover::after {
    color: #FFCD00 !important;
}


/* ==========================================================
   MOBILE CLOSE BUTTON
   ========================================================== */

.offcanvas-menu .close-offcanvas {
    color: #FFFFFF !important;
}


.offcanvas-menu .close-offcanvas:hover {
    color: #FFCD00 !important;
}


.offcanvas-menu .close-offcanvas .burger-icon > span {
    background-color: #FFFFFF !important;
}


.offcanvas-menu .close-offcanvas:hover .burger-icon > span {
    background-color: #FFCD00 !important;
}


/* ==========================================================
   HEADER LINKS — REMOVE DEFAULT BLUE/PURPLE
   ========================================================== */

#sp-header a {
    text-decoration: none !important;
}


/* ==========================================================
   MOBILE HEADER
   ========================================================== */

@media (max-width: 991.98px) {

    #sp-header {
        height: 85px !important;
        min-height: 85px !important;
    }

    #sp-header .container,
    #sp-header .container-inner,
    #sp-header .row {
        height: 85px !important;
        min-height: 85px !important;
    }

    #sp-header .logo-image {
        max-height: 68px;
    }

}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 575.98px) {

    #sp-header {
        height: 75px !important;
        min-height: 75px !important;
    }

    #sp-header .container,
    #sp-header .container-inner,
    #sp-header .row {
        height: 75px !important;
        min-height: 75px !important;
    }

    #sp-header .logo-image {
        max-height: 60px;
    }

}

/* ==========================================================================
   SECTION 2 — CONTACT US2 | HELIX NATIVE CONTACT FORM + BELOW-FORM PANEL
   Scope: itemid-530 only
   ========================================================================== */

body.itemid-530 #sp-section-1,body.itemid-530 #sp-section-1 .container,body.itemid-530 #sp-section-1 .row,body.itemid-530 #sp-title,body.itemid-530 #sp-title .sp-column {margin:0 !important;padding:0 !important;max-width:none !important;width:100% !important;}
body.itemid-530 #sp-section-1 {background:#101010 !important;}
body.itemid-530 #sp-main-body {padding:clamp(54px,8vw,118px) 0 0 !important;background:#101010 !important;}
body.itemid-530 #sp-main-body > .container,body.itemid-530 #sp-main-body .container {max-width:1110px !important;padding-left:5% !important;padding-right:5% !important;box-sizing:border-box;}
body.itemid-530 #sp-component,body.itemid-530 #sp-component .sp-column {padding:0 !important;}
body.itemid-530 #sp-component .com-contact {padding:clamp(35px,5vw,78px) !important;background:#1a1a1a !important;color:#ffffff !important;box-shadow:0 28px 64px rgba(0,0,0,.34);box-sizing:border-box;}
body.itemid-530 #sp-component .page-header {margin:0 0 44px !important;padding:0 0 24px !important;border-bottom:1px solid rgba(255,205,0,.56) !important;}
body.itemid-530 #sp-component .page-header h1 {margin:0 !important;color:#ffcd00 !important;font-family:Arial,Helvetica,sans-serif !important;font-size:12px !important;line-height:1.2 !important;font-weight:900 !important;letter-spacing:3.5px !important;text-transform:uppercase !important;}
body.itemid-530 #sp-component .com-contact h2 {margin:0 0 22px !important;color:#ffffff !important;font-family:Arial,Helvetica,sans-serif !important;font-size:clamp(28px,3.7vw,49px) !important;line-height:1 !important;font-weight:900 !important;letter-spacing:-1.7px !important;}
body.itemid-530 #sp-component .com-contact__container {margin:0 0 48px !important;}
body.itemid-530 #sp-component .com-contact__info {display:none !important;}
body.itemid-530 #sp-component .contact-form,body.itemid-530 #sp-component #contact-form {margin:0 !important;padding:0 !important;border:0 !important;background:transparent !important;box-shadow:none !important;}
body.itemid-530 #sp-component #contact-form fieldset {margin:0 !important;padding:0 !important;border:0 !important;}
body.itemid-530 #sp-component #contact-form legend {width:100% !important;margin:0 0 30px !important;padding:0 0 16px !important;border:0 !important;border-bottom:1px solid rgba(255,205,0,.5) !important;color:#ffcd00 !important;font-family:Arial,Helvetica,sans-serif !important;font-size:12px !important;line-height:1.2 !important;font-weight:900 !important;letter-spacing:3px !important;text-transform:uppercase !important;}
body.itemid-530 #sp-component #contact-form .control-group,body.itemid-530 #sp-component #contact-form .form-group {margin:0 0 22px !important;}
body.itemid-530 #sp-component #contact-form .control-group.field-spacer,body.itemid-530 #sp-component #contact-form .form-group.field-spacer {margin:0 0 25px !important;}
body.itemid-530 #sp-component #contact-form .control-group.field-spacer .controls,body.itemid-530 #sp-component #contact-form .form-group.field-spacer .controls {display:none !important;}
body.itemid-530 #sp-component #contact-form .control-label,body.itemid-530 #sp-component #contact-form .form-label {float:none !important;width:auto !important;margin:0 0 9px !important;text-align:left !important;}
body.itemid-530 #sp-component #contact-form .controls {margin-left:0 !important;}
body.itemid-530 #sp-component #contact-form label {color:#ffffff !important;font-family:Arial,Helvetica,sans-serif !important;font-size:13px !important;line-height:1.25 !important;font-weight:800 !important;letter-spacing:1.5px !important;text-transform:uppercase !important;}
body.itemid-530 #sp-component #contact-form .red,body.itemid-530 #sp-component #contact-form .star {color:#ffcd00 !important;}
body.itemid-530 #sp-component #contact-form .form-control {display:block !important;width:100% !important;min-height:56px !important;padding:15px 17px !important;border:1px solid rgba(255,255,255,.28) !important;border-radius:0 !important;background:#101010 !important;color:#ffffff !important;font-family:Arial,Helvetica,sans-serif !important;font-size:17px !important;box-shadow:none !important;box-sizing:border-box !important;transition:border-color .25s ease,background-color .25s ease,box-shadow .25s ease !important;}
body.itemid-530 #sp-component #contact-form textarea.form-control {min-height:190px !important;resize:vertical !important;}
body.itemid-530 #sp-component #contact-form .form-control:focus {border-color:#ffcd00 !important;background:#151515 !important;box-shadow:0 0 0 3px rgba(255,205,0,.13) !important;outline:0 !important;}
body.itemid-530 #sp-component #contact-form .form-check {display:flex !important;align-items:center !important;min-height:28px !important;}
body.itemid-530 #sp-component #contact-form .form-check-input {position:static !important;width:18px !important;height:18px !important;margin:0 !important;border-color:#ffcd00 !important;border-radius:0 !important;background:#101010 !important;box-shadow:none !important;}
body.itemid-530 #sp-component #contact-form .form-check-input:checked {background-color:#ffcd00 !important;}
body.itemid-530 #sp-component #contact-form .btn.btn-primary {display:inline-block !important;margin-top:8px !important;padding:19px 34px !important;border:0 !important;border-radius:0 !important;background:#ffcd00 !important;color:#141414 !important;font-family:Arial,Helvetica,sans-serif !important;font-size:14px !important;line-height:1.1 !important;font-weight:900 !important;letter-spacing:2px !important;text-transform:uppercase !important;box-shadow:none !important;transition:transform .25s ease,background-color .25s ease !important;}
body.itemid-530 #sp-component #contact-form .btn.btn-primary:hover {background:#ffe047 !important;transform:translateY(-3px) !important;}

/* Makes the footer1 module immediately below the Contact component, full width, on Contact Us2 only. */
body.itemid-530 #sp-footer,body.itemid-530 #sp-footer .container,body.itemid-530 #sp-footer .row,body.itemid-530 #sp-footer .sp-column,body.itemid-530 #sp-footer1 {margin:0 !important;padding:0 !important;max-width:none !important;width:100% !important;background:#ffcd00 !important;}
#tk-contact-us2-helix-header .tk-contact-us2-header-image {transition:transform .65s ease;}
#tk-contact-us2-helix-header:hover .tk-contact-us2-header-image {transform:scale(1.012);}
#tk-contact-us2-after-form .tk-contact-us2-after-form-cable {transition:transform .3s ease,box-shadow .3s ease;}
#tk-contact-us2-after-form .tk-contact-us2-after-form-cable:hover {transform:translateY(-4px);box-shadow:0 14px 25px rgba(20,20,20,.2);}
#tk-contact-us2-after-form .tk-contact-us2-after-form-call {transition:transform .25s ease,background-color .25s ease,box-shadow .25s ease;}
#tk-contact-us2-after-form .tk-contact-us2-after-form-call:hover {transform:translateY(-3px);background:#252525 !important;box-shadow:0 14px 25px rgba(20,20,20,.25);}

@media (max-width:760px) {
  body.itemid-530 #sp-main-body {padding:48px 0 0 !important;}
  body.itemid-530 #sp-main-body > .container,body.itemid-530 #sp-main-body .container {padding-left:5% !important;padding-right:5% !important;}
  body.itemid-530 #sp-component .com-contact {padding:32px 24px !important;}
  body.itemid-530 #sp-component #contact-form .btn.btn-primary:hover,#tk-contact-us2-helix-header:hover .tk-contact-us2-header-image,#tk-contact-us2-after-form .tk-contact-us2-after-form-cable:hover,#tk-contact-us2-after-form .tk-contact-us2-after-form-call:hover {transform:none !important;}
}
@media (prefers-reduced-motion:reduce) {
  body.itemid-530 * {transition:none !important;}
}

/* Hide only the Contact h2 shown above Contact Form. Do not hide its parent row or the form. */
body.itemid-530 #sp-component .com-contact.contact > .row > .col > h2:first-child {display:none !important;}



/* ==========================================================================
   SECTION 3 — PROJECTS | STABLE BACKGROUND + NO ANIMATIONS
   Scope: itemid-529 only
   ========================================================================== */

   Replace the previous Projects CSS with this full file.
   ========================================================== */

/* Full-width stable Projects canvas */
body.itemid-529 #sp-main-body,
body.itemid-529 #sp-main-body > .container,
body.itemid-529 #sp-main-body .container,
body.itemid-529 #sp-component,
body.itemid-529 #sp-component .sp-column {
    background: #101010 !important;
}

body.itemid-529 #sp-main-body {
    margin: 0 !important;
    padding: 0 !important;
}

body.itemid-529 #sp-main-body > .container,
body.itemid-529 #sp-main-body .container {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
}

/* Projects article: one calm black background. */
body.itemid-529 #tk-projects-premium,
body.itemid-529 #tk-projects-premium .tk-projects-title,
body.itemid-529 #tk-projects-premium section {
    background: #101010 !important;
}

/* Remove every automatic animation, sweep, shine, hover lift, zoom, and filter. */
body.itemid-529 #tk-projects-premium *,
body.itemid-529 #tk-projects-premium *::before,
body.itemid-529 #tk-projects-premium *::after {
    animation: none !important;
    transition: none !important;
}

body.itemid-529 #tk-projects-premium .tk-projects-title::after,
body.itemid-529 #tk-projects-premium .tk-projects-item::after {
    content: none !important;
    display: none !important;
}

/* Keep all photographs at their natural proportions with a quiet shadow only. */
body.itemid-529 #tk-projects-premium .tk-projects-gallery {
    column-count: 3;
    column-gap: clamp(14px, 2vw, 28px);
}

body.itemid-529 #tk-projects-premium .tk-projects-item {
    display: inline-block;
    width: 100%;
    vertical-align: top;
    break-inside: avoid;
    margin: 0 0 clamp(14px, 2vw, 28px);
    overflow: hidden;
    background: transparent !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .24);
    transform: none !important;
}

body.itemid-529 #tk-projects-premium .tk-projects-item img {
    display: block;
    width: 100%;
    height: auto;
    filter: none !important;
    transform: none !important;
}

body.itemid-529 #tk-projects-premium .tk-projects-item:hover,
body.itemid-529 #tk-projects-premium .tk-projects-item:hover img {
    filter: none !important;
    transform: none !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .24);
}

@media (max-width: 760px) {
    body.itemid-529 #tk-projects-premium .tk-projects-gallery {
        column-count: 2;
        column-gap: 14px;
    }

    body.itemid-529 #tk-projects-premium .tk-projects-item {
        margin-bottom: 14px;
    }
}


/* ==========================================================================
   END OF T.K ELECTRIC HELIX MASTER CSS
   ========================================================================== */

/* ========================================================================== 
   T.K ELECTRIC — PREMIUM FOOTER
   Paste at the END of Template Custom CSS.
   ========================================================================== */

#tk-footer-premium .tk-footer-link,
#tk-footer-premium .tk-footer-call {
    transition: color .25s ease, transform .25s ease;
}

#tk-footer-premium .tk-footer-link:hover,
#tk-footer-premium .tk-footer-call:hover {
    color: #ffcd00 !important;
    transform: translateX(6px);
}

#tk-footer-premium .tk-footer-main > div:first-child img {
    transition: transform .35s ease, filter .35s ease;
}

#tk-footer-premium .tk-footer-main > div:first-child a:hover img {
    transform: translateY(-4px);
    filter: drop-shadow(0 10px 16px rgba(0,0,0,.3));
}

@media (max-width: 760px) {
    #tk-footer-premium .tk-footer-main {
        gap: 34px !important;
    }

    #tk-footer-premium .tk-footer-main > div {
        flex-basis: 100% !important;
    }

    #tk-footer-premium .tk-footer-bottom {
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }

    #tk-footer-premium .tk-footer-link:hover,
    #tk-footer-premium .tk-footer-call:hover,
    #tk-footer-premium .tk-footer-main > div:first-child a:hover img {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    #tk-footer-premium *,
    #tk-footer-premium *::before,
    #tk-footer-premium *::after {
        transition: none !important;
    }
}

/* Existing Mastercard and Visa links restored from the live footer. */
#tk-footer-premium .tk-footer-payment {
    transition: transform .22s ease, opacity .22s ease;
}

#tk-footer-premium .tk-footer-payment:hover {
    transform: translateY(-3px);
    opacity: .82;
}

@media (max-width: 760px) {
    #tk-footer-premium .tk-footer-payments {
        width: 100%;
    }

    #tk-footer-premium .tk-footer-payment:hover {
        transform: none;
    }
}

/* ========================================================================== 
   T.K ELECTRIC — ALL REBUILT HELIX ARTICLE PAGES
   REMOVE WHITE TEMPLATE GAP + EMPTY ARTICLE CONTROLS

   Covers ALL Helix article pages automatically, including the dropdown pages:
   Hire Us, FAQ's, Electrical Upgrading, and Custom Electrical Works.
   Does NOT affect Gantry pages.

   Paste at the very END of Helix Template Custom CSS.
   Replace the earlier itemid-only white-space CSS with this file.
   ========================================================================== */

/* Every Helix Joomla article page: remove the default 100px white canvas gap. */
body.helix-ultimate.com_content.view-article #sp-main-body {
    margin: 0 !important;
    padding: 0 !important;
    background: #101010 !important;
}

body.helix-ultimate.com_content.view-article #sp-main-body > .container,
body.helix-ultimate.com_content.view-article #sp-main-body > .container > .container-inner {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Remove only Helix's empty article-control strip: Edit and share icons. */
body.helix-ultimate.com_content.view-article .article-can-edit,
body.helix-ultimate.com_content.view-article .article-ratings-social-share {
    display: none !important;
}

/* Keep the Contact Us2 component canvas dark without touching its active title/footer modules. */
body.helix-ultimate.com_contact.view-contact #sp-main-body {
    background: #101010 !important;
}

body.helix-ultimate.com_contact.view-contact .article-can-edit,
body.helix-ultimate.com_contact.view-contact .article-ratings-social-share {
    display: none !important;
}

/* ========================================================================== 
   T.K ELECTRIC — PROJECTS | REFINED EDITORIAL GALLERY
   Paste at the very end of Helix Template Custom CSS.
   This replaces the earlier Projects gallery CSS.
   ========================================================================== */

#tk-projects-refined .tk-projects-refined-feature {
    box-shadow: 0 26px 62px rgba(0,0,0,.34);
}

#tk-projects-refined .tk-projects-refined-feature img,
#tk-projects-refined .tk-projects-refined-card img {
    display: block;
    width: 100%;
    height: auto;
}

#tk-projects-refined .tk-projects-refined-card {
    position: relative;
    overflow: hidden;
    border-top: 2px solid rgba(255,205,0,.92);
    box-shadow: 0 16px 34px rgba(0,0,0,.28);
    transition: box-shadow .32s ease, border-color .32s ease;
}

#tk-projects-refined .tk-projects-refined-card:hover {
    border-color: #ffffff;
    box-shadow: 0 23px 44px rgba(0,0,0,.42);
}

/* Do not crop, zoom, filter, or auto-animate any supplied project photograph. */
#tk-projects-refined img {
    object-fit: contain !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
}

@media (max-width: 820px) {
    #tk-projects-refined .tk-projects-refined-columns {
        flex-wrap: wrap !important;
    }

    #tk-projects-refined .tk-projects-refined-column {
        flex: 1 1 calc(50% - 14px) !important;
    }

    #tk-projects-refined .tk-projects-refined-column:nth-child(3) {
        padding-top: 0 !important;
    }
}

@media (max-width: 580px) {
    #tk-projects-refined .tk-projects-refined-columns {
        display: block !important;
    }

    #tk-projects-refined .tk-projects-refined-column,
    #tk-projects-refined .tk-projects-refined-column:nth-child(2),
    #tk-projects-refined .tk-projects-refined-column:nth-child(3) {
        display: flex !important;
        padding-top: 0 !important;
        margin: 0 0 14px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #tk-projects-refined .tk-projects-refined-card {
        transition: none !important;
    }
}

/* ========================================================================== 
   T.K ELECTRIC — PROJECTS | ALIGNED GALLERY
   Paste at the very end of Helix Template Custom CSS.
   This replaces the earlier Projects gallery CSS.
   ========================================================================== */

#tk-projects-aligned .tk-projects-aligned-grid {
    align-items: stretch;
}

#tk-projects-aligned .tk-projects-aligned-card {
    position: relative;
    min-width: 0;
    min-height: 0;
    border-top: 2px solid rgba(255,205,0,.9);
    box-shadow: 0 16px 34px rgba(0,0,0,.28);
    transition: border-color .28s ease, box-shadow .28s ease;
}

#tk-projects-aligned .tk-projects-aligned-card:hover {
    border-color: #ffffff;
    box-shadow: 0 22px 42px rgba(0,0,0,.42);
}

#tk-projects-aligned .tk-projects-aligned-card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: none !important;
    filter: none !important;
    animation: none !important;
}

#tk-projects-aligned .tk-projects-aligned-lead {
    box-shadow: 0 25px 58px rgba(0,0,0,.42);
}

@media (max-width: 900px) {
    #tk-projects-aligned .tk-projects-aligned-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-auto-rows: clamp(150px, 37vw, 270px) !important;
    }

    #tk-projects-aligned .tk-projects-aligned-lead {
        grid-column: span 2 !important;
        grid-row: span 2 !important;
    }
}

@media (max-width: 560px) {
    #tk-projects-aligned .tk-projects-aligned-grid {
        grid-template-columns: 1fr !important;
        grid-auto-rows: auto !important;
        gap: 12px !important;
    }

    #tk-projects-aligned .tk-projects-aligned-card,
    #tk-projects-aligned .tk-projects-aligned-lead,
    #tk-projects-aligned .tk-projects-aligned-wide {
        grid-column: auto !important;
        grid-row: auto !important;
        aspect-ratio: 1 / .82;
    }
}

@media (prefers-reduced-motion: reduce) {
    #tk-projects-aligned .tk-projects-aligned-card {
        transition: none !important;
    }
}

/* ==========================================================================
   RESTORED PAGE ANIMATIONS — ORIGINAL PAGE-SPECIFIC FILES
   ========================================================================== */



/* ---------- HOMEPAGE ---------- */
/* T.K ELECTRIC HOMEPAGE — LUXURY MOTION CSS V2
   Replace the previous TK homepage motion CSS with this entire file.
   Paste in Template Custom CSS, not in JCE. */

#tk-premium-home {
  position: relative;
}

/* Hero: slow cinematic lighting and a moving gold current */
#tk-premium-home .tk-premium-hero {
  isolation: isolate;
  overflow: hidden;
  background-position: center center !important;
}

#tk-premium-home .tk-premium-hero::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(118deg, transparent 18%, rgba(255,205,0,.15) 45%, transparent 58%);
  transform: translateX(-125%);
  animation: tkElectricSweep 8.5s ease-in-out infinite;
}

#tk-premium-home .tk-premium-hero::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  right: 12%;
  width: 1px;
  height: 100%;
  background: linear-gradient(transparent, rgba(255,205,0,.85), transparent);
  box-shadow: 0 0 22px rgba(255,205,0,.7);
  opacity: .58;
  animation: tkCurrentPulse 3.2s ease-in-out infinite;
}

#tk-premium-home .tk-premium-hero > * {
  position: relative;
  z-index: 1;
}

#tk-premium-home .tk-premium-reveal {
  animation: tkPremiumRise .9s cubic-bezier(.2,.75,.25,1) both;
}

#tk-premium-home .tk-premium-accent {
  animation: tkPremiumLine 1.2s .22s cubic-bezier(.2,.75,.25,1) both, tkAccentGlow 2.7s 1.3s ease-in-out infinite;
  transform-origin: left center;
}

#tk-premium-home .tk-premium-button,
#tk-premium-home .tk-premium-tile,
#tk-premium-home .tk-premium-text-link {
  transition: transform .42s cubic-bezier(.2,.8,.2,1), box-shadow .42s ease, background-color .38s ease, color .38s ease, opacity .38s ease;
}

#tk-premium-home .tk-premium-button:hover {
  background-color: #ffffff !important;
  color: #171717 !important;
  box-shadow: 0 14px 40px rgba(0,0,0,.42), 0 0 0 7px rgba(255,205,0,.13);
  transform: translateY(-5px) scale(1.025);
}

/* Feature: luxurious frame, subtle pulse and sequential service reveals */
#tk-premium-home .tk-premium-feature-frame {
  position: relative;
  overflow: hidden;
  border-top: 4px solid #ffcd00;
  transition: box-shadow .5s ease, transform .5s cubic-bezier(.2,.8,.2,1);
}

#tk-premium-home .tk-premium-feature-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border: 1px solid rgba(255,205,0,.2);
  animation: tkBorderBreath 4s ease-in-out infinite;
}

#tk-premium-home .tk-premium-feature-frame:hover {
  box-shadow: 0 35px 84px rgba(0,0,0,.19) !important;
  transform: translateY(-7px);
}

#tk-premium-home .tk-premium-feature-dark::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: -45%;
  left: -58%;
  width: 65%;
  height: 185%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,205,0,.13), transparent);
  transform: rotate(19deg) translateX(-150%);
  animation: tkFeatureSweep 9s ease-in-out infinite;
}

#tk-premium-home .tk-premium-service-row {
  position: relative;
  overflow: hidden;
  animation: tkServiceIn .7s cubic-bezier(.2,.75,.25,1) both;
  transition: background-color .35s ease, transform .35s cubic-bezier(.2,.8,.2,1), padding-left .35s ease;
}

#tk-premium-home .tk-premium-service-row:nth-child(2) { animation-delay: .12s; }
#tk-premium-home .tk-premium-service-row:nth-child(3) { animation-delay: .24s; }

#tk-premium-home .tk-premium-service-row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #ffcd00;
  transform: scaleY(0);
  transform-origin: center;
  transition: transform .35s ease;
}

#tk-premium-home .tk-premium-service-row:hover {
  background-color: rgba(255,205,0,.14);
  padding-left: 16px !important;
  transform: translateX(5px);
}

#tk-premium-home .tk-premium-service-row:hover::before { transform: scaleY(1); }

/* Image pathways: 3D lift, sweeping gold reflection and slow image zoom */
#tk-premium-home .tk-premium-tile {
  isolation: isolate;
  transform-style: preserve-3d;
}

#tk-premium-home .tk-premium-tile::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: -20%;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 37%, rgba(255,255,255,.42) 48%, rgba(255,205,0,.3) 52%, transparent 63%);
  transform: translateX(-135%) skewX(-14deg);
  transition: transform .8s cubic-bezier(.18,.78,.22,1);
}

#tk-premium-home .tk-premium-tile img {
  transition: transform 1.05s cubic-bezier(.2,.75,.25,1), opacity .45s ease, filter .45s ease;
}

#tk-premium-home .tk-premium-tile:hover {
  box-shadow: 0 26px 48px rgba(0,0,0,.31);
  transform: translateY(-11px) perspective(850px) rotateX(2deg);
  z-index: 3;
}

#tk-premium-home .tk-premium-tile:hover::after {
  transform: translateX(135%) skewX(-14deg);
}

#tk-premium-home .tk-premium-tile:hover img {
  transform: scale(1.11);
  filter: saturate(1.14) contrast(1.04);
  opacity: .98 !important;
}

#tk-premium-home .tk-premium-text-link:hover {
  border-bottom-color: transparent !important;
  transform: translateX(8px);
}

/* Testimonials: discreet changing depth, not a generic static band */
#tk-premium-home .tk-premium-testimonial {
  position: relative;
  overflow: hidden;
}

#tk-premium-home .tk-premium-testimonial::before {
  content: "";
  position: absolute;
  z-index: 0;
  width: 38vw;
  height: 38vw;
  max-width: 560px;
  max-height: 560px;
  right: -12vw;
  top: -26vw;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 50%;
  box-shadow: 0 0 0 35px rgba(255,255,255,.08), 0 0 0 70px rgba(0,0,0,.035);
  animation: tkOrbit 13s linear infinite;
}

#tk-premium-home .tk-premium-testimonial > * { position: relative; z-index: 1; }

@keyframes tkPremiumRise {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes tkPremiumLine {
  from { opacity: 0; transform: scaleX(0); }
  to { opacity: 1; transform: scaleX(1); }
}

@keyframes tkElectricSweep {
  0%, 17% { transform: translateX(-125%); opacity: 0; }
  28% { opacity: 1; }
  52%, 100% { transform: translateX(145%); opacity: 0; }
}

@keyframes tkCurrentPulse {
  0%, 100% { opacity: .22; transform: scaleY(.72); }
  50% { opacity: .9; transform: scaleY(1); }
}

@keyframes tkAccentGlow {
  0%, 100% { box-shadow: 0 0 0 rgba(255,205,0,0); }
  50% { box-shadow: 0 0 18px rgba(255,205,0,.7); }
}

@keyframes tkBorderBreath {
  0%, 100% { opacity: .18; }
  50% { opacity: .72; }
}

@keyframes tkFeatureSweep {
  0%, 20% { transform: rotate(19deg) translateX(-150%); }
  48%, 100% { transform: rotate(19deg) translateX(470%); }
}

@keyframes tkServiceIn {
  from { opacity: 0; transform: translateX(26px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes tkOrbit {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@media (max-width: 760px) {
  #tk-premium-home .tk-premium-hero {
    min-height: 530px !important;
    background-position: 58% center !important;
  }

  #tk-premium-home .tk-premium-hero::after { right: 7%; }

  #tk-premium-home .tk-premium-feature-frame:hover,
  #tk-premium-home .tk-premium-tile:hover {
    transform: none;
  }

  #tk-premium-home .tk-premium-service-row:hover {
    padding-left: 0 !important;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  #tk-premium-home *,
  #tk-premium-home *::before,
  #tk-premium-home *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}


/* ---------- ABOUT US ---------- */
/* T.K ELECTRIC ABOUT US — DARK EDITORIAL MOTION CSS
   Replace the prior About Us CSS with this entire file.
   Paste in Template Custom CSS, not in JCE. */

#tk-about-dark { position:relative; }

#tk-about-dark .tk-dark-title-canvas::after {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:linear-gradient(116deg,transparent 22%,rgba(255,205,0,.14) 48%,transparent 61%);
  transform:translateX(-135%);
  animation:tkDarkSweep 9.5s ease-in-out infinite;
}

#tk-about-dark .tk-dark-title-canvas > * { position:relative;z-index:1; }

#tk-about-dark .tk-dark-kicker,
#tk-about-dark .tk-dark-title,
#tk-about-dark .tk-dark-rule {
  animation:tkDarkRise .9s cubic-bezier(.2,.75,.25,1) both;
}

#tk-about-dark .tk-dark-title { animation-delay:.08s; }
#tk-about-dark .tk-dark-rule { animation-delay:.17s;transform-origin:left center;animation-name:tkDarkLine;animation-duration:1.15s; }

#tk-about-dark .tk-dark-image-strip {
  transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s ease;
}

#tk-about-dark .tk-dark-image-strip::after {
  content:"";
  position:absolute;
  z-index:3;
  inset:-18%;
  pointer-events:none;
  background:linear-gradient(112deg,transparent 39%,rgba(255,205,0,.3) 48%,rgba(255,255,255,.27) 52%,transparent 61%);
  transform:translateX(-135%) skewX(-13deg);
  animation:tkDarkImageSweep 9s ease-in-out infinite;
}

#tk-about-dark .tk-dark-image-strip img { transition:transform 1.15s cubic-bezier(.2,.75,.25,1),filter .55s ease; }
#tk-about-dark .tk-dark-image-strip:hover { transform:translateY(-7px);box-shadow:0 28px 58px rgba(0,0,0,.42); }
#tk-about-dark .tk-dark-image-strip:hover img { transform:scale(1.045);filter:saturate(1.12) contrast(1.05); }

#tk-about-dark .tk-dark-10 { transition:background-color .4s ease,transform .4s cubic-bezier(.2,.8,.2,1); }
#tk-about-dark .tk-dark-10:hover { background:#ffffff !important;transform:scale(1.02); }

#tk-about-dark .tk-dark-principle {
  overflow:hidden;
  animation:tkDarkListIn .72s cubic-bezier(.2,.75,.25,1) both;
  transition:padding-left .35s ease,background-color .35s ease,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;
}

#tk-about-dark .tk-dark-principle:nth-child(2) { animation-delay:.1s; }
#tk-about-dark .tk-dark-principle:nth-child(3) { animation-delay:.2s; }
#tk-about-dark .tk-dark-principle:nth-child(4) { animation-delay:.3s; }

#tk-about-dark .tk-dark-principle::before {
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;width:5px;
  background:#ffcd00;
  transform:scaleY(0);transform-origin:center;
  transition:transform .35s ease;
}

#tk-about-dark .tk-dark-principle:hover { background:#2a2a2a !important;padding-left:5.5% !important;transform:translateX(5px);box-shadow:inset 0 0 0 1px rgba(255,205,0,.16); }
#tk-about-dark .tk-dark-principle:hover::before { transform:scaleY(1); }

#tk-about-dark .tk-dark-contact { position:relative;overflow:hidden;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease; }
#tk-about-dark .tk-dark-contact::after { content:"";position:absolute;width:330px;height:330px;right:-105px;top:-190px;border:1px solid rgba(0,0,0,.3);border-radius:50%;box-shadow:0 0 0 30px rgba(255,255,255,.08),0 0 0 60px rgba(0,0,0,.04);animation:tkDarkOrbit 14s linear infinite; }
#tk-about-dark .tk-dark-contact > * { position:relative;z-index:1; }
#tk-about-dark .tk-dark-contact:hover { transform:translateY(-5px);box-shadow:0 22px 48px rgba(0,0,0,.35); }

#tk-about-dark .tk-dark-contact-button { transition:transform .4s cubic-bezier(.2,.8,.2,1),background-color .35s ease,color .35s ease,box-shadow .35s ease; }
#tk-about-dark .tk-dark-contact-button:hover { background:#ffffff !important;color:#171717 !important;transform:translateY(-4px) scale(1.025);box-shadow:0 12px 28px rgba(0,0,0,.25); }

@keyframes tkDarkRise { from {opacity:0;transform:translateY(27px);} to {opacity:1;transform:translateY(0);} }
@keyframes tkDarkLine { from {opacity:0;transform:scaleX(0);} to {opacity:1;transform:scaleX(1);} }
@keyframes tkDarkSweep { 0%,19% {transform:translateX(-135%);opacity:0;} 31% {opacity:1;} 54%,100% {transform:translateX(145%);opacity:0;} }
@keyframes tkDarkImageSweep { 0%,20% {transform:translateX(-135%) skewX(-13deg);} 49%,100% {transform:translateX(145%) skewX(-13deg);} }
@keyframes tkDarkListIn { from {opacity:0;transform:translateX(-23px);} to {opacity:1;transform:translateX(0);} }
@keyframes tkDarkOrbit { from {transform:rotate(0deg);} to {transform:rotate(360deg);} }

@media (max-width:760px) {
  #tk-about-dark .tk-dark-image-strip:hover,#tk-about-dark .tk-dark-contact:hover { transform:none; }
  #tk-about-dark .tk-dark-principle:hover {padding-left:4% !important;transform:none;}
}

@media (prefers-reduced-motion:reduce) {
  #tk-about-dark *,#tk-about-dark *::before,#tk-about-dark *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}


/* ---------- HIRE US ---------- */
/* T.K ELECTRIC HIRE US — PREMIUM MOTION CSS
   Paste this entire file at the END of Template Custom CSS.
   Do not place this CSS inside JCE. */

#tk-hire-premium .tk-hire-banner {
  isolation:isolate;
}

#tk-hire-premium .tk-hire-banner::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:linear-gradient(116deg,transparent 22%,rgba(255,205,0,.16) 47%,transparent 61%);
  transform:translateX(-135%);
  animation:tkHireSweep 9s ease-in-out infinite;
}

#tk-hire-premium .tk-hire-banner > * { position:relative;z-index:1; }

#tk-hire-premium .tk-hire-kicker,
#tk-hire-premium .tk-hire-title {
  animation:tkHireRise .85s cubic-bezier(.2,.75,.25,1) both;
}
#tk-hire-premium .tk-hire-title { animation-delay:.1s; }

#tk-hire-premium .tk-hire-intro {
  border-top:1px solid rgba(255,255,255,.14);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease;
}
#tk-hire-premium .tk-hire-intro:hover { transform:translateY(-6px);box-shadow:0 25px 52px rgba(0,0,0,.32); }

#tk-hire-premium .tk-hire-call,
#tk-hire-premium .tk-hire-dark-button {
  transition:transform .4s cubic-bezier(.2,.8,.2,1),background-color .35s ease,color .35s ease,box-shadow .35s ease;
}
#tk-hire-premium .tk-hire-call:hover { background:#ffcd00 !important;color:#171717 !important;transform:translateY(-4px) scale(1.025);box-shadow:0 11px 28px rgba(0,0,0,.28); }

#tk-hire-premium .tk-hire-item {
  overflow:hidden;
  animation:tkHireItemIn .7s cubic-bezier(.2,.75,.25,1) both;
  transition:background-color .35s ease,transform .35s cubic-bezier(.2,.8,.2,1),padding-left .35s ease,box-shadow .35s ease;
}
#tk-hire-premium .tk-hire-item:nth-child(2) { animation-delay:.08s; }
#tk-hire-premium .tk-hire-item:nth-child(3) { animation-delay:.16s; }
#tk-hire-premium .tk-hire-item:nth-child(4) { animation-delay:.24s; }
#tk-hire-premium .tk-hire-item:nth-child(5) { animation-delay:.32s; }
#tk-hire-premium .tk-hire-item:nth-child(6) { animation-delay:.4s; }
#tk-hire-premium .tk-hire-item:nth-child(7) { animation-delay:.48s; }
#tk-hire-premium .tk-hire-item:nth-child(8) { animation-delay:.56s; }

#tk-hire-premium .tk-hire-item::before {
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;width:5px;
  background:#ffcd00;
  transform:scaleY(0);transform-origin:center;
  transition:transform .35s ease;
}
#tk-hire-premium .tk-hire-item:hover { background:#2a2a2a !important;padding-left:44px !important;transform:translateY(-5px);box-shadow:inset 0 0 0 1px rgba(255,205,0,.15); }
#tk-hire-premium .tk-hire-item:hover::before { transform:scaleY(1); }

#tk-hire-premium .tk-hire-location {
  position:relative;overflow:hidden;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease;
}
#tk-hire-premium .tk-hire-location::after {
  content:"";
  position:absolute;
  width:330px;height:330px;
  right:-110px;top:-185px;
  border:1px solid rgba(0,0,0,.3);border-radius:50%;
  box-shadow:0 0 0 30px rgba(255,255,255,.08),0 0 0 60px rgba(0,0,0,.04);
  animation:tkHireOrbit 14s linear infinite;
}
#tk-hire-premium .tk-hire-location > * { position:relative;z-index:1; }
#tk-hire-premium .tk-hire-location:hover { transform:translateY(-5px);box-shadow:0 22px 48px rgba(0,0,0,.32); }
#tk-hire-premium .tk-hire-dark-button:hover { background:#ffffff !important;color:#171717 !important;transform:translateY(-4px) scale(1.025);box-shadow:0 12px 28px rgba(0,0,0,.25); }

@keyframes tkHireRise { from {opacity:0;transform:translateY(26px);} to {opacity:1;transform:translateY(0);} }
@keyframes tkHireSweep { 0%,18% {transform:translateX(-135%);opacity:0;} 30% {opacity:1;} 54%,100% {transform:translateX(145%);opacity:0;} }
@keyframes tkHireItemIn { from {opacity:0;transform:translateY(22px);} to {opacity:1;transform:translateY(0);} }
@keyframes tkHireOrbit { from {transform:rotate(0deg);} to {transform:rotate(360deg);} }

@media (max-width:760px) {
  #tk-hire-premium .tk-hire-intro:hover,#tk-hire-premium .tk-hire-location:hover {transform:none;}
  #tk-hire-premium .tk-hire-item:hover {padding-left:31px !important;transform:none;}
}

@media (prefers-reduced-motion:reduce) {
  #tk-hire-premium *,#tk-hire-premium *::before,#tk-hire-premium *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}


/* ---------- FAQS ---------- */
/* T.K ELECTRIC FAQ'S — PREMIUM MOTION CSS
   Paste this entire file at the END of Template Custom CSS.
   The FAQ expands through native <details>/<summary>, so it remains functional without JavaScript. */

#tk-faq-premium .tk-faq-title-canvas::after {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 21%,rgba(255,205,0,.17) 47%,transparent 61%);
  transform:translateX(-135%);
  animation:tkFaqSweep 9s ease-in-out infinite;
}
#tk-faq-premium .tk-faq-title-canvas > * { position:relative;z-index:1; }
#tk-faq-premium .tk-faq-title,
#tk-faq-premium .tk-faq-title-line { animation:tkFaqRise .85s cubic-bezier(.2,.75,.25,1) both; }
#tk-faq-premium .tk-faq-title-line { animation-delay:.16s;transform-origin:left center;animation-name:tkFaqLine;animation-duration:1.1s; }

#tk-faq-premium .tk-faq-image { transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s ease; }
#tk-faq-premium .tk-faq-image::after { content:"";position:absolute;z-index:3;inset:-18%;pointer-events:none;background:linear-gradient(112deg,transparent 39%,rgba(255,205,0,.3) 48%,rgba(255,255,255,.22) 52%,transparent 61%);transform:translateX(-135%) skewX(-13deg);animation:tkFaqImageSweep 9.5s ease-in-out infinite; }
#tk-faq-premium .tk-faq-image img { transition:transform 1.1s cubic-bezier(.2,.75,.25,1),filter .55s ease; }
#tk-faq-premium .tk-faq-image:hover { transform:translateY(-6px);box-shadow:0 25px 50px rgba(0,0,0,.36); }
#tk-faq-premium .tk-faq-image:hover img { transform:scale(1.04);filter:saturate(1.12) contrast(1.04); }

#tk-faq-premium .tk-faq-item { overflow:hidden;animation:tkFaqItemIn .7s cubic-bezier(.2,.75,.25,1) both;transition:background-color .35s ease,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease; }
#tk-faq-premium .tk-faq-item:nth-child(2) { animation-delay:.07s; }
#tk-faq-premium .tk-faq-item:nth-child(3) { animation-delay:.14s; }
#tk-faq-premium .tk-faq-item:nth-child(4) { animation-delay:.21s; }
#tk-faq-premium .tk-faq-item:nth-child(5) { animation-delay:.28s; }
#tk-faq-premium .tk-faq-item:nth-child(6) { animation-delay:.35s; }
#tk-faq-premium .tk-faq-item:nth-child(7) { animation-delay:.42s; }
#tk-faq-premium .tk-faq-item:nth-child(8) { animation-delay:.49s; }

#tk-faq-premium .tk-faq-item summary::-webkit-details-marker { display:none; }
#tk-faq-premium .tk-faq-item summary span:last-child { transition:transform .35s cubic-bezier(.2,.8,.2,1),color .35s ease; }
#tk-faq-premium .tk-faq-item:hover { background:#2a2a2a !important;transform:translateX(6px);box-shadow:inset 5px 0 0 #ffcd00; }
#tk-faq-premium .tk-faq-item[open] { background:#28240f !important;box-shadow:inset 5px 0 0 #ffcd00; }
#tk-faq-premium .tk-faq-item[open] summary span:last-child { transform:rotate(45deg);color:#ffffff !important; }
#tk-faq-premium .tk-faq-item[open] .tk-faq-answer { animation:tkFaqAnswer .38s ease both; }

@keyframes tkFaqRise { from {opacity:0;transform:translateY(26px);} to {opacity:1;transform:translateY(0);} }
@keyframes tkFaqLine { from {opacity:0;transform:scaleX(0);} to {opacity:1;transform:scaleX(1);} }
@keyframes tkFaqSweep { 0%,18% {transform:translateX(-135%);opacity:0;} 30% {opacity:1;} 54%,100% {transform:translateX(145%);opacity:0;} }
@keyframes tkFaqImageSweep { 0%,20% {transform:translateX(-135%) skewX(-13deg);} 49%,100% {transform:translateX(145%) skewX(-13deg);} }
@keyframes tkFaqItemIn { from {opacity:0;transform:translateY(22px);} to {opacity:1;transform:translateY(0);} }
@keyframes tkFaqAnswer { from {opacity:0;transform:translateY(-8px);} to {opacity:1;transform:translateY(0);} }

@media (max-width:760px) { #tk-faq-premium .tk-faq-image:hover {transform:none;} #tk-faq-premium .tk-faq-item:hover {transform:none;} }
@media (prefers-reduced-motion:reduce) { #tk-faq-premium *,#tk-faq-premium *::before,#tk-faq-premium *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;} }


/* ---------- SERVICES ---------- */
/* T.K ELECTRIC SERVICES — PREMIUM MOTION CSS
   Paste this entire file at the END of Template Custom CSS. */

#tk-services-premium .tk-services-title-canvas::after {
  content:"";position:absolute;z-index:0;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 22%,rgba(255,205,0,.16) 47%,transparent 61%);
  transform:translateX(-135%);animation:tkServicesSweep 9s ease-in-out infinite;
}
#tk-services-premium .tk-services-title-canvas > * {position:relative;z-index:1;}
#tk-services-premium .tk-services-title,
#tk-services-premium .tk-services-title-line {animation:tkServicesRise .85s cubic-bezier(.2,.75,.25,1) both;}
#tk-services-premium .tk-services-title-line {animation-delay:.16s;transform-origin:left center;animation-name:tkServicesLine;animation-duration:1.1s;}

#tk-services-premium .tk-services-image {overflow:hidden;transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s ease;}
#tk-services-premium .tk-services-image::after {content:"";position:absolute;z-index:3;inset:-18%;pointer-events:none;background:linear-gradient(112deg,transparent 39%,rgba(255,205,0,.3) 48%,rgba(255,255,255,.22) 52%,transparent 61%);transform:translateX(-135%) skewX(-13deg);animation:tkServicesImageSweep 9.4s ease-in-out infinite;}
#tk-services-premium .tk-services-image img {transition:transform 1.05s cubic-bezier(.2,.75,.25,1),filter .55s ease;}
#tk-services-premium .tk-services-image:hover {transform:scale(1.012);box-shadow:0 25px 50px rgba(0,0,0,.36);}
#tk-services-premium .tk-services-image:hover img {transform:scale(1.05);filter:saturate(1.1) contrast(1.04);}

#tk-services-premium .tk-services-catalogue-item {position:relative;overflow:hidden;animation:tkServicesItemIn .7s cubic-bezier(.2,.75,.25,1) both;transition:background-color .35s ease,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;}
#tk-services-premium .tk-services-catalogue-item:nth-child(2) {animation-delay:.06s;}
#tk-services-premium .tk-services-catalogue-item:nth-child(3) {animation-delay:.12s;}
#tk-services-premium .tk-services-catalogue-item:nth-child(4) {animation-delay:.18s;}
#tk-services-premium .tk-services-catalogue-item:nth-child(5) {animation-delay:.24s;}
#tk-services-premium .tk-services-catalogue-item:nth-child(6) {animation-delay:.30s;}
#tk-services-premium .tk-services-catalogue-item:nth-child(7) {animation-delay:.36s;}
#tk-services-premium .tk-services-catalogue-item:nth-child(8) {animation-delay:.42s;}
#tk-services-premium .tk-services-catalogue-item:nth-child(9) {animation-delay:.48s;}
#tk-services-premium .tk-services-catalogue-item:hover {background:#2b2b2b !important;transform:translateY(-5px);box-shadow:inset 0 0 0 1px rgba(255,205,0,.28);}
#tk-services-premium .tk-services-catalogue-item:last-child:hover {background:#ffffff !important;}

#tk-services-premium .tk-services-original {position:relative;overflow:hidden;transition:background-color .35s ease,transform .35s cubic-bezier(.2,.8,.2,1),padding-left .35s ease,box-shadow .35s ease;}
#tk-services-premium .tk-services-original::before {content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:#ffcd00;transform:scaleY(0);transform-origin:center;transition:transform .35s ease;}
#tk-services-premium .tk-services-original:hover {background:#2a2a2a !important;padding-left:42px !important;transform:translateX(5px);box-shadow:inset 0 0 0 1px rgba(255,205,0,.16);}
#tk-services-premium .tk-services-original:hover::before {transform:scaleY(1);}

#tk-services-premium .tk-services-contact {position:relative;overflow:hidden;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease;}
#tk-services-premium .tk-services-contact::after {content:"";position:absolute;width:330px;height:330px;right:-110px;top:-185px;border:1px solid rgba(0,0,0,.3);border-radius:50%;box-shadow:0 0 0 30px rgba(255,255,255,.08),0 0 0 60px rgba(0,0,0,.04);animation:tkServicesOrbit 14s linear infinite;}
#tk-services-premium .tk-services-contact > * {position:relative;z-index:1;}
#tk-services-premium .tk-services-contact:hover {transform:translateY(-5px);box-shadow:0 22px 48px rgba(0,0,0,.32);}
#tk-services-premium .tk-services-call {transition:transform .4s cubic-bezier(.2,.8,.2,1),background-color .35s ease,color .35s ease,box-shadow .35s ease;}
#tk-services-premium .tk-services-call:hover {background:#ffffff !important;color:#171717 !important;transform:translateY(-4px) scale(1.025);box-shadow:0 12px 28px rgba(0,0,0,.25);}

@keyframes tkServicesRise {from {opacity:0;transform:translateY(26px);}to {opacity:1;transform:translateY(0);}}
@keyframes tkServicesLine {from {opacity:0;transform:scaleX(0);}to {opacity:1;transform:scaleX(1);}}
@keyframes tkServicesSweep {0%,18% {transform:translateX(-135%);opacity:0;}30% {opacity:1;}54%,100% {transform:translateX(145%);opacity:0;}}
@keyframes tkServicesImageSweep {0%,20% {transform:translateX(-135%) skewX(-13deg);}49%,100% {transform:translateX(145%) skewX(-13deg);}}
@keyframes tkServicesItemIn {from {opacity:0;transform:translateY(20px);}to {opacity:1;transform:translateY(0);}}
@keyframes tkServicesOrbit {from {transform:rotate(0deg);}to {transform:rotate(360deg);}}

/* Equal-height image/catalogue composition on wide screens. */
@media (min-width:960px) {
  #tk-services-premium .tk-services-image {
    height:616px !important;
    min-height:0 !important;
  }
  #tk-services-premium .tk-services-image img {
    height:616px !important;
    min-height:0 !important;
  }
  #tk-services-premium .tk-services-image + div {
    align-content:flex-start !important;
  }
}

@media (max-width:760px) {#tk-services-premium .tk-services-image:hover,#tk-services-premium .tk-services-contact:hover {transform:none;}#tk-services-premium .tk-services-original:hover {padding-left:31px !important;transform:none;}}
@media (prefers-reduced-motion:reduce) {#tk-services-premium *,#tk-services-premium *::before,#tk-services-premium *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}}


/* ---------- ELECTRICAL UPGRADING ---------- */
/* T.K ELECTRIC — ELECTRICAL UPGRADING PREMIUM MOTION CSS
   Paste this entire file at the END of Template Custom CSS. */

#tk-upgrading-premium .tk-upgrade-title-canvas::after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(118deg,transparent 24%,rgba(255,205,0,.16) 46%,transparent 61%);transform:translateX(-140%);animation:tkUpgradeSweep 9s ease-in-out infinite;}
#tk-upgrading-premium .tk-upgrade-title-canvas > * {position:relative;z-index:1;}
#tk-upgrading-premium .tk-upgrade-title {animation:tkUpgradeRise .9s cubic-bezier(.2,.75,.25,1) both;}
#tk-upgrading-premium .tk-upgrade-title-rule {animation:tkUpgradeLine 1.2s cubic-bezier(.2,.75,.25,1) .17s both;transform-origin:left center;}

#tk-upgrading-premium .tk-upgrade-story {box-shadow:0 28px 60px rgba(0,0,0,.34);}
#tk-upgrading-premium .tk-upgrade-copy {transition:background-color .4s ease,transform .45s cubic-bezier(.2,.8,.2,1);}
#tk-upgrading-premium .tk-upgrade-copy:hover {background:#252525 !important;transform:translateX(5px);}
#tk-upgrading-premium .tk-upgrade-image {transition:box-shadow .5s ease;}
#tk-upgrading-premium .tk-upgrade-image::before {content:"";position:absolute;z-index:2;inset:-18%;pointer-events:none;background:linear-gradient(112deg,transparent 40%,rgba(255,205,0,.32) 48%,rgba(255,255,255,.16) 52%,transparent 60%);transform:translateX(-140%) skewX(-13deg);animation:tkUpgradeImageSweep 9.5s ease-in-out infinite;}
#tk-upgrading-premium .tk-upgrade-image img {transition:transform 1s cubic-bezier(.2,.75,.25,1),filter .55s ease;}
#tk-upgrading-premium .tk-upgrade-image:hover {box-shadow:0 22px 52px rgba(0,0,0,.42);}
#tk-upgrading-premium .tk-upgrade-image:hover img {transform:scale(1.055);filter:saturate(1.08) contrast(1.04);}

#tk-upgrading-premium .tk-upgrade-sign {position:relative;overflow:hidden;animation:tkUpgradeSignIn .65s cubic-bezier(.2,.75,.25,1) both;transition:background-color .35s ease,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;}
#tk-upgrading-premium .tk-upgrade-sign:nth-child(2) {animation-delay:.05s;}
#tk-upgrading-premium .tk-upgrade-sign:nth-child(3) {animation-delay:.10s;}
#tk-upgrading-premium .tk-upgrade-sign:nth-child(4) {animation-delay:.15s;}
#tk-upgrading-premium .tk-upgrade-sign:nth-child(5) {animation-delay:.20s;}
#tk-upgrading-premium .tk-upgrade-sign:nth-child(6) {animation-delay:.25s;}
#tk-upgrading-premium .tk-upgrade-sign:nth-child(7) {animation-delay:.30s;}
#tk-upgrading-premium .tk-upgrade-sign:nth-child(8) {animation-delay:.35s;}
#tk-upgrading-premium .tk-upgrade-sign:nth-child(9) {animation-delay:.40s;}
#tk-upgrading-premium .tk-upgrade-sign::after {content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:#ffcd00;transform:scaleX(0);transform-origin:left center;transition:transform .35s ease;}
#tk-upgrading-premium .tk-upgrade-sign:hover {background:#2a2a2a !important;transform:translateY(-5px);box-shadow:inset 0 0 0 1px rgba(255,205,0,.28);}
#tk-upgrading-premium .tk-upgrade-sign:hover::after {transform:scaleX(1);}

@keyframes tkUpgradeRise {from {opacity:0;transform:translateY(28px);}to {opacity:1;transform:translateY(0);}}
@keyframes tkUpgradeLine {from {opacity:0;transform:scaleX(0);}to {opacity:1;transform:scaleX(1);}}
@keyframes tkUpgradeSweep {0%,18% {transform:translateX(-140%);opacity:0;}31% {opacity:1;}55%,100% {transform:translateX(145%);opacity:0;}}
@keyframes tkUpgradeImageSweep {0%,20% {transform:translateX(-140%) skewX(-13deg);}48%,100% {transform:translateX(145%) skewX(-13deg);}}
@keyframes tkUpgradeSignIn {from {opacity:0;transform:translateY(19px);}to {opacity:1;transform:translateY(0);}}

@media (max-width:760px) {#tk-upgrading-premium .tk-upgrade-copy:hover,#tk-upgrading-premium .tk-upgrade-sign:hover {transform:none;}#tk-upgrading-premium .tk-upgrade-image img {min-height:330px !important;}}
@media (prefers-reduced-motion:reduce) {#tk-upgrading-premium *,#tk-upgrading-premium *::before,#tk-upgrading-premium *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}}


/* ---------- CUSTOM ELECTRICAL WORKS ---------- */
/* T.K ELECTRIC — CUSTOM ELECTRICAL WORKS PREMIUM MOTION CSS
   Paste this entire file at the END of Template Custom CSS. */

#tk-custom-works-premium .tk-custom-works-title::after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(114deg,transparent 25%,rgba(255,205,0,.17) 46%,transparent 61%);transform:translateX(-140%);animation:tkCustomWorksSweep 10s ease-in-out infinite;}
#tk-custom-works-premium .tk-custom-works-title > * {position:relative;z-index:1;}
#tk-custom-works-premium .tk-custom-works-heading {animation:tkCustomWorksRise .9s cubic-bezier(.2,.75,.25,1) both;}

#tk-custom-works-premium .tk-custom-works-layout {box-shadow:0 30px 62px rgba(0,0,0,.38);}
#tk-custom-works-premium .tk-custom-works-primary-image {transition:box-shadow .5s ease;}
#tk-custom-works-premium .tk-custom-works-primary-image::after {display:none !important;}
#tk-custom-works-premium .tk-custom-works-primary-image img {transition:transform 1.05s cubic-bezier(.2,.75,.25,1),filter .55s ease;}
#tk-custom-works-premium .tk-custom-works-primary-image:hover {box-shadow:0 22px 50px rgba(0,0,0,.42);}
#tk-custom-works-premium .tk-custom-works-primary-image:hover img {transform:scale(1.055);filter:brightness(.85) saturate(1.08) contrast(1.04);}

#tk-custom-works-premium .tk-custom-works-copy {transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s ease,background-color .35s ease;}
#tk-custom-works-premium .tk-custom-works-copy::before {content:"";position:absolute;right:-20%;top:-38%;width:330px;height:330px;border:1px solid rgba(0,0,0,.25);border-radius:50%;box-shadow:0 0 0 35px rgba(255,255,255,.10),0 0 0 70px rgba(0,0,0,.04);animation:tkCustomWorksOrbit 14s linear infinite;}
#tk-custom-works-premium .tk-custom-works-copy p {position:relative;z-index:1;}
#tk-custom-works-premium .tk-custom-works-copy:hover {transform:translateY(-7px);background:#ffe047 !important;box-shadow:0 20px 44px rgba(0,0,0,.26);}

#tk-custom-works-premium .tk-custom-works-secondary {transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s ease;}
#tk-custom-works-premium .tk-custom-works-secondary::after {display:none !important;}
#tk-custom-works-premium .tk-custom-works-secondary img {transition:transform 1.15s cubic-bezier(.2,.75,.25,1),filter .55s ease;}
#tk-custom-works-premium .tk-custom-works-secondary:hover {transform:translateY(-6px);box-shadow:0 25px 55px rgba(0,0,0,.4);}
#tk-custom-works-premium .tk-custom-works-secondary:hover img {transform:scale(1.045);filter:brightness(.83) contrast(1.08);}

@keyframes tkCustomWorksRise {from {opacity:0;transform:translateY(28px);}to {opacity:1;transform:translateY(0);}}
@keyframes tkCustomWorksSweep {0%,18% {transform:translateX(-140%);opacity:0;}31% {opacity:1;}56%,100% {transform:translateX(145%);opacity:0;}}
@keyframes tkCustomWorksImageSweep {0%,20% {transform:translateX(-140%) skewX(-13deg);}49%,100% {transform:translateX(145%) skewX(-13deg);}}
@keyframes tkCustomWorksOrbit {from {transform:rotate(0deg);}to {transform:rotate(360deg);}}
@keyframes tkCustomWorksBand {0%,22% {background-position:110% 0;}54%,100% {background-position:-110% 0;}}

@media (max-width:760px) {#tk-custom-works-premium .tk-custom-works-copy:hover,#tk-custom-works-premium .tk-custom-works-secondary:hover {transform:none;}#tk-custom-works-premium .tk-custom-works-primary-image img {min-height:390px !important;}}
@media (prefers-reduced-motion:reduce) {#tk-custom-works-premium *,#tk-custom-works-premium *::before,#tk-custom-works-premium *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}}

/* Preserve the full original images without hover cropping. */
#tk-custom-works-premium .tk-custom-works-primary-image:hover img,#tk-custom-works-premium .tk-custom-works-secondary:hover img {transform:none !important;}
@media (max-width:760px) {#tk-custom-works-premium .tk-custom-works-primary-image img {min-height:0 !important;}}


/* ---------- TESTIMONIALS ---------- */
/* T.K ELECTRIC — TESTIMONIALS PREMIUM MOTION CSS
   Paste this entire file at the END of Template Custom CSS. */

#tk-testimonials-premium .tk-testimonials-title::after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,transparent 31%,rgba(255,205,0,.18) 46%,transparent 60%);transform:translateX(-145%);animation:tkTestimonialsSweep 10s ease-in-out infinite;}
#tk-testimonials-premium .tk-testimonials-title > * {position:relative;z-index:1;}
#tk-testimonials-premium .tk-testimonials-heading {animation:tkTestimonialsRise .9s cubic-bezier(.2,.75,.25,1) both;}

#tk-testimonials-premium .tk-testimonials-image-frame {box-shadow:0 28px 68px rgba(0,0,0,.4);transition:transform .65s cubic-bezier(.2,.8,.2,1),box-shadow .65s ease;}
#tk-testimonials-premium .tk-testimonials-image-frame::after {content:"";position:absolute;z-index:2;inset:-28%;pointer-events:none;background:linear-gradient(108deg,transparent 43%,rgba(255,205,0,.26) 48%,rgba(255,255,255,.12) 51%,transparent 57%);transform:translateX(-135%) skewX(-12deg);animation:tkTestimonialsImageSweep 12s ease-in-out infinite;}
#tk-testimonials-premium .tk-testimonials-image-frame:hover {transform:translateY(-7px);box-shadow:0 38px 78px rgba(0,0,0,.52);}

#tk-testimonials-premium .tk-testimonials-review-intro {animation:tkTestimonialsRise .8s .12s cubic-bezier(.2,.75,.25,1) both;}
#tk-testimonials-premium .tk-testimonial-card {transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s ease;}
#tk-testimonials-premium .tk-testimonial-card-one {animation:tkTestimonialsRise .85s .2s cubic-bezier(.2,.75,.25,1) both;}
#tk-testimonials-premium .tk-testimonial-card-two {animation:tkTestimonialsRise .85s .32s cubic-bezier(.2,.75,.25,1) both;}
#tk-testimonials-premium .tk-testimonial-card-three {animation:tkTestimonialsRise .85s .44s cubic-bezier(.2,.75,.25,1) both;}
#tk-testimonials-premium .tk-testimonial-card:hover {transform:translateY(-8px);box-shadow:0 35px 72px rgba(0,0,0,.44);}
#tk-testimonials-premium .tk-testimonial-card-one:hover {box-shadow:inset 8px 0 0 #ffcd00,0 35px 72px rgba(0,0,0,.44);}
#tk-testimonials-premium .tk-testimonial-card-two:hover {box-shadow:inset -8px 0 0 #ffcd00,0 35px 72px rgba(0,0,0,.44);}

@keyframes tkTestimonialsRise {from {opacity:0;transform:translateY(30px);}to {opacity:1;transform:translateY(0);}}
@keyframes tkTestimonialsSweep {0%,18% {opacity:0;transform:translateX(-145%);}31% {opacity:1;}56%,100% {opacity:0;transform:translateX(145%);}}
@keyframes tkTestimonialsImageSweep {0%,22% {transform:translateX(-135%) skewX(-12deg);}50%,100% {transform:translateX(145%) skewX(-12deg);}}

@media (max-width:760px) {
  #tk-testimonials-premium .tk-testimonials-title {padding-left:6% !important;padding-right:6% !important;}
  #tk-testimonials-premium .tk-testimonials-image-frame {border-left-width:5px !important;}
  #tk-testimonials-premium .tk-testimonials-review-intro p {text-align:left !important;}
  #tk-testimonials-premium .tk-testimonial-card-one,#tk-testimonials-premium .tk-testimonial-card-two {grid-template-columns:minmax(0,1fr) !important;}
  #tk-testimonials-premium .tk-testimonial-card-two > div:last-child {display:flex !important;flex-direction:row !important;align-items:center !important;border-left:0 !important;border-top:1px solid rgba(255,205,0,.78) !important;}
  #tk-testimonials-premium .tk-testimonial-card-two > div:last-child span:last-child {margin-left:auto;}
  #tk-testimonials-premium .tk-testimonial-card:hover,#tk-testimonials-premium .tk-testimonials-image-frame:hover {transform:none;}
}

@media (prefers-reduced-motion:reduce) {
  #tk-testimonials-premium *,#tk-testimonials-premium *::before,#tk-testimonials-premium *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}

/* Premium free Google Reviews link — opens the current official Google listing. */
#tk-testimonials-premium .tk-testimonials-google-link {box-shadow:0 19px 40px rgba(0,0,0,.28);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s ease,background-color .35s ease;}
#tk-testimonials-premium .tk-testimonials-google-link::before {content:"";position:absolute;inset:-22% -16%;pointer-events:none;background:linear-gradient(110deg,transparent 39%,rgba(255,255,255,.34) 48%,transparent 57%);transform:translateX(-138%) skewX(-12deg);transition:transform .85s cubic-bezier(.2,.75,.25,1);}
#tk-testimonials-premium .tk-testimonials-google-link:hover {transform:translateY(-7px);background:#ffe047 !important;box-shadow:0 28px 56px rgba(0,0,0,.42);}
#tk-testimonials-premium .tk-testimonials-google-link:hover::before {transform:translateX(138%) skewX(-12deg);}
#tk-testimonials-premium .tk-testimonials-google-link:hover span:nth-child(3) {transform:translate(6px,-6px);}
#tk-testimonials-premium .tk-testimonials-google-link span:nth-child(3) {transition:transform .35s ease;}
@media (max-width:760px) {#tk-testimonials-premium .tk-testimonials-google-link {align-items:flex-start !important;gap:14px !important;}#tk-testimonials-premium .tk-testimonials-google-link:hover {transform:none;}}


/* ---------- CUSTOM ELECTRICAL WORKS: EQUAL UPPER IMAGE / COPY HEIGHT ---------- */
/* CUSTOM ELECTRICAL WORKS — DESKTOP UPPER IMAGE / YELLOW COPY MATCH */
@media (min-width: 761px) {
  #tk-custom-works-premium .tk-custom-works-layout {
    align-items: stretch !important;
  }

  #tk-custom-works-premium .tk-custom-works-primary-image {
    display: flex !important;
    min-height: 0 !important;
  }

  #tk-custom-works-premium .tk-custom-works-primary-image img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    object-fit: cover !important;
    object-position: center !important;
  }
}


/* ==========================================================================
   T.K. ELECTRIC — CURRENTLY LIVE FINAL PATCH RETAINED
   ========================================================================== */
/* ========================================================================== 
   ADD ONLY AT THE BOTTOM OF YOUR CURRENT CSS
   Fixes only: dropdown/off-canvas current item tile + Custom Electrical Works
   ========================================================================== */

/* Keep dropdown and hamburger current/hover links dark; highlight text only. */
#sp-header .sp-dropdown li:hover > a,
#sp-header .sp-dropdown li > a:hover,
#sp-header .sp-dropdown li.active > a,
#sp-header .sp-dropdown li.current > a,
#sp-header .sp-dropdown li.current-item > a {
    color: #FFCD00 !important;
    background: #1A1A1A !important;
}

.offcanvas-menu .menu > li > a:hover,
.offcanvas-menu .menu ul li > a:hover,
.offcanvas-menu .menu li.active > a,
.offcanvas-menu .menu li.current > a,
.offcanvas-menu .menu li.current-item > a {
    color: #FFCD00 !important;
    background: #101010 !important;
}

/* Custom Electrical Works only: no held 18–56% or 22–100% keyframe positions. */
#tk-custom-works-premium .tk-custom-works-title::after {
    animation: tkCWNoHoldTitle 4.8s linear infinite !important;
}

#tk-custom-works-premium .tk-custom-works-primary-image::after {
    animation: tkCWNoHoldImage 5.2s linear infinite !important;
}

#tk-custom-works-premium .tk-custom-works-secondary::after {
    animation: tkCWNoHoldBand 5.6s linear infinite !important;
}

@keyframes tkCWNoHoldTitle {
    from { transform: translateX(-140%); opacity: .15; }
    to { transform: translateX(145%); opacity: .15; }
}

@keyframes tkCWNoHoldImage {
    from { transform: translateX(-140%) skewX(-13deg); }
    to { transform: translateX(145%) skewX(-13deg); }
}

@keyframes tkCWNoHoldBand {
    from { background-position: 110% 0; }
    to { background-position: -110% 0; }
}