/**
 * Drive Ethiopia — Destinations
 * NO new design tokens: every colour below is an alias of an existing theme
 * token (Blocksy palette / Elementor global). Headings reuse Poppins, the
 * site's existing heading font.
 */

.dd-wrap {
	/* Token aliases — values come ONLY from existing theme tokens (no new hex).
	   Primary = Blocksy theme palette (loaded site-wide by the active theme);
	   fallback = the equivalent Elementor global, which is the same palette. */
	--dd-accent:   var(--theme-palette-color-1, var(--e-global-color-blocksy_palette_1));
	--dd-accent-2: var(--theme-palette-color-2, var(--e-global-color-blocksy_palette_2));
	--dd-text:     var(--theme-palette-color-3, var(--e-global-color-blocksy_palette_3));
	--dd-heading:  var(--theme-palette-color-4, var(--e-global-color-blocksy_palette_4));
	--dd-border:   var(--theme-palette-color-5, var(--e-global-color-blocksy_palette_5));
	--dd-soft:     var(--theme-palette-color-6, var(--e-global-color-blocksy_palette_6));
	--dd-white:    var(--theme-palette-color-7, var(--e-global-color-blocksy_palette_7));
	--dd-head-font: "Poppins", var(--theme-font-family, sans-serif);

	color: var(--dd-text);
	font-size: var(--theme-font-size, 16px);
	line-height: var(--theme-line-height, 1.65);
}

.dd-container {
	max-width: var(--theme-normal-container-max-width, 1290px);
	margin-inline: auto;
	padding-inline: 1.25rem;
	width: 100%;
}

/* ---------- Hero ---------- */
.dd-hero {
	position: relative;
	padding-top: 160px;   /* clears the transparent site header */
	padding-bottom: 3rem;
	background: var(--dd-soft);
	overflow: hidden;
}
.dd-hero--image { color: var(--dd-white); }
.dd-hero__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}
.dd-hero__overlay {
	position: absolute;
	inset: 0;
	z-index: 0;
	background: linear-gradient(180deg, rgba(17,21,24,.35), rgba(17,21,24,.72));
}
.dd-hero--soft { padding-top: 150px; padding-bottom: 2rem; }
.dd-hero--soft .dd-hero__overlay { display: none; }
.dd-hero__inner { position: relative; z-index: 1; }
.dd-hero__title {
	font-family: var(--dd-head-font);
	font-weight: 800;
	line-height: 1.1;
	margin: .5rem 0 0;
	font-size: clamp(2rem, 4.5vw, 3.25rem);
	color: var(--dd-white);
}
.dd-hero__title--dark { color: var(--dd-heading); }
.dd-hero__hook {
	margin: .75rem 0 0;
	font-size: clamp(1.05rem, 2vw, 1.35rem);
	max-width: 46rem;
	color: var(--dd-white);
}

/* ---------- Region tag ---------- */
.dd-region-tag {
	display: inline-block;
	font-family: var(--dd-head-font);
	font-weight: 600;
	font-size: .75rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--dd-white);
	background: var(--dd-accent);
	padding: .3rem .7rem;
}

/* ---------- Breadcrumb ---------- */
.dd-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: .85rem;
}
.dd-breadcrumb li + li::before { content: "›"; margin-right: .35rem; opacity: .6; }
.dd-breadcrumb a { color: inherit; text-decoration: none; opacity: .9; }
.dd-breadcrumb a:hover { color: var(--dd-accent); opacity: 1; }
.dd-breadcrumb [aria-current="page"] { opacity: .8; }

/* ---------- Layout (content + sticky TOC) ---------- */
.dd-layout {
	display: grid;
	grid-template-columns: 1fr 280px;
	gap: 2.5rem;
	padding-top: 2.5rem;
	padding-bottom: 3rem;
	align-items: start;
}
.dd-content { min-width: 0; }

