/*
 * SLED theme — layout helpers for the page sections. Plain on purpose:
 * black on white, one rule weight. Colour and type come later (Figma).
 *
 * Section classes (set on core/group blocks, Advanced → Additional CSS class):
 *   sled-hero     first section of a page (H1)
 *   sled-section  every following section, separated by a rule
 *   sled-inner    the wide column inside a section (spaces its children)
 *   sled-grid     children laid out in equal columns (wraps on small screens)
 *   sled-card     outlined box inside a grid
 *   sled-split    heading on the left, text on the right (wide screens)
 *   sled-rows     a list of sled-row items, each a split with a rule on top
 *   sled-note     a highlighted aside
 * Paragraph classes: sled-eyebrow (small label), sled-lead (intro text), sled-price.
 */

.sled-header {
	border-bottom: 1px solid currentColor;
	padding-block: var(--wp--preset--spacing--40);
}

.sled-footer {
	border-top: 1px solid currentColor;
	padding-block: var(--wp--preset--spacing--60);
	font-size: var(--wp--preset--font-size--small);
}

main.wp-block-group {
	margin-block-start: 0;
}

/* Sections */

.sled-hero {
	padding-block: var(--wp--preset--spacing--80) var(--wp--preset--spacing--70);
}

.sled-section {
	border-top: 1px solid currentColor;
	padding-block: var(--wp--preset--spacing--70);
}

.sled-inner > * + * {
	margin-block-start: var(--wp--preset--spacing--50);
}

.sled-hero p,
.sled-section p,
.sled-section li {
	max-width: 65ch;
}

.sled-eyebrow {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.sled-lead {
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.45;
}

.sled-hero .sled-lead {
	max-width: 40ch;
}

.sled-price {
	font-weight: 600;
}

/* Grids and cards */

.sled-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
	gap: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}

.sled-grid > * {
	margin-block: 0;
}

.sled-grid h2,
.sled-grid h3,
.sled-rows h2,
.sled-rows h3 {
	font-size: var(--wp--preset--font-size--large);
}

.sled-card {
	border: 1px solid currentColor;
	padding: var(--wp--preset--spacing--50);
}

.sled-card > * + * {
	margin-block-start: var(--wp--preset--spacing--40);
}

/* Split rows */

.sled-split,
.sled-row {
	display: grid;
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--60);
}

.sled-split > *,
.sled-row > * {
	margin-block: 0;
}

.sled-rows > .sled-row {
	border-top: 1px solid currentColor;
	padding-block: var(--wp--preset--spacing--50);
	margin-block: 0;
}

.sled-rows > .sled-row:last-child {
	border-bottom: 1px solid currentColor;
}

@media (min-width: 782px) {
	.sled-split,
	.sled-row {
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		align-items: start;
	}
}

/* Asides */

.sled-note {
	border-left: 3px solid currentColor;
	padding-left: var(--wp--preset--spacing--40);
}

/* Tables */

.wp-block-table table {
	border-collapse: collapse;
	width: 100%;
}

.wp-block-table th,
.wp-block-table td {
	border: 0;
	border-bottom: 1px solid currentColor;
	padding: 0.75em 1em 0.75em 0;
	text-align: left;
}

.wp-block-table thead {
	border-bottom: 2px solid currentColor;
}

/* Language switcher */

.sled-languages {
	display: flex;
	gap: 0.75em;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.sled-languages a {
	text-decoration: none;
}

.sled-languages a[aria-current="page"],
.sled-languages a:hover {
	text-decoration: underline;
}

/* Visible keyboard focus everywhere */

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.sled-footer .wp-block-navigation__container {
	gap: 0.5rem;
}
