/* ===== TLC Motion for theloyaltyco.app ===== */
:root{--m-ease:cubic-bezier(.65,0,.15,1);--m-ink:#EDE7DC;--m-ink3:#6E6862;--m-gold:#E2B256;--m-bg:#121110;--m-bg2:#0B0A09}
html{scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
::selection{background:var(--m-gold);color:var(--m-bg2)}
.elementor h1,.elementor h2,.elementor h3{text-wrap:balance}

/* ---------- Preloader (first visit per session) ---------- */
#tlcm-loader,#tlcm-loader-b{position:fixed;inset:0;display:none;will-change:transform}
#tlcm-loader{z-index:10000;background:var(--m-bg2);flex-direction:column;align-items:center;justify-content:center;gap:30px;color:var(--m-ink)}
#tlcm-loader-b{z-index:9999;background:var(--m-ink)}
html.tlc-first #tlcm-loader{display:flex}
html.tlc-first #tlcm-loader-b{display:block}
#tlcm-loader .mark{width:72px;height:72px;color:var(--m-ink);opacity:0;animation:tlcmFade .8s .1s forwards}
#tlcm-loader .line{width:min(260px,46vw);height:1px;background:rgba(237,231,220,.14);position:relative;overflow:hidden}
#tlcm-loader .line i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--m-gold)}
#tlcm-loader .tag{display:flex;gap:18px;font:500 10px/1 Archivo,system-ui,sans-serif;letter-spacing:.3em;text-transform:uppercase;color:var(--m-ink3);opacity:0;animation:tlcmFade .8s .35s forwards}
#tlcm-loader .tag b{color:var(--m-ink);font-weight:500;font-variant-numeric:tabular-nums;min-width:3ch;text-align:right}
#tlcm-loader.is-done{transition:transform .95s var(--m-ease);transform:translateX(101%)}
#tlcm-loader.is-done>*{opacity:0!important;transition:opacity .2s}
#tlcm-loader-b.is-done{transition:transform .95s var(--m-ease) .16s;transform:translateX(101%)}
@keyframes tlcmFade{to{opacity:1}}
body.tlc-loading{overflow:hidden}

/* ---------- Page-transition veil ---------- */
#tlcm-veil{position:fixed;inset:0;z-index:9500;background:var(--m-bg2);transform:translateX(-101%);pointer-events:none;will-change:transform}
#tlcm-veil:after{content:"";position:absolute;top:0;bottom:0;right:0;width:2px;background:var(--m-gold);opacity:.9}
#tlcm-veil.is-on{transform:none;transition:transform .55s var(--m-ease)}
html.tlc-veiled #tlcm-veil{transform:none}
#tlcm-veil.is-off{transform:translateX(101%);transition:transform .8s var(--m-ease)}
html.tlc-veiled #tlcm-veil:after{right:auto;left:0}

/* ---------- Announcement bar (PHP2Shell) ---------- */
:root{--m-ann:0px}
html.tlc-ann{--m-ann:40px}
#tlcm-ann{display:none;position:fixed;top:0;left:0;right:0;height:var(--m-ann);z-index:1002;background:var(--m-gold);color:var(--m-bg2);font:400 13px/1.3 Archivo,system-ui,sans-serif;letter-spacing:.01em}
html.tlc-ann #tlcm-ann{display:block}
#tlcm-ann .in{height:100%;display:flex;align-items:center;gap:14px;padding:0 48px 0 var(--tlc-gutter,24px);max-width:100%}
#tlcm-ann .k{font-weight:600;font-size:10px;letter-spacing:.24em;text-transform:uppercase;padding:4px 8px;border:1px solid rgba(11,10,9,.35);border-radius:2px;flex:0 0 auto}
#tlcm-ann .t{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tlcm-ann .t b{font-weight:600}
#tlcm-ann .t a{color:inherit;text-decoration:underline;text-underline-offset:3px}
#tlcm-ann .c{flex:0 0 auto;font-weight:600;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--m-ink);background:var(--m-bg2);padding:7px 14px;border-radius:999px;text-decoration:none;transition:background .3s,color .3s}
#tlcm-ann .c:hover{background:var(--m-ink);color:var(--m-bg2)}
#tlcm-ann .x{position:absolute;right:8px;top:0;height:100%;width:36px;border:0;background:none;color:inherit;font:300 24px/1 system-ui;cursor:pointer;opacity:.7}
#tlcm-ann .x:hover{opacity:1}
html.tlc-ann [data-elementor-type=header]>.e-con{top:var(--m-ann)!important;inset-block-start:var(--m-ann)!important}
html.tlc-ann #tlcm-progress{top:var(--m-ann)}
body.admin-bar #tlcm-ann{top:32px}
html.tlc-ann body.admin-bar [data-elementor-type=header]>.e-con{top:calc(var(--m-ann) + 32px)!important;inset-block-start:calc(var(--m-ann) + 32px)!important}
@media (max-width:782px){body.admin-bar #tlcm-ann{top:46px}html.tlc-ann body.admin-bar [data-elementor-type=header]>.e-con{top:calc(var(--m-ann) + 46px)!important;inset-block-start:calc(var(--m-ann) + 46px)!important}}
@media (max-width:767px){
html.tlc-ann{--m-ann:44px}
#tlcm-ann .in{gap:10px;padding:0 40px 0 14px}
#tlcm-ann .k{display:none}
#tlcm-ann .t,#tlcm-ann .cl{display:none}
#tlcm-ann .ts,#tlcm-ann .cs{display:inline}
#tlcm-ann .ts{flex:1 1 auto;min-width:0;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tlcm-ann .ts a{color:inherit;text-decoration:underline;text-underline-offset:3px}
#tlcm-ann .c{font-size:10px;padding:6px 10px;letter-spacing:.08em}
}
#tlcm-ann .ts,#tlcm-ann .cs{display:none}
@media (max-width:767px){#tlcm-ann .ts{display:block}#tlcm-ann .cs{display:inline}}

/* ---------- Header behaviour + progress ---------- */
[data-elementor-type=header]>.e-con{transition:transform .7s var(--m-ease),background-color .5s,backdrop-filter .5s,padding .5s!important}
[data-elementor-type=header]>.e-con.is-hidden{transform:translateY(-110%)}
[data-elementor-type=header]>.e-con.is-solid{background:rgba(11,10,9,.74)!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important}
#tlcm-progress{position:fixed;top:0;left:0;height:2px;width:100%;z-index:1001;transform-origin:left;transform:scaleX(0);background:var(--m-gold);pointer-events:none}
[data-elementor-type=header] .e-con:nth-child(2) .e-button-base{position:relative}
[data-elementor-type=header] .e-con:nth-child(2) .e-button-base:after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--m-gold);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--m-ease)}
[data-elementor-type=header] .e-con:nth-child(2) .e-button-base:hover:after{transform:scaleX(1);transform-origin:left}

/* ---------- Buttons ---------- */
.elementor a.btn{position:relative;overflow:hidden;isolation:isolate;transition:color .35s var(--m-ease),border-color .35s!important}
.elementor a.btn:before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:var(--m-ink);transform:translateY(103%);transition:transform .55s var(--m-ease)}
.elementor a.btn:hover{color:var(--m-bg2)!important;border-color:var(--m-ink)!important}
.elementor a.btn:hover:before{transform:none}
[data-magnetic]{will-change:transform}