/* ---------- TOC ---------- */
.dd-toc { order: 2; }
.dd-toc__box {
	position: sticky;
	top: 110px;
	border: 1px solid var(--dd-border);
	background: var(--dd-white);
	padding: 1rem 1.1rem;
}
.dd-toc__title {
	font-family: var(--dd-head-font);
	font-weight: 700;
	color: var(--dd-heading);
	cursor: pointer;
	margin-bottom: .5rem;
}
.dd-toc nav ol { list-style: none; margin: 0; padding: 0; counter-reset: toc; }
.dd-toc nav li { counter-increment: toc; margin: 0; }
.dd-toc nav a {
	display: block;
	padding: .3rem 0;
	font-size: .9rem;
	color: var(--dd-text);
	text-decoration: none;
	border-bottom: 1px solid var(--dd-border);
}
.dd-toc nav li:last-child a { border-bottom: 0; }
.dd-toc nav a::before { content: counter(toc) ". "; color: var(--dd-accent); font-weight: 600; }
.dd-toc nav a:hover,
.dd-toc nav a.is-active { color: var(--dd-accent); }

/* ---------- Sections ---------- */
.dd-section { scroll-margin-top: 120px; padding-bottom: 2.25rem; margin-bottom: 2.25rem; border-bottom: 1px solid var(--dd-border); }
.dd-section:last-of-type { border-bottom: 0; }
.dd-section__title {
	font-family: var(--dd-head-font);
	font-weight: 700;
	color: var(--dd-heading);
	line-height: 1.2;
	font-size: clamp(1.4rem, 2.6vw, 1.9rem);
	margin: 0 0 1rem;
}
.dd-prose { font-size: 1.02rem; }
.dd-prose p { margin: 0 0 1.1rem; }
.dd-prose h3 { font-family: var(--dd-head-font); font-weight: 600; color: var(--dd-heading); font-size: 1.2rem; margin: 1.6rem 0 .6rem; }
.dd-prose ul, .dd-prose ol { margin: 0 0 1.1rem 1.25rem; }
.dd-prose li { margin: .3rem 0; }
.dd-prose a { color: var(--dd-accent); text-decoration: underline; }
.dd-prose a:hover { color: var(--dd-accent-2); }

/* Featured-snippet definition paragraph */
.dd-definition {
	font-size: 1.12rem;
	line-height: 1.6;
	color: var(--dd-heading);
	background: var(--dd-soft);
	border-left: 4px solid var(--dd-accent);
	padding: 1rem 1.25rem;
	margin: 0 0 1.25rem;
}

/* ---------- Tables ---------- */
.dd-table-wrap { overflow-x: auto; margin: 0 0 1.25rem; }
.dd-table { width: 100%; border-collapse: collapse; font-size: .98rem; }
.dd-table th, .dd-table td { text-align: left; padding: .7rem .85rem; border: 1px solid var(--dd-border); vertical-align: top; }
.dd-table thead th { background: var(--dd-soft); font-family: var(--dd-head-font); font-weight: 600; color: var(--dd-heading); }
.dd-table .dd-todo { color: var(--dd-accent); font-style: italic; }

/* ---------- FAQ ---------- */
.dd-faq { border: 1px solid var(--dd-border); }
.dd-faq__item { border-bottom: 1px solid var(--dd-border); }
.dd-faq__item:last-child { border-bottom: 0; }
.dd-faq__q {
	cursor: pointer;
	list-style: none;
	padding: 1rem 2.5rem 1rem 1.1rem;
	position: relative;
	font-family: var(--dd-head-font);
	font-weight: 600;
	color: var(--dd-heading);
}
.dd-faq__q::-webkit-details-marker { display: none; }
.dd-faq__q::after { content: "+"; position: absolute; right: 1.1rem; top: 50%; transform: translateY(-50%); font-size: 1.4rem; color: var(--dd-accent); }
.dd-faq__item[open] .dd-faq__q::after { content: "–"; }
.dd-faq__a { padding: 0 1.1rem 1rem; }
.dd-faq__a p { margin: 0 0 .8rem; }

/* ---------- Related (inline list + cards) ---------- */
.dd-related-inline { list-style: none; margin: .5rem 0 0; padding: 0; }
.dd-related-inline li { padding: .4rem 0; border-bottom: 1px solid var(--dd-border); }
.dd-related-inline a { color: var(--dd-accent); font-weight: 600; text-decoration: none; }
.dd-related-inline a:hover { color: var(--dd-accent-2); }

.dd-related { background: var(--dd-soft); padding: 3rem 0; margin-top: 1rem; }
.dd-related__title { font-family: var(--dd-head-font); font-weight: 700; color: var(--dd-heading); margin: 0 0 1.5rem; font-size: 1.6rem; }

.dd-backlink { margin-top: 2rem; }
.dd-backlink a { color: var(--dd-accent); font-weight: 600; text-decoration: none; }
.dd-backlink a:hover { color: var(--dd-accent-2); }

