/*
Theme Name: Spain.com.es
Theme URI: https://spain.com.es
Description: Child theme of Twenty Twenty-Five for spain.com.es — English-language advisory site on doing business, investing and holding assets in Spain. Register-and-ledger visual language: bone paper, azulejo cobalt, brass marks, Instrument Serif display over IBM Plex Sans.
Author: DF Abogados
Author URI: https://spain.com.es
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: spaincomes
*/

/* Hallmark · macrostructure: Register Index · genre: editorial · tone: institutional-austere
 * theme: custom "Azulejo Ledger" · paper #F5F5F1 (light) · display: classical-serif (Instrument Serif)
 * accent hue: cool (azulejo cobalt ~250°) · secondary mark: brass ~70° · enrichment: none (typography only)
 * nav: masthead · footer: colophon (LSSI identification block)
 * pre-emit critique: P5 H5 E4 S5 R5 V4
 */

/* ------------------------------------------------------------------
   1 · Base
------------------------------------------------------------------ */

html,
body {
	overflow-x: clip;
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* Display headings must not blow out the viewport on narrow screens. */
h1,
h2,
h3,
.wp-block-post-title {
	overflow-wrap: anywhere;
	min-width: 0;
	text-wrap: balance;
}

p,
li {
	overflow-wrap: break-word;
}

/* Running text stays near a comfortable measure even inside wide groups. */
.sc-measure > p,
.sc-measure > ul,
.sc-measure > ol {
	max-width: 38rem;
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
	border-radius: 1px;
}

::selection {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--paper-2);
}

/* ------------------------------------------------------------------
   2 · Utility marks
------------------------------------------------------------------ */

.sc-eyebrow {
	font-family: var(--wp--preset--font-family--utility);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}

.sc-lede {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.45;
	color: var(--wp--preset--color--muted);
	max-width: 34rem;
}

.sc-meta {
	font-family: var(--wp--preset--font-family--utility);
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--muted);
	font-variant-numeric: tabular-nums;
}

/* A drawn rule, not a border-top on a card. */
.sc-rule {
	border: 0;
	border-top: 1px solid var(--wp--preset--color--line);
	margin: 0;
	height: 0;
	opacity: 1;
}

.sc-rule--brass {
	border-top-color: var(--wp--preset--color--accent-2);
}

/* ------------------------------------------------------------------
   3 · Masthead
------------------------------------------------------------------ */

.sc-masthead {
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.sc-masthead .wp-block-navigation {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--sm);
}

.sc-masthead .wp-block-navigation a {
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	padding-block: 0.25rem;
	border-bottom: 1px solid transparent;
	white-space: nowrap;
}

.sc-masthead .wp-block-navigation a:hover {
	border-bottom-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--accent);
}

.sc-masthead .wp-block-site-title a {
	text-decoration: none;
	color: var(--wp--preset--color--ink);
}

/* ------------------------------------------------------------------
   4 · The Register — the three practice doors as an index, not cards
------------------------------------------------------------------ */

.sc-register {
	border-top: 1px solid var(--wp--preset--color--ink);
}

.sc-register__row {
	display: grid;
	grid-template-columns: minmax(0, 13rem) minmax(0, 1fr) auto;
	gap: 0.35rem 2.5rem;
	align-items: baseline;
	padding-block: 1.75rem;
	border-bottom: 1px solid var(--wp--preset--color--line);
	text-decoration: none;
	color: inherit;
	transition: background-color 160ms cubic-bezier(0.2, 0, 0, 1);
}

.sc-register__row:hover,
.sc-register__row:focus-visible {
	background-color: var(--wp--preset--color--paper-3);
}

.sc-register__name {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--xl);
	line-height: 1.1;
	letter-spacing: -0.015em;
	color: var(--wp--preset--color--ink);
}

.sc-register__row:hover .sc-register__name {
	color: var(--wp--preset--color--accent);
}

.sc-register__desc {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.5;
	margin: 0;
}

.sc-register__mark {
	font-family: var(--wp--preset--font-family--utility);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--accent-2);
	white-space: nowrap;
}

@media (max-width: 781px) {
	.sc-register__row {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 0.4rem 1rem;
		padding-block: 1.35rem;
	}

	.sc-register__desc {
		grid-column: 1 / -1;
	}
}

/* ------------------------------------------------------------------
   5 · Sequence — how an operation runs. Hairlines, no numbered circles.
------------------------------------------------------------------ */

.sc-sequence {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr));
	gap: 0;
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.sc-sequence > * {
	padding: 1.5rem 1.5rem 1.5rem 0;
	min-width: 0;
}

.sc-sequence > * + * {
	border-left: 1px solid var(--wp--preset--color--line);
	padding-left: 1.5rem;
}

.sc-sequence h4 {
	margin: 0 0 0.35rem;
	font-size: var(--wp--preset--font-size--md);
}

.sc-sequence p {
	margin: 0;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--muted);
	line-height: 1.5;
}

@media (max-width: 781px) {
	.sc-sequence > * + * {
		border-left: 0;
		border-top: 1px solid var(--wp--preset--color--line);
		padding-left: 0;
	}

	.sc-sequence > * {
		padding-right: 0;
	}
}

