.elementor-43 .elementor-element.elementor-element-467c230{--display:flex;--min-height:100dvh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--overflow:hidden;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-43 .elementor-element.elementor-element-19ad99a{--display:grid;--position:absolute;--min-height:auto;--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:auto auto auto;--gap:8px 8px;--row-gap:8px;--column-gap:8px;--grid-auto-flow:row;--justify-items:center;--align-items:center;--grid-align-content:space-around;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:100;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-43 .elementor-element.elementor-element-38466d5{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;text-align:center;font-family:"Roboto", Sans-serif;font-weight:400;color:#FEFEFF;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-43 .elementor-element.elementor-element-793db0c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:16px 16px 16px 16px;z-index:777;text-align:center;}.elementor-43 .elementor-element.elementor-element-793db0c .elementor-heading-title{font-family:"Work Sans", Sans-serif;font-size:clamp(34px, 3.5vw + 1rem, 89px);font-weight:600;line-height:1;color:#5444FF;}.elementor-43 .elementor-element.elementor-element-f197e89{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;text-align:center;font-family:"Roboto", Sans-serif;font-weight:400;color:#FEFEFF;}.elementor-43 .elementor-element.elementor-element-d35f593{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;bottom:16px;z-index:100;text-align:center;font-family:"Roboto", Sans-serif;font-size:12px;font-weight:400;line-height:12px;color:#FEFEFF;}.elementor-43 .elementor-element.elementor-element-75b0752{width:100%;max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;z-index:1;}body.elementor-page-43:not(.elementor-motion-effects-element-type-background), body.elementor-page-43 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FEFEFF;}:root{--page-title-display:none;}body.elementor-page-43{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}@media(max-width:1024px){.elementor-43 .elementor-element.elementor-element-19ad99a{--grid-auto-flow:row;}.elementor-43 .elementor-element.elementor-element-793db0c{padding:8px 8px 8px 8px;}}@media(min-width:768px){.elementor-43 .elementor-element.elementor-element-467c230{--content-width:100dvw;}.elementor-43 .elementor-element.elementor-element-19ad99a{--width:61.8vw;}}@media(max-width:767px){.elementor-43 .elementor-element.elementor-element-19ad99a{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-43 .elementor-element.elementor-element-793db0c{padding:4px 4px 4px 4px;}}/* Start custom CSS *//* ============================================================
   GLOBAL VARIABLES
   ============================================================ */
:root {
    --trustline-line-thickness: 6px;
    --trustline-blue: #006FFF;
    --trustline-white: #FEFEFF;
}

/* ============================================================
   DESKTOP LAYOUT — Horizontal: tangle left → straight right
   ============================================================ */
.tangled-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start; /* chaos stays left */
    align-items: center;
    overflow: visible;
}

.tangled-line {
    margin-top: 24px;
    margin-bottom: -64px;
    width: 100%;
    height: auto;
    max-height: 61.8dvh; /* golden-ratio constraint */
    display: block;
}

/* ============================================================
   MOBILE & TABLET — Vertical: tangle top → straight bottom
   Rotates layout 90deg but keeps the SVG scaling logic intact
   ============================================================ */
@media (max-width: 1024px) {

    .tangled-wrapper {
        width: 100dvh;    /* rotated width */
        height: 100dvw;   /* rotated height */
        transform: rotate(90deg);
        transform-origin: center center;

        display: flex;
        justify-content: center;   /* center straight line */
        align-items: flex-start;   /* tangle appears at the top */

        overflow: visible;
        position: relative;
        left: 0;
        top: 0;
    }

    .tangled-line {
        margin: 0 !important;
        width: auto;
        height: 100dvh;  /* ensures SVG extends top → bottom */
        max-width: none;
        max-height: none;
    }

    /* Elementor override cleanup */
    .elementor,
    .elementor-section,
    .elementor-container,
    .elementor-widget-wrap {
        padding: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    body.elementor-page {
        overflow: hidden !important;
    }
}

/* ============================================================
   SIGNATURE DRAW ANIMATION (SVG UNRAVELING)
   ============================================================ */
.unravel {
    stroke-dasharray: 2200;
    stroke-dashoffset: 2200;
    animation: unravel-line 2.8s ease-out forwards;
    animation-delay: 0.25s; /* slight anticipation */
}

@keyframes unravel-line {
    19.1% {
        stroke-dashoffset: 2200; /* fully hidden */
    }
    61.8% {
        stroke-dashoffset: 1050;  /* slow, steady reveal */
    }
    100% {
        stroke-dashoffset: 0;    /* confident signature finish */
    }
}

/* ============================================================
   BACKGROUND FADES ONLY AFTER LINE ANIMATION COMPLETES
   2.8s (line) + 0.25 delay = 3.05s → so this starts at 3.1s
   ============================================================ */
body.elementor-page {
    background: var(--trustline-white);
    animation: bg-fade 1.4s ease-out forwards;
    animation-delay: 2.8s;
}

@keyframes bg-fade {
    from { background: var(--trustline-white); }
    to   { background: var(--trustline-blue); }
}

/* ============================================================
   SVG PROTECTION — Prevent text animations from overriding it
   This is what fixed the SVG disappearing.
   ============================================================ */
/* Do NOT disable animations on SVGs — only block text fade from affecting them */
.tangled-wrapper svg,
.tangled-wrapper svg * {
    color: inherit !important;  /* harmless */
    /* leave animation alone */
}

/* ============================================================
   TEXT FADE (black → white) — triggers with background fade
   Apply ONLY to text-bearing elements, not SVG.
   ============================================================ */
.trustline-logo,
.pre-heading,
.tagline,
.copyright,
body.elementor-page p,
body.elementor-page span,
body.elementor-page h1,
body.elementor-page h2,
body.elementor-page h3,
body.elementor-page h4,
body.elementor-page h5,
body.elementor-page h6 {
    animation: text-fade 1.2s ease-out forwards;
    animation-delay: 3.1s;
}

@keyframes text-fade {
    from { color: #141414; }
    to   { color: var(--trustline-white); }
}

/* ============================================================
   OPTICAL KERNING FOR THE WORK SANS LOGO
   ============================================================ */
.trustline-logo {
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    font-kerning: normal;
    font-feature-settings: "kern" 1;
    letter-spacing: -0.005em; /* global micro-adjust */
}

/* Optical letter-pair adjustments */
.trustline-logo .k-r { letter-spacing: -0.012em; }
.trustline-logo .k-s { letter-spacing: -0.008em; }
.trustline-logo .k-i { letter-spacing: -0.016em; }
.trustline-logo .k-e { letter-spacing: -0.024em; }

/* Registered mark */
.trustline-logo .reg {
    font-weight: 400;
    font-size: 0.19em;
    position: relative;
    top: -2.618em;   /* golden ratio lift */
    margin-left: -0.012em;
}

/* ============================================================
   TAGLINE MOTION (AFTER BACKGROUND FADE)
   ============================================================ */
.pre-heading {
    opacity: 0;
    animation: slide-down 1s ease-out forwards;
    animation-delay: 3.4s;
}

.tagline {
    opacity: 0;
    animation: slide-up 1s ease-out forwards;
    animation-delay: 3.4s;
}

@keyframes slide-down {
    from { opacity: 0; transform: translateY(-18px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes slide-up {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Copyright fade-in */
.copyright {
    color: var(--trustline-white) !important; /* ensure visible */
    opacity: 0;
    animation: copyright-fade 1.2s ease-out forwards;
    animation-delay: 3.4s;
}

@keyframes copyright-fade {
    from { opacity: 0; color: var(--trustline-white); }
    to   { opacity: 1; color: var(--trustline-white); }
}

/* Base 12px copyright logo */
.copyright-logo {
    font-size: 12px; 
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    line-height: 1;
    color: var(--trustline-white) !important;
    letter-spacing: -0.005em; /* carry optical baseline */
}

/* Optical kerning pair adjustments (scaled down naturally) */
.copyright-logo .k-r { letter-spacing: -0.012em; }
.copyright-logo .k-s { letter-spacing: -0.008em; }
.copyright-logo .k-i { letter-spacing: -0.016em; }
.copyright-logo .k-e { letter-spacing: -0.024em; }

/* Registered mark scaled for tiny size */
.copyright-logo .reg {
    font-weight: 400;
    font-size: 0.45em;          /* proportional to 12px */
    position: relative;
    top: -0.9em;                /* properly lifts at 12px scale */
    margin-left: -0.02em;       /* tighter optical tuck */
}/* End custom CSS */