/* ---------- Cards / grid ---------- */
.dd-grid { display: grid; gap: 1.5rem; }
.dd-grid--archive { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.dd-grid--related { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.dd-grid__item { min-width: 0; }

.dd-card { display: flex; flex-direction: column; background: var(--dd-white); border: 1px solid var(--dd-border); height: 100%; }
.dd-card__media { position: relative; display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--dd-soft); }
.dd-card__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.dd-card:hover .dd-card__img { transform: scale(1.05); }
.dd-card__region { position: absolute; left: 0; bottom: 0; background: var(--dd-accent); color: var(--dd-white); font-family: var(--dd-head-font); font-weight: 600; font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; padding: .28rem .6rem; }
.dd-card__body { padding: 1.1rem 1.15rem 1.3rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.dd-card__title { font-family: var(--dd-head-font); font-weight: 700; font-size: 1.2rem; margin: 0; line-height: 1.25; }
.dd-card__title a { color: var(--dd-heading); text-decoration: none; }
.dd-card__title a:hover { color: var(--dd-accent); }
.dd-card__hook { margin: 0; font-size: .95rem; color: var(--dd-text); flex: 1; }
.dd-card__cta { font-family: var(--dd-head-font); font-weight: 600; font-size: .9rem; color: var(--dd-accent); text-decoration: none; margin-top: .25rem; }
.dd-card__cta:hover { color: var(--dd-accent-2); }

/* ---------- Filter ---------- */
.dd-filter { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.5rem 0 2rem; }
.dd-filter__btn {
	font-family: var(--dd-head-font);
	font-weight: 600;
	font-size: .85rem;
	padding: .5rem 1rem;
	background: var(--dd-white);
	color: var(--dd-heading);
	border: 1px solid var(--dd-border);
	cursor: pointer;
}
.dd-filter__btn:hover { border-color: var(--dd-accent); color: var(--dd-accent); }
.dd-filter__btn.is-active { background: var(--dd-accent); color: var(--dd-white); border-color: var(--dd-accent); }

.dd-archive__intro { max-width: 62rem; margin: 2rem 0 0; font-size: 1.05rem; }

/* ---------- Focus states (a11y) ---------- */
.dd-wrap a:focus-visible,
.dd-filter__btn:focus-visible,
.dd-faq__q:focus-visible,
.dd-toc__title:focus-visible {
	outline: 3px solid var(--dd-accent-2);
	outline-offset: 2px;
}

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
	.dd-layout { grid-template-columns: 1fr; gap: 1.5rem; }
	.dd-toc { order: -1; }
	.dd-toc__box { position: static; }
}
@media (max-width: 600px) {
	.dd-hero { padding-top: 110px; padding-bottom: 2rem; }
	.dd-hero--soft { padding-top: 100px; }
	.dd-grid--archive { grid-template-columns: 1fr; }
}


/* Justified body copy (added per request) */
.dd-definition,
.dd-prose,
.dd-prose p,
.dd-prose li,
.dd-archive__intro,
.dd-hero__hook,
.dd-faq__a,
.dd-faq__a p { text-align: justify; text-justify: inter-word; }


/* ===== Polish pass ===== */
/* Branded panel for destinations awaiting a photo (derived from existing tokens only) */
.dd-card__img--placeholder{position:relative;display:block;background:linear-gradient(135deg,color-mix(in srgb,var(--dd-accent) 10%,var(--dd-soft)),color-mix(in srgb,var(--dd-accent-2) 8%,var(--dd-soft)));}
.dd-card__img--placeholder::after{content:attr(data-initial);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--dd-head-font);font-weight:800;font-size:3.25rem;line-height:1;color:color-mix(in srgb,var(--dd-accent) 38%,transparent);}
/* TOC summary: custom chevron, tappable */
.dd-toc__title{position:relative;padding-right:1.5rem;list-style:none;}
.dd-toc__title::-webkit-details-marker{display:none;}
.dd-toc__title::after{content:"\25BE";position:absolute;right:0;top:50%;transform:translateY(-50%);color:var(--dd-accent);transition:transform .2s ease;}
.dd-toc__box[open] .dd-toc__title::after{transform:translateY(-50%) rotate(180deg);}
/* Keep card CTAs on a consistent baseline */
.dd-card__cta{margin-top:auto;}


