/* ==========================================================================
   Page 404 : plein écran sur velours, en-tête posé dessus, grand « 404 »
   en filigrane doré, recherche et boutons aux couleurs du château.
   ========================================================================== */

.tl-page-404 {
position: relative;
isolation: isolate;
display: flex;
flex-direction: column;
justify-content: center;
min-height: 100vh;
margin: 0 !important;
padding: calc(var(--wp-admin--admin-bar--height, 0px) + var(--tl-entete-hauteur, 172px) + 2rem) 1.5rem 5rem !important;
overflow: hidden;
background: var(--wp--preset--color--velours);
color: var(--wp--preset--color--texte-clair);
text-align: center;
--tl-accent: var(--wp--preset--color--or);
}

/* Le grand « 404 » en filigrane. */
.tl-page-404::after {
content: "404";
position: absolute;
z-index: -1;
top: 50%;
left: 50%;
color: var(--wp--preset--color--or);
font-family: var(--wp--preset--font-family--dm-serif-display);
font-size: clamp(12rem, 32vw, 28rem);
line-height: 1;
opacity: 0.06;
pointer-events: none;
transform: translate(-50%, -45%);
}

.tl-page-404 > * {
margin-inline: auto !important;
}

.tl-page-404 h1 {
margin-top: 0.6rem !important;
color: var(--wp--preset--color--texte-clair);
font-size: clamp(2.2rem, 4.5vw, 3.6rem);
}

.tl-page-404 .is-style-accroche {
margin-top: 0.2rem !important;
}

.tl-page-404 p:not([class]) {
max-width: 34rem;
margin-top: 1.5rem !important;
color: var(--wp--preset--color--texte-doux);
line-height: 1.75;
}

/* La recherche */
.tl-recherche-404 {
width: 100%;
max-width: 30rem;
margin-top: 2rem !important;
}

.tl-recherche-404 .wp-block-search__inside-wrapper {
gap: 0;
padding: 0 !important;
border: 0 !important;
}

.tl-recherche-404 .wp-block-search__input {
padding: 0.8rem 1rem;
border: 1px solid rgba(238, 198, 104, 0.45) !important;
border-right: 0 !important;
border-radius: 0;
background: rgba(255, 255, 255, 0.04);
color: var(--wp--preset--color--texte-clair);
font-family: var(--wp--preset--font-family--mukta);
}

.tl-recherche-404 .wp-block-search__input::placeholder {
color: rgba(243, 235, 224, 0.5);
}

.tl-recherche-404 .wp-block-search__input:focus {
border-color: var(--wp--preset--color--or) !important;
outline: none;
}

.tl-recherche-404 .wp-block-search__button {
margin: 0;
padding: 0.8rem 1.3rem;
border: 1px solid var(--wp--preset--color--or);
border-radius: 0;
background: var(--wp--preset--color--or);
color: var(--wp--preset--color--noir-chaud);
font-family: var(--wp--preset--font-family--bodoni-moda);
font-style: italic;
letter-spacing: 0.06em;
text-transform: uppercase;
}

.tl-page-404 .wp-block-buttons {
margin-top: 2.25rem !important;
gap: 1.5rem 2rem;
}

/* Téléphone : boutons l'un sous l'autre. */
@media (max-width: 600px) {
.tl-page-404 .wp-block-buttons {
flex-direction: column;
align-items: center;
}
}


/* Le titre, centré comme le reste (le thème aligne les titres à gauche). */
.tl-page-404 h1 {
	text-align: center !important;
}


/* Tous les éléments au milieu de la page, sans dépendre des marges
   (une règle du thème imposait une marge à gauche aux titres). */
.tl-page-404 {
	align-items: center;
}

.tl-page-404 > :is(h1, p) {
	width: 100%;
	max-width: 720px;
	margin-inline: 0 !important;
}