/*
Theme Name: SkyLodge Child
Theme URI: https://www.webin33.com/
Description: Theme enfant SkyLodge — direction artistique "Luxe silencieux" (inspire Aman).
Author: SkyLodge
Template: twentytwentyfour
Version: 2.0.4
Text Domain: skylodge-child
*/

/* ==========================================================================
   1. Design tokens — palette & rythme Aman
   ========================================================================== */
:root {
	--sl-font-heading: "Cormorant Garamond", "Times New Roman", serif;
	--sl-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

	--sl-color-anthracite: #2c2c2c;
	--sl-color-body: #5a5a5a;
	--sl-color-muted: #8a8a8a;
	--sl-color-background: rgba(244, 238, 215, 1); /* #f4eed7ff */
	--sl-color-greige: rgba(244, 238, 215, 1);
	--sl-color-white: #ffffff;
	--sl-color-border-dark: #2c2c2c;
	--sl-color-border-light: #ffffff;

	--sl-heading-tracking: 0.15em;
	--sl-button-tracking: 0.2em;

	--sl-band-height-min: 70vh;
	--sl-band-height-hero: 100vh;
	--sl-band-padding-text: 10% 5%;

	/* Neutralise les contraintes de largeur du theme parent */
	--wp--style--global--content-size: 100% !important;
	--wp--style--global--wide-size: 100% !important;
}

/* ==========================================================================
   2. Conteneur principal — pleine largeur, zero marge forcee
   ========================================================================== */
html,
body {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	background-color: rgba(244, 238, 215, 1);
}

.wp-site-blocks,
main {
	background-color: rgba(244, 238, 215, 1);
}

