/* WOW theme: story pages only. */

/* ------------------------------------------------------------------ story */
.wow-story { width: 100%; }
.wow-story__head { max-width: 860px; padding-top: 24px; }
.wow-crumbs { margin-bottom: 14px; font-size: 13px; color: var(--wow-muted); }
.wow-crumbs a { color: var(--wow-muted); text-decoration: none; }
.wow-crumbs a:hover { color: var(--wow-red-ink); }
.wow-story__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 10px; }
.wow-story__kicker .wow-kicker { text-decoration: none; }
.wow-story__title { margin: 0 0 14px; font-size: clamp(1.9rem, 1.2rem + 3vw, 3.25rem); }
.wow-story__standfirst { margin: 0 0 20px; font-size: clamp(1.05rem, 1rem + .4vw, 1.25rem); line-height: 1.55; color: #333; }

.wow-byline { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; padding-block: 14px; border-top: 1px solid var(--wow-line); }
.wow-byline__text { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.wow-byline__name { color: var(--wow-black); font-weight: 700; text-decoration: none; }
.wow-byline__name:hover { color: var(--wow-red-ink); }
.wow-avatar { flex: none; border-radius: 50%; object-fit: cover; }
.wow-avatar--initials { display: inline-flex; align-items: center; justify-content: center; background: var(--wow-black); color: #fff; font-size: 15px; font-weight: 700; }

.wow-story__hero { margin: 8px 0 28px; }
.wow-story__hero img { width: 100%; max-height: 640px; object-fit: cover; }

.wow-story__hero figcaption,
.wow-prose figcaption { margin-top: 8px; font-size: 13px; color: var(--wow-muted); }

.wow-story__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; }

@media (min-width: 1000px) { .wow-story__layout { grid-template-columns: minmax(0, 720px) minmax(0, 320px); justify-content: space-between; gap: 56px; } }
.wow-story__aside { display: grid; gap: 16px; align-content: start; }

@media (max-width: 999px) { .wow-story__aside .wow-aside-card--sticky { display: none; } }
.wow-aside-card { padding: 20px; border: 1px solid var(--wow-line); border-radius: 14px; background: #fff; }
.wow-aside-card--sticky { position: sticky; top: 24px; }
.wow-aside-card__title { margin: 0 0 12px; font-size: 18px; font-weight: 700; line-height: 1.3; }

/* Expert Tip: old posts paint the paragraph bright yellow inline; show it as a calm callout. */
.wow-prose p.has-background[style*="fcb900"],
.wow-prose .has-luminous-vivid-amber-background-color,
.wow-prose .ajm-expert-tip,
.wow-prose .rdpt-tip,
.wow-prose .is-style-wow-expert-tip {
	padding: 16px 18px !important;
	border-left: 4px solid var(--wow-tip);
	border-radius: 0 10px 10px 0;
	background: #fff8e0 !important;
	color: var(--wow-black);
	font-size: .95em;
}

/* Venue block */
.wow-prose .wow-venue {
	padding: 14px 18px !important;
	border-left: 4px solid var(--wow-red) !important;
	border-radius: 0 10px 10px 0;
	background: var(--wow-bg) !important;
	font-size: .9em;
	line-height: 1.75;
}
.wow-prose .wow-venue strong:first-child { display: inline-block; margin-bottom: 2px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--wow-red-ink); }

/* Quotes: body size, quiet rule; with a photo inside, the photo sits beside the words. */
.wow-prose blockquote,
.wow-prose .wp-block-quote { margin-inline: 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--wow-red); font-size: 1em; font-style: normal; }
.wow-prose .wp-block-quote p { font-size: 1em !important; font-weight: 400 !important; line-height: 1.7 !important; }
.wow-prose .wp-block-quote cite { display: block; margin-top: 6px; font-size: 14px; font-style: normal; color: var(--wow-muted); }
.wow-prose .wp-block-quote:has(img) { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 16px; align-items: start; }

.wow-prose .wp-block-quote:has(img) figure,
.wow-prose .wp-block-quote:has(img) .wp-block-image { grid-row: span 3; margin: 0; }
.wow-prose .wp-block-quote:has(img) img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }

