/* Timescape Brand Kit v1.2.0 (2026-10-06): mural treatment for Elementor sections marked .ts-kit.
   The --ts-* variables are printed by the plugin from the Brand Kit settings page; the fallbacks are the defaults.
   Element shadows and dot tails (icons, buttons, videos, photos, cards) are drawn by kit.js in the section's svg layer. */
.ts-kit{position:relative}
.ts-kit > .elementor-container{position:relative;z-index:2}
.ts-kit > svg.ts-kit-svg{position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}

/* headings: hard offset shadow in the section background's shadow colour, scales with the font size */
.ts-on-red .ts-shadow .elementor-heading-title{text-shadow:var(--ts-head-shadow,.1em) var(--ts-head-shadow,.1em) 0 rgba(var(--ts-head-red,28,32,43),var(--ts-head-alpha,.9))}
.ts-on-navy .ts-shadow .elementor-heading-title{text-shadow:var(--ts-head-shadow,.1em) var(--ts-head-shadow,.1em) 0 rgba(var(--ts-head-navy,209,39,56),var(--ts-head-alpha,.9))}
.ts-on-cream .ts-shadow .elementor-heading-title{text-shadow:var(--ts-head-shadow,.1em) var(--ts-head-shadow,.1em) 0 rgba(var(--ts-head-cream,28,32,43),var(--ts-head-alpha,.9))}
/* hero titles over photos/video: Elementor's own soft black glow (set per widget, higher specificity) stays for legibility, with the hard shadow added */
.ts-kit.ts-on-dark .elementor-widget.ts-shadow .elementor-heading-title{text-shadow:var(--ts-head-shadow,.1em) var(--ts-head-shadow,.1em) 0 rgba(var(--ts-head-dark,209,39,56),var(--ts-head-alpha,.9)),0 0 10px rgba(0,0,0,.6)}

/* buttons: the shadow + dots live in the svg layer; the button itself presses toward its shadow on hover */
.ts-btn .elementor-button,.ts-kit .ts-subscribe button{transition:transform .15s ease}
.ts-btn .elementor-button:hover,.ts-kit .ts-subscribe button:hover{transform:translate(2px,2px)}