/* ------------------------------------------------------------------
   6 · Inverted band — the qualification section
------------------------------------------------------------------ */

.sc-band {
	background: var(--wp--preset--color--ink-deep);
	color: var(--wp--preset--color--paper);
}

.sc-band :where(h1, h2, h3, h4) {
	color: var(--wp--preset--color--paper);
}

.sc-band .sc-eyebrow,
.sc-band .sc-lede,
.sc-band .sc-meta {
	color: #9AA5AE;
}

.sc-band a:not(.wp-element-button) {
	color: var(--wp--preset--color--paper);
	text-decoration-color: var(--wp--preset--color--accent-2);
	text-underline-offset: 3px;
}

.sc-band .wp-element-button,
.sc-band .wp-block-button__link {
	background-color: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink-deep);
	border-color: var(--wp--preset--color--paper);
}

.sc-band .wp-element-button:hover,
.sc-band .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--accent-2);
	border-color: var(--wp--preset--color--accent-2);
	color: var(--wp--preset--color--ink-deep);
}

.sc-band :where(a, button, input, select, textarea):focus-visible {
	outline-color: var(--wp--preset--color--accent-2);
}

/* ------------------------------------------------------------------
   7 · Forms
------------------------------------------------------------------ */

.sc-form label,
.sc-form .wpforms-field-label,
.sc-form legend {
	display: block;
	font-family: var(--wp--preset--font-family--utility);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin-bottom: 0.4rem;
}

.sc-form input[type="text"],
.sc-form input[type="email"],
.sc-form input[type="tel"],
.sc-form input[type="url"],
.sc-form select,
.sc-form textarea {
	width: 100%;
	max-width: 100%;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--md);
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--paper-2);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 2px;
	padding: 0.75rem 0.9rem;
}

.sc-form input:focus,
.sc-form select:focus,
.sc-form textarea:focus {
	border-color: var(--wp--preset--color--accent);
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 1px;
}

.sc-form input[aria-invalid="true"],
.sc-form select[aria-invalid="true"],
.sc-form textarea[aria-invalid="true"] {
	border-color: #8C2434;
}

.sc-form [disabled] {
	opacity: 0.55;
	cursor: not-allowed;
}

.sc-band .sc-form input,
.sc-band .sc-form select,
.sc-band .sc-form textarea {
	background: #141B20;
	border-color: #2A343B;
	color: var(--wp--preset--color--paper);
}

/* ------------------------------------------------------------------
   8 · Field notes — the article index
------------------------------------------------------------------ */

.sc-notes .wp-block-post {
	border-bottom: 1px solid var(--wp--preset--color--line);
	padding-block: 1.25rem;
}

.sc-notes .wp-block-post-title {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.2;
	margin: 0.15rem 0 0.3rem;
}

.sc-notes .wp-block-post-title a {
	text-decoration: none;
	color: var(--wp--preset--color--ink);
}

.sc-notes .wp-block-post-title a:hover {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.sc-notes .wp-block-post-date {
	font-family: var(--wp--preset--font-family--utility);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}

/* ------------------------------------------------------------------
   9 · Colophon — the LSSI identification block lives here
------------------------------------------------------------------ */

.sc-colophon {
	border-top: 2px solid var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--sm);
}

.sc-colophon .sc-identity {
	font-family: var(--wp--preset--font-family--utility);
	font-size: var(--wp--preset--font-size--xs);
	line-height: 1.7;
	color: var(--wp--preset--color--muted);
}

.sc-colophon a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--line);
	white-space: nowrap;
}

.sc-colophon a:hover {
	border-bottom-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--accent);
}

/* ------------------------------------------------------------------
   10 · Long-form article body
------------------------------------------------------------------ */

.sc-article :where(h2) {
	margin-top: 2.75rem;
}

.sc-article :where(h3, h4) {
	margin-top: 2rem;
}

.sc-article :where(p, ul, ol) {
	max-width: 38rem;
}

.sc-article .sc-callout {
	border-left: 2px solid var(--wp--preset--color--accent-2);
	padding: 0.25rem 0 0.25rem 1.25rem;
	margin-block: 1.75rem;
	color: var(--wp--preset--color--muted);
}

.sc-article table {
	width: 100%;
	border-collapse: collapse;
	font-variant-numeric: tabular-nums;
}

.sc-article :where(figure.wp-block-table) {
	overflow-x: auto;
}

.sc-article th {
	font-family: var(--wp--preset--font-family--utility);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
	font-weight: 500;
	text-align: left;
}

.sc-article :where(th, td) {
	border-bottom: 1px solid var(--wp--preset--color--line);
	padding: 0.7rem 0.9rem 0.7rem 0;
	vertical-align: top;
}

/* Legal small print, used on the legal pages and under forms. */
.sc-fineprint {
	font-size: var(--wp--preset--font-size--xs);
	line-height: 1.6;
	color: var(--wp--preset--color--muted);
	max-width: 40rem;
}

/* ------------------------------------------------------------------
   11 · Motion
------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}