/* ---------- Reveals ---------- */
.tlc-rv{opacity:0!important;transform:translateY(34px)!important;transition:opacity .8s var(--m-ease),transform 1.05s var(--m-ease)!important;will-change:opacity,transform}
.tlc-rv.is-in{opacity:1!important;transform:none!important}
.tlc-split{opacity:1!important;transform:none!important}
.tlc-w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.1em;margin-bottom:-.1em}
.tlc-w>span{display:inline-block;transform:translateY(112%);transition:transform 1.15s var(--m-ease)}
.tlc-split.is-in .tlc-w>span{transform:none}

/* ---------- Image masks (wipe from right, settle scale) ---------- */
.tlc-mask{position:relative;isolation:isolate}
.tlc-mask:after{content:"";position:absolute;inset:-1px;z-index:9;background:var(--m-bg);transform:scaleX(1);transform-origin:right;transition:transform 1.15s var(--m-ease);pointer-events:none}
.tlc-mask.is-in:after{transform:scaleX(0)}
.tlc-mask img{transform:scale(1.12);transition:transform 1.7s var(--m-ease)}
.tlc-mask.is-in img{transform:none}
.tlc-par img{transition:none!important;will-change:transform}

/* ---------- Logo marquee ---------- */
.logo-strip.tlc-mq{overflow:hidden;justify-content:flex-start!important;gap:0!important;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logo-strip.tlc-mq .tlc-mq-track{display:flex;align-items:center;width:max-content;animation:tlcmMarquee 42s linear infinite;will-change:transform}
.logo-strip.tlc-mq .tlc-mq-track img{margin-right:clamp(64px,8vw,140px);flex:0 0 auto}
.logo-strip.tlc-mq:hover .tlc-mq-track{animation-play-state:paused}
@keyframes tlcmMarquee{to{transform:translateX(-50%)}}

/* ---------- Scroll cue ---------- */
#tlcm-cue{position:fixed;left:50%;bottom:26px;z-index:800;display:none;flex-direction:column;align-items:center;gap:10px;font:500 10px/1 Archivo,system-ui,sans-serif;letter-spacing:.3em;text-transform:uppercase;color:var(--m-ink3);pointer-events:none;transform:translateX(-50%);transition:opacity .6s,transform .6s}
#tlcm-cue.is-on{display:flex}
#tlcm-cue i{display:block;width:1px;height:52px;background:linear-gradient(var(--m-gold),transparent);transform-origin:top;animation:tlcmCue 2.3s var(--m-ease) infinite}
#tlcm-cue.is-hidden{opacity:0;transform:translate(-50%,16px)}
@keyframes tlcmCue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- Cursor ---------- */
@media (hover:hover) and (pointer:fine){
body.tlc-cursor,body.tlc-cursor a,body.tlc-cursor button{cursor:none}
#tlcm-cur{position:fixed;top:0;left:0;z-index:10001;pointer-events:none}
#tlcm-cur .d{position:absolute;top:0;left:0;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--m-ink);transition:transform .25s var(--m-ease),opacity .3s}
#tlcm-cur .r{position:absolute;top:0;left:0;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:1px solid rgba(237,231,220,.5);display:flex;align-items:center;justify-content:center;font:500 10px/1 Archivo,system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--m-bg2);transition:width .5s var(--m-ease),height .5s var(--m-ease),margin .5s var(--m-ease),background .4s,border-color .4s,opacity .3s}
#tlcm-cur .r span{opacity:0;transform:scale(.6);transition:opacity .3s,transform .4s var(--m-ease);padding-left:.22em}
#tlcm-cur.is-link .r{width:56px;height:56px;margin:-28px 0 0 -28px;border-color:var(--m-gold);background:rgba(226,178,86,.14)}
#tlcm-cur.is-label .r{width:92px;height:92px;margin:-46px 0 0 -46px;background:var(--m-ink);border-color:var(--m-ink)}
#tlcm-cur.is-label .r span{opacity:1;transform:none}
#tlcm-cur.is-label .d{transform:scale(0)}
#tlcm-cur.is-hidden .d,#tlcm-cur.is-hidden .r{opacity:0}
}

/* ---------- Mobile / reduced motion ---------- */
@media (max-width:767px){
.tlc-rv{transform:translateY(22px)!important}
.tlc-mask img{transform:scale(1.06)}
.logo-strip.tlc-mq .tlc-mq-track img{margin-right:44px}
.logo-strip.tlc-mq .tlc-mq-track{animation-duration:28s}
#tlcm-cue{display:none!important}
}
@media (prefers-reduced-motion:reduce){
#tlcm-loader,#tlcm-loader-b,#tlcm-cue{display:none!important}
.logo-strip.tlc-mq .tlc-mq-track{animation:none}
}
html.tlc-reduce .tlc-rv,html.tlc-reduce .tlc-w>span{opacity:1!important;transform:none!important}
html.tlc-reduce .tlc-mask:after{display:none}
html.tlc-reduce .tlc-mask img{transform:none}
