Stories code for your site
<style><!--/* Carousel container */.stories {  display: flex;  gap: 12px;  padding: 10px;  overflow-x: auto;  scroll-snap-type: x mandatory;  -webkit-overflow-scrolling: touch;}
/* Highlight circle */.highlight {  flex: 0 0 auto;  width: 80px;  height: 80px;  border-radius: 50%;  background: linear-gradient(45deg,#f56040,#c13584);  padding: 3px;  scroll-snap-align: start;  cursor: pointer;  transition: transform 0.2s;}
.highlight img {  width: 100%;  height: 100%;  object-fit: cover;  border-radius: 50%;}
.highlight:hover {  transform: scale(1.1);}
/* Lightbox overlay */.overlay {  display: none;  position: fixed;  top:0; left:0;  width:100%; height:100%;  background: rgba(0,0,0,0.9);  justify-content: center;  align-items: center;  z-index: 9999;}
.overlay.active {  display: flex;}
.overlay iframe {  width: 90%;  height: 90%;  border: none;}
.close-btn {  position: absolute;  top: 20px; right: 20px;  font-size: 30px;  color: white;  cursor: pointer;  z-index: 10000;}--></style><div class="stories"><div class="highlight" onclick="openStory('story1')"><img src="https://static2.yooco.de/n2/c3/806183/u/88/3918129/images/profile/medium/96e61371bca2a355fa6592dd6b7aa8f1.jpg" alt="Story 1" /> /></div></div><!-- Overlay for Canva embed --><div id="story1" class="overlay"><span class="close-btn" onclick="closeStory('story1')">&times;</span> <iframe src="https://www.canva.com/design/DAG__BQTlZU/eyjzOu6VMAbg3s8yRi1Xcw/view?embed"></iframe></div><script type="text/javascript">// <![CDATA[function openStory(id) {  document.getElementById(id).classList.add('active');}function closeStory(id) {  document.getElementById(id).classList.remove('active');}// ]]></script>
Story 1
Story 2
Story 3
Story 4
Story 5
Story 6
×
×
×
×
×
×