.wp-site-blocks,
main,
.entry-content,
.wp-block-post-content,
.is-layout-constrained,
.is-layout-flow,
.wp-block-group,
.wp-block-group__inner-container {
	max-width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.wp-site-blocks > * {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.has-global-padding,
.wp-block-group.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.alignwide,
.alignfull {
	max-width: 100% !important;
	width: 100% !important;
}

/* ==========================================================================
   3. Typographie — corps Inter, titres Cormorant "Aman"
   ========================================================================== */
body,
.wp-site-blocks {
	font-family: var(--sl-font-body);
	font-size: 1rem;
	font-weight: 300;
	color: var(--sl-color-body);
	line-height: 1.85;
	-webkit-font-smoothing: antialiased;
}

p,
li,
.wp-block-paragraph,
.wp-block-list,
.wp-block-navigation-item__content,
.wp-block-site-tagline,
.wp-block-post-excerpt,
figcaption,
label,
input,
textarea,
select {
	font-family: var(--sl-font-body);
	font-weight: 300;
	color: var(--sl-color-body);
}

/* Grands titres : Cormorant, majuscules, tracking radical */
h1,
h2,
h3,
.wp-block-heading:is(h1, h2, h3) {
	font-family: var(--sl-font-heading);
	font-weight: 400;
	font-style: normal;
	color: var(--sl-color-anthracite);
	text-transform: uppercase;
	letter-spacing: var(--sl-heading-tracking);
	line-height: 1.25;
	margin-top: 0;
	margin-bottom: 1.25rem;
}

h1,
.wp-block-heading:is(h1) {
	font-size: clamp(2rem, 4vw, 3.25rem);
	line-height: 1.2;
}

h2,
.wp-block-heading:is(h2) {
	font-size: clamp(1.5rem, 2.8vw, 2.25rem);
}

h3,
.wp-block-heading:is(h3) {
	font-size: clamp(1.15rem, 2vw, 1.65rem);
}

h4,
h5,
h6,
.wp-block-heading:is(h4, h5, h6) {
	font-family: var(--sl-font-body);
	font-weight: 400;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--sl-color-muted);
}

/* ==========================================================================
   4. Page d'accueil — bandeaux horizontaux immersifs
   ========================================================================== */
.home .wp-block-post-content {
	display: flex;
	flex-direction: column;
	gap: 0;
	width: 100%;
}

/* Chaque section majeure = un bandeau pleine largeur */
.home .wp-block-post-content > .wp-block-group,
.home .wp-block-post-content > .wp-block-cover,
.home .wp-block-post-content > .wp-block-columns,
.home .wp-block-post-content > .wp-block-media-text {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	border: none;
	box-sizing: border-box;
}

/* Bandeaux impairs : image / immersion (70vh–100vh) */
.home .wp-block-post-content > .wp-block-group:nth-child(odd),
.home .wp-block-post-content > .wp-block-cover:nth-child(odd),
.home .wp-block-post-content > .wp-block-columns:nth-child(odd),
.home .wp-block-post-content > .wp-block-media-text:nth-child(odd) {
	min-height: var(--sl-band-height-min);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
	overflow: hidden;
	background-color: #1a1a1a;
	background-size: cover;
	background-position: center center;
}

/* Premier bandeau = hero plein ecran */
.home .wp-block-post-content > :first-child {
	min-height: var(--sl-band-height-hero) !important;
}

/* Covers & media-text : remplissent le bandeau */
.home .wp-block-post-content > .wp-block-cover:nth-child(odd),
.home .wp-block-post-content > .wp-block-cover {
	min-height: inherit;
	padding: 0 !important;
}

.home .wp-block-post-content > .wp-block-cover .wp-block-cover__inner-container {
	min-height: inherit;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: var(--sl-band-padding-text);
}

.home .wp-block-post-content > .wp-block-media-text {
	min-height: var(--sl-band-height-min);
}

.home .wp-block-post-content > .wp-block-media-text .wp-block-media-text__media,
.home .wp-block-post-content > .wp-block-media-text .wp-block-media-text__content {
	min-height: var(--sl-band-height-min);
}

/* Bandeaux pairs : zones texte greige, vide genereux */
.home .wp-block-post-content > .wp-block-group:nth-child(even),
.home .wp-block-post-content > .wp-block-cover:nth-child(even),
.home .wp-block-post-content > .wp-block-columns:nth-child(even),
.home .wp-block-post-content > .wp-block-media-text:nth-child(even) {
	min-height: var(--sl-band-height-min);
	background-color: var(--sl-color-greige);
	padding: var(--sl-band-padding-text) !important;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
}

/* Texte dans les bandeaux : largeur controlee, beaucoup d'air */
.home .wp-block-post-content > .wp-block-group:nth-child(even) > .wp-block-group__inner-container,
.home .wp-block-post-content > .wp-block-group:nth-child(even) .wp-block-group__inner-container,
.home .wp-block-post-content > .wp-block-columns:nth-child(even) {
	max-width: 52rem;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.home .wp-block-post-content p {
	max-width: 38rem;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.75em;
	font-size: clamp(0.95rem, 1.1vw, 1.05rem);
	line-height: 2;
}

.home .wp-block-post-content .wp-block-heading {
	margin-bottom: 2rem;
}

/* Titres sur fond sombre (covers impairs) */
.home .wp-block-post-content > .wp-block-cover .wp-block-heading,
.home .wp-block-post-content > .wp-block-cover p,
.home .wp-block-post-content > .wp-block-group:nth-child(odd).has-background .wp-block-heading,
.home .wp-block-post-content > .wp-block-group:nth-child(odd).has-background p {
	color: var(--sl-color-white);
}

.home .wp-block-post-content > .wp-block-cover .wp-block-heading {
	color: var(--sl-color-white);
}

/* Colonnes internes : epure, sans bordures */
.home .wp-block-post-content .wp-block-columns {
	gap: clamp(2rem, 5vw, 4rem);
}

.home .wp-block-post-content .wp-block-column {
	padding: clamp(1.5rem, 3vw, 2.5rem);
}

/* Images plein cadre dans les bandeaux */
.home .wp-block-post-content .wp-block-image img,
.home .wp-block-post-content .wp-block-cover__image-background {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ==========================================================================
   5. Boutons — ultra-fins, transparents, uppercase espaces
   ========================================================================== */
.wp-block-button__link,
.wp-element-button,
button[type="submit"],
input[type="submit"],
.mphb-book-button,
a.button,
a.wp-block-button__link {
	display: inline-block;
	font-family: var(--sl-font-body) !important;
	font-size: 0.7rem !important;
	font-weight: 400 !important;
	line-height: 1.4 !important;
	text-transform: uppercase !important;
	letter-spacing: var(--sl-button-tracking) !important;
	text-decoration: none !important;
	color: var(--sl-color-anthracite) !important;
	background: transparent !important;
	background-color: transparent !important;
	border: 1px solid var(--sl-color-border-dark) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 1.1em 2.4em !important;
	transition: color 0.35s ease, background-color 0.35s ease, border-color 0.35s ease;
}

.wp-block-button__link:hover,
.wp-element-button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.mphb-book-button:hover,
a.button:hover {
	color: var(--sl-color-white) !important;
	background-color: var(--sl-color-anthracite) !important;
	border-color: var(--sl-color-anthracite) !important;
}

/* Boutons sur fond sombre : bordure & texte blancs */
.home .wp-block-cover .wp-block-button__link,
.home .wp-block-post-content > .wp-block-group:nth-child(odd) .wp-block-button__link,
.has-background:not(.has-base-background-color) .wp-block-button__link {
	color: var(--sl-color-white) !important;
	border-color: var(--sl-color-border-light) !important;
}

.home .wp-block-cover .wp-block-button__link:hover,
.home .wp-block-post-content > .wp-block-group:nth-child(odd) .wp-block-button__link:hover {
	color: var(--sl-color-anthracite) !important;
	background-color: var(--sl-color-white) !important;
	border-color: var(--sl-color-white) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent !important;
}

/* ==========================================================================
   6. Header / footer — discrets, pleine largeur
   ========================================================================== */
header.wp-block-template-part,
header.wp-block-template-part > .wp-block-group,
header.wp-block-template-part .wp-block-group,
header.wp-block-template-part .wp-block-group__inner-container,
header .wp-block-navigation,
header .wp-block-site-title,
header .wp-block-site-logo,
header .wp-block-site-tagline,
.site-header,
#header,
header[class*="header"] {
	background-color: var(--sl-color-background) !important;
	background: var(--sl-color-background) !important;
}

/* Annule les fonds blancs imposes par le theme parent */
header.has-background,
header .has-background,
header .has-base-background-color,
header .has-base-2-background-color,
header .has-white-background-color {
	background-color: var(--sl-color-background) !important;
	background: var(--sl-color-background) !important;
}

header.wp-block-template-part,
footer.wp-block-template-part {
	max-width: 100% !important;
	padding-left: 5% !important;
	padding-right: 5% !important;
	border: none;
	box-shadow: none;
}

/* Logo / titre centres en haut de page */
header.wp-block-template-part,
header.wp-block-template-part > .wp-block-group,
header.wp-block-template-part .wp-block-group.is-layout-flex {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
}

header.wp-block-template-part .wp-block-group__inner-container {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	width: 100% !important;
	gap: 1.5rem;
	padding-top: clamp(1.5rem, 4vw, 2.5rem);
	padding-bottom: clamp(1rem, 3vw, 2rem);
}

/* Force le centrage meme si le theme parent aligne a gauche/droite */
header .is-content-justification-space-between,
header .is-content-justification-left,
header .is-content-justification-right {
	justify-content: center !important;
}

header .wp-block-site-logo,
header .wp-block-site-title {
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100% !important;
	max-width: 100% !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	text-align: center !important;
}

header .wp-block-site-logo {
	flex: 0 0 auto;
	order: -1;
}

header .wp-block-site-logo a,
header .wp-block-site-title a {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100%;
}

/* Logo plus grand — annule la largeur inline WordPress (souvent 48px) */
header .wp-block-site-logo img,
header .wp-block-site-logo img.custom-logo,
header .custom-logo-link img {
	display: block !important;
	margin-left: auto !important;
	margin-right: auto !important;
	width: clamp(200px, 32vw, 360px) !important;
	max-width: min(360px, 88vw) !important;
	height: auto !important;
	max-height: none !important;
	object-fit: contain;
}

header .wp-block-site-title {
	font-family: var(--sl-font-heading);
	font-size: clamp(1.5rem, 3vw, 2rem);
	text-transform: uppercase;
	letter-spacing: var(--sl-heading-tracking);
}

header .wp-block-navigation {
	width: 100%;
	justify-content: center;
}

header .wp-block-navigation .wp-block-navigation__container,
header .wp-block-navigation ul {
	justify-content: center;
	margin-left: auto;
	margin-right: auto;
}

header .wp-block-navigation-item__content {
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-weight: 400;
	color: var(--sl-color-anthracite);
}

/* ==========================================================================
   7. Utilitaires
   ========================================================================== */
.home .wp-block-post-content > * + * {
	margin-top: 0 !important;
}