/* Fact box and legacy callouts */
.wow-prose .is-style-wow-facts,
.wow-prose .wdf-callout { padding: 20px 22px; border: 1px solid var(--wow-line); border-radius: 14px; background: #fff; }

.wow-prose .is-style-wow-facts > :first-child,
.wow-prose .wdf-callout > :first-child { margin-top: 0; }

.wow-prose .is-style-wow-facts > :last-child,
.wow-prose .wdf-callout > :last-child { margin-bottom: 0; }
.wow-prose .wdf-tldr { border-top: 4px solid var(--wow-red); }

/* Yoast FAQ */
.wow-prose .schema-faq-section { padding-block: 14px; border-bottom: 1px solid var(--wow-line); }
.wow-prose .schema-faq-question { display: block; margin-bottom: 6px; font-size: 1.05em; }
.wow-prose .schema-faq-answer { margin: 0; }

/* Buttons and HTML blocks from old posts */
.wow-prose .wp-block-button__link { border-radius: var(--wow-radius-pill); font-weight: 600; text-decoration: none; }

.wow-prose .wp-block-html,
.wow-prose iframe { max-width: 100%; }
/* Old posts' own HTML must never widen the page (Emirates back-compat, 10 Nov 2026). Instagram
   writes max-width: 540px on its iframe, which beat the rule above (388 px in a 358 px column);
   custom tools size their grids by words that cannot break (the ladies' night finder, 519 px).
   Zero specificity, so the theme's own components keep their rules. */
.wow-prose iframe { max-width: 100% !important; }
.wow-prose :where(div, span, a) { overflow-wrap: break-word; }
.wow-prose :where(article, section, li) { min-width: 0; }
/* Raw Instagram embeds in a post's HTML: while loading, embed.js makes the iframe absolute, so its
   width followed the window (1438 px); the fallback quote has a link that does not wrap. */
.wow-prose iframe.instagram-media { position: static !important; }
.wow-prose blockquote.instagram-media { max-width: 100% !important; min-width: 0 !important; overflow: hidden; }
/* Last guard: a post's own CSS can still force text not to wrap (the finder's day pill is nowrap,
   168 px past its card). Clip sideways overflow at the article body, as Flex Mag did for the page;
   clip keeps sticky working and makes no scroll box. Nothing of the theme's reaches past it. */
.wow-prose { overflow-x: clip; }
/* On phones, old custom HTML may not refuse to wrap: the finder's day pill ran past its card.
   Only elements that are not the theme's own (no wow- class). */
@media (max-width: 640px) {
	.wow-prose :is(div, span)[class]:not([class*="wow-"]) { white-space: normal !important; }
}
.wow-prose [class*="mvp-"] { max-width: 100%; float: none; }

/* Gallery: the only swipeable element. */
.wow-gallery { margin-block: 0 1.4em; }

.wow-gallery.is-ready .wp-block-gallery {
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: 12px !important;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	overscroll-behavior-x: contain;
}
.wow-gallery.is-ready .wp-block-gallery::-webkit-scrollbar { display: none; }
.wow-gallery.is-ready .wp-block-gallery > figure { flex: 0 0 100% !important; width: 100% !important; margin: 0 !important; scroll-snap-align: start; }
.wow-gallery.is-ready .wp-block-gallery img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.wow-gallery__bar { display: none; align-items: center; gap: 8px; margin-top: 8px; }
.wow-gallery.is-ready .wow-gallery__bar { display: flex; }
.wow-gallery__count { min-width: 56px; font-size: 14px; color: var(--wow-muted); text-align: center; }
.wow-gallery__full { margin-left: auto; padding: 0 0 4px; border: 0; cursor: pointer; font-size: 14px; }
.wow-gallery:fullscreen { display: flex; flex-direction: column; justify-content: center; padding: 16px; background: #000; }
.wow-gallery:fullscreen img { aspect-ratio: auto; max-height: 85vh; object-fit: contain; }

.wow-gallery:fullscreen .wow-gallery__bar,
.wow-gallery:fullscreen .wow-icon-btn,
.wow-gallery:fullscreen .wow-gallery__full { color: #fff; }

/* Instagram, click to load */
.wow-insta { margin-inline: 0; }
.wow-insta__card { display: grid; justify-items: start; gap: 12px; padding: 20px; border: 1px solid var(--wow-line); border-radius: 14px; background: #fff; }
.wow-insta__text { margin: 0; font-size: 15px; color: var(--wow-muted); }
.wow-insta__link { font-size: 14px; }

/* Tags, share, author */
.wow-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 28px 0 0; padding: 0; list-style: none; }
.wow-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 24px; padding-block: 16px; border-block: 1px solid var(--wow-line); }
.wow-share__label { margin-right: 4px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.wow-share__btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1px solid var(--wow-line); border-radius: var(--wow-radius-pill); background: #fff; color: var(--wow-black); font: 600 14px/1 var(--wow-font); text-decoration: none; cursor: pointer; }
.wow-share__btn:hover { border-color: var(--wow-black); color: var(--wow-black); }
.wow-share__btn--whatsapp { border-color: #0b6e39; background: #0b6e39; color: #fff; }
.wow-share__btn--whatsapp:hover { background: #095c30; color: #fff; }
.wow-share__btn .wow-icon--linkedin { width: auto; height: 16px; }

.wow-author-box { display: flex; gap: 16px; margin-top: 28px; padding: 20px; border-radius: 14px; background: #f3f3f3; }
.wow-author-box__name { margin: 0 0 4px; font-weight: 700; }
.wow-author-box__bio { margin: 0 0 10px; font-size: 15px; color: #444; }

.wow-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* Sticky action bar on phones, only when the story has a main action. */
.wow-action-bar { display: none; }

@media (max-width: 767px) {
	.wow-action-bar {
		position: fixed;
		right: 12px;
		bottom: calc(84px + env(safe-area-inset-bottom, 0px));
		left: 12px;
		z-index: 39;
		display: flex;
		gap: 8px;
		align-items: center;
		padding: 8px;
		border: 1px solid rgba(255, 255, 255, .95);
		border-radius: 24px;
		background: linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .74));
		-webkit-backdrop-filter: blur(18px) saturate(180%);
		backdrop-filter: blur(18px) saturate(180%);
		box-shadow: inset 0 1px 0 #fff, 0 10px 30px rgba(0, 0, 0, .16);
	}
	.wow-action-bar .wow-btn { flex: 1; justify-content: space-between; }
	.wow-action-bar__wa { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: #0b6e39; color: #fff; }

	.wow-action-bar__wa:hover,
	.wow-action-bar__wa:focus-visible { background: #095c30; color: #fff; }
	body:has(.wow-action-bar) { padding-bottom: calc(160px + env(safe-area-inset-bottom, 0px)); }
	body:has(.wow-action-bar) .wow-wa-float { display: none; }
}