/*
Theme Name: Uncode Child
Description: Child theme for Uncode theme (EDDA / Ethel's Africa Advisory build)
Author: Undsgn™
Author URI: http://www.undsgn.com
Template: uncode
Version: 1.0.1
Text Domain: uncode
*/

/* ==========================================================================
   Fonts (self hosted, OFL licensed, see /fonts)
   ========================================================================== */
@font-face {
	font-family: 'Instrument Serif';
	src: url('fonts/instrument-serif-regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Instrument Serif';
	src: url('fonts/instrument-serif-italic.woff2') format('woff2');
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Afacad Flux';
	src: url('fonts/afacad-flux-variable.woff2') format('woff2-variations'),
	     url('fonts/afacad-flux-variable.woff2') format('woff2');
	font-weight: 100 1000;
	font-style: normal;
	font-display: swap;
}

/* ==========================================================================
   Design tokens (mirrors Theme Options → Palette)
   ========================================================================== */
:root {
	--edda-royal: #20449C;
	--edda-cobalt: #0A34A2;
	--edda-navy: #1D2E61;
	--edda-midnight: #030D2A;
	--edda-saffron: #FBBC04;
	--edda-cream: #F2F1ED;
	--edda-sky: #6A9DF7;
	--edda-mist: #DADDE5;
	--edda-brown: #4E3D30;
	--edda-pale: #BDC5D8;
	--edda-rule: #2248AB;
	--edda-serif: 'Instrument Serif', Georgia, 'Times New Roman', serif;
	--edda-sans: 'Afacad Flux', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--edda-radius: 8px;
}

body { background-color: var(--edda-royal); }
em.edda-serif, .edda-serif-em em, .edda-serif { font-family: var(--edda-serif); }

/* Serif headings keep a tight, editorial rhythm */
.edda-display, .edda-display * { font-family: var(--edda-serif) !important; font-weight: 400 !important; letter-spacing: -0.01em; }
.edda-display h1, .edda-display h2, .edda-display h3, .edda-display p { line-height: 1.02 !important; }
.edda-h2 h2, .edda-h2 h3, .edda-h2 p { line-height: 1 !important; }
.edda-display em, .edda-h2 em { font-style: italic; }

/* Small pill labels: ABOUT, WHAT WE DO, GET IN TOUCH */
.edda-badge { margin-bottom: 18px !important; }
.edda-badge > * > span, .edda-badge span.heading-text-inner, .edda-badge .badge-style {
	font-family: var(--edda-sans) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase;
	line-height: 1 !important;
}
.edda-pill {
	display: inline-block;
	padding: 7px 14px;
	border-radius: 999px;
	font-family: var(--edda-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1;
	text-transform: uppercase;
}
.edda-pill--mist { background: var(--edda-mist); color: var(--edda-cobalt); }
.edda-pill--saffron { background: var(--edda-saffron); color: var(--edda-midnight); }

/* ==========================================================================
   1. Hero
   ========================================================================== */
.edda-hero .background-wrapper::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20, 8, 6, 0.35) 0%, rgba(32, 68, 156, 0) 40%, rgba(32, 68, 156, 0.55) 70%, var(--edda-royal) 92%);
	pointer-events: none;
}
.edda-hero-title h1 { font-size: clamp(64px, 10vw, 128px) !important; line-height: 1 !important; color: #fff; }
.edda-hero-tagline p { font-family: var(--edda-sans); font-size: clamp(22px, 2.5vw, 32px); line-height: 1.2; color: #fff; margin: 0; }
.edda-hero-tagline em { font-family: var(--edda-serif); font-style: italic; }
.edda-hero-map img { max-width: 480px; width: 100%; height: auto; margin-left: auto; }

/* ==========================================================================
   2. About card
   ========================================================================== */
.edda-about-title h2 { color: var(--edda-cobalt) !important; font-size: clamp(36px, 4vw, 48px) !important; }
.edda-about-lead p { font-family: var(--edda-sans); font-size: clamp(19px, 1.9vw, 24px); line-height: 1.4; color: var(--edda-brown); }
.edda-about-body p { font-family: var(--edda-sans); font-size: clamp(17px, 1.6vw, 20px); line-height: 1.45; color: var(--edda-brown); }
.edda-about-body p.edda-closing { color: var(--edda-cobalt); font-weight: 600; }
.edda-mission {
	background: #fff;
	border-left: 4px solid var(--edda-saffron);
	padding: 28px 24px 26px 22px;
	margin: 8px 0 12px;
}
.edda-mission .edda-mission-label {
	font-family: var(--edda-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: #002691;
	margin: 0 0 10px;
}
.edda-mission .edda-mission-text {
	font-family: var(--edda-serif);
	font-size: clamp(24px, 2.6vw, 32px);
	line-height: 1.3;
	color: var(--edda-royal);
	margin: 0;
}
.edda-portrait img { max-width: 420px; margin: 0 auto; display: block; }

/* Headshot joined to the name plate: same width, photo's straight bottom cut sits flush on the plate */
.edda-portrait-stack .uncont > * { margin-top: 0 !important; margin-bottom: 0 !important; }
.edda-portrait-stack .edda-portrait,
.edda-portrait-stack .edda-portrait .uncode-single-media-wrapper,
.edda-portrait-stack .edda-portrait img { width: 100% !important; max-width: 100% !important; display: block; margin: 0 !important; }
.edda-portrait-stack .edda-portrait img { height: auto; }
.edda-portrait-stack .edda-caption { max-width: none; margin: 0; }
.edda-portrait-stack .uncode_text_column p:empty { display: none; }
.edda-caption {
	background: var(--edda-navy);
	padding: 22px 18px;
	max-width: 415px;
	margin-left: auto;
}
.edda-caption p { margin: 0; font-family: var(--edda-sans); line-height: 1.5; }
.edda-caption .edda-caption-name { color: var(--edda-saffron); font-size: 16px; font-weight: 600; }
.edda-caption .edda-caption-role { color: #fff; font-size: 14px; }

/* ==========================================================================
   3. Photo band + What we do
   ========================================================================== */
.edda-band { min-height: 540px; }
.edda-band .background-wrapper::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(32, 68, 156, 0) 0%, rgba(32, 68, 156, 0.15) 55%, var(--edda-royal) 100%);
	pointer-events: none;
}
.edda-wwd-title h2 { color: #fff !important; font-size: clamp(36px, 4vw, 48px) !important; }
.edda-wwd-lead p { font-family: var(--edda-sans); font-size: clamp(19px, 1.9vw, 24px); line-height: 1.35; color: var(--edda-sky); margin-bottom: 12px; }
.edda-wwd-body p { font-family: var(--edda-sans); font-size: 18px; line-height: 1.55; color: var(--edda-pale); }

.edda-service {
	background: var(--edda-cobalt);
	border-radius: var(--edda-radius);
	padding: 40px !important;
	display: flex;
	flex-direction: column;
	height: 100%;
}
.edda-service h3 { font-family: var(--edda-serif) !important; font-weight: 400 !important; font-size: 30px !important; line-height: 1.1 !important; color: #fff !important; margin: 0 0 18px !important; }
.edda-service p { font-family: var(--edda-sans); font-size: 16px; line-height: 1.6; color: #fff; }
.edda-service .edda-readmore-wrap { margin-top: auto; border-top: 1px solid var(--edda-rule); padding-top: 22px; }
.edda-readmore {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-family: var(--edda-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--edda-sky) !important;
	text-decoration: none !important;
}
.edda-readmore span { font-size: 22px; font-weight: 300; line-height: 1; }
.edda-readmore:hover { color: #fff !important; }

/* Equal height service cards */
.edda-services .row-inner > .wpb_column > .uncol,
.edda-services .row-inner > .wpb_column > .uncol > .uncoltable,
.edda-services .row-inner > .wpb_column > .uncol > .uncoltable > .uncell,
.edda-services .row-inner > .wpb_column > .uncol > .uncoltable > .uncell > .uncont { height: 100%; }
/* ...and the card inside each column fills that full height, so all three match */
.edda-services .uncont > .uncode_text_column,
.edda-services .uncode_text_column > .edda-service { height: 100%; }
.edda-services .uncode_text_column > p:empty { display: none; }

/* ==========================================================================
   4. Pull quote
   ========================================================================== */
.edda-quote p {
	font-family: var(--edda-serif);
	font-size: clamp(26px, 3vw, 36px);
	line-height: 1.12;
	color: #fff;
	text-align: center;
	max-width: 860px;
	margin: 0 auto;
}
.edda-quote em { font-style: italic; color: var(--edda-saffron); }

/* ==========================================================================
   5. Who we work with
   ========================================================================== */
.edda-www-title h2 { color: var(--edda-cobalt) !important; font-size: clamp(36px, 4vw, 48px) !important; text-align: center; }
.edda-www-intro p { font-family: var(--edda-sans); font-size: clamp(19px, 1.9vw, 24px); line-height: 1.4; color: #4F3819; text-align: center; max-width: 700px; margin: 0 auto; }
.edda-tiles {
	list-style: none;
	margin: 0 !important;
	padding: 0 !important;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}
.edda-tiles li {
	background: #fff;
	border-radius: var(--edda-radius);
	min-height: 108px;
	padding: 20px 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-family: var(--edda-sans);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.55;
	color: var(--edda-royal);
	margin: 0 !important;
}
.edda-tiles li::before { display: none !important; }
.edda-tiles li { list-style: none !important; }
@media (max-width: 959px) { .edda-tiles { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 569px) { .edda-tiles { grid-template-columns: 1fr; } .edda-tiles li { min-height: 72px; } }

/* ==========================================================================
   6. Kente statement + testimonials
   ========================================================================== */
.edda-kente .background-wrapper::after,
.edda-quote-row .background-wrapper::after {
	content: '';
	position: absolute;
	inset: 0;
	/* Solid royal blue at top and bottom, fading to reveal the tinted cloth in the middle */
	background: linear-gradient(180deg,
		var(--edda-royal) 0%,
		rgba(32, 68, 156, 0) 30%,
		rgba(32, 68, 156, 0) 70%,
		var(--edda-royal) 100%);
	pointer-events: none;
	z-index: 2;
}
.edda-kente { min-height: 520px; }
.edda-quote-row { min-height: 520px; }
.edda-statement p {
	font-family: var(--edda-serif);
	font-size: clamp(26px, 3vw, 36px);
	line-height: 1.12;
	color: #fff;
	text-align: center;
	max-width: 1000px;
	margin: 0 auto;
}
.edda-testimonials { overflow: hidden; }
.edda-testimonials > .row-background .background-wrapper,
.edda-testimonials .row-background { background: linear-gradient(180deg, var(--edda-royal) 0%, #10287a 35%, var(--edda-midnight) 80%) !important; }
.edda-testimonials.style-color-eddami-bg { background: linear-gradient(180deg, var(--edda-royal) 0%, #10287a 35%, var(--edda-midnight) 80%) !important; }
.edda-testi-row { border-radius: var(--edda-radius); overflow: hidden; }
/* Photo column: locked to the design card ratio (391 x 504), image always covers, never stretches */
.edda-testi-photo .empty-space { height: auto !important; aspect-ratio: 391 / 504; }
.edda-testi-photo .background-inner { background-size: cover !important; background-position: center 20% !important; }
.edda-testi-photo > .uncol > .uncoltable > .uncell { padding: 0 !important; }
.edda-testi-copy > .uncol > .uncoltable > .uncell { padding: 40px !important; }
.edda-testi-copy .uncell { display: flex; }
.edda-testi-copy .uncont { display: flex; flex-direction: column; height: 100%; }
.edda-testi-copy .uncont > .uncode_text_column { display: flex; flex-direction: column; height: 100%; }
.edda-testi-copy .edda-testi-quote { font-family: var(--edda-serif); font-size: clamp(19px, 1.9vw, 24px); line-height: 1.33; color: #000 !important; margin: 0 0 32px; }
.edda-testi-copy .edda-testi-name { margin-top: auto; font-family: var(--edda-sans); font-size: 15px; font-weight: 600; color: #000 !important; margin-bottom: 8px; }
.edda-testi-copy .edda-testi-role { font-family: var(--edda-sans); font-size: 13px; line-height: 1.55; color: #000 !important; margin: 0; }
@media (max-width: 569px) {
	.edda-testi-copy > .uncol > .uncoltable > .uncell { padding: 28px 24px !important; }
}

/* Card corners: Uncode paints column backgrounds on .uncell */
.edda-card-cream > .uncol > .uncoltable > .uncell,
.edda-panel-saffron > .uncol > .uncoltable > .uncell,
.edda-contact-card > .uncol > .uncoltable > .uncell { border-radius: var(--edda-radius); }
.edda-contact-card > .uncol > .uncoltable > .uncell { border: 1px solid var(--edda-rule); }

/* Text colours that the dark/light skins would otherwise override */
.edda-about-body .edda-closing { display: block; color: var(--edda-cobalt) !important; font-weight: 600; }
.edda-www-title, .edda-www-title h2, .edda-www-title .heading-text { text-align: center !important; }

/* ==========================================================================
   7. Contact
   ========================================================================== */
.edda-contact-title h2 { color: #fff !important; font-size: clamp(36px, 4vw, 48px) !important; }
.edda-contact-sub p { font-family: var(--edda-sans); font-size: 18px; color: #C3CBDE; margin: 0; }
.edda-contact-links p { margin: 0; }
.edda-contact-links br { display: none; }
.edda-contact-box {
	display: block;
	border-radius: 10px;
	padding: 22px 28px 20px;
	margin-bottom: 16px;
	text-decoration: none !important;
	max-width: 317px;
	margin-left: auto;
}
.edda-contact-box:last-child { margin-bottom: 0; }
.edda-contact-box--white { background: #fff; }
.edda-contact-box--sky { background: var(--edda-sky); }
.edda-contact-box small {
	display: block;
	font-family: var(--edda-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #5370BD !important;
	margin-bottom: 2px;
}
.edda-contact-box--sky small { color: var(--edda-cobalt) !important; }
.edda-contact-box strong { display: block; font-family: var(--edda-sans); font-size: 19px; font-weight: 600; line-height: 1.3; color: var(--edda-cobalt) !important; overflow-wrap: anywhere; }
@media (max-width: 959px) { .edda-contact-box { margin-left: 0; } }

/* ==========================================================================
   8. Footer (Content Block)
   ========================================================================== */
.edda-footer { border-top: 1px solid #122248; }
.edda-footer-nav { display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: center; margin: 0 !important; padding: 0 !important; list-style: none; }
.edda-footer-nav li { margin: 0 !important; list-style: none !important; }
.edda-footer-nav li::before { display: none !important; }
.edda-footer-nav a { font-family: var(--edda-sans); font-size: 14px; font-weight: 500; color: #AAADB2 !important; text-decoration: none !important; }
.edda-footer-nav a:hover { color: #fff !important; }
.edda-copyright p { font-family: var(--edda-sans); font-size: 12px; color: #7A7F8B; margin: 0; text-align: right; }
.edda-footer-logo img { width: 70px; height: auto; }
@media (max-width: 959px) {
	.edda-copyright p, .edda-footer-logo { text-align: center; }
	.edda-footer-logo img { margin: 0 auto; }
}

/* ==========================================================================
   Header / menu
   ========================================================================== */
.menu-horizontal .menu-smart > li > a,
.menu-horizontal .menu-smart > li > a span { font-family: var(--edda-sans) !important; font-weight: 500 !important; font-size: 14px !important; letter-spacing: 0.01em; text-transform: uppercase; }

/* Refinements after first review */
@media (min-width: 960px) { .edda-copyright p { white-space: nowrap; } }
@media (max-width: 569px) {
	.edda-contact-box { padding: 18px 20px; }
	.edda-contact-box strong { font-size: 16px; overflow-wrap: normal; }
	.edda-hero-map img { max-width: 260px; margin: 0 auto; }
}

/* Sticky header: solid Midnight bar (set in Theme Options), no shadow */
#masthead .menu-container, #masthead.is_stuck .menu-container { box-shadow: none !important; }

/* ==========================================================================
   Edge-to-edge behaviour on narrower screens
   Below ~1230px the About and Who We Work With cards meet the screen edges,
   so their rounded corners are removed. On tablets and phones the gap
   under the About card is removed so the photo band follows straight on.
   ========================================================================== */
@media (max-width: 1230px) {
	.edda-card-cream > .uncol > .uncoltable > .uncell,
	.edda-panel-saffron > .uncol > .uncoltable > .uncell { border-radius: 0 !important; }
}
@media (max-width: 959px) {
	#about .row-parent { padding-bottom: 48px !important; }
}

/* ==========================================================================
   About section, layout A1 (29 Sep): headline + lead, saffron mission box
   with Angela's cutout rising from its bottom edge, approach + name below.
   ========================================================================== */
.edda-eyebrow p, .edda-a1-kicker {
	margin: 0;
	font-family: var(--edda-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	line-height: 1.3;
}
.edda-about-a1 .edda-eyebrow p { color: var(--edda-sky); margin-bottom: 8px; }
.edda-a1-title h2 { font-size: clamp(44px, 5vw, 64px) !important; line-height: 1 !important; color: #fff !important; }
.edda-a1-title em { font-style: italic; color: var(--edda-saffron); }
.edda-a1-lead p { margin: 0; font-family: var(--edda-sans); font-size: 20px; line-height: 1.5; color: #fff; }

.edda-a1-mission-row { margin-top: 120px !important; }
.edda-a1-mission > .uncol,
.edda-a1-mission > .uncol > .uncoltable,
.edda-a1-mission > .uncol > .uncoltable > .uncell { overflow: visible !important; }
.edda-a1-mission > .uncol > .uncoltable > .uncell {
	position: relative;
	min-height: 400px;
	box-sizing: border-box;
	padding: 56px 64px 48px !important;
	border-radius: var(--edda-radius);
}
.edda-a1-mission .uncont { position: static !important; }
.edda-a1-mission-text { max-width: 560px; position: relative; z-index: 1; }
.edda-a1-mission .edda-a1-kicker { color: var(--edda-midnight); }
.edda-a1-mission-statement { margin: 16px 0 0 !important; font-family: var(--edda-serif); font-size: clamp(34px, 3.6vw, 46px); line-height: 1.05; color: var(--edda-cobalt); }
.edda-a1-byline {
	margin: 48px 0 0 !important;
	padding-top: 18px;
	border-top: 1px solid rgba(3, 13, 42, 0.25);
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	column-gap: 16px;
	row-gap: 4px;
}
.edda-a1-name { font-family: var(--edda-serif); font-size: 26px; color: var(--edda-midnight); }
.edda-a1-role { font-family: var(--edda-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--edda-cobalt); }
.edda-a1-portrait { position: absolute !important; left: auto !important; right: 56px; bottom: 0; margin: 0 !important; width: 410px !important; z-index: 0; }
.edda-a1-portrait .single-wrapper { max-width: none !important; }
.edda-a1-portrait img { display: block; width: 100% !important; height: auto !important; max-width: none !important; }

.edda-a1-details { margin-top: 64px !important; }
.edda-a1-approach .edda-a1-kicker { color: var(--edda-sky); }
.edda-a1-approach-statement { margin: 14px 0 !important; font-family: var(--edda-serif); font-size: clamp(24px, 2.4vw, 30px); line-height: 1.15; color: #fff; }
.edda-a1-proverb { margin: 0 !important; font-family: var(--edda-sans); font-size: 16px; line-height: 1.55; color: var(--edda-pale); }
.edda-a1-proverb em { font-family: var(--edda-serif); font-size: 18px; font-style: italic; color: #fff; }
.edda-a1-name-story { border-top: 1px solid rgba(255, 255, 255, 0.22); padding-top: 18px; }
.edda-a1-name-story .edda-a1-kicker { font-size: 12px; color: var(--edda-pale); margin-bottom: 12px; }
.edda-a1-name-story p:not(.edda-a1-kicker) { margin: 0; font-family: var(--edda-sans); font-size: 15px; line-height: 1.55; color: var(--edda-pale); }

/* Laptop widths: smaller portrait so it never runs into the mission text */
@media (min-width: 960px) and (max-width: 1199px) {
	.edda-a1-mission-text { max-width: 46%; }
	.edda-a1-portrait { right: 40px; width: 341px !important; }
	.edda-a1-mission-row { margin-top: 96px !important; }
}
/* Tablet and phone: portrait drops into the box, below the text, still sitting on the box's bottom edge */
@media (max-width: 959px) {
	.edda-a1-mission-row { margin-top: 40px !important; }
	.edda-a1-mission > .uncol > .uncoltable > .uncell { min-height: 0; padding: 40px 32px 0 !important; }
	.edda-a1-mission-text { max-width: none; }
	.edda-a1-portrait { position: static !important; left: auto !important; margin: 32px auto 0 !important; width: 307px !important; max-width: 100%; }
	.edda-a1-details { margin-top: 40px !important; }
	.edda-a1-name-story { margin-top: 32px; }
}

/* ==========================================================================
   What we do, layout D3 (29 Sep): headline left, copy right, then one
   white panel split into three numbered columns.
   ========================================================================== */
.edda-wwd-head .edda-wwd-title h2 { font-size: clamp(38px, 4.2vw, 52px) !important; line-height: 1 !important; }
.edda-wwd-side .edda-wwd-lead p { color: #fff; font-size: clamp(19px, 1.7vw, 21px); line-height: 1.45; margin-bottom: 16px; }
.edda-wwd-side .edda-wwd-body p { font-size: 17px; }
@media (min-width: 960px) { .edda-wwd-side > .uncol > .uncoltable > .uncell > .uncont { padding-top: 72px; } }

.edda-wwd-panel {
	background: #fff;
	border-radius: var(--edda-radius);
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}
.edda-wwd-item {
	padding: 44px 40px 48px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.edda-wwd-item + .edda-wwd-item { border-left: 1px solid var(--edda-mist); }
.edda-wwd-item p { margin: 0 !important; }
.edda-wwd-num {
	font-family: var(--edda-sans);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.14em;
	line-height: 1;
	color: var(--edda-sky);
}
.edda-wwd-item h3 {
	font-family: var(--edda-serif) !important;
	font-weight: 400 !important;
	font-size: clamp(28px, 2.7vw, 34px) !important;
	line-height: 1.05 !important;
	letter-spacing: -0.01em;
	color: var(--edda-cobalt) !important;
	margin: 0 !important;
}
.edda-wwd-text { font-family: var(--edda-sans); font-size: 17px; line-height: 1.6; color: var(--edda-royal); }
@media (max-width: 959px) {
	.edda-wwd-panel { grid-template-columns: 1fr; }
	.edda-wwd-item { padding: 36px 32px 40px; }
	.edda-wwd-item + .edda-wwd-item { border-left: 0; border-top: 1px solid var(--edda-mist); }
}

/* ==========================================================================
   Who we work with, layout P4 (29 Sep): original saffron panel and tile
   grid, with the names set large in the serif.
   ========================================================================== */
.edda-www-title h2 { font-size: clamp(40px, 4.4vw, 56px) !important; line-height: 1 !important; }
.edda-www-intro p { font-size: clamp(19px, 1.8vw, 22px); }
.edda-tiles { gap: 12px; }
.edda-tiles li {
	min-height: 128px;
	padding: 24px 28px;
	font-family: var(--edda-serif) !important;
	font-weight: 400;
	font-size: clamp(22px, 2vw, 26px);
	line-height: 1.1;
	letter-spacing: -0.005em;
	color: var(--edda-cobalt);
}
.edda-tiles li:last-child { font-style: italic; }
@media (max-width: 569px) { .edda-tiles li { min-height: 88px; font-size: 22px; } }

/* ==========================================================================
   Footer, layout F1 (29 Sep): copyright left, links and a round
   back-to-top button right, held to the same width as the header.
   ========================================================================== */
.edda-footer { border-top: 0 !important; }
@media (min-width: 960px) { .edda-footer > .row { max-width: 1200px; margin-left: auto; margin-right: auto; } }
.edda-footer-bar {
	border-top: 1px solid #122248;
	padding-top: 48px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
}
.edda-footer-bar p { margin: 0 !important; }
.edda-footer-bar .edda-copyright { font-family: var(--edda-sans); font-size: 14px; color: #7A7F8B; white-space: nowrap; }
.edda-footer-right { display: flex; align-items: center; gap: 40px; }
.edda-footer-bar .edda-footer-nav { gap: 8px 28px; justify-content: flex-end; }
.edda-footer-bar .edda-footer-nav a { font-size: 15px; color: var(--edda-pale) !important; }
.edda-totop {
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	box-sizing: border-box;
	border-radius: 999px;
	border: 1px solid var(--edda-sky);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--edda-sky) !important;
	transition: background-color .2s, color .2s;
}
.edda-totop:hover { background: var(--edda-sky); color: var(--edda-midnight) !important; }
.edda-totop svg { width: 20px; height: 20px; display: block; }
@media (max-width: 1100px) and (min-width: 960px) { .edda-footer-right { gap: 28px; } .edda-footer-bar .edda-footer-nav { gap: 8px 20px; } }
@media (max-width: 959px) {
	.edda-footer-bar { flex-direction: column; gap: 28px; text-align: center; }
	.edda-footer-right { flex-direction: column; gap: 28px; order: -1; }
	.edda-footer-bar .edda-footer-nav { justify-content: center; }
	.edda-footer-bar .edda-copyright { white-space: normal; }
}

/* ==========================================================================
   Wayfinding labels, option W3 refined (29 Sep): large sentence-case
   saffron sans, regular weight, no pill, no dot.
   ========================================================================== */
.edda-pill,
.edda-pill--saffron,
.edda-about-a1 .edda-eyebrow p {
	display: inline-block;
	padding: 0 !important;
	border-radius: 0;
	background: none !important;
	font-family: var(--edda-sans) !important;
	font-size: clamp(28px, 3.2vw, 40px) !important;
	font-weight: 400 !important;
	letter-spacing: -0.005em !important;
	line-height: 1.05 !important;
	text-transform: none !important;
	color: var(--edda-saffron) !important;
	margin-bottom: 0 !important;
}

/* Breathing room between the photo band and the What we do header */
.edda-wwd-head > .row { padding-top: clamp(48px, 6vw, 88px) !important; }

/* ==========================================================================
   Client edits, 2 Oct
   ========================================================================== */

/* About: the long intro sentence now sits in the headline slot, so it is
   set smaller than the old short headline. Name story takes the lead slot. */
.edda-a1-title h2 { font-size: clamp(30px, 3.5vw, 44px) !important; line-height: 1.08 !important; }
.edda-a1-lead p { font-size: clamp(19px, 1.7vw, 21px); }

/* About: founder button inside the mission box */
.edda-a1-cta { margin: 28px 0 0 !important; }
.edda-founder-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 24px 15px;
	border-radius: 999px;
	background: var(--edda-cobalt);
	color: #fff !important;
	font-family: var(--edda-sans);
	font-size: 17px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none !important;
	transition: background-color .2s;
}
.edda-founder-btn:hover { background: var(--edda-midnight); color: #fff !important; }
.edda-a1-byline { margin-top: 40px !important; }

/* Shared larger body size: proverb, "That is the spirit", and both
   What we do intro paragraphs */
.edda-a1-spirit p,
.edda-wwd-side .edda-wwd-lead p,
.edda-wwd-side .edda-wwd-body p {
	font-family: var(--edda-sans);
	font-size: clamp(20px, 1.85vw, 23px) !important;
	line-height: 1.45;
}
.edda-a1-spirit p { margin: 0 0 18px !important; color: var(--edda-pale); }
.edda-a1-spirit p:last-child { margin-bottom: 0 !important; }
.edda-a1-spirit em { font-family: var(--edda-serif); font-size: 1.12em; font-style: italic; color: #fff; }
.edda-a1-approach-statement { margin-bottom: 0 !important; }

/* What we do: "Learn more" dropdowns */
.edda-wwd-more { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--edda-mist); }
.edda-wwd-more summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	cursor: pointer;
	list-style: none;
	font-family: var(--edda-sans);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--edda-cobalt);
}
.edda-wwd-more summary::-webkit-details-marker { display: none; }
.edda-wwd-more summary::after { content: '+'; font-size: 26px; font-weight: 400; line-height: 0.6; letter-spacing: 0; color: var(--edda-sky); }
.edda-wwd-more[open] summary::after { content: '\2212'; }
.edda-wwd-more summary:hover { color: var(--edda-midnight); }
.edda-wwd-more summary:focus-visible { outline: 2px solid var(--edda-sky); outline-offset: 4px; }
.edda-wwd-more p { margin: 14px 0 0 !important; font-family: var(--edda-sans); font-size: 16px; line-height: 1.6; color: var(--edda-royal); }
.edda-wwd-item { height: 100%; box-sizing: border-box; }

/* Contact: labels above the two address buttons */
.edda-contact-links p { letter-spacing: 0.12em; }

/* Mission box: keep the portrait rising above the box now the button is in */
@media (min-width: 960px) {
	.edda-a1-mission > .uncol > .uncoltable > .uncell { padding-top: 48px !important; padding-bottom: 44px !important; }
	.edda-a1-byline { margin-top: 28px !important; }
	.edda-a1-cta { margin-top: 22px !important; }
}

/* Testimonial arrows and dots */
#testimonials .uncode-owl-nav-wrap { margin-top: 28px; }
#testimonials .uncode-nav-counter { display: none; }

/* Keep the three "Learn more" rows level, and stop the other two moving
   when one is opened: number, heading, text and dropdown share grid rows. */
@supports (grid-template-rows: subgrid) {
	@media (min-width: 960px) {
		.edda-wwd-panel { grid-template-rows: repeat(4, auto); }
		.edda-wwd-item { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 16px; height: auto; }
		.edda-wwd-more { margin-top: 0; align-self: start; }
	}
}

/* Contact: space between the first address button and the second label */
#contact .btn-container + .edda-contact-links { margin-top: 28px !important; }

/* ==========================================================================
   About, backup variant A3 (2 Oct): same section as A1, but the portrait
   is held inside the saffron box instead of rising above it.
   Used on the backup page via the extra row class edda-about-a3.
   ========================================================================== */
@media (min-width: 960px) {
	.edda-about-a3 .edda-a1-mission-row { margin-top: 72px !important; }
	.edda-about-a3 .edda-a1-mission > .uncol > .uncoltable > .uncell {
		overflow: hidden !important;
		min-height: 460px;
		padding-top: 56px !important;
		padding-bottom: 48px !important;
	}
	.edda-about-a3 .edda-a1-portrait { right: 72px; width: 362px !important; }
}
@media (min-width: 960px) and (max-width: 1199px) {
	.edda-about-a3 .edda-a1-portrait { right: 40px; width: 320px !important; }
}

@media (max-width: 569px) {
	.edda-founder-btn { font-size: 15px; padding: 13px 18px 14px; gap: 8px; }
}

/* Kente section (2 Oct): colour cloth photo with a lighter blue tint.
   Uncode ignores the overlay alpha when a blend mode is set, so the
   strength of the tint is set here. */
.edda-kente .block-bg-overlay.not-ie { opacity: 0.65; }

/* ==========================================================================
   Backup page only (2 Oct): single-column text under the About and
   What we do headlines, at the headline column's width.
   ========================================================================== */
.edda-a1-details--stack .edda-a1-spirit { margin-top: 28px !important; }
.edda-wwd-stack .edda-wwd-lead p,
.edda-wwd-stack .edda-wwd-body p {
	font-family: var(--edda-sans);
	font-size: clamp(20px, 1.85vw, 23px) !important;
	line-height: 1.45;
	margin-bottom: 0;
}
.edda-wwd-stack .edda-wwd-lead p { color: #fff; }
.edda-wwd-stack .edda-wwd-body p { color: var(--edda-pale); }
.edda-wwd-stack .edda-wwd-lead { margin-top: 32px !important; }
.edda-wwd-stack .edda-wwd-body { margin-top: 18px !important; }

/* "Learn more" dropdowns: animated open and close (height is animated by
   js/edda.js; the text fades in here). */
.edda-wwd-more[open] > p { animation: edda-more-in .38s ease both; }
.edda-wwd-more.is-closing > p { animation: edda-more-out .25s ease both; }
.edda-wwd-more.is-closing summary::after { content: '+'; }
.edda-wwd-more summary::after { transition: transform .3s ease; }
@keyframes edda-more-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes edda-more-out { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .edda-wwd-more > p { animation: none !important; } }

/* Contact: the two address buttons, now without labels */
#contact .btn-container + .btn-container { margin-top: 16px !important; }

/* ==========================================================================
   Backup page only (2 Oct, second round): two-thirds text columns,
   smaller sky-blue name text, and "Our approach" set as a section header.
   ========================================================================== */
.edda-a1-intro--wide .edda-a1-lead p { font-size: clamp(16px, 1.4vw, 18px); line-height: 1.5; color: var(--edda-sky); }
.edda-a1-details--stack { margin-top: 88px !important; }
.edda-a1-details--stack .edda-a1-approach .edda-a1-kicker {
	font-family: var(--edda-sans);
	font-size: clamp(28px, 3.2vw, 40px);
	font-weight: 400;
	letter-spacing: -0.005em;
	line-height: 1.05;
	text-transform: none;
	color: var(--edda-saffron);
	margin: 0 0 36px !important;
}
.edda-a1-details--stack .edda-a1-approach-statement {
	margin: 0 !important;
	font-family: var(--edda-serif);
	font-size: clamp(30px, 3.5vw, 44px);
	line-height: 1.08;
	letter-spacing: -0.01em;
	color: #fff;
}
.edda-a1-details--stack .edda-a1-spirit { margin-top: 32px !important; }
@media (max-width: 959px) { .edda-a1-details--stack { margin-top: 56px !important; } .edda-a1-details--stack .edda-a1-approach .edda-a1-kicker { margin-bottom: 24px !important; } }

/* ==========================================================================
   2 Oct, third round
   ========================================================================== */

/* Body copy on the blue sections is plain white (no pale grey) */
.edda-a1-spirit p,
.edda-wwd-side .edda-wwd-body p,
.edda-wwd-stack .edda-wwd-body p,
.edda-contact-sub p { color: #fff !important; }

/* Contact line matches the shared body size */
.edda-contact-sub p { font-size: clamp(20px, 1.85vw, 23px); line-height: 1.45; }

/* Testimonials: every card takes the height of the tallest one.
   Uncode builds these rows as tables, so the chain is switched to flex. */
#testimonials .owl-stage { align-items: stretch !important; }
#testimonials .owl-stage-outer { height: auto !important; }
#testimonials .owl-item { display: flex; }
#testimonials .owl-item > .cs-container { display: flex; width: 100%; }
#testimonials .edda-testi-row { display: flex; width: 100%; }
#testimonials .edda-testi-row > .row { display: flex; width: 100%; height: auto !important; }
#testimonials .edda-testi-row .row-inner { display: flex; width: 100%; height: auto !important; }
#testimonials .edda-testi-row .row-inner > .wpb_column { display: flex; height: auto !important; }
#testimonials .edda-testi-row .row-inner > .wpb_column > .uncol { display: flex; flex: 1 1 auto; width: 100%; height: auto !important; }
#testimonials .edda-testi-row .row-inner > .wpb_column > .uncol > .uncoltable { display: flex; flex: 1 1 auto; width: 100%; height: auto !important; }
#testimonials .edda-testi-row .row-inner > .wpb_column > .uncol > .uncoltable > .uncell { flex: 1 1 auto; width: 100%; height: auto !important; box-sizing: border-box; }
.edda-testi-copy .uncont,
.edda-testi-copy .uncont > .uncode_text_column { height: auto !important; flex: 1 1 auto; width: 100%; }
@media (max-width: 639px) {
	#testimonials .edda-testi-row .row-inner { flex-direction: column; }
	#testimonials .edda-testi-row .row-inner > .edda-testi-copy { flex: 1 1 auto; }
}
/* Quote text a little smaller, so the longest quote fits the standard card */
.edda-testi-copy .edda-testi-quote { font-size: clamp(18px, 1.6vw, 20px); line-height: 1.35; }

/* ==========================================================================
   2 Oct, fourth round
   ========================================================================== */

/* Testimonials: space above the cards, so the menu link lands with the
   whole card clear of the sticky header (the theme scrolls to the row top). */
#testimonials > .row { padding-top: clamp(40px, 5vw, 64px) !important; }

/* Kente section: soft dark-blue glow behind the statement, plus a text
   shadow, so the white text holds up against the gold in the cloth. */
.edda-statement { position: relative; z-index: 0; isolation: isolate; }
.edda-statement::before {
	content: '';
	position: absolute;
	inset: -72px 0;
	z-index: -1;
	background: radial-gradient(ellipse closest-side,
		rgba(9, 24, 78, 0.38) 0%,
		rgba(9, 24, 78, 0.24) 55%,
		rgba(9, 24, 78, 0) 100%);
	pointer-events: none;
}
.edda-statement p {
	text-shadow:
		0 1px 2px rgba(3, 13, 42, 0.4),
		0 0 20px rgba(3, 13, 42, 0.35);
}

/* ==========================================================================
   2 Oct, fifth round
   ========================================================================== */

/* Contact card: keep it off the screen edges on tablets and phones */
@media (max-width: 959px) {
	#contact > .row { padding-left: 20px !important; padding-right: 20px !important; }
}

/* Testimonials on tablets (640 to 959px): photo and text side by side,
   as on desktop. Below 640px the photo stacks above the text. */
@media (min-width: 640px) and (max-width: 959px) {
	#testimonials .edda-testi-row .row-inner > .wpb_column { width: 50% !important; flex: 0 0 50% !important; max-width: 50%; float: none; }
	.edda-testi-copy > .uncol > .uncoltable > .uncell { padding: 28px !important; }
}

/* ==========================================================================
   Hero on tablets and landscape phones (570 to 959px): keep two columns,
   headline left and Africa mark right. Uncode would stack them here.
   ========================================================================== */
@media (min-width: 570px) and (max-width: 959px) {
	.edda-hero .row-inner { display: flex !important; align-items: center; width: 100%; height: auto !important; min-height: min(62vh, 620px); }
	.edda-hero .row-inner > .wpb_column { display: block; float: none; height: auto !important; }
	.edda-hero .row-inner > .wpb_column:first-child { flex: 0 0 58%; width: 58% !important; max-width: 58%; }
	.edda-hero .row-inner > .wpb_column:nth-child(2) { flex: 0 0 42%; width: 42% !important; max-width: 42%; }
	.edda-hero-title h1 { font-size: clamp(48px, 8.4vw, 80px) !important; }
	.edda-hero-map .single-wrapper { width: min(100%, 340px) !important; }
}
/* Portrait phones: columns stack; the Africa mark is 25% smaller and centred */
@media (max-width: 569px) {
	.edda-hero-map { text-align: center !important; }
	.edda-hero-map .single-wrapper { width: 75% !important; margin-left: auto; margin-right: auto; }
}