/* ==========================================================================
   10 — Base
   ========================================================================== */

/* Twenty Twenty-Five pads the body inline, which boxes every full-bleed band
   at the shell width. Bands supply their own inner shell instead. */
body,
body.wp-site-blocks,
.wp-site-blocks {
	padding-inline: 0;
}

body {
	background-color: hsl( var( --jn-background ) );
	color: hsl( var( --jn-foreground ) );
	font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 1rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "Playfair Display", Georgia, "Times New Roman", serif;
	font-weight: 700;
	line-height: 1.1;
	color: hsl( var( --jn-foreground ) );
}

/* Trap 4 — WordPress puts margin-block-start on every flow sibling and on
   .wp-site-blocks children. Full-bleed bands supply their own rhythm. */
.wp-site-blocks > *,
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

.wp-site-blocks {
	display: flow-root;
}

/* Core's list rule stacks on top of a list's own gap. */
:root :where( .jn-footer .wp-block-list li ),
:root :where( .jn-sec .wp-block-list li ) {
	margin-top: 0;
}

/* --------------------------------------------------------------------------
   The shell — every band supplies its own inner, so bands can run full bleed.
   Written bare and .wp-site-blocks-prefixed, because block-generated
   containers are matched by two-class core rules.
   -------------------------------------------------------------------------- */

.jn-shell,
.wp-site-blocks .jn-shell {
	box-sizing: border-box;
	width: 100%;
	max-width: var( --jn-shell );
	margin-inline: auto;
	padding-inline: var( --jn-gutter );
}

/* Main content region: flow layout, never constrained. */
.jn-main,
.wp-site-blocks .jn-main {
	display: flow-root;
	margin-block: 0;
	max-width: none;
}

/* --------------------------------------------------------------------------
   Focus — cleared for pointer interaction, kept for keyboard.
   -------------------------------------------------------------------------- */

:where( a, button, input, select, textarea, summary ):focus:not( :focus-visible ) {
	outline: none;
}

:where( a, button, input, select, textarea, summary ):focus-visible {
	outline: 2px solid hsl( var( --jn-ring ) );
	outline-offset: 2px;
	border-radius: .25rem;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset( 50% );
	white-space: nowrap;
	border: 0;
}

img {
	max-width: 100%;
	height: auto;
}

/* Gold gradient text, as live's .gold-text. */
.jn-gold-text {
	background: var( --jn-gradient-gold );
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
