/* ==========================================================================
   ORTOTO.LT – DUK puslapis
   Vieta: assets/duk.css. Kraunamas tik /duk/ (žr. functions.php).
   Natyvus <details>/<summary> – be JS; Chrome randa tekstą ir uždarytame
   akordeone per Ctrl+F ir pats jį atidaro.
   ========================================================================== */

.oto-duk {
	max-width: 760px;
	margin-inline: auto;
	padding: var(--ortoto-space-8, 2rem) var(--ortoto-space-4, 1rem) var(--ortoto-space-12, 5rem);
}

.oto-duk h1 {
	margin: 0 0 var(--ortoto-space-6, 1.5rem);
}

/* ------------------------------------------------------------ Rodyklė ---- */

.oto-duk__rodykle {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ortoto-space-2, 0.5rem);
	margin: 0 0 var(--ortoto-space-10, 4rem);
	padding: 0;
	list-style: none;
}

.oto-duk__rodykle a {
	display: inline-block;
	padding: var(--ortoto-space-2, 0.5rem) var(--ortoto-space-4, 1rem);
	background-color: var(--ortoto-cream, #FFF8E7);
	border-radius: 999px;
	font-size: var(--ortoto-small, 0.9375rem);
	font-weight: 500;
	color: var(--ortoto-ink, #333);
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.oto-duk__rodykle a:hover {
	background-color: var(--ortoto-yellow, #F6B319);
}

/* ------------------------------------------------------------- Grupės ---- */

.oto-duk__grupe {
	margin-bottom: var(--ortoto-space-10, 4rem);
	scroll-margin-top: 6rem; /* inkaras nepalenda po lipniu header'iu */
}

.oto-duk__grupe h2 {
	margin: 0 0 var(--ortoto-space-4, 1rem);
}

/* --------------------------------------------------------- Akordeonas ---- */

.oto-duk details {
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.oto-duk summary {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--ortoto-space-4, 1rem);
	padding: var(--ortoto-space-4, 1rem) 0;
	font-weight: 700;
	cursor: pointer;
	list-style: none; /* nuimam standartinį trikampį */
}

.oto-duk summary::-webkit-details-marker { display: none; }

.oto-duk summary::after {
	content: "+";
	flex: 0 0 auto;
	font-size: 1.4rem;
	line-height: 1;
	font-weight: 400;
	color: var(--ortoto-ink-soft, #777);
	transition: transform 0.15s ease;
}

.oto-duk details[open] summary::after {
	content: "–";
}

.oto-duk summary:hover { color: var(--ortoto-teal, #4F9AAD); }

.oto-duk summary:focus-visible {
	outline: 2px solid var(--ortoto-ink, #333);
	outline-offset: 2px;
}

.oto-duk details > div {
	padding: 0 0 var(--ortoto-space-5, 1.25rem);
	max-width: 62ch;
}

.oto-duk details p { margin: 0 0 var(--ortoto-space-3, 0.75rem); }
.oto-duk details p:last-child { margin-bottom: 0; }

.oto-duk details a {
	color: var(--ortoto-teal, #4F9AAD);
	text-underline-offset: 3px;
}