/* ===== Round 2 ===== */
.dd-section{border-bottom:0;padding-bottom:0;margin-bottom:2.9rem;}
.dd-archive .dd-grid--archive{margin-bottom:4.5rem;}
.dd-archive .dd-container{padding-bottom:1rem;}
.dd-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}


/* ===== Round 3: tours-style landing ===== */
.dd-arc{--dd-body-font:"Raleway",var(--theme-font-family,sans-serif);}
.dd-arc-hero{position:relative;overflow:hidden;padding:190px 0 110px;}
.dd-arc-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.dd-arc-hero__scrim{position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,color-mix(in srgb,var(--dd-heading) 42%,transparent),color-mix(in srgb,var(--dd-heading) 66%,transparent));}
.dd-arc-hero__inner{position:relative;z-index:1;max-width:var(--theme-normal-container-max-width,1290px);margin-inline:auto;padding-inline:1.25rem;}
.dd-arc-title{font-family:var(--dd-head-font);font-weight:800;font-size:45px;line-height:54px;letter-spacing:-1.3px;margin:0;color:var(--dd-white);}
.dd-rule{width:70px;height:0;border-top:5px solid var(--dd-accent);margin:24px 0 34px;}
.dd-rule--center{margin-left:auto;margin-right:auto;}
.dd-arc-hero__intro p{font-family:var(--dd-body-font);font-size:16px;line-height:1.4;color:var(--dd-white);text-align:justify;margin:0 0 24px;}
.dd-arc-hero__intro p:last-child{margin-bottom:0;}
.dd-arc-list{background:var(--dd-soft);padding:86px 0 96px;}
.dd-arc-list__head{max-width:1000px;margin:0 auto 44px;padding-inline:1.25rem;text-align:center;}
.dd-arc-list__title{font-family:var(--dd-head-font);font-weight:800;font-size:45px;line-height:54px;letter-spacing:-1.3px;color:var(--dd-heading);margin:0;}
.dd-arc-list__lede{font-size:16px;line-height:26.4px;color:var(--dd-text);text-align:justify;margin:0;}
.dd-tgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;max-width:var(--theme-normal-container-max-width,1290px);margin-inline:auto;padding-inline:1.25rem;}
.dd-tcard{display:flex;background:var(--dd-white);min-height:207px;}
.dd-tcard__media{flex:0 0 40%;position:relative;display:block;overflow:hidden;background:var(--dd-soft);}
.dd-tcard__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.dd-tcard:hover .dd-tcard__media img{transform:scale(1.05);}
.dd-tcard__ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--dd-head-font);font-weight:800;font-size:3rem;color:color-mix(in srgb,var(--dd-accent) 38%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--dd-accent) 10%,var(--dd-soft)),color-mix(in srgb,var(--dd-accent-2) 8%,var(--dd-soft)));}
.dd-tcard__body{flex:1;min-width:0;padding:26px 28px 28px;display:flex;flex-direction:column;gap:10px;}
.dd-tcard__region{font-family:var(--dd-head-font);font-weight:600;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dd-accent);}
.dd-tcard__title{font-family:var(--dd-body-font);font-weight:700;font-size:20px;line-height:1.3;color:var(--dd-heading);margin:0;}
.dd-tcard__title a{color:inherit;text-decoration:none;}
.dd-tcard__title a:hover{color:var(--dd-accent);}
.dd-tcard__text{font-size:16px;line-height:26.4px;color:var(--dd-text);text-align:justify;margin:0;flex:1;}
.dd-tcard__btn{align-self:flex-start;background:var(--dd-accent);color:var(--dd-white);font-size:17px;line-height:1;padding:12px 24px;text-decoration:none;}
.dd-tcard__btn:hover{background:var(--dd-accent-2);color:var(--dd-white);}
.dd-arc .dd-filter{justify-content:center;margin:0 auto 34px;max-width:var(--theme-normal-container-max-width,1290px);padding-inline:1.25rem;}
@media(max-width:1024px){.dd-tgrid{grid-template-columns:1fr;}}
@media(max-width:600px){.dd-arc-hero{padding:120px 0 64px;}.dd-arc-title,.dd-arc-list__title{font-size:31px;line-height:38px;letter-spacing:-.6px;}.dd-tcard{flex-direction:column;}.dd-tcard__media{flex:none;aspect-ratio:3/2;}.dd-arc-list{padding:56px 0 